Update macro options and templates

nationalarchives · Nov 29, 2023 · 2f4c191 · 2f4c191
1 parent 5d2898f
commit 2f4c191
Show file tree

Hide file tree

Showing 24 changed files with 1,245 additions and 829 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/src/nationalarchives/components/checkboxes/macro-options.json b/src/nationalarchives/components/checkboxes/macro-options.json
@@ -1,4 +1,92 @@
 [
+  {
+    "name": "label",
+    "type": "text",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "headingLevel",
+    "type": "number",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "headingSize",
+    "type": "text",
+    "required": false,
+    "description": ""
+  },
+  {
+    "name": "id",
+    "type": "text",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "name",
+    "type": "text",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "hint",
+    "type": "text",
+    "required": false,
+    "description": ""
+  },
+  {
+    "name": "error",
+    "type": "object",
+    "required": false,
+    "description": "",
+    "params": [
+      {
+        "name": "text",
+        "type": "text",
+        "required": true,
+        "description": ""
+      }
+    ]
+  },
+  {
+    "name": "items",
+    "type": "array",
+    "required": true,
+    "description": "",
+    "params": [
+      {
+        "name": "text",
+        "type": "text",
+        "required": true,
+        "description": ""
+      },
+      {
+        "name": "value",
+        "type": "text",
+        "required": true,
+        "description": ""
+      },
+      {
+        "name": "checked",
+        "type": "boolean",
+        "required": false,
+        "description": ""
+      }
+    ]
+  },
+  {
+    "name": "small",
+    "type": "boolean",
+    "required": false,
+    "description": ""
+  },
+  {
+    "name": "inline",
+    "type": "boolean",
+    "required": false,
+    "description": ""
+  },
   {
     "name": "classes",
     "type": "string",

diff --git a/src/nationalarchives/components/date-input/date-input.stories.js b/src/nationalarchives/components/date-input/date-input.stories.js
@@ -10,10 +10,8 @@ const argTypes = {
   hint: { control: "text" },
   value: { control: "object" },
   error: { control: "object" },
-  maxWidth: { control: "boolean" },
   inline: { control: "boolean" },
   classes: { control: "text" },
-  formGroupClasses: { control: "text" },
   attributes: { control: "object" },
 };
 
@@ -37,10 +35,8 @@ const Template = ({
   hint,
   value,
   error,
-  maxWidth,
   inline,
   classes,
-  formGroupClasses,
   attributes,
 }) =>
   DateInput({
@@ -53,10 +49,8 @@ const Template = ({
       hint,
       value,
       error,
-      maxWidth,
       inline,
       classes,
-      formGroupClasses,
       attributes,
     },
   });

diff --git a/src/nationalarchives/components/date-input/macro-options.json b/src/nationalarchives/components/date-input/macro-options.json
@@ -1,14 +1,96 @@
 [
+  {
+    "name": "label",
+    "type": "text",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "headingLevel",
+    "type": "number",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "headingSize",
+    "type": "text",
+    "required": false,
+    "description": ""
+  },
+  {
+    "name": "id",
+    "type": "text",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "name",
+    "type": "text",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "hint",
+    "type": "text",
+    "required": false,
+    "description": ""
+  },
+  {
+    "name": "value",
+    "type": "object",
+    "required": false,
+    "description": "",
+    "params": [
+      {
+        "name": "day",
+        "type": "text",
+        "required": false,
+        "description": ""
+      },
+      {
+        "name": "month",
+        "type": "text",
+        "required": false,
+        "description": ""
+      },
+      {
+        "name": "year",
+        "type": "text",
+        "required": false,
+        "description": ""
+      }
+    ]
+  },
+  {
+    "name": "error",
+    "type": "object",
+    "required": false,
+    "description": "",
+    "params": [
+      {
+        "name": "text",
+        "type": "text",
+        "required": true,
+        "description": ""
+      }
+    ]
+  },
+  {
+    "name": "inline",
+    "type": "boolean",
+    "required": false,
+    "description": ""
+  },
   {
     "name": "classes",
     "type": "string",
     "required": false,
-    "description": "Classes to add to the date date input."
+    "description": "Classes to add to the date input."
   },
   {
     "name": "attributes",
     "type": "object",
     "required": false,
-    "description": "HTML attributes (for example data attributes) to add to the date date input."
+    "description": "HTML attributes (for example data attributes) to add to the date input."
   }
 ]
diff --git a/src/nationalarchives/components/date-search/date-search.stories.js b/src/nationalarchives/components/date-search/date-search.stories.js
@@ -12,8 +12,9 @@ const argTypes = {
   error: { control: "object" },
   maxWidth: { control: "boolean" },
   inline: { control: "boolean" },
-  classes: { control: "text" },
   formGroupClasses: { control: "text" },
+  formGroupAttributes: { control: "object" },
+  classes: { control: "text" },
   attributes: { control: "object" },
 };
 
@@ -39,8 +40,9 @@ const Template = ({
   error,
   maxWidth,
   inline,
-  classes,
   formGroupClasses,
+  formGroupAttributes,
+  classes,
   attributes,
 }) =>
   DateSearch({
@@ -55,8 +57,9 @@ const Template = ({
       error,
       maxWidth,
       inline,
-      classes,
       formGroupClasses,
+      formGroupAttributes,
+      classes,
       attributes,
     },
   });

diff --git a/src/nationalarchives/components/date-search/macro-options.json b/src/nationalarchives/components/date-search/macro-options.json
@@ -1,14 +1,94 @@
 [
+  {
+    "name": "label",
+    "type": "text",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "headingLevel",
+    "type": "number",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "headingSize",
+    "type": "text",
+    "required": false,
+    "description": ""
+  },
+  {
+    "name": "id",
+    "type": "text",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "name",
+    "type": "text",
+    "required": true,
+    "description": ""
+  },
+  {
+    "name": "hint",
+    "type": "text",
+    "required": false,
+    "description": ""
+  },
+  {
+    "name": "value",
+    "type": "text",
+    "required": false,
+    "description": ""
+  },
+  {
+    "name": "error",
+    "type": "object",
+    "required": false,
+    "description": "",
+    "params": [
+      {
+        "name": "text",
+        "type": "text",
+        "required": true,
+        "description": ""
+      }
+    ]
+  },
+  {
+    "name": "maxWidth",
+    "type": "boolean",
+    "required": false,
+    "description": ""
+  },
+  {
+    "name": "inline",
+    "type": "boolean",
+    "required": false,
+    "description": ""
+  },
+  {
+    "name": "formGroupClasses",
+    "type": "string",
+    "required": false,
+    "description": "Classes to add to the date search form group."
+  },
+  {
+    "name": "formGroupAttributes",
+    "type": "string",
+    "required": false,
+    "description": "HTML attributes (for example data attributes) to add to the date search form group."
+  },
   {
     "name": "classes",
     "type": "string",
     "required": false,
-    "description": "Classes to add to the date date search."
+    "description": "Classes to add to the date search field."
   },
   {
     "name": "attributes",
     "type": "object",
     "required": false,
-    "description": "HTML attributes (for example data attributes) to add to the date date search."
+    "description": "HTML attributes (for example data attributes) to add to the date search field."
   }
 ]
diff --git a/src/nationalarchives/components/date-search/template.njk b/src/nationalarchives/components/date-search/template.njk
@@ -1,9 +1,9 @@
-{%- set inputClasses = [params.classes] if params.classes else [] -%}
 {%- set containerClasses = [params.formGroupClasses] if params.formGroupClasses else [] -%}
+{%- set inputClasses = [params.classes] if params.classes else [] -%}
 {%- if params.inline -%}
   {%- set containerClasses = containerClasses.concat('tna-form__group--inline') -%}
 {%- endif -%}
-<div class="tna-form__group{% if params.error %} tna-form__group--error{% endif %} {{ containerClasses | join(' ') }}">
+<div class="tna-form__group{% if params.error %} tna-form__group--error{% endif %} {{ containerClasses | join(' ') }} {%- for attribute, value in params.formGroupAttributes %} {{ attribute }}="{{ value }}"{% endfor %}">
   <div class="tna-form__group-contents">
     <h{{ params.headingLevel }} class="tna-form__heading tna-form__heading--{{ params.headingSize or 'm' }}">
       <label class="tna-form__label" for="tna-form__{{ params.id }}">

diff --git a/src/nationalarchives/components/gallery/gallery.stories.js b/src/nationalarchives/components/gallery/gallery.stories.js
@@ -60,14 +60,14 @@ Standard.args = {
               },
             ]
           : index === 1
-          ? [
-              {
-                id: "tab-1",
-                title: "Transcript",
-                body: "<p>TEST TRANSCRIPT</p>",
-              },
-            ]
-          : null,
+            ? [
+                {
+                  id: "tab-1",
+                  title: "Transcript",
+                  body: "<p>TEST TRANSCRIPT</p>",
+                },
+              ]
+            : null,
     })),
 
   classes: "tna-gallery--demo",