katalyst-govuk-formbuilder 1.21.0 → 1.21.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.
- checksums.yaml +4 -4
- data/app/assets/builds/katalyst/govuk/formbuilder.css +445 -275
- data/app/assets/builds/katalyst/govuk/formbuilder.js +9 -14
- data/app/assets/builds/katalyst/govuk/formbuilder.min.js +4 -4
- data/app/assets/builds/katalyst/govuk/formbuilder.min.js.map +1 -1
- data/node_modules/govuk-frontend/dist/govuk/components/pagination/_index.scss +4 -0
- data/node_modules/govuk-frontend/dist/govuk/components/skip-link/_index.scss +1 -2
- data/node_modules/govuk-frontend/dist/govuk/core/_govuk-frontend-properties.scss +1 -1
- metadata +2 -2
@@ -1,12 +1,5 @@
|
|
1
1
|
import { Controller } from "@hotwired/stimulus";
|
2
2
|
|
3
|
-
function getFragmentFromUrl(url) {
|
4
|
-
if (!url.includes("#")) {
|
5
|
-
return undefined;
|
6
|
-
}
|
7
|
-
return url.split("#").pop();
|
8
|
-
}
|
9
|
-
|
10
3
|
function setFocus($element, options = {}) {
|
11
4
|
var _options$onBeforeFocu;
|
12
5
|
const isFocusable = $element.getAttribute("tabindex");
|
@@ -80,11 +73,13 @@ class ConfigError extends GOVUKFrontendError {
|
|
80
73
|
class ElementError extends GOVUKFrontendError {
|
81
74
|
constructor(messageOrOptions) {
|
82
75
|
let message = typeof messageOrOptions === "string" ? messageOrOptions : "";
|
83
|
-
if (
|
76
|
+
if (isObject(messageOrOptions)) {
|
84
77
|
const {component: component, identifier: identifier, element: element, expectedType: expectedType} = messageOrOptions;
|
85
78
|
message = identifier;
|
86
79
|
message += element ? ` is not of type ${expectedType != null ? expectedType : "HTMLElement"}` : " not found";
|
87
|
-
|
80
|
+
if (component) {
|
81
|
+
message = formatErrorMessage(component, message);
|
82
|
+
}
|
88
83
|
}
|
89
84
|
super(message);
|
90
85
|
this.name = "ElementError";
|
@@ -281,7 +276,7 @@ class I18n {
|
|
281
276
|
throw new Error("i18n: lookup key missing");
|
282
277
|
}
|
283
278
|
let translation = this.translations[lookupKey];
|
284
|
-
if (typeof (options == null ? void 0 : options.count) === "number" &&
|
279
|
+
if (typeof (options == null ? void 0 : options.count) === "number" && isObject(translation)) {
|
285
280
|
const translationPluralForm = translation[this.getPluralSuffix(lookupKey, options.count)];
|
286
281
|
if (translationPluralForm) {
|
287
282
|
translation = translationPluralForm;
|
@@ -324,7 +319,7 @@ class I18n {
|
|
324
319
|
}
|
325
320
|
const translation = this.translations[lookupKey];
|
326
321
|
const preferredForm = this.hasIntlPluralRulesSupport() ? new Intl.PluralRules(this.locale).select(count) : this.selectPluralFormUsingFallbackRules(count);
|
327
|
-
if (
|
322
|
+
if (isObject(translation)) {
|
328
323
|
if (preferredForm in translation) {
|
329
324
|
return preferredForm;
|
330
325
|
} else if ("other" in translation) {
|
@@ -582,7 +577,7 @@ function closestAttributeValue($element, attributeName) {
|
|
582
577
|
});
|
583
578
|
}
|
584
579
|
this.$errorMessage = this.$root.querySelector(".govuk-error-message");
|
585
|
-
if (
|
580
|
+
if ($textareaDescription.textContent.match(/^\s*$/)) {
|
586
581
|
$textareaDescription.textContent = this.i18n.t("textareaDescription", {
|
587
582
|
count: this.maxLength
|
588
583
|
});
|
@@ -859,7 +854,7 @@ Checkboxes.moduleName = "govuk-checkboxes";
|
|
859
854
|
if (!($target instanceof HTMLAnchorElement)) {
|
860
855
|
return false;
|
861
856
|
}
|
862
|
-
const inputId =
|
857
|
+
const inputId = $target.hash.replace("#", "");
|
863
858
|
if (!inputId) {
|
864
859
|
return false;
|
865
860
|
}
|
@@ -941,7 +936,6 @@ ErrorSummary.schema = Object.freeze({
|
|
941
936
|
throw new ElementError(formatErrorMessage(FileUpload, 'File input (`<input type="file">`) attribute (`type`) is not `file`'));
|
942
937
|
}
|
943
938
|
this.$input = $input;
|
944
|
-
this.$input.setAttribute("hidden", "true");
|
945
939
|
if (!this.$input.id) {
|
946
940
|
throw new ElementError({
|
947
941
|
component: FileUpload,
|
@@ -957,6 +951,7 @@ ErrorSummary.schema = Object.freeze({
|
|
957
951
|
$label.id = `${this.id}-label`;
|
958
952
|
}
|
959
953
|
this.$input.id = `${this.id}-input`;
|
954
|
+
this.$input.setAttribute("hidden", "true");
|
960
955
|
const $button = document.createElement("button");
|
961
956
|
$button.classList.add("govuk-file-upload-button");
|
962
957
|
$button.type = "button";
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import{Controller as e}from"@hotwired/stimulus";function t(e=document.body){return!!e&&e.classList.contains("govuk-frontend-supported")}function n(e){return!!e&&"object"==typeof e&&!function(e){return Array.isArray(e)}(e)}function i(e,t){return`${e.moduleName}: ${t}`}class s extends Error{constructor(...e){super(...e),this.name="GOVUKFrontendError"}}class o extends s{constructor(e=document.body){const t="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";super(e?t:'GOV.UK Frontend initialised without `<script type="module">`'),this.name="SupportError"}}class r extends s{constructor(...e){super(...e),this.name="ConfigError"}}class a extends s{constructor(e){let t="string"==typeof e?e:"";if(
|
1
|
+
import{Controller as e}from"@hotwired/stimulus";function t(e=document.body){return!!e&&e.classList.contains("govuk-frontend-supported")}function n(e){return!!e&&"object"==typeof e&&!function(e){return Array.isArray(e)}(e)}function i(e,t){return`${e.moduleName}: ${t}`}class s extends Error{constructor(...e){super(...e),this.name="GOVUKFrontendError"}}class o extends s{constructor(e=document.body){const t="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";super(e?t:'GOV.UK Frontend initialised without `<script type="module">`'),this.name="SupportError"}}class r extends s{constructor(...e){super(...e),this.name="ConfigError"}}class a extends s{constructor(e){let t="string"==typeof e?e:"";if(n(e)){const{component:n,identifier:s,element:o,expectedType:r}=e;t=s,t+=o?` is not of type ${null!=r?r:"HTMLElement"}`:" not found",n&&(t=i(n,t))}super(t),this.name="ElementError"}}class l extends s{constructor(e){super("string"==typeof e?e:i(e,"Root element (`$root`) already initialised")),this.name="InitError"}}class u{get $root(){return this._$root}constructor(e){this._$root=void 0;const t=this.constructor;if("string"!=typeof t.moduleName)throw new l("`moduleName` not defined in component");if(!(e instanceof t.elementType))throw new a({element:e,component:t,identifier:"Root element (`$root`)",expectedType:t.elementType.name});this._$root=e,t.checkSupport(),this.checkInitialised();const n=t.moduleName;this.$root.setAttribute(`data-${n}-init`,"")}checkInitialised(){const e=this.constructor,t=e.moduleName;if(t&&function(e,t){return e instanceof HTMLElement&&e.hasAttribute(`data-${t}-init`)}(this.$root,t))throw new l(e)}static checkSupport(){if(!t())throw new o}}u.elementType=HTMLElement;const c=Symbol.for("configOverride");class d extends u{[c](e){return{}}get config(){return this._config}constructor(e,t){super(e),this._config=void 0;const s=this.constructor;if(!n(s.defaults))throw new r(i(s,"Config passed as parameter into constructor but no defaults defined"));const o=function(e,t){if(!n(e.schema))throw new r(i(e,"Config passed as parameter into constructor but no schema defined"));const s={},o=Object.entries(e.schema.properties);for(const n of o){const[i,o]=n,r=i.toString();r in t&&(s[r]=h(t[r],o)),"object"===(null==o?void 0:o.type)&&(s[r]=m(e.schema,t,i))}return s}(s,this._$root.dataset);this._config=p(s.defaults,null!=t?t:{},this[c](o),o)}}function h(e,t){const n=e?e.trim():"";let i,s=null==t?void 0:t.type;switch(s||(["true","false"].includes(n)&&(s="boolean"),n.length>0&&isFinite(Number(n))&&(s="number")),s){case"boolean":i="true"===n;break;case"number":i=Number(n);break;default:i=e}return i}function p(...e){const t={};for(const i of e)for(const e of Object.keys(i)){const s=t[e],o=i[e];n(s)&&n(o)?t[e]=p(s,o):t[e]=o}return t}function m(e,t,i){const s=e.properties[i];if("object"!==(null==s?void 0:s.type))return;const o={[i]:{}};for(const[e,s]of Object.entries(t)){let t=o;const r=e.split(".");for(const[o,a]of r.entries())n(t)&&(o<r.length-1?(n(t[a])||(t[a]={}),t=t[a]):e!==i&&(t[a]=h(s)))}return o[i]}class g{constructor(e={},t={}){var n;this.translations=void 0,this.locale=void 0,this.translations=e,this.locale=null!=(n=t.locale)?n:document.documentElement.lang||"en"}t(e,t){if(!e)throw new Error("i18n: lookup key missing");let i=this.translations[e];if("number"==typeof(null==t?void 0:t.count)&&n(i)){const n=i[this.getPluralSuffix(e,t.count)];n&&(i=n)}if("string"==typeof i){if(i.match(/%{(.\S+)}/)){if(!t)throw new Error("i18n: cannot replace placeholders in string if no option data provided");return this.replacePlaceholders(i,t)}return i}return e}replacePlaceholders(e,t){const n=Intl.NumberFormat.supportedLocalesOf(this.locale).length?new Intl.NumberFormat(this.locale):void 0;return e.replace(/%{(.\S+)}/g,function(e,i){if(Object.prototype.hasOwnProperty.call(t,i)){const e=t[i];return!1===e||"number"!=typeof e&&"string"!=typeof e?"":"number"==typeof e?n?n.format(e):`${e}`:e}throw new Error(`i18n: no data found to replace ${e} placeholder in string`)})}hasIntlPluralRulesSupport(){return Boolean("PluralRules"in window.Intl&&Intl.PluralRules.supportedLocalesOf(this.locale).length)}getPluralSuffix(e,t){if(t=Number(t),!isFinite(t))return"other";const i=this.translations[e],s=this.hasIntlPluralRulesSupport()?new Intl.PluralRules(this.locale).select(t):this.selectPluralFormUsingFallbackRules(t);if(n(i)){if(s in i)return s;if("other"in i)return console.warn(`i18n: Missing plural form ".${s}" for "${this.locale}" locale. Falling back to ".other".`),"other"}throw new Error(`i18n: Plural form ".other" is required for "${this.locale}" locale`)}selectPluralFormUsingFallbackRules(e){e=Math.abs(Math.floor(e));const t=this.getPluralRulesForLocale();return t?g.pluralRules[t](e):"other"}getPluralRulesForLocale(){const e=this.locale.split("-")[0];for(const t in g.pluralRulesMap){const n=g.pluralRulesMap[t];if(n.includes(this.locale)||n.includes(e))return t}}}g.pluralRulesMap={arabic:["ar"],chinese:["my","zh","id","ja","jv","ko","ms","th","vi"],french:["hy","bn","fr","gu","hi","fa","pa","zu"],german:["af","sq","az","eu","bg","ca","da","nl","en","et","fi","ka","de","el","hu","lb","no","so","sw","sv","ta","te","tr","ur"],irish:["ga"],russian:["ru","uk"],scottish:["gd"],spanish:["pt-PT","it","es"],welsh:["cy"]},g.pluralRules={arabic:e=>0===e?"zero":1===e?"one":2===e?"two":e%100>=3&&e%100<=10?"few":e%100>=11&&e%100<=99?"many":"other",chinese:()=>"other",french:e=>0===e||1===e?"one":"other",german:e=>1===e?"one":"other",irish:e=>1===e?"one":2===e?"two":e>=3&&e<=6?"few":e>=7&&e<=10?"many":"other",russian(e){const t=e%100,n=t%10;return 1===n&&11!==t?"one":n>=2&&n<=4&&!(t>=12&&t<=14)?"few":0===n||n>=5&&n<=9||t>=11&&t<=14?"many":"other"},scottish:e=>1===e||11===e?"one":2===e||12===e?"two":e>=3&&e<=10||e>=13&&e<=19?"few":"other",spanish:e=>1===e?"one":e%1e6==0&&0!==e?"many":"other",welsh:e=>0===e?"zero":1===e?"one":2===e?"two":3===e?"few":6===e?"many":"other"};
|
2
2
|
/**
|
3
3
|
* JavaScript enhancements for the Button component
|
4
4
|
*
|
@@ -18,7 +18,7 @@ class f extends d{constructor(e,t={}){super(e,t),this.debounceFormSubmitTimer=nu
|
|
18
18
|
*
|
19
19
|
* @preserve
|
20
20
|
* @augments ConfigurableComponent<CharacterCountConfig>
|
21
|
-
*/f.moduleName="govuk-button",f.defaults=Object.freeze({preventDoubleClick:!1}),f.schema=Object.freeze({properties:{preventDoubleClick:{type:"boolean"}}});class b extends d{[c](e){let t={};return("maxwords"in e||"maxlength"in e)&&(t={maxlength:void 0,maxwords:void 0}),t}constructor(e,t={}){var n,s;super(e,t),this.$textarea=void 0,this.$visibleCountMessage=void 0,this.$screenReaderCountMessage=void 0,this.lastInputTimestamp=null,this.lastInputValue="",this.valueChecker=null,this.i18n=void 0,this.maxLength=void 0;const o=this.$root.querySelector(".govuk-js-character-count");if(!(o instanceof HTMLTextAreaElement||o instanceof HTMLInputElement))throw new a({component:b,element:o,expectedType:"HTMLTextareaElement or HTMLInputElement",identifier:"Form field (`.govuk-js-character-count`)"});const l=function(e,t){const n=[];for(const[i,s]of Object.entries(e)){const e=[];if(Array.isArray(s)){for(const{required:n,errorMessage:i}of s)n.every(e=>!!t[e])||e.push(i);"anyOf"!==i||s.length-e.length>=1||n.push(...e)}}return n}(b.schema,this.config);if(l[0])throw new r(i(b,l[0]));this.i18n=new g(this.config.i18n,{locale:v(this.$root,"lang")}),this.maxLength=null!=(n=null!=(s=this.config.maxwords)?s:this.config.maxlength)?n:1/0,this.$textarea=o;const u=`${this.$textarea.id}-info`,c=document.getElementById(u);if(!c)throw new a({component:b,element:c,identifier:`Count message (\`id="${u}"\`)`});this.$errorMessage=this.$root.querySelector(".govuk-error-message")
|
21
|
+
*/f.moduleName="govuk-button",f.defaults=Object.freeze({preventDoubleClick:!1}),f.schema=Object.freeze({properties:{preventDoubleClick:{type:"boolean"}}});class b extends d{[c](e){let t={};return("maxwords"in e||"maxlength"in e)&&(t={maxlength:void 0,maxwords:void 0}),t}constructor(e,t={}){var n,s;super(e,t),this.$textarea=void 0,this.$visibleCountMessage=void 0,this.$screenReaderCountMessage=void 0,this.lastInputTimestamp=null,this.lastInputValue="",this.valueChecker=null,this.i18n=void 0,this.maxLength=void 0;const o=this.$root.querySelector(".govuk-js-character-count");if(!(o instanceof HTMLTextAreaElement||o instanceof HTMLInputElement))throw new a({component:b,element:o,expectedType:"HTMLTextareaElement or HTMLInputElement",identifier:"Form field (`.govuk-js-character-count`)"});const l=function(e,t){const n=[];for(const[i,s]of Object.entries(e)){const e=[];if(Array.isArray(s)){for(const{required:n,errorMessage:i}of s)n.every(e=>!!t[e])||e.push(i);"anyOf"!==i||s.length-e.length>=1||n.push(...e)}}return n}(b.schema,this.config);if(l[0])throw new r(i(b,l[0]));this.i18n=new g(this.config.i18n,{locale:v(this.$root,"lang")}),this.maxLength=null!=(n=null!=(s=this.config.maxwords)?s:this.config.maxlength)?n:1/0,this.$textarea=o;const u=`${this.$textarea.id}-info`,c=document.getElementById(u);if(!c)throw new a({component:b,element:c,identifier:`Count message (\`id="${u}"\`)`});this.$errorMessage=this.$root.querySelector(".govuk-error-message"),c.textContent.match(/^\s*$/)&&(c.textContent=this.i18n.t("textareaDescription",{count:this.maxLength})),this.$textarea.insertAdjacentElement("afterend",c);const d=document.createElement("div");d.className="govuk-character-count__sr-status govuk-visually-hidden",d.setAttribute("aria-live","polite"),this.$screenReaderCountMessage=d,c.insertAdjacentElement("afterend",d);const h=document.createElement("div");h.className=c.className,h.classList.add("govuk-character-count__status"),h.setAttribute("aria-hidden","true"),this.$visibleCountMessage=h,c.insertAdjacentElement("afterend",h),c.classList.add("govuk-visually-hidden"),this.$textarea.removeAttribute("maxlength"),this.bindChangeEvents(),window.addEventListener("pageshow",()=>this.updateCountMessage()),this.updateCountMessage()}bindChangeEvents(){this.$textarea.addEventListener("keyup",()=>this.handleKeyUp()),this.$textarea.addEventListener("focus",()=>this.handleFocus()),this.$textarea.addEventListener("blur",()=>this.handleBlur())}handleKeyUp(){this.updateVisibleCountMessage(),this.lastInputTimestamp=Date.now()}handleFocus(){this.valueChecker=window.setInterval(()=>{(!this.lastInputTimestamp||Date.now()-500>=this.lastInputTimestamp)&&this.updateIfValueChanged()},1e3)}handleBlur(){this.valueChecker&&window.clearInterval(this.valueChecker)}updateIfValueChanged(){this.$textarea.value!==this.lastInputValue&&(this.lastInputValue=this.$textarea.value,this.updateCountMessage())}updateCountMessage(){this.updateVisibleCountMessage(),this.updateScreenReaderCountMessage()}updateVisibleCountMessage(){const e=this.maxLength-this.count(this.$textarea.value)<0;this.$visibleCountMessage.classList.toggle("govuk-character-count__message--disabled",!this.isOverThreshold()),this.$errorMessage||this.$textarea.classList.toggle("govuk-textarea--error",e),this.$visibleCountMessage.classList.toggle("govuk-error-message",e),this.$visibleCountMessage.classList.toggle("govuk-hint",!e),this.$visibleCountMessage.textContent=this.getCountMessage()}updateScreenReaderCountMessage(){this.isOverThreshold()?this.$screenReaderCountMessage.removeAttribute("aria-hidden"):this.$screenReaderCountMessage.setAttribute("aria-hidden","true"),this.$screenReaderCountMessage.textContent=this.getCountMessage()}count(e){if(this.config.maxwords){var t;return(null!=(t=e.match(/\S+/g))?t:[]).length}return e.length}getCountMessage(){const e=this.maxLength-this.count(this.$textarea.value),t=this.config.maxwords?"words":"characters";return this.formatCountMessage(e,t)}formatCountMessage(e,t){if(0===e)return this.i18n.t(`${t}AtLimit`);const n=e<0?"OverLimit":"UnderLimit";return this.i18n.t(`${t}${n}`,{count:Math.abs(e)})}isOverThreshold(){if(!this.config.threshold)return!0;const e=this.count(this.$textarea.value);return this.maxLength*this.config.threshold/100<=e}}b.moduleName="govuk-character-count",b.defaults=Object.freeze({threshold:0,i18n:{charactersUnderLimit:{one:"You have %{count} character remaining",other:"You have %{count} characters remaining"},charactersAtLimit:"You have 0 characters remaining",charactersOverLimit:{one:"You have %{count} character too many",other:"You have %{count} characters too many"},wordsUnderLimit:{one:"You have %{count} word remaining",other:"You have %{count} words remaining"},wordsAtLimit:"You have 0 words remaining",wordsOverLimit:{one:"You have %{count} word too many",other:"You have %{count} words too many"},textareaDescription:{other:""}}}),b.schema=Object.freeze({properties:{i18n:{type:"object"},maxwords:{type:"number"},maxlength:{type:"number"},threshold:{type:"number"}},anyOf:[{required:["maxwords"],errorMessage:'Either "maxlength" or "maxwords" must be provided'},{required:["maxlength"],errorMessage:'Either "maxlength" or "maxwords" must be provided'}]});
|
22
22
|
/**
|
23
23
|
* Checkboxes component
|
24
24
|
*
|
@@ -34,14 +34,14 @@ class w extends u{constructor(e){super(e),this.$inputs=void 0;const t=this.$root
|
|
34
34
|
* @preserve
|
35
35
|
* @augments ConfigurableComponent<ErrorSummaryConfig>
|
36
36
|
*/
|
37
|
-
class y extends d{constructor(e,t={}){super(e,t),this.config.disableAutoFocus||function(e,t={}){var n;const i=e.getAttribute("tabindex");function s(){var n;null==(n=t.onBlur)||n.call(e),i||e.removeAttribute("tabindex")}i||e.setAttribute("tabindex","-1"),e.addEventListener("focus",function(){e.addEventListener("blur",s,{once:!0})},{once:!0}),null==(n=t.onBeforeFocus)||n.call(e),e.focus()}(this.$root),this.$root.addEventListener("click",e=>this.handleClick(e))}handleClick(e){const t=e.target;t&&this.focusTarget(t)&&e.preventDefault()}focusTarget(e){if(!(e instanceof HTMLAnchorElement))return!1;const t=
|
37
|
+
class y extends d{constructor(e,t={}){super(e,t),this.config.disableAutoFocus||function(e,t={}){var n;const i=e.getAttribute("tabindex");function s(){var n;null==(n=t.onBlur)||n.call(e),i||e.removeAttribute("tabindex")}i||e.setAttribute("tabindex","-1"),e.addEventListener("focus",function(){e.addEventListener("blur",s,{once:!0})},{once:!0}),null==(n=t.onBeforeFocus)||n.call(e),e.focus()}(this.$root),this.$root.addEventListener("click",e=>this.handleClick(e))}handleClick(e){const t=e.target;t&&this.focusTarget(t)&&e.preventDefault()}focusTarget(e){if(!(e instanceof HTMLAnchorElement))return!1;const t=e.hash.replace("#","");if(!t)return!1;const n=document.getElementById(t);if(!n)return!1;const i=this.getAssociatedLegendOrLabel(n);return!!i&&(i.scrollIntoView(),n.focus({preventScroll:!0}),!0)}getAssociatedLegendOrLabel(e){var t;const n=e.closest("fieldset");if(n){const t=n.getElementsByTagName("legend");if(t.length){const n=t[0];if(e instanceof HTMLInputElement&&("checkbox"===e.type||"radio"===e.type))return n;const i=n.getBoundingClientRect().top,s=e.getBoundingClientRect();if(s.height&&window.innerHeight){if(s.top+s.height-i<window.innerHeight/2)return n}}}return null!=(t=document.querySelector(`label[for='${e.getAttribute("id")}']`))?t:e.closest("label")}}y.moduleName="govuk-error-summary",y.defaults=Object.freeze({disableAutoFocus:!1}),y.schema=Object.freeze({properties:{disableAutoFocus:{type:"boolean"}}});
|
38
38
|
/**
|
39
39
|
* File upload component
|
40
40
|
*
|
41
41
|
* @preserve
|
42
42
|
* @augments ConfigurableComponent<FileUploadConfig>
|
43
43
|
*/
|
44
|
-
class $ extends d{constructor(e,t={}){super(e,t),this.$input=void 0,this.$button=void 0,this.$status=void 0,this.i18n=void 0,this.id=void 0,this.$announcements=void 0,this.enteredAnotherElement=void 0;const n=this.$root.querySelector("input");if(null===n)throw new a({component:$,identifier:'File inputs (`<input type="file">`)'});if("file"!==n.type)throw new a(i($,'File input (`<input type="file">`) attribute (`type`) is not `file`'));if(this.$input=n
|
44
|
+
class $ extends d{constructor(e,t={}){super(e,t),this.$input=void 0,this.$button=void 0,this.$status=void 0,this.i18n=void 0,this.id=void 0,this.$announcements=void 0,this.enteredAnotherElement=void 0;const n=this.$root.querySelector("input");if(null===n)throw new a({component:$,identifier:'File inputs (`<input type="file">`)'});if("file"!==n.type)throw new a(i($,'File input (`<input type="file">`) attribute (`type`) is not `file`'));if(this.$input=n,!this.$input.id)throw new a({component:$,identifier:'File input (`<input type="file">`) attribute (`id`)'});this.id=this.$input.id,this.i18n=new g(this.config.i18n,{locale:v(this.$root,"lang")});const s=this.findLabel();s.id||(s.id=`${this.id}-label`),this.$input.id=`${this.id}-input`,this.$input.setAttribute("hidden","true");const o=document.createElement("button");o.classList.add("govuk-file-upload-button"),o.type="button",o.id=this.id,o.classList.add("govuk-file-upload-button--empty");const r=this.$input.getAttribute("aria-describedby");r&&o.setAttribute("aria-describedby",r);const l=document.createElement("span");l.className="govuk-body govuk-file-upload-button__status",l.setAttribute("aria-live","polite"),l.innerText=this.i18n.t("noFileChosen"),o.appendChild(l);const u=document.createElement("span");u.className="govuk-visually-hidden",u.innerText=", ",u.id=`${this.id}-comma`,o.appendChild(u);const c=document.createElement("span");c.className="govuk-file-upload-button__pseudo-button-container";const d=document.createElement("span");d.className="govuk-button govuk-button--secondary govuk-file-upload-button__pseudo-button",d.innerText=this.i18n.t("chooseFilesButton"),c.appendChild(d),c.insertAdjacentText("beforeend"," ");const h=document.createElement("span");h.className="govuk-body govuk-file-upload-button__instruction",h.innerText=this.i18n.t("dropInstruction"),c.appendChild(h),o.appendChild(c),o.setAttribute("aria-labelledby",`${s.id} ${u.id} ${o.id}`),o.addEventListener("click",this.onClick.bind(this)),o.addEventListener("dragover",e=>{e.preventDefault()}),this.$root.insertAdjacentElement("afterbegin",o),this.$input.setAttribute("tabindex","-1"),this.$input.setAttribute("aria-hidden","true"),this.$button=o,this.$status=l,this.$input.addEventListener("change",this.onChange.bind(this)),this.updateDisabledState(),this.observeDisabledState(),this.$announcements=document.createElement("span"),this.$announcements.classList.add("govuk-file-upload-announcements"),this.$announcements.classList.add("govuk-visually-hidden"),this.$announcements.setAttribute("aria-live","assertive"),this.$root.insertAdjacentElement("afterend",this.$announcements),this.$button.addEventListener("drop",this.onDrop.bind(this)),document.addEventListener("dragenter",this.updateDropzoneVisibility.bind(this)),document.addEventListener("dragenter",()=>{this.enteredAnotherElement=!0}),document.addEventListener("dragleave",()=>{this.enteredAnotherElement||this.$button.disabled||(this.hideDraggingState(),this.$announcements.innerText=this.i18n.t("leftDropZone")),this.enteredAnotherElement=!1})}updateDropzoneVisibility(e){this.$button.disabled||e.target instanceof Node&&(this.$root.contains(e.target)?e.dataTransfer&&k(e.dataTransfer)&&(this.$button.classList.contains("govuk-file-upload-button--dragging")||(this.showDraggingState(),this.$announcements.innerText=this.i18n.t("enteredDropZone"))):this.$button.classList.contains("govuk-file-upload-button--dragging")&&(this.hideDraggingState(),this.$announcements.innerText=this.i18n.t("leftDropZone")))}showDraggingState(){this.$button.classList.add("govuk-file-upload-button--dragging")}hideDraggingState(){this.$button.classList.remove("govuk-file-upload-button--dragging")}onDrop(e){e.preventDefault(),e.dataTransfer&&k(e.dataTransfer)&&(this.$input.files=e.dataTransfer.files,this.$input.dispatchEvent(new CustomEvent("change")),this.hideDraggingState())}onChange(){const e=this.$input.files.length;0===e?(this.$status.innerText=this.i18n.t("noFileChosen"),this.$button.classList.add("govuk-file-upload-button--empty")):(this.$status.innerText=1===e?this.$input.files[0].name:this.i18n.t("multipleFilesChosen",{count:e}),this.$button.classList.remove("govuk-file-upload-button--empty"))}findLabel(){const e=document.querySelector(`label[for="${this.$input.id}"]`);if(!e)throw new a({component:$,identifier:`Field label (\`<label for=${this.$input.id}>\`)`});return e}onClick(){this.$input.click()}observeDisabledState(){new MutationObserver(e=>{for(const t of e)"attributes"===t.type&&"disabled"===t.attributeName&&this.updateDisabledState()}).observe(this.$input,{attributes:!0})}updateDisabledState(){this.$button.disabled=this.$input.disabled,this.$root.classList.toggle("govuk-drop-zone--disabled",this.$button.disabled)}}function k(e){const t=0===e.types.length,n=e.types.some(e=>"Files"===e);return t||n}
|
45
45
|
/**
|
46
46
|
* Password input component
|
47
47
|
*
|