@nationalarchives/frontend 1.6.0 → 1.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/nationalarchives/components/textarea/fixtures.json +5 -5
  2. package/nationalarchives/components/textarea/template.njk +6 -2
  3. package/package.json +1 -1
package/nationalarchives/components/textarea/fixtures.json CHANGED
@@ -31,7 +31,7 @@
31
31
  "name": "feedback",
32
32
  "hint": "What did you think?"
33
33
  },
34
- "html": "<div class=\"tna-form-item\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"feedback\">Enter your feedback</label></div><p id=\"feedback-hint\" class=\"tna-form-item__hint\">What did you think?</p><div class=\"tna-form-item__body\"><textarea id=\"feedback\" class=\"tna-textarea\" name=\"feedback\" spellcheck=\"false\" autocapitalize=\"off\" autocorrect=\"off\" rows=\"5\" aria-describedby=\"feedback-hint \"></textarea></div></div>"
34
+ "html": "<div class=\"tna-form-item\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"feedback\">Enter your feedback</label></div><p id=\"feedback-hint\" class=\"tna-form-item__hint\">What did you think?</p><div class=\"tna-form-item__body\"><textarea id=\"feedback\" class=\"tna-textarea\" name=\"feedback\" spellcheck=\"false\" autocapitalize=\"off\" autocorrect=\"off\" rows=\"5\" aria-describedby=\"feedback-hint \"></textarea></div></div>"
35
35
  },
36
36
  {
37
37
  "name": "with an error",
@@ -44,7 +44,7 @@
44
44
  "text": "Enter some feedback"
45
45
  }
46
46
  },
47
- "html": "<div class=\"tna-form-item tna-form-item--error\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"feedback\">Enter your feedback</label></div><p id=\"feedback-error\" class=\"tna-form-item__error\"><span class=\"tna-visually-hidden\">Error:</span> Enter some feedback</p><div class=\"tna-form-item__body\"><textarea id=\"feedback\" class=\"tna-textarea\" name=\"feedback\" spellcheck=\"false\" autocapitalize=\"off\" autocorrect=\"off\" rows=\"5\" aria-describedby=\" feedback-error\"></textarea></div></div>"
47
+ "html": "<div class=\"tna-form-item tna-form-item--error\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"feedback\">Enter your feedback</label></div><p id=\"feedback-error\" class=\"tna-form-item__error\"><span class=\"tna-visually-hidden\">Error:</span> Enter some feedback</p><div class=\"tna-form-item__body\"><textarea id=\"feedback\" class=\"tna-textarea\" name=\"feedback\" spellcheck=\"false\" autocapitalize=\"off\" autocorrect=\"off\" rows=\"5\" aria-describedby=\" feedback-error \"></textarea></div></div>"
48
48
  },
49
49
  {
50
50
  "name": "textarea size",
@@ -134,7 +134,7 @@
134
134
  "max": 200
135
135
  }
136
136
  },
137
- "html": "<div class=\"tna-form-item\" data-module=\"tna-textarea-character-count\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"feedback\">Enter your feedback</label></div><div class=\"tna-form-item__body\"><textarea id=\"feedback\" class=\"tna-textarea\" name=\"feedback\" spellcheck=\"false\" autocapitalize=\"off\" autocorrect=\"off\" rows=\"5\" aria-describedby=\" \" data-max-length=\"200\"></textarea><div id=\"feedback-count\" class=\"tna-visually-hidden\">You can enter up to 200 characters</div><p class=\"tna-textarea-count\" aria-hidden=\"true\">You can enter up to 200 characters</p><div class=\"tna-textarea-count__screen-reader-status tna-visually-hidden\" aria-live=\"polite\">You can enter up to 200 characters</div></div></div>"
137
+ "html": "<div class=\"tna-form-item\" data-module=\"tna-textarea-character-count\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"feedback\">Enter your feedback</label></div><div class=\"tna-form-item__body\"><textarea id=\"feedback\" class=\"tna-textarea\" name=\"feedback\" spellcheck=\"false\" autocapitalize=\"off\" autocorrect=\"off\" rows=\"5\" aria-describedby=\" feedback-count\" data-max-length=\"200\"></textarea><div id=\"feedback-count\" class=\"tna-visually-hidden\">You can enter up to 200 characters</div><p class=\"tna-textarea-count\" aria-hidden=\"true\">You can enter up to 200 characters</p><div class=\"tna-textarea-count__screen-reader-status tna-visually-hidden\" aria-live=\"polite\">You can enter up to 200 characters</div></div></div>"
138
138
  },
139
139
  {
140
140
  "name": "with word count",
@@ -148,7 +148,7 @@
148
148
  "countType": "words"
149
149
  }
150
150
  },
151
- "html": "<div class=\"tna-form-item\" data-module=\"tna-textarea-character-count\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"feedback\">Enter your feedback</label></div><div class=\"tna-form-item__body\"><textarea id=\"feedback\" class=\"tna-textarea\" name=\"feedback\" spellcheck=\"false\" autocapitalize=\"off\" autocorrect=\"off\" rows=\"5\" aria-describedby=\" \" data-max-length=\"200\" data-count-type=\"words\"></textarea><div id=\"feedback-count\" class=\"tna-visually-hidden\">You can enter up to 200 words</div><p class=\"tna-textarea-count\" aria-hidden=\"true\">You can enter up to 200 words</p><div class=\"tna-textarea-count__screen-reader-status tna-visually-hidden\" aria-live=\"polite\">You can enter up to 200 words</div></div></div>"
151
+ "html": "<div class=\"tna-form-item\" data-module=\"tna-textarea-character-count\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"feedback\">Enter your feedback</label></div><div class=\"tna-form-item__body\"><textarea id=\"feedback\" class=\"tna-textarea\" name=\"feedback\" spellcheck=\"false\" autocapitalize=\"off\" autocorrect=\"off\" rows=\"5\" aria-describedby=\" feedback-count\" data-max-length=\"200\" data-count-type=\"words\"></textarea><div id=\"feedback-count\" class=\"tna-visually-hidden\">You can enter up to 200 words</div><p class=\"tna-textarea-count\" aria-hidden=\"true\">You can enter up to 200 words</p><div class=\"tna-textarea-count__screen-reader-status tna-visually-hidden\" aria-live=\"polite\">You can enter up to 200 words</div></div></div>"
152
152
  },
