@nationalarchives/frontend 0.34.1 → 0.35.0

package/nationalarchives/components/sidebar/macro-options.json

@@ -40,7 +40,8 @@
         "name": "current",
         "type": "boolean",
         "required": false,
-        "description": "If `true`, highlight the item as the current page or section."
+        "description": "If `true`, highlight the item as the current page or section.",
+        "default": false
       },
       {
         "name": "children",
@@ -74,7 +75,8 @@
     "name": "sticky",
     "type": "boolean",
     "required": false,
-    "description": "If `true`, allows the sidebar to 'stick' to the top of the screen when scrolling."
+    "description": "If `true`, allows the sidebar to 'stick' to the top of the screen when scrolling.",
+    "default": false
   },
   {
     "name": "classes",

package/nationalarchives/components/text-input/fixtures.json

@@ -67,7 +67,20 @@
         "size": "m",
         "password": true
       },
-      "html": "<div class=\"tna-form-item\" data-module=\"tna-text-input\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"password\">Enter your password</label></div><div class=\"tna-form-item__body\"><input id=\"password\" class=\"tna-text-input tna-text-input--m\" name=\"password\" value=\"\" type=\"password\" autocapitalize=\"off\" autocomplete=\"off\" autocorrect=\"off\" spellcheck=\"false\"></div></div>"
+      "html": "<div class=\"tna-form-item\" data-module=\"tna-text-input\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"password\">Enter your password</label></div><div class=\"tna-form-item__body\"><input id=\"password\" class=\"tna-text-input tna-text-input--m\" name=\"password\" value=\"\" type=\"password\" autocomplete=\"current-password\"></div></div>"
+    },
+    {
+      "name": "new password",
+      "options": {
+        "label": "Enter a new password",
+        "headingSize": "m",
+        "id": "password",
+        "name": "password",
+        "size": "m",
+        "password": true,
+        "newPassword": true
+      },
+      "html": "<div class=\"tna-form-item\" data-module=\"tna-text-input\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"password\">Enter a new password</label></div><div class=\"tna-form-item__body\"><input id=\"password\" class=\"tna-text-input tna-text-input--m\" name=\"password\" value=\"\" type=\"password\" autocomplete=\"new-password\"></div></div>"
     },
     {
       "name": "type",

package/nationalarchives/components/text-input/macro-options.json

@@ -67,7 +67,15 @@
     "name": "password",
     "type": "boolean",
     "required": false,
-    "description": "If `true`, the text input will be a password field."
+    "description": "If `true`, the text input will be a password field.",
+    "default": false
+  },
+  {
+    "name": "newPassword",
+    "type": "boolean",
+    "required": false,
+    "description": "If `true`, the browser may try to autofill the password field with a new password. If left as `false`, the browser may try to autofill the password field with an existing password. Ignored when `password` is `false`.",
+    "default": false
   },
   {
     "name": "inputmode",
@@ -79,26 +87,29 @@
     "name": "spellcheck",
     "type": "boolean",
     "required": false,
-    "description": "If `true`, enable [spellcheck](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/spellcheck) for the text input. Disabled when `password` is `true`."
+    "description": "If `true`, enable [spellcheck](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/spellcheck) for the text input. Ignored when `password` is `true`.",
+    "default": false
   },
   {
     "name": "autocapitalize",
     "type": "string",
     "required": false,
-    "description": "If `true`, enable [automatic capitalization](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autocapitalize) for the text input. Disabled when `password` is `true`. This is not supported in all browsers.",
+    "description": "If `true`, enable [automatic capitalization](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autocapitalize) for the text input. Ignored when `password` is `true`. This is not supported in all browsers.",
     "default": "off"
   },
   {
     "name": "autocorrect",
     "type": "boolean",
     "required": false,
-    "description": "If `true`, enable [autocorrect](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autocorrect) for the text input. Disabled when `password` is `true`. This is not supported in all browsers."
+    "description": "If `true`, enable [autocorrect](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autocorrect) for the text input. Ignored when `password` is `true`. This is not supported in all browsers.",
+    "default": false
   },
   {
     "name": "autocomplete",
     "type": "string",
     "required": false,
-    "description": "Set the [`autocomplete` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/autocomplete) to control browser autofill behaviour. Disabled when `password` is `true`."
+    "description": "Set the [`autocomplete` attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/autocomplete) to control browser autofill behaviour. Ignored when `password` is `true`.",
+    "default": false
   },
   {
     "name": "size",

package/nationalarchives/components/text-input/template.njk

@@ -1,4 +1,4 @@
-{% from "nationalarchives/utilities/forms/form-item.njk" import tnaFormItem %}
+{%- from "nationalarchives/utilities/forms/form-item.njk" import tnaFormItem -%}
 
 {%- call tnaFormItem({
   headingLevel: params.headingLevel,
@@ -12,7 +12,7 @@
 }, 'tna-text-input') %}
   <input id="{{ params.id }}" class="tna-text-input{% if params.size %} tna-text-input--{{ params.size }}{% endif %}{% if params.classes %} {{ params.classes }}{% endif %}" name="{{ params.name }}" value="{{ params.value }}"
   {%- if params.hint or params.error %} aria-describedby="{%- if params.hint -%}{{ params.id }}-hint{%- endif %} {% if params.error -%}{{ params.id }}-error{%- endif -%}"{%- endif %}
-  {%- if params.password %} type="password" autocapitalize="off" autocomplete="off" autocorrect="off" spellcheck="false"
+  {%- if params.password %} type="password" autocomplete="{{ 'new-password' if params.newPassword else 'current-password' }}"
   {%- else %} type="{{ params.type if params.type else 'text' }}" spellcheck="{{ params.spellcheck if params.spellcheck else false }}" autocapitalize="{{ params.autocapitalize if params.autocapitalize else 'off' }}" autocorrect="{{ 'on' if params.autocorrect else 'off' }}"
       {%- if params.autocomplete %} autocomplete="{{ params.autocomplete }}"{% endif %}
   {%- endif %}

package/nationalarchives/components/textarea/macro-options.json

@@ -60,20 +60,22 @@
     "name": "spellcheck",
     "type": "boolean",
     "required": false,
-    "description": "If `true`, enable [spellcheck](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/spellcheck) for the text input. Disabled when `password` is `true`."
+    "description": "If `true`, enable [spellcheck](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/spellcheck) for the text input.",
+    "default": false
   },
   {
     "name": "autocapitalize",
     "type": "string",
     "required": false,
-    "description": "If `true`, enable [automatic capitalization](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autocapitalize) for the text input. Disabled when `password` is `true`. This is not supported in all browsers.",
+    "description": "If `true`, enable [automatic capitalization](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autocapitalize) for the text input. This is not supported in all browsers.",
     "default": "off"
   },
   {
     "name": "autocorrect",
     "type": "boolean",
     "required": false,
-    "description": "If `true`, enable [autocorrect](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autocorrect) for the text input. Disabled when `password` is `true`. This is not supported in all browsers."
+    "description": "If `true`, enable [autocorrect](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/autocorrect) for the text input. This is not supported in all browsers.",
+    "default": false
   },
   {
     "name": "size",

package/nationalarchives/components/textarea/template.njk

@@ -1,4 +1,4 @@
-{% from "nationalarchives/utilities/forms/form-item.njk" import tnaFormItem %}
+{%- from "nationalarchives/utilities/forms/form-item.njk" import tnaFormItem -%}
 
 {%- call tnaFormItem({
   headingLevel: params.headingLevel,