Update dependency govuk-frontend to v5.8.0

[renovate]

This PR contains the following updates:

Package	Change	Age	Adoption	Passing	Confidence
govuk-frontend (source)	5.6.0 -> 5.8.0

---

Release Notes

alphagov/govuk-frontend (govuk-frontend)

v5.8.0

Compare Source

To install this version with npm, run npm install [email protected]. You can also find more information about how to stay up to date in our documentation.

New features

Use our base configurable component to build your own configurable component

We've added a ConfigurableComponent class to help you build your own configurable components. It extends our Component class and allows you to focus on your components' specific features by handling these shared behaviours across components:

• checking that GOV.UK Frontend is supported
• checking that the component is not already initialised on its root element
• checking the type of the root element and storing it for access within the component as this.$root
• taking a configuration object as a parameter and then storing it for access within the component as this.config
• merging a passed configuration object with configuration options specified on the data attributes of the root element

We introduced this change in:

• #​5499: Rename GOVUKFrontendComponentConfigurable, export ConfigurableComponent
• #​5456: Refactor Accordion to extend from a GOVUKFrontendConfigurableComponent

Deprecated features

Importing Sass using govuk/all

You'll see a warning when compiling your Sass if you import all of GOV.UK Frontend's styling using govuk/all. Importing using the all file is deprecated, and we’ll remove it in the next major release.

In your import statements, use a trailing /index rather than /all to load GOV.UK Frontend's files:

• @import "govuk/index"; instead of @import "govuk/all";

You do not need /index at the end of each import path if you’re using Dart Sass.

This change was introduced in pull request #​5518: Deprecate govuk/all.scss and only reference govuk/index.scss internally.

Fixes

We've made fixes to GOV.UK Frontend in the following pull requests:

• #​5533: Fix UMD files overriding existing global

v5.7.1

Compare Source

To install this version with npm, run npm install [email protected]. You can also find more information about how to stay up to date in our documentation.

Recommended changes

Stop setting a value for File upload components

The File upload component currently supports a value parameter, which populates the value HTML attribute of the input.

However, since no modern browser supports passing a value to a file input, we've made the decision to remove this parameter. It has been deprecated and will be removed in a future version of GOV.UK Frontend.

We introduced this change in pull request #​5330: Deprecate File upload component's value parameter.

Fixes

We've made fixes to GOV.UK Frontend in the following pull requests:

• #​5396: Update various department brand colours

v5.7.0

Compare Source

To install this version with npm, run npm install [email protected]. You can also find more information about how to stay up to date in our documentation.

New features

The Royal Arms has been updated

The Royal Arms in the GOV.UK footer has been updated to reflect the version introduced by King Charles III.

If your service does not use the image directly from the Frontend package, you should ensure the new image is being copied to your service’s image assets folder. By default this folder is located at /assets/images.

If you’re using Nunjucks, the asset path may have been changed by the assetPath global variable or assetsPath parameter on the header component.

Copy the govuk-crest.svg file from /dist/assets/images into your assets folder.

You can safely delete the old image files, named govuk-crest.png and govuk-crest-2x.png.

We introduced this change in pull request #​5376: Update the Royal Arms graphic in footer (v5.x).

Components will not longer initialise twice on the same element

GOV.UK Frontend components now throw an error if they've already been initialised on the DOM Element they're receiving for initialisation.
This prevents components from being initialised more than once and therefore not working properly.

We introduced this change in pull request #​5272: Prevent multiple initialisations of a single component instance

Respond to initialisation errors when using createAll and initAll

We've added a new onError option for createAll and initAll that lets you respond to initialisation errors.
The functions will continue catching errors and initialising components further down the page if one component fails to initialise,
but this option will let you react to a component failing to initialise. For example, to allow reporting to an error monitoring service.

We introduced this change in:

• pull request #​5252: Add onError to createAll
• pull request #​5276: Add onError to initAll

Check if GOV.UK Frontend is supported

We've added the isSupported function to let you check if GOV.UK Frontend is supported in the browser running your script.
GOV.UK Frontend components have been checking this automatically since the release of v5.0.0, but you may want to use the isSupported function to avoid running some code when GOV.UK Frontend is not supported.

We introduced this change in pull request #​5250: Add isSupported to all.mjs

Use our base component to build your own components

We've added a Component class to help you build your own components. It allows you to focus on your components' specific features by handling these shared behaviours across components:

• checking that GOV.UK Frontend is supported
• checking that the component is not already initialised on its root element
• checking the type of the root element and storing it for access within the component as this.$root

We introduced this change in:

• pull request #​5350: Export a base Component class.
• pull request #​5354: Refactor the root type check in GOVUKFrontendComponent

New brand colour

We've added a brand colour for the Serious Fraud Office in pull request #​5389.

Fixes

We've made fixes to GOV.UK Frontend in the following pull requests:

• #​5278: Fix service navigation mobile toggle spacing
• #​5331: Fix Warning Text font weight when <strong> styles are reset
• #​5352: Only apply margin to details summary when open
• #​5089: Fix details expanded state not announced on iOS
• #​5332: Improve how licence description wraps in the footer

---

Configuration

📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.

♻ Rebasing: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.

🔕 Ignore: Close this PR and you won't be reminded about this update again.

---

• If you want to rebase/retry this PR, check this box

---

This PR was generated by Mend Renovate. View the repository job log.