153
153
  {
154
154
  "name": "with character count and custom debounce duration",
@@ -162,7 +162,7 @@
162
162
  "debounceDuration": 500
163
163
  }
164
164
  },
165
- "html": "<div class=\"tna-form-item\" data-module=\"tna-textarea-character-count\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"feedback\">Enter your feedback</label></div><div class=\"tna-form-item__body\"><textarea id=\"feedback\" class=\"tna-textarea\" name=\"feedback\" spellcheck=\"false\" autocapitalize=\"off\" autocorrect=\"off\" rows=\"5\" aria-describedby=\" \" data-max-length=\"200\" data-debounce-duration=\"500\"></textarea><div id=\"feedback-count\" class=\"tna-visually-hidden\">You can enter up to 200 characters</div><p class=\"tna-textarea-count\" aria-hidden=\"true\">You can enter up to 200 characters</p><div class=\"tna-textarea-count__screen-reader-status tna-visually-hidden\" aria-live=\"polite\">You can enter up to 200 characters</div></div></div>"
165
+ "html": "<div class=\"tna-form-item\" data-module=\"tna-textarea-character-count\"><div class=\"tna-form-item__header\"><label class=\"tna-form-item__label tna-heading-m\" for=\"feedback\">Enter your feedback</label></div><div class=\"tna-form-item__body\"><textarea id=\"feedback\" class=\"tna-textarea\" name=\"feedback\" spellcheck=\"false\" autocapitalize=\"off\" autocorrect=\"off\" rows=\"5\" aria-describedby=\" feedback-count\" data-max-length=\"200\" data-debounce-duration=\"500\"></textarea><div id=\"feedback-count\" class=\"tna-visually-hidden\">You can enter up to 200 characters</div><p class=\"tna-textarea-count\" aria-hidden=\"true\">You can enter up to 200 characters</p><div class=\"tna-textarea-count__screen-reader-status tna-visually-hidden\" aria-live=\"polite\">You can enter up to 200 characters</div></div></div>"
166
166
  },
167
167
  {
168
168
  "name": "with classes",
package/nationalarchives/components/textarea/template.njk CHANGED
@@ -11,8 +11,12 @@
11
11
  attributes: params.formItemAttributes
12
12
  }, 'tna-textarea-character-count' if params.characterCount else ('tna-textarea-itemised-rows' if params.itemiseRows else '')) %}
13
13
  <textarea id="{{ params.id }}" class="tna-textarea{% if params.size %} tna-textarea--{{ params.size }}{% endif %}{% if params.classes %} {{ params.classes }}{% endif %}" name="{{ params.name }}" spellcheck="{{ params.spellcheck if params.spellcheck else false }}" autocapitalize="{{ params.autocapitalize if params.autocapitalize else 'off' }}" autocorrect="{{ 'on' if params.autocorrect else 'off' }}" rows="{{ params.rows if params.rows else 5 }}"
14
- {%- if params.hint or params.error or params.characterCount %} aria-describedby="{%- if params.hint -%}{{ params.id }}-hint{%- endif %} {% if params.error -%}{{ params.id }}-error{%- endif -%} {% if params.params.characterCount -%}{{ params.id }}-count{%- endif -%}"{%- endif %}
15
- {%- if params.characterCount %} data-max-length="{{ params.characterCount.max }}"{%- if params.characterCount.countType %} data-count-type="{{ params.characterCount.countType }}"{%- endif %}{%- if params.characterCount.threshold %} data-count-threshold="{{ params.characterCount.threshold }}"{%- endif %}{%- if params.characterCount.debounceDuration %} data-debounce-duration="{{ params.characterCount.debounceDuration }}"{%- endif %}{%- endif %}
14
+ {%- if params.hint or params.error or params.characterCount %} aria-describedby="{%- if params.hint -%}{{ params.id }}-hint{%- endif %} {% if params.error -%}{{ params.id }}-error{%- endif %} {% if params.characterCount -%}{{ params.id }}-count{%- endif -%}"{%- endif %}
15
+ {%- if params.characterCount %} data-max-length="{{ params.characterCount.max }}"
16
+ {%- if params.characterCount.countType %} data-count-type="{{ params.characterCount.countType }}"{%- endif %}
17
+ {%- if params.characterCount.threshold %} data-count-threshold="{{ params.characterCount.threshold }}"{%- endif %}
18
+ {%- if params.characterCount.debounceDuration %} data-debounce-duration="{{ params.characterCount.debounceDuration }}"{%- endif %}
19
+ {%- endif %}
16
20
  {%- for attribute, value in params.attributes %} {{ attribute }}{% if value !== '' %}="{{ value }}"{% endif %}{% endfor %}>{{ params.value }}</textarea>
17
21
  {%- if params.characterCount %}
18
22
  {%- set characterCountMessage %}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nationalarchives/frontend",
3
- "version": "1.6.0",
3
+ "version": "1.6.1",
4
4
  "description": "The National Archives frontend styles",
5
5
  "scripts": {
6
6
  "start": "storybook dev -p 6006",