Details

Default

Svelte code

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

<Details {...{
  summaryText: "Help with nationality",
  text: "We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post."
}} />

Expanded

Svelte code

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

<Details {...{
  id: "help-with-nationality",
  summaryText: "Help with nationality",
  text: "We need to know your nationality so we can work out which elections you’re entitled to vote in. If you can’t provide your nationality, you’ll have to send copies of identity documents through the post.",
  open: true
}} />

With html

Svelte code

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

<Details {...{
  summaryText: "Where to find your National Insurance Number",
  html: "Your National Insurance number can be found on\n<ul>\n  <li>your National Insurance card</li>\n  <li>your payslip</li>\n  <li>P60</li>\n  <li>benefits information</li>\n  <li>tax return</li>\n</ul>\n"
}} />