govuk_publishing_components 68.3.0 → 69.0.1

data/app/views/govuk_publishing_components/components/_metadata.html.erb

@@ -10,6 +10,9 @@
   page_history ||= []
   page_history = Array(page_history)
 
+  history ||= nil
+  first_published ||= nil
+  last_updated ||= nil
   other ||= nil
   inverse ||= false
   inverse_compress ||= false
@@ -34,83 +37,87 @@
     type: "content history",
     section: "Top",
   }.to_json unless disable_ga4
+
+  render_component = true if from.any? || part_of.any? || history || first_published || last_updated || page_history.any? || other
 %>
-<%= tag.div(**component_helper.all_attributes) do %>
-  <% if title.present? %>
-    <%= render "govuk_publishing_components/components/heading", {
-      text: sanitize(title),
-      font_size: "m",
-      inverse:,
-      margin_bottom: 2,
-    } %>
-  <% elsif page_history.any? %>
-    <h2 class="govuk-visually-hidden"><%= t("components.metadata.hidden_heading") %></h2>
-  <% end %>
-  <dl class="gem-c-metadata__list">
-    <% if from.any? %>
-      <dt class="gem-c-metadata__term"><%= t("components.metadata.from") %>:</dt>
-      <dd class="gem-c-metadata__definition">
-        <%= render "govuk_publishing_components/components/metadata/sentence", items: from, toggle_id: "from-#{SecureRandom.hex(4)}" %>
-      </dd>
-    <% end %>
-    <% if part_of.any? %>
-      <dt class="gem-c-metadata__term"><%= t("components.metadata.part_of") %>:</dt>
-      <dd class="gem-c-metadata__definition">
-        <%= render "govuk_publishing_components/components/metadata/sentence", items: part_of, toggle_id: "part-of-#{SecureRandom.hex(4)}" %>
-      </dd>
-    <% end %>
-    <% if local_assigns.include?(:history) %>
-      <dt class="gem-c-metadata__term"><%= t("components.metadata.history") %>:</dt>
-      <dd class="gem-c-metadata__definition"><%= history %></dd>
-    <% end %>
-    <% if local_assigns.include?(:first_published) && first_published %>
-      <dt class="gem-c-metadata__term"><%= t("components.metadata.published") %>:</dt>
-      <dd class="gem-c-metadata__definition"><%= first_published %></dd>
+<% if render_component %>
+  <%= tag.div(**component_helper.all_attributes) do %>
+    <% if title.present? %>
+      <%= render "govuk_publishing_components/components/heading", {
+        text: sanitize(title),
+        font_size: "m",
+        inverse:,
+        margin_bottom: 2,
+      } %>
+    <% elsif page_history.any? %>
+      <h2 class="govuk-visually-hidden"><%= t("components.metadata.hidden_heading") %></h2>
     <% end %>
