ErrorSummary

Default

Svelte code

<script>
	import { ErrorSummary } from '@danboscaro/govuk-svelte'
</script>

<ErrorSummary {...{
  titleText: "There is a problem",
  errorList: [
    {
      text: "The date your passport was issued must be in the past",
      href: "#example-error-1"
    },
    {
      text: "Enter a postcode, like AA1 1AA",
      href: "#example-error-2"
    }
  ]
}} />

Without links

Svelte code

<script>
	import { ErrorSummary } from '@danboscaro/govuk-svelte'
</script>

<ErrorSummary {...{
  titleText: "There is a problem",
  errorList: [
    {
      text: "Invalid username or password"
    }
  ]
}} />

Mixed with and without links

Svelte code

<script>
	import { ErrorSummary } from '@danboscaro/govuk-svelte'
</script>

<ErrorSummary {...{
  titleText: "There is a problem",
  errorList: [
    {
      text: "Invalid username or password"
    },
    {
      text: "Agree to the terms of service to log in",
      href: "#example-error-1"
    }
  ]
}} />

With everything

Svelte code

<script>
	import { ErrorSummary } from '@danboscaro/govuk-svelte'
</script>

<ErrorSummary {...{
  titleText: "There is a problem",
  descriptionText: "Please fix the errors below.",
  errorList: [
    {
      text: "Invalid username or password"
    },
    {
      text: "Agree to the terms of service to log in",
      href: "#example-error-1"
    }
  ]
}} />