@nationalarchives/frontend 0.19.0 → 0.20.0

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

@@ -3,49 +3,49 @@
     "name": "label",
     "type": "string",
     "required": true,
-    "description": ""
+    "description": "The label for the checkboxes field."
   },
   {
     "name": "headingLevel",
     "type": "number",
     "required": true,
-    "description": ""
+    "description": "The heading level which represents an element from `<h1>` through to `<h6>`."
   },
   {
     "name": "headingSize",
     "type": "string",
     "required": false,
-    "description": ""
+    "description": "The physical size of the checkboxes title (`xl`, `l`, `m` or `s`)."
   },
   {
     "name": "id",
     "type": "string",
     "required": true,
-    "description": ""
+    "description": "A unique ID for the checkboxes component."
   },
   {
     "name": "name",
     "type": "string",
     "required": true,
-    "description": ""
+    "description": "The name of the form field."
   },
   {
     "name": "hint",
     "type": "string",
     "required": false,
-    "description": ""
+    "description": "An optional hint to display above the form field."
   },
   {
     "name": "error",
     "type": "object",
     "required": false,
-    "description": "",
+    "description": "If set, the details of any errors.",
     "params": [
       {
         "name": "text",
         "type": "string",
         "required": true,
-        "description": ""
+        "description": "The error text to display."
       }
     ]
   },
@@ -53,31 +53,31 @@
     "name": "items",
     "type": "array",
     "required": true,
-    "description": "",
+    "description": "A list of checkbox items to render.",
     "params": [
       {
         "name": "text",
         "type": "string",
         "required": true,
-        "description": ""
+        "description": "The label of the checkbox item."
       },
       {
         "name": "value",
         "type": "string",
         "required": true,
-        "description": ""
+        "description": "The form field value."
       },
       {
         "name": "name",
         "type": "string",
         "required": false,
-        "description": ""
+        "description": "The name of the form field item. If set, this will override the main `name` property."
       },
       {
         "name": "checked",
         "type": "boolean",
         "required": false,
-        "description": ""
+        "description": "If true, the checkbox will be checked."
       }
     ]
   },
@@ -85,13 +85,13 @@
     "name": "small",
     "type": "boolean",
     "required": false,
-    "description": ""
+    "description": "If true, show smaller checkboxes."
   },
   {
     "name": "inline",
     "type": "boolean",
     "required": false,
-    "description": ""
+    "description": "If true, show the checkboxes inline rather than vertical."
   },
   {
     "name": "formGroupClasses",

package/nationalarchives/components/compound-filters/macro-options.json

@@ -3,25 +3,25 @@
     "name": "items",
     "type": "array",
     "required": true,
-    "description": "",
+    "description": "A list of compound filter items.",
     "params": [
       {
         "name": "label",
         "type": "string",
         "required": true,
-        "description": ""
+        "description": "The label to show for the filter item."
       },
       {
         "name": "href",
         "type": "string",
         "required": true,
-        "description": ""
+        "description": "The URL for the filter item."
       },
       {
         "name": "title",
         "type": "string",
         "required": false,
-        "description": ""
+        "description": "An optional title for the filter item."
       }
     ]
   },
@@ -29,13 +29,13 @@
     "name": "removeAllText",
     "type": "string",
     "required": false,
