RubyGems - govuk_publishing_components - Versions diffs - 44.0.0 → 44.2.0 - Mend

govuk_publishing_components 44.0.0 → 44.2.0

Files changed (146) hide show

data/node_modules/govuk-frontend/dist/govuk/components/header/header.bundle.mjs CHANGED Viewed

@@ -6,12 +6,28 @@ function getBreakpoint(name) {
     value: value || undefined
   };
 }
+function isInitialised($root, moduleName) {
+  return $root instanceof HTMLElement && $root.hasAttribute(`data-${moduleName}-init`);
+}
+/**
+ * Checks if GOV.UK Frontend is supported on this page
+ *
+ * Some browsers will load and run our JavaScript but GOV.UK Frontend
+ * won't be supported.
+ *
+ * @param {HTMLElement | null} [$scope] - (internal) `<body>` HTML element checked for browser support
+ * @returns {boolean} Whether GOV.UK Frontend is supported on this page
+ */
 function isSupported($scope = document.body) {
   if (!$scope) {
     return false;
   }
   return $scope.classList.contains('govuk-frontend-supported');
 }
+function formatErrorMessage(Component, message) {
+  return `${Component.moduleName}: ${message}`;
+}
 /**
  * Schema for component config
@@ -35,6 +51,10 @@ function isSupported($scope = document.body) {
  * @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
+ */
 class GOVUKFrontendError extends Error {
   constructor(...args) {
@@ -59,30 +79,85 @@ class ElementError extends GOVUKFrontendError {
     let message = typeof messageOrOptions === 'string' ? messageOrOptions : '';
     if (typeof messageOrOptions === 'object') {
       const {
-        componentName,
+        component,
         identifier,
         element,
         expectedType
       } = messageOrOptions;
-      message = `${componentName}: ${identifier}`;
+      message = identifier;
       message += element ? ` is not of type ${expectedType != null ? expectedType : 'HTMLElement'}` : ' not found';
+      message = formatErrorMessage(component, message);
     }
     super(message);
     this.name = 'ElementError';
   }
 }
+class InitError extends GOVUKFrontendError {
+  constructor(componentOrMessage) {
+    const message = typeof componentOrMessage === 'string' ? componentOrMessage : formatErrorMessage(componentOrMessage, `Root element (\`$root\`) already initialised`);
+    super(message);
+    this.name = 'InitError';
+  }
+}
+/**
+ * @typedef {import('../common/index.mjs').ComponentWithModuleName} ComponentWithModuleName
+ */
 class GOVUKFrontendComponent {
-  constructor() {
-    this.checkSupport();
+  /**
+   * Returns the root element of the component
+   *
+   * @protected
+   * @returns {RootElementType} - the root element of component
+   */
+  get $root() {
+    return this._$root;
   }
-  checkSupport() {
+  constructor($root) {
+    this._$root = void 0;
+    const childConstructor = this.constructor;
+    if (typeof childConstructor.moduleName !== 'string') {
+      throw new InitError(`\`moduleName\` not defined in component`);
+    }
+    if (!($root instanceof childConstructor.elementType)) {
+      throw new ElementError({
+        element: $root,
+        component: childConstructor,
+        identifier: 'Root element (`$root`)',
+        expectedType: childConstructor.elementType.name
+      });
+    } else {
+      this._$root = $root;
+    }
+    childConstructor.checkSupport();
+    this.checkInitialised();
+    const moduleName = childConstructor.moduleName;
+    this.$root.setAttribute(`data-${moduleName}-init`, '');
+  }
+  checkInitialised() {
+    const constructor = this.constructor;
+    const moduleName = constructor.moduleName;
+    if (moduleName && isInitialised(this.$root, moduleName)) {
+      throw new InitError(constructor);
+    }
+  }
+  static checkSupport() {
     if (!isSupported()) {
       throw new SupportError();
     }
   }
 }
+/**
+ * @typedef ChildClass
+ * @property {string} moduleName - The module name that'll be looked for in the DOM when initialising the component
+ */
+/**
+ * @typedef {typeof GOVUKFrontendComponent & ChildClass} ChildClassConstructor
+ */
+GOVUKFrontendComponent.elementType = HTMLElement;
 /**
  * Header component
  *
@@ -93,38 +168,29 @@ class Header extends GOVUKFrontendComponent {
    * Apply a matchMedia for desktop which will trigger a state sync if the
    * browser viewport moves between states.
    *
-   * @param {Element | null} $module - HTML element to use for header
+   * @param {Element | null} $root - HTML element to use for header
    */
-  constructor($module) {
-    super();
-    this.$module = void 0;
+  constructor($root) {
+    super($root);
     this.$menuButton = void 0;
     this.$menu = void 0;
     this.menuIsOpen = false;
     this.mql = null;
-    if (!$module) {
-      throw new ElementError({
-        componentName: 'Header',
-        element: $module,
-        identifier: 'Root element (`$module`)'
-      });
-    }
-    this.$module = $module;
-    const $menuButton = $module.querySelector('.govuk-js-header-toggle');
+    const $menuButton = this.$root.querySelector('.govuk-js-header-toggle');
     if (!$menuButton) {
       return this;
     }
     const menuId = $menuButton.getAttribute('aria-controls');
     if (!menuId) {
       throw new ElementError({
-        componentName: 'Header',
+        component: Header,
         identifier: 'Navigation button (`<button class="govuk-js-header-toggle">`) attribute (`aria-controls`)'
       });
     }
     const $menu = document.getElementById(menuId);
     if (!$menu) {
       throw new ElementError({
-        componentName: 'Header',
+        component: Header,
         element: $menu,
         identifier: `Navigation (\`<ul id="${menuId}">\`)`
       });
@@ -138,7 +204,7 @@ class Header extends GOVUKFrontendComponent {
     const breakpoint = getBreakpoint('desktop');
     if (!breakpoint.value) {
       throw new ElementError({
-        componentName: 'Header',
+        component: Header,
         identifier: `CSS custom property (\`${breakpoint.property}\`) on pseudo-class \`:root\``
       });
     }

data/node_modules/govuk-frontend/dist/govuk/components/header/header.bundle.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"header.bundle.mjs","sources":["../../../../src/govuk/common/index.mjs","../../../../src/govuk/errors/index.mjs","../../../../src/govuk/govuk-frontend-component.mjs","../../../../src/govuk/components/header/header.mjs"],"sourcesContent":["import { normaliseString } from './normalise-string.mjs'\n\n/*\n Common helpers which do not require polyfill.\n \n IMPORTANT: If a helper require a polyfill, please isolate it in its own module\n * so that the polyfill can be properly tree-shaken and does not burden\n * the components that do not need that helper\n /\n\n/\n Config merging function\n \n Takes any number of objects and combines them together, with\n * greatest priority on the LAST item passed in.\n \n @internal\n * @param {...{ [key: string]: unknown }} configObjects - Config objects to merge\n * @returns {{ [key: string]: unknown }} A merged config object\n /\nexport function mergeConfigs(...configObjects) {\n // Start with an empty object as our base\n /* @type {{ [key: string]: unknown }} /\n const formattedConfigObject = {}\n\n // Loop through each of the passed objects\n for (const configObject of configObjects) {\n for (const key of Object.keys(configObject)) {\n const option = formattedConfigObject[key]\n const override = configObject[key]\n\n // Push their keys one-by-one into formattedConfigObject. Any duplicate\n // keys with object values will be merged, otherwise the new value will\n // override the existing value.\n if (isObject(option) && isObject(override)) {\n // @ts-expect-error Index signature for type 'string' is missing\n formattedConfigObject[key] = mergeConfigs(option, override)\n } else {\n // Apply override\n formattedConfigObject[key] = override\n }\n }\n }\n\n return formattedConfigObject\n}\n\n/\n Extracts keys starting with a particular namespace from dataset ('data-')\n object, removing the namespace in the process, normalising all values\n \n @internal\n * @param {{ schema: Schema }} Component - Component class\n * @param {DOMStringMap} dataset - The object to extract key-value pairs from\n * @param {string} namespace - The namespace to filter keys with\n * @returns {ObjectNested \| undefined} Nested object with dot-separated key namespace removed\n /\nexport function extractConfigByNamespace(Component, dataset, namespace) {\n const property = Component.schema.properties[namespace]\n\n // Only extract configs for object schema properties\n if (property?.type !== 'object') {\n return\n }\n\n // Add default empty config\n const newObject = {\n [namespace]: /* @type {ObjectNested} / ({})\n }\n\n for (const [key, value] of Object.entries(dataset)) {\n /* @type {ObjectNested \| ObjectNested[NestedKey]} /\n let current = newObject\n\n // Split the key into parts, using . as our namespace separator\n const keyParts = key.split('.')\n\n /\n Create new level per part\n \n e.g. 'i18n.textareaDescription.other' becomes\n * `{ i18n: { textareaDescription: { other } } }`\n /\n for (const [index, name] of keyParts.entries()) {\n if (typeof current === 'object') {\n // Drop down to nested object until the last part\n if (index < keyParts.length - 1) {\n // New nested object (optionally) replaces existing value\n if (!isObject(current[name])) {\n current[name] = {}\n }\n\n // Drop down into new or existing nested object\n current = current[name]\n } else if (key !== namespace) {\n // Normalised value (optionally) replaces existing value\n current[name] = normaliseString(value)\n }\n }\n }\n }\n\n return newObject[namespace]\n}\n\n/\n Get hash fragment from URL\n \n Extract the hash fragment (everything after the hash) from a URL,\n * but not including the hash symbol\n \n @private\n * @param {string} url - URL\n * @returns {string \| undefined} Fragment from URL, without the hash\n /\nexport function getFragmentFromUrl(url) {\n if (!url.includes('#')) {\n return undefined\n }\n\n return url.split('#').pop()\n}\n\n/\n Get GOV.UK Frontend breakpoint value from CSS custom property\n \n @private\n * @param {string} name - Breakpoint name\n * @returns {{ property: string, value?: string }} Breakpoint object\n /\nexport function getBreakpoint(name) {\n const property = `--govuk-frontend-breakpoint-${name}`\n\n // Get value from `<html>` with breakpoints on CSS :root\n const value = window\n .getComputedStyle(document.documentElement)\n .getPropertyValue(property)\n\n return {\n property,\n value: value \|\| undefined\n }\n}\n\n/\n Move focus to element\n \n Sets tabindex to -1 to make the element programmatically focusable,\n * but removes it on blur as the element doesn't need to be focused again.\n \n @private\n * @template {HTMLElement} FocusElement\n * @param {FocusElement} $element - HTML element\n * @param {object} [options] - Handler options\n * @param {function(this: FocusElement): void} [options.onBeforeFocus] - Callback before focus\n * @param {function(this: FocusElement): void} [options.onBlur] - Callback on blur\n /\nexport function setFocus($element, options = {}) {\n const isFocusable = $element.getAttribute('tabindex')\n\n if (!isFocusable) {\n $element.setAttribute('tabindex', '-1')\n }\n\n /\n Handle element focus\n /\n function onFocus() {\n $element.addEventListener('blur', onBlur, { once: true })\n }\n\n /\n Handle element blur\n /\n function onBlur() {\n options.onBlur?.call($element)\n\n if (!isFocusable) {\n $element.removeAttribute('tabindex')\n }\n }\n\n // Add listener to reset element on blur, after focus\n $element.addEventListener('focus', onFocus, { once: true })\n\n // Focus element\n options.onBeforeFocus?.call($element)\n $element.focus()\n}\n\n/\n Checks if GOV.UK Frontend is supported on this page\n \n Some browsers will load and run our JavaScript but GOV.UK Frontend\n * won't be supported.\n \n @internal\n * @param {HTMLElement \| null} [$scope] - HTML element `<body>` checked for browser support\n * @returns {boolean} Whether GOV.UK Frontend is supported on this page\n /\nexport function isSupported($scope = document.body) {\n if (!$scope) {\n return false\n }\n\n return $scope.classList.contains('govuk-frontend-supported')\n}\n\n/\n Validate component config by schema\n \n Follows limited examples in JSON schema for wider support in future\n \n {@link https://ajv.js.org/json-schema.html#compound-keywords}\n * {@link https://ajv.js.org/packages/ajv-errors.html#single-message}\n \n @internal\n * @param {Schema} schema - Config schema\n * @param {{ [key: string]: unknown }} config - Component config\n * @returns {string[]} List of validation errors\n /\nexport function validateConfig(schema, config) {\n const validationErrors = []\n\n // Check errors for each schema\n for (const [name, conditions] of Object.entries(schema)) {\n const errors = []\n\n // Check errors for each schema condition\n if (Array.isArray(conditions)) {\n for (const { required, errorMessage } of conditions) {\n if (!required.every((key) => !!config[key])) {\n errors.push(errorMessage) // Missing config key value\n }\n }\n\n // Check one condition passes or add errors\n if (name === 'anyOf' && !(conditions.length - errors.length >= 1)) {\n validationErrors.push(...errors)\n }\n }\n }\n\n return validationErrors\n}\n\n/\n Check for an array\n \n @internal\n * @param {unknown} option - Option to check\n * @returns {boolean} Whether the option is an array\n /\nfunction isArray(option) {\n return Array.isArray(option)\n}\n\n/\n Check for an object\n \n @internal\n * @param {unknown} option - Option to check\n * @returns {boolean} Whether the option is an object\n /\nfunction isObject(option) {\n return !!option && typeof option === 'object' && !isArray(option)\n}\n\n/\n Schema for component config\n \n @typedef {object} Schema\n * @property {{ [field: string]: SchemaProperty \| undefined }} properties - Schema properties\n * @property {SchemaCondition[]} [anyOf] - List of schema conditions\n /\n\n/\n Schema property for component config\n \n @typedef {object} SchemaProperty\n * @property {'string' \| 'boolean' \| 'number' \| 'object'} type - Property type\n /\n\n/\n Schema condition for component config\n \n @typedef {object} SchemaCondition\n * @property {string[]} required - List of required config fields\n * @property {string} errorMessage - Error message when required config fields not provided\n /\n\n/\n @internal\n * @typedef {keyof ObjectNested} NestedKey\n * @typedef {{ [key: string]: string \| boolean \| number \| ObjectNested \| undefined }} ObjectNested\n /\n","/\n GOV.UK Frontend error\n \n A base class for `Error`s thrown by GOV.UK Frontend.\n \n It is meant to be extended into specific types of errors\n * to be thrown by our code.\n \n @example\n * ```js\n * class MissingRootError extends GOVUKFrontendError {\n * // Setting an explicit name is important as extending the class will not\n * // set a new `name` on the subclass. The `name` property is important\n * // to ensure intelligible error names even if the class name gets\n * // mangled by a minifier\n * name = \"MissingRootError\"\n * }\n * ```\n * @abstract\n /\nexport class GOVUKFrontendError extends Error {\n name = 'GOVUKFrontendError'\n}\n\n/\n Indicates that GOV.UK Frontend is not supported\n /\nexport class SupportError extends GOVUKFrontendError {\n name = 'SupportError'\n\n /\n Checks if GOV.UK Frontend is supported on this page\n \n @param {HTMLElement \| null} [$scope] - HTML element `<body>` checked for browser support\n /\n constructor($scope = document.body) {\n const supportMessage =\n 'noModule' in HTMLScriptElement.prototype\n ? 'GOV.UK Frontend initialised without `<body class=\"govuk-frontend-supported\">` from template `<script>` snippet'\n : 'GOV.UK Frontend is not supported in this browser'\n\n super(\n $scope\n ? supportMessage\n : 'GOV.UK Frontend initialised without `<script type=\"module\">`'\n )\n }\n}\n\n/\n Indicates that a component has received an illegal configuration\n /\nexport class ConfigError extends GOVUKFrontendError {\n name = 'ConfigError'\n}\n\n/\n Indicates an issue with an element (possibly `null` or `undefined`)\n /\nexport class ElementError extends GOVUKFrontendError {\n name = 'ElementError'\n\n /\n @internal\n * @overload\n * @param {string} message - Element error message\n /\n\n /\n @internal\n * @overload\n * @param {ElementErrorOptions} options - Element error options\n /\n\n /\n @internal\n * @param {string \| ElementErrorOptions} messageOrOptions - Element error message or options\n /\n constructor(messageOrOptions) {\n let message = typeof messageOrOptions === 'string' ? messageOrOptions : ''\n\n // Build message from options\n if (typeof messageOrOptions === 'object') {\n const { componentName, identifier, element, expectedType } =\n messageOrOptions\n\n // Add prefix and identifier\n message = `${componentName}: ${identifier}`\n\n // Append reason\n message += element\n ? ` is not of type ${expectedType ?? 'HTMLElement'}`\n : ' not found'\n }\n\n super(message)\n }\n}\n\n/\n Element error options\n \n @internal\n * @typedef {object} ElementErrorOptions\n * @property {string} componentName - The name of the component throwing the error\n * @property {string} identifier - An identifier that'll let the user understand which element has an error. This is whatever makes the most sense\n * @property {Element \| null} [element] - The element in error\n * @property {string} [expectedType] - The type that was expected for the identifier\n /\n","import { isSupported } from './common/index.mjs'\nimport { SupportError } from './errors/index.mjs'\n\n/\n Base Component class\n \n Centralises the behaviours shared by our components\n \n @internal\n * @abstract\n /\nexport class GOVUKFrontendComponent {\n /\n Constructs a new component, validating that GOV.UK Frontend is supported\n \n @internal\n /\n constructor() {\n this.checkSupport()\n }\n\n /\n Validates whether GOV.UK Frontend is supported\n \n @private\n * @throws {SupportError} when GOV.UK Frontend is not supported\n /\n checkSupport() {\n if (!isSupported()) {\n throw new SupportError()\n }\n }\n}\n","import { getBreakpoint } from '../../common/index.mjs'\nimport { ElementError } from '../../errors/index.mjs'\nimport { GOVUKFrontendComponent } from '../../govuk-frontend-component.mjs'\n\n/\n Header component\n \n @preserve\n /\nexport class Header extends GOVUKFrontendComponent {\n /* @private /\n $module\n\n /* @private /\n $menuButton\n\n /* @private /\n $menu\n\n /\n Save the opened/closed state for the nav in memory so that we can\n * accurately maintain state when the screen is changed from small to big and\n * back to small\n \n @private\n /\n menuIsOpen = false\n\n /\n A global const for storing a matchMedia instance which we'll use to detect\n * when a screen size change happens. We rely on it being null if the feature\n * isn't available to initially apply hidden attributes\n \n @private\n * @type {MediaQueryList \| null}\n /\n mql = null\n\n /\n Apply a matchMedia for desktop which will trigger a state sync if the\n * browser viewport moves between states.\n \n @param {Element \| null} $module - HTML element to use for header\n /\n constructor($module) {\n super()\n\n if (!$module) {\n throw new ElementError({\n componentName: 'Header',\n element: $module,\n identifier: 'Root element (`$module`)'\n })\n }\n\n this.$module = $module\n const $menuButton = $module.querySelector('.govuk-js-header-toggle')\n\n // Headers don't necessarily have a navigation. When they don't, the menu\n // toggle won't be rendered by our macro (or may be omitted when writing\n // plain HTML)\n if (!$menuButton) {\n return this\n }\n\n const menuId = $menuButton.getAttribute('aria-controls')\n if (!menuId) {\n throw new ElementError({\n componentName: 'Header',\n identifier:\n 'Navigation button (`<button class=\"govuk-js-header-toggle\">`) attribute (`aria-controls`)'\n })\n }\n\n const $menu = document.getElementById(menuId)\n if (!$menu) {\n throw new ElementError({\n componentName: 'Header',\n element: $menu,\n identifier: `Navigation (\\`<ul id=\"${menuId}\">\\`)`\n })\n }\n\n this.$menu = $menu\n this.$menuButton = $menuButton\n\n this.setupResponsiveChecks()\n\n this.$menuButton.addEventListener('click', () =>\n this.handleMenuButtonClick()\n )\n }\n\n /\n Setup viewport resize check\n \n @private\n /\n setupResponsiveChecks() {\n const breakpoint = getBreakpoint('desktop')\n\n if (!breakpoint.value) {\n throw new ElementError({\n componentName: 'Header',\n identifier: `CSS custom property (\\`${breakpoint.property}\\`) on pseudo-class \\`:root\\``\n })\n }\n\n // Media query list for GOV.UK Frontend desktop breakpoint\n this.mql = window.matchMedia(`(min-width: ${breakpoint.value})`)\n\n // MediaQueryList.addEventListener isn't supported by Safari < 14 so we need\n // to be able to fall back to the deprecated MediaQueryList.addListener\n if ('addEventListener' in this.mql) {\n this.mql.addEventListener('change', () => this.checkMode())\n } else {\n // @ts-expect-error Property 'addListener' does not exist\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n this.mql.addListener(() => this.checkMode())\n }\n\n this.checkMode()\n }\n\n /\n Sync menu state\n \n Uses the global variable menuIsOpen to correctly set the accessible and\n * visual states of the menu and the menu button.\n * Additionally will force the menu to be visible and the menu button to be\n * hidden if the matchMedia is triggered to desktop.\n \n @private\n /\n checkMode() {\n if (!this.mql \|\| !this.$menu \|\| !this.$menuButton) {\n return\n }\n\n if (this.mql.matches) {\n this.$menu.removeAttribute('hidden')\n this.$menuButton.setAttribute('hidden', '')\n } else {\n this.$menuButton.removeAttribute('hidden')\n this.$menuButton.setAttribute('aria-expanded', this.menuIsOpen.toString())\n\n if (this.menuIsOpen) {\n this.$menu.removeAttribute('hidden')\n } else {\n this.$menu.setAttribute('hidden', '')\n }\n }\n }\n\n /\n Handle menu button click\n \n When the menu button is clicked, change the visibility of the menu and then\n * sync the accessibility state and menu button state\n \n @private\n /\n handleMenuButtonClick() {\n this.menuIsOpen = !this.menuIsOpen\n this.checkMode()\n }\n\n /\n Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'govuk-header'\n}\n"],"names":["getBreakpoint","name","property","value","window","getComputedStyle","document","documentElement","getPropertyValue","undefined","isSupported","$scope","body","classList","contains","GOVUKFrontendError","Error","constructor","args","SupportError","supportMessage","HTMLScriptElement","prototype","ElementError","messageOrOptions","message","componentName","identifier","element","expectedType","GOVUKFrontendComponent","checkSupport","Header","$module","$menuButton","$menu","menuIsOpen","mql","querySelector","menuId","getAttribute","getElementById","setupResponsiveChecks","addEventListener","handleMenuButtonClick","breakpoint","matchMedia","checkMode","addListener","matches","removeAttribute","setAttribute","toString","moduleName"],"mappings":"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"}
1	+ {"version":3,"file":"header.bundle.mjs","sources":["../../../../src/govuk/common/index.mjs","../../../../src/govuk/errors/index.mjs","../../../../src/govuk/govuk-frontend-component.mjs","../../../../src/govuk/components/header/header.mjs"],"sourcesContent":["import { normaliseString } from './normalise-string.mjs'\n\n/*\n Common helpers which do not require polyfill.\n \n IMPORTANT: If a helper require a polyfill, please isolate it in its own module\n * so that the polyfill can be properly tree-shaken and does not burden\n * the components that do not need that helper\n /\n\n/\n Config merging function\n \n Takes any number of objects and combines them together, with\n * greatest priority on the LAST item passed in.\n \n @internal\n * @param {...{ [key: string]: unknown }} configObjects - Config objects to merge\n * @returns {{ [key: string]: unknown }} A merged config object\n /\nexport function mergeConfigs(...configObjects) {\n // Start with an empty object as our base\n /* @type {{ [key: string]: unknown }} /\n const formattedConfigObject = {}\n\n // Loop through each of the passed objects\n for (const configObject of configObjects) {\n for (const key of Object.keys(configObject)) {\n const option = formattedConfigObject[key]\n const override = configObject[key]\n\n // Push their keys one-by-one into formattedConfigObject. Any duplicate\n // keys with object values will be merged, otherwise the new value will\n // override the existing value.\n if (isObject(option) && isObject(override)) {\n // @ts-expect-error Index signature for type 'string' is missing\n formattedConfigObject[key] = mergeConfigs(option, override)\n } else {\n // Apply override\n formattedConfigObject[key] = override\n }\n }\n }\n\n return formattedConfigObject\n}\n\n/\n Extracts keys starting with a particular namespace from dataset ('data-')\n object, removing the namespace in the process, normalising all values\n \n @internal\n * @param {{ schema: Schema }} Component - Component class\n * @param {DOMStringMap} dataset - The object to extract key-value pairs from\n * @param {string} namespace - The namespace to filter keys with\n * @returns {ObjectNested \| undefined} Nested object with dot-separated key namespace removed\n /\nexport function extractConfigByNamespace(Component, dataset, namespace) {\n const property = Component.schema.properties[namespace]\n\n // Only extract configs for object schema properties\n if (property?.type !== 'object') {\n return\n }\n\n // Add default empty config\n const newObject = {\n [namespace]: /* @type {ObjectNested} / ({})\n }\n\n for (const [key, value] of Object.entries(dataset)) {\n /* @type {ObjectNested \| ObjectNested[NestedKey]} /\n let current = newObject\n\n // Split the key into parts, using . as our namespace separator\n const keyParts = key.split('.')\n\n /\n Create new level per part\n \n e.g. 'i18n.textareaDescription.other' becomes\n * `{ i18n: { textareaDescription: { other } } }`\n /\n for (const [index, name] of keyParts.entries()) {\n if (typeof current === 'object') {\n // Drop down to nested object until the last part\n if (index < keyParts.length - 1) {\n // New nested object (optionally) replaces existing value\n if (!isObject(current[name])) {\n current[name] = {}\n }\n\n // Drop down into new or existing nested object\n current = current[name]\n } else if (key !== namespace) {\n // Normalised value (optionally) replaces existing value\n current[name] = normaliseString(value)\n }\n }\n }\n }\n\n return newObject[namespace]\n}\n\n/\n Get hash fragment from URL\n \n Extract the hash fragment (everything after the hash) from a URL,\n * but not including the hash symbol\n \n @private\n * @param {string} url - URL\n * @returns {string \| undefined} Fragment from URL, without the hash\n /\nexport function getFragmentFromUrl(url) {\n if (!url.includes('#')) {\n return undefined\n }\n\n return url.split('#').pop()\n}\n\n/\n Get GOV.UK Frontend breakpoint value from CSS custom property\n \n @private\n * @param {string} name - Breakpoint name\n * @returns {{ property: string, value?: string }} Breakpoint object\n /\nexport function getBreakpoint(name) {\n const property = `--govuk-frontend-breakpoint-${name}`\n\n // Get value from `<html>` with breakpoints on CSS :root\n const value = window\n .getComputedStyle(document.documentElement)\n .getPropertyValue(property)\n\n return {\n property,\n value: value \|\| undefined\n }\n}\n\n/\n Move focus to element\n \n Sets tabindex to -1 to make the element programmatically focusable,\n * but removes it on blur as the element doesn't need to be focused again.\n \n @private\n * @template {HTMLElement} FocusElement\n * @param {FocusElement} $element - HTML element\n * @param {object} [options] - Handler options\n * @param {function(this: FocusElement): void} [options.onBeforeFocus] - Callback before focus\n * @param {function(this: FocusElement): void} [options.onBlur] - Callback on blur\n /\nexport function setFocus($element, options = {}) {\n const isFocusable = $element.getAttribute('tabindex')\n\n if (!isFocusable) {\n $element.setAttribute('tabindex', '-1')\n }\n\n /\n Handle element focus\n /\n function onFocus() {\n $element.addEventListener('blur', onBlur, { once: true })\n }\n\n /\n Handle element blur\n /\n function onBlur() {\n options.onBlur?.call($element)\n\n if (!isFocusable) {\n $element.removeAttribute('tabindex')\n }\n }\n\n // Add listener to reset element on blur, after focus\n $element.addEventListener('focus', onFocus, { once: true })\n\n // Focus element\n options.onBeforeFocus?.call($element)\n $element.focus()\n}\n\n/\n Checks if component is already initialised\n \n @internal\n * @param {Element} $root - HTML element to be checked\n * @param {string} moduleName - name of component module\n * @returns {boolean} Whether component is already initialised\n /\nexport function isInitialised($root, moduleName) {\n return (\n $root instanceof HTMLElement &&\n $root.hasAttribute(`data-${moduleName}-init`)\n )\n}\n\n/\n Checks if GOV.UK Frontend is supported on this page\n \n Some browsers will load and run our JavaScript but GOV.UK Frontend\n * won't be supported.\n \n @param {HTMLElement \| null} [$scope] - (internal) `<body>` HTML element checked for browser support\n * @returns {boolean} Whether GOV.UK Frontend is supported on this page\n /\nexport function isSupported($scope = document.body) {\n if (!$scope) {\n return false\n }\n\n return $scope.classList.contains('govuk-frontend-supported')\n}\n\n/\n Validate component config by schema\n \n Follows limited examples in JSON schema for wider support in future\n \n {@link https://ajv.js.org/json-schema.html#compound-keywords}\n * {@link https://ajv.js.org/packages/ajv-errors.html#single-message}\n \n @internal\n * @param {Schema} schema - Config schema\n * @param {{ [key: string]: unknown }} config - Component config\n * @returns {string[]} List of validation errors\n /\nexport function validateConfig(schema, config) {\n const validationErrors = []\n\n // Check errors for each schema\n for (const [name, conditions] of Object.entries(schema)) {\n const errors = []\n\n // Check errors for each schema condition\n if (Array.isArray(conditions)) {\n for (const { required, errorMessage } of conditions) {\n if (!required.every((key) => !!config[key])) {\n errors.push(errorMessage) // Missing config key value\n }\n }\n\n // Check one condition passes or add errors\n if (name === 'anyOf' && !(conditions.length - errors.length >= 1)) {\n validationErrors.push(...errors)\n }\n }\n }\n\n return validationErrors\n}\n\n/\n Check for an array\n \n @internal\n * @param {unknown} option - Option to check\n * @returns {boolean} Whether the option is an array\n /\nfunction isArray(option) {\n return Array.isArray(option)\n}\n\n/\n Check for an object\n \n @internal\n * @param {unknown} option - Option to check\n * @returns {boolean} Whether the option is an object\n /\nfunction isObject(option) {\n return !!option && typeof option === 'object' && !isArray(option)\n}\n\n/\n Format error message\n \n @internal\n * @param {ComponentWithModuleName} Component - Component that threw the error\n * @param {string} message - Error message\n * @returns {string} - Formatted error message\n /\nexport function formatErrorMessage(Component, message) {\n return `${Component.moduleName}: ${message}`\n}\n\n/\n Schema for component config\n \n @typedef {object} Schema\n * @property {{ [field: string]: SchemaProperty \| undefined }} properties - Schema properties\n * @property {SchemaCondition[]} [anyOf] - List of schema conditions\n /\n\n/\n Schema property for component config\n \n @typedef {object} SchemaProperty\n * @property {'string' \| 'boolean' \| 'number' \| 'object'} type - Property type\n /\n\n/\n Schema condition for component config\n \n @typedef {object} SchemaCondition\n * @property {string[]} required - List of required config fields\n * @property {string} errorMessage - Error message when required config fields not provided\n /\n\n/\n @internal\n * @typedef {keyof ObjectNested} NestedKey\n * @typedef {{ [key: string]: string \| boolean \| number \| ObjectNested \| undefined }} ObjectNested\n /\n\n/ eslint-disable jsdoc/valid-types --\n * `{new(...args: any[] ): object}` is not recognised as valid\n * https://github.com/gajus/eslint-plugin-jsdoc/issues/145#issuecomment-1308722878\n * https://github.com/jsdoc-type-pratt-parser/jsdoc-type-pratt-parser/issues/131\n /\n\n/\n * @typedef ComponentWithModuleName\n * @property {string} moduleName - Name of the component\n /\n\n/ eslint-enable jsdoc/valid-types /\n","import { formatErrorMessage } from '../common/index.mjs'\n\n/\n GOV.UK Frontend error\n \n A base class for `Error`s thrown by GOV.UK Frontend.\n \n It is meant to be extended into specific types of errors\n * to be thrown by our code.\n \n @example\n * ```js\n * class MissingRootError extends GOVUKFrontendError {\n * // Setting an explicit name is important as extending the class will not\n * // set a new `name` on the subclass. The `name` property is important\n * // to ensure intelligible error names even if the class name gets\n * // mangled by a minifier\n * name = \"MissingRootError\"\n * }\n * ```\n * @virtual\n /\nexport class GOVUKFrontendError extends Error {\n name = 'GOVUKFrontendError'\n}\n\n/\n Indicates that GOV.UK Frontend is not supported\n /\nexport class SupportError extends GOVUKFrontendError {\n name = 'SupportError'\n\n /\n Checks if GOV.UK Frontend is supported on this page\n \n @param {HTMLElement \| null} [$scope] - HTML element `<body>` checked for browser support\n /\n constructor($scope = document.body) {\n const supportMessage =\n 'noModule' in HTMLScriptElement.prototype\n ? 'GOV.UK Frontend initialised without `<body class=\"govuk-frontend-supported\">` from template `<script>` snippet'\n : 'GOV.UK Frontend is not supported in this browser'\n\n super(\n $scope\n ? supportMessage\n : 'GOV.UK Frontend initialised without `<script type=\"module\">`'\n )\n }\n}\n\n/\n Indicates that a component has received an illegal configuration\n /\nexport class ConfigError extends GOVUKFrontendError {\n name = 'ConfigError'\n}\n\n/\n Indicates an issue with an element (possibly `null` or `undefined`)\n /\nexport class ElementError extends GOVUKFrontendError {\n name = 'ElementError'\n\n /\n @internal\n * @overload\n * @param {string} message - Element error message\n /\n\n /\n @internal\n * @overload\n * @param {ElementErrorOptions} options - Element error options\n /\n\n /\n @internal\n * @param {string \| ElementErrorOptions} messageOrOptions - Element error message or options\n /\n constructor(messageOrOptions) {\n let message = typeof messageOrOptions === 'string' ? messageOrOptions : ''\n\n // Build message from options\n if (typeof messageOrOptions === 'object') {\n const { component, identifier, element, expectedType } = messageOrOptions\n\n message = identifier\n\n // Append reason\n message += element\n ? ` is not of type ${expectedType ?? 'HTMLElement'}`\n : ' not found'\n\n message = formatErrorMessage(component, message)\n }\n\n super(message)\n }\n}\n\n/\n Indicates that a component is already initialised\n /\nexport class InitError extends GOVUKFrontendError {\n name = 'InitError'\n\n /\n @internal\n * @param {ComponentWithModuleName \| string} componentOrMessage - name of the component module\n /\n constructor(componentOrMessage) {\n const message =\n typeof componentOrMessage === 'string'\n ? componentOrMessage\n : formatErrorMessage(\n componentOrMessage,\n `Root element (\\`$root\\`) already initialised`\n )\n\n super(message)\n }\n}\n\n/\n Element error options\n \n @internal\n * @typedef {object} ElementErrorOptions\n * @property {string} identifier - An identifier that'll let the user understand which element has an error. This is whatever makes the most sense\n * @property {Element \| null} [element] - The element in error\n * @property {string} [expectedType] - The type that was expected for the identifier\n * @property {ComponentWithModuleName} component - Component throwing the error\n /\n\n/\n @typedef {import('../common/index.mjs').ComponentWithModuleName} ComponentWithModuleName\n /\n","import { isInitialised, isSupported } from './common/index.mjs'\nimport { ElementError, InitError, SupportError } from './errors/index.mjs'\n\n/\n Base Component class\n \n Centralises the behaviours shared by our components\n \n @virtual\n * @template {Element} [RootElementType=HTMLElement]\n /\nexport class GOVUKFrontendComponent {\n /\n @type {typeof Element}\n /\n static elementType = HTMLElement\n\n // allows Typescript user to work around the lack of types\n // in GOVUKFrontend package, Typescript is not aware of $root\n // in components that extend GOVUKFrontendComponent\n /\n Returns the root element of the component\n \n @protected\n * @returns {RootElementType} - the root element of component\n /\n get $root() {\n return this._$root\n }\n\n /\n @protected\n * @type {RootElementType}\n /\n _$root\n\n /\n Constructs a new component, validating that GOV.UK Frontend is supported\n \n @internal\n * @param {Element \| null} [$root] - HTML element to use for component\n /\n constructor($root) {\n const childConstructor = /* @type {ChildClassConstructor} / (\n this.constructor\n )\n\n // TypeScript does not enforce that inheriting classes will define a `moduleName`\n // (even if we add a `@virtual` `static moduleName` property to this class).\n // While we trust users to do this correctly, we do a little check to provide them\n // a helpful error message.\n //\n // After this, we'll be sure that `childConstructor` has a `moduleName`\n // as expected of the `ChildClassConstructor` we've cast `this.constructor` to.\n if (typeof childConstructor.moduleName !== 'string') {\n throw new InitError(`\\`moduleName\\` not defined in component`)\n }\n\n if (!($root instanceof childConstructor.elementType)) {\n throw new ElementError({\n element: $root,\n component: childConstructor,\n identifier: 'Root element (`$root`)',\n expectedType: childConstructor.elementType.name\n })\n } else {\n this._$root = /* @type {RootElementType} / ($root)\n }\n\n childConstructor.checkSupport()\n\n this.checkInitialised()\n\n const moduleName = childConstructor.moduleName\n\n this.$root.setAttribute(`data-${moduleName}-init`, '')\n }\n\n /\n Validates whether component is already initialised\n \n @private\n * @throws {InitError} when component is already initialised\n /\n checkInitialised() {\n const constructor = /* @type {ChildClassConstructor} / (this.constructor)\n const moduleName = constructor.moduleName\n\n if (moduleName && isInitialised(this.$root, moduleName)) {\n throw new InitError(constructor)\n }\n }\n\n /\n Validates whether components are supported\n \n @throws {SupportError} when the components are not supported\n /\n static checkSupport() {\n if (!isSupported()) {\n throw new SupportError()\n }\n }\n}\n\n/\n @typedef ChildClass\n * @property {string} moduleName - The module name that'll be looked for in the DOM when initialising the component\n /\n\n/\n @typedef {typeof GOVUKFrontendComponent & ChildClass} ChildClassConstructor\n /\n","import { getBreakpoint } from '../../common/index.mjs'\nimport { ElementError } from '../../errors/index.mjs'\nimport { GOVUKFrontendComponent } from '../../govuk-frontend-component.mjs'\n\n/\n Header component\n \n @preserve\n /\nexport class Header extends GOVUKFrontendComponent {\n /* @private /\n $menuButton\n\n /* @private /\n $menu\n\n /\n Save the opened/closed state for the nav in memory so that we can\n * accurately maintain state when the screen is changed from small to big and\n * back to small\n \n @private\n /\n menuIsOpen = false\n\n /\n A global const for storing a matchMedia instance which we'll use to detect\n * when a screen size change happens. We rely on it being null if the feature\n * isn't available to initially apply hidden attributes\n \n @private\n * @type {MediaQueryList \| null}\n /\n mql = null\n\n /\n Apply a matchMedia for desktop which will trigger a state sync if the\n * browser viewport moves between states.\n \n @param {Element \| null} $root - HTML element to use for header\n /\n constructor($root) {\n super($root)\n\n const $menuButton = this.$root.querySelector('.govuk-js-header-toggle')\n\n // Headers don't necessarily have a navigation. When they don't, the menu\n // toggle won't be rendered by our macro (or may be omitted when writing\n // plain HTML)\n if (!$menuButton) {\n return this\n }\n\n const menuId = $menuButton.getAttribute('aria-controls')\n if (!menuId) {\n throw new ElementError({\n component: Header,\n identifier:\n 'Navigation button (`<button class=\"govuk-js-header-toggle\">`) attribute (`aria-controls`)'\n })\n }\n\n const $menu = document.getElementById(menuId)\n if (!$menu) {\n throw new ElementError({\n component: Header,\n element: $menu,\n identifier: `Navigation (\\`<ul id=\"${menuId}\">\\`)`\n })\n }\n\n this.$menu = $menu\n this.$menuButton = $menuButton\n\n this.setupResponsiveChecks()\n\n this.$menuButton.addEventListener('click', () =>\n this.handleMenuButtonClick()\n )\n }\n\n /\n Setup viewport resize check\n \n @private\n /\n setupResponsiveChecks() {\n const breakpoint = getBreakpoint('desktop')\n\n if (!breakpoint.value) {\n throw new ElementError({\n component: Header,\n identifier: `CSS custom property (\\`${breakpoint.property}\\`) on pseudo-class \\`:root\\``\n })\n }\n\n // Media query list for GOV.UK Frontend desktop breakpoint\n this.mql = window.matchMedia(`(min-width: ${breakpoint.value})`)\n\n // MediaQueryList.addEventListener isn't supported by Safari < 14 so we need\n // to be able to fall back to the deprecated MediaQueryList.addListener\n if ('addEventListener' in this.mql) {\n this.mql.addEventListener('change', () => this.checkMode())\n } else {\n // @ts-expect-error Property 'addListener' does not exist\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n this.mql.addListener(() => this.checkMode())\n }\n\n this.checkMode()\n }\n\n /\n Sync menu state\n \n Uses the global variable menuIsOpen to correctly set the accessible and\n * visual states of the menu and the menu button.\n * Additionally will force the menu to be visible and the menu button to be\n * hidden if the matchMedia is triggered to desktop.\n \n @private\n /\n checkMode() {\n if (!this.mql \|\| !this.$menu \|\| !this.$menuButton) {\n return\n }\n\n if (this.mql.matches) {\n this.$menu.removeAttribute('hidden')\n this.$menuButton.setAttribute('hidden', '')\n } else {\n this.$menuButton.removeAttribute('hidden')\n this.$menuButton.setAttribute('aria-expanded', this.menuIsOpen.toString())\n\n if (this.menuIsOpen) {\n this.$menu.removeAttribute('hidden')\n } else {\n this.$menu.setAttribute('hidden', '')\n }\n }\n }\n\n /\n Handle menu button click\n \n When the menu button is clicked, change the visibility of the menu and then\n * sync the accessibility state and menu button state\n \n @private\n /\n handleMenuButtonClick() {\n this.menuIsOpen = !this.menuIsOpen\n this.checkMode()\n }\n\n /\n Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'govuk-header'\n}\n"],"names":["getBreakpoint","name","property","value","window","getComputedStyle","document","documentElement","getPropertyValue","undefined","isInitialised","$root","moduleName","HTMLElement","hasAttribute","isSupported","$scope","body","classList","contains","formatErrorMessage","Component","message","GOVUKFrontendError","Error","constructor","args","SupportError","supportMessage","HTMLScriptElement","prototype","ElementError","messageOrOptions","component","identifier","element","expectedType","InitError","componentOrMessage","GOVUKFrontendComponent","_$root","childConstructor","elementType","checkSupport","checkInitialised","setAttribute","Header","$menuButton","$menu","menuIsOpen","mql","querySelector","menuId","getAttribute","getElementById","setupResponsiveChecks","addEventListener","handleMenuButtonClick","breakpoint","matchMedia","checkMode","addListener","matches","removeAttribute","toString"],"mappings":"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"}

data/node_modules/govuk-frontend/dist/govuk/components/header/header.mjs CHANGED Viewed

@@ -12,38 +12,29 @@ class Header extends GOVUKFrontendComponent {
    * Apply a matchMedia for desktop which will trigger a state sync if the
    * browser viewport moves between states.
    *
-   * @param {Element | null} $module - HTML element to use for header
+   * @param {Element | null} $root - HTML element to use for header
    */
-  constructor($module) {
-    super();
-    this.$module = void 0;
+  constructor($root) {
+    super($root);
     this.$menuButton = void 0;
     this.$menu = void 0;
     this.menuIsOpen = false;
     this.mql = null;
-    if (!$module) {
-      throw new ElementError({
-        componentName: 'Header',
-        element: $module,
-        identifier: 'Root element (`$module`)'
-      });
-    }
-    this.$module = $module;
-    const $menuButton = $module.querySelector('.govuk-js-header-toggle');
+    const $menuButton = this.$root.querySelector('.govuk-js-header-toggle');
     if (!$menuButton) {
       return this;
     }
     const menuId = $menuButton.getAttribute('aria-controls');
     if (!menuId) {
       throw new ElementError({
-        componentName: 'Header',
+        component: Header,
         identifier: 'Navigation button (`<button class="govuk-js-header-toggle">`) attribute (`aria-controls`)'
       });
     }
     const $menu = document.getElementById(menuId);
     if (!$menu) {
       throw new ElementError({
-        componentName: 'Header',
+        component: Header,
         element: $menu,
         identifier: `Navigation (\`<ul id="${menuId}">\`)`
       });
@@ -57,7 +48,7 @@ class Header extends GOVUKFrontendComponent {
     const breakpoint = getBreakpoint('desktop');
     if (!breakpoint.value) {
       throw new ElementError({
-        componentName: 'Header',
+        component: Header,
         identifier: `CSS custom property (\`${breakpoint.property}\`) on pseudo-class \`:root\``
       });
     }

data/node_modules/govuk-frontend/dist/govuk/components/header/header.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"header.mjs","sources":["../../../../src/govuk/components/header/header.mjs"],"sourcesContent":["import { getBreakpoint } from '../../common/index.mjs'\nimport { ElementError } from '../../errors/index.mjs'\nimport { GOVUKFrontendComponent } from '../../govuk-frontend-component.mjs'\n\n/*\n Header component\n \n @preserve\n /\nexport class Header extends GOVUKFrontendComponent {\n /* @private /\n $~~module\n\n /* @private /\n $~~menuButton\n\n /* @private /\n $menu\n\n /\n Save the opened/closed state for the nav in memory so that we can\n * accurately maintain state when the screen is changed from small to big and\n * back to small\n \n @private\n /\n menuIsOpen = false\n\n /\n A global const for storing a matchMedia instance which we'll use to detect\n * when a screen size change happens. We rely on it being null if the feature\n * isn't available to initially apply hidden attributes\n \n @private\n * @type {MediaQueryList \| null}\n /\n mql = null\n\n /\n Apply a matchMedia for desktop which will trigger a state sync if the\n * browser viewport moves between states.\n \n @param {Element \| null} $~~module~~ - HTML element to use for header\n /\n constructor($~~module~~) {\n super(~~)\n\n if (!$module) {\n throw new ElementError({\n componentName: 'Header',\n element:~~ $~~module,\n identifier: 'Root element (`$module`~~)'\n })\n ~~}\n\n this.$module = $module\n~~ const $menuButton = ~~$module~~.querySelector('.govuk-js-header-toggle')\n\n // Headers don't necessarily have a navigation. When they don't, the menu\n // toggle won't be rendered by our macro (or may be omitted when writing\n // plain HTML)\n if (!$menuButton) {\n return this\n }\n\n const menuId = $menuButton.getAttribute('aria-controls')\n if (!menuId) {\n throw new ElementError({\n ~~componentName~~: 'Header',\n identifier:\n 'Navigation button (`<button class=\"govuk-js-header-toggle\">`) attribute (`aria-controls`)'\n })\n }\n\n const $menu = document.getElementById(menuId)\n if (!$menu) {\n throw new ElementError({\n ~~componentName~~: 'Header',\n element: $menu,\n identifier: `Navigation (\\`<ul id=\"${menuId}\">\\`)`\n })\n }\n\n this.$menu = $menu\n this.$menuButton = $menuButton\n\n this.setupResponsiveChecks()\n\n this.$menuButton.addEventListener('click', () =>\n this.handleMenuButtonClick()\n )\n }\n\n /\n Setup viewport resize check\n \n @private\n /\n setupResponsiveChecks() {\n const breakpoint = getBreakpoint('desktop')\n\n if (!breakpoint.value) {\n throw new ElementError({\n ~~componentName~~: 'Header',\n identifier: `CSS custom property (\\`${breakpoint.property}\\`) on pseudo-class \\`:root\\``\n })\n }\n\n // Media query list for GOV.UK Frontend desktop breakpoint\n this.mql = window.matchMedia(`(min-width: ${breakpoint.value})`)\n\n // MediaQueryList.addEventListener isn't supported by Safari < 14 so we need\n // to be able to fall back to the deprecated MediaQueryList.addListener\n if ('addEventListener' in this.mql) {\n this.mql.addEventListener('change', () => this.checkMode())\n } else {\n // @ts-expect-error Property 'addListener' does not exist\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n this.mql.addListener(() => this.checkMode())\n }\n\n this.checkMode()\n }\n\n /\n Sync menu state\n \n Uses the global variable menuIsOpen to correctly set the accessible and\n * visual states of the menu and the menu button.\n * Additionally will force the menu to be visible and the menu button to be\n * hidden if the matchMedia is triggered to desktop.\n \n @private\n /\n checkMode() {\n if (!this.mql \|\| !this.$menu \|\| !this.$menuButton) {\n return\n }\n\n if (this.mql.matches) {\n this.$menu.removeAttribute('hidden')\n this.$menuButton.setAttribute('hidden', '')\n } else {\n this.$menuButton.removeAttribute('hidden')\n this.$menuButton.setAttribute('aria-expanded', this.menuIsOpen.toString())\n\n if (this.menuIsOpen) {\n this.$menu.removeAttribute('hidden')\n } else {\n this.$menu.setAttribute('hidden', '')\n }\n }\n }\n\n /\n Handle menu button click\n \n When the menu button is clicked, change the visibility of the menu and then\n * sync the accessibility state and menu button state\n \n @private\n /\n handleMenuButtonClick() {\n this.menuIsOpen = !this.menuIsOpen\n this.checkMode()\n }\n\n /\n Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'govuk-header'\n}\n"],"names":["Header","GOVUKFrontendComponent","constructor","$~~module~~","$menuButton","$menu","menuIsOpen","mql","~~ElementError~~","~~componentName~~","~~element~~","~~identifier~~","~~querySelector~~","~~menuId~~","~~getAttribute~~","~~document~~","~~getElementById~~","setupResponsiveChecks","addEventListener","handleMenuButtonClick","breakpoint","getBreakpoint","value","property","window","matchMedia","checkMode","addListener","matches","removeAttribute","setAttribute","toString","moduleName"],"mappings":";;;;AAIA;AACA;AACA;AACA;AACA;AACO,MAAMA,MAAM,SAASC,sBAAsB,CAAC;~~AA6BjD~~;AACF;AACA;AACA;AACA;AACA;EACEC,WAAWA,CAACC,~~OAAO~~,EAAE;~~AACnB~~,~~IAAA,~~KAAK,~~EAAE~~,~~CAAA;AAAA~~,~~IAAA~~,~~IAAA,CAlCTA,OAAO,GAAA,KAAA,~~CAAA~~,CAAA~~;AAAA,IAAA,IAAA,~~CAGPC~~,WAAW,GAAA,KAAA,CAAA,CAAA;AAAA,IAAA,IAAA,CAGXC,KAAK,GAAA,KAAA,CAAA,CAAA;IAAA,IASLC,CAAAA,UAAU,GAAG,KAAK,CAAA;IAAA,IAUlBC,CAAAA,GAAG,GAAG,IAAI,CAAA;IAWR,~~IAAI~~,~~CAACJ~~,~~OAAO~~,~~EAAE;MACZ,MAAM,IAAIK,YAAY,CAAC;AACrBC,QAAAA,aAAa,EAAE,QAAQ;AACvBC,QAAAA,OAAO,EAAEP,OAAO;AAChBQ,QAAAA,UAAU,EAAE,0BAAA;AACd,OAAC,CAAC,CAAA;AACJ,KAAA;IAEA,~~IAAI,~~CAACR~~,~~OAAO~~,~~GAAGA~~,~~OAAO,CAAA;AACtB,IAAA,MAAMC,WAAW,GAAGD,OAAO,CAACS,~~aAAa,CAAC,yBAAyB,CAAC,CAAA;~~IAKpE~~,IAAI,~~CAACR~~,WAAW,EAAE;AAChB,MAAA,OAAO,IAAI,CAAA;AACb,KAAA;AAEA,IAAA,~~MAAMS~~,MAAM,~~GAAGT~~,WAAW,~~CAACU~~,YAAY,CAAC,eAAe,CAAC,CAAA;IACxD,IAAI,CAACD,MAAM,EAAE;MACX,MAAM,~~IAAIL~~,YAAY,CAAC;AACrBC,QAAAA,~~aAAa~~,~~EAAE~~,~~QAAQ~~;~~AACvBE~~,QAAAA,UAAU,EACR,2FAAA;AACJ,OAAC,CAAC,CAAA;AACJ,KAAA;AAEA,IAAA,~~MAAMN~~,KAAK,~~GAAGU~~,QAAQ,CAACC,cAAc,~~CAACH~~,MAAM,CAAC,CAAA;IAC7C,IAAI,~~CAACR~~,KAAK,EAAE;MACV,MAAM,~~IAAIG~~,YAAY,CAAC;AACrBC,QAAAA,~~aAAa~~,~~EAAE~~,~~QAAQ~~;~~AACvBC~~,QAAAA,OAAO,~~EAAEL~~,KAAK;~~QACdM~~,UAAU,EAAE,~~yBAAyBE~~,MAAM,CAAA,KAAA,CAAA;AAC7C,OAAC,CAAC,CAAA;AACJ,KAAA;IAEA,IAAI,~~CAACR~~,KAAK,GAAGA,KAAK,CAAA;IAClB,IAAI,CAACD,WAAW,GAAGA,WAAW,CAAA;IAE9B,IAAI,CAACa,qBAAqB,EAAE,CAAA;AAE5B,IAAA,IAAI,CAACb,WAAW,CAACc,gBAAgB,CAAC,OAAO,EAAE,MACzC,IAAI,CAACC,qBAAqB,EAC5B,CAAC,CAAA;AACH,GAAA;AAOAF,EAAAA,qBAAqBA,GAAG;AACtB,IAAA,MAAMG,UAAU,GAAGC,aAAa,CAAC,SAAS,CAAC,CAAA;AAE3C,IAAA,IAAI,CAACD,UAAU,CAACE,KAAK,EAAE;MACrB,MAAM,~~IAAId~~,YAAY,CAAC;AACrBC,QAAAA,~~aAAa~~,~~EAAE~~,~~QAAQ~~;~~AACvBE~~,QAAAA,UAAU,EAAE,CAAA,uBAAA,~~EAA0BS~~,UAAU,CAACG,QAAQ,CAAA,6BAAA,CAAA;AAC3D,OAAC,CAAC,CAAA;AACJ,KAAA;AAGA,IAAA,IAAI,CAAChB,GAAG,GAAGiB,MAAM,CAACC,UAAU,CAAC,CAAA,YAAA,EAAeL,UAAU,CAACE,KAAK,CAAA,CAAA,CAAG,CAAC,CAAA;AAIhE,IAAA,IAAI,kBAAkB,IAAI,IAAI,CAACf,GAAG,EAAE;AAClC,MAAA,IAAI,CAACA,GAAG,CAACW,gBAAgB,CAAC,QAAQ,EAAE,MAAM,IAAI,CAACQ,SAAS,EAAE,CAAC,CAAA;AAC7D,KAAC,MAAM;MAGL,IAAI,CAACnB,GAAG,CAACoB,WAAW,CAAC,MAAM,IAAI,CAACD,SAAS,EAAE,CAAC,CAAA;AAC9C,KAAA;IAEA,IAAI,CAACA,SAAS,EAAE,CAAA;AAClB,GAAA;AAYAA,EAAAA,SAASA,GAAG;AACV,IAAA,IAAI,CAAC,IAAI,CAACnB,GAAG,IAAI,CAAC,IAAI,CAACF,KAAK,IAAI,CAAC,IAAI,CAACD,WAAW,EAAE;AACjD,MAAA,OAAA;AACF,KAAA;AAEA,IAAA,IAAI,IAAI,CAACG,GAAG,CAACqB,OAAO,EAAE;AACpB,MAAA,IAAI,CAACvB,KAAK,CAACwB,eAAe,CAAC,QAAQ,CAAC,CAAA;MACpC,IAAI,CAACzB,WAAW,CAAC0B,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAA;AAC7C,KAAC,MAAM;AACL,MAAA,IAAI,CAAC1B,WAAW,CAACyB,eAAe,CAAC,QAAQ,CAAC,CAAA;AAC1C,MAAA,IAAI,CAACzB,WAAW,CAAC0B,YAAY,CAAC,eAAe,EAAE,IAAI,CAACxB,UAAU,CAACyB,QAAQ,EAAE,CAAC,CAAA;MAE1E,IAAI,IAAI,CAACzB,UAAU,EAAE;AACnB,QAAA,IAAI,CAACD,KAAK,CAACwB,eAAe,CAAC,QAAQ,CAAC,CAAA;AACtC,OAAC,MAAM;QACL,IAAI,CAACxB,KAAK,CAACyB,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAA;AACvC,OAAA;AACF,KAAA;AACF,GAAA;AAUAX,EAAAA,qBAAqBA,GAAG;AACtB,IAAA,IAAI,CAACb,UAAU,GAAG,CAAC,IAAI,CAACA,UAAU,CAAA;IAClC,IAAI,CAACoB,SAAS,EAAE,CAAA;AAClB,GAAA;AAMF,CAAA;~~AAlKa1B~~,MAAM,~~CAiKVgC~~,UAAU,GAAG,cAAc;;;;"}
1	+ {"version":3,"file":"header.mjs","sources":["../../../../src/govuk/components/header/header.mjs"],"sourcesContent":["import { getBreakpoint } from '../../common/index.mjs'\nimport { ElementError } from '../../errors/index.mjs'\nimport { GOVUKFrontendComponent } from '../../govuk-frontend-component.mjs'\n\n/*\n Header component\n \n @preserve\n /\nexport class Header extends GOVUKFrontendComponent {\n /* @private /\n $menuButton\n\n /* @private /\n $menu\n\n /\n Save the opened/closed state for the nav in memory so that we can\n * accurately maintain state when the screen is changed from small to big and\n * back to small\n \n @private\n /\n menuIsOpen = false\n\n /\n A global const for storing a matchMedia instance which we'll use to detect\n * when a screen size change happens. We rely on it being null if the feature\n * isn't available to initially apply hidden attributes\n \n @private\n * @type {MediaQueryList \| null}\n /\n mql = null\n\n /\n Apply a matchMedia for desktop which will trigger a state sync if the\n * browser viewport moves between states.\n \n @param {Element \| null} $root - HTML element to use for header\n /\n constructor($root) {\n super($root)\n\n const $menuButton = this.$root.querySelector('.govuk-js-header-toggle')\n\n // Headers don't necessarily have a navigation. When they don't, the menu\n // toggle won't be rendered by our macro (or may be omitted when writing\n // plain HTML)\n if (!$menuButton) {\n return this\n }\n\n const menuId = $menuButton.getAttribute('aria-controls')\n if (!menuId) {\n throw new ElementError({\n component: Header,\n identifier:\n 'Navigation button (`<button class=\"govuk-js-header-toggle\">`) attribute (`aria-controls`)'\n })\n }\n\n const $menu = document.getElementById(menuId)\n if (!$menu) {\n throw new ElementError({\n component: Header,\n element: $menu,\n identifier: `Navigation (\\`<ul id=\"${menuId}\">\\`)`\n })\n }\n\n this.$menu = $menu\n this.$menuButton = $menuButton\n\n this.setupResponsiveChecks()\n\n this.$menuButton.addEventListener('click', () =>\n this.handleMenuButtonClick()\n )\n }\n\n /\n Setup viewport resize check\n \n @private\n /\n setupResponsiveChecks() {\n const breakpoint = getBreakpoint('desktop')\n\n if (!breakpoint.value) {\n throw new ElementError({\n component: Header,\n identifier: `CSS custom property (\\`${breakpoint.property}\\`) on pseudo-class \\`:root\\``\n })\n }\n\n // Media query list for GOV.UK Frontend desktop breakpoint\n this.mql = window.matchMedia(`(min-width: ${breakpoint.value})`)\n\n // MediaQueryList.addEventListener isn't supported by Safari < 14 so we need\n // to be able to fall back to the deprecated MediaQueryList.addListener\n if ('addEventListener' in this.mql) {\n this.mql.addEventListener('change', () => this.checkMode())\n } else {\n // @ts-expect-error Property 'addListener' does not exist\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call\n this.mql.addListener(() => this.checkMode())\n }\n\n this.checkMode()\n }\n\n /\n Sync menu state\n \n Uses the global variable menuIsOpen to correctly set the accessible and\n * visual states of the menu and the menu button.\n * Additionally will force the menu to be visible and the menu button to be\n * hidden if the matchMedia is triggered to desktop.\n \n @private\n /\n checkMode() {\n if (!this.mql \|\| !this.$menu \|\| !this.$menuButton) {\n return\n }\n\n if (this.mql.matches) {\n this.$menu.removeAttribute('hidden')\n this.$menuButton.setAttribute('hidden', '')\n } else {\n this.$menuButton.removeAttribute('hidden')\n this.$menuButton.setAttribute('aria-expanded', this.menuIsOpen.toString())\n\n if (this.menuIsOpen) {\n this.$menu.removeAttribute('hidden')\n } else {\n this.$menu.setAttribute('hidden', '')\n }\n }\n }\n\n /\n Handle menu button click\n \n When the menu button is clicked, change the visibility of the menu and then\n * sync the accessibility state and menu button state\n \n @private\n /\n handleMenuButtonClick() {\n this.menuIsOpen = !this.menuIsOpen\n this.checkMode()\n }\n\n /\n Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'govuk-header'\n}\n"],"names":["Header","GOVUKFrontendComponent","constructor","$root","$menuButton","$menu","menuIsOpen","mql","querySelector","menuId","getAttribute","ElementError","component","identifier","document","getElementById","element","setupResponsiveChecks","addEventListener","handleMenuButtonClick","breakpoint","getBreakpoint","value","property","window","matchMedia","checkMode","addListener","matches","removeAttribute","setAttribute","toString","moduleName"],"mappings":"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"}

data/node_modules/govuk-frontend/dist/govuk/components/header/template-with-full-width-border.html ADDED Viewed

@@ -0,0 +1,24 @@
+<header class="govuk-header govuk-header--full-width-border" data-module="govuk-header">
+  <div class="govuk-header__container govuk-width-container">
+    <div class="govuk-header__logo">
+      <a href="/" class="govuk-header__link govuk-header__link--homepage">
+        <svg
+          focusable="false"
+          role="img"
+          class="govuk-header__logotype"
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 148 30"
+          height="30"
+          width="148"
+          aria-label="GOV.UK"
+        >
+          <title>GOV.UK</title>
+          <path d="M22.6 10.4c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4m-5.9 6.7c-.9.4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4m10.8-3.7c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s0 2-1 2.4m3.3 4.8c-1 .4-2-.1-2.4-1-.4-.9.1-2 1-2.4.9-.4 2 .1 2.4 1s-.1 2-1 2.4M17 4.7l2.3 1.2V2.5l-2.3.7-.2-.2.9-3h-3.4l.9 3-.2.2c-.1.1-2.3-.7-2.3-.7v3.4L15 4.7c.1.1.1.2.2.2l-1.3 4c-.1.2-.1.4-.1.6 0 1.1.8 2 1.9 2.2h.7c1-.2 1.9-1.1 1.9-2.1 0-.2 0-.4-.1-.6l-1.3-4c-.1-.2 0-.2.1-.3m-7.6 5.7c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s0 2 1 2.4m-5 3c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s.1 2 1 2.4m-3.2 4.8c.9.4 2-.1 2.4-1 .4-.9-.1-2-1-2.4-.9-.4-2 .1-2.4 1s0 2 1 2.4m14.8 11c4.4 0 8.6.3 12.3.8 1.1-4.5 2.4-7 3.7-8.8l-2.5-.9c.2 1.3.3 1.9 0 2.7-.4-.4-.8-1.1-1.1-2.3l-1.2 4c.7-.5 1.3-.8 2-.9-1.1 2.5-2.6 3.1-3.5 3-1.1-.2-1.7-1.2-1.5-2.1.3-1.2 1.5-1.5 2.1-.1 1.1-2.3-.8-3-2-2.3 1.9-1.9 2.1-3.5.6-5.6-2.1 1.6-2.1 3.2-1.2 5.5-1.2-1.4-3.2-.6-2.5 1.6.9-1.4 2.1-.5 1.9.8-.2 1.1-1.7 2.1-3.5 1.9-2.7-.2-2.9-2.1-2.9-3.6.7-.1 1.9.5 2.9 1.9l.4-4.3c-1.1 1.1-2.1 1.4-3.2 1.4.4-1.2 2.1-3 2.1-3h-5.4s1.7 1.9 2.1 3c-1.1 0-2.1-.2-3.2-1.4l.4 4.3c1-1.4 2.2-2 2.9-1.9-.1 1.5-.2 3.4-2.9 3.6-1.9.2-3.4-.8-3.5-1.9-.2-1.3 1-2.2 1.9-.8.7-2.3-1.2-3-2.5-1.6.9-2.2.9-3.9-1.2-5.5-1.5 2-1.3 3.7.6 5.6-1.2-.7-3.1 0-2 2.3.6-1.4 1.8-1.1 2.1.1.2.9-.3 1.9-1.5 2.1-.9.2-2.4-.5-3.5-3 .6 0 1.2.3 2 .9l-1.2-4c-.3 1.1-.7 1.9-1.1 2.3-.3-.8-.2-1.4 0-2.7l-2.9.9C1.3 23 2.6 25.5 3.7 30c3.7-.5 7.9-.8 12.3-.8m28.3-11.6c0 .9.1 1.7.3 2.5.2.8.6 1.5 1 2.2.5.6 1 1.1 1.7 1.5.7.4 1.5.6 2.5.6.9 0 1.7-.1 2.3-.4s1.1-.7 1.5-1.1c.4-.4.6-.9.8-1.5.1-.5.2-1 .2-1.5v-.2h-5.3v-3.2h9.4V28H55v-2.5c-.3.4-.6.8-1 1.1-.4.3-.8.6-1.3.9-.5.2-1 .4-1.6.6s-1.2.2-1.8.2c-1.5 0-2.9-.3-4-.8-1.2-.6-2.2-1.3-3-2.3-.8-1-1.4-2.1-1.8-3.4-.3-1.4-.5-2.8-.5-4.3s.2-2.9.7-4.2c.5-1.3 1.1-2.4 2-3.4.9-1 1.9-1.7 3.1-2.3 1.2-.6 2.6-.8 4.1-.8 1 0 1.9.1 2.8.3.9.2 1.7.6 2.4 1s1.4.9 1.9 1.5c.6.6 1 1.3 1.4 2l-3.7 2.1c-.2-.4-.5-.9-.8-1.2-.3-.4-.6-.7-1-1-.4-.3-.8-.5-1.3-.7-.5-.2-1.1-.2-1.7-.2-1 0-1.8.2-2.5.6-.7.4-1.3.9-1.7 1.5-.5.6-.8 1.4-1 2.2-.3.8-.4 1.9-.4 2.7zM71.5 6.8c1.5 0 2.9.3 4.2.8 1.2.6 2.3 1.3 3.1 2.3.9 1 1.5 2.1 2 3.4s.7 2.7.7 4.2-.2 2.9-.7 4.2c-.4 1.3-1.1 2.4-2 3.4-.9 1-1.9 1.7-3.1 2.3-1.2.6-2.6.8-4.2.8s-2.9-.3-4.2-.8c-1.2-.6-2.3-1.3-3.1-2.3-.9-1-1.5-2.1-2-3.4-.4-1.3-.7-2.7-.7-4.2s.2-2.9.7-4.2c.4-1.3 1.1-2.4 2-3.4.9-1 1.9-1.7 3.1-2.3 1.2-.5 2.6-.8 4.2-.8zm0 17.6c.9 0 1.7-.2 2.4-.5s1.3-.8 1.7-1.4c.5-.6.8-1.3 1.1-2.2.2-.8.4-1.7.4-2.7v-.1c0-1-.1-1.9-.4-2.7-.2-.8-.6-1.6-1.1-2.2-.5-.6-1.1-1.1-1.7-1.4-.7-.3-1.5-.5-2.4-.5s-1.7.2-2.4.5-1.3.8-1.7 1.4c-.5.6-.8 1.3-1.1 2.2-.2.8-.4 1.7-.4 2.7v.1c0 1 .1 1.9.4 2.7.2.8.6 1.6 1.1 2.2.5.6 1.1 1.1 1.7 1.4.6.3 1.4.5 2.4.5zM88.9 28 83 7h4.7l4 15.7h.1l4-15.7h4.7l-5.9 21h-5.7zm28.8-3.6c.6 0 1.2-.1 1.7-.3.5-.2 1-.4 1.4-.8.4-.4.7-.8.9-1.4.2-.6.3-1.2.3-2v-13h4.1v13.6c0 1.2-.2 2.2-.6 3.1s-1 1.7-1.8 2.4c-.7.7-1.6 1.2-2.7 1.5-1 .4-2.2.5-3.4.5-1.2 0-2.4-.2-3.4-.5-1-.4-1.9-.9-2.7-1.5-.8-.7-1.3-1.5-1.8-2.4-.4-.9-.6-2-.6-3.1V6.9h4.2v13c0 .8.1 1.4.3 2 .2.6.5 1 .9 1.4.4.4.8.6 1.4.8.6.2 1.1.3 1.8.3zm13-17.4h4.2v9.1l7.4-9.1h5.2l-7.2 8.4L148 28h-4.9l-5.5-9.4-2.7 3V28h-4.2V7zm-27.6 16.1c-1.5 0-2.7 1.2-2.7 2.7s1.2 2.7 2.7 2.7 2.7-1.2 2.7-2.7-1.2-2.7-2.7-2.7z"></path>
+        </svg>
+        <span class="govuk-header__product-name">
+          Product Name
+        </span>
+      </a>
+    </div>
+  </div>
+</header>

data/node_modules/govuk-frontend/dist/govuk/components/notification-banner/notification-banner.bundle.js CHANGED Viewed

@@ -98,6 +98,19 @@
     (_options$onBeforeFocu = options.onBeforeFocus) == null || _options$onBeforeFocu.call($element);
     $element.focus();
   }
+  function isInitialised($root, moduleName) {
+    return $root instanceof HTMLElement && $root.hasAttribute(`data-${moduleName}-init`);
+  }
+  /**
+   * Checks if GOV.UK Frontend is supported on this page
+   *
+   * Some browsers will load and run our JavaScript but GOV.UK Frontend
+   * won't be supported.
+   *
+   * @param {HTMLElement | null} [$scope] - (internal) `<body>` HTML element checked for browser support
+   * @returns {boolean} Whether GOV.UK Frontend is supported on this page
+   */
   function isSupported($scope = document.body) {
     if (!$scope) {
       return false;
@@ -110,6 +123,9 @@
   function isObject(option) {
     return !!option && typeof option === 'object' && !isArray(option);
   }
+  function formatErrorMessage(Component, message) {
+    return `${Component.moduleName}: ${message}`;
+  }
   /**
    * Schema for component config
@@ -133,6 +149,10 @@
    * @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 = {};
@@ -170,30 +190,85 @@
       let message = typeof messageOrOptions === 'string' ? messageOrOptions : '';
       if (typeof messageOrOptions === 'object') {
         const {
-          componentName,
+          component,
           identifier,
           element,
           expectedType
         } = messageOrOptions;
-        message = `${componentName}: ${identifier}`;
+        message = identifier;
         message += element ? ` is not of type ${expectedType != null ? expectedType : 'HTMLElement'}` : ' not found';
+        message = formatErrorMessage(component, message);
       }
       super(message);
       this.name = 'ElementError';
     }
   }
+  class InitError extends GOVUKFrontendError {
+    constructor(componentOrMessage) {
+      const message = typeof componentOrMessage === 'string' ? componentOrMessage : formatErrorMessage(componentOrMessage, `Root element (\`$root\`) already initialised`);
+      super(message);
+      this.name = 'InitError';
+    }
+  }
+  /**
+   * @typedef {import('../common/index.mjs').ComponentWithModuleName} ComponentWithModuleName
+   */
   class GOVUKFrontendComponent {
-    constructor() {
-      this.checkSupport();
+    /**
+     * Returns the root element of the component
+     *
+     * @protected
+     * @returns {RootElementType} - the root element of component
+     */
+    get $root() {
+      return this._$root;
     }
-    checkSupport() {
+    constructor($root) {
+      this._$root = void 0;
+      const childConstructor = this.constructor;
+      if (typeof childConstructor.moduleName !== 'string') {
+        throw new InitError(`\`moduleName\` not defined in component`);
+      }
+      if (!($root instanceof childConstructor.elementType)) {
+        throw new ElementError({
+          element: $root,
+          component: childConstructor,
+          identifier: 'Root element (`$root`)',
+          expectedType: childConstructor.elementType.name
+        });
+      } else {
+        this._$root = $root;
+      }
+      childConstructor.checkSupport();
+      this.checkInitialised();
+      const moduleName = childConstructor.moduleName;
+      this.$root.setAttribute(`data-${moduleName}-init`, '');
+    }
+    checkInitialised() {
+      const constructor = this.constructor;
+      const moduleName = constructor.moduleName;
+      if (moduleName && isInitialised(this.$root, moduleName)) {
+        throw new InitError(constructor);
+      }
+    }
+    static checkSupport() {
       if (!isSupported()) {
         throw new SupportError();
       }
     }
   }
+  /**
+   * @typedef ChildClass
+   * @property {string} moduleName - The module name that'll be looked for in the DOM when initialising the component
+   */
+  /**
+   * @typedef {typeof GOVUKFrontendComponent & ChildClass} ChildClassConstructor
+   */
+  GOVUKFrontendComponent.elementType = HTMLElement;
   /**
    * Notification Banner component
    *
@@ -201,24 +276,15 @@
    */
   class NotificationBanner extends GOVUKFrontendComponent {
     /**
-     * @param {Element | null} $module - HTML element to use for notification banner
+     * @param {Element | null} $root - HTML element to use for notification banner
      * @param {NotificationBannerConfig} [config] - Notification banner config
      */
-    constructor($module, config = {}) {
-      super();
-      this.$module = void 0;
+    constructor($root, config = {}) {
+      super($root);
       this.config = void 0;
-      if (!($module instanceof HTMLElement)) {
-        throw new ElementError({
-          componentName: 'Notification banner',
-          element: $module,
-          identifier: 'Root element (`$module`)'
-        });
-      }
-      this.$module = $module;
-      this.config = mergeConfigs(NotificationBanner.defaults, config, normaliseDataset(NotificationBanner, $module.dataset));
-      if (this.$module.getAttribute('role') === 'alert' && !this.config.disableAutoFocus) {
-        setFocus(this.$module);
+      this.config = mergeConfigs(NotificationBanner.defaults, config, normaliseDataset(NotificationBanner, this.$root.dataset));
+      if (this.$root.getAttribute('role') === 'alert' && !this.config.disableAutoFocus) {
+        setFocus(this.$root);
       }
     }
   }