govuk_publishing_components 51.1.1 → 51.2.1

data/node_modules/govuk-frontend/dist/govuk/all.bundle.mjs

@@ -1,75 +1,5 @@
-const version = '5.7.1';
+const version = '5.8.0';
 
-function normaliseString(value, property) {
-  const trimmedValue = value ? value.trim() : '';
-  let output;
-  let outputType = property == null ? void 0 : property.type;
-  if (!outputType) {
-    if (['true', 'false'].includes(trimmedValue)) {
-      outputType = 'boolean';
-    }
-    if (trimmedValue.length > 0 && isFinite(Number(trimmedValue))) {
-      outputType = 'number';
-    }
-  }
-  switch (outputType) {
-    case 'boolean':
-      output = trimmedValue === 'true';
-      break;
-    case 'number':
-      output = Number(trimmedValue);
-      break;
-    default:
-      output = value;
-  }
-  return output;
-}
-
-/**
- * @typedef {import('./index.mjs').SchemaProperty} SchemaProperty
- */
-
-function mergeConfigs(...configObjects) {
-  const formattedConfigObject = {};
-  for (const configObject of configObjects) {
-    for (const key of Object.keys(configObject)) {
-      const option = formattedConfigObject[key];
-      const override = configObject[key];
-      if (isObject(option) && isObject(override)) {
-        formattedConfigObject[key] = mergeConfigs(option, override);
-      } else {
-        formattedConfigObject[key] = override;
-      }
-    }
-  }
-  return formattedConfigObject;
-}
-function extractConfigByNamespace(Component, dataset, namespace) {
-  const property = Component.schema.properties[namespace];
-  if ((property == null ? void 0 : property.type) !== 'object') {
-    return;
-  }
-  const newObject = {
-    [namespace]: ({})
-  };
-  for (const [key, value] of Object.entries(dataset)) {
-    let current = newObject;
-    const keyParts = key.split('.');
-    for (const [index, name] of keyParts.entries()) {
-      if (typeof current === 'object') {
-        if (index < keyParts.length - 1) {
-          if (!isObject(current[name])) {
-            current[name] = {};
-          }
-          current = current[name];
-        } else if (key !== namespace) {
-          current[name] = normaliseString(value);
-        }
-      }
-    }
-  }
-  return newObject[namespace];
-}
 function getFragmentFromUrl(url) {
   if (!url.includes('#')) {
     return undefined;
@@ -127,26 +57,6 @@ function isSupported($scope = document.body) {
   }
   return $scope.classList.contains('govuk-frontend-supported');
 }
-function validateConfig(schema, config) {
-  const validationErrors = [];
-  for (const [name, conditions] of Object.entries(schema)) {
-    const errors = [];
-    if (Array.isArray(conditions)) {
-      for (const {
-        required,
-        errorMessage
-      } of conditions) {
-        if (!required.every(key => !!config[key])) {
-          errors.push(errorMessage);
-        }
-      }
-      if (name === 'anyOf' && !(conditions.length - errors.length >= 1)) {
-        validationErrors.push(...errors);
-      }
-    }
-  }
-  return validationErrors;
-}
 function isArray(option) {
   return Array.isArray(option);
 }
@@ -156,47 +66,11 @@ function isObject(option) {
 function formatErrorMessage(Component, message) {
   return `${Component.moduleName}: ${message}`;
 }
-
-/**
- * Schema for component config
- *
- * @typedef {object} Schema
- * @property {{ [field: string]: SchemaProperty | undefined }} properties - Schema properties
- * @property {SchemaCondition[]} [anyOf] - List of schema conditions
- */
-
-/**
- * Schema property for component config
- *
- * @typedef {object} SchemaProperty
- * @property {'string' | 'boolean' | 'number' | 'object'} type - Property type
- */
-
-/**
- * Schema condition for component config
- *
- * @typedef {object} SchemaCondition
- * @property {string[]} required - List of required config fields
- * @property {string} errorMessage - Error message when required config fields not provided
- */
 /**
  * @typedef ComponentWithModuleName
  * @property {string} moduleName - Name of the component
  */
 
-function normaliseDataset(Component, dataset) {
-  const out = {};
-  for (const [field, property] of Object.entries(Component.schema.properties)) {
-    if (field in dataset) {
-      out[field] = normaliseString(dataset[field], property);
-    }
-    if ((property == null ? void 0 : property.type) === 'object') {
-      out[field] = extractConfigByNamespace(Component, dataset, field);
-    }
-  }
-  return out;
-}
-
 class GOVUKFrontendError extends Error {
   constructor(...args) {
     super(...args);
@@ -305,6 +179,164 @@ class GOVUKFrontendComponent {
  */
 GOVUKFrontendComponent.elementType = HTMLElement;
 
+const configOverride = Symbol.for('configOverride');
+class ConfigurableComponent extends GOVUKFrontendComponent {
+  [configOverride](param) {
+    return {};
+  }
+
+  /**
+   * Returns the root element of the component
+   *
+   * @protected
+   * @returns {ConfigurationType} - the root element of component
+   */
+  get config() {
+    return this._config;
+  }
+  constructor($root, config) {
+    super($root);
+    this._config = void 0;
+    const childConstructor = this.constructor;
+    if (typeof childConstructor.defaults === 'undefined') {
+      throw new ConfigError(formatErrorMessage(childConstructor, 'Config passed as parameter into constructor but no defaults defined'));
+    }
+    const datasetConfig = normaliseDataset(childConstructor, this._$root.dataset);
+    this._config = mergeConfigs(childConstructor.defaults, config != null ? config : {}, this[configOverride](datasetConfig), datasetConfig);
+  }
+}
+function normaliseString(value, property) {
+  const trimmedValue = value ? value.trim() : '';
+  let output;
+  let outputType = property == null ? void 0 : property.type;
+  if (!outputType) {
+    if (['true', 'false'].includes(trimmedValue)) {
+      outputType = 'boolean';
+    }
+    if (trimmedValue.length > 0 && isFinite(Number(trimmedValue))) {
+      outputType = 'number';
+    }
+  }
+  switch (outputType) {
+    case 'boolean':
+      output = trimmedValue === 'true';
+      break;
+    case 'number':
+      output = Number(trimmedValue);
+      break;
+    default:
+      output = value;
+  }
+  return output;
+}
+function normaliseDataset(Component, dataset) {
+  if (typeof Component.schema === 'undefined') {
+    throw new ConfigError(formatErrorMessage(Component, 'Config passed as parameter into constructor but no schema defined'));
+  }
+  const out = {};
+  for (const [field, property] of Object.entries(Component.schema.properties)) {
+    if (field in dataset) {
+      out[field] = normaliseString(dataset[field], property);
+    }
+    if ((property == null ? void 0 : property.type) === 'object') {
+      out[field] = extractConfigByNamespace(Component.schema, dataset, field);
+    }
+  }
+  return out;
+}
+function mergeConfigs(...configObjects) {
+  const formattedConfigObject = {};
+  for (const configObject of configObjects) {
+    for (const key of Object.keys(configObject)) {
+      const option = formattedConfigObject[key];
+      const override = configObject[key];
+      if (isObject(option) && isObject(override)) {
+        formattedConfigObject[key] = mergeConfigs(option, override);
+      } else {
+        formattedConfigObject[key] = override;
+      }
+    }
+  }
+  return formattedConfigObject;
+}
+function validateConfig(schema, config) {
+  const validationErrors = [];
+  for (const [name, conditions] of Object.entries(schema)) {
+    const errors = [];
+    if (Array.isArray(conditions)) {
+      for (const {
+        required,
+        errorMessage
+      } of conditions) {
+        if (!required.every(key => !!config[key])) {
+          errors.push(errorMessage);
+        }
+      }
+      if (name === 'anyOf' && !(conditions.length - errors.length >= 1)) {
+        validationErrors.push(...errors);
+      }
+    }
+  }
+  return validationErrors;
+}
+function extractConfigByNamespace(schema, dataset, namespace) {
+  const property = schema.properties[namespace];
+  if ((property == null ? void 0 : property.type) !== 'object') {
+    return;
+  }
+  const newObject = {
+    [namespace]: ({})
+  };
+  for (const [key, value] of Object.entries(dataset)) {
+    let current = newObject;
+    const keyParts = key.split('.');
+    for (const [index, name] of keyParts.entries()) {
+      if (typeof current === 'object') {
+        if (index < keyParts.length - 1) {
+          if (!isObject(current[name])) {
+            current[name] = {};
+          }
+          current = current[name];
+        } else if (key !== namespace) {
+          current[name] = normaliseString(value);
+        }
+      }
+    }
+  }
+  return newObject[namespace];
+}
+/**
+ * Schema for component config
+ *
+ * @typedef {object} Schema
+ * @property {{ [field: string]: SchemaProperty | undefined }} properties - Schema properties
+ * @property {SchemaCondition[]} [anyOf] - List of schema conditions
+ */
+/**
+ * Schema property for component config
+ *
+ * @typedef {object} SchemaProperty
+ * @property {'string' | 'boolean' | 'number' | 'object'} type - Property type
+ */
+/**
+ * Schema condition for component config
+ *
+ * @typedef {object} SchemaCondition
+ * @property {string[]} required - List of required config fields
+ * @property {string} errorMessage - Error message when required config fields not provided
+ */
+/**
+ * @template {ObjectNested} [ConfigurationType={}]
+ * @typedef ChildClass
+ * @property {string} moduleName - The module name that'll be looked for in the DOM when initialising the component
+ * @property {Schema} [schema] - The schema of the component configuration
+ * @property {ConfigurationType} [defaults] - The default values of the configuration of the component
+ */
+/**
+ * @template {ObjectNested} [ConfigurationType={}]
+ * @typedef {typeof GOVUKFrontendComponent & ChildClass<ConfigurationType>} ChildClassConstructor<ConfigurationType>
+ */
+
 class I18n {
   constructor(translations = {}, config = {}) {
     var _config$locale;
@@ -511,15 +543,15 @@ I18n.pluralRules = {
  * attribute, which also provides accessibility.
  *
  * @preserve
+ * @augments ConfigurableComponent<AccordionConfig>
  */
-class Accordion extends GOVUKFrontendComponent {
+class Accordion extends ConfigurableComponent {
   /**
    * @param {Element | null} $root - HTML element to use for accordion
    * @param {AccordionConfig} [config] - Accordion config
    */
   constructor($root, config = {}) {
-    super($root);
-    this.config = void 0;
+    super($root, config);
     this.i18n = void 0;
     this.controlsClass = 'govuk-accordion__controls';
     this.showAllClass = 'govuk-accordion__show-all';
@@ -544,7 +576,6 @@ class Accordion extends GOVUKFrontendComponent {
     this.$showAllButton = null;
     this.$showAllIcon = null;
     this.$showAllText = null;
-    this.config = mergeConfigs(Accordion.defaults, config, normaliseDataset(Accordion, this.$root.dataset));
     this.i18n = new I18n(this.config.i18n);
     const $sections = this.$root.querySelectorAll(`.${this.sectionClass}`);
     if (!$sections.length) {
@@ -814,7 +845,7 @@ class Accordion extends GOVUKFrontendComponent {
  */
 
 /**
- * @typedef {import('../../common/index.mjs').Schema} Schema
+ * @typedef {import('../../common/configuration.mjs').Schema} Schema
  */
 Accordion.moduleName = 'govuk-accordion';
 Accordion.defaults = Object.freeze({
@@ -845,17 +876,16 @@ const DEBOUNCE_TIMEOUT_IN_SECONDS = 1;
  * JavaScript enhancements for the Button component
  *
  * @preserve
+ * @augments ConfigurableComponent<ButtonConfig>
  */
-class Button extends GOVUKFrontendComponent {
+class Button extends ConfigurableComponent {
   /**
    * @param {Element | null} $root - HTML element to use for button
    * @param {ButtonConfig} [config] - Button config
    */
   constructor($root, config = {}) {
-    super($root);
-    this.config = void 0;
+    super($root, config);
     this.debounceFormSubmitTimer = null;
-    this.config = mergeConfigs(Button.defaults, config, normaliseDataset(Button, this.$root.dataset));
     this.$root.addEventListener('keydown', event => this.handleKeyDown(event));
     this.$root.addEventListener('click', event => this.debounce(event));
   }
@@ -892,7 +922,7 @@ class Button extends GOVUKFrontendComponent {
  */
 
 /**
- * @typedef {import('../../common/index.mjs').Schema} Schema
+ * @typedef {import('../../common/configuration.mjs').Schema} Schema
  */
 Button.moduleName = 'govuk-button';
 Button.defaults = Object.freeze({
@@ -922,22 +952,33 @@ function closestAttributeValue($element, attributeName) {
  * of the available characters/words has been entered.
  *
  * @preserve
+ * @augments ConfigurableComponent<CharacterCountConfig>
  */
-class CharacterCount extends GOVUKFrontendComponent {
+class CharacterCount extends ConfigurableComponent {
+  [configOverride](datasetConfig) {
+    let configOverrides = {};
+    if ('maxwords' in datasetConfig || 'maxlength' in datasetConfig) {
+      configOverrides = {
+        maxlength: undefined,
+        maxwords: undefined
+      };
+    }
+    return configOverrides;
+  }
+
   /**
    * @param {Element | null} $root - HTML element to use for character count
    * @param {CharacterCountConfig} [config] - Character count config
    */
   constructor($root, config = {}) {
     var _ref, _this$config$maxwords;
-    super($root);
+    super($root, config);
     this.$textarea = void 0;
     this.$visibleCountMessage = void 0;
     this.$screenReaderCountMessage = void 0;
     this.lastInputTimestamp = null;
     this.lastInputValue = '';
     this.valueChecker = null;
-    this.config = void 0;
     this.i18n = void 0;
     this.maxLength = void 0;
     const $textarea = this.$root.querySelector('.govuk-js-character-count');
@@ -949,15 +990,6 @@ class CharacterCount extends GOVUKFrontendComponent {
         identifier: 'Form field (`.govuk-js-character-count`)'
       });
     }
-    const datasetConfig = normaliseDataset(CharacterCount, this.$root.dataset);
-    let configOverrides = {};
-    if ('maxwords' in datasetConfig || 'maxlength' in datasetConfig) {
-      configOverrides = {
-        maxlength: undefined,
-        maxwords: undefined
-      };
-    }
-    this.config = mergeConfigs(CharacterCount.defaults, config, configOverrides, datasetConfig);
     const errors = validateConfig(CharacterCount.schema, this.config);
     if (errors[0]) {
       throw new ConfigError(formatErrorMessage(CharacterCount, errors[0]));
@@ -1143,7 +1175,7 @@ class CharacterCount extends GOVUKFrontendComponent {
  */
 
 /**
- * @typedef {import('../../common/index.mjs').Schema} Schema
+ * @typedef {import('../../common/configuration.mjs').Schema} Schema
  * @typedef {import('../../i18n.mjs').TranslationPluralForms} TranslationPluralForms
  */
 CharacterCount.moduleName = 'govuk-character-count';
@@ -1310,16 +1342,15 @@ Checkboxes.moduleName = 'govuk-checkboxes';
  * configuration.
  *
  * @preserve
+ * @augments ConfigurableComponent<ErrorSummaryConfig>
  */
-class ErrorSummary extends GOVUKFrontendComponent {
+class ErrorSummary extends ConfigurableComponent {
   /**
    * @param {Element | null} $root - HTML element to use for error summary
    * @param {ErrorSummaryConfig} [config] - Error summary config
    */
   constructor($root, config = {}) {
-    super($root);
-    this.config = void 0;
-    this.config = mergeConfigs(ErrorSummary.defaults, config, normaliseDataset(ErrorSummary, this.$root.dataset));
+    super($root, config);
     if (!this.config.disableAutoFocus) {
       setFocus(this.$root);
     }
@@ -1386,7 +1417,7 @@ class ErrorSummary extends GOVUKFrontendComponent {
  */
 
 /**
- * @typedef {import('../../common/index.mjs').Schema} Schema
+ * @typedef {import('../../common/configuration.mjs').Schema} Schema
  */
 ErrorSummary.moduleName = 'govuk-error-summary';
 ErrorSummary.defaults = Object.freeze({
@@ -1404,15 +1435,15 @@ ErrorSummary.schema = Object.freeze({
  * Exit this page component
  *
  * @preserve
+ * @augments ConfigurableComponent<ExitThisPageConfig>
  */
-class ExitThisPage extends GOVUKFrontendComponent {
+class ExitThisPage extends ConfigurableComponent {
   /**
    * @param {Element | null} $root - HTML element that wraps the Exit This Page button
    * @param {ExitThisPageConfig} [config] - Exit This Page config
    */
   constructor($root, config = {}) {
-    super($root);
-    this.config = void 0;
+    super($root, config);
     this.i18n = void 0;
     this.$button = void 0;
     this.$skiplinkButton = null;
@@ -1433,7 +1464,6 @@ class ExitThisPage extends GOVUKFrontendComponent {
         identifier: 'Button (`.govuk-exit-this-page__button`)'
       });
     }
-    this.config = mergeConfigs(ExitThisPage.defaults, config, normaliseDataset(ExitThisPage, this.$root.dataset));
     this.i18n = new I18n(this.config.i18n);
     this.$button = $button;
     const $skiplinkButton = document.querySelector('.govuk-js-exit-this-page-skiplink');
@@ -1599,7 +1629,7 @@ class ExitThisPage extends GOVUKFrontendComponent {
  */
 
 /**
- * @typedef {import('../../common/index.mjs').Schema} Schema
+ * @typedef {import('../../common/configuration.mjs').Schema} Schema
  */
 ExitThisPage.moduleName = 'govuk-exit-this-page';
 ExitThisPage.defaults = Object.freeze({
@@ -1704,16 +1734,15 @@ Header.moduleName = 'govuk-header';
  * Notification Banner component
  *
  * @preserve
+ * @augments ConfigurableComponent<NotificationBannerConfig>
  */
-class NotificationBanner extends GOVUKFrontendComponent {
+class NotificationBanner extends ConfigurableComponent {
   /**
    * @param {Element | null} $root - HTML element to use for notification banner
    * @param {NotificationBannerConfig} [config] - Notification banner config
    */
   constructor($root, config = {}) {
-    super($root);
-    this.config = void 0;
-    this.config = mergeConfigs(NotificationBanner.defaults, config, normaliseDataset(NotificationBanner, this.$root.dataset));
+    super($root, config);
     if (this.$root.getAttribute('role') === 'alert' && !this.config.disableAutoFocus) {
       setFocus(this.$root);
     }
@@ -1731,7 +1760,7 @@ class NotificationBanner extends GOVUKFrontendComponent {
  */
 
 /**
- * @typedef {import('../../common/index.mjs').Schema} Schema
+ * @typedef {import('../../common/configuration.mjs').Schema} Schema
  */
 NotificationBanner.moduleName = 'govuk-notification-banner';
 NotificationBanner.defaults = Object.freeze({
@@ -1749,15 +1778,15 @@ NotificationBanner.schema = Object.freeze({
  * Password input component
  *
  * @preserve
+ * @augments ConfigurableComponent<PasswordInputConfig>
  */
-class PasswordInput extends GOVUKFrontendComponent {
+class PasswordInput extends ConfigurableComponent {
   /**
    * @param {Element | null} $root - HTML element to use for password input
    * @param {PasswordInputConfig} [config] - Password input config
    */
   constructor($root, config = {}) {
-    super($root);
-    this.config = void 0;
+    super($root, config);
     this.i18n = void 0;
     this.$input = void 0;
     this.$showHideButton = void 0;
@@ -1788,7 +1817,6 @@ class PasswordInput extends GOVUKFrontendComponent {
     }
     this.$input = $input;
     this.$showHideButton = $showHideButton;
-    this.config = mergeConfigs(PasswordInput.defaults, config, normaliseDataset(PasswordInput, this.$root.dataset));
     this.i18n = new I18n(this.config.i18n, {
       locale: closestAttributeValue(this.$root, 'lang')
     });
@@ -1868,7 +1896,7 @@ class PasswordInput extends GOVUKFrontendComponent {
  */
 
 /**
- * @typedef {import('../../common/index.mjs').Schema} Schema
+ * @typedef {import('../../common/configuration.mjs').Schema} Schema
  * @typedef {import('../../i18n.mjs').TranslationPluralForms} TranslationPluralForms
  */
 PasswordInput.moduleName = 'govuk-password-input';
@@ -2421,11 +2449,11 @@ function initAll(config) {
  *
  * Any component errors will be caught and logged to the console.
  *
- * @template {CompatibleClass} T
- * @param {T} Component - class of the component to create
- * @param {T["defaults"]} [config] - Config supplied to component
- * @param {OnErrorCallback<T> | Element | Document | CreateAllOptions<T> } [createAllOptions] - options for createAll including scope of the document to search within and callback function if error throw by component on init
- * @returns {Array<InstanceType<T>>} - array of instantiated components
+ * @template {CompatibleClass} ComponentClass
+ * @param {ComponentClass} Component - class of the component to create
+ * @param {ComponentConfig<ComponentClass>} [config] - Config supplied to component
+ * @param {OnErrorCallback<ComponentClass> | Element | Document | CreateAllOptions<ComponentClass> } [createAllOptions] - options for createAll including scope of the document to search within and callback function if error throw by component on init
+ * @returns {Array<InstanceType<ComponentClass>>} - array of instantiated components
  */
 function createAll(Component, config, createAllOptions) {
   let $scope = document;
@@ -2472,7 +2500,7 @@ function createAll(Component, config, createAllOptions) {
   }).filter(Boolean);
 }
 /**
- * @typedef {{new (...args: any[]): any, defaults?: object, moduleName: string}} CompatibleClass
+ * @typedef {{new (...args: any[]): any, moduleName: string}} CompatibleClass
  */
 /**
  * Config for all components via `initAll()`
@@ -2506,24 +2534,28 @@ function createAll(Component, config, createAllOptions) {
  * @typedef {keyof Config} ConfigKey
  */
 /**
- * @template {CompatibleClass} T
+ * @template {CompatibleClass} ComponentClass
+ * @typedef {ConstructorParameters<ComponentClass>[1]} ComponentConfig
+ */
+/**
+ * @template {CompatibleClass} ComponentClass
  * @typedef {object} ErrorContext
  * @property {Element} [element] - Element used for component module initialisation
- * @property {T} [component] - Class of component
- * @property {T["defaults"]} config - Config supplied to component
+ * @property {ComponentClass} [component] - Class of component
+ * @property {ComponentConfig<ComponentClass>} config - Config supplied to component
  */
 /**
- * @template {CompatibleClass} T
+ * @template {CompatibleClass} ComponentClass
  * @callback OnErrorCallback
  * @param {unknown} error - Thrown error
- * @param {ErrorContext<T>} context - Object containing the element, component class and configuration
+ * @param {ErrorContext<ComponentClass>} context - Object containing the element, component class and configuration
  */
 /**
- * @template {CompatibleClass} T
+ * @template {CompatibleClass} ComponentClass
  * @typedef {object} CreateAllOptions
  * @property {Element | Document} [scope] - scope of the document to search within
- * @property {OnErrorCallback<T>} [onError] - callback function if error throw by component on init
+ * @property {OnErrorCallback<ComponentClass>} [onError] - callback function if error throw by component on init
  */
 
-export { Accordion, Button, CharacterCount, Checkboxes, GOVUKFrontendComponent as Component, ErrorSummary, ExitThisPage, Header, NotificationBanner, PasswordInput, Radios, ServiceNavigation, SkipLink, Tabs, createAll, initAll, isSupported, version };
+export { Accordion, Button, CharacterCount, Checkboxes, GOVUKFrontendComponent as Component, ConfigurableComponent, ErrorSummary, ExitThisPage, Header, NotificationBanner, PasswordInput, Radios, ServiceNavigation, SkipLink, Tabs, createAll, initAll, isSupported, version };
 //# sourceMappingURL=all.bundle.mjs.map