@ministryofjustice/frontend 5.1.0 → 5.1.2
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.
- package/moj/all.bundle.js +74 -8
- package/moj/all.bundle.js.map +1 -1
- package/moj/all.bundle.mjs +74 -8
- package/moj/all.bundle.mjs.map +1 -1
- package/moj/common/moj-frontend-version.mjs +1 -1
- package/moj/components/add-another/add-another.bundle.js +22 -5
- package/moj/components/add-another/add-another.bundle.js.map +1 -1
- package/moj/components/add-another/add-another.bundle.mjs +22 -5
- package/moj/components/add-another/add-another.bundle.mjs.map +1 -1
- package/moj/components/add-another/add-another.mjs +22 -5
- package/moj/components/add-another/add-another.mjs.map +1 -1
- package/moj/components/sortable-table/_sortable-table.scss +3 -42
- package/moj/components/sortable-table/_sortable-table.scss.map +1 -1
- package/moj/components/sortable-table/sortable-table.bundle.js +51 -2
- package/moj/components/sortable-table/sortable-table.bundle.js.map +1 -1
- package/moj/components/sortable-table/sortable-table.bundle.mjs +51 -2
- package/moj/components/sortable-table/sortable-table.bundle.mjs.map +1 -1
- package/moj/components/sortable-table/sortable-table.mjs +51 -2
- package/moj/components/sortable-table/sortable-table.mjs.map +1 -1
- package/moj/core/_moj-frontend-properties.scss +1 -1
- package/moj/moj-frontend.min.css +1 -1
- package/moj/moj-frontend.min.css.map +1 -1
- package/moj/moj-frontend.min.js +1 -1
- package/moj/moj-frontend.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -78,7 +78,7 @@
|
|
|
78
78
|
*/
|
|
79
79
|
updateAttributes($item, index) {
|
|
80
80
|
$item.querySelectorAll('[data-name]').forEach($input => {
|
|
81
|
-
if (!($input
|
|
81
|
+
if (!this.isValidInputElement($input)) {
|
|
82
82
|
return;
|
|
83
83
|
}
|
|
84
84
|
const name = $input.getAttribute('data-name') || '';
|
|
@@ -109,13 +109,23 @@
|
|
|
109
109
|
*/
|
|
110
110
|
resetItem($item) {
|
|
111
111
|
$item.querySelectorAll('[data-name], [data-id]').forEach($input => {
|
|
112
|
-
if (!($input
|
|
112
|
+
if (!this.isValidInputElement($input)) {
|
|
113
113
|
return;
|
|
114
114
|
}
|
|
115
|
-
if ($input
|
|
116
|
-
$input.
|
|
117
|
-
|
|
115
|
+
if ($input instanceof HTMLSelectElement) {
|
|
116
|
+
$input.selectedIndex = -1;
|
|
117
|
+
$input.value = '';
|
|
118
|
+
} else if ($input instanceof HTMLTextAreaElement) {
|
|
118
119
|
$input.value = '';
|
|
120
|
+
} else {
|
|
121
|
+
switch ($input.type) {
|
|
122
|
+
case 'checkbox':
|
|
123
|
+
case 'radio':
|
|
124
|
+
$input.checked = false;
|
|
125
|
+
break;
|
|
126
|
+
default:
|
|
127
|
+
$input.value = '';
|
|
128
|
+
}
|
|
119
129
|
}
|
|
120
130
|
});
|
|
121
131
|
}
|
|
@@ -145,6 +155,13 @@
|
|
|
145
155
|
}
|
|
146
156
|
}
|
|
147
157
|
|
|
158
|
+
/**
|
|
159
|
+
* @param {Element} $input - the input to validate
|
|
160
|
+
*/
|
|
161
|
+
isValidInputElement($input) {
|
|
162
|
+
return $input instanceof HTMLInputElement || $input instanceof HTMLSelectElement || $input instanceof HTMLTextAreaElement;
|
|
163
|
+
}
|
|
164
|
+
|
|
148
165
|
/**
|
|
149
166
|
* Name for the component used when initialising using data-module attributes.
|
|
150
167
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"add-another.bundle.js","sources":["../../../../src/moj/components/add-another/add-another.mjs"],"sourcesContent":["import { Component } from 'govuk-frontend'\n\nexport class AddAnother extends Component {\n /**\n * @param {Element | null} $root - HTML element to use for add another\n */\n constructor($root) {\n super($root)\n\n this.$root.addEventListener('click', this.onRemoveButtonClick.bind(this))\n this.$root.addEventListener('click', this.onAddButtonClick.bind(this))\n\n const $buttons = this.$root.querySelectorAll(\n '.moj-add-another__add-button, moj-add-another__remove-button'\n )\n\n $buttons.forEach(($button) => {\n if (!($button instanceof HTMLButtonElement)) {\n return\n }\n\n $button.type = 'button'\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onAddButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__add-button')\n ) {\n return\n }\n\n const $items = this.getItems()\n const $item = this.getNewItem()\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n this.updateAttributes($item, $items.length)\n this.resetItem($item)\n\n const $firstItem = $items[0]\n if (!this.hasRemoveButton($firstItem)) {\n this.createRemoveButton($firstItem)\n }\n\n $items[$items.length - 1].after($item)\n\n const $input = $item.querySelector('input, textarea, select')\n if ($input && $input instanceof HTMLInputElement) {\n $input.focus()\n }\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n hasRemoveButton($item) {\n return $item.querySelectorAll('.moj-add-another__remove-button').length\n }\n\n getItems() {\n if (!this.$root) {\n return []\n }\n\n const $items = Array.from(\n this.$root.querySelectorAll('.moj-add-another__item')\n )\n\n return $items.filter((item) => item instanceof HTMLElement)\n }\n\n getNewItem() {\n const $items = this.getItems()\n const $item = $items[0].cloneNode(true)\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n if (!this.hasRemoveButton($item)) {\n this.createRemoveButton($item)\n }\n\n return $item\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n * @param {number} index - Add another item index\n */\n updateAttributes($item, index) {\n $item.querySelectorAll('[data-name]').forEach(($input) => {\n if (!($input instanceof HTMLInputElement)) {\n return\n }\n\n const name = $input.getAttribute('data-name') || ''\n const id = $input.getAttribute('data-id') || ''\n const originalId = $input.id\n\n $input.name = name.replace(/%index%/, `${index}`)\n $input.id = id.replace(/%index%/, `${index}`)\n\n const $label =\n $input.parentElement.querySelector('label') ||\n $input.closest('label') ||\n $item.querySelector(`[for=\"${originalId}\"]`)\n\n if ($label && $label instanceof HTMLLabelElement) {\n $label.htmlFor = $input.id\n }\n })\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n createRemoveButton($item) {\n const $button = document.createElement('button')\n $button.type = 'button'\n\n $button.classList.add(\n 'govuk-button',\n 'govuk-button--secondary',\n 'moj-add-another__remove-button'\n )\n\n $button.textContent = 'Remove'\n\n $item.append($button)\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n resetItem($item) {\n $item.querySelectorAll('[data-name], [data-id]').forEach(($input) => {\n if (!($input instanceof HTMLInputElement)) {\n return\n }\n\n if ($input.type === 'checkbox' || $input.type === 'radio') {\n $input.checked = false\n } else {\n $input.value = ''\n }\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onRemoveButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__remove-button')\n ) {\n return\n }\n\n $button.closest('.moj-add-another__item').remove()\n\n const $items = this.getItems()\n\n if ($items.length === 1) {\n $items[0].querySelector('.moj-add-another__remove-button').remove()\n }\n\n $items.forEach(($item, index) => {\n this.updateAttributes($item, index)\n })\n\n this.focusHeading()\n }\n\n focusHeading() {\n const $heading = this.$root.querySelector('.moj-add-another__heading')\n\n if ($heading && $heading instanceof HTMLElement) {\n $heading.focus()\n }\n }\n\n /**\n * Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'moj-add-another'\n}\n"],"names":["AddAnother","Component","constructor","$root","addEventListener","onRemoveButtonClick","bind","onAddButtonClick","$buttons","querySelectorAll","forEach","$button","HTMLButtonElement","type","event","target","classList","contains","$items","getItems","$item","getNewItem","HTMLElement","updateAttributes","length","resetItem","$firstItem","hasRemoveButton","createRemoveButton","after","$input","querySelector","HTMLInputElement","focus","Array","from","filter","item","cloneNode","index","name","getAttribute","id","originalId","replace","$label","parentElement","closest","HTMLLabelElement","htmlFor","document","createElement","add","textContent","append","checked","value","remove","focusHeading","$heading","moduleName"],"mappings":";;;;;;EAEO,MAAMA,UAAU,SAASC,uBAAS,CAAC;EACxC;EACF;EACA;IACEC,WAAWA,CAACC,KAAK,EAAE;MACjB,KAAK,CAACA,KAAK,CAAC;EAEZ,IAAA,IAAI,CAACA,KAAK,CAACC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAACC,mBAAmB,CAACC,IAAI,CAAC,IAAI,CAAC,CAAC;EACzE,IAAA,IAAI,CAACH,KAAK,CAACC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAACG,gBAAgB,CAACD,IAAI,CAAC,IAAI,CAAC,CAAC;MAEtE,MAAME,QAAQ,GAAG,IAAI,CAACL,KAAK,CAACM,gBAAgB,CAC1C,8DACF,CAAC;EAEDD,IAAAA,QAAQ,CAACE,OAAO,CAAEC,OAAO,IAAK;EAC5B,MAAA,IAAI,EAAEA,OAAO,YAAYC,iBAAiB,CAAC,EAAE;EAC3C,QAAA;EACF;QAEAD,OAAO,CAACE,IAAI,GAAG,QAAQ;EACzB,KAAC,CAAC;EACJ;;EAEA;EACF;EACA;IACEN,gBAAgBA,CAACO,KAAK,EAAE;EACtB,IAAA,MAAMH,OAAO,GAAGG,KAAK,CAACC,MAAM;EAE5B,IAAA,IACE,CAACJ,OAAO,IACR,EAAEA,OAAO,YAAYC,iBAAiB,CAAC,IACvC,CAACD,OAAO,CAACK,SAAS,CAACC,QAAQ,CAAC,6BAA6B,CAAC,EAC1D;EACA,MAAA;EACF;EAEA,IAAA,MAAMC,MAAM,GAAG,IAAI,CAACC,QAAQ,EAAE;EAC9B,IAAA,MAAMC,KAAK,GAAG,IAAI,CAACC,UAAU,EAAE;MAE/B,IAAI,CAACD,KAAK,IAAI,EAAEA,KAAK,YAAYE,WAAW,CAAC,EAAE;EAC7C,MAAA;EACF;MAEA,IAAI,CAACC,gBAAgB,CAACH,KAAK,EAAEF,MAAM,CAACM,MAAM,CAAC;EAC3C,IAAA,IAAI,CAACC,SAAS,CAACL,KAAK,CAAC;EAErB,IAAA,MAAMM,UAAU,GAAGR,MAAM,CAAC,CAAC,CAAC;EAC5B,IAAA,IAAI,CAAC,IAAI,CAACS,eAAe,CAACD,UAAU,CAAC,EAAE;EACrC,MAAA,IAAI,CAACE,kBAAkB,CAACF,UAAU,CAAC;EACrC;MAEAR,MAAM,CAACA,MAAM,CAACM,MAAM,GAAG,CAAC,CAAC,CAACK,KAAK,CAACT,KAAK,CAAC;EAEtC,IAAA,MAAMU,MAAM,GAAGV,KAAK,CAACW,aAAa,CAAC,yBAAyB,CAAC;EAC7D,IAAA,IAAID,MAAM,IAAIA,MAAM,YAAYE,gBAAgB,EAAE;QAChDF,MAAM,CAACG,KAAK,EAAE;EAChB;EACF;;EAEA;EACF;EACA;IACEN,eAAeA,CAACP,KAAK,EAAE;EACrB,IAAA,OAAOA,KAAK,CAACX,gBAAgB,CAAC,iCAAiC,CAAC,CAACe,MAAM;EACzE;EAEAL,EAAAA,QAAQA,GAAG;EACT,IAAA,IAAI,CAAC,IAAI,CAAChB,KAAK,EAAE;EACf,MAAA,OAAO,EAAE;EACX;EAEA,IAAA,MAAMe,MAAM,GAAGgB,KAAK,CAACC,IAAI,CACvB,IAAI,CAAChC,KAAK,CAACM,gBAAgB,CAAC,wBAAwB,CACtD,CAAC;MAED,OAAOS,MAAM,CAACkB,MAAM,CAAEC,IAAI,IAAKA,IAAI,YAAYf,WAAW,CAAC;EAC7D;EAEAD,EAAAA,UAAUA,GAAG;EACX,IAAA,MAAMH,MAAM,GAAG,IAAI,CAACC,QAAQ,EAAE;MAC9B,MAAMC,KAAK,GAAGF,MAAM,CAAC,CAAC,CAAC,CAACoB,SAAS,CAAC,IAAI,CAAC;MAEvC,IAAI,CAAClB,KAAK,IAAI,EAAEA,KAAK,YAAYE,WAAW,CAAC,EAAE;EAC7C,MAAA;EACF;EAEA,IAAA,IAAI,CAAC,IAAI,CAACK,eAAe,CAACP,KAAK,CAAC,EAAE;EAChC,MAAA,IAAI,CAACQ,kBAAkB,CAACR,KAAK,CAAC;EAChC;EAEA,IAAA,OAAOA,KAAK;EACd;;EAEA;EACF;EACA;EACA;EACEG,EAAAA,gBAAgBA,CAACH,KAAK,EAAEmB,KAAK,EAAE;MAC7BnB,KAAK,CAACX,gBAAgB,CAAC,aAAa,CAAC,CAACC,OAAO,CAAEoB,MAAM,IAAK;EACxD,MAAA,IAAI,EAAEA,MAAM,YAAYE,gBAAgB,CAAC,EAAE;EACzC,QAAA;EACF;QAEA,MAAMQ,IAAI,GAAGV,MAAM,CAACW,YAAY,CAAC,WAAW,CAAC,IAAI,EAAE;QACnD,MAAMC,EAAE,GAAGZ,MAAM,CAACW,YAAY,CAAC,SAAS,CAAC,IAAI,EAAE;EAC/C,MAAA,MAAME,UAAU,GAAGb,MAAM,CAACY,EAAE;EAE5BZ,MAAAA,MAAM,CAACU,IAAI,GAAGA,IAAI,CAACI,OAAO,CAAC,SAAS,EAAE,CAAA,EAAGL,KAAK,CAAA,CAAE,CAAC;EACjDT,MAAAA,MAAM,CAACY,EAAE,GAAGA,EAAE,CAACE,OAAO,CAAC,SAAS,EAAE,CAAA,EAAGL,KAAK,CAAA,CAAE,CAAC;QAE7C,MAAMM,MAAM,GACVf,MAAM,CAACgB,aAAa,CAACf,aAAa,CAAC,OAAO,CAAC,IAC3CD,MAAM,CAACiB,OAAO,CAAC,OAAO,CAAC,IACvB3B,KAAK,CAACW,aAAa,CAAC,CAAA,MAAA,EAASY,UAAU,CAAA,EAAA,CAAI,CAAC;EAE9C,MAAA,IAAIE,MAAM,IAAIA,MAAM,YAAYG,gBAAgB,EAAE;EAChDH,QAAAA,MAAM,CAACI,OAAO,GAAGnB,MAAM,CAACY,EAAE;EAC5B;EACF,KAAC,CAAC;EACJ;;EAEA;EACF;EACA;IACEd,kBAAkBA,CAACR,KAAK,EAAE;EACxB,IAAA,MAAMT,OAAO,GAAGuC,QAAQ,CAACC,aAAa,CAAC,QAAQ,CAAC;MAChDxC,OAAO,CAACE,IAAI,GAAG,QAAQ;MAEvBF,OAAO,CAACK,SAAS,CAACoC,GAAG,CACnB,cAAc,EACd,yBAAyB,EACzB,gCACF,CAAC;MAEDzC,OAAO,CAAC0C,WAAW,GAAG,QAAQ;EAE9BjC,IAAAA,KAAK,CAACkC,MAAM,CAAC3C,OAAO,CAAC;EACvB;;EAEA;EACF;EACA;IACEc,SAASA,CAACL,KAAK,EAAE;MACfA,KAAK,CAACX,gBAAgB,CAAC,wBAAwB,CAAC,CAACC,OAAO,CAAEoB,MAAM,IAAK;EACnE,MAAA,IAAI,EAAEA,MAAM,YAAYE,gBAAgB,CAAC,EAAE;EACzC,QAAA;EACF;QAEA,IAAIF,MAAM,CAACjB,IAAI,KAAK,UAAU,IAAIiB,MAAM,CAACjB,IAAI,KAAK,OAAO,EAAE;UACzDiB,MAAM,CAACyB,OAAO,GAAG,KAAK;EACxB,OAAC,MAAM;UACLzB,MAAM,CAAC0B,KAAK,GAAG,EAAE;EACnB;EACF,KAAC,CAAC;EACJ;;EAEA;EACF;EACA;IACEnD,mBAAmBA,CAACS,KAAK,EAAE;EACzB,IAAA,MAAMH,OAAO,GAAGG,KAAK,CAACC,MAAM;EAE5B,IAAA,IACE,CAACJ,OAAO,IACR,EAAEA,OAAO,YAAYC,iBAAiB,CAAC,IACvC,CAACD,OAAO,CAACK,SAAS,CAACC,QAAQ,CAAC,gCAAgC,CAAC,EAC7D;EACA,MAAA;EACF;MAEAN,OAAO,CAACoC,OAAO,CAAC,wBAAwB,CAAC,CAACU,MAAM,EAAE;EAElD,IAAA,MAAMvC,MAAM,GAAG,IAAI,CAACC,QAAQ,EAAE;EAE9B,IAAA,IAAID,MAAM,CAACM,MAAM,KAAK,CAAC,EAAE;QACvBN,MAAM,CAAC,CAAC,CAAC,CAACa,aAAa,CAAC,iCAAiC,CAAC,CAAC0B,MAAM,EAAE;EACrE;EAEAvC,IAAAA,MAAM,CAACR,OAAO,CAAC,CAACU,KAAK,EAAEmB,KAAK,KAAK;EAC/B,MAAA,IAAI,CAAChB,gBAAgB,CAACH,KAAK,EAAEmB,KAAK,CAAC;EACrC,KAAC,CAAC;MAEF,IAAI,CAACmB,YAAY,EAAE;EACrB;EAEAA,EAAAA,YAAYA,GAAG;MACb,MAAMC,QAAQ,GAAG,IAAI,CAACxD,KAAK,CAAC4B,aAAa,CAAC,2BAA2B,CAAC;EAEtE,IAAA,IAAI4B,QAAQ,IAAIA,QAAQ,YAAYrC,WAAW,EAAE;QAC/CqC,QAAQ,CAAC1B,KAAK,EAAE;EAClB;EACF;;EAEA;EACF;EACA;EAEA;EAtMajC,UAAU,CAqMd4D,UAAU,GAAG,iBAAiB;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"add-another.bundle.js","sources":["../../../../src/moj/components/add-another/add-another.mjs"],"sourcesContent":["import { Component } from 'govuk-frontend'\n\nexport class AddAnother extends Component {\n /**\n * @param {Element | null} $root - HTML element to use for add another\n */\n constructor($root) {\n super($root)\n\n this.$root.addEventListener('click', this.onRemoveButtonClick.bind(this))\n this.$root.addEventListener('click', this.onAddButtonClick.bind(this))\n\n const $buttons = this.$root.querySelectorAll(\n '.moj-add-another__add-button, moj-add-another__remove-button'\n )\n\n $buttons.forEach(($button) => {\n if (!($button instanceof HTMLButtonElement)) {\n return\n }\n\n $button.type = 'button'\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onAddButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__add-button')\n ) {\n return\n }\n\n const $items = this.getItems()\n const $item = this.getNewItem()\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n this.updateAttributes($item, $items.length)\n this.resetItem($item)\n\n const $firstItem = $items[0]\n if (!this.hasRemoveButton($firstItem)) {\n this.createRemoveButton($firstItem)\n }\n\n $items[$items.length - 1].after($item)\n\n const $input = $item.querySelector('input, textarea, select')\n if ($input && $input instanceof HTMLInputElement) {\n $input.focus()\n }\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n hasRemoveButton($item) {\n return $item.querySelectorAll('.moj-add-another__remove-button').length\n }\n\n getItems() {\n if (!this.$root) {\n return []\n }\n\n const $items = Array.from(\n this.$root.querySelectorAll('.moj-add-another__item')\n )\n\n return $items.filter((item) => item instanceof HTMLElement)\n }\n\n getNewItem() {\n const $items = this.getItems()\n const $item = $items[0].cloneNode(true)\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n if (!this.hasRemoveButton($item)) {\n this.createRemoveButton($item)\n }\n\n return $item\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n * @param {number} index - Add another item index\n */\n updateAttributes($item, index) {\n $item.querySelectorAll('[data-name]').forEach(($input) => {\n if (!this.isValidInputElement($input)) {\n return\n }\n\n const name = $input.getAttribute('data-name') || ''\n const id = $input.getAttribute('data-id') || ''\n const originalId = $input.id\n\n $input.name = name.replace(/%index%/, `${index}`)\n $input.id = id.replace(/%index%/, `${index}`)\n\n const $label =\n $input.parentElement.querySelector('label') ||\n $input.closest('label') ||\n $item.querySelector(`[for=\"${originalId}\"]`)\n\n if ($label && $label instanceof HTMLLabelElement) {\n $label.htmlFor = $input.id\n }\n })\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n createRemoveButton($item) {\n const $button = document.createElement('button')\n $button.type = 'button'\n\n $button.classList.add(\n 'govuk-button',\n 'govuk-button--secondary',\n 'moj-add-another__remove-button'\n )\n\n $button.textContent = 'Remove'\n\n $item.append($button)\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n resetItem($item) {\n $item.querySelectorAll('[data-name], [data-id]').forEach(($input) => {\n if (!this.isValidInputElement($input)) {\n return\n }\n\n if ($input instanceof HTMLSelectElement) {\n $input.selectedIndex = -1\n $input.value = ''\n } else if ($input instanceof HTMLTextAreaElement) {\n $input.value = ''\n } else {\n switch ($input.type) {\n case 'checkbox':\n case 'radio':\n $input.checked = false\n break\n default:\n $input.value = ''\n }\n }\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onRemoveButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__remove-button')\n ) {\n return\n }\n\n $button.closest('.moj-add-another__item').remove()\n\n const $items = this.getItems()\n\n if ($items.length === 1) {\n $items[0].querySelector('.moj-add-another__remove-button').remove()\n }\n\n $items.forEach(($item, index) => {\n this.updateAttributes($item, index)\n })\n\n this.focusHeading()\n }\n\n focusHeading() {\n const $heading = this.$root.querySelector('.moj-add-another__heading')\n\n if ($heading && $heading instanceof HTMLElement) {\n $heading.focus()\n }\n }\n\n /**\n * @param {Element} $input - the input to validate\n */\n isValidInputElement($input) {\n return (\n $input instanceof HTMLInputElement ||\n $input instanceof HTMLSelectElement ||\n $input instanceof HTMLTextAreaElement\n )\n }\n\n /**\n * Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'moj-add-another'\n}\n"],"names":["AddAnother","Component","constructor","$root","addEventListener","onRemoveButtonClick","bind","onAddButtonClick","$buttons","querySelectorAll","forEach","$button","HTMLButtonElement","type","event","target","classList","contains","$items","getItems","$item","getNewItem","HTMLElement","updateAttributes","length","resetItem","$firstItem","hasRemoveButton","createRemoveButton","after","$input","querySelector","HTMLInputElement","focus","Array","from","filter","item","cloneNode","index","isValidInputElement","name","getAttribute","id","originalId","replace","$label","parentElement","closest","HTMLLabelElement","htmlFor","document","createElement","add","textContent","append","HTMLSelectElement","selectedIndex","value","HTMLTextAreaElement","checked","remove","focusHeading","$heading","moduleName"],"mappings":"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"}
|
|
@@ -194,7 +194,7 @@ class AddAnother extends Component {
|
|
|
194
194
|
*/
|
|
195
195
|
updateAttributes($item, index) {
|
|
196
196
|
$item.querySelectorAll('[data-name]').forEach($input => {
|
|
197
|
-
if (!($input
|
|
197
|
+
if (!this.isValidInputElement($input)) {
|
|
198
198
|
return;
|
|
199
199
|
}
|
|
200
200
|
const name = $input.getAttribute('data-name') || '';
|
|
@@ -225,13 +225,23 @@ class AddAnother extends Component {
|
|
|
225
225
|
*/
|
|
226
226
|
resetItem($item) {
|
|
227
227
|
$item.querySelectorAll('[data-name], [data-id]').forEach($input => {
|
|
228
|
-
if (!($input
|
|
228
|
+
if (!this.isValidInputElement($input)) {
|
|
229
229
|
return;
|
|
230
230
|
}
|
|
231
|
-
if ($input
|
|
232
|
-
$input.
|
|
233
|
-
|
|
231
|
+
if ($input instanceof HTMLSelectElement) {
|
|
232
|
+
$input.selectedIndex = -1;
|
|
233
|
+
$input.value = '';
|
|
234
|
+
} else if ($input instanceof HTMLTextAreaElement) {
|
|
234
235
|
$input.value = '';
|
|
236
|
+
} else {
|
|
237
|
+
switch ($input.type) {
|
|
238
|
+
case 'checkbox':
|
|
239
|
+
case 'radio':
|
|
240
|
+
$input.checked = false;
|
|
241
|
+
break;
|
|
242
|
+
default:
|
|
243
|
+
$input.value = '';
|
|
244
|
+
}
|
|
235
245
|
}
|
|
236
246
|
});
|
|
237
247
|
}
|
|
@@ -261,6 +271,13 @@ class AddAnother extends Component {
|
|
|
261
271
|
}
|
|
262
272
|
}
|
|
263
273
|
|
|
274
|
+
/**
|
|
275
|
+
* @param {Element} $input - the input to validate
|
|
276
|
+
*/
|
|
277
|
+
isValidInputElement($input) {
|
|
278
|
+
return $input instanceof HTMLInputElement || $input instanceof HTMLSelectElement || $input instanceof HTMLTextAreaElement;
|
|
279
|
+
}
|
|
280
|
+
|
|
264
281
|
/**
|
|
265
282
|
* Name for the component used when initialising using data-module attributes.
|
|
266
283
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"add-another.bundle.mjs","sources":["../../../../node_modules/govuk-frontend/dist/govuk/common/index.mjs","../../../../node_modules/govuk-frontend/dist/govuk/errors/index.mjs","../../../../node_modules/govuk-frontend/dist/govuk/component.mjs","../../../../src/moj/components/add-another/add-another.mjs"],"sourcesContent":["function getFragmentFromUrl(url) {\n if (!url.includes('#')) {\n return undefined;\n }\n return url.split('#').pop();\n}\nfunction getBreakpoint(name) {\n const property = `--govuk-frontend-breakpoint-${name}`;\n const value = window.getComputedStyle(document.documentElement).getPropertyValue(property);\n return {\n property,\n value: value || undefined\n };\n}\nfunction setFocus($element, options = {}) {\n var _options$onBeforeFocu;\n const isFocusable = $element.getAttribute('tabindex');\n if (!isFocusable) {\n $element.setAttribute('tabindex', '-1');\n }\n function onFocus() {\n $element.addEventListener('blur', onBlur, {\n once: true\n });\n }\n function onBlur() {\n var _options$onBlur;\n (_options$onBlur = options.onBlur) == null || _options$onBlur.call($element);\n if (!isFocusable) {\n $element.removeAttribute('tabindex');\n }\n }\n $element.addEventListener('focus', onFocus, {\n once: true\n });\n (_options$onBeforeFocu = options.onBeforeFocus) == null || _options$onBeforeFocu.call($element);\n $element.focus();\n}\nfunction isInitialised($root, moduleName) {\n return $root instanceof HTMLElement && $root.hasAttribute(`data-${moduleName}-init`);\n}\n\n/**\n * Checks if GOV.UK Frontend is supported on this page\n *\n * Some browsers will load and run our JavaScript but GOV.UK Frontend\n * won't be supported.\n *\n * @param {HTMLElement | null} [$scope] - (internal) `<body>` HTML element checked for browser support\n * @returns {boolean} Whether GOV.UK Frontend is supported on this page\n */\nfunction isSupported($scope = document.body) {\n if (!$scope) {\n return false;\n }\n return $scope.classList.contains('govuk-frontend-supported');\n}\nfunction isArray(option) {\n return Array.isArray(option);\n}\nfunction isObject(option) {\n return !!option && typeof option === 'object' && !isArray(option);\n}\nfunction formatErrorMessage(Component, message) {\n return `${Component.moduleName}: ${message}`;\n}\n/**\n * @typedef ComponentWithModuleName\n * @property {string} moduleName - Name of the component\n */\n/**\n * @import { ObjectNested } from './configuration.mjs'\n */\n\nexport { formatErrorMessage, getBreakpoint, getFragmentFromUrl, isInitialised, isObject, isSupported, setFocus };\n//# sourceMappingURL=index.mjs.map\n","import { formatErrorMessage } from '../common/index.mjs';\n\nclass GOVUKFrontendError extends Error {\n constructor(...args) {\n super(...args);\n this.name = 'GOVUKFrontendError';\n }\n}\nclass SupportError extends GOVUKFrontendError {\n /**\n * Checks if GOV.UK Frontend is supported on this page\n *\n * @param {HTMLElement | null} [$scope] - HTML element `<body>` checked for browser support\n */\n constructor($scope = document.body) {\n const supportMessage = 'noModule' in HTMLScriptElement.prototype ? 'GOV.UK Frontend initialised without `<body class=\"govuk-frontend-supported\">` from template `<script>` snippet' : 'GOV.UK Frontend is not supported in this browser';\n super($scope ? supportMessage : 'GOV.UK Frontend initialised without `<script type=\"module\">`');\n this.name = 'SupportError';\n }\n}\nclass ConfigError extends GOVUKFrontendError {\n constructor(...args) {\n super(...args);\n this.name = 'ConfigError';\n }\n}\nclass ElementError extends GOVUKFrontendError {\n constructor(messageOrOptions) {\n let message = typeof messageOrOptions === 'string' ? messageOrOptions : '';\n if (typeof messageOrOptions === 'object') {\n const {\n component,\n identifier,\n element,\n expectedType\n } = messageOrOptions;\n message = identifier;\n message += element ? ` is not of type ${expectedType != null ? expectedType : 'HTMLElement'}` : ' not found';\n message = formatErrorMessage(component, message);\n }\n super(message);\n this.name = 'ElementError';\n }\n}\nclass InitError extends GOVUKFrontendError {\n constructor(componentOrMessage) {\n const message = typeof componentOrMessage === 'string' ? componentOrMessage : formatErrorMessage(componentOrMessage, `Root element (\\`$root\\`) already initialised`);\n super(message);\n this.name = 'InitError';\n }\n}\n/**\n * @import { ComponentWithModuleName } from '../common/index.mjs'\n */\n\nexport { ConfigError, ElementError, GOVUKFrontendError, InitError, SupportError };\n//# sourceMappingURL=index.mjs.map\n","import { isInitialised, isSupported } from './common/index.mjs';\nimport { InitError, ElementError, SupportError } from './errors/index.mjs';\n\nclass Component {\n /**\n * Returns the root element of the component\n *\n * @protected\n * @returns {RootElementType} - the root element of component\n */\n get $root() {\n return this._$root;\n }\n constructor($root) {\n this._$root = void 0;\n const childConstructor = this.constructor;\n if (typeof childConstructor.moduleName !== 'string') {\n throw new InitError(`\\`moduleName\\` not defined in component`);\n }\n if (!($root instanceof childConstructor.elementType)) {\n throw new ElementError({\n element: $root,\n component: childConstructor,\n identifier: 'Root element (`$root`)',\n expectedType: childConstructor.elementType.name\n });\n } else {\n this._$root = $root;\n }\n childConstructor.checkSupport();\n this.checkInitialised();\n const moduleName = childConstructor.moduleName;\n this.$root.setAttribute(`data-${moduleName}-init`, '');\n }\n checkInitialised() {\n const constructor = this.constructor;\n const moduleName = constructor.moduleName;\n if (moduleName && isInitialised(this.$root, moduleName)) {\n throw new InitError(constructor);\n }\n }\n static checkSupport() {\n if (!isSupported()) {\n throw new SupportError();\n }\n }\n}\n\n/**\n * @typedef ChildClass\n * @property {string} moduleName - The module name that'll be looked for in the DOM when initialising the component\n */\n\n/**\n * @typedef {typeof Component & ChildClass} ChildClassConstructor\n */\nComponent.elementType = HTMLElement;\n\nexport { Component };\n//# sourceMappingURL=component.mjs.map\n","import { Component } from 'govuk-frontend'\n\nexport class AddAnother extends Component {\n /**\n * @param {Element | null} $root - HTML element to use for add another\n */\n constructor($root) {\n super($root)\n\n this.$root.addEventListener('click', this.onRemoveButtonClick.bind(this))\n this.$root.addEventListener('click', this.onAddButtonClick.bind(this))\n\n const $buttons = this.$root.querySelectorAll(\n '.moj-add-another__add-button, moj-add-another__remove-button'\n )\n\n $buttons.forEach(($button) => {\n if (!($button instanceof HTMLButtonElement)) {\n return\n }\n\n $button.type = 'button'\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onAddButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__add-button')\n ) {\n return\n }\n\n const $items = this.getItems()\n const $item = this.getNewItem()\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n this.updateAttributes($item, $items.length)\n this.resetItem($item)\n\n const $firstItem = $items[0]\n if (!this.hasRemoveButton($firstItem)) {\n this.createRemoveButton($firstItem)\n }\n\n $items[$items.length - 1].after($item)\n\n const $input = $item.querySelector('input, textarea, select')\n if ($input && $input instanceof HTMLInputElement) {\n $input.focus()\n }\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n hasRemoveButton($item) {\n return $item.querySelectorAll('.moj-add-another__remove-button').length\n }\n\n getItems() {\n if (!this.$root) {\n return []\n }\n\n const $items = Array.from(\n this.$root.querySelectorAll('.moj-add-another__item')\n )\n\n return $items.filter((item) => item instanceof HTMLElement)\n }\n\n getNewItem() {\n const $items = this.getItems()\n const $item = $items[0].cloneNode(true)\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n if (!this.hasRemoveButton($item)) {\n this.createRemoveButton($item)\n }\n\n return $item\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n * @param {number} index - Add another item index\n */\n updateAttributes($item, index) {\n $item.querySelectorAll('[data-name]').forEach(($input) => {\n if (!($input instanceof HTMLInputElement)) {\n return\n }\n\n const name = $input.getAttribute('data-name') || ''\n const id = $input.getAttribute('data-id') || ''\n const originalId = $input.id\n\n $input.name = name.replace(/%index%/, `${index}`)\n $input.id = id.replace(/%index%/, `${index}`)\n\n const $label =\n $input.parentElement.querySelector('label') ||\n $input.closest('label') ||\n $item.querySelector(`[for=\"${originalId}\"]`)\n\n if ($label && $label instanceof HTMLLabelElement) {\n $label.htmlFor = $input.id\n }\n })\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n createRemoveButton($item) {\n const $button = document.createElement('button')\n $button.type = 'button'\n\n $button.classList.add(\n 'govuk-button',\n 'govuk-button--secondary',\n 'moj-add-another__remove-button'\n )\n\n $button.textContent = 'Remove'\n\n $item.append($button)\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n resetItem($item) {\n $item.querySelectorAll('[data-name], [data-id]').forEach(($input) => {\n if (!($input instanceof HTMLInputElement)) {\n return\n }\n\n if ($input.type === 'checkbox' || $input.type === 'radio') {\n $input.checked = false\n } else {\n $input.value = ''\n }\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onRemoveButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__remove-button')\n ) {\n return\n }\n\n $button.closest('.moj-add-another__item').remove()\n\n const $items = this.getItems()\n\n if ($items.length === 1) {\n $items[0].querySelector('.moj-add-another__remove-button').remove()\n }\n\n $items.forEach(($item, index) => {\n this.updateAttributes($item, index)\n })\n\n this.focusHeading()\n }\n\n focusHeading() {\n const $heading = this.$root.querySelector('.moj-add-another__heading')\n\n if ($heading && $heading instanceof HTMLElement) {\n $heading.focus()\n }\n }\n\n /**\n * Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'moj-add-another'\n}\n"],"names":["isInitialised","$root","moduleName","HTMLElement","hasAttribute","isSupported","$scope","document","body","classList","contains","formatErrorMessage","Component","message","GOVUKFrontendError","Error","constructor","args","name","SupportError","supportMessage","HTMLScriptElement","prototype","ElementError","messageOrOptions","component","identifier","element","expectedType","InitError","componentOrMessage","_$root","childConstructor","elementType","checkSupport","checkInitialised","setAttribute","AddAnother","addEventListener","onRemoveButtonClick","bind","onAddButtonClick","$buttons","querySelectorAll","forEach","$button","HTMLButtonElement","type","event","target","$items","getItems","$item","getNewItem","updateAttributes","length","resetItem","$firstItem","hasRemoveButton","createRemoveButton","after","$input","querySelector","HTMLInputElement","focus","Array","from","filter","item","cloneNode","index","getAttribute","id","originalId","replace","$label","parentElement","closest","HTMLLabelElement","htmlFor","createElement","add","textContent","append","checked","value","remove","focusHeading","$heading"],"mappings":"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","x_google_ignoreList":[0,1,2]}
|
|
1
|
+
{"version":3,"file":"add-another.bundle.mjs","sources":["../../../../node_modules/govuk-frontend/dist/govuk/common/index.mjs","../../../../node_modules/govuk-frontend/dist/govuk/errors/index.mjs","../../../../node_modules/govuk-frontend/dist/govuk/component.mjs","../../../../src/moj/components/add-another/add-another.mjs"],"sourcesContent":["function getFragmentFromUrl(url) {\n if (!url.includes('#')) {\n return undefined;\n }\n return url.split('#').pop();\n}\nfunction getBreakpoint(name) {\n const property = `--govuk-frontend-breakpoint-${name}`;\n const value = window.getComputedStyle(document.documentElement).getPropertyValue(property);\n return {\n property,\n value: value || undefined\n };\n}\nfunction setFocus($element, options = {}) {\n var _options$onBeforeFocu;\n const isFocusable = $element.getAttribute('tabindex');\n if (!isFocusable) {\n $element.setAttribute('tabindex', '-1');\n }\n function onFocus() {\n $element.addEventListener('blur', onBlur, {\n once: true\n });\n }\n function onBlur() {\n var _options$onBlur;\n (_options$onBlur = options.onBlur) == null || _options$onBlur.call($element);\n if (!isFocusable) {\n $element.removeAttribute('tabindex');\n }\n }\n $element.addEventListener('focus', onFocus, {\n once: true\n });\n (_options$onBeforeFocu = options.onBeforeFocus) == null || _options$onBeforeFocu.call($element);\n $element.focus();\n}\nfunction isInitialised($root, moduleName) {\n return $root instanceof HTMLElement && $root.hasAttribute(`data-${moduleName}-init`);\n}\n\n/**\n * Checks if GOV.UK Frontend is supported on this page\n *\n * Some browsers will load and run our JavaScript but GOV.UK Frontend\n * won't be supported.\n *\n * @param {HTMLElement | null} [$scope] - (internal) `<body>` HTML element checked for browser support\n * @returns {boolean} Whether GOV.UK Frontend is supported on this page\n */\nfunction isSupported($scope = document.body) {\n if (!$scope) {\n return false;\n }\n return $scope.classList.contains('govuk-frontend-supported');\n}\nfunction isArray(option) {\n return Array.isArray(option);\n}\nfunction isObject(option) {\n return !!option && typeof option === 'object' && !isArray(option);\n}\nfunction formatErrorMessage(Component, message) {\n return `${Component.moduleName}: ${message}`;\n}\n/**\n * @typedef ComponentWithModuleName\n * @property {string} moduleName - Name of the component\n */\n/**\n * @import { ObjectNested } from './configuration.mjs'\n */\n\nexport { formatErrorMessage, getBreakpoint, getFragmentFromUrl, isInitialised, isObject, isSupported, setFocus };\n//# sourceMappingURL=index.mjs.map\n","import { formatErrorMessage } from '../common/index.mjs';\n\nclass GOVUKFrontendError extends Error {\n constructor(...args) {\n super(...args);\n this.name = 'GOVUKFrontendError';\n }\n}\nclass SupportError extends GOVUKFrontendError {\n /**\n * Checks if GOV.UK Frontend is supported on this page\n *\n * @param {HTMLElement | null} [$scope] - HTML element `<body>` checked for browser support\n */\n constructor($scope = document.body) {\n const supportMessage = 'noModule' in HTMLScriptElement.prototype ? 'GOV.UK Frontend initialised without `<body class=\"govuk-frontend-supported\">` from template `<script>` snippet' : 'GOV.UK Frontend is not supported in this browser';\n super($scope ? supportMessage : 'GOV.UK Frontend initialised without `<script type=\"module\">`');\n this.name = 'SupportError';\n }\n}\nclass ConfigError extends GOVUKFrontendError {\n constructor(...args) {\n super(...args);\n this.name = 'ConfigError';\n }\n}\nclass ElementError extends GOVUKFrontendError {\n constructor(messageOrOptions) {\n let message = typeof messageOrOptions === 'string' ? messageOrOptions : '';\n if (typeof messageOrOptions === 'object') {\n const {\n component,\n identifier,\n element,\n expectedType\n } = messageOrOptions;\n message = identifier;\n message += element ? ` is not of type ${expectedType != null ? expectedType : 'HTMLElement'}` : ' not found';\n message = formatErrorMessage(component, message);\n }\n super(message);\n this.name = 'ElementError';\n }\n}\nclass InitError extends GOVUKFrontendError {\n constructor(componentOrMessage) {\n const message = typeof componentOrMessage === 'string' ? componentOrMessage : formatErrorMessage(componentOrMessage, `Root element (\\`$root\\`) already initialised`);\n super(message);\n this.name = 'InitError';\n }\n}\n/**\n * @import { ComponentWithModuleName } from '../common/index.mjs'\n */\n\nexport { ConfigError, ElementError, GOVUKFrontendError, InitError, SupportError };\n//# sourceMappingURL=index.mjs.map\n","import { isInitialised, isSupported } from './common/index.mjs';\nimport { InitError, ElementError, SupportError } from './errors/index.mjs';\n\nclass Component {\n /**\n * Returns the root element of the component\n *\n * @protected\n * @returns {RootElementType} - the root element of component\n */\n get $root() {\n return this._$root;\n }\n constructor($root) {\n this._$root = void 0;\n const childConstructor = this.constructor;\n if (typeof childConstructor.moduleName !== 'string') {\n throw new InitError(`\\`moduleName\\` not defined in component`);\n }\n if (!($root instanceof childConstructor.elementType)) {\n throw new ElementError({\n element: $root,\n component: childConstructor,\n identifier: 'Root element (`$root`)',\n expectedType: childConstructor.elementType.name\n });\n } else {\n this._$root = $root;\n }\n childConstructor.checkSupport();\n this.checkInitialised();\n const moduleName = childConstructor.moduleName;\n this.$root.setAttribute(`data-${moduleName}-init`, '');\n }\n checkInitialised() {\n const constructor = this.constructor;\n const moduleName = constructor.moduleName;\n if (moduleName && isInitialised(this.$root, moduleName)) {\n throw new InitError(constructor);\n }\n }\n static checkSupport() {\n if (!isSupported()) {\n throw new SupportError();\n }\n }\n}\n\n/**\n * @typedef ChildClass\n * @property {string} moduleName - The module name that'll be looked for in the DOM when initialising the component\n */\n\n/**\n * @typedef {typeof Component & ChildClass} ChildClassConstructor\n */\nComponent.elementType = HTMLElement;\n\nexport { Component };\n//# sourceMappingURL=component.mjs.map\n","import { Component } from 'govuk-frontend'\n\nexport class AddAnother extends Component {\n /**\n * @param {Element | null} $root - HTML element to use for add another\n */\n constructor($root) {\n super($root)\n\n this.$root.addEventListener('click', this.onRemoveButtonClick.bind(this))\n this.$root.addEventListener('click', this.onAddButtonClick.bind(this))\n\n const $buttons = this.$root.querySelectorAll(\n '.moj-add-another__add-button, moj-add-another__remove-button'\n )\n\n $buttons.forEach(($button) => {\n if (!($button instanceof HTMLButtonElement)) {\n return\n }\n\n $button.type = 'button'\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onAddButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__add-button')\n ) {\n return\n }\n\n const $items = this.getItems()\n const $item = this.getNewItem()\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n this.updateAttributes($item, $items.length)\n this.resetItem($item)\n\n const $firstItem = $items[0]\n if (!this.hasRemoveButton($firstItem)) {\n this.createRemoveButton($firstItem)\n }\n\n $items[$items.length - 1].after($item)\n\n const $input = $item.querySelector('input, textarea, select')\n if ($input && $input instanceof HTMLInputElement) {\n $input.focus()\n }\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n hasRemoveButton($item) {\n return $item.querySelectorAll('.moj-add-another__remove-button').length\n }\n\n getItems() {\n if (!this.$root) {\n return []\n }\n\n const $items = Array.from(\n this.$root.querySelectorAll('.moj-add-another__item')\n )\n\n return $items.filter((item) => item instanceof HTMLElement)\n }\n\n getNewItem() {\n const $items = this.getItems()\n const $item = $items[0].cloneNode(true)\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n if (!this.hasRemoveButton($item)) {\n this.createRemoveButton($item)\n }\n\n return $item\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n * @param {number} index - Add another item index\n */\n updateAttributes($item, index) {\n $item.querySelectorAll('[data-name]').forEach(($input) => {\n if (!this.isValidInputElement($input)) {\n return\n }\n\n const name = $input.getAttribute('data-name') || ''\n const id = $input.getAttribute('data-id') || ''\n const originalId = $input.id\n\n $input.name = name.replace(/%index%/, `${index}`)\n $input.id = id.replace(/%index%/, `${index}`)\n\n const $label =\n $input.parentElement.querySelector('label') ||\n $input.closest('label') ||\n $item.querySelector(`[for=\"${originalId}\"]`)\n\n if ($label && $label instanceof HTMLLabelElement) {\n $label.htmlFor = $input.id\n }\n })\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n createRemoveButton($item) {\n const $button = document.createElement('button')\n $button.type = 'button'\n\n $button.classList.add(\n 'govuk-button',\n 'govuk-button--secondary',\n 'moj-add-another__remove-button'\n )\n\n $button.textContent = 'Remove'\n\n $item.append($button)\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n resetItem($item) {\n $item.querySelectorAll('[data-name], [data-id]').forEach(($input) => {\n if (!this.isValidInputElement($input)) {\n return\n }\n\n if ($input instanceof HTMLSelectElement) {\n $input.selectedIndex = -1\n $input.value = ''\n } else if ($input instanceof HTMLTextAreaElement) {\n $input.value = ''\n } else {\n switch ($input.type) {\n case 'checkbox':\n case 'radio':\n $input.checked = false\n break\n default:\n $input.value = ''\n }\n }\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onRemoveButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__remove-button')\n ) {\n return\n }\n\n $button.closest('.moj-add-another__item').remove()\n\n const $items = this.getItems()\n\n if ($items.length === 1) {\n $items[0].querySelector('.moj-add-another__remove-button').remove()\n }\n\n $items.forEach(($item, index) => {\n this.updateAttributes($item, index)\n })\n\n this.focusHeading()\n }\n\n focusHeading() {\n const $heading = this.$root.querySelector('.moj-add-another__heading')\n\n if ($heading && $heading instanceof HTMLElement) {\n $heading.focus()\n }\n }\n\n /**\n * @param {Element} $input - the input to validate\n */\n isValidInputElement($input) {\n return (\n $input instanceof HTMLInputElement ||\n $input instanceof HTMLSelectElement ||\n $input instanceof HTMLTextAreaElement\n )\n }\n\n /**\n * Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'moj-add-another'\n}\n"],"names":["isInitialised","$root","moduleName","HTMLElement","hasAttribute","isSupported","$scope","document","body","classList","contains","formatErrorMessage","Component","message","GOVUKFrontendError","Error","constructor","args","name","SupportError","supportMessage","HTMLScriptElement","prototype","ElementError","messageOrOptions","component","identifier","element","expectedType","InitError","componentOrMessage","_$root","childConstructor","elementType","checkSupport","checkInitialised","setAttribute","AddAnother","addEventListener","onRemoveButtonClick","bind","onAddButtonClick","$buttons","querySelectorAll","forEach","$button","HTMLButtonElement","type","event","target","$items","getItems","$item","getNewItem","updateAttributes","length","resetItem","$firstItem","hasRemoveButton","createRemoveButton","after","$input","querySelector","HTMLInputElement","focus","Array","from","filter","item","cloneNode","index","isValidInputElement","getAttribute","id","originalId","replace","$label","parentElement","closest","HTMLLabelElement","htmlFor","createElement","add","textContent","append","HTMLSelectElement","selectedIndex","value","HTMLTextAreaElement","checked","remove","focusHeading","$heading"],"mappings":"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","x_google_ignoreList":[0,1,2]}
|
|
@@ -74,7 +74,7 @@ class AddAnother extends Component {
|
|
|
74
74
|
*/
|
|
75
75
|
updateAttributes($item, index) {
|
|
76
76
|
$item.querySelectorAll('[data-name]').forEach($input => {
|
|
77
|
-
if (!($input
|
|
77
|
+
if (!this.isValidInputElement($input)) {
|
|
78
78
|
return;
|
|
79
79
|
}
|
|
80
80
|
const name = $input.getAttribute('data-name') || '';
|
|
@@ -105,13 +105,23 @@ class AddAnother extends Component {
|
|
|
105
105
|
*/
|
|
106
106
|
resetItem($item) {
|
|
107
107
|
$item.querySelectorAll('[data-name], [data-id]').forEach($input => {
|
|
108
|
-
if (!($input
|
|
108
|
+
if (!this.isValidInputElement($input)) {
|
|
109
109
|
return;
|
|
110
110
|
}
|
|
111
|
-
if ($input
|
|
112
|
-
$input.
|
|
113
|
-
|
|
111
|
+
if ($input instanceof HTMLSelectElement) {
|
|
112
|
+
$input.selectedIndex = -1;
|
|
113
|
+
$input.value = '';
|
|
114
|
+
} else if ($input instanceof HTMLTextAreaElement) {
|
|
114
115
|
$input.value = '';
|
|
116
|
+
} else {
|
|
117
|
+
switch ($input.type) {
|
|
118
|
+
case 'checkbox':
|
|
119
|
+
case 'radio':
|
|
120
|
+
$input.checked = false;
|
|
121
|
+
break;
|
|
122
|
+
default:
|
|
123
|
+
$input.value = '';
|
|
124
|
+
}
|
|
115
125
|
}
|
|
116
126
|
});
|
|
117
127
|
}
|
|
@@ -141,6 +151,13 @@ class AddAnother extends Component {
|
|
|
141
151
|
}
|
|
142
152
|
}
|
|
143
153
|
|
|
154
|
+
/**
|
|
155
|
+
* @param {Element} $input - the input to validate
|
|
156
|
+
*/
|
|
157
|
+
isValidInputElement($input) {
|
|
158
|
+
return $input instanceof HTMLInputElement || $input instanceof HTMLSelectElement || $input instanceof HTMLTextAreaElement;
|
|
159
|
+
}
|
|
160
|
+
|
|
144
161
|
/**
|
|
145
162
|
* Name for the component used when initialising using data-module attributes.
|
|
146
163
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"add-another.mjs","sources":["../../../../src/moj/components/add-another/add-another.mjs"],"sourcesContent":["import { Component } from 'govuk-frontend'\n\nexport class AddAnother extends Component {\n /**\n * @param {Element | null} $root - HTML element to use for add another\n */\n constructor($root) {\n super($root)\n\n this.$root.addEventListener('click', this.onRemoveButtonClick.bind(this))\n this.$root.addEventListener('click', this.onAddButtonClick.bind(this))\n\n const $buttons = this.$root.querySelectorAll(\n '.moj-add-another__add-button, moj-add-another__remove-button'\n )\n\n $buttons.forEach(($button) => {\n if (!($button instanceof HTMLButtonElement)) {\n return\n }\n\n $button.type = 'button'\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onAddButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__add-button')\n ) {\n return\n }\n\n const $items = this.getItems()\n const $item = this.getNewItem()\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n this.updateAttributes($item, $items.length)\n this.resetItem($item)\n\n const $firstItem = $items[0]\n if (!this.hasRemoveButton($firstItem)) {\n this.createRemoveButton($firstItem)\n }\n\n $items[$items.length - 1].after($item)\n\n const $input = $item.querySelector('input, textarea, select')\n if ($input && $input instanceof HTMLInputElement) {\n $input.focus()\n }\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n hasRemoveButton($item) {\n return $item.querySelectorAll('.moj-add-another__remove-button').length\n }\n\n getItems() {\n if (!this.$root) {\n return []\n }\n\n const $items = Array.from(\n this.$root.querySelectorAll('.moj-add-another__item')\n )\n\n return $items.filter((item) => item instanceof HTMLElement)\n }\n\n getNewItem() {\n const $items = this.getItems()\n const $item = $items[0].cloneNode(true)\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n if (!this.hasRemoveButton($item)) {\n this.createRemoveButton($item)\n }\n\n return $item\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n * @param {number} index - Add another item index\n */\n updateAttributes($item, index) {\n $item.querySelectorAll('[data-name]').forEach(($input) => {\n if (!($input instanceof HTMLInputElement)) {\n return\n }\n\n const name = $input.getAttribute('data-name') || ''\n const id = $input.getAttribute('data-id') || ''\n const originalId = $input.id\n\n $input.name = name.replace(/%index%/, `${index}`)\n $input.id = id.replace(/%index%/, `${index}`)\n\n const $label =\n $input.parentElement.querySelector('label') ||\n $input.closest('label') ||\n $item.querySelector(`[for=\"${originalId}\"]`)\n\n if ($label && $label instanceof HTMLLabelElement) {\n $label.htmlFor = $input.id\n }\n })\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n createRemoveButton($item) {\n const $button = document.createElement('button')\n $button.type = 'button'\n\n $button.classList.add(\n 'govuk-button',\n 'govuk-button--secondary',\n 'moj-add-another__remove-button'\n )\n\n $button.textContent = 'Remove'\n\n $item.append($button)\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n resetItem($item) {\n $item.querySelectorAll('[data-name], [data-id]').forEach(($input) => {\n if (!($input instanceof HTMLInputElement)) {\n return\n }\n\n if ($input.type === 'checkbox' || $input.type === 'radio') {\n $input.checked = false\n } else {\n $input.value = ''\n }\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onRemoveButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__remove-button')\n ) {\n return\n }\n\n $button.closest('.moj-add-another__item').remove()\n\n const $items = this.getItems()\n\n if ($items.length === 1) {\n $items[0].querySelector('.moj-add-another__remove-button').remove()\n }\n\n $items.forEach(($item, index) => {\n this.updateAttributes($item, index)\n })\n\n this.focusHeading()\n }\n\n focusHeading() {\n const $heading = this.$root.querySelector('.moj-add-another__heading')\n\n if ($heading && $heading instanceof HTMLElement) {\n $heading.focus()\n }\n }\n\n /**\n * Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'moj-add-another'\n}\n"],"names":["AddAnother","Component","constructor","$root","addEventListener","onRemoveButtonClick","bind","onAddButtonClick","$buttons","querySelectorAll","forEach","$button","HTMLButtonElement","type","event","target","classList","contains","$items","getItems","$item","getNewItem","HTMLElement","updateAttributes","length","resetItem","$firstItem","hasRemoveButton","createRemoveButton","after","$input","querySelector","HTMLInputElement","focus","Array","from","filter","item","cloneNode","index","name","getAttribute","id","originalId","replace","$label","parentElement","closest","HTMLLabelElement","htmlFor","document","createElement","add","textContent","append","checked","value","remove","focusHeading","$heading","moduleName"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"add-another.mjs","sources":["../../../../src/moj/components/add-another/add-another.mjs"],"sourcesContent":["import { Component } from 'govuk-frontend'\n\nexport class AddAnother extends Component {\n /**\n * @param {Element | null} $root - HTML element to use for add another\n */\n constructor($root) {\n super($root)\n\n this.$root.addEventListener('click', this.onRemoveButtonClick.bind(this))\n this.$root.addEventListener('click', this.onAddButtonClick.bind(this))\n\n const $buttons = this.$root.querySelectorAll(\n '.moj-add-another__add-button, moj-add-another__remove-button'\n )\n\n $buttons.forEach(($button) => {\n if (!($button instanceof HTMLButtonElement)) {\n return\n }\n\n $button.type = 'button'\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onAddButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__add-button')\n ) {\n return\n }\n\n const $items = this.getItems()\n const $item = this.getNewItem()\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n this.updateAttributes($item, $items.length)\n this.resetItem($item)\n\n const $firstItem = $items[0]\n if (!this.hasRemoveButton($firstItem)) {\n this.createRemoveButton($firstItem)\n }\n\n $items[$items.length - 1].after($item)\n\n const $input = $item.querySelector('input, textarea, select')\n if ($input && $input instanceof HTMLInputElement) {\n $input.focus()\n }\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n hasRemoveButton($item) {\n return $item.querySelectorAll('.moj-add-another__remove-button').length\n }\n\n getItems() {\n if (!this.$root) {\n return []\n }\n\n const $items = Array.from(\n this.$root.querySelectorAll('.moj-add-another__item')\n )\n\n return $items.filter((item) => item instanceof HTMLElement)\n }\n\n getNewItem() {\n const $items = this.getItems()\n const $item = $items[0].cloneNode(true)\n\n if (!$item || !($item instanceof HTMLElement)) {\n return\n }\n\n if (!this.hasRemoveButton($item)) {\n this.createRemoveButton($item)\n }\n\n return $item\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n * @param {number} index - Add another item index\n */\n updateAttributes($item, index) {\n $item.querySelectorAll('[data-name]').forEach(($input) => {\n if (!this.isValidInputElement($input)) {\n return\n }\n\n const name = $input.getAttribute('data-name') || ''\n const id = $input.getAttribute('data-id') || ''\n const originalId = $input.id\n\n $input.name = name.replace(/%index%/, `${index}`)\n $input.id = id.replace(/%index%/, `${index}`)\n\n const $label =\n $input.parentElement.querySelector('label') ||\n $input.closest('label') ||\n $item.querySelector(`[for=\"${originalId}\"]`)\n\n if ($label && $label instanceof HTMLLabelElement) {\n $label.htmlFor = $input.id\n }\n })\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n createRemoveButton($item) {\n const $button = document.createElement('button')\n $button.type = 'button'\n\n $button.classList.add(\n 'govuk-button',\n 'govuk-button--secondary',\n 'moj-add-another__remove-button'\n )\n\n $button.textContent = 'Remove'\n\n $item.append($button)\n }\n\n /**\n * @param {HTMLElement} $item - Add another item\n */\n resetItem($item) {\n $item.querySelectorAll('[data-name], [data-id]').forEach(($input) => {\n if (!this.isValidInputElement($input)) {\n return\n }\n\n if ($input instanceof HTMLSelectElement) {\n $input.selectedIndex = -1\n $input.value = ''\n } else if ($input instanceof HTMLTextAreaElement) {\n $input.value = ''\n } else {\n switch ($input.type) {\n case 'checkbox':\n case 'radio':\n $input.checked = false\n break\n default:\n $input.value = ''\n }\n }\n })\n }\n\n /**\n * @param {MouseEvent} event - Click event\n */\n onRemoveButtonClick(event) {\n const $button = event.target\n\n if (\n !$button ||\n !($button instanceof HTMLButtonElement) ||\n !$button.classList.contains('moj-add-another__remove-button')\n ) {\n return\n }\n\n $button.closest('.moj-add-another__item').remove()\n\n const $items = this.getItems()\n\n if ($items.length === 1) {\n $items[0].querySelector('.moj-add-another__remove-button').remove()\n }\n\n $items.forEach(($item, index) => {\n this.updateAttributes($item, index)\n })\n\n this.focusHeading()\n }\n\n focusHeading() {\n const $heading = this.$root.querySelector('.moj-add-another__heading')\n\n if ($heading && $heading instanceof HTMLElement) {\n $heading.focus()\n }\n }\n\n /**\n * @param {Element} $input - the input to validate\n */\n isValidInputElement($input) {\n return (\n $input instanceof HTMLInputElement ||\n $input instanceof HTMLSelectElement ||\n $input instanceof HTMLTextAreaElement\n )\n }\n\n /**\n * Name for the component used when initialising using data-module attributes.\n */\n static moduleName = 'moj-add-another'\n}\n"],"names":["AddAnother","Component","constructor","$root","addEventListener","onRemoveButtonClick","bind","onAddButtonClick","$buttons","querySelectorAll","forEach","$button","HTMLButtonElement","type","event","target","classList","contains","$items","getItems","$item","getNewItem","HTMLElement","updateAttributes","length","resetItem","$firstItem","hasRemoveButton","createRemoveButton","after","$input","querySelector","HTMLInputElement","focus","Array","from","filter","item","cloneNode","index","isValidInputElement","name","getAttribute","id","originalId","replace","$label","parentElement","closest","HTMLLabelElement","htmlFor","document","createElement","add","textContent","append","HTMLSelectElement","selectedIndex","value","HTMLTextAreaElement","checked","remove","focusHeading","$heading","moduleName"],"mappings":"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"}
|
|
@@ -2,9 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
[aria-sort] button,
|
|
4
4
|
[aria-sort] button:hover {
|
|
5
|
+
display: inline-flex;
|
|
5
6
|
position: relative;
|
|
6
7
|
margin: 0;
|
|
7
|
-
padding: 0
|
|
8
|
+
padding: 0;
|
|
8
9
|
border-width: 0;
|
|
9
10
|
color: #005ea5;
|
|
10
11
|
background-color: transparent;
|
|
@@ -15,6 +16,7 @@
|
|
|
15
16
|
font-weight: inherit;
|
|
16
17
|
text-align: inherit;
|
|
17
18
|
cursor: pointer;
|
|
19
|
+
align-items: center;
|
|
18
20
|
}
|
|
19
21
|
|
|
20
22
|
[aria-sort] button:focus {
|
|
@@ -26,45 +28,4 @@
|
|
|
26
28
|
0 4px $govuk-focus-text-colour;
|
|
27
29
|
}
|
|
28
30
|
|
|
29
|
-
[aria-sort]:first-child button {
|
|
30
|
-
right: auto;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
[aria-sort] button::before {
|
|
34
|
-
content: " \25bc";
|
|
35
|
-
position: absolute;
|
|
36
|
-
top: 9px;
|
|
37
|
-
right: -1px;
|
|
38
|
-
font-size: 0.5em;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
[aria-sort] button::after {
|
|
42
|
-
content: " \25b2";
|
|
43
|
-
position: absolute;
|
|
44
|
-
top: 1px;
|
|
45
|
-
right: -1px;
|
|
46
|
-
font-size: 0.5em;
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
[aria-sort="ascending"] button::before,
|
|
50
|
-
[aria-sort="descending"] button::before {
|
|
51
|
-
content: none;
|
|
52
|
-
}
|
|
53
|
-
|
|
54
|
-
[aria-sort="ascending"] button::after {
|
|
55
|
-
content: " \25b2";
|
|
56
|
-
position: absolute;
|
|
57
|
-
top: 2px;
|
|
58
|
-
right: -5px;
|
|
59
|
-
font-size: 0.8em;
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
[aria-sort="descending"] button::after {
|
|
63
|
-
content: " \25bc";
|
|
64
|
-
position: absolute;
|
|
65
|
-
top: 2px;
|
|
66
|
-
right: -5px;
|
|
67
|
-
font-size: 0.8em;
|
|
68
|
-
}
|
|
69
|
-
|
|
70
31
|
/*# sourceMappingURL=_sortable-table.scss.map */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/moj/components/sortable-table/_sortable-table.scss"],"names":[],"mappings":"AAAA,uCAAuC;;AAEvC;;EAEE,kBAAkB;EAClB,SAAS;EACT,
|
|
1
|
+
{"version":3,"sources":["../../../../src/moj/components/sortable-table/_sortable-table.scss"],"names":[],"mappings":"AAAA,uCAAuC;;AAEvC;;EAEE,oBAAoB;EACpB,kBAAkB;EAClB,SAAS;EACT,UAAU;EACV,eAAe;EACf,cAAc;EACd,6BAA6B;EAG7B,mBAAmB;EACnB,oBAAoB;EACpB,kBAAkB;EAClB,cAAc;EACd,oBAAoB;EACpB,mBAAmB;EACnB,eAAe;EACf,mBAAmB;AACrB;;AAEA;EACE,aAAa;EACb,+BAA+B;EAC/B,qCAAqC;EACrC;;kCAEgC;AAClC","file":"_sortable-table.scss","sourcesContent":["@use \"../../vendor/govuk-frontend\" as *;\n\n[aria-sort] button,\n[aria-sort] button:hover {\n display: inline-flex;\n position: relative;\n margin: 0;\n padding: 0;\n border-width: 0;\n color: #005ea5;\n background-color: transparent;\n -webkit-box-shadow: 0 0 0 0;\n -moz-box-shadow: 0 0 0 0;\n box-shadow: 0 0 0 0;\n font-family: inherit;\n font-size: inherit;\n font-size: 1em;\n font-weight: inherit;\n text-align: inherit;\n cursor: pointer;\n align-items: center;\n}\n\n[aria-sort] button:focus {\n outline: none;\n color: $govuk-focus-text-colour;\n background-color: $govuk-focus-colour;\n box-shadow:\n 0 -2px $govuk-focus-colour,\n 0 4px $govuk-focus-text-colour;\n}\n"]}
|
|
@@ -21,8 +21,21 @@
|
|
|
21
21
|
}
|
|
22
22
|
this.$head = $head;
|
|
23
23
|
this.$body = $body;
|
|
24
|
+
this.$caption = this.$root.querySelector('caption');
|
|
25
|
+
this.$upArrow = `<svg width="22" height="22" focusable="false" aria-hidden="true" role="img" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
26
|
+
<path d="M6.5625 15.5L11 6.63125L15.4375 15.5H6.5625Z" fill="currentColor"/>
|
|
27
|
+
</svg>`;
|
|
28
|
+
this.$downArrow = `<svg width="22" height="22" focusable="false" aria-hidden="true" role="img" vviewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
29
|
+
<path d="M15.4375 7L11 15.8687L6.5625 7L15.4375 7Z" fill="currentColor"/>
|
|
30
|
+
</svg>`;
|
|
31
|
+
this.$upDownArrow = `<svg width="22" height="22" focusable="false" aria-hidden="true" role="img" vviewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
32
|
+
<path d="M8.1875 9.5L10.9609 3.95703L13.7344 9.5H8.1875Z" fill="currentColor"/>
|
|
33
|
+
<path d="M13.7344 12.0781L10.9609 17.6211L8.1875 12.0781H13.7344Z" fill="currentColor"/>
|
|
34
|
+
</svg>`;
|
|
24
35
|
this.$headings = this.$head ? Array.from(this.$head.querySelectorAll('th')) : [];
|
|
25
36
|
this.createHeadingButtons();
|
|
37
|
+
this.updateCaption();
|
|
38
|
+
this.updateDirectionIndicators();
|
|
26
39
|
this.createStatusBox();
|
|
27
40
|
this.initialiseSortedColumn();
|
|
28
41
|
this.$head.addEventListener('click', this.onSortButtonClick.bind(this));
|
|
@@ -58,7 +71,7 @@
|
|
|
58
71
|
initialiseSortedColumn() {
|
|
59
72
|
var _$sortButton$getAttri;
|
|
60
73
|
const $rows = this.getTableRowsArray();
|
|
61
|
-
const $heading = this.$root.querySelector('th[aria-sort]');
|
|
74
|
+
const $heading = this.$root.querySelector('th[aria-sort="ascending"], th[aria-sort="descending"]');
|
|
62
75
|
const $sortButton = $heading == null ? void 0 : $heading.querySelector('button');
|
|
63
76
|
const sortDirection = $heading == null ? void 0 : $heading.getAttribute('aria-sort');
|
|
64
77
|
const columnNumber = Number.parseInt((_$sortButton$getAttri = $sortButton == null ? void 0 : $sortButton.getAttribute('data-index')) != null ? _$sortButton$getAttri : '0', 10);
|
|
@@ -74,7 +87,8 @@
|
|
|
74
87
|
*/
|
|
75
88
|
onSortButtonClick(event) {
|
|
76
89
|
var _$button$getAttribute;
|
|
77
|
-
const $
|
|
90
|
+
const $target = /** @type {HTMLElement} */event.target;
|
|
91
|
+
const $button = $target.closest('button');
|
|
78
92
|
if (!$button || !($button instanceof HTMLButtonElement) || !$button.parentElement) {
|
|
79
93
|
return;
|
|
80
94
|
}
|
|
@@ -87,6 +101,20 @@
|
|
|
87
101
|
this.addRows($sortedRows);
|
|
88
102
|
this.removeButtonStates();
|
|
89
103
|
this.updateButtonState($button, newSortDirection);
|
|
104
|
+
this.updateDirectionIndicators();
|
|
105
|
+
}
|
|
106
|
+
updateCaption() {
|
|
107
|
+
if (!this.$caption) {
|
|
108
|
+
return;
|
|
109
|
+
}
|
|
110
|
+
let assistiveText = this.$caption.querySelector('.govuk-visually-hidden');
|
|
111
|
+
if (assistiveText) {
|
|
112
|
+
return;
|
|
113
|
+
}
|
|
114
|
+
assistiveText = document.createElement('span');
|
|
115
|
+
assistiveText.classList.add('govuk-visually-hidden');
|
|
116
|
+
assistiveText.textContent = ' (column headers with buttons are sortable).';
|
|
117
|
+
this.$caption.appendChild(assistiveText);
|
|
90
118
|
}
|
|
91
119
|
|
|
92
120
|
/**
|
|
@@ -103,6 +131,27 @@
|
|
|
103
131
|
message = message.replace(/%direction%/, this.config[`${direction}Text`]);
|
|
104
132
|
this.$status.textContent = message;
|
|
105
133
|
}
|
|
134
|
+
updateDirectionIndicators() {
|
|
135
|
+
for (const $heading of this.$headings) {
|
|
136
|
+
const $button = /** @type {HTMLButtonElement} */
|
|
137
|
+
$heading.querySelector('button');
|
|
138
|
+
if ($heading.hasAttribute('aria-sort') && $button) {
|
|
139
|
+
var _$button$querySelecto;
|
|
140
|
+
const direction = $heading.getAttribute('aria-sort');
|
|
141
|
+
(_$button$querySelecto = $button.querySelector('svg')) == null || _$button$querySelecto.remove();
|
|
142
|
+
switch (direction) {
|
|
143
|
+
case 'ascending':
|
|
144
|
+
$button.insertAdjacentHTML('beforeend', this.$upArrow);
|
|
145
|
+
break;
|
|
146
|
+
case 'descending':
|
|
147
|
+
$button.insertAdjacentHTML('beforeend', this.$downArrow);
|
|
148
|
+
break;
|
|
149
|
+
default:
|
|
150
|
+
$button.insertAdjacentHTML('beforeend', this.$upDownArrow);
|
|
151
|
+
}
|
|
152
|
+
}
|
|
153
|
+
}
|
|
154
|
+
}
|
|
106
155
|
removeButtonStates() {
|
|
107
156
|
for (const $heading of this.$headings) {
|
|
108
157
|
$heading.setAttribute('aria-sort', 'none');
|