-    <% if local_assigns.include?(:last_updated) && last_updated %>
-      <dt class="gem-c-metadata__term"><%= t("components.metadata.last_updated") %>:</dt>
-      <dd class="gem-c-metadata__definition">
-        <%= last_updated %>
-        <% if local_assigns.include?(:see_updates_link) %>
-          &#8212; <a href="#full-publication-update-history"
-                    class="gem-c-metadata__definition-link govuk-!-display-none-print js-see-all-updates-link">
-            <%= t("components.metadata.see_all_updates") %>
-          </a>
-        <% end %>
-        <% if page_history.any? %>
-          <%= render "govuk_publishing_components/components/details", {
-            title: t("components.metadata.show_all_updates", locale: :en),
-            small: true,
-          } do %>
-            <ol class="gem-c-metadata__change-history">
-              <% page_history.each do |change| %>
-                <li class="gem-c-metadata__change-history-item">
-                  <time class="gem-c-metadata__change-date" datetime="<%= change[:timestamp] %>"><%= change[:display_time] %></time>
-                  <p class="gem-c-metadata__change-note"><%= change[:note].strip %></p>
-                </li>
-              <% end %>
-            </ol>
+    <dl class="gem-c-metadata__list">
+      <% if from.any? %>
+        <dt class="gem-c-metadata__term"><%= t("components.metadata.from") %>:</dt>
+        <dd class="gem-c-metadata__definition">
+          <%= render "govuk_publishing_components/components/metadata/sentence", items: from, toggle_id: "from-#{SecureRandom.hex(4)}" %>
+        </dd>
+      <% end %>
+      <% if part_of.any? %>
+        <dt class="gem-c-metadata__term"><%= t("components.metadata.part_of") %>:</dt>
+        <dd class="gem-c-metadata__definition">
+          <%= render "govuk_publishing_components/components/metadata/sentence", items: part_of, toggle_id: "part-of-#{SecureRandom.hex(4)}" %>
+        </dd>
+      <% end %>
+      <% if local_assigns.include?(:history) %>
+        <dt class="gem-c-metadata__term"><%= t("components.metadata.history") %>:</dt>
+        <dd class="gem-c-metadata__definition"><%= history %></dd>
+      <% end %>
+      <% if local_assigns.include?(:first_published) && first_published %>
+        <dt class="gem-c-metadata__term"><%= t("components.metadata.published") %>:</dt>
+        <dd class="gem-c-metadata__definition"><%= first_published %></dd>
+      <% end %>
+      <% if local_assigns.include?(:last_updated) && last_updated %>
+        <dt class="gem-c-metadata__term"><%= t("components.metadata.last_updated") %>:</dt>
+        <dd class="gem-c-metadata__definition">
+          <%= last_updated %>
+          <% if local_assigns.include?(:see_updates_link) %>
+            &#8212; <a href="#full-publication-update-history"
+                      class="gem-c-metadata__definition-link govuk-!-display-none-print js-see-all-updates-link">
+              <%= t("components.metadata.see_all_updates") %>
+            </a>
+          <% end %>
+          <% if page_history.any? %>
+            <%= render "govuk_publishing_components/components/details", {
+              title: t("components.metadata.show_all_updates", locale: :en),
+              small: true,
+            } do %>
+              <ol class="gem-c-metadata__change-history">
+                <% page_history.each do |change| %>
+                  <li class="gem-c-metadata__change-history-item">
+                    <time class="gem-c-metadata__change-date" datetime="<%= change[:timestamp] %>"><%= change[:display_time] %></time>
+                    <p class="gem-c-metadata__change-note"><%= change[:note].strip %></p>
+                  </li>
+                <% end %>
+              </ol>
+            <% end %>
+          <% end %>
+        </dd>
+      <% end %>
+      <% if other.present? %>
+        <% other.each_with_index do |(title, definition), index| %>
+          <%
+            definition ||= []
+            definition = Array(definition)
+          %>
+          <% if definition.any? %>
+            <dt class="gem-c-metadata__term"><%= title %>:</dt>
+            <dd class="gem-c-metadata__definition"
+              <% unless disable_ga4 %>
+                data-module="ga4-link-tracker"
+                data-ga4-link="<%= ga4_object %>"
+              <% end %>>
+              <%= render "govuk_publishing_components/components/metadata/sentence", items: definition, toggle_id: "#{index}-#{SecureRandom.hex(4)}" %>
+            </dd>
           <% end %>
-        <% end %>
-      </dd>
-    <% end %>
-    <% if other.present? %>
-      <% other.each_with_index do |(title, definition), index| %>
-        <%
-          definition ||= []
-          definition = Array(definition)
-        %>
-        <% if definition.any? %>
-          <dt class="gem-c-metadata__term"><%= title %>:</dt>
-          <dd class="gem-c-metadata__definition"
-            <% unless disable_ga4 %>
-              data-module="ga4-link-tracker"
-              data-ga4-link="<%= ga4_object %>"
-            <% end %>>
-            <%= render "govuk_publishing_components/components/metadata/sentence", items: definition, toggle_id: "#{index}-#{SecureRandom.hex(4)}" %>
-          </dd>
         <% end %>
       <% end %>
-    <% end %>
-  </dl>
+    </dl>
+  <% end %>
 <% end %>

data/app/views/govuk_publishing_components/components/docs/date_input.yml

@@ -1,5 +1,6 @@
 name: Form date input
 description: Use the date input component to help users enter a memorable date or one they can easily look up.
+uses_component_wrapper_helper: true
 accessibility_criteria: |
   Inputs in the component must:
 
@@ -36,22 +37,44 @@ examples:
   with_legend:
     data:
       legend_text: "What is your date of birth?"
+  with_legend_level_and_size:
+    description: Valid options for level are 1 to 6. Valid options for size are s, m, l and xl.
+    data:
+      legend_text: "What is your date of birth?"
+      legend_heading_level: 2
+      legend_size: "l"
   with_hint:
+    description: When hint text is rendered each input field takes the value of `hint_id` as a value for the `aria-describedby` attribute
     data:
       legend_text: "What is your date of birth?"
       hint: "For example, 31 3 1980"
   with_error:
+    description: When an error message is rendered each input field takes the value of `error_id` as a value for the `aria-describedby` attribute. Note that error_id is optional, if it is not passed one will be generated automatically.
     data:
       legend_text: "What is your date of birth?"
       hint: "For example, 31 3 1980"