-    "description": ""
+    "description": "The text to show for the 'Remove all' link."
   },
   {
     "name": "removeAllHref",
     "type": "string",
     "required": false,
-    "description": ""
+    "description": "The URL for the 'Remove all' link."
   },
   {
     "name": "classes",

package/nationalarchives/components/cookie-banner/macro-options.json

@@ -3,43 +3,47 @@
     "name": "serviceName",
     "type": "string",
     "required": true,
-    "description": ""
+    "description": "The name of the service that the cookie banner is for."
   },
   {
     "name": "title",
     "type": "string",
     "required": false,
-    "description": ""
+    "default": "This website uses cookies",
+    "description": "The main title of the cookie banner."
   },
   {
     "name": "body",
     "type": "string",
     "required": false,
-    "description": ""
+    "default": "We use some essential cookies to make this service work.\nWe'd also like to use analytics cookies so we can understand how you use the service and make improvements.",
+    "description": "The body text of the cookie banner."
   },
   {
     "name": "acceptedBody",
     "type": "string",
     "required": false,
-    "description": ""
+    "default": "You have accepted optional cookies. You can change your cookie settings on the [cookies page](cookiesUrl)",
+    "description": "The text to show if the user has accepts cookies."
   },
   {
     "name": "rejectedBody",
     "type": "string",
     "required": false,
-    "description": ""
+    "default": "You have rejected optional cookies. You can change your cookie settings on the [cookies page](cookiesUrl)",
+    "description": "The text to show if the user declines cookies."
   },
   {
     "name": "cookiesUrl",
     "type": "string",
     "required": true,
-    "description": ""
+    "description": "The URL of the cookie preferences page for the service."
   },
   {
     "name": "preferencesSetKey",
     "type": "string",
     "required": false,
-    "description": ""
+    "description": "If set, the name of the cookie used to indicate that the user has set their cookie preferences."
   },
   {
     "name": "style",

package/nationalarchives/components/date-input/date-input-day.njk

@@ -3,6 +3,6 @@
   <label for="{{ params.id }}-day" class="tna-date-input__item-label">
     Day
   </label>
-  <input type="text" id="{{ params.id }}-day" value="{{ params.value.day if params.value }}" name="{{ params.name }}{{ '' if params.removeFieldNameSuffixes else '-day' }}" class="tna-date-input__item-input{% if inputClasses %} {{ inputClasses }}{% endif %}" inputmode="numeric"{%- for attribute, value in params.attributes %} {{ attribute }}{% if value !== '' %}="{{ value }}"{% endif %}{% endfor %}>
+  <input type="text" id="{{ params.id }}-day" value="{{ params.value.day if params.value }}" name="{{ params.name }}-day" class="tna-date-input__item-input{% if inputClasses %} {{ inputClasses }}{% endif %}" inputmode="numeric"{% if params.autofillDateOfBirth %} autocomplete="bday-day"{% endif %}{%- for attribute, value in params.attributes %} {{ attribute }}{% if value !== '' %}="{{ value }}"{% endif %}{% endfor %}>
 </div>
 {%- endmacro %}

package/nationalarchives/components/date-input/date-input-month.njk

@@ -3,6 +3,6 @@
   <label for="{{ params.id }}-month" class="tna-date-input__item-label">
     Month
   </label>
-  <input type="text" id="{{ params.id }}-month" value="{{ params.value.month if params.value }}" name="{{ params.name }}{{ '' if params.removeFieldNameSuffixes else '-month' }}" class="tna-date-input__item-input{% if inputClasses %} {{ inputClasses }}{% endif %}" inputmode="numeric"{%- for attribute, value in params.attributes %} {{ attribute }}{% if value !== '' %}="{{ value }}"{% endif %}{% endfor %}>
+  <input type="text" id="{{ params.id }}-month" value="{{ params.value.month if params.value }}" name="{{ params.name }}-month" class="tna-date-input__item-input{% if inputClasses %} {{ inputClasses }}{% endif %}" inputmode="numeric"{% if params.autofillDateOfBirth %} autocomplete="bday-month"{% endif %}{%- for attribute, value in params.attributes %} {{ attribute }}{% if value !== '' %}="{{ value }}"{% endif %}{% endfor %}>
 </div>
 {%- endmacro %}

package/nationalarchives/components/date-input/date-input-year.njk

@@ -3,6 +3,6 @@
   <label for="{{ params.id }}-year" class="tna-date-input__item-label">
     Year
   </label>
-  <input type="text" id="{{ params.id }}-year" value="{{ params.value.year if params.value }}" name="{{ params.name }}{{ '' if params.removeFieldNameSuffixes else '-year' }}" class="tna-date-input__item-input{% if inputClasses %} {{ inputClasses }}{% endif %} tna-date-input__item-input--wider" inputmode="numeric"{%- for attribute, value in params.attributes %} {{ attribute }}{% if value !== '' %}="{{ value }}"{% endif %}{% endfor %}>
+  <input type="text" id="{{ params.id }}-year" value="{{ params.value.year if params.value }}" name="{{ params.name }}-year" class="tna-date-input__item-input{% if inputClasses %} {{ inputClasses }}{% endif %} tna-date-input__item-input--wider" inputmode="numeric"{% if params.autofillDateOfBirth %} autocomplete="bday-year"{% endif %}{%- for attribute, value in params.attributes %} {{ attribute }}{% if value !== '' %}="{{ value }}"{% endif %}{% endfor %}>
 </div>
 {%- endmacro %}

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

@@ -86,7 +86,7 @@
         "headingSize": "xs",
         "id": "date",
         "name": "date",
-        "fields": ["month", "year"]
+        "fields": ["m", "y"]
       },
       "html": "<div class=\"tna-form__group\"><fieldset class=\"tna-form__fieldset\"><legend class=\"tna-form__legend\"><h4 class=\"tna-form__heading tna-form__heading--xs\">Enter a start date</h4></legend><div class=\"tna-date-input\" id=\"date\"><div class=\"tna-date-input__item tna-date-input__item--month\"><label for=\"date-month\" class=\"tna-date-input__item-label\">Month</label><input type=\"text\" id=\"date-month\" value=\"\" name=\"date-month\" class=\"tna-date-input__item-input\" inputmode=\"numeric\"></div><div class=\"tna-date-input__item tna-date-input__item--year\"><label for=\"date-year\" class=\"tna-date-input__item-label\">Year</label><input type=\"text\" id=\"date-year\" value=\"\" name=\"date-year\" class=\"tna-date-input__item-input tna-date-input__item-input--wider\" inputmode=\"numeric\"></div></div></fieldset></div>"
     },
