govuk_publishing_components 44.1.0 → 44.2.0

data/node_modules/govuk-frontend/dist/govuk/components/service-navigation/template.njk

@@ -0,0 +1,102 @@
+{% from "../../macros/attributes.njk" import govukAttributes %}
+
+{%- set menuButtonText = params.menuButtonText | default("Menu", true) -%}
+{%- set navigationId = params.navigationId | default("navigation", true) %}
+
+{%- set commonAttributes %}
+class="govuk-service-navigation {%- if params.classes %} {{ params.classes }}{% endif %}"
+data-module="govuk-service-navigation"
+{{- govukAttributes(params.attributes) }}
+{% endset -%}
+
+{%- set innerContent %}
+  <div class="govuk-width-container">
+
+    {# Slot: start #}
+    {%- if params.slots.start %}{{ params.slots.start | safe }}{% endif -%}
+
+    <div class="govuk-service-navigation__container">
+      {# Service name #}
+      {% if params.serviceName %}
+        <span class="govuk-service-navigation__service-name">
+          {% if params.serviceUrl %}
+            <a href="{{ params.serviceUrl }}" class="govuk-service-navigation__link">
+              {{ params.serviceName }}
+            </a>
+          {% else %}
+            <span class="govuk-service-navigation__text">
+              {{- params.serviceName -}}
+            </span>
+          {% endif %}
+        </span>
+      {% endif %}
+
+      {# Navigation #}
+      {% if params.navigation | length or params.slots.navigationStart or params.slots.navigationEnd %}
+        <nav aria-label="{{ params.navigationLabel | default(menuButtonText, true) }}" class="govuk-service-navigation__wrapper {%- if params.navigationClasses %} {{ params.navigationClasses }}{% endif %}">
+          <button type="button" class="govuk-service-navigation__toggle govuk-js-service-navigation-toggle" aria-controls="{{ navigationId }}" {%- if params.menuButtonLabel and params.menuButtonLabel != menuButtonText %} aria-label="{{ params.menuButtonLabel }}"{% endif %} hidden>
+            {{ menuButtonText }}
+          </button>
+
+          <ul class="govuk-service-navigation__list" id="{{ navigationId }}" >
+
+            {# Slot: navigationStart #}
+            {%- if params.slots.navigationStart %}{{ params.slots.navigationStart | safe }}{% endif -%}
+
+            {% for item in params.navigation %}
+              {% set linkInnerContent %}
+                {# We wrap active links in strong tags so that users who
+                  override colours or styles will still have some indicator of
+                  the current nav item. #}
+                {% if item.active or item.current %}
+                  <strong class="govuk-service-navigation__active-fallback">{{- item.html | safe if item.html else item.text -}}</strong>
+                {% else %}
+                  {{- item.html | safe if item.html else item.text -}}
+                {% endif %}
+              {% endset %}
+
+              {#
+                If item.current, add active style and set aria-current="page"
+                Elseif item.active, add active style and set aria-current="true"
+              #}
+              <li class="govuk-service-navigation__item {%- if item.active or item.current %} govuk-service-navigation__item--active{% endif %}">
+                {% if item.href %}
+                  <a class="govuk-service-navigation__link" href="{{ item.href }}"
+                    {%- if item.active or item.current %} aria-current="{{ 'page' if item.current else 'true' }}"{% endif %}
+                    {{- govukAttributes(item.attributes) -}}>
+                    {{ linkInnerContent | safe }}
+                  </a>
+                {% elif item.html or item.text %}
+                  <span class="govuk-service-navigation__text"
+                    {%- if item.active or item.current %} aria-current="{{ 'page' if item.current else 'true' }}"{% endif %}>
+                    {{ linkInnerContent | safe }}
+                  </span>
+                {% endif %}
+              </li>
+            {% endfor %}
+
+            {# Slot: navigationEnd #}
+            {%- if params.slots.navigationEnd %}{{ params.slots.navigationEnd | safe }}{% endif -%}
+          </ul>
+        </nav>
+      {% endif %}
+    </div>
+
+    {# Slot: end #}
+    {%- if params.slots.end %}{{ params.slots.end | safe }}{% endif -%}
+
+  </div>
+{% endset -%}
+
+{# If a service name is included, we use a <section> element with an
+  aria-label to create a containing landmark region. Otherwise, the <nav> in
+  the innerContent can do the job just fine by itself. #}
+{% if params.serviceName or params.slots.start or params.slots.end %}
+  <section aria-label="{{ params.ariaLabel | default("Service information") }}" {{ commonAttributes | safe }}>
+    {{ innerContent | safe }}
+  </section>
+{% else %}
+  <div {{ commonAttributes | safe }}>
+    {{ innerContent | safe }}
+  </div>
+{% endif %}

data/node_modules/govuk-frontend/dist/govuk/components/skip-link/skip-link.bundle.js

@@ -34,12 +34,28 @@
     (_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;
     }
     return $scope.classList.contains('govuk-frontend-supported');
   }
+  function formatErrorMessage(Component, message) {
+    return `${Component.moduleName}: ${message}`;
+  }
 
   /**
    * Schema for component config
@@ -63,6 +79,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
+   */
 
   class GOVUKFrontendError extends Error {
     constructor(...args) {
@@ -87,60 +107,106 @@
       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;
+
   /**
    * Skip link component
    *
    * @preserve
+   * @augments GOVUKFrontendComponent<HTMLAnchorElement>
    */
   class SkipLink extends GOVUKFrontendComponent {
     /**
-     * @param {Element | null} $module - HTML element to use for skip link
-     * @throws {ElementError} when $module is not set or the wrong type
-     * @throws {ElementError} when $module.hash does not contain a hash
+     * @param {Element | null} $root - HTML element to use for skip link
+     * @throws {ElementError} when $root is not set or the wrong type
+     * @throws {ElementError} when $root.hash does not contain a hash
      * @throws {ElementError} when the linked element is missing or the wrong type
      */
-    constructor($module) {
-      var _this$$module$getAttr;
-      super();
-      this.$module = void 0;
-      if (!($module instanceof HTMLAnchorElement)) {
-        throw new ElementError({
-          componentName: 'Skip link',
-          element: $module,
-          expectedType: 'HTMLAnchorElement',
-          identifier: 'Root element (`$module`)'
-        });
-      }
-      this.$module = $module;
-      const hash = this.$module.hash;
-      const href = (_this$$module$getAttr = this.$module.getAttribute('href')) != null ? _this$$module$getAttr : '';
+    constructor($root) {
+      var _this$$root$getAttrib;
+      super($root);
+      const hash = this.$root.hash;
+      const href = (_this$$root$getAttrib = this.$root.getAttribute('href')) != null ? _this$$root$getAttrib : '';
       let url;
       try {
-        url = new window.URL(this.$module.href);
+        url = new window.URL(this.$root.href);
       } catch (error) {
         throw new ElementError(`Skip link: Target link (\`href="${href}"\`) is invalid`);
       }
@@ -154,12 +220,12 @@
       const $linkedElement = document.getElementById(linkedElementId);
       if (!$linkedElement) {
         throw new ElementError({
-          componentName: 'Skip link',
+          component: SkipLink,
           element: $linkedElement,
           identifier: `Target content (\`id="${linkedElementId}"\`)`
         });
       }
-      this.$module.addEventListener('click', () => setFocus($linkedElement, {
+      this.$root.addEventListener('click', () => setFocus($linkedElement, {
         onBeforeFocus() {
           $linkedElement.classList.add('govuk-skip-link-focused-element');
         },
@@ -169,6 +235,7 @@
       }));
     }
   }
+  SkipLink.elementType = HTMLAnchorElement;
   SkipLink.moduleName = 'govuk-skip-link';
 
   exports.SkipLink = SkipLink;

data/node_modules/govuk-frontend/dist/govuk/components/skip-link/skip-link.bundle.js.map

@@ -1 +1 @@
-{"version":3,"file":"skip-link.bundle.js","sources":["../../../../src/govuk/common/index.mjs","../../../../src/govuk/errors/index.mjs","../../../../src/govuk/govuk-frontend-component.mjs","../../../../src/govuk/components/skip-link/skip-link.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 { getFragmentFromUrl, setFocus } from '../../common/index.mjs'\nimport { ElementError } from '../../errors/index.mjs'\nimport { GOVUKFrontendComponent } from '../../govuk-frontend-component.mjs'\n\n/**\n * Skip link component\n *\n * @preserve\n */\nexport class SkipLink extends GOVUKFrontendComponent {\n  /** @private */\n  $module\n\n  /**\n   * @param {Element | null} $module - HTML element to use for skip link\n   * @throws {ElementError} when $module is not set or the wrong type\n   * @throws {ElementError} when $module.hash does not contain a hash\n   * @throws {ElementError} when the linked element is missing or the wrong type\n   */\n  constructor($module) {\n    super()\n\n    if (!($module instanceof HTMLAnchorElement)) {\n      throw new ElementError({\n        componentName: 'Skip link',\n        element: $module,\n        expectedType: 'HTMLAnchorElement',\n        identifier: 'Root element (`$module`)'\n      })\n    }\n\n    this.$module = $module\n\n    const hash = this.$module.hash\n    const href = this.$module.getAttribute('href') ?? ''\n\n    /** @type {URL | undefined} */\n    let url\n\n    /**\n     * Check for valid link URL\n     *\n     * {@link https://caniuse.com/url}\n     * {@link https://url.spec.whatwg.org}\n     *\n     */\n    try {\n      url = new window.URL(this.$module.href)\n    } catch (error) {\n      throw new ElementError(\n        `Skip link: Target link (\\`href=\"${href}\"\\`) is invalid`\n      )\n    }\n\n    // Return early for external URLs or links to other pages\n    if (\n      url.origin !== window.location.origin ||\n      url.pathname !== window.location.pathname\n    ) {\n      return\n    }\n\n    const linkedElementId = getFragmentFromUrl(hash)\n\n    // Check link path matching current page\n    if (!linkedElementId) {\n      throw new ElementError(\n        `Skip link: Target link (\\`href=\"${href}\"\\`) has no hash fragment`\n      )\n    }\n\n    const $linkedElement = document.getElementById(linkedElementId)\n\n    // Check for link target element\n    if (!$linkedElement) {\n      throw new ElementError({\n        componentName: 'Skip link',\n        element: $linkedElement,\n        identifier: `Target content (\\`id=\"${linkedElementId}\"\\`)`\n      })\n    }\n\n    /**\n     * Focus the linked element on click\n     *\n     * Adds a helper CSS class to hide native focus styles,\n     * but removes it on blur to restore native focus styles\n     */\n    this.$module.addEventListener('click', () =>\n      setFocus($linkedElement, {\n        onBeforeFocus() {\n          $linkedElement.classList.add('govuk-skip-link-focused-element')\n        },\n        onBlur() {\n          $linkedElement.classList.remove('govuk-skip-link-focused-element')\n        }\n      })\n    )\n  }\n\n  /**\n   * Name for the component used when initialising using data-module attributes.\n   */\n  static moduleName = 'govuk-skip-link'\n}\n"],"names":["getFragmentFromUrl","url","includes","undefined","split","pop","setFocus","$element","options","_options$onBeforeFocu","isFocusable","getAttribute","setAttribute","onFocus","addEventListener","onBlur","once","_options$onBlur","call","removeAttribute","onBeforeFocus","focus","isSupported","$scope","document","body","classList","contains","GOVUKFrontendError","Error","constructor","args","name","SupportError","supportMessage","HTMLScriptElement","prototype","ElementError","messageOrOptions","message","componentName","identifier","element","expectedType","GOVUKFrontendComponent","checkSupport","SkipLink","$module","_this$$module$getAttr","HTMLAnchorElement","hash","href","window","URL","error","origin","location","pathname","linkedElementId","$linkedElement","getElementById","add","remove","moduleName"],"mappings":"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"}
+{"version":3,"file":"skip-link.bundle.js","sources":["../../../../src/govuk/common/index.mjs","../../../../src/govuk/errors/index.mjs","../../../../src/govuk/govuk-frontend-component.mjs","../../../../src/govuk/components/skip-link/skip-link.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 { getFragmentFromUrl, setFocus } from '../../common/index.mjs'\nimport { ElementError } from '../../errors/index.mjs'\nimport { GOVUKFrontendComponent } from '../../govuk-frontend-component.mjs'\n\n/**\n * Skip link component\n *\n * @preserve\n * @augments GOVUKFrontendComponent<HTMLAnchorElement>\n */\nexport class SkipLink extends GOVUKFrontendComponent {\n  static elementType = HTMLAnchorElement\n\n  /**\n   * @param {Element | null} $root - HTML element to use for skip link\n   * @throws {ElementError} when $root is not set or the wrong type\n   * @throws {ElementError} when $root.hash does not contain a hash\n   * @throws {ElementError} when the linked element is missing or the wrong type\n   */\n  constructor($root) {\n    super($root)\n\n    const hash = this.$root.hash\n    const href = this.$root.getAttribute('href') ?? ''\n\n    /** @type {URL | undefined} */\n    let url\n\n    /**\n     * Check for valid link URL\n     *\n     * {@link https://caniuse.com/url}\n     * {@link https://url.spec.whatwg.org}\n     *\n     */\n    try {\n      url = new window.URL(this.$root.href)\n    } catch (error) {\n      throw new ElementError(\n        `Skip link: Target link (\\`href=\"${href}\"\\`) is invalid`\n      )\n    }\n\n    // Return early for external URLs or links to other pages\n    if (\n      url.origin !== window.location.origin ||\n      url.pathname !== window.location.pathname\n    ) {\n      return\n    }\n\n    const linkedElementId = getFragmentFromUrl(hash)\n\n    // Check link path matching current page\n    if (!linkedElementId) {\n      throw new ElementError(\n        `Skip link: Target link (\\`href=\"${href}\"\\`) has no hash fragment`\n      )\n    }\n\n    const $linkedElement = document.getElementById(linkedElementId)\n\n    // Check for link target element\n    if (!$linkedElement) {\n      throw new ElementError({\n        component: SkipLink,\n        element: $linkedElement,\n        identifier: `Target content (\\`id=\"${linkedElementId}\"\\`)`\n      })\n    }\n\n    /**\n     * Focus the linked element on click\n     *\n     * Adds a helper CSS class to hide native focus styles,\n     * but removes it on blur to restore native focus styles\n     */\n    this.$root.addEventListener('click', () =>\n      setFocus($linkedElement, {\n        onBeforeFocus() {\n          $linkedElement.classList.add('govuk-skip-link-focused-element')\n        },\n        onBlur() {\n          $linkedElement.classList.remove('govuk-skip-link-focused-element')\n        }\n      })\n    )\n  }\n\n  /**\n   * Name for the component used when initialising using data-module attributes.\n   */\n  static moduleName = 'govuk-skip-link'\n}\n"],"names":["getFragmentFromUrl","url","includes","undefined","split","pop","setFocus","$element","options","_options$onBeforeFocu","isFocusable","getAttribute","setAttribute","onFocus","addEventListener","onBlur","once","_options$onBlur","call","removeAttribute","onBeforeFocus","focus","isInitialised","$root","moduleName","HTMLElement","hasAttribute","isSupported","$scope","document","body","classList","contains","formatErrorMessage","Component","message","GOVUKFrontendError","Error","constructor","args","name","SupportError","supportMessage","HTMLScriptElement","prototype","ElementError","messageOrOptions","component","identifier","element","expectedType","InitError","componentOrMessage","GOVUKFrontendComponent","_$root","childConstructor","elementType","checkSupport","checkInitialised","SkipLink","_this$$root$getAttrib","hash","href","window","URL","error","origin","location","pathname","linkedElementId","$linkedElement","getElementById","add","remove","HTMLAnchorElement"],"mappings":"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"}

data/node_modules/govuk-frontend/dist/govuk/components/skip-link/skip-link.bundle.mjs

@@ -28,12 +28,28 @@ function setFocus($element, options = {}) {
   (_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;
   }
   return $scope.classList.contains('govuk-frontend-supported');
 }
+function formatErrorMessage(Component, message) {
+  return `${Component.moduleName}: ${message}`;
+}
 
 /**
  * Schema for component config
@@ -57,6 +73,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) {
@@ -81,60 +101,106 @@ 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;
+
 /**
  * Skip link component
  *
  * @preserve
+ * @augments GOVUKFrontendComponent<HTMLAnchorElement>
  */
 class SkipLink extends GOVUKFrontendComponent {
   /**
-   * @param {Element | null} $module - HTML element to use for skip link
-   * @throws {ElementError} when $module is not set or the wrong type
-   * @throws {ElementError} when $module.hash does not contain a hash
+   * @param {Element | null} $root - HTML element to use for skip link
+   * @throws {ElementError} when $root is not set or the wrong type
+   * @throws {ElementError} when $root.hash does not contain a hash
    * @throws {ElementError} when the linked element is missing or the wrong type
    */
-  constructor($module) {
-    var _this$$module$getAttr;
-    super();
-    this.$module = void 0;
-    if (!($module instanceof HTMLAnchorElement)) {
-      throw new ElementError({
-        componentName: 'Skip link',
-        element: $module,
-        expectedType: 'HTMLAnchorElement',
-        identifier: 'Root element (`$module`)'
-      });
-    }
-    this.$module = $module;
-    const hash = this.$module.hash;
-    const href = (_this$$module$getAttr = this.$module.getAttribute('href')) != null ? _this$$module$getAttr : '';
+  constructor($root) {
+    var _this$$root$getAttrib;
+    super($root);
+    const hash = this.$root.hash;
+    const href = (_this$$root$getAttrib = this.$root.getAttribute('href')) != null ? _this$$root$getAttrib : '';
     let url;
     try {
-      url = new window.URL(this.$module.href);
+      url = new window.URL(this.$root.href);
     } catch (error) {
       throw new ElementError(`Skip link: Target link (\`href="${href}"\`) is invalid`);
     }
@@ -148,12 +214,12 @@ class SkipLink extends GOVUKFrontendComponent {
     const $linkedElement = document.getElementById(linkedElementId);
     if (!$linkedElement) {
       throw new ElementError({
-        componentName: 'Skip link',
+        component: SkipLink,
         element: $linkedElement,
         identifier: `Target content (\`id="${linkedElementId}"\`)`
       });
     }
-    this.$module.addEventListener('click', () => setFocus($linkedElement, {
+    this.$root.addEventListener('click', () => setFocus($linkedElement, {
       onBeforeFocus() {
         $linkedElement.classList.add('govuk-skip-link-focused-element');
       },
@@ -163,6 +229,7 @@ class SkipLink extends GOVUKFrontendComponent {
     }));
   }
 }
+SkipLink.elementType = HTMLAnchorElement;
 SkipLink.moduleName = 'govuk-skip-link';
 
 export { SkipLink };