If you need to answer separately from the people you live with, you can request an individual access code.
{% call onsPanel({ - "type": "warn" + "variant": "warn" }) %} Someone in your household must still complete a study using this household access code {% endcall %} diff --git a/src/components/access-code/example-access-code.njk b/src/components/access-code/example-access-code.njk index d3f58506e6..f8cca16218 100644 --- a/src/components/access-code/example-access-code.njk +++ b/src/components/access-code/example-access-code.njk @@ -43,9 +43,8 @@ layout: ~ {% set content %}If you need to answer separately from the people you live with, you can request an individual access code.
{% call onsPanel({ - type: "warn" - }) - %} + "variant": "warn" + }) %} Someone in your household must still complete a study using this household access code {% endcall %} {% endset %} @@ -53,8 +52,7 @@ layout: ~ {% call onsDetails({ "id": "details", "title": "Need to answer separately from your household?" - }) - %} + }) %} {{ content | safe }} {% endcall %} {% endblock %} diff --git a/src/components/button/_macro.njk b/src/components/button/_macro.njk index fd39c0036d..94125e36c1 100644 --- a/src/components/button/_macro.njk +++ b/src/components/button/_macro.njk @@ -93,12 +93,12 @@ {% endif -%} {{- params.html | safe if params.html else params.text -}} {%- if iconPosition == "after" %} - {{- - onsIcon({ - "iconType": iconType, - "classes": 'ons-u-ml-xs' - }) - -}} + {{- + onsIcon({ + "iconType": iconType, + "classes": 'ons-u-ml-xs' + }) + -}} {% endif -%} {% elif iconPosition == "only" -%} {{- diff --git a/src/components/char-check-limit/_macro-options.md b/src/components/char-check-limit/_macro-options.md index 548fc9d8b2..db3228b7f1 100644 --- a/src/components/char-check-limit/_macro-options.md +++ b/src/components/char-check-limit/_macro-options.md @@ -1,9 +1,9 @@ -| Name | Type | Required | Description | -| -------------------------- | ------- | ---------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -| type | string | false | Set to “check” to add the character limit checker to the input | -| id | string | true | The HTML `id` of the component | -| limit | integer | true | The maximum number of characters allowed in the input | -| charCountPlural | string | true (unless `type` is set) | The string displayed when multiple characters can be entered before the limit is reached. Set `{x}` in the string to be replaced with the number, for example “You have {x} characters remaining”. | -| charCountSingular | string | true (unless `type` is set) | The string displayed when one more character can be entered before the limit is reached. Set `{x}` in the string to be replaced with the number, for example “You have {x} character remaining”. | -| charCountOverLimitPlural | string | false (unless `type` is set) | The string displayed when multiple characters over the limit have been entered. Set `{x}` in the string to be replaced with the number, for example “{x} characters too many”. | -| charCountOverLimitSingular | string | false (unless `type` is set) | The string displayed when one character over the limit has been entered. Set `{x}` in the string to be replaced with the number, for example “{x} character too many”. | +| Name | Type | Required | Description | +| -------------------------- | ------- | ------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| variant | string | false | Set to “check” to add the character limit checker to the input | +| id | string | true | The HTML `id` of the component | +| limit | integer | true | The maximum number of characters allowed in the input | +| charCountPlural | string | true (unless `variant` is set) | The string displayed when multiple characters can be entered before the limit is reached. Set `{x}` in the string to be replaced with the number, for example “You have {x} characters remaining”. | +| charCountSingular | string | true (unless `variant` is set) | The string displayed when one more character can be entered before the limit is reached. Set `{x}` in the string to be replaced with the number, for example “You have {x} character remaining”. | +| charCountOverLimitPlural | string | false (unless `variant` is set) | The string displayed when multiple characters over the limit have been entered. Set `{x}` in the string to be replaced with the number, for example “{x} characters too many”. | +| charCountOverLimitSingular | string | false (unless `variant` is set) | The string displayed when one character over the limit has been entered. Set `{x}` in the string to be replaced with the number, for example “{x} character too many”. | diff --git a/src/components/char-check-limit/_macro.njk b/src/components/char-check-limit/_macro.njk index dae556c999..2228a315b1 100644 --- a/src/components/char-check-limit/_macro.njk +++ b/src/components/char-check-limit/_macro.njk @@ -1,5 +1,5 @@ {% macro onsCharLimit(params) %} - {% if params.type == "check" %} + {% if params.variant == "check" %} {% set content = caller() %} {{ content | safe }} diff --git a/src/components/char-check-limit/_macro.spec.js b/src/components/char-check-limit/_macro.spec.js index 96b49a3b4c..0b00499707 100644 --- a/src/components/char-check-limit/_macro.spec.js +++ b/src/components/char-check-limit/_macro.spec.js @@ -27,7 +27,7 @@ describe('macro: char-check-limit', () => { 'char-check-limit', { ...EXAMPLE_CHAR_CHECK_LIMIT, - type: 'check', + variant: 'check', }, ['Test content.
'], ), @@ -58,7 +58,7 @@ describe('macro: char-check-limit', () => { 'char-check-limit', { ...EXAMPLE_CHAR_CHECK_LIMIT, - type: 'check', + variant: 'check', }, ['Test content.
'], ), diff --git a/src/components/char-check-limit/character-check.spec.js b/src/components/char-check-limit/character-check.spec.js index b1725cf638..710fc7abdd 100644 --- a/src/components/char-check-limit/character-check.spec.js +++ b/src/components/char-check-limit/character-check.spec.js @@ -2,7 +2,7 @@ import { renderComponent, setTestPage } from '../../tests/helpers/rendering'; const EXAMPLE_INPUT_WITH_CHARACTER_CHECK = { id: 'search-field', - type: 'number', + variant: 'number', width: '6', label: { text: 'Filter results', @@ -24,7 +24,7 @@ const EXAMPLE_CHARACTER_CHECK_WITH_MUTUALLY_EXCLUSIVE = { id: 'feedback', name: 'feedback', width: '30', - legend: 'Feeback legend', + legend: 'Feedback legend', label: { text: 'Enter your feedback', }, diff --git a/src/components/details/example-details-with-warning.njk b/src/components/details/example-details-with-warning.njk index bdbb8dd2ed..4eed6ea5e2 100644 --- a/src/components/details/example-details-with-warning.njk +++ b/src/components/details/example-details-with-warning.njk @@ -2,16 +2,14 @@ {% from "components/panel/_macro.njk" import onsPanel %} {% call onsDetails({ - "id": "details-example-with-warning", - "title": "Need to answer separately from your household?" - }) -%} + "id": "details-example-with-warning", + "title": "Need to answer separately from your household?" +}) %}If you need to answer separately from the people you live with, you can request an individual access code to start a separate survey.
{% call onsPanel({ - type: "warn" - }) - %} + "variant": "warn" + }) %} Someone in your household must still complete a survey using a household access code {% endcall %} diff --git a/src/components/error/_macro.njk b/src/components/error/_macro.njk index 2343087e3e..b0bc94aba9 100644 --- a/src/components/error/_macro.njk +++ b/src/components/error/_macro.njk @@ -12,7 +12,7 @@ {% endset %} {% call onsPanel({ - "type": "error", + "variant": "error", "id": params.id }) %} {{ content | safe }} diff --git a/src/components/error/_macro.spec.js b/src/components/error/_macro.spec.js index c6dcdbdf65..35ea6f1a92 100644 --- a/src/components/error/_macro.spec.js +++ b/src/components/error/_macro.spec.js @@ -72,7 +72,7 @@ describe('macro: error', () => { FAKE_NESTED_CONTENT, ); - expect(panelSpy.occurrences[0].type).toBe('error'); + expect(panelSpy.occurrences[0].variant).toBe('error'); expect(panelSpy.occurrences[0].id).toBe('example-error'); }); diff --git a/src/components/footer/_macro.njk b/src/components/footer/_macro.njk index f6dbe9bc0d..8412c26ecd 100644 --- a/src/components/footer/_macro.njk +++ b/src/components/footer/_macro.njk @@ -36,10 +36,9 @@