Merge remote-tracking branch 'upstream/main' into task-list-component

CHANGELOG.md

@@ -26,6 +26,18 @@ You can now style buttons on dark backgrounds to have a white background colour
 
 This change was made in [pull request #3556: Add inverse button styles](https://github.com/alphagov/govuk-frontend/pull/3556).
 
+#### Added inverse modifier for breadcrumbs on dark backgrounds
+
+You can now style breadcrumbs on dark backgrounds to use white text, links and arrows by adding the `govuk-breadcrumbs--inverse` class.
+
+This change was made in [pull request #3774: Add inverse breadcrumb and back link modifiers and styles](https://github.com/alphagov/govuk-frontend/pull/3774).
+
+#### Added inverse modifier for back links on dark backgrounds
+
+You can now style back links on dark backgrounds to have a white link and arrow colour by adding the `govuk-back-link--inverse` class.
+
+This change was made in [pull request #3774: Add inverse breadcrumb and back link modifiers and styles](https://github.com/alphagov/govuk-frontend/pull/3774).
+
 #### New link styles are now enabled by default
 
 In GOV.UK Frontend v3.12.0 we introduced new link styles which:
@@ -208,6 +220,22 @@ If you’re not using Nunjucks macros, update your warning text HTML to replace
 
 This change was introduced in [pull request #3569: Remove unnecesary class from Warning Text component](https://github.com/alphagov/govuk-frontend/pull/3569).
 
+#### Check that selects work as expected
+
+The `govukSelect` macro will no longer include an empty value attribute for options that do not have a value set.
+
+This means that the value of the select if that option is selected will now be the text content of the option, rather than an empty string.
+
+If you need to maintain the existing behaviour, you can set the value to an empty string.
+
+This change was introduced in [pull request #3773: Omit the value attribute from select options with no value](https://github.com/alphagov/govuk-frontend/pull/3773).
+
+### Fixes
+
+We’ve made fixes to GOV.UK Frontend in the following pull requests:
+
+- [#3791: Refactor mobile menu button label/text handling](https://github.com/alphagov/govuk-frontend/pull/3791)
+
 ## 4.6.0 (Feature release)
 
 ### New features

docs/contributing/coding-standards/js.md

@@ -15,34 +15,36 @@ component
 ```mjs
 /**
  * Component name
- *
- * @class
- * @param {Element} $module - HTML element to use for component
  */
-function Example ($module) {
- if (!($module instanceof HTMLElement)) {
- return this
- }
+export class Example {
+ /**
+ * @param {Element} $module - HTML element to use for component
+ */
+ constructor ($module) {
+ $module = undefined
 
- this.$module = $module
+ if (!($module instanceof HTMLElement)) {
+ return this
+ }
 
- // Code goes here
-}
+ this.$module = $module
 
-/**
- * Initialise component
- */
-Example.prototype.init = function () {
- // Check that required elements are present
- if (!this.$module) {
- return
+ // Code goes here
  }
 
- // Code goes here
- const $module = this.$module
-}
+ /**
+ * Initialise component
+ */
+ init () {
+ // Check that required elements are present
+ if (!this.$module) {
+ return
+ }
 
-export default Example
+ // Code goes here
+ const $module = this.$module
+ }
+}
 ```
 
 ## Use data attributes to initialise component JavaScript
@@ -85,35 +87,37 @@ Use `// FIXME:` to annotate problems.
 
 Use `// TODO:` to annotate solutions to problems.
 
-## Constructors and methods
+## Classes and methods
 
-Use the prototype design pattern to structure your code.
+Use the class design pattern to structure your code.
 
-Create a constructor and define any variables that the object needs.
+Create a class and define the methods you need.
 
 ```mjs
-function Example ($module) {
+class Example {
  // Code goes here
 }
 ```
 
-Assign methods to the prototype object. Do not overwrite the prototype with a new object as this makes inheritance impossible.
+Add methods to the class.
 
 ```mjs
+// Good
+class Example {
+ init () {
+ // Code goes here
+ }
+}
+
 // Bad
 Example.prototype = {
  init: function () {
  // Code goes here
  }
 }
-
-// Good
-Example.prototype.init = function () {
- // Code goes here
-}
 ```
 
-When initialising an object, use the `new` keyword.
+When initialising a class, use the `new` keyword.
 
 ```mjs
 // Bad

docs/examples/webpack/package.json

@@ -10,17 +10,17 @@
  "govuk-frontend": "*"
  },
  "devDependencies": {
- "@babel/core": "^7.22.1",
- "@babel/preset-env": "^7.22.4",
+ "@babel/core": "^7.22.5",
+ "@babel/preset-env": "^7.22.5",
  "autoprefixer": "^10.4.14",
  "babel-loader": "^9.1.2",
  "copy-webpack-plugin": "^11.0.0",
- "postcss-loader": "^7.3.2",
+ "postcss-loader": "^7.3.3",
  "sass-embedded": "^1.62.0",
- "sass-loader": "^13.3.1",
+ "sass-loader": "^13.3.2",
  "terser-webpack-plugin": "^5.3.9",
- "webpack": "^5.85.1",
- "webpack-cli": "^5.1.3",
- "webpack-dev-server": "^4.15.0"
+ "webpack": "^5.86.0",
+ "webpack-cli": "^5.1.4",
+ "webpack-dev-server": "^4.15.1"
  }
 }