+      error_id: error_item_id
       error_message: "Error message goes here"
   with_error_items:
+    description: When error messages are rendered each input field takes the value of `error_id` as a value for the `aria-describedby` attribute. Note that error_id is optional, if it is not passed one will be generated automatically.
     data:
       legend_text: "What is your date of birth?"
       hint: "For example, 31 3 1980"
+      error_id: error_id
       error_items:
         - text: "Error 1"
         - text: "Error 2"
+  with_error_id_but_no_message:
+    description: For some instances of this component the error message should be rendered separately but an error state is still required. In this scenario an `error_id` can be passed without an `error_message` to highlight the component and set `aria-describedby` correctly.
+    data:
+      legend_text: "What is your date of birth?"
+      hint: "For example, 31 3 1980"
+      error_id: error_id
+  with_data_attributes:
+    data:
+      data_attributes:
+        module: "some-module"
+        other_attribute: "something-else"
   with_custom_items:
     data:
       legend_text: "Beth yw eich dyddiad geni?"

data/app/views/govuk_publishing_components/components/docs/govspeak.yml

@@ -634,7 +634,32 @@ examples:
               <td>row 3</td><td>2</td>
             </tr>
             <tr>
-              <td>row 4</td><td>48</td>
+              <td>row 4</td><td>No data</td>
+            </tr>
+          </tbody>
+        </table>
+  negative_charts:
+    description: |
+      Charts can contain positive and negative values if the 'mc-negative' class is added to the table.
+    data:
+      block: |
+        <table class='js-barchart-table mc-auto-outdent mc-negative'>
+          <caption>Calorie Gain/Loss by Superhero</caption>
+          <tbody>
+            <tr>
+              <td>Hulk</td><td>6000</td>
+            </tr>
+            <tr>
+              <td>Thor</td><td>5000</td>
+            </tr>
+            <tr>
+              <td>Spiderman</td><td>-2000</td>
+            </tr>
+            <tr>
+              <td>Iron Man</td><td>No data</td>
+            </tr>
+            <tr>
+              <td>Black Widow</td><td>-1500</td>
             </tr>
           </tbody>
         </table>
@@ -686,9 +711,9 @@ examples:
             <tr><th>Some Data</th><th>YES</th><th>NO</th><th>MAYBE</th></tr>
           </thead>
           <tbody>
-            <tr><th>Testing One</th><td>5</td><td>6</td><td>11</td></tr>
-            <tr><th>Testing Two</th><td>6</td><td>2</td><td>8</td></tr>
-            <tr><th>Testing Three</th><td>3</td><td>9</td><td>12</td></tr>
+            <tr><th>Testing One</th><td>No data</td><td>7</td><td>6</td></tr>
+            <tr><th>Testing Two</th><td>6</td><td>2</td><td>No data</td></tr>
+            <tr><th>Testing Three</th><td>3</td><td>No data</td><td>9</td></tr>
           </tbody>
         </table>
   chart_stacked:
@@ -700,6 +725,7 @@ examples:
               <th scope="col">Colours</th>
               <th scope="col">Fruits</th>
               <th scope="col">Vegetables</th>
+              <th scope="col">Chocolates</th>
               <th scope="col">Beans</th>
               <th scope="col">Nuts</th>
               <th scope="col">Total</th>
@@ -709,6 +735,7 @@ examples:
             <tr>
               <td>Red</td>
               <td>23</td>
+              <td> No data</td>
               <td>9</td>
               <td>2</td>
               <td>1</td>
@@ -717,6 +744,7 @@ examples:
             <tr>
               <td>Green</td>
               <td>5</td>
+              <td>No data</td>
               <td>33</td>
               <td>8</td>
               <td>0</td>
@@ -727,6 +755,7 @@ examples:
               <td>2</td>
               <td>10</td>
               <td>0</td>
+              <td>No data</td>
               <td>15</td>
               <td>27</td>
             </tr>

data/lib/govuk_publishing_components/version.rb

@@ -1,3 +1,3 @@
 module GovukPublishingComponents
-  VERSION = "68.3.0".freeze
+  VERSION = "69.0.1".freeze
 end

data/node_modules/choices.js/README.md

@@ -1100,7 +1100,7 @@ choices.disable();
 
 **Usage:** Remove each selectable item.
 
-## removeChoice(value: string);
+### removeChoice(value: string);
 
 **Input types affected:** `text`, `select-multiple`, `select-one`
 

