govuk_tech_docs 5.2.1 → 6.0.0.beta

data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.bundle.mjs

@@ -35,9 +35,6 @@ function formatErrorMessage(Component, message) {
  * @typedef ComponentWithModuleName
  * @property {string} moduleName - Name of the component
  */
-/**
- * @import { ObjectNested } from './configuration.mjs'
- */
 
 class GOVUKFrontendError extends Error {
   constructor(...args) {
@@ -66,7 +63,7 @@ class ConfigError extends GOVUKFrontendError {
 class ElementError extends GOVUKFrontendError {
   constructor(messageOrOptions) {
     let message = typeof messageOrOptions === 'string' ? messageOrOptions : '';
-    if (typeof messageOrOptions === 'object') {
+    if (isObject(messageOrOptions)) {
       const {
         component,
         identifier,
@@ -75,7 +72,9 @@ class ElementError extends GOVUKFrontendError {
       } = messageOrOptions;
       message = identifier;
       message += element ? ` is not of type ${expectedType != null ? expectedType : 'HTMLElement'}` : ' not found';
-      message = formatErrorMessage(component, message);
+      if (component) {
+        message = formatErrorMessage(component, message);
+      }
     }
     super(message);
     this.name = 'ElementError';
@@ -309,6 +308,9 @@ function extractConfigByNamespace(schema, dataset, namespace) {
  * @template {Partial<Record<keyof ConfigurationType, unknown>>} [ConfigurationType=ObjectNested]
  * @typedef {typeof Component & ChildClass<ConfigurationType>} ChildClassConstructor<ConfigurationType>
  */
+/**
+ * @import { CompatibleClass, Config, CreateAllOptions, OnErrorCallback } from '../init.mjs'
+ */
 
 class I18n {
   constructor(translations = {}, config = {}) {
@@ -323,7 +325,7 @@ class I18n {
       throw new Error('i18n: lookup key missing');
     }
     let translation = this.translations[lookupKey];
-    if (typeof (options == null ? void 0 : options.count) === 'number' && typeof translation === 'object') {
+    if (typeof (options == null ? void 0 : options.count) === 'number' && isObject(translation)) {
       const translationPluralForm = translation[this.getPluralSuffix(lookupKey, options.count)];
       if (translationPluralForm) {
         translation = translationPluralForm;
@@ -365,8 +367,8 @@ class I18n {
       return 'other';
     }
     const translation = this.translations[lookupKey];
-    const preferredForm = this.hasIntlPluralRulesSupport() ? new Intl.PluralRules(this.locale).select(count) : this.selectPluralFormUsingFallbackRules(count);
-    if (typeof translation === 'object') {
+    const preferredForm = this.hasIntlPluralRulesSupport() ? new Intl.PluralRules(this.locale).select(count) : 'other';
+    if (isObject(translation)) {
       if (preferredForm in translation) {
         return preferredForm;
       } else if ('other' in translation) {
@@ -376,132 +378,7 @@ class I18n {
     }
     throw new Error(`i18n: Plural form ".other" is required for "${this.locale}" locale`);
   }
-  selectPluralFormUsingFallbackRules(count) {
-    count = Math.abs(Math.floor(count));
-    const ruleset = this.getPluralRulesForLocale();
-    if (ruleset) {
-      return I18n.pluralRules[ruleset](count);
-    }
-    return 'other';
-  }
-  getPluralRulesForLocale() {
-    const localeShort = this.locale.split('-')[0];
-    for (const pluralRule in I18n.pluralRulesMap) {
-      const languages = I18n.pluralRulesMap[pluralRule];
-      if (languages.includes(this.locale) || languages.includes(localeShort)) {
-        return pluralRule;
-      }
-    }
-  }
 }
-I18n.pluralRulesMap = {
-  arabic: ['ar'],
-  chinese: ['my', 'zh', 'id', 'ja', 'jv', 'ko', 'ms', 'th', 'vi'],
-  french: ['hy', 'bn', 'fr', 'gu', 'hi', 'fa', 'pa', 'zu'],
-  german: ['af', 'sq', 'az', 'eu', 'bg', 'ca', 'da', 'nl', 'en', 'et', 'fi', 'ka', 'de', 'el', 'hu', 'lb', 'no', 'so', 'sw', 'sv', 'ta', 'te', 'tr', 'ur'],
-  irish: ['ga'],
-  russian: ['ru', 'uk'],
-  scottish: ['gd'],
-  spanish: ['pt-PT', 'it', 'es'],
-  welsh: ['cy']
-};
-I18n.pluralRules = {
-  arabic(n) {
-    if (n === 0) {
-      return 'zero';
-    }
-    if (n === 1) {
-      return 'one';
-    }
-    if (n === 2) {
-      return 'two';
-    }
-    if (n % 100 >= 3 && n % 100 <= 10) {
-      return 'few';
-    }
-    if (n % 100 >= 11 && n % 100 <= 99) {
-      return 'many';
-    }
-    return 'other';
-  },
-  chinese() {
-    return 'other';
-  },
-  french(n) {
-    return n === 0 || n === 1 ? 'one' : 'other';
-  },
-  german(n) {
-    return n === 1 ? 'one' : 'other';
-  },
-  irish(n) {
-    if (n === 1) {
-      return 'one';
-    }
-    if (n === 2) {
-      return 'two';
-    }
-    if (n >= 3 && n <= 6) {
-      return 'few';
-    }
-    if (n >= 7 && n <= 10) {
-      return 'many';
-    }
-    return 'other';
-  },
-  russian(n) {
-    const lastTwo = n % 100;
-    const last = lastTwo % 10;
-    if (last === 1 && lastTwo !== 11) {
-      return 'one';
-    }
-    if (last >= 2 && last <= 4 && !(lastTwo >= 12 && lastTwo <= 14)) {
-      return 'few';
-    }
-    if (last === 0 || last >= 5 && last <= 9 || lastTwo >= 11 && lastTwo <= 14) {
-      return 'many';
-    }
-    return 'other';
-  },
-  scottish(n) {
-    if (n === 1 || n === 11) {
-      return 'one';
-    }
-    if (n === 2 || n === 12) {
-      return 'two';
-    }
-    if (n >= 3 && n <= 10 || n >= 13 && n <= 19) {
-      return 'few';
-    }
-    return 'other';
-  },
-  spanish(n) {
-    if (n === 1) {
-      return 'one';
-    }
-    if (n % 1000000 === 0 && n !== 0) {
-      return 'many';
-    }
-    return 'other';
-  },
-  welsh(n) {
-    if (n === 0) {
-      return 'zero';
-    }
-    if (n === 1) {
-      return 'one';
-    }
-    if (n === 2) {
-      return 'two';
-    }
-    if (n === 3) {
-      return 'few';
-    }
-    if (n === 6) {
-      return 'many';
-    }
-    return 'other';
-  }
-};
 
 /**
  * Character count component
@@ -536,6 +413,7 @@ class CharacterCount extends ConfigurableComponent {
     var _ref, _this$config$maxwords;
     super($root, config);
     this.$textarea = void 0;
+    this.count = 0;
     this.$visibleCountMessage = void 0;
     this.$screenReaderCountMessage = void 0;
     this.lastInputTimestamp = null;
@@ -571,7 +449,7 @@ class CharacterCount extends ConfigurableComponent {
       });
     }
     this.$errorMessage = this.$root.querySelector('.govuk-error-message');
-    if (`${$textareaDescription.textContent}`.match(/^\s*$/)) {
+    if ($textareaDescription.textContent.match(/^\s*$/)) {
       $textareaDescription.textContent = this.i18n.t('textareaDescription', {
         count: this.maxLength
       });
@@ -591,15 +469,22 @@ class CharacterCount extends ConfigurableComponent {
     $textareaDescription.classList.add('govuk-visually-hidden');
     this.$textarea.removeAttribute('maxlength');
     this.bindChangeEvents();
-    window.addEventListener('pageshow', () => this.updateCountMessage());
+    window.addEventListener('pageshow', () => {
+      if (this.$textarea.value !== this.$textarea.textContent) {
+        this.updateCount();
+        this.updateCountMessage();
+      }
+    });
+    this.updateCount();
     this.updateCountMessage();
   }
   bindChangeEvents() {
-    this.$textarea.addEventListener('keyup', () => this.handleKeyUp());
+    this.$textarea.addEventListener('input', () => this.handleInput());
     this.$textarea.addEventListener('focus', () => this.handleFocus());
     this.$textarea.addEventListener('blur', () => this.handleBlur());
   }
-  handleKeyUp() {
+  handleInput() {
+    this.updateCount();
     this.updateVisibleCountMessage();
     this.lastInputTimestamp = Date.now();
   }
@@ -626,7 +511,7 @@ class CharacterCount extends ConfigurableComponent {
     this.updateScreenReaderCountMessage();
   }
   updateVisibleCountMessage() {
-    const remainingNumber = this.maxLength - this.count(this.$textarea.value);
+    const remainingNumber = this.maxLength - this.count;
     const isError = remainingNumber < 0;
     this.$visibleCountMessage.classList.toggle('govuk-character-count__message--disabled', !this.isOverThreshold());
     if (!this.$errorMessage) {
@@ -644,16 +529,18 @@ class CharacterCount extends ConfigurableComponent {
     }
     this.$screenReaderCountMessage.textContent = this.getCountMessage();
   }
-  count(text) {
+  updateCount() {
+    const text = this.$textarea.value;
     if (this.config.maxwords) {
       var _text$match;
       const tokens = (_text$match = text.match(/\S+/g)) != null ? _text$match : [];
-      return tokens.length;
+      this.count = tokens.length;
+      return;
     }
-    return text.length;
+    this.count = text.length;
   }
   getCountMessage() {
-    const remainingNumber = this.maxLength - this.count(this.$textarea.value);
+    const remainingNumber = this.maxLength - this.count;
     const countType = this.config.maxwords ? 'words' : 'characters';
     return this.formatCountMessage(remainingNumber, countType);
   }
@@ -670,7 +557,7 @@ class CharacterCount extends ConfigurableComponent {
     if (!this.config.threshold) {
       return true;
     }
-    const currentLength = this.count(this.$textarea.value);
+    const currentLength = this.count;
     const maxLength = this.maxLength;
     const thresholdValue = maxLength * this.config.threshold / 100;
     return thresholdValue <= currentLength;

data/node_modules/govuk-frontend/dist/govuk/components/character-count/character-count.mjs

@@ -37,6 +37,7 @@ class CharacterCount extends ConfigurableComponent {
     var _ref, _this$config$maxwords;
     super($root, config);
     this.$textarea = void 0;
+    this.count = 0;
     this.$visibleCountMessage = void 0;
     this.$screenReaderCountMessage = void 0;
     this.lastInputTimestamp = null;
@@ -72,7 +73,7 @@ class CharacterCount extends ConfigurableComponent {
       });
     }
     this.$errorMessage = this.$root.querySelector('.govuk-error-message');
-    if (`${$textareaDescription.textContent}`.match(/^\s*$/)) {
+    if ($textareaDescription.textContent.match(/^\s*$/)) {
       $textareaDescription.textContent = this.i18n.t('textareaDescription', {
         count: this.maxLength
       });
@@ -92,15 +93,22 @@ class CharacterCount extends ConfigurableComponent {
     $textareaDescription.classList.add('govuk-visually-hidden');
     this.$textarea.removeAttribute('maxlength');
     this.bindChangeEvents();
-    window.addEventListener('pageshow', () => this.updateCountMessage());
+    window.addEventListener('pageshow', () => {
+      if (this.$textarea.value !== this.$textarea.textContent) {
+        this.updateCount();
+        this.updateCountMessage();
+      }
+    });
+    this.updateCount();
     this.updateCountMessage();
   }
   bindChangeEvents() {
-    this.$textarea.addEventListener('keyup', () => this.handleKeyUp());
+    this.$textarea.addEventListener('input', () => this.handleInput());
     this.$textarea.addEventListener('focus', () => this.handleFocus());
     this.$textarea.addEventListener('blur', () => this.handleBlur());
   }
-  handleKeyUp() {
+  handleInput() {
+    this.updateCount();
     this.updateVisibleCountMessage();
     this.lastInputTimestamp = Date.now();
   }
@@ -127,7 +135,7 @@ class CharacterCount extends ConfigurableComponent {
     this.updateScreenReaderCountMessage();
   }
   updateVisibleCountMessage() {
-    const remainingNumber = this.maxLength - this.count(this.$textarea.value);
+    const remainingNumber = this.maxLength - this.count;
     const isError = remainingNumber < 0;
     this.$visibleCountMessage.classList.toggle('govuk-character-count__message--disabled', !this.isOverThreshold());
     if (!this.$errorMessage) {
@@ -145,16 +153,18 @@ class CharacterCount extends ConfigurableComponent {
     }
     this.$screenReaderCountMessage.textContent = this.getCountMessage();
   }
-  count(text) {
+  updateCount() {
+    const text = this.$textarea.value;
     if (this.config.maxwords) {
       var _text$match;
       const tokens = (_text$match = text.match(/\S+/g)) != null ? _text$match : [];
-      return tokens.length;
+      this.count = tokens.length;
+      return;
     }
-    return text.length;
+    this.count = text.length;
   }
   getCountMessage() {
-    const remainingNumber = this.maxLength - this.count(this.$textarea.value);
+    const remainingNumber = this.maxLength - this.count;
     const countType = this.config.maxwords ? 'words' : 'characters';
     return this.formatCountMessage(remainingNumber, countType);
   }
@@ -171,7 +181,7 @@ class CharacterCount extends ConfigurableComponent {
     if (!this.config.threshold) {
       return true;
     }
-    const currentLength = this.count(this.$textarea.value);
+    const currentLength = this.count;
     const maxLength = this.maxLength;
     const thresholdValue = maxLength * this.config.threshold / 100;
     return thresholdValue <= currentLength;

data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/_index.scss

@@ -119,7 +119,7 @@
       outline-color: Highlight;
     }
 
-    box-shadow: 0 0 0 $govuk-focus-width $govuk-focus-colour;
+    box-shadow: 0 0 0 $govuk-focus-width govuk-functional-colour(focus);
   }
 
   // Selected state
@@ -169,7 +169,8 @@
     @include govuk-responsive-margin(4, "bottom");
     margin-left: $conditional-margin-left;
     padding-left: $conditional-padding-left;
-    border-left: $conditional-border-width solid $govuk-border-colour;
+    border-left: $conditional-border-width solid;
+    border-left-color: govuk-functional-colour(border);
 
     .govuk-frontend-supported &--hidden {
       display: none;
@@ -271,7 +272,7 @@
       // Apply an outline for those modes to use instead.
       outline: $govuk-focus-width dashed transparent;
       outline-offset: 1px;
-      box-shadow: 0 0 0 $govuk-hover-width $govuk-hover-colour;
+      box-shadow: 0 0 0 $govuk-hover-width govuk-functional-colour(hover);
     }
 
     // Because we've overridden the border-shadow provided by the focus state,
@@ -286,8 +287,8 @@
       }
       // prettier-ignore
       box-shadow:
-        0 0 0 $govuk-focus-width $govuk-focus-colour, // 1
-        0 0 0 $govuk-hover-width $govuk-hover-colour; // 2
+        0 0 0 $govuk-focus-width govuk-functional-colour(focus), // 1
+        0 0 0 $govuk-hover-width govuk-functional-colour(hover); // 2
     }
 
     // For devices that explicitly don't support hover, don't provide a hover
@@ -302,7 +303,7 @@
       }
 
       .govuk-checkboxes__item:hover .govuk-checkboxes__input:focus + .govuk-checkboxes__label::before {
-        box-shadow: 0 0 0 $govuk-focus-width $govuk-focus-colour;
+        box-shadow: 0 0 0 $govuk-focus-width govuk-functional-colour(focus);
       }
     }
   }

data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/checkboxes.bundle.js

@@ -23,6 +23,12 @@
     }
     return $scope.classList.contains('govuk-frontend-supported');
   }
+  function isArray(option) {
+    return Array.isArray(option);
+  }
+  function isObject(option) {
+    return !!option && typeof option === 'object' && !isArray(option);
+  }
   function formatErrorMessage(Component, message) {
     return `${Component.moduleName}: ${message}`;
   }
@@ -30,9 +36,6 @@
    * @typedef ComponentWithModuleName
    * @property {string} moduleName - Name of the component
    */
-  /**
-   * @import { ObjectNested } from './configuration.mjs'
-   */
 
   class GOVUKFrontendError extends Error {
     constructor(...args) {
@@ -55,7 +58,7 @@
   class ElementError extends GOVUKFrontendError {
     constructor(messageOrOptions) {
       let message = typeof messageOrOptions === 'string' ? messageOrOptions : '';
-      if (typeof messageOrOptions === 'object') {
+      if (isObject(messageOrOptions)) {
         const {
           component,
           identifier,
@@ -64,7 +67,9 @@
         } = messageOrOptions;
         message = identifier;
         message += element ? ` is not of type ${expectedType != null ? expectedType : 'HTMLElement'}` : ' not found';
-        message = formatErrorMessage(component, message);
+        if (component) {
+          message = formatErrorMessage(component, message);
+        }
       }
       super(message);
       this.name = 'ElementError';

data/node_modules/govuk-frontend/dist/govuk/components/checkboxes/checkboxes.bundle.mjs

@@ -17,6 +17,12 @@ function isSupported($scope = document.body) {
   }
   return $scope.classList.contains('govuk-frontend-supported');
 }
+function isArray(option) {
+  return Array.isArray(option);
+}
+function isObject(option) {
+  return !!option && typeof option === 'object' && !isArray(option);
+}
 function formatErrorMessage(Component, message) {
   return `${Component.moduleName}: ${message}`;
 }
@@ -24,9 +30,6 @@ function formatErrorMessage(Component, message) {
  * @typedef ComponentWithModuleName
  * @property {string} moduleName - Name of the component
  */
-/**
- * @import { ObjectNested } from './configuration.mjs'
- */
 
 class GOVUKFrontendError extends Error {
   constructor(...args) {
@@ -49,7 +52,7 @@ class SupportError extends GOVUKFrontendError {
 class ElementError extends GOVUKFrontendError {
   constructor(messageOrOptions) {
     let message = typeof messageOrOptions === 'string' ? messageOrOptions : '';
-    if (typeof messageOrOptions === 'object') {
+    if (isObject(messageOrOptions)) {
       const {
         component,
         identifier,
@@ -58,7 +61,9 @@ class ElementError extends GOVUKFrontendError {
       } = messageOrOptions;
       message = identifier;
       message += element ? ` is not of type ${expectedType != null ? expectedType : 'HTMLElement'}` : ' not found';
-      message = formatErrorMessage(component, message);
+      if (component) {
+        message = formatErrorMessage(component, message);
+      }
     }
     super(message);
     this.name = 'ElementError';

data/node_modules/govuk-frontend/dist/govuk/components/cookie-banner/_index.scss

@@ -13,11 +13,8 @@
     // changes colours in their browser.
     border-bottom: $border-bottom-width solid transparent;
 
-    @include _govuk-rebrand(
-      "background-color",
-      $govuk-template-background-colour,
-      $_govuk-rebrand-template-background-colour
-    );
+    color: govuk-functional-colour(surface-text);
+    background-color: govuk-functional-colour(surface-background);
   }
 
   // Support older browsers which don't hide elements with the `hidden` attribute

data/node_modules/govuk-frontend/dist/govuk/components/date-input/_index.scss

@@ -14,6 +14,11 @@
     display: inline-block;
     margin-right: govuk-spacing(4);
     margin-bottom: 0;
+
+    // Prevents an issue in iOS Safari 18 where the items vertically
+    // shift when the value of inputs is changed.
+    // https://github.com/alphagov/reported-bugs/issues/90
+    vertical-align: bottom;
   }
 
   .govuk-date-input__label {

data/node_modules/govuk-frontend/dist/govuk/components/details/_index.scss

@@ -46,7 +46,8 @@
   // like inset text
   @media screen\0 {
     .govuk-details {
-      border-left: $govuk-border-width-wide solid $govuk-border-colour;
+      border-left: $govuk-border-width-wide solid;
+      border-left-color: govuk-functional-colour(border);
     }
 
     .govuk-details__summary {
@@ -81,11 +82,11 @@
       padding-left: govuk-spacing(4) + $govuk-border-width;
 
       // Style the summary to look like a link...
-      color: $govuk-link-colour;
+      color: govuk-functional-colour(link);
       cursor: pointer;
 
       &:hover {
-        color: $govuk-link-hover-colour;
+        color: govuk-functional-colour(link-hover);
       }
 
       &:focus {
@@ -131,7 +132,8 @@
     }
 
     .govuk-details__text {
-      border-left: $govuk-border-width solid $govuk-border-colour;
+      border-left: $govuk-border-width solid;
+      border-left-color: govuk-functional-colour(border);
     }
   }
 }

data/node_modules/govuk-frontend/dist/govuk/components/error-message/_index.scss

@@ -7,7 +7,7 @@
     margin-bottom: govuk-spacing(3);
     clear: both;
 
-    color: $govuk-error-colour;
+    color: govuk-functional-colour(error);
   }
 }
 

data/node_modules/govuk-frontend/dist/govuk/components/error-summary/_index.scss

@@ -7,10 +7,12 @@
     @include govuk-responsive-padding(4);
     @include govuk-responsive-margin(8, "bottom");
 
-    border: $govuk-border-width solid $govuk-error-colour;
+    border: $govuk-border-width solid;
+    border-color: govuk-functional-colour(error);
 
     &:focus {
-      outline: $govuk-focus-width solid $govuk-focus-colour;
+      outline: $govuk-focus-width solid;
+      outline-color: govuk-functional-colour(focus);
     }
   }
 

data/node_modules/govuk-frontend/dist/govuk/components/error-summary/error-summary.bundle.js

@@ -4,12 +4,6 @@
   (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.GOVUKFrontend = global.GOVUKFrontend || {}));
 })(this, (function (exports) { 'use strict';
 
-  function getFragmentFromUrl(url) {
-    if (!url.includes('#')) {
-      return undefined;
-    }
-    return url.split('#').pop();
-  }
   function setFocus($element, options = {}) {
     var _options$onBeforeFocu;
     const isFocusable = $element.getAttribute('tabindex');
@@ -66,9 +60,6 @@
    * @typedef ComponentWithModuleName
    * @property {string} moduleName - Name of the component
    */
-  /**
-   * @import { ObjectNested } from './configuration.mjs'
-   */
 
   class GOVUKFrontendError extends Error {
     constructor(...args) {
@@ -97,7 +88,7 @@
   class ElementError extends GOVUKFrontendError {
     constructor(messageOrOptions) {
       let message = typeof messageOrOptions === 'string' ? messageOrOptions : '';
-      if (typeof messageOrOptions === 'object') {
+      if (isObject(messageOrOptions)) {
         const {
           component,
           identifier,
@@ -106,7 +97,9 @@
         } = messageOrOptions;
         message = identifier;
         message += element ? ` is not of type ${expectedType != null ? expectedType : 'HTMLElement'}` : ' not found';
-        message = formatErrorMessage(component, message);
+        if (component) {
+          message = formatErrorMessage(component, message);
+        }
       }
       super(message);
       this.name = 'ElementError';
@@ -320,6 +313,9 @@
    * @template {Partial<Record<keyof ConfigurationType, unknown>>} [ConfigurationType=ObjectNested]
    * @typedef {typeof Component & ChildClass<ConfigurationType>} ChildClassConstructor<ConfigurationType>
    */
+  /**
+   * @import { CompatibleClass, Config, CreateAllOptions, OnErrorCallback } from '../init.mjs'
+   */
 
   /**
    * Error summary component
@@ -352,7 +348,7 @@
       if (!($target instanceof HTMLAnchorElement)) {
         return false;
       }
-      const inputId = getFragmentFromUrl($target.href);
+      const inputId = $target.hash.replace('#', '');
       if (!inputId) {
         return false;
       }