@@ -98,22 +98,22 @@
         "headingSize": "xs",
         "id": "date",
         "name": "date",
-        "fields": ["month", "year"],
+        "fields": ["y", "m"],
         "progressive": true
       },
       "html": "<div class=\"tna-form__group\" data-module=\"date-input\"><fieldset class=\"tna-form__fieldset\"><legend class=\"tna-form__legend\"><h4 class=\"tna-form__heading tna-form__heading--xs\">Enter a start date</h4></legend><div class=\"tna-date-input\" id=\"date\"><div class=\"tna-date-input__item tna-date-input__item--year\"><label for=\"date-year\" class=\"tna-date-input__item-label\">Year</label><input type=\"text\" id=\"date-year\" value=\"\" name=\"date-year\" class=\"tna-date-input__item-input tna-date-input__item-input--wider\" inputmode=\"numeric\"></div><div class=\"tna-date-input__item tna-date-input__item--month\"><label for=\"date-month\" class=\"tna-date-input__item-label\">Month</label><input type=\"text\" id=\"date-month\" value=\"\" name=\"date-month\" class=\"tna-date-input__item-input\" inputmode=\"numeric\"></div></div></fieldset></div>"
     },
     {
-      "name": "remove field name suffixes",
+      "name": "autofill date of birth",
       "options": {
         "label": "Enter a start date",
         "headingLevel": 4,
         "headingSize": "xs",
         "id": "date",
         "name": "date",
-        "removeFieldNameSuffixes": true
+        "autofillDateOfBirth": true
       },
-      "html": "<div class=\"tna-form__group\"><fieldset class=\"tna-form__fieldset\"><legend class=\"tna-form__legend\"><h4 class=\"tna-form__heading tna-form__heading--xs\">Enter a start date</h4></legend><div class=\"tna-date-input\" id=\"date\"><div class=\"tna-date-input__item tna-date-input__item--day\"><label for=\"date-day\" class=\"tna-date-input__item-label\">Day</label><input type=\"text\" id=\"date-day\" value=\"\" name=\"date\" class=\"tna-date-input__item-input\" inputmode=\"numeric\"></div><div class=\"tna-date-input__item tna-date-input__item--month\"><label for=\"date-month\" class=\"tna-date-input__item-label\">Month</label><input type=\"text\" id=\"date-month\" value=\"\" name=\"date\" class=\"tna-date-input__item-input\" inputmode=\"numeric\"></div><div class=\"tna-date-input__item tna-date-input__item--year\"><label for=\"date-year\" class=\"tna-date-input__item-label\">Year</label><input type=\"text\" id=\"date-year\" value=\"\" name=\"date\" class=\"tna-date-input__item-input tna-date-input__item-input--wider\" inputmode=\"numeric\"></div></div></fieldset></div>"
+      "html": "<div class=\"tna-form__group\"><fieldset class=\"tna-form__fieldset\"><legend class=\"tna-form__legend\"><h4 class=\"tna-form__heading tna-form__heading--xs\">Enter a start date</h4></legend><div class=\"tna-date-input\" id=\"date\"><div class=\"tna-date-input__item tna-date-input__item--day\"><label for=\"date-day\" class=\"tna-date-input__item-label\">Day</label><input type=\"text\" id=\"date-day\" value=\"\" name=\"date-day\" class=\"tna-date-input__item-input\" inputmode=\"numeric\" autocomplete=\"bday-day\"></div><div class=\"tna-date-input__item tna-date-input__item--month\"><label for=\"date-month\" class=\"tna-date-input__item-label\">Month</label><input type=\"text\" id=\"date-month\" value=\"\" name=\"date-month\" class=\"tna-date-input__item-input\" inputmode=\"numeric\" autocomplete=\"bday-month\"></div><div class=\"tna-date-input__item tna-date-input__item--year\"><label for=\"date-year\" class=\"tna-date-input__item-label\">Year</label><input type=\"text\" id=\"date-year\" value=\"\" name=\"date-year\" class=\"tna-date-input__item-input tna-date-input__item-input--wider\" inputmode=\"numeric\" autocomplete=\"bday-year\"></div></div></fieldset></div>"
     },
     {
       "name": "with classes",

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

@@ -3,37 +3,37 @@
     "name": "label",
     "type": "string",
     "required": true,
-    "description": ""
+    "description": "The label for the date input field."
   },
   {
     "name": "headingLevel",
     "type": "number",
     "required": true,
-    "description": ""
+    "description": "The heading level which represents an element from `<h1>` through to `<h6>`."
   },
   {
     "name": "headingSize",
     "type": "string",
     "required": false,
-    "description": ""
+    "description": "The physical size of the date input title (`xl`, `l`, `m` or `s`)."
   },
   {
     "name": "id",
     "type": "string",
     "required": true,
-    "description": ""
+    "description": "A unique ID for the date input component."
   },
   {
     "name": "name",
     "type": "string",
     "required": true,
-    "description": ""
+    "description": "The name of the form field."
   },
   {
     "name": "hint",
     "type": "string",
     "required": false,
-    "description": ""
+    "description": "An optional hint to display above the form field."
   },
   {
     "name": "fields",
@@ -45,7 +45,7 @@
     "name": "value",
     "type": "object",
     "required": false,
-    "description": "",
+    "description": "The values of the date fields.",
     "params": [
       {
         "name": "day",
@@ -71,13 +71,13 @@
     "name": "error",
     "type": "object",
     "required": false,
-    "description": "",
+    "description": "If set, the details of any errors.",
     "params": [
       {
         "name": "text",
         "type": "string",
         "required": true,
-        "description": ""
+        "description": "The error text to display."
       }
     ]
   },
@@ -85,7 +85,7 @@
     "name": "inline",
     "type": "boolean",
     "required": false,
-    "description": ""
+    "description": "If true, show the date inputs inline rather than vertical."
   },
   {
     "name": "progressive",
@@ -93,12 +93,6 @@
     "required": false,
     "description": ""
   },
-  {
-    "name": "removeFieldNameSuffixes",
-    "type": "boolean",
-    "required": false,
-    "description": ""
-  },
   {
     "name": "formGroupClasses",
     "type": "string",

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

@@ -29,29 +29,29 @@
     </p>
     {%- endif %}
     <div class="tna-date-input{% if params.inline %} tna-date-input--inline{% endif %}" id="{{ params.id }}">
-      {%- set fields = params.fields if params.fields else ['day', 'month', 'year'] -%}
+      {%- set fields = params.fields if params.fields else ['d', 'm', 'y'] -%}
       {%- if params.progressive %}
         {%- if params.fields %}
           {%- set fields = [] -%}
-          {% if 'year' in params.fields %}
-            {%- set fields = fields.concat('year') -%}
+          {% if 'y' in params.fields %}
+            {%- set fields = fields + ['year'] -%}
           {%- endif %}
-          {% if 'month' in params.fields %}
-            {%- set fields = fields.concat('month') -%}
+          {% if 'm' in params.fields %}
+            {%- set fields = fields + ['month'] -%}
           {%- endif %}
-          {% if 'day' in params.fields %}
-            {%- set fields = fields.concat('day') -%}
+          {% if 'd' in params.fields %}
+            {%- set fields = fields + ['day'] -%}
           {%- endif %}
         {%- else %}
-          {%- set fields = ['year', 'month', 'day'] -%}
+          {%- set fields = ['y', 'm', 'd'] -%}
         {%- endif %}
       {%- endif %}
       {%- for field in fields %}
-        {%- if field == 'day' %}
+        {%- if field == 'd' %}
           {{ tnaDateInputDayElement(params) | indent(6) }}
-        {%- elif field == 'month' %}
+        {%- elif field == 'm' %}
           {{ tnaDateInputMonthElement(params) | indent(6) }}
-        {%- elif field == 'year' %}
+        {%- elif field == 'y' %}
           {{ tnaDateInputYearElement(params) | indent(6) }}
         {%- endif %}
       {%- endfor %}

package/nationalarchives/components/date-search/macro-options.json

@@ -3,55 +3,55 @@
     "name": "label",
     "type": "string",
     "required": true,
-    "description": ""
+    "description": "The label for the date search field."
   },
   {
     "name": "headingLevel",
     "type": "number",
     "required": true,
-    "description": ""
+    "description": "The heading level which represents an element from `<h1>` through to `<h6>`."
   },
   {
     "name": "headingSize",
     "type": "string",
     "required": false,
-    "description": ""
+    "description": "The physical size of the date search title (`xl`, `l`, `m` or `s`)."
   },
   {
     "name": "id",
     "type": "string",
     "required": true,
-    "description": ""
+    "description": "A unique ID for the date search component."
   },
   {
     "name": "name",
     "type": "string",
     "required": true,
-    "description": ""
+    "description": "The name of the form field."
   },
   {
     "name": "hint",
     "type": "string",
     "required": false,
-    "description": ""
+    "description": "An optional hint to display above the form field."
   },
   {
     "name": "value",
     "type": "string",
     "required": false,
-    "description": ""
+    "description": "The form field value."
   },
   {
     "name": "error",
     "type": "object",
     "required": false,
-    "description": "",
+    "description": "If set, the details of any errors.",
     "params": [
       {
         "name": "text",
         "type": "string",
         "required": true,
-        "description": ""
+        "description": "The error text to display."
       }
     ]
   },
@@ -59,13 +59,13 @@
     "name": "maxWidth",
     "type": "boolean",
     "required": false,
-    "description": ""
+    "description": "If true, make the date search field expand to the full width of the container."
   },
   {
     "name": "inline",
     "type": "boolean",
     "required": false,
-    "description": ""
+    "description": "If true, show the date search inline rather than vertical."
   },
   {
     "name": "formGroupClasses",

package/nationalarchives/components/error-summary/macro-options.json

@@ -9,7 +9,7 @@
     "name": "headingLevel",
     "type": "number",
     "required": true,
-    "description": ""
+    "description": "The heading level which represents an element from `<h1>` through to `<h6>`."
   },
   {
     "name": "items",

package/nationalarchives/components/files-list/macro-options.json

@@ -15,7 +15,7 @@
         "name": "id",
         "type": "string",
         "required": true,
-        "description": ""
+        "description": "A unique ID for the file item."
       },
       {
         "name": "title",