data/node_modules/choices.js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "choices.js",
-  "version": "11.2.3",
+  "version": "11.2.4",
   "description": "A vanilla JS customisable text input/select box plugin",
   "main": "./public/assets/scripts/choices.js",
   "module": "./public/assets/scripts/choices.mjs",
@@ -105,11 +105,9 @@
     "@rollup/plugin-replace": "^5.0.7",
     "@rollup/plugin-terser": "^1.0.0",
     "@rollup/plugin-typescript": "^11.1.6",
-    "@types/chai": "^4.3.17",
     "@types/node": "^22.12.0",
-    "@types/sinon": "^17.0.3",
-    "@types/sinon-chai": "^3.2.12",
-    "@vitest/coverage-v8": "^3.2.4",
+    "@vitest/coverage-v8": "^4.1.9",
+    "@vitest/spy": "^4.1.10",
     "autoprefixer": "^10.4.20",
     "bundlesize2": "^0.0.35",
     "chai": "^5.1.1",
@@ -131,17 +129,15 @@
     "postcss-cli": "^11.0.0",
     "prettier": "^3.3.3",
     "rollup": "^4.20.0",
-    "rollup-plugin-dev": "^2.0.5",
+    "rollup-plugin-dev": "^2.0.3",
     "sass": "^1.77.8",
-    "sinon": "^18.0.0",
-    "sinon-chai": "^4.0.0",
     "stylelint": "^16.7.0",
     "stylelint-config-standard": "^36.0.1",
     "stylelint-config-standard-scss": "^13.1.0",
     "tslib": "^2.6.3",
     "typescript": "5.5.x",
     "typescript-eslint": "^8.0.1",
-    "vitest": "^3.2.4"
+    "vitest": "^4.1.10"
   },
   "dependencies": {
     "fuse.js": "^7.0.0"

data/node_modules/choices.js/public/assets/scripts/choices.js

@@ -1,4 +1,4 @@
-/*! choices.js v11.2.3 | © 2026 Josh Johnson | https://github.com/Choices-js/Choices#readme */
+/*! choices.js v11.2.4 | © 2026 Josh Johnson | https://github.com/Choices-js/Choices#readme */
 
 (function (global, factory) {
     typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -357,7 +357,9 @@
          */
         Dropdown.prototype.show = function () {
             addClassesToElement(this.element, this.classNames.activeState);
-            this.element.setAttribute('aria-expanded', 'true');
+            if (this.type !== PassedElementTypes.Text) {
+                this.element.setAttribute('aria-expanded', 'true');
+            }
             this.isActive = true;
             return this;
         };
@@ -366,7 +368,9 @@
          */
         Dropdown.prototype.hide = function () {
             removeClassesFromElement(this.element, this.classNames.activeState);
-            this.element.setAttribute('aria-expanded', 'false');
+            if (this.type !== PassedElementTypes.Text) {
+                this.element.setAttribute('aria-expanded', 'false');
+            }
             this.isActive = false;
             return this;
         };
@@ -2191,7 +2195,7 @@
       static isSingleMatch(pattern) {
         return getMatch(pattern, this.singleRegex);
       }
-      search( /*text*/) {}
+      search(/*text*/) {}
     }
     function getMatch(pattern, exp) {
       const matches = pattern.match(exp);
@@ -2770,7 +2774,7 @@
         this._docs.push(doc);
         this._myIndex.add(doc);
       }
-      remove(predicate = ( /* doc, idx */) => false) {
+      remove(predicate = (/* doc, idx */) => false) {
         const results = [];
         for (let i = 0, len = this._docs.length; i < len; i += 1) {
           const doc = this._docs[i];
@@ -3317,12 +3321,14 @@
             }
             return inp;
         },
-        dropdown: function (_a) {
+        dropdown: function (_a, passedElementType) {
             var _b = _a.classNames, list = _b.list, listDropdown = _b.listDropdown;
             var div = document.createElement('div');
             addClassesToElement(div, list);
             addClassesToElement(div, listDropdown);
-            div.setAttribute('aria-expanded', 'false');
+            if (passedElementType !== PassedElementTypes.Text) {
+                div.setAttribute('aria-expanded', 'false');
+            }
             return div;
         },
         notice: function (_a, innerHTML, type) {
@@ -3697,13 +3703,14 @@
                 // eslint-disable-next-line no-param-reassign
                 preventInputFocus = !this._canSearch;
             }
+            // to ensure a virtual keyboard trigger as expected, the focus/animation must be started from the input event and not an animation frame which
+            this.dropdown.show();
+            var rect = this.dropdown.element.getBoundingClientRect();
+            this.containerOuter.open(rect.bottom, rect.height);
+            if (!preventInputFocus) {
+                this.input.focus();
+            }
             requestAnimationFrame(function () {
-                _this.dropdown.show();
-                var rect = _this.dropdown.element.getBoundingClientRect();
-                _this.containerOuter.open(rect.bottom, rect.height);
-                if (!preventInputFocus) {
-                    _this.input.focus();
-                }
                 _this.passedElement.triggerEvent(EventType.showDropdown);
                 var activeElement = _this.choiceList.element.querySelector(getClassNamesSelector(_this.config.classNames.selectedState));
                 if (activeElement !== null && !isScrolledIntoView(activeElement, _this.choiceList.element)) {
@@ -3838,7 +3845,6 @@
          */
         Choices.prototype.setChoices = function (choicesArrayOrFetcher, value, label, replaceChoices, clearSearchFlag, replaceItems) {
             var _this = this;
-            if (choicesArrayOrFetcher === void 0) { choicesArrayOrFetcher = []; }
             if (value === void 0) { value = 'value'; }
             if (label === void 0) { label = 'label'; }
             if (replaceChoices === void 0) { replaceChoices = false; }
@@ -3858,7 +3864,7 @@
                 // it's a choices fetcher function
                 var fetcher_1 = choicesArrayOrFetcher(this);
                 if (typeof Promise === 'function' && fetcher_1 instanceof Promise) {
-                    // that's a promise
+                    // @ts-expect-error wonky typing
                     // eslint-disable-next-line no-promise-executor-return
                     return new Promise(function (resolve) { return requestAnimationFrame(resolve); })
                         .then(function () { return _this._handleLoadingState(true); })
@@ -3878,6 +3884,7 @@
                 if (!Array.isArray(fetcher_1)) {
                     throw new TypeError(".setChoices first argument function must return either array of choices or Promise, got: ".concat(typeof fetcher_1));
                 }
+                // @ts-expect-error wonky typing
                 // eslint-disable-next-line no-param-reassign
                 choicesArrayOrFetcher = fetcher_1;
             }
@@ -3923,6 +3930,7 @@
             }
             // @todo integrate with Store
             this._searcher.reset();
+            // @ts-expect-error wonky typing
             return this;
         };
         Choices.prototype.refresh = function (withEvents, selectFirstOption, deselectAll) {
@@ -4485,10 +4493,6 @@
             var config = this.config;
             var canAddItem = true;
             var notice = '';
-            if (canAddItem && typeof config.addItemFilter === 'function' && !config.addItemFilter(value)) {
-                canAddItem = false;
-                notice = resolveNoticeFunction(config.customAddItemText, value, undefined);
-            }
             if (canAddItem) {
                 var foundChoice = this._store.choices.find(function (choice) { return config.valueComparer(choice.value, value); });
                 if (foundChoice) {
@@ -4503,6 +4507,10 @@
                     }
                 }
             }
+            if (canAddItem && typeof config.addItemFilter === 'function' && !config.addItemFilter(value)) {
+                canAddItem = false;
+                notice = resolveNoticeFunction(config.customAddItemText, value, undefined);
+            }
             if (canAddItem) {
                 notice = resolveNoticeFunction(config.addItemText, value, undefined);
             }
@@ -4822,7 +4830,8 @@
                     }
                 }
                 else {
-                    var currentEl = this.dropdown.element.querySelector(getClassNamesSelector(this.config.classNames.highlightedState));
+                    var currentEl = this.dropdown.element.querySelector(getClassNamesSelector(this.config.classNames.highlightedState)) ||
+                        this.dropdown.element.querySelector(getClassNamesSelector(this.config.classNames.selectedState));
                     if (currentEl) {
                         nextEl = getAdjacentEl(currentEl, selectableChoiceIdentifier, directionInt);
                     }
@@ -4927,8 +4936,8 @@
                         }
                     }
                     else {
-                        this.showDropdown();
                         containerOuter.element.focus();
+                        this.showDropdown();
                     }
                 }
                 else if (this._isSelectOneElement &&
@@ -5198,7 +5207,7 @@
                 element: templating.itemList(config, isSelectOneElement),
             });
             this.dropdown = new Dropdown({
-                element: templating.dropdown(config),
+                element: templating.dropdown(config, elementType),
                 classNames: classNames,
                 type: elementType,
             });
@@ -5312,7 +5321,7 @@
                 throw new TypeError("".concat(caller, " called for an element which has multiple instances of Choices initialised on it"));
             }
         };
-        Choices.version = '11.2.3';
+        Choices.version = '11.2.4';
         return Choices;
     }());