Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update name and description of macro options in docs and code #5702

Merged

Conversation

romaricpascal
Copy link
Member

@romaricpascal romaricpascal commented Feb 4, 2025

Pairing with @seaemsi , we updated the name and description of the macro options in the documentation so that:

  • Consistently talk about 'choosing a file' to align with the button's default.
  • Ensure order is consistent between description, default and condition for translation options.
  • Ensure all translation options are suffixed by 'Text'

The changes were the reported on the code to ensure they matched the documentation.

Copy link

github-actions bot commented Feb 4, 2025

📋 Stats

File sizes

File Size
dist/govuk-frontend-development.min.css 121.36 KiB
dist/govuk-frontend-development.min.js 47.67 KiB
packages/govuk-frontend/dist/govuk/all.bundle.js 101.78 KiB
packages/govuk-frontend/dist/govuk/all.bundle.mjs 95.61 KiB
packages/govuk-frontend/dist/govuk/all.mjs 1.32 KiB
packages/govuk-frontend/dist/govuk/govuk-frontend-component.mjs 1.74 KiB
packages/govuk-frontend/dist/govuk/govuk-frontend.min.css 121.35 KiB
packages/govuk-frontend/dist/govuk/govuk-frontend.min.js 47.65 KiB
packages/govuk-frontend/dist/govuk/i18n.mjs 5.55 KiB
packages/govuk-frontend/dist/govuk/init.mjs 6.89 KiB

Modules

File Size (bundled) Size (minified)
all.mjs 89.79 KiB 45.13 KiB
accordion.mjs 26.63 KiB 13.41 KiB
button.mjs 9.14 KiB 3.79 KiB
character-count.mjs 25.42 KiB 10.91 KiB
checkboxes.mjs 7.81 KiB 3.42 KiB
error-summary.mjs 11.04 KiB 4.55 KiB
exit-this-page.mjs 20.25 KiB 10.34 KiB
file-upload.mjs 20.53 KiB 10.72 KiB
header.mjs 6.46 KiB 3.22 KiB
notification-banner.mjs 9.4 KiB 3.71 KiB
password-input.mjs 18.21 KiB 8.34 KiB
radios.mjs 6.81 KiB 2.98 KiB
service-navigation.mjs 6.44 KiB 3.26 KiB
skip-link.mjs 6.4 KiB 2.76 KiB
tabs.mjs 12.04 KiB 6.67 KiB

View stats and visualisations on the review app


Action run for 64ce299

Copy link

github-actions bot commented Feb 4, 2025

JavaScript changes to npm package

diff --git a/packages/govuk-frontend/dist/govuk/govuk-frontend.min.js b/packages/govuk-frontend/dist/govuk/govuk-frontend.min.js
index 1f43c3b1b..69d19059f 100644
--- a/packages/govuk-frontend/dist/govuk/govuk-frontend.min.js
+++ b/packages/govuk-frontend/dist/govuk/govuk-frontend.min.js
@@ -13,20 +13,20 @@ function getBreakpoint(t) {
 }
 
 function setFocus(t, e = {}) {
-    var i;
-    const n = t.getAttribute("tabindex");
+    var n;
+    const i = t.getAttribute("tabindex");
 
     function onBlur() {
-        var i;
-        null == (i = e.onBlur) || i.call(t), n || t.removeAttribute("tabindex")
+        var n;
+        null == (n = e.onBlur) || n.call(t), i || t.removeAttribute("tabindex")
     }
-    n || t.setAttribute("tabindex", "-1"), t.addEventListener("focus", (function() {
+    i || t.setAttribute("tabindex", "-1"), t.addEventListener("focus", (function() {
         t.addEventListener("blur", onBlur, {
             once: !0
         })
     }), {
         once: !0
-    }), null == (i = e.onBeforeFocus) || i.call(t), t.focus()
+    }), null == (n = e.onBeforeFocus) || n.call(t), t.focus()
 }
 
 function isSupported(t = document.body) {
@@ -63,12 +63,12 @@ class ElementError extends GOVUKFrontendError {
         let e = "string" == typeof t ? t : "";
         if ("object" == typeof t) {
             const {
-                component: i,
-                identifier: n,
+                component: n,
+                identifier: i,
                 element: s,
                 expectedType: o
             } = t;
-            e = n, e += s ? ` is not of type ${null!=o?o:"HTMLElement"}` : " not found", e = formatErrorMessage(i, e)
+            e = i, e += s ? ` is not of type ${null!=o?o:"HTMLElement"}` : " not found", e = formatErrorMessage(n, e)
         }
         super(e), this.name = "ElementError"
     }
@@ -93,8 +93,8 @@ class GOVUKFrontendComponent {
             expectedType: e.elementType.name
         });
         this._$root = t, e.checkSupport(), this.checkInitialised();
-        const i = e.moduleName;
-        this.$root.setAttribute(`data-${i}-init`, "")
+        const n = e.moduleName;
+        this.$root.setAttribute(`data-${n}-init`, "")
     }
     checkInitialised() {
         const t = this.constructor,
@@ -116,91 +116,91 @@ class ConfigurableComponent extends GOVUKFrontendComponent {
     get config() {
         return this._config
     }
-    constructor(e, i) {
+    constructor(e, n) {
         super(e), this._config = void 0;
-        const n = this.constructor;
-        if (!isObject(n.defaults)) throw new ConfigError(formatErrorMessage(n, "Config passed as parameter into constructor but no defaults defined"));
+        const i = this.constructor;
+        if (!isObject(i.defaults)) throw new ConfigError(formatErrorMessage(i, "Config passed as parameter into constructor but no defaults defined"));
         const s = function(Component, t) {
             if (!isObject(Component.schema)) throw new ConfigError(formatErrorMessage(Component, "Config passed as parameter into constructor but no schema defined"));
             const e = {},
-                i = Object.entries(Component.schema.properties);
-            for (const n of i) {
-                const [i, s] = n, o = i.toString();
-                o in t && (e[o] = normaliseString(t[o], s)), "object" === (null == s ? void 0 : s.type) && (e[o] = extractConfigByNamespace(Component.schema, t, i))
+                n = Object.entries(Component.schema.properties);
+            for (const i of n) {
+                const [n, s] = i, o = n.toString();
+                o in t && (e[o] = normaliseString(t[o], s)), "object" === (null == s ? void 0 : s.type) && (e[o] = extractConfigByNamespace(Component.schema, t, n))
             }
             return e
-        }(n, this._$root.dataset);
-        this._config = mergeConfigs(n.defaults, null != i ? i : {}, this[t](s), s)
+        }(i, this._$root.dataset);
+        this._config = mergeConfigs(i.defaults, null != n ? n : {}, this[t](s), s)
     }
 }
 
 function normaliseString(t, e) {
-    const i = t ? t.trim() : "";
-    let n, s = null == e ? void 0 : e.type;
-    switch (s || (["true", "false"].includes(i) && (s = "boolean"), i.length > 0 && isFinite(Number(i)) && (s = "number")), s) {
+    const n = t ? t.trim() : "";
+    let i, s = null == e ? void 0 : e.type;
+    switch (s || (["true", "false"].includes(n) && (s = "boolean"), n.length > 0 && isFinite(Number(n)) && (s = "number")), s) {
         case "boolean":
-            n = "true" === i;
+            i = "true" === n;
             break;
         case "number":
-            n = Number(i);
+            i = Number(n);
             break;
         default:
-            n = t
+            i = t
     }
-    return n
+    return i
 }
 
 function mergeConfigs(...t) {
     const e = {};
-    for (const i of t)
-        for (const t of Object.keys(i)) {
-            const n = e[t],
-                s = i[t];
-            isObject(n) && isObject(s) ? e[t] = mergeConfigs(n, s) : e[t] = s
+    for (const n of t)
+        for (const t of Object.keys(n)) {
+            const i = e[t],
+                s = n[t];
+            isObject(i) && isObject(s) ? e[t] = mergeConfigs(i, s) : e[t] = s
         }
     return e
 }
 
-function extractConfigByNamespace(t, e, i) {
-    const n = t.properties[i];
-    if ("object" !== (null == n ? void 0 : n.type)) return;
+function extractConfigByNamespace(t, e, n) {
+    const i = t.properties[n];
+    if ("object" !== (null == i ? void 0 : i.type)) return;
     const s = {
-        [i]: {}
+        [n]: {}
     };
     for (const [o, r] of Object.entries(e)) {
         let t = s;
         const e = o.split(".");
-        for (const [n, s] of e.entries()) isObject(t) && (n < e.length - 1 ? (isObject(t[s]) || (t[s] = {}), t = t[s]) : o !== i && (t[s] = normaliseString(r)))
+        for (const [i, s] of e.entries()) isObject(t) && (i < e.length - 1 ? (isObject(t[s]) || (t[s] = {}), t = t[s]) : o !== n && (t[s] = normaliseString(r)))
     }
-    return s[i]
+    return s[n]
 }
 class I18n {
     constructor(t = {}, e = {}) {
-        var i;
-        this.translations = void 0, this.locale = void 0, this.translations = t, this.locale = null != (i = e.locale) ? i : document.documentElement.lang || "en"
+        var n;
+        this.translations = void 0, this.locale = void 0, this.translations = t, this.locale = null != (n = e.locale) ? n : document.documentElement.lang || "en"
     }
     t(t, e) {
         if (!t) throw new Error("i18n: lookup key missing");
-        let i = this.translations[t];
-        if ("number" == typeof(null == e ? void 0 : e.count) && "object" == typeof i) {
-            const n = i[this.getPluralSuffix(t, e.count)];
-            n && (i = n)
+        let n = this.translations[t];
+        if ("number" == typeof(null == e ? void 0 : e.count) && "object" == typeof n) {
+            const i = n[this.getPluralSuffix(t, e.count)];
+            i && (n = i)
         }
-        if ("string" == typeof i) {
-            if (i.match(/%{(.\S+)}/)) {
+        if ("string" == typeof n) {
+            if (n.match(/%{(.\S+)}/)) {
                 if (!e) throw new Error("i18n: cannot replace placeholders in string if no option data provided");
-                return this.replacePlaceholders(i, e)
+                return this.replacePlaceholders(n, e)
             }
-            return i
+            return n
         }
         return t
     }
     replacePlaceholders(t, e) {
-        const i = Intl.NumberFormat.supportedLocalesOf(this.locale).length ? new Intl.NumberFormat(this.locale) : void 0;
-        return t.replace(/%{(.\S+)}/g, (function(t, n) {
-            if (Object.prototype.hasOwnProperty.call(e, n)) {
-                const t = e[n];
-                return !1 === t || "number" != typeof t && "string" != typeof t ? "" : "number" == typeof t ? i ? i.format(t) : `${t}` : t
+        const n = Intl.NumberFormat.supportedLocalesOf(this.locale).length ? new Intl.NumberFormat(this.locale) : void 0;
+        return t.replace(/%{(.\S+)}/g, (function(t, i) {
+            if (Object.prototype.hasOwnProperty.call(e, i)) {
+                const t = e[i];
+                return !1 === t || "number" != typeof t && "string" != typeof t ? "" : "number" == typeof t ? n ? n.format(t) : `${t}` : t
             }
             throw new Error(`i18n: no data found to replace ${t} placeholder in string`)
         }))
@@ -210,11 +210,11 @@ class I18n {
     }
     getPluralSuffix(t, e) {
         if (e = Number(e), !isFinite(e)) return "other";
-        const i = this.translations[t],
-            n = this.hasIntlPluralRulesSupport() ? new Intl.PluralRules(this.locale).select(e) : this.selectPluralFormUsingFallbackRules(e);
-        if ("object" == typeof i) {
-            if (n in i) return n;
-            if ("other" in i) return console.warn(`i18n: Missing plural form ".${n}" for "${this.locale}" locale. Falling back to ".other".`), "other"
+        const n = this.translations[t],
+            i = this.hasIntlPluralRulesSupport() ? new Intl.PluralRules(this.locale).select(e) : this.selectPluralFormUsingFallbackRules(e);
+        if ("object" == typeof n) {
+            if (i in n) return i;
+            if ("other" in n) return console.warn(`i18n: Missing plural form ".${i}" for "${this.locale}" locale. Falling back to ".other".`), "other"
         }
         throw new Error(`i18n: Plural form ".other" is required for "${this.locale}" locale`)
     }
@@ -226,8 +226,8 @@ class I18n {
     getPluralRulesForLocale() {
         const t = this.locale.split("-")[0];
         for (const e in I18n.pluralRulesMap) {
-            const i = I18n.pluralRulesMap[e];
-            if (i.includes(this.locale) || i.includes(t)) return e
+            const n = I18n.pluralRulesMap[e];
+            if (n.includes(this.locale) || n.includes(t)) return e
         }
     }
 }
@@ -249,8 +249,8 @@ I18n.pluralRulesMap = {
     irish: t => 1 === t ? "one" : 2 === t ? "two" : t >= 3 && t <= 6 ? "few" : t >= 7 && t <= 10 ? "many" : "other",
     russian(t) {
         const e = t % 100,
-            i = e % 10;
-        return 1 === i && 11 !== e ? "one" : i >= 2 && i <= 4 && !(e >= 12 && e <= 14) ? "few" : 0 === i || i >= 5 && i <= 9 || e >= 11 && e <= 14 ? "many" : "other"
+            n = e % 10;
+        return 1 === n && 11 !== e ? "one" : n >= 2 && n <= 4 && !(e >= 12 && e <= 14) ? "few" : 0 === n || n >= 5 && n <= 9 || e >= 11 && e <= 14 ? "many" : "other"
     },
     scottish: t => 1 === t || 11 === t ? "one" : 2 === t || 12 === t ? "two" : t >= 3 && t <= 10 || t >= 13 && t <= 19 ? "few" : "other",
     spanish: t => 1 === t ? "one" : t % 1e6 == 0 && 0 !== t ? "many" : "other",
@@ -259,12 +259,12 @@ I18n.pluralRulesMap = {
 class Accordion extends ConfigurableComponent {
     constructor(t, e = {}) {
         super(t, e), this.i18n = void 0, this.controlsClass = "govuk-accordion__controls", this.showAllClass = "govuk-accordion__show-all", this.showAllTextClass = "govuk-accordion__show-all-text", this.sectionClass = "govuk-accordion__section", this.sectionExpandedClass = "govuk-accordion__section--expanded", this.sectionButtonClass = "govuk-accordion__section-button", this.sectionHeaderClass = "govuk-accordion__section-header", this.sectionHeadingClass = "govuk-accordion__section-heading", this.sectionHeadingDividerClass = "govuk-accordion__section-heading-divider", this.sectionHeadingTextClass = "govuk-accordion__section-heading-text", this.sectionHeadingTextFocusClass = "govuk-accordion__section-heading-text-focus", this.sectionShowHideToggleClass = "govuk-accordion__section-toggle", this.sectionShowHideToggleFocusClass = "govuk-accordion__section-toggle-focus", this.sectionShowHideTextClass = "govuk-accordion__section-toggle-text", this.upChevronIconClass = "govuk-accordion-nav__chevron", this.downChevronIconClass = "govuk-accordion-nav__chevron--down", this.sectionSummaryClass = "govuk-accordion__section-summary", this.sectionSummaryFocusClass = "govuk-accordion__section-summary-focus", this.sectionContentClass = "govuk-accordion__section-content", this.$sections = void 0, this.$showAllButton = null, this.$showAllIcon = null, this.$showAllText = null, this.i18n = new I18n(this.config.i18n);
-        const i = this.$root.querySelectorAll(`.${this.sectionClass}`);
-        if (!i.length) throw new ElementError({
+        const n = this.$root.querySelectorAll(`.${this.sectionClass}`);
+        if (!n.length) throw new ElementError({
             component: Accordion,
             identifier: `Sections (\`<div class="${this.sectionClass}">\`)`
         });
-        this.$sections = i, this.initControls(), this.initSectionHeaders(), this.updateShowAllButton(this.areAllSectionsOpen())
+        this.$sections = n, this.initControls(), this.initSectionHeaders(), this.updateShowAllButton(this.areAllSectionsOpen())
     }
     initControls() {
         this.$showAllButton = document.createElement("button"), this.$showAllButton.setAttribute("type", "button"), this.$showAllButton.setAttribute("class", this.showAllClass), this.$showAllButton.setAttribute("aria-expanded", "false"), this.$showAllIcon = document.createElement("span"), this.$showAllIcon.classList.add(this.upChevronIconClass), this.$showAllButton.appendChild(this.$showAllIcon);
@@ -273,33 +273,33 @@ class Accordion extends ConfigurableComponent {
     }
     initSectionHeaders() {
         this.$sections.forEach(((t, e) => {
-            const i = t.querySelector(`.${this.sectionHeaderClass}`);
-            if (!i) throw new ElementError({
+            const n = t.querySelector(`.${this.sectionHeaderClass}`);
+            if (!n) throw new ElementError({
                 component: Accordion,
                 identifier: `Section headers (\`<div class="${this.sectionHeaderClass}">\`)`
             });
-            this.constructHeaderMarkup(i, e), this.setExpanded(this.isExpanded(t), t), i.addEventListener("click", (() => this.onSectionToggle(t))), this.setInitialState(t)
+            this.constructHeaderMarkup(n, e), this.setExpanded(this.isExpanded(t), t), n.addEventListener("click", (() => this.onSectionToggle(t))), this.setInitialState(t)
         }))
     }
     constructHeaderMarkup(t, e) {
-        const i = t.querySelector(`.${this.sectionButtonClass}`),
-            n = t.querySelector(`.${this.sectionHeadingClass}`),
+        const n = t.querySelector(`.${this.sectionButtonClass}`),
+            i = t.querySelector(`.${this.sectionHeadingClass}`),
             s = t.querySelector(`.${this.sectionSummaryClass}`);
-        if (!n) throw new ElementError({
+        if (!i) throw new ElementError({
             component: Accordion,
             identifier: `Section heading (\`.${this.sectionHeadingClass}\`)`
         });
-        if (!i) throw new ElementError({
+        if (!n) throw new ElementError({
             component: Accordion,
             identifier: `Section button placeholder (\`<span class="${this.sectionButtonClass}">\`)`
         });
         const o = document.createElement("button");
         o.setAttribute("type", "button"), o.setAttribute("aria-controls", `${this.$root.id}-content-${e+1}`);
-        for (const d of Array.from(i.attributes)) "id" !== d.name && o.setAttribute(d.name, d.value);
+        for (const d of Array.from(n.attributes)) "id" !== d.name && o.setAttribute(d.name, d.value);
         const r = document.createElement("span");
-        r.classList.add(this.sectionHeadingTextClass), r.id = i.id;
+        r.classList.add(this.sectionHeadingTextClass), r.id = n.id;
         const a = document.createElement("span");
-        a.classList.add(this.sectionHeadingTextFocusClass), r.appendChild(a), Array.from(i.childNodes).forEach((t => a.appendChild(t)));
+        a.classList.add(this.sectionHeadingTextFocusClass), r.appendChild(a), Array.from(n.childNodes).forEach((t => a.appendChild(t)));
         const l = document.createElement("span");
         l.classList.add(this.sectionShowHideToggleClass), l.setAttribute("data-nosnippet", "");
         const c = document.createElement("span");
@@ -310,16 +310,16 @@ class Accordion extends ConfigurableComponent {
             const t = document.createElement("span"),
                 e = document.createElement("span");
             e.classList.add(this.sectionSummaryFocusClass), t.appendChild(e);
-            for (const i of Array.from(s.attributes)) t.setAttribute(i.name, i.value);
+            for (const n of Array.from(s.attributes)) t.setAttribute(n.name, n.value);
             Array.from(s.childNodes).forEach((t => e.appendChild(t))), s.remove(), o.appendChild(t), o.appendChild(this.getButtonPunctuationEl())
         }
-        o.appendChild(l), n.removeChild(i), n.appendChild(o)
+        o.appendChild(l), i.removeChild(n), i.appendChild(o)
     }
     onBeforeMatch(t) {
         const e = t.target;
         if (!(e instanceof Element)) return;
-        const i = e.closest(`.${this.sectionClass}`);
-        i && this.setExpanded(!0, i)
+        const n = e.closest(`.${this.sectionClass}`);
+        n && this.setExpanded(!0, n)
     }
     onSectionToggle(t) {
         const e = !this.isExpanded(t);
@@ -332,24 +332,24 @@ class Accordion extends ConfigurableComponent {
         })), this.updateShowAllButton(t)
     }
     setExpanded(t, e) {
-        const i = e.querySelector(`.${this.upChevronIconClass}`),
-            n = e.querySelector(`.${this.sectionShowHideTextClass}`),
+        const n = e.querySelector(`.${this.upChevronIconClass}`),
+            i = e.querySelector(`.${this.sectionShowHideTextClass}`),
             s = e.querySelector(`.${this.sectionButtonClass}`),
             o = e.querySelector(`.${this.sectionContentClass}`);
         if (!o) throw new ElementError({
             component: Accordion,
             identifier: `Section content (\`<div class="${this.sectionContentClass}">\`)`
         });
-        if (!i || !n || !s) return;
+        if (!n || !i || !s) return;
         const r = t ? this.i18n.t("hideSection") : this.i18n.t("showSection");
-        n.textContent = r, s.setAttribute("aria-expanded", `${t}`);
+        i.textContent = r, s.setAttribute("aria-expanded", `${t}`);
         const a = [],
             l = e.querySelector(`.${this.sectionHeadingTextClass}`);
         l && a.push(`${l.textContent}`.trim());
         const c = e.querySelector(`.${this.sectionSummaryClass}`);
         c && a.push(`${c.textContent}`.trim());
         const u = t ? this.i18n.t("hideSectionAriaLabel") : this.i18n.t("showSectionAriaLabel");
-        a.push(u), s.setAttribute("aria-label", a.join(" , ")), t ? (o.removeAttribute("hidden"), e.classList.add(this.sectionExpandedClass), i.classList.remove(this.downChevronIconClass)) : (o.setAttribute("hidden", "until-found"), e.classList.remove(this.sectionExpandedClass), i.classList.add(this.downChevronIconClass)), this.updateShowAllButton(this.areAllSectionsOpen())
+        a.push(u), s.setAttribute("aria-label", a.join(" , ")), t ? (o.removeAttribute("hidden"), e.classList.add(this.sectionExpandedClass), n.classList.remove(this.downChevronIconClass)) : (o.setAttribute("hidden", "until-found"), e.classList.remove(this.sectionExpandedClass), n.classList.add(this.downChevronIconClass)), this.updateShowAllButton(this.areAllSectionsOpen())
     }
     isExpanded(t) {
         return t.classList.contains(this.sectionExpandedClass)
@@ -366,18 +366,18 @@ class Accordion extends ConfigurableComponent {
     }
     storeState(t, e) {
         if (!this.config.rememberExpanded) return;
-        const i = this.getIdentifier(t);
-        if (i) try {
-            window.sessionStorage.setItem(i, e.toString())
-        } catch (n) {}
+        const n = this.getIdentifier(t);
+        if (n) try {
+            window.sessionStorage.setItem(n, e.toString())
+        } catch (i) {}
     }
     setInitialState(t) {
         if (!this.config.rememberExpanded) return;
         const e = this.getIdentifier(t);
         if (e) try {
-            const i = window.sessionStorage.getItem(e);
-            null !== i && this.setExpanded("true" === i, t)
-        } catch (i) {}
+            const n = window.sessionStorage.getItem(e);
+            null !== n && this.setExpanded("true" === n, t)
+        } catch (n) {}
     }
     getButtonPunctuationEl() {
         const t = document.createElement("span");
@@ -420,8 +420,8 @@ class Button extends ConfigurableComponent {
 }
 
 function closestAttributeValue(t, e) {
-    const i = t.closest(`[${e}]`);
-    return i ? i.getAttribute(e) : null
+    const n = t.closest(`[${e}]`);
+    return n ? n.getAttribute(e) : null
 }
 Button.moduleName = "govuk-button", Button.defaults = Object.freeze({
     preventDoubleClick: !1
@@ -441,7 +441,7 @@ class CharacterCount extends ConfigurableComponent {
         }), e
     }
     constructor(t, e = {}) {
-        var i, n;
+        var n, i;
         super(t, e), this.$textarea = void 0, this.$visibleCountMessage = void 0, this.$screenReaderCountMessage = void 0, this.lastInputTimestamp = null, this.lastInputValue = "", this.valueChecker = null, this.i18n = void 0, this.maxLength = void 0;
         const s = this.$root.querySelector(".govuk-js-character-count");
         if (!(s instanceof HTMLTextAreaElement || s instanceof HTMLInputElement)) throw new ElementError({
@@ -451,24 +451,24 @@ class CharacterCount extends ConfigurableComponent {
             identifier: "Form field (`.govuk-js-character-count`)"
         });
         const o = function(t, e) {
-            const i = [];
-            for (const [n, s] of Object.entries(t)) {
+            const n = [];
+            for (const [i, s] of Object.entries(t)) {
                 const t = [];
                 if (Array.isArray(s)) {
                     for (const {
-                            required: i,
-                            errorMessage: n
+                            required: n,
+                            errorMessage: i
                         }
-                        of s) i.every((t => !!e[t])) || t.push(n);
-                    "anyOf" !== n || s.length - t.length >= 1 || i.push(...t)
+                        of s) n.every((t => !!e[t])) || t.push(i);
+                    "anyOf" !== i || s.length - t.length >= 1 || n.push(...t)
                 }
             }
-            return i
+            return n
         }(CharacterCount.schema, this.config);
         if (o[0]) throw new ConfigError(formatErrorMessage(CharacterCount, o[0]));
         this.i18n = new I18n(this.config.i18n, {
             locale: closestAttributeValue(this.$root, "lang")
-        }), this.maxLength = null != (i = null != (n = this.config.maxwords) ? n : this.config.maxlength) ? i : 1 / 0, this.$textarea = s;
+        }), this.maxLength = null != (n = null != (i = this.config.maxwords) ? i : this.config.maxlength) ? n : 1 / 0, this.$textarea = s;
         const r = `${this.$textarea.id}-info`,
             a = document.getElementById(r);
         if (!a) throw new ElementError({
@@ -525,8 +525,8 @@ class CharacterCount extends ConfigurableComponent {
     }
     formatCountMessage(t, e) {
         if (0 === t) return this.i18n.t(`${e}AtLimit`);
-        const i = t < 0 ? "OverLimit" : "UnderLimit";
-        return this.i18n.t(`${e}${i}`, {
+        const n = t < 0 ? "OverLimit" : "UnderLimit";
+        return this.i18n.t(`${e}${n}`, {
             count: Math.abs(t)
         })
     }
@@ -609,10 +609,10 @@ class Checkboxes extends GOVUKFrontendComponent {
     syncConditionalRevealWithInputState(t) {
         const e = t.getAttribute("aria-controls");
         if (!e) return;
-        const i = document.getElementById(e);
-        if (null != i && i.classList.contains("govuk-checkboxes__conditional")) {
+        const n = document.getElementById(e);
+        if (null != n && n.classList.contains("govuk-checkboxes__conditional")) {
             const e = t.checked;
-            t.setAttribute("aria-expanded", e.toString()), i.classList.toggle("govuk-checkboxes__conditional--hidden", !e)
+            t.setAttribute("aria-expanded", e.toString()), n.classList.toggle("govuk-checkboxes__conditional--hidden", !e)
         }
     }
     unCheckAllInputsExcept(t) {
@@ -645,25 +645,25 @@ class ErrorSummary extends ConfigurableComponent {
         if (!(t instanceof HTMLAnchorElement)) return !1;
         const e = getFragmentFromUrl(t.href);
         if (!e) return !1;
-        const i = document.getElementById(e);
-        if (!i) return !1;
-        const n = this.getAssociatedLegendOrLabel(i);
-        return !!n && (n.scrollIntoView(), i.focus({
+        const n = document.getElementById(e);
+        if (!n) return !1;
+        const i = this.getAssociatedLegendOrLabel(n);
+        return !!i && (i.scrollIntoView(), n.focus({
             preventScroll: !0
         }), !0)
     }
     getAssociatedLegendOrLabel(t) {
         var e;
-        const i = t.closest("fieldset");
-        if (i) {
-            const e = i.getElementsByTagName("legend");
+        const n = t.closest("fieldset");
+        if (n) {
+            const e = n.getElementsByTagName("legend");
             if (e.length) {
-                const i = e[0];
-                if (t instanceof HTMLInputElement && ("checkbox" === t.type || "radio" === t.type)) return i;
-                const n = i.getBoundingClientRect().top,
+                const n = e[0];
+                if (t instanceof HTMLInputElement && ("checkbox" === t.type || "radio" === t.type)) return n;
+                const i = n.getBoundingClientRect().top,
                     s = t.getBoundingClientRect();
                 if (s.height && window.innerHeight) {
-                    if (s.top + s.height - n < window.innerHeight / 2) return i
+                    if (s.top + s.height - i < window.innerHeight / 2) return n
                 }
             }
         }
@@ -682,16 +682,16 @@ ErrorSummary.moduleName = "govuk-error-summary", ErrorSummary.defaults = Object.
 class ExitThisPage extends ConfigurableComponent {
     constructor(t, e = {}) {
         super(t, e), this.i18n = void 0, this.$button = void 0, this.$skiplinkButton = null, this.$updateSpan = null, this.$indicatorContainer = null, this.$overlay = null, this.keypressCounter = 0, this.lastKeyWasModified = !1, this.timeoutTime = 5e3, this.keypressTimeoutId = null, this.timeoutMessageId = null;
-        const i = this.$root.querySelector(".govuk-exit-this-page__button");
-        if (!(i instanceof HTMLAnchorElement)) throw new ElementError({
+        const n = this.$root.querySelector(".govuk-exit-this-page__button");
+        if (!(n instanceof HTMLAnchorElement)) throw new ElementError({
             component: ExitThisPage,
-            element: i,
+            element: n,
             expectedType: "HTMLAnchorElement",
             identifier: "Button (`.govuk-exit-this-page__button`)"
         });
-        this.i18n = new I18n(this.config.i18n), this.$button = i;
-        const n = document.querySelector(".govuk-js-exit-this-page-skiplink");
-        n instanceof HTMLAnchorElement && (this.$skiplinkButton = n), this.buildIndicator(), this.initUpdateSpan(), this.initButtonClickHandler(), "govukFrontendExitThisPageKeypress" in document.body.dataset || (document.addEventListener("keyup", this.handleKeypress.bind(this), !0), document.body.dataset.govukFrontendExitThisPageKeypress = "true"), window.addEventListener("pageshow", this.resetPage.bind(this))
+        this.i18n = new I18n(this.config.i18n), this.$button = n;
+        const i = document.querySelector(".govuk-js-exit-this-page-skiplink");
+        i instanceof HTMLAnchorElement && (this.$skiplinkButton = i), this.buildIndicator(), this.initUpdateSpan(), this.initButtonClickHandler(), "govukFrontendExitThisPageKeypress" in document.body.dataset || (document.addEventListener("keyup", this.handleKeypress.bind(this), !0), document.body.dataset.govukFrontendExitThisPageKeypress = "true"), window.addEventListener("pageshow", this.resetPage.bind(this))
     }
     initUpdateSpan() {
         this.$updateSpan = document.createElement("span"), this.$updateSpan.setAttribute("role", "status"), this.$updateSpan.className = "govuk-visually-hidden", this.$root.appendChild(this.$updateSpan)
@@ -755,29 +755,29 @@ ExitThisPage.moduleName = "govuk-exit-this-page", ExitThisPage.defaults = Object
 class FileUpload extends ConfigurableComponent {
     constructor(t, e = {}) {
         super(t, e), this.$input = void 0, this.$button = void 0, this.$status = void 0, this.i18n = void 0, this.id = void 0;
-        const i = this.$root.querySelector("input");
-        if (null === i) throw new ElementError(formatErrorMessage(FileUpload, "File upload wrapper must have `input` element of type `file`"));
-        if ("file" !== i.type) throw new ElementError(formatErrorMessage(FileUpload, "Form field must be an input of type `file`."));
-        if (this.$input = i, !this.$input.id.length) throw new ElementError(formatErrorMessage(FileUpload, "Form field must specify an `id`."));
+        const n = this.$root.querySelector("input");
+        if (null === n) throw new ElementError(formatErrorMessage(FileUpload, "File upload wrapper must have `input` element of type `file`"));
+        if ("file" !== n.type) throw new ElementError(formatErrorMessage(FileUpload, "Form field must be an input of type `file`."));
+        if (this.$input = n, !this.$input.id.length) throw new ElementError(formatErrorMessage(FileUpload, "Form field must specify an `id`."));
         this.id = this.$input.id, this.i18n = new I18n(this.config.i18n, {
             locale: closestAttributeValue(this.$root, "lang")
         });
-        const n = this.findLabel();
-        n.setAttribute("for", `${this.id}-input`), n.id || (n.id = `${this.id}-label`), this.$input.id = `${this.id}-input`;
+        const i = this.findLabel();
+        i.setAttribute("for", `${this.id}-input`), i.id || (i.id = `${this.id}-label`), this.$input.id = `${this.id}-input`;
         const s = document.createElement("button");
         s.classList.add("govuk-file-upload__button"), s.type = "button", s.id = this.id, s.classList.add("govuk-file-upload__button--empty");
         const o = this.$input.getAttribute("aria-describedby");
         o && s.setAttribute("aria-describedby", o);
         const r = document.createElement("span");
-        r.className = "govuk-body govuk-file-upload__status", r.innerText = this.i18n.t("filesSelectedDefault"), s.appendChild(r);
+        r.className = "govuk-body govuk-file-upload__status", r.innerText = this.i18n.t("noFileChosen"), s.appendChild(r);
         const a = document.createElement("span");
         a.className = "govuk-visually-hidden", a.innerText = ", ", a.id = `${this.id}-comma`, s.appendChild(a);
         const l = document.createElement("span");
         l.className = "govuk-file-upload__pseudo-button-container";
         const c = document.createElement("span");
-        c.className = "govuk-button govuk-button--secondary govuk-file-upload__pseudo-button", c.innerText = this.i18n.t("selectFilesButton"), l.appendChild(c), l.insertAdjacentText("beforeend", " ");
+        c.className = "govuk-button govuk-button--secondary govuk-file-upload__pseudo-button", c.innerText = this.i18n.t("chooseFilesButton"), l.appendChild(c), l.insertAdjacentText("beforeend", " ");
         const u = document.createElement("span");
-        u.className = "govuk-body govuk-file-upload__instruction", u.innerText = this.i18n.t("instruction"), l.appendChild(u), s.appendChild(l), s.setAttribute("aria-labelledby", `${n.id} ${a.id} ${s.id}`), s.addEventListener("click", this.onClick.bind(this)), this.$root.insertAdjacentElement("afterbegin", s), this.$input.setAttribute("tabindex", "-1"), this.$input.setAttribute("aria-hidden", "true"), this.$button = s, this.$status = r, this.$input.addEventListener("change", this.onChange.bind(this)), this.updateDisabledState(), this.observeDisabledState(), this.$announcements = document.createElement("span"), this.$announcements.classList.add("govuk-file-upload-announcements"), this.$announcements.classList.add("govuk-visually-hidden"), this.$announcements.setAttribute("aria-live", "assertive"), this.$root.insertAdjacentElement("afterend", this.$announcements), this.$input.addEventListener("drop", this.hideDropZone.bind(this)), document.addEventListener("dragenter", this.updateDropzoneVisibility.bind(this)), document.addEventListener("dragenter", (() => {
+        u.className = "govuk-body govuk-file-upload__instruction", u.innerText = this.i18n.t("dropInstruction"), l.appendChild(u), s.appendChild(l), s.setAttribute("aria-labelledby", `${i.id} ${a.id} ${s.id}`), s.addEventListener("click", this.onClick.bind(this)), this.$root.insertAdjacentElement("afterbegin", s), this.$input.setAttribute("tabindex", "-1"), this.$input.setAttribute("aria-hidden", "true"), this.$button = s, this.$status = r, this.$input.addEventListener("change", this.onChange.bind(this)), this.updateDisabledState(), this.observeDisabledState(), this.$announcements = document.createElement("span"), this.$announcements.classList.add("govuk-file-upload-announcements"), this.$announcements.classList.add("govuk-visually-hidden"), this.$announcements.setAttribute("aria-live", "assertive"), this.$root.insertAdjacentElement("afterend", this.$announcements), this.$input.addEventListener("drop", this.hideDropZone.bind(this)), document.addEventListener("dragenter", this.updateDropzoneVisibility.bind(this)), document.addEventListener("dragenter", (() => {
             this.enteredAnotherElement = !0
         })), document.addEventListener("dragleave", (() => {
             this.enteredAnotherElement || this.hideDropZone(), this.enteredAnotherElement = !1
@@ -786,16 +786,16 @@ class FileUpload extends ConfigurableComponent {
     updateDropzoneVisibility(t) {
         t.target instanceof Node && (this.$root.contains(t.target) ? t.dataTransfer && function(t) {
             const e = 0 === t.types.length,
-                i = t.types.some((t => "Files" === t));
-            return e || i
-        }(t.dataTransfer) && (this.$button.classList.contains("govuk-file-upload__button--dragging") || (this.$button.classList.add("govuk-file-upload__button--dragging"), this.$input.classList.add("govuk-file-upload--dragging"), this.$announcements.innerText = this.i18n.t("dropZoneEntered"))) : this.$button.classList.contains("govuk-file-upload__button--dragging") && this.hideDropZone())
+                n = t.types.some((t => "Files" === t));
+            return e || n
+        }(t.dataTransfer) && (this.$button.classList.contains("govuk-file-upload__button--dragging") || (this.$button.classList.add("govuk-file-upload__button--dragging"), this.$input.classList.add("govuk-file-upload--dragging"), this.$announcements.innerText = this.i18n.t("enteredDropZone"))) : this.$button.classList.contains("govuk-file-upload__button--dragging") && this.hideDropZone())
     }
     hideDropZone() {
-        this.$button.classList.remove("govuk-file-upload__button--dragging"), this.$input.classList.remove("govuk-file-upload--dragging"), this.$announcements.innerText = this.i18n.t("dropZoneLeft")
+        this.$button.classList.remove("govuk-file-upload__button--dragging"), this.$input.classList.remove("govuk-file-upload--dragging"), this.$announcements.innerText = this.i18n.t("leftDropZone")
     }
     onChange() {
         const t = this.$input.files.length;
-        0 === t ? (this.$status.innerText = this.i18n.t("filesSelectedDefault"), this.$button.classList.add("govuk-file-upload__button--empty")) : (this.$status.innerText = 1 === t ? this.$input.files[0].name : this.i18n.t("filesSelected", {
+        0 === t ? (this.$status.innerText = this.i18n.t("noFileChosen"), this.$button.classList.add("govuk-file-upload__button--empty")) : (this.$status.innerText = 1 === t ? this.$input.files[0].name : this.i18n.t("multipleFilesChosen", {
             count: t
         }), this.$button.classList.remove("govuk-file-upload__button--empty"))
     }
@@ -823,15 +823,15 @@ class FileUpload extends ConfigurableComponent {
 }
 FileUpload.moduleName = "govuk-file-upload", FileUpload.defaults = Object.freeze({
     i18n: {
-        selectFilesButton: "Choose file",
-        filesSelectedDefault: "No file chosen",
-        filesSelected: {
+        chooseFilesButton: "Choose file",
+        dropInstruction: "or drop file",
+        noFileChosen: "No file chosen",
+        multipleFilesChosen: {
             one: "%{count} file chosen",
             other: "%{count} files chosen"
         },
-        dropZoneEntered: "Entered drop zone",
-        dropZoneLeft: "Left drop zone",
-        instruction: "or drop file"
+        enteredDropZone: "Entered drop zone",
+        leftDropZone: "Left drop zone"
     }
 }), FileUpload.schema = Object.freeze({
     properties: {
@@ -845,18 +845,18 @@ class Header extends GOVUKFrontendComponent {
         super(t), this.$menuButton = void 0, this.$menu = void 0, this.menuIsOpen = !1, this.mql = null;
         const e = this.$root.querySelector(".govuk-js-header-toggle");
         if (!e) return this;
-        const i = e.getAttribute("aria-controls");
-        if (!i) throw new ElementError({
+        const n = e.getAttribute("aria-controls");
+        if (!n) throw new ElementError({
             component: Header,
             identifier: 'Navigation button (`<button class="govuk-js-header-toggle">`) attribute (`aria-controls`)'
         });
-        const n = document.getElementById(i);
-        if (!n) throw new ElementError({
+        const i = document.getElementById(n);
+        if (!i) throw new ElementError({
             component: Header,
-            element: n,
-            identifier: `Navigation (\`<ul id="${i}">\`)`
+            element: i,
+            identifier: `Navigation (\`<ul id="${n}">\`)`
         });
-        this.$menu = n, this.$menuButton = e, this.setupResponsiveChecks(), this.$menuButton.addEventListener("click", (() => this.handleMenuButtonClick()))
+        this.$menu = i, this.$menuButton = e, this.setupResponsiveChecks(), this.$menuButton.addEventListener("click", (() => this.handleMenuButtonClick()))
     }
     setupResponsiveChecks() {
         const t = getBreakpoint("desktop");
@@ -891,23 +891,23 @@ NotificationBanner.moduleName = "govuk-notification-banner", NotificationBanner.
 class PasswordInput extends ConfigurableComponent {
     constructor(t, e = {}) {
         super(t, e), this.i18n = void 0, this.$input = void 0, this.$showHideButton = void 0, this.$screenReaderStatusMessage = void 0;
-        const i = this.$root.querySelector(".govuk-js-password-input-input");
-        if (!(i instanceof HTMLInputElement)) throw new ElementError({
+        const n = this.$root.querySelector(".govuk-js-password-input-input");
+        if (!(n instanceof HTMLInputElement)) throw new ElementError({
             component: PasswordInput,
-            element: i,
+            element: n,
             expectedType: "HTMLInputElement",
             identifier: "Form field (`.govuk-js-password-input-input`)"
         });
-        if ("password" !== i.type) throw new ElementError("Password input: Form field (`.govuk-js-password-input-input`) must be of type `password`.");
-        const n = this.$root.querySelector(".govuk-js-password-input-toggle");
-        if (!(n instanceof HTMLButtonElement)) throw new ElementError({
+        if ("password" !== n.type) throw new ElementError("Password input: Form field (`.govuk-js-password-input-input`) must be of type `password`.");
+        const i = this.$root.querySelector(".govuk-js-password-input-toggle");
+        if (!(i instanceof HTMLButtonElement)) throw new ElementError({
             component: PasswordInput,
-            element: n,
+            element: i,
             expectedType: "HTMLButtonElement",
             identifier: "Button (`.govuk-js-password-input-toggle`)"
         });
-        if ("button" !== n.type) throw new ElementError("Password input: Button (`.govuk-js-password-input-toggle`) must be of type `button`.");
-        this.$input = i, this.$showHideButton = n, this.i18n = new I18n(this.config.i18n, {
+        if ("button" !== i.type) throw new ElementError("Password input: Button (`.govuk-js-password-input-toggle`) must be of type `button`.");
+        this.$input = n, this.$showHideButton = i, this.i18n = new I18n(this.config.i18n, {
             locale: closestAttributeValue(this.$root, "lang")
         }), this.$showHideButton.removeAttribute("hidden");
         const s = document.createElement("div");
@@ -928,9 +928,9 @@ class PasswordInput extends ConfigurableComponent {
         if (t === this.$input.type) return;
         this.$input.setAttribute("type", t);
         const e = "password" === t,
-            i = e ? "show" : "hide",
-            n = e ? "passwordHidden" : "passwordShown";
-        this.$showHideButton.innerText = this.i18n.t(`${i}Password`), this.$showHideButton.setAttribute("aria-label", this.i18n.t(`${i}PasswordAriaLabel`)), this.$screenReaderStatusMessage.innerText = this.i18n.t(`${n}Announcement`)
+            n = e ? "show" : "hide",
+            i = e ? "passwordHidden" : "passwordShown";
+        this.$showHideButton.innerText = this.i18n.t(`${n}Password`), this.$showHideButton.setAttribute("aria-label", this.i18n.t(`${n}PasswordAriaLabel`)), this.$screenReaderStatusMessage.innerText = this.i18n.t(`${i}Announcement`)
     }
 }
 PasswordInput.moduleName = "govuk-password-input", PasswordInput.defaults = Object.freeze({
@@ -974,20 +974,20 @@ class Radios extends GOVUKFrontendComponent {
     syncConditionalRevealWithInputState(t) {
         const e = t.getAttribute("aria-controls");
         if (!e) return;
-        const i = document.getElementById(e);
-        if (null != i && i.classList.contains("govuk-radios__conditional")) {
+        const n = document.getElementById(e);
+        if (null != n && n.classList.contains("govuk-radios__conditional")) {
             const e = t.checked;
-            t.setAttribute("aria-expanded", e.toString()), i.classList.toggle("govuk-radios__conditional--hidden", !e)
+            t.setAttribute("aria-expanded", e.toString()), n.classList.toggle("govuk-radios__conditional--hidden", !e)
         }
     }
     handleClick(t) {
         const e = t.target;
         if (!(e instanceof HTMLInputElement) || "radio" !== e.type) return;
-        const i = document.querySelectorAll('input[type="radio"][aria-controls]'),
-            n = e.form,
+        const n = document.querySelectorAll('input[type="radio"][aria-controls]'),
+            i = e.form,
             s = e.name;
-        i.forEach((t => {
-            const e = t.form === n;
+        n.forEach((t => {
+            const e = t.form === i;
             t.name === s && e && this.syncConditionalRevealWithInputState(t)
         }))
     }
@@ -998,18 +998,18 @@ class ServiceNavigation extends GOVUKFrontendComponent {
         super(t), this.$menuButton = void 0, this.$menu = void 0, this.menuIsOpen = !1, this.mql = null;
         const e = this.$root.querySelector(".govuk-js-service-navigation-toggle");
         if (!e) return this;
-        const i = e.getAttribute("aria-controls");
-        if (!i) throw new ElementError({
+        const n = e.getAttribute("aria-controls");
+        if (!n) throw new ElementError({
             component: ServiceNavigation,
             identifier: 'Navigation button (`<button class="govuk-js-service-navigation-toggle">`) attribute (`aria-controls`)'
         });
-        const n = document.getElementById(i);
-        if (!n) throw new ElementError({
+        const i = document.getElementById(n);
+        if (!i) throw new ElementError({
             component: ServiceNavigation,
-            element: n,
-            identifier: `Navigation (\`<ul id="${i}">\`)`
+            element: i,
+            identifier: `Navigation (\`<ul id="${n}">\`)`
         });
-        this.$menu = n, this.$menuButton = e, this.setupResponsiveChecks(), this.$menuButton.addEventListener("click", (() => this.handleMenuButtonClick()))
+        this.$menu = i, this.$menuButton = e, this.setupResponsiveChecks(), this.$menuButton.addEventListener("click", (() => this.handleMenuButtonClick()))
     }
     setupResponsiveChecks() {
         const t = getBreakpoint("tablet");
@@ -1031,17 +1031,17 @@ class SkipLink extends GOVUKFrontendComponent {
     constructor(t) {
         var e;
         super(t);
-        const i = this.$root.hash,
-            n = null != (e = this.$root.getAttribute("href")) ? e : "";
+        const n = this.$root.hash,
+            i = null != (e = this.$root.getAttribute("href")) ? e : "";
         let s;
         try {
             s = new window.URL(this.$root.href)
         } catch (a) {
-            throw new ElementError(`Skip link: Target link (\`href="${n}"\`) is invalid`)
+            throw new ElementError(`Skip link: Target link (\`href="${i}"\`) is invalid`)
         }
         if (s.origin !== window.location.origin || s.pathname !== window.location.pathname) return;
-        const o = getFragmentFromUrl(i);
-        if (!o) throw new ElementError(`Skip link: Target link (\`href="${n}"\`) has no hash fragment`);
+        const o = getFragmentFromUrl(n);
+        if (!o) throw new ElementError(`Skip link: Target link (\`href="${i}"\`) has no hash fragment`);
         const r = document.getElementById(o);
         if (!r) throw new ElementError({
             component: SkipLink,
@@ -1068,17 +1068,17 @@ class Tabs extends GOVUKFrontendComponent {
             identifier: 'Links (`<a class="govuk-tabs__tab">`)'
         });
         this.$tabs = e, this.boundTabClick = this.onTabClick.bind(this), this.boundTabKeydown = this.onTabKeydown.bind(this), this.boundOnHashChange = this.onHashChange.bind(this);
-        const i = this.$root.querySelector(".govuk-tabs__list"),
-            n = this.$root.querySelectorAll("li.govuk-tabs__list-item");
-        if (!i) throw new ElementError({
+        const n = this.$root.querySelector(".govuk-tabs__list"),
+            i = this.$root.querySelectorAll("li.govuk-tabs__list-item");
+        if (!n) throw new ElementError({
             component: Tabs,
             identifier: 'List (`<ul class="govuk-tabs__list">`)'
         });
-        if (!n.length) throw new ElementError({
+        if (!i.length) throw new ElementError({
             component: Tabs,
             identifier: 'List items (`<li class="govuk-tabs__list-item">`)'
         });
-        this.$tabList = i, this.$tabListItems = n, this.setupResponsiveChecks()
+        this.$tabList = n, this.$tabListItems = i, this.setupResponsiveChecks()
     }
     setupResponsiveChecks() {
         const t = getBreakpoint("tablet");
@@ -1114,8 +1114,8 @@ class Tabs extends GOVUKFrontendComponent {
             e = this.getTab(t);
         if (!e) return;
         if (this.changingHash) return void(this.changingHash = !1);
-        const i = this.getCurrentTab();
-        i && (this.hideTab(i), this.showTab(e), e.focus())
+        const n = this.getCurrentTab();
+        n && (this.hideTab(n), this.showTab(e), e.focus())
     }
     hideTab(t) {
         this.unhighlightTab(t), this.hidePanel(t)
@@ -1130,8 +1130,8 @@ class Tabs extends GOVUKFrontendComponent {
         const e = getFragmentFromUrl(t.href);
         if (!e) return;
         t.setAttribute("id", `tab_${e}`), t.setAttribute("role", "tab"), t.setAttribute("aria-controls", e), t.setAttribute("aria-selected", "false"), t.setAttribute("tabindex", "-1");
-        const i = this.getPanel(t);
-        i && (i.setAttribute("role", "tabpanel"), i.setAttribute("aria-labelledby", t.id), i.classList.add(this.jsHiddenClass))
+        const n = this.getPanel(t);
+        n && (n.setAttribute("role", "tabpanel"), n.setAttribute("aria-labelledby", t.id), n.classList.add(this.jsHiddenClass))
     }
     unsetAttributes(t) {
         t.removeAttribute("id"), t.removeAttribute("role"), t.removeAttribute("aria-controls"), t.removeAttribute("aria-selected"), t.removeAttribute("tabindex");
@@ -1140,14 +1140,14 @@ class Tabs extends GOVUKFrontendComponent {
     }
     onTabClick(t) {
         const e = this.getCurrentTab(),
-            i = t.currentTarget;
-        e && i instanceof HTMLAnchorElement && (t.preventDefault(), this.hideTab(e), this.showTab(i), this.createHistoryEntry(i))
+            n = t.currentTarget;
+        e && n instanceof HTMLAnchorElement && (t.preventDefault(), this.hideTab(e), this.showTab(n), this.createHistoryEntry(n))
     }
     createHistoryEntry(t) {
         const e = this.getPanel(t);
         if (!e) return;
-        const i = e.id;
-        e.id = "", this.changingHash = !0, window.location.hash = i, e.id = i
+        const n = e.id;
+        e.id = "", this.changingHash = !0, window.location.hash = n, e.id = n
     }
     onTabKeydown(t) {
         switch (t.key) {
@@ -1165,16 +1165,16 @@ class Tabs extends GOVUKFrontendComponent {
         if (null == t || !t.parentElement) return;
         const e = t.parentElement.nextElementSibling;
         if (!e) return;
-        const i = e.querySelector("a.govuk-tabs__tab");
-        i && (this.hideTab(t), this.showTab(i), i.focus(), this.createHistoryEntry(i))
+        const n = e.querySelector("a.govuk-tabs__tab");
+        n && (this.hideTab(t), this.showTab(n), n.focus(), this.createHistoryEntry(n))
     }
     activatePreviousTab() {
         const t = this.getCurrentTab();
         if (null == t || !t.parentElement) return;
         const e = t.parentElement.previousElementSibling;
         if (!e) return;
-        const i = e.querySelector("a.govuk-tabs__tab");
-        i && (this.hideTab(t), this.showTab(i), i.focus(), this.createHistoryEntry(i))
+        const n = e.querySelector("a.govuk-tabs__tab");
+        n && (this.hideTab(t), this.showTab(n), n.focus(), this.createHistoryEntry(n))
     }
     getPanel(t) {
         const e = getFragmentFromUrl(t.href);
@@ -1204,7 +1204,7 @@ function initAll(t) {
     if (t = void 0 !== t ? t : {}, !isSupported()) return void(t.onError ? t.onError(new SupportError, {
         config: t
     }) : console.log(new SupportError));
-    const i = [
+    const n = [
             [Accordion, t.accordion],
             [Button, t.button],
             [CharacterCount, t.characterCount],
@@ -1220,32 +1220,32 @@ function initAll(t) {
             [SkipLink],
             [Tabs]
         ],
-        n = {
+        i = {
             scope: null != (e = t.scope) ? e : document,
             onError: t.onError
         };
-    i.forEach((([Component, t]) => {
-        createAll(Component, t, n)
+    n.forEach((([Component, t]) => {
+        createAll(Component, t, i)
     }))
 }
 
 function createAll(Component, t, e) {
-    let i, n = document;
+    let n, i = document;
     var s;
-    "object" == typeof e && (n = null != (s = e.scope) ? s : n, i = e.onError);
-    "function" == typeof e && (i = e), e instanceof HTMLElement && (n = e);
-    const o = n.querySelectorAll(`[data-module="${Component.moduleName}"]`);
+    "object" == typeof e && (i = null != (s = e.scope) ? s : i, n = e.onError);
+    "function" == typeof e && (n = e), e instanceof HTMLElement && (i = e);
+    const o = i.querySelectorAll(`[data-module="${Component.moduleName}"]`);
     return isSupported() ? Array.from(o).map((e => {
         try {
             return void 0 !== t ? new Component(e, t) : new Component(e)
-        } catch (n) {
-            return i ? i(n, {
+        } catch (i) {
+            return n ? n(i, {
                 element: e,
                 component: Component,
                 config: t
-            }) : console.log(n), null
+            }) : console.log(i), null
         }
-    })).filter(Boolean) : (i ? i(new SupportError, {
+    })).filter(Boolean) : (n ? n(new SupportError, {
         component: Component,
         config: t
     }) : console.log(new SupportError), [])

Action run for 64ce299

Copy link

github-actions bot commented Feb 4, 2025

Rendered HTML changes to npm package

diff --git a/packages/govuk-frontend/dist/govuk/components/file-upload/template-translated.html b/packages/govuk-frontend/dist/govuk/components/file-upload/template-translated.html
index 7ca3960e1..115e42096 100644
--- a/packages/govuk-frontend/dist/govuk/components/file-upload/template-translated.html
+++ b/packages/govuk-frontend/dist/govuk/components/file-upload/template-translated.html
@@ -4,7 +4,7 @@
   </label>
   <div
     class="govuk-file-upload-wrapper"
-    data-module="govuk-file-upload" data-i18n.select-files-button="Dewiswch ffeil" data-i18n.files-selected-default="Dim ffeiliau wedi&#39;u dewis" data-i18n.files-selected.other="%{count} ffeil wedi&#39;u dewis" data-i18n.files-selected.one="%{count} ffeil wedi&#39;i dewis" data-i18n.instruction="neu ollwng ffeil">
+    data-module="govuk-file-upload" data-i18n.choose-files-button="Dewiswch ffeil" data-i18n.no-file-chosen="Dim ffeil wedi&#39;i dewis" data-i18n.multiple-files-chosen.other="%{count} ffeil wedi&#39;u dewis" data-i18n.multiple-files-chosen.one="%{count} ffeil wedi&#39;i dewis" data-i18n.drop-instruction="neu ollwng ffeil" data-i18n.entered-drop-zone="Wedi mynd i mewn i&#39;r parth gollwng" data-i18n.left-drop-zone="Parth gollwng i&#39;r chwith">
   <input class="govuk-file-upload" id="file-upload-1" name="file-upload-1" type="file" multiple>
   </div>
 </div>

Action run for 64ce299

Copy link

github-actions bot commented Feb 4, 2025

Other changes to npm package

diff --git a/packages/govuk-frontend/dist/govuk/all.bundle.js b/packages/govuk-frontend/dist/govuk/all.bundle.js
index ee52d64f9..9f5123b71 100644
--- a/packages/govuk-frontend/dist/govuk/all.bundle.js
+++ b/packages/govuk-frontend/dist/govuk/all.bundle.js
@@ -1712,7 +1712,7 @@
       }
       const $status = document.createElement('span');
       $status.className = 'govuk-body govuk-file-upload__status';
-      $status.innerText = this.i18n.t('filesSelectedDefault');
+      $status.innerText = this.i18n.t('noFileChosen');
       $button.appendChild($status);
       const commaSpan = document.createElement('span');
       commaSpan.className = 'govuk-visually-hidden';
@@ -1723,12 +1723,12 @@
       containerSpan.className = 'govuk-file-upload__pseudo-button-container';
       const buttonSpan = document.createElement('span');
       buttonSpan.className = 'govuk-button govuk-button--secondary govuk-file-upload__pseudo-button';
-      buttonSpan.innerText = this.i18n.t('selectFilesButton');
+      buttonSpan.innerText = this.i18n.t('chooseFilesButton');
       containerSpan.appendChild(buttonSpan);
       containerSpan.insertAdjacentText('beforeend', ' ');
       const instructionSpan = document.createElement('span');
       instructionSpan.className = 'govuk-body govuk-file-upload__instruction';
-      instructionSpan.innerText = this.i18n.t('instruction');
+      instructionSpan.innerText = this.i18n.t('dropInstruction');
       containerSpan.appendChild(instructionSpan);
       $button.appendChild(containerSpan);
       $button.setAttribute('aria-labelledby', `${$label.id} ${commaSpan.id} ${$button.id}`);
@@ -1771,7 +1771,7 @@
             if (!this.$button.classList.contains('govuk-file-upload__button--dragging')) {
               this.$button.classList.add('govuk-file-upload__button--dragging');
               this.$input.classList.add('govuk-file-upload--dragging');
-              this.$announcements.innerText = this.i18n.t('dropZoneEntered');
+              this.$announcements.innerText = this.i18n.t('enteredDropZone');
             }
           }
         } else {
@@ -1784,18 +1784,18 @@
     hideDropZone() {
       this.$button.classList.remove('govuk-file-upload__button--dragging');
       this.$input.classList.remove('govuk-file-upload--dragging');
-      this.$announcements.innerText = this.i18n.t('dropZoneLeft');
+      this.$announcements.innerText = this.i18n.t('leftDropZone');
     }
     onChange() {
       const fileCount = this.$input.files.length;
       if (fileCount === 0) {
-        this.$status.innerText = this.i18n.t('filesSelectedDefault');
+        this.$status.innerText = this.i18n.t('noFileChosen');
         this.$button.classList.add('govuk-file-upload__button--empty');
       } else {
         if (fileCount === 1) {
           this.$status.innerText = this.$input.files[0].name;
         } else {
-          this.$status.innerText = this.i18n.t('filesSelected', {
+          this.$status.innerText = this.i18n.t('multipleFilesChosen', {
             count: fileCount
           });
         }
@@ -1840,15 +1840,15 @@
   FileUpload.moduleName = 'govuk-file-upload';
   FileUpload.defaults = Object.freeze({
     i18n: {
-      selectFilesButton: 'Choose file',
-      filesSelectedDefault: 'No file chosen',
-      filesSelected: {
+      chooseFilesButton: 'Choose file',
+      dropInstruction: 'or drop file',
+      noFileChosen: 'No file chosen',
+      multipleFilesChosen: {
         one: '%{count} file chosen',
         other: '%{count} files chosen'
       },
-      dropZoneEntered: 'Entered drop zone',
-      dropZoneLeft: 'Left drop zone',
-      instruction: 'or drop file'
+      enteredDropZone: 'Entered drop zone',
+      leftDropZone: 'Left drop zone'
     }
   });
   FileUpload.schema = Object.freeze({
@@ -1883,13 +1883,15 @@
    * @typedef {object} FileUploadTranslations
    *
    * Messages used by the component
-   * @property {string} [selectFiles] - Text of button that opens file browser
-   * @property {TranslationPluralForms} [filesSelected] - Text indicating how
-   *   many files have been selected
-   * @property {string} [dropZoneEntered] - Text announced to assistive technology
-   *   when users entered the drop zone while dragging
-   * @property {string} [dropZoneLeft] - Text announced to assistive technology
-   *   when users left the drop zone while dragging
+   * @property {string} [chooseFile] - The text of the button that opens the file picker
+   * @property {string} [dropInstruction] - The text informing users they can drop files
+   * @property {TranslationPluralForms} [multipleFilesChosen] - The text displayed when multiple files
+   *   have been chosen by the user
+   * @property {string} [noFileChosen] - The text to displayed when no file has been chosen by the user
+   * @property {string} [enteredDropZone] - The text announced by assistive technology
+   *   when user drags files and enters the drop zone
+   * @property {string} [leftDropZone] - The text announced by assistive technology
+   *   when user drags files and leaves the drop zone without dropping
    */
 
   /**
diff --git a/packages/govuk-frontend/dist/govuk/all.bundle.mjs b/packages/govuk-frontend/dist/govuk/all.bundle.mjs
index aae85ec36..a20682cc7 100644
--- a/packages/govuk-frontend/dist/govuk/all.bundle.mjs
+++ b/packages/govuk-frontend/dist/govuk/all.bundle.mjs
@@ -1706,7 +1706,7 @@ class FileUpload extends ConfigurableComponent {
     }
     const $status = document.createElement('span');
     $status.className = 'govuk-body govuk-file-upload__status';
-    $status.innerText = this.i18n.t('filesSelectedDefault');
+    $status.innerText = this.i18n.t('noFileChosen');
     $button.appendChild($status);
     const commaSpan = document.createElement('span');
     commaSpan.className = 'govuk-visually-hidden';
@@ -1717,12 +1717,12 @@ class FileUpload extends ConfigurableComponent {
     containerSpan.className = 'govuk-file-upload__pseudo-button-container';
     const buttonSpan = document.createElement('span');
     buttonSpan.className = 'govuk-button govuk-button--secondary govuk-file-upload__pseudo-button';
-    buttonSpan.innerText = this.i18n.t('selectFilesButton');
+    buttonSpan.innerText = this.i18n.t('chooseFilesButton');
     containerSpan.appendChild(buttonSpan);
     containerSpan.insertAdjacentText('beforeend', ' ');
     const instructionSpan = document.createElement('span');
     instructionSpan.className = 'govuk-body govuk-file-upload__instruction';
-    instructionSpan.innerText = this.i18n.t('instruction');
+    instructionSpan.innerText = this.i18n.t('dropInstruction');
     containerSpan.appendChild(instructionSpan);
     $button.appendChild(containerSpan);
     $button.setAttribute('aria-labelledby', `${$label.id} ${commaSpan.id} ${$button.id}`);
@@ -1765,7 +1765,7 @@ class FileUpload extends ConfigurableComponent {
           if (!this.$button.classList.contains('govuk-file-upload__button--dragging')) {
             this.$button.classList.add('govuk-file-upload__button--dragging');
             this.$input.classList.add('govuk-file-upload--dragging');
-            this.$announcements.innerText = this.i18n.t('dropZoneEntered');
+            this.$announcements.innerText = this.i18n.t('enteredDropZone');
           }
         }
       } else {
@@ -1778,18 +1778,18 @@ class FileUpload extends ConfigurableComponent {
   hideDropZone() {
     this.$button.classList.remove('govuk-file-upload__button--dragging');
     this.$input.classList.remove('govuk-file-upload--dragging');
-    this.$announcements.innerText = this.i18n.t('dropZoneLeft');
+    this.$announcements.innerText = this.i18n.t('leftDropZone');
   }
   onChange() {
     const fileCount = this.$input.files.length;
     if (fileCount === 0) {
-      this.$status.innerText = this.i18n.t('filesSelectedDefault');
+      this.$status.innerText = this.i18n.t('noFileChosen');
       this.$button.classList.add('govuk-file-upload__button--empty');
     } else {
       if (fileCount === 1) {
         this.$status.innerText = this.$input.files[0].name;
       } else {
-        this.$status.innerText = this.i18n.t('filesSelected', {
+        this.$status.innerText = this.i18n.t('multipleFilesChosen', {
           count: fileCount
         });
       }
@@ -1834,15 +1834,15 @@ class FileUpload extends ConfigurableComponent {
 FileUpload.moduleName = 'govuk-file-upload';
 FileUpload.defaults = Object.freeze({
   i18n: {
-    selectFilesButton: 'Choose file',
-    filesSelectedDefault: 'No file chosen',
-    filesSelected: {
+    chooseFilesButton: 'Choose file',
+    dropInstruction: 'or drop file',
+    noFileChosen: 'No file chosen',
+    multipleFilesChosen: {
       one: '%{count} file chosen',
       other: '%{count} files chosen'
     },
-    dropZoneEntered: 'Entered drop zone',
-    dropZoneLeft: 'Left drop zone',
-    instruction: 'or drop file'
+    enteredDropZone: 'Entered drop zone',
+    leftDropZone: 'Left drop zone'
   }
 });
 FileUpload.schema = Object.freeze({
@@ -1877,13 +1877,15 @@ function isContainingFiles(dataTransfer) {
  * @typedef {object} FileUploadTranslations
  *
  * Messages used by the component
- * @property {string} [selectFiles] - Text of button that opens file browser
- * @property {TranslationPluralForms} [filesSelected] - Text indicating how
- *   many files have been selected
- * @property {string} [dropZoneEntered] - Text announced to assistive technology
- *   when users entered the drop zone while dragging
- * @property {string} [dropZoneLeft] - Text announced to assistive technology
- *   when users left the drop zone while dragging
+ * @property {string} [chooseFile] - The text of the button that opens the file picker
+ * @property {string} [dropInstruction] - The text informing users they can drop files
+ * @property {TranslationPluralForms} [multipleFilesChosen] - The text displayed when multiple files
+ *   have been chosen by the user
+ * @property {string} [noFileChosen] - The text to displayed when no file has been chosen by the user
+ * @property {string} [enteredDropZone] - The text announced by assistive technology
+ *   when user drags files and enters the drop zone
+ * @property {string} [leftDropZone] - The text announced by assistive technology
+ *   when user drags files and leaves the drop zone without dropping
  */
 
 /**
diff --git a/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.js b/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.js
index 8136d9ff1..f547d13aa 100644
--- a/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.js
+++ b/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.js
@@ -539,7 +539,7 @@
       }
       const $status = document.createElement('span');
       $status.className = 'govuk-body govuk-file-upload__status';
-      $status.innerText = this.i18n.t('filesSelectedDefault');
+      $status.innerText = this.i18n.t('noFileChosen');
       $button.appendChild($status);
       const commaSpan = document.createElement('span');
       commaSpan.className = 'govuk-visually-hidden';
@@ -550,12 +550,12 @@
       containerSpan.className = 'govuk-file-upload__pseudo-button-container';
       const buttonSpan = document.createElement('span');
       buttonSpan.className = 'govuk-button govuk-button--secondary govuk-file-upload__pseudo-button';
-      buttonSpan.innerText = this.i18n.t('selectFilesButton');
+      buttonSpan.innerText = this.i18n.t('chooseFilesButton');
       containerSpan.appendChild(buttonSpan);
       containerSpan.insertAdjacentText('beforeend', ' ');
       const instructionSpan = document.createElement('span');
       instructionSpan.className = 'govuk-body govuk-file-upload__instruction';
-      instructionSpan.innerText = this.i18n.t('instruction');
+      instructionSpan.innerText = this.i18n.t('dropInstruction');
       containerSpan.appendChild(instructionSpan);
       $button.appendChild(containerSpan);
       $button.setAttribute('aria-labelledby', `${$label.id} ${commaSpan.id} ${$button.id}`);
@@ -598,7 +598,7 @@
             if (!this.$button.classList.contains('govuk-file-upload__button--dragging')) {
               this.$button.classList.add('govuk-file-upload__button--dragging');
               this.$input.classList.add('govuk-file-upload--dragging');
-              this.$announcements.innerText = this.i18n.t('dropZoneEntered');
+              this.$announcements.innerText = this.i18n.t('enteredDropZone');
             }
           }
         } else {
@@ -611,18 +611,18 @@
     hideDropZone() {
       this.$button.classList.remove('govuk-file-upload__button--dragging');
       this.$input.classList.remove('govuk-file-upload--dragging');
-      this.$announcements.innerText = this.i18n.t('dropZoneLeft');
+      this.$announcements.innerText = this.i18n.t('leftDropZone');
     }
     onChange() {
       const fileCount = this.$input.files.length;
       if (fileCount === 0) {
-        this.$status.innerText = this.i18n.t('filesSelectedDefault');
+        this.$status.innerText = this.i18n.t('noFileChosen');
         this.$button.classList.add('govuk-file-upload__button--empty');
       } else {
         if (fileCount === 1) {
           this.$status.innerText = this.$input.files[0].name;
         } else {
-          this.$status.innerText = this.i18n.t('filesSelected', {
+          this.$status.innerText = this.i18n.t('multipleFilesChosen', {
             count: fileCount
           });
         }
@@ -667,15 +667,15 @@
   FileUpload.moduleName = 'govuk-file-upload';
   FileUpload.defaults = Object.freeze({
     i18n: {
-      selectFilesButton: 'Choose file',
-      filesSelectedDefault: 'No file chosen',
-      filesSelected: {
+      chooseFilesButton: 'Choose file',
+      dropInstruction: 'or drop file',
+      noFileChosen: 'No file chosen',
+      multipleFilesChosen: {
         one: '%{count} file chosen',
         other: '%{count} files chosen'
       },
-      dropZoneEntered: 'Entered drop zone',
-      dropZoneLeft: 'Left drop zone',
-      instruction: 'or drop file'
+      enteredDropZone: 'Entered drop zone',
+      leftDropZone: 'Left drop zone'
     }
   });
   FileUpload.schema = Object.freeze({
@@ -710,13 +710,15 @@
    * @typedef {object} FileUploadTranslations
    *
    * Messages used by the component
-   * @property {string} [selectFiles] - Text of button that opens file browser
-   * @property {TranslationPluralForms} [filesSelected] - Text indicating how
-   *   many files have been selected
-   * @property {string} [dropZoneEntered] - Text announced to assistive technology
-   *   when users entered the drop zone while dragging
-   * @property {string} [dropZoneLeft] - Text announced to assistive technology
-   *   when users left the drop zone while dragging
+   * @property {string} [chooseFile] - The text of the button that opens the file picker
+   * @property {string} [dropInstruction] - The text informing users they can drop files
+   * @property {TranslationPluralForms} [multipleFilesChosen] - The text displayed when multiple files
+   *   have been chosen by the user
+   * @property {string} [noFileChosen] - The text to displayed when no file has been chosen by the user
+   * @property {string} [enteredDropZone] - The text announced by assistive technology
+   *   when user drags files and enters the drop zone
+   * @property {string} [leftDropZone] - The text announced by assistive technology
+   *   when user drags files and leaves the drop zone without dropping
    */
 
   /**
diff --git a/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.mjs b/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.mjs
index 4944c1b93..73eef83af 100644
--- a/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.mjs
+++ b/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.bundle.mjs
@@ -533,7 +533,7 @@ class FileUpload extends ConfigurableComponent {
     }
     const $status = document.createElement('span');
     $status.className = 'govuk-body govuk-file-upload__status';
-    $status.innerText = this.i18n.t('filesSelectedDefault');
+    $status.innerText = this.i18n.t('noFileChosen');
     $button.appendChild($status);
     const commaSpan = document.createElement('span');
     commaSpan.className = 'govuk-visually-hidden';
@@ -544,12 +544,12 @@ class FileUpload extends ConfigurableComponent {
     containerSpan.className = 'govuk-file-upload__pseudo-button-container';
     const buttonSpan = document.createElement('span');
     buttonSpan.className = 'govuk-button govuk-button--secondary govuk-file-upload__pseudo-button';
-    buttonSpan.innerText = this.i18n.t('selectFilesButton');
+    buttonSpan.innerText = this.i18n.t('chooseFilesButton');
     containerSpan.appendChild(buttonSpan);
     containerSpan.insertAdjacentText('beforeend', ' ');
     const instructionSpan = document.createElement('span');
     instructionSpan.className = 'govuk-body govuk-file-upload__instruction';
-    instructionSpan.innerText = this.i18n.t('instruction');
+    instructionSpan.innerText = this.i18n.t('dropInstruction');
     containerSpan.appendChild(instructionSpan);
     $button.appendChild(containerSpan);
     $button.setAttribute('aria-labelledby', `${$label.id} ${commaSpan.id} ${$button.id}`);
@@ -592,7 +592,7 @@ class FileUpload extends ConfigurableComponent {
           if (!this.$button.classList.contains('govuk-file-upload__button--dragging')) {
             this.$button.classList.add('govuk-file-upload__button--dragging');
             this.$input.classList.add('govuk-file-upload--dragging');
-            this.$announcements.innerText = this.i18n.t('dropZoneEntered');
+            this.$announcements.innerText = this.i18n.t('enteredDropZone');
           }
         }
       } else {
@@ -605,18 +605,18 @@ class FileUpload extends ConfigurableComponent {
   hideDropZone() {
     this.$button.classList.remove('govuk-file-upload__button--dragging');
     this.$input.classList.remove('govuk-file-upload--dragging');
-    this.$announcements.innerText = this.i18n.t('dropZoneLeft');
+    this.$announcements.innerText = this.i18n.t('leftDropZone');
   }
   onChange() {
     const fileCount = this.$input.files.length;
     if (fileCount === 0) {
-      this.$status.innerText = this.i18n.t('filesSelectedDefault');
+      this.$status.innerText = this.i18n.t('noFileChosen');
       this.$button.classList.add('govuk-file-upload__button--empty');
     } else {
       if (fileCount === 1) {
         this.$status.innerText = this.$input.files[0].name;
       } else {
-        this.$status.innerText = this.i18n.t('filesSelected', {
+        this.$status.innerText = this.i18n.t('multipleFilesChosen', {
           count: fileCount
         });
       }
@@ -661,15 +661,15 @@ class FileUpload extends ConfigurableComponent {
 FileUpload.moduleName = 'govuk-file-upload';
 FileUpload.defaults = Object.freeze({
   i18n: {
-    selectFilesButton: 'Choose file',
-    filesSelectedDefault: 'No file chosen',
-    filesSelected: {
+    chooseFilesButton: 'Choose file',
+    dropInstruction: 'or drop file',
+    noFileChosen: 'No file chosen',
+    multipleFilesChosen: {
       one: '%{count} file chosen',
       other: '%{count} files chosen'
     },
-    dropZoneEntered: 'Entered drop zone',
-    dropZoneLeft: 'Left drop zone',
-    instruction: 'or drop file'
+    enteredDropZone: 'Entered drop zone',
+    leftDropZone: 'Left drop zone'
   }
 });
 FileUpload.schema = Object.freeze({
@@ -704,13 +704,15 @@ function isContainingFiles(dataTransfer) {
  * @typedef {object} FileUploadTranslations
  *
  * Messages used by the component
- * @property {string} [selectFiles] - Text of button that opens file browser
- * @property {TranslationPluralForms} [filesSelected] - Text indicating how
- *   many files have been selected
- * @property {string} [dropZoneEntered] - Text announced to assistive technology
- *   when users entered the drop zone while dragging
- * @property {string} [dropZoneLeft] - Text announced to assistive technology
- *   when users left the drop zone while dragging
+ * @property {string} [chooseFile] - The text of the button that opens the file picker
+ * @property {string} [dropInstruction] - The text informing users they can drop files
+ * @property {TranslationPluralForms} [multipleFilesChosen] - The text displayed when multiple files
+ *   have been chosen by the user
+ * @property {string} [noFileChosen] - The text to displayed when no file has been chosen by the user
+ * @property {string} [enteredDropZone] - The text announced by assistive technology
+ *   when user drags files and enters the drop zone
+ * @property {string} [leftDropZone] - The text announced by assistive technology
+ *   when user drags files and leaves the drop zone without dropping
  */
 
 /**
diff --git a/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.mjs b/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.mjs
index 946017c77..fc281526c 100644
--- a/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.mjs
+++ b/packages/govuk-frontend/dist/govuk/components/file-upload/file-upload.mjs
@@ -54,7 +54,7 @@ class FileUpload extends ConfigurableComponent {
     }
     const $status = document.createElement('span');
     $status.className = 'govuk-body govuk-file-upload__status';
-    $status.innerText = this.i18n.t('filesSelectedDefault');
+    $status.innerText = this.i18n.t('noFileChosen');
     $button.appendChild($status);
     const commaSpan = document.createElement('span');
     commaSpan.className = 'govuk-visually-hidden';
@@ -65,12 +65,12 @@ class FileUpload extends ConfigurableComponent {
     containerSpan.className = 'govuk-file-upload__pseudo-button-container';
     const buttonSpan = document.createElement('span');
     buttonSpan.className = 'govuk-button govuk-button--secondary govuk-file-upload__pseudo-button';
-    buttonSpan.innerText = this.i18n.t('selectFilesButton');
+    buttonSpan.innerText = this.i18n.t('chooseFilesButton');
     containerSpan.appendChild(buttonSpan);
     containerSpan.insertAdjacentText('beforeend', ' ');
     const instructionSpan = document.createElement('span');
     instructionSpan.className = 'govuk-body govuk-file-upload__instruction';
-    instructionSpan.innerText = this.i18n.t('instruction');
+    instructionSpan.innerText = this.i18n.t('dropInstruction');
     containerSpan.appendChild(instructionSpan);
     $button.appendChild(containerSpan);
     $button.setAttribute('aria-labelledby', `${$label.id} ${commaSpan.id} ${$button.id}`);
@@ -113,7 +113,7 @@ class FileUpload extends ConfigurableComponent {
           if (!this.$button.classList.contains('govuk-file-upload__button--dragging')) {
             this.$button.classList.add('govuk-file-upload__button--dragging');
             this.$input.classList.add('govuk-file-upload--dragging');
-            this.$announcements.innerText = this.i18n.t('dropZoneEntered');
+            this.$announcements.innerText = this.i18n.t('enteredDropZone');
           }
         }
       } else {
@@ -126,18 +126,18 @@ class FileUpload extends ConfigurableComponent {
   hideDropZone() {
     this.$button.classList.remove('govuk-file-upload__button--dragging');
     this.$input.classList.remove('govuk-file-upload--dragging');
-    this.$announcements.innerText = this.i18n.t('dropZoneLeft');
+    this.$announcements.innerText = this.i18n.t('leftDropZone');
   }
   onChange() {
     const fileCount = this.$input.files.length;
     if (fileCount === 0) {
-      this.$status.innerText = this.i18n.t('filesSelectedDefault');
+      this.$status.innerText = this.i18n.t('noFileChosen');
       this.$button.classList.add('govuk-file-upload__button--empty');
     } else {
       if (fileCount === 1) {
         this.$status.innerText = this.$input.files[0].name;
       } else {
-        this.$status.innerText = this.i18n.t('filesSelected', {
+        this.$status.innerText = this.i18n.t('multipleFilesChosen', {
           count: fileCount
         });
       }
@@ -182,15 +182,15 @@ class FileUpload extends ConfigurableComponent {
 FileUpload.moduleName = 'govuk-file-upload';
 FileUpload.defaults = Object.freeze({
   i18n: {
-    selectFilesButton: 'Choose file',
-    filesSelectedDefault: 'No file chosen',
-    filesSelected: {
+    chooseFilesButton: 'Choose file',
+    dropInstruction: 'or drop file',
+    noFileChosen: 'No file chosen',
+    multipleFilesChosen: {
       one: '%{count} file chosen',
       other: '%{count} files chosen'
     },
-    dropZoneEntered: 'Entered drop zone',
-    dropZoneLeft: 'Left drop zone',
-    instruction: 'or drop file'
+    enteredDropZone: 'Entered drop zone',
+    leftDropZone: 'Left drop zone'
   }
 });
 FileUpload.schema = Object.freeze({
@@ -225,13 +225,15 @@ function isContainingFiles(dataTransfer) {
  * @typedef {object} FileUploadTranslations
  *
  * Messages used by the component
- * @property {string} [selectFiles] - Text of button that opens file browser
- * @property {TranslationPluralForms} [filesSelected] - Text indicating how
- *   many files have been selected
- * @property {string} [dropZoneEntered] - Text announced to assistive technology
- *   when users entered the drop zone while dragging
- * @property {string} [dropZoneLeft] - Text announced to assistive technology
- *   when users left the drop zone while dragging
+ * @property {string} [chooseFile] - The text of the button that opens the file picker
+ * @property {string} [dropInstruction] - The text informing users they can drop files
+ * @property {TranslationPluralForms} [multipleFilesChosen] - The text displayed when multiple files
+ *   have been chosen by the user
+ * @property {string} [noFileChosen] - The text to displayed when no file has been chosen by the user
+ * @property {string} [enteredDropZone] - The text announced by assistive technology
+ *   when user drags files and enters the drop zone
+ * @property {string} [leftDropZone] - The text announced by assistive technology
+ *   when user drags files and leaves the drop zone without dropping
  */
 
 /**
diff --git a/packages/govuk-frontend/dist/govuk/components/file-upload/fixtures.json b/packages/govuk-frontend/dist/govuk/components/file-upload/fixtures.json
index 68836c627..8f9ee6edf 100644
--- a/packages/govuk-frontend/dist/govuk/components/file-upload/fixtures.json
+++ b/packages/govuk-frontend/dist/govuk/components/file-upload/fixtures.json
@@ -225,19 +225,21 @@
                 },
                 "multiple": true,
                 "javascript": true,
-                "selectFilesButtonText": "Dewiswch ffeil",
-                "instructionText": "neu ollwng ffeil",
-                "filesSelectedDefaultText": "Dim ffeiliau wedi'u dewis",
-                "filesSelectedText": {
+                "chooseFilesButtonText": "Dewiswch ffeil",
+                "dropInstructionText": "neu ollwng ffeil",
+                "noFileChosenText": "Dim ffeil wedi'i dewis",
+                "multipleFilesChosenText": {
                     "other": "%{count} ffeil wedi'u dewis",
                     "one": "%{count} ffeil wedi'i dewis"
-                }
+                },
+                "enteredDropZoneText": "Wedi mynd i mewn i'r parth gollwng",
+                "leftDropZoneText": "Parth gollwng i'r chwith"
             },
             "hidden": false,
             "description": "",
             "previewLayoutModifiers": [],
             "screenshot": false,
-            "html": "<div class=\"govuk-form-group\">\n  <label class=\"govuk-label\" for=\"file-upload-1\">\n    Llwythwch ffeil i fyny\n  </label>\n  <div\n    class=\"govuk-file-upload-wrapper\"\n    data-module=\"govuk-file-upload\" data-i18n.select-files-button=\"Dewiswch ffeil\" data-i18n.files-selected-default=\"Dim ffeiliau wedi&#39;u dewis\" data-i18n.files-selected.other=\"%{count} ffeil wedi&#39;u dewis\" data-i18n.files-selected.one=\"%{count} ffeil wedi&#39;i dewis\" data-i18n.instruction=\"neu ollwng ffeil\">\n  <input class=\"govuk-file-upload\" id=\"file-upload-1\" name=\"file-upload-1\" type=\"file\" multiple>\n  </div>\n</div>"
+            "html": "<div class=\"govuk-form-group\">\n  <label class=\"govuk-label\" for=\"file-upload-1\">\n    Llwythwch ffeil i fyny\n  </label>\n  <div\n    class=\"govuk-file-upload-wrapper\"\n    data-module=\"govuk-file-upload\" data-i18n.choose-files-button=\"Dewiswch ffeil\" data-i18n.no-file-chosen=\"Dim ffeil wedi&#39;i dewis\" data-i18n.multiple-files-chosen.other=\"%{count} ffeil wedi&#39;u dewis\" data-i18n.multiple-files-chosen.one=\"%{count} ffeil wedi&#39;i dewis\" data-i18n.drop-instruction=\"neu ollwng ffeil\" data-i18n.entered-drop-zone=\"Wedi mynd i mewn i&#39;r parth gollwng\" data-i18n.left-drop-zone=\"Parth gollwng i&#39;r chwith\">\n  <input class=\"govuk-file-upload\" id=\"file-upload-1\" name=\"file-upload-1\" type=\"file\" multiple>\n  </div>\n</div>"
         },
         {
             "name": "with value",
@@ -407,12 +409,14 @@
                     "text": "Llwythwch ffeil i fyny"
                 },
                 "multiple": true,
-                "selectFilesButtonText": "Dewiswch ffeil",
-                "filesSelectedDefaultText": "Dim ffeiliau wedi'u dewis",
-                "filesSelectedText": {
+                "chooseFilesButtonText": "Dewiswch ffeil",
+                "noFileChosenText": "Dim ffeiliau wedi'u dewis",
+                "multipleFilesChosenText": {
                     "other": "%{count} ffeil wedi'u dewis",
                     "one": "%{count} ffeil wedi'i dewis"
-                }
+                },
+                "enteredDropZoneText": "Wedi mynd i mewn i'r parth gollwng",
+                "leftDropZoneText": "Parth gollwng i'r chwith"
             },
             "hidden": true,
             "description": "",
diff --git a/packages/govuk-frontend/dist/govuk/components/file-upload/macro-options.json b/packages/govuk-frontend/dist/govuk/components/file-upload/macro-options.json
index 71d0b7e6e..b1e5f033b 100644
--- a/packages/govuk-frontend/dist/govuk/components/file-upload/macro-options.json
+++ b/packages/govuk-frontend/dist/govuk/components/file-upload/macro-options.json
@@ -120,31 +120,43 @@
         "name": "javascript",
         "type": "boolean",
         "required": false,
-        "description": "Whether to enable JavaScript enhancements for the component"
+        "description": "Can be used to enable JavaScript enhancements for the component."
     },
     {
-        "name": "selectFilesButtonText",
+        "name": "chooseFilesButtonText",
         "type": "string",
         "required": false,
-        "description": "The text of the button that opens the file picker. JavaScript enhanced version of the component only. Default is \"Choose file\"."
+        "description": "The text of the button that opens the file picker. Default is `\"Choose file\"`. If `javascript` is not provided, this option will be ignored."
     },
     {
-        "name": "instructionText",
+        "name": "dropInstructionText",
         "type": "string",
         "required": false,
-        "description": "The text of the instruction text that follows the button that opens the file picker. JavaScript enhanced version of the component only. Default is \"or drop file\"."
+        "description": "The text informing users they can drop files. Default is `\"or drop file\"`. If `javascript` is not provided, this option will be ignored."
     },
     {
-        "name": "filesSelected",
+        "name": "multipleFilesChosenText",
         "type": "object",
         "required": false,
-        "description": "The text to display when multiple files has been chosen by the user. JavaScript enhanced version of the component only. The component will replace the `%{count}` placeholder with the number of files selected. This is a [pluralised list of messages](https://frontend.design-system.service.gov.uk/localise-govuk-frontend)."
+        "description": "The text displayed when multiple files have been chosen by the user. The component will replace the `%{count}` placeholder with the number of files selected. [Our pluralisation rules apply to this macro option](https://frontend.design-system.service.gov.uk/localise-govuk-frontend/#understanding-pluralisation-rules). If `javascript` is not provided, this option will be ignored."
     },
     {
-        "name": "filesSelectedDefault",
+        "name": "noFileChosenText",
         "type": "string",
         "required": false,
-        "description": "The text to display when no file has been chosen by the user. JavaScript enhanced version of the component only. Default is \"No file chosen\"."
+        "description": "The text displayed when no file has been chosen by the user. Default is `\"No file chosen\"`. If `javascript` is not provided, this option will be ignored."
+    },
+    {
+        "name": "enteredDropZoneText",
+        "type": "string",
+        "required": false,
+        "description": "The text announced by assistive technology when user drags files and enters the drop zone. Default is `\"Entered drop zone\"`. If `javascript` is not provided, this option will be ignored."
+    },
+    {
+        "name": "leftDropZoneText",
+        "type": "string",
+        "required": false,
+        "description": "The text announced by assistive technology when user drags files and leaves the drop zone without dropping. Default is `\"Left drop zone\"`. If `javascript` is not provided, this option will be ignored."
     },
     {
         "name": "classes",

Action run for 64ce299

@romaricpascal romaricpascal force-pushed the file-upload-macro-options-docs branch from 9712c55 to 15ba328 Compare February 4, 2025 19:42
@romaricpascal romaricpascal force-pushed the file-upload-macro-options-docs branch from 15ba328 to ee3e5a1 Compare February 6, 2025 11:23
@romaricpascal romaricpascal force-pushed the spike-enhanced-file-upload branch from 418e51f to 0c0ffbe Compare February 6, 2025 18:37
@romaricpascal romaricpascal force-pushed the file-upload-macro-options-docs branch from ee3e5a1 to 8e1c002 Compare February 6, 2025 18:46
@romaricpascal romaricpascal force-pushed the file-upload-macro-options-docs branch from 8e1c002 to 5cd2c86 Compare February 6, 2025 19:07
@romaricpascal romaricpascal linked an issue Feb 7, 2025 that may be closed by this pull request
1 task
- Consistently talk about 'choosing a file' to align with the button's default.
- Ensure order is consistent between description, default and condition for translation options.
- Ensure all translation options are suffixed by 'Text'

Co-authored-by: @seaemsi
@romaricpascal romaricpascal force-pushed the file-upload-macro-options-docs branch from 5cd2c86 to 77f96cf Compare February 10, 2025 10:26
Looks like it was dropped at some point, possibly during a rebase
Looks like it was dropped at some point, possibly during a rebase
@romaricpascal romaricpascal force-pushed the file-upload-macro-options-docs branch from 77f96cf to 64ce299 Compare February 10, 2025 10:36
@govuk-design-system-ci govuk-design-system-ci temporarily deployed to govuk-frontend-pr-5702 February 10, 2025 10:36 Inactive
@romaricpascal romaricpascal merged commit 1233415 into spike-enhanced-file-upload Feb 10, 2025
46 checks passed
@romaricpascal romaricpascal deleted the file-upload-macro-options-docs branch February 10, 2025 11:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Confirm naming and documentation of the macro options is appropriate
3 participants