@gov-design-system-ce/components 4.0.8-rc17 → 4.0.8-rc19

package/dist/hydrate/index.js

@@ -4214,11 +4214,12 @@ class GovFormCheckbox {
     validateSize(newValue) {
         validateProp(FormCheckboxSizes, newValue, FormCheckboxClass.root);
     }
-    watchDisabled() {
+    watchControlAttrs() {
         this.passControlAttrs();
     }
     passControlAttrs() {
         this.f.passAttrToControl("size", this.size);
+        this.f.passAttrToControl("disabled", toBoolAttr(this.disabled));
         this.f.passAttrToControl("invalid", toBoolAttr(this.invalid));
     }
     componentWillLoad() {
@@ -4292,9 +4293,9 @@ class GovFormCheckbox {
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "size": ["validateSize", "watchDisabled"],
-        "disabled": ["watchDisabled"],
-        "invalid": ["watchDisabled"]
+        "size": ["validateSize", "watchControlAttrs"],
+        "disabled": ["watchControlAttrs"],
+        "invalid": ["watchControlAttrs"]
     }; }
     static get style() { return GovFormCheckboxStyle0; }
     static get cmpMeta() { return {
@@ -4428,7 +4429,6 @@ var GovFormControlStyle0 = govFormControlCss;
 class GovFormControl {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.gap = undefined;
         this.identifier = undefined;
         this.invalid = false;
         this.disabled = false;
@@ -4437,11 +4437,8 @@ class GovFormControl {
         this.size = "m";
         this.h = govHost(this.host);
         this.f = govForm(this.h);
-        this.controlId = createID("GovFormControl");
     }
     componentDidRender() {
-        this.passChildAttrs();
-        this.invalidChildAttrs();
         this.syncControlMessages();
         this.formElementDescriptionControl();
     }
@@ -4449,38 +4446,6 @@ class GovFormControl {
         var _a;
         (_a = this.observer) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
-    passChildAttrs() {
-        const formElements = [
-            "gov-form-select",
-            "gov-form-input",
-            "gov-form-switch",
-            "gov-form-checkbox",
-            "gov-form-radio",
-            "gov-form-multi-select",
-            "gov-form-file",
-            "gov-form-search",
-        ];
-        this.h.passChildAttr(formElements, "success", this.success);
-        if (this.f.hasGroupChildren === false) {
-            this.h.passChildAttr([...formElements, "gov-form-label"], "identifier", this.identifier || this.controlId);
-        }
-    }
-    invalidChildAttrs() {
-        const formElements = [
-            "gov-form-select",
-            "gov-form-input",
-            "gov-form-switch",
-            "gov-form-checkbox",
-            "gov-form-radio",
-            "gov-form-multi-select",
-            "gov-form-file",
-            "gov-form-search",
-        ];
-        this.h.passChildAttr(formElements, "invalid", this.invalid);
-        if (this.f.hasGroupChildren === false) {
-            this.h.passChildAttr([...formElements, "gov-form-label"], "identifier", this.identifier || this.controlId);
-        }
-    }
     formElementDescriptionControl() {
         const bottomSlot = this.host.querySelector("." + FormControlClass.bottom);
         if (!bottomSlot)
@@ -4506,7 +4471,7 @@ class GovFormControl {
     }
     render() {
         const Tag = this.fieldset ? "fieldset" : "div";
-        return (hAsync(Host, { key: '995792ee7710d6773866b229f94c694e4b442e34', size: this.size, class: this.h.classes(FormControlClass.root) }, hAsync(Tag, { key: '3ee8104bd8f394da8d422c11be6eecd6733cd3e9', class: FormControlClass.holder }, this.h.hasSlot("top") && hAsync("slot", { key: '18221ae1cbc710eea0e90869174438a3eeae32dd', name: "top" }), hAsync("slot", { key: 'f4362ffaf96e51c1e20977ea8ef0d8d2deab6d4c' }), this.h.hasSlot("bottom") && (hAsync("div", { key: '528552235a2eaa1530e635870bf97b110fd32753', class: FormControlClass.bottom }, hAsync("slot", { key: '102521effa28ca385838c6c01e33a871b2bf0f4a', name: "bottom" }))))));
+        return (hAsync(Host, { key: '9178f9dbaff42cb649849621e34059afa6d387d7', size: this.size, class: this.h.classes(FormControlClass.root) }, hAsync(Tag, { key: '296540b214c4106f676b3bf4981ad84409004472', class: FormControlClass.holder }, this.h.hasSlot("top") && hAsync("slot", { key: 'b62e1d46f8fdc6b56ae481de1cb1fb020f9f8ec6', name: "top" }), hAsync("slot", { key: '24ffcd827657b1b02cbe657c41be16af9f8da165' }), this.h.hasSlot("bottom") && (hAsync("div", { key: '77d9ee6b541d4b1073fd621deec00c2336aff240', class: FormControlClass.bottom }, hAsync("slot", { key: '4c7f2200a2fd55b3f801dc40383b7a91cbb18b7d', name: "bottom" }))))));
     }
     get host() { return getElement(this); }
     static get style() { return GovFormControlStyle0; }
@@ -4514,7 +4479,6 @@ class GovFormControl {
         "$flags$": 4,
         "$tagName$": "gov-form-control",
         "$members$": {
-            "gap": [1],
             "identifier": [1],
             "invalid": [4],
             "disabled": [4],
@@ -4599,12 +4563,12 @@ class GovFormFile {
         this.h = govHost(this.host);
         this.f = govForm(this.h);
     }
-    watchDisabled() {
+    watchControlAttrs() {
         this.passControlAttrs();
     }
     passControlAttrs() {
         this.f.passAttrToControl("invalid", toBoolAttr(this.invalid));
-        this.f.passAttrToControl("type", "File");
+        this.f.passAttrToControl("disabled", toBoolAttr(this.disabled));
     }
     registerListeners() {
         function highlight() {
@@ -4679,7 +4643,8 @@ class GovFormFile {
     }
     componentWillLoad() {
         this.f.passAttrToLabel("required", String(this.required));
-        this.watchDisabled();
+        this.f.passAttrToControl("type", "File");
+        this.passControlAttrs();
     }
     async componentDidRender() {
         if (canValidateWcagOnRender()) {
@@ -4689,7 +4654,7 @@ class GovFormFile {
         this.registerListeners();
     }
     render() {
-        return (hAsync(Host, { key: '0f0c007e221e04c4876b204dc1967f5b3bc7cfa4', class: this.h.classes([FormFileClass.root]), invalid: toBoolAttrIfDefined(this.invalid), expanded: toBoolAttrIfDefined(this.expanded) }, hAsync("div", { key: 'f49933f160fcebaf5b6b7a65a039d4b1dadeadea', class: FormFileClass.area, ref: el => (this.areaRef = el) }, hAsync("slot", { key: '1bd9bc79fae21146bfa60b34cc0a9caeaf53b4e0' }), hAsync("input", { key: '71c235790f137f973f65fa5cc355af2da124a86f', class: FormFileClass.input, ref: el => (this.inputRef = el), id: this.identifier || this.fileId, type: "file", name: this.name, accept: this.accept, multiple: this.multiple, onChange: this.onChangeHandler.bind(this), onFocus: this.onFocusHandler.bind(this), onBlur: this.onBlurHandler.bind(this), required: this.required, disabled: this.disabled, "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid), "aria-describedby": this.wcagDescribedBy, "aria-labelledby": this.wcagLabelledBy, "aria-disabled": toBoolAttrIfDefined(this.disabled) })), this.h.hasSlot("attachments") ? (hAsync("div", { class: FormFileClass.attachments }, hAsync("slot", { name: "attachments" }))) : null, this.files.length && this.displayAttachments ? (hAsync("div", { class: FormFileClass.attachments }, hAsync("gov-attachments", { label: this.wcagAttachmentsLabel, "wcag-label": this.wcagAttachmentsLabel }, this.files.map(item => (hAsync("gov-attachments-item", { "wcag-remove-labelled-by": item.id, "on-gov-remove": () => this.onRemoveFileHandler(item) }, hAsync("span", { class: "sr-only", id: item.id }, this.wcagRemoveLabel.replace("{FILE_NAME}", item.file.name)), item.file.name, item.acceptValid === false ? (hAsync("gov-form-message", { slot: "message", variant: "error" }, hAsync("gov-icon", { slot: "icon", name: "exclamation-triangle-fill" }), item.acceptValid === false ? this.errorAccept : null)) : null, item.sizeValid === false ? (hAsync("gov-form-message", { slot: "message", variant: "error" }, hAsync("gov-icon", { slot: "icon", name: "exclamation-triangle-fill" }), this.errorSize.replace("{FILE_SIZE}", formatBytes(this.maxFileSize)))) : null, hAsync("span", { slot: "info" }, "(", formatBytes(item.file.size), ")"))))))) : null));
+        return (hAsync(Host, { key: 'f8ab9ecfba8ade897c1ba9d343259fd77fe74f68', class: this.h.classes([FormFileClass.root]), invalid: toBoolAttrIfDefined(this.invalid), expanded: toBoolAttrIfDefined(this.expanded) }, hAsync("div", { key: '9b1051cb9163af7ceaf42462a2d040a04e3e2088', class: FormFileClass.area, ref: el => (this.areaRef = el) }, hAsync("slot", { key: 'cf789459997322558f3a27eeaacaab2e11757aed' }), hAsync("input", { key: '82d86f00eecd47a10b9540cc0671303d443b536b', class: FormFileClass.input, ref: el => (this.inputRef = el), id: this.identifier || this.fileId, type: "file", name: this.name, accept: this.accept, multiple: this.multiple, onChange: this.onChangeHandler.bind(this), onFocus: this.onFocusHandler.bind(this), onBlur: this.onBlurHandler.bind(this), required: this.required, disabled: this.disabled, "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid), "aria-describedby": this.wcagDescribedBy, "aria-labelledby": this.wcagLabelledBy, "aria-disabled": toBoolAttrIfDefined(this.disabled) })), this.h.hasSlot("attachments") ? (hAsync("div", { class: FormFileClass.attachments }, hAsync("slot", { name: "attachments" }))) : null, this.files.length && this.displayAttachments ? (hAsync("div", { class: FormFileClass.attachments }, hAsync("gov-attachments", { label: this.wcagAttachmentsLabel, "wcag-label": this.wcagAttachmentsLabel }, this.files.map(item => (hAsync("gov-attachments-item", { "wcag-remove-labelled-by": item.id, "on-gov-remove": () => this.onRemoveFileHandler(item) }, hAsync("span", { class: "sr-only", id: item.id }, this.wcagRemoveLabel.replace("{FILE_NAME}", item.file.name)), item.file.name, item.acceptValid === false ? (hAsync("gov-form-message", { slot: "message", variant: "error" }, hAsync("gov-icon", { slot: "icon", name: "exclamation-triangle-fill" }), item.acceptValid === false ? this.errorAccept : null)) : null, item.sizeValid === false ? (hAsync("gov-form-message", { slot: "message", variant: "error" }, hAsync("gov-icon", { slot: "icon", name: "exclamation-triangle-fill" }), this.errorSize.replace("{FILE_SIZE}", formatBytes(this.maxFileSize)))) : null, hAsync("span", { slot: "info" }, "(", formatBytes(item.file.size), ")"))))))) : null));
     }
     onRemoveFileHandler(file) {
         const index = this.files.findIndex(item => item.id === file.id);
@@ -4754,8 +4719,8 @@ class GovFormFile {
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "disabled": ["watchDisabled"],
-        "invalid": ["watchDisabled"]
+        "disabled": ["watchControlAttrs"],
+        "invalid": ["watchControlAttrs"]
     }; }
     static get style() { return GovFormFileStyle0; }
     static get cmpMeta() { return {
@@ -4897,19 +4862,21 @@ class GovFormInput {
     validateSize(newValue) {
         validateProp(FormInputSizes, newValue, FormInputClass.root);
     }
-    watchDisabled() {
+    watchControlAttrs() {
         this.passControlAttrs();
     }
     passControlAttrs() {
         this.f.passAttrToControl("size", this.size);
+        this.f.passAttrToControl("success", toBoolAttr(this.success));
+        this.f.passAttrToControl("disabled", toBoolAttr(this.disabled));
         this.f.passAttrToControl("invalid", toBoolAttr(this.invalid));
-        this.f.passAttrToControl("type", this.multiline ? Tags$1.TEXTAREA : Tags$1.INPUT);
     }
     componentWillLoad() {
         this.validateVariant(this.variant);
         this.validateSize(this.size);
         this.passControlAttrs();
         this.f.passAttrToLabel("required", String(this.required));
+        this.f.passAttrToControl("type", this.multiline ? Tags$1.TEXTAREA : Tags$1.INPUT);
     }
     async componentDidRender() {
         if (canValidateWcagOnRender()) {
@@ -4922,9 +4889,9 @@ class GovFormInput {
     }
     render() {
         const Tag = this.multiline ? Tags$1.TEXTAREA : Tags$1.INPUT;
-        return (hAsync(Host, { key: '1d217855ba964b9c637373529e2b677fb09f8034', class: FormInputClass.root, size: this.size, variant: this.variant, type: this.type }, this.h.hasSlot("prefix") && hAsync("slot", { key: '75b989d2f4b70cf43e9a5315fdb6eb56af832118', name: "prefix" }), hAsync("span", { key: '39f063be627ad300abe364adfa4a32b79a879773', class: "element" }, this.h.hasSlot("left-icon") && hAsync("slot", { key: '84da6d8d05274f5a9760b871ffb89dec870122f8', name: "left-icon" }), this.h.hasSlot("right-icon") && !(this.success || this.invalid) && hAsync("slot", { key: 'b8ede08c703cc88e526593cb5aac4a868293543c', name: "right-icon" }), this.success && !this.multiline &&
-            hAsync("gov-icon", { key: '1dad15f0bbab72fef2f2d596fb2ce27b097eb3a4', slot: "right-icon", class: "icon-validation", name: "check-lg" }), this.invalid && !this.multiline &&
-            hAsync("gov-icon", { key: '9d8ed110a2640133ecc462c6b06f1f5496fb61f7', slot: "right-icon", class: "icon-validation", name: "exclamation-lg" }), hAsync(Tag, { key: '62ac8ee0c14c5289c377685fabf535947a43f4c5', type: this.inputType, disabled: this.disabled, id: this.identifier || this.inputId, name: this.name, onFocus: this.onFocusHandler.bind(this), onInput: this.onInputHandler.bind(this), onBlur: this.onBlurHandler.bind(this), onKeyUp: this.onKeyUpHandler.bind(this), onKeyDown: this.onKeyDownHandler.bind(this), ref: el => (this.inputRef = el), placeholder: this.placeholder, value: this.value, spellcheck: toBoolAttrIfDefined(this.spellcheck), lang: this.inputLang, readonly: toBoolAttrIfDefined(this.readonly), autocomplete: toOnOffAttrIfDefined(this.autocomplete), autocorrect: toOnOffAttrIfDefined(this.autocorrect), minlength: this.minlength, maxlength: this.maxlength, min: this.min, max: this.max, required: this.required, rows: this.rows, cols: this.cols, role: this.role, "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid), "aria-disabled": toBoolAttrIfDefined(this.disabled), "aria-describedby": this.wcagDescribedBy, "aria-labelledby": this.wcagLabelledBy, "aria-owns": this.wcagOwns, "aria-expanded": toBoolAttrIfDefined(this.wcagExpanded), "aria-autocomplete": this.wcagAutocomplete })), this.h.hasSlot("sufix") && hAsync("slot", { key: '9746bac959c672b37d1c5529cbbe0da13ecf4ce8', name: "sufix" })));
+        return (hAsync(Host, { key: 'fb06974797e9fe99cc0845cd9aac8cc79bfc0583', class: FormInputClass.root, size: this.size, variant: this.variant, type: this.type }, this.h.hasSlot("prefix") && hAsync("slot", { key: 'c8a307ca8c1e4e4a27ac00463523f19c4012bbfe', name: "prefix" }), hAsync("span", { key: 'b86a839790465feda8d50385ca5b44a98c3ee81d', class: "element" }, this.h.hasSlot("left-icon") && hAsync("slot", { key: '300d97f0f13e95ac306b3c0332ccb58b99988c7a', name: "left-icon" }), this.h.hasSlot("right-icon") && !(this.success || this.invalid) && hAsync("slot", { key: '6d2673bc16e363b52662671a172f7c20eca85c62', name: "right-icon" }), this.success && !this.multiline &&
+            hAsync("gov-icon", { key: '40c2f0e9991833ad731e469164d0bd148d883007', slot: "right-icon", class: "icon-validation", name: "check-lg" }), this.invalid && !this.multiline &&
+            hAsync("gov-icon", { key: '56d940b36602db7749fc1656fdee739b2ad21370', slot: "right-icon", class: "icon-validation", name: "exclamation-lg" }), hAsync(Tag, { key: 'ecdf27b1a0889cfd0367ded8cffd24152c2e1d01', type: this.inputType, disabled: this.disabled, id: this.identifier || this.inputId, name: this.name, onFocus: this.onFocusHandler.bind(this), onInput: this.onInputHandler.bind(this), onBlur: this.onBlurHandler.bind(this), onKeyUp: this.onKeyUpHandler.bind(this), onKeyDown: this.onKeyDownHandler.bind(this), ref: el => (this.inputRef = el), placeholder: this.placeholder, value: this.value, spellcheck: toBoolAttrIfDefined(this.spellcheck), lang: this.inputLang, readonly: toBoolAttrIfDefined(this.readonly), autocomplete: toOnOffAttrIfDefined(this.autocomplete), autocorrect: toOnOffAttrIfDefined(this.autocorrect), minlength: this.minlength, maxlength: this.maxlength, min: this.min, max: this.max, required: this.required, rows: this.rows, cols: this.cols, role: this.role, "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid), "aria-disabled": toBoolAttrIfDefined(this.disabled), "aria-describedby": this.wcagDescribedBy, "aria-labelledby": this.wcagLabelledBy, "aria-owns": this.wcagOwns, "aria-expanded": toBoolAttrIfDefined(this.wcagExpanded), "aria-autocomplete": this.wcagAutocomplete })), this.h.hasSlot("sufix") && hAsync("slot", { key: 'bd6b9c7a981c40fdddf83e8ce0778978e1ea31af', name: "sufix" })));
     }
     onFocusHandler(e) {
         e.stopPropagation();
@@ -5006,10 +4973,10 @@ class GovFormInput {
     get host() { return getElement(this); }
     static get watchers() { return {
         "variant": ["validateVariant"],
-        "size": ["validateSize", "watchDisabled"],
-        "disabled": ["watchDisabled"],
-        "invalid": ["watchDisabled"],
-        "type": ["watchDisabled"]
+        "size": ["validateSize", "watchControlAttrs"],
+        "disabled": ["watchControlAttrs"],
+        "invalid": ["watchControlAttrs"],
+        "success": ["watchControlAttrs"]
     }; }
     static get style() { return GovFormInputStyle0; }
     static get cmpMeta() { return {
@@ -5019,14 +4986,14 @@ class GovFormInput {
             "value": [1537],
             "identifier": [1],
             "variant": [1],
-            "success": [4],
+            "success": [516],
             "size": [1],
             "name": [1],
             "multiline": [4],
             "rows": [2],
             "cols": [2],
-            "required": [4],
-            "disabled": [4],
+            "required": [516],
+            "disabled": [516],
             "placeholder": [1],
             "readonly": [4],
             "minlength": [2],
@@ -5040,7 +5007,7 @@ class GovFormInput {
             "type": [1],
             "inputType": [1, "input-type"],
             "role": [1],
-            "invalid": [4],
+            "invalid": [516],
             "wcagDescribedBy": [1, "wcag-described-by"],
             "wcagLabelledBy": [1, "wcag-labelled-by"],
             "wcagOwns": [1, "wcag-owns"],
@@ -5055,7 +5022,7 @@ class GovFormInput {
         },
         "$listeners$": undefined,
         "$lazyBundleId$": "-",
-        "$attrsToReflect$": [["value", "value"]]
+        "$attrsToReflect$": [["value", "value"], ["success", "success"], ["required", "required"], ["disabled", "disabled"], ["invalid", "invalid"]]
     }; }
 }
 
@@ -5183,18 +5150,18 @@ class GovFormMultiSelect {
     watchValue(newValue) {
         this.selectedOptionsState = propsValueToArray(newValue);
     }
-    watchDisabled() {
+    watchControlAttrs() {
         this.passControlAttrs();
     }
     passControlAttrs() {
         this.f.passAttrToControl('size', this.size);
         this.f.passAttrToControl('invalid', toBoolAttr(this.invalid));
+        this.f.passAttrToControl('disabled', toBoolAttr(this.disabled));
         this.f.passAttrToControl('success', toBoolAttr(this.success));
     }
     componentWillLoad() {
         this.validateVariant(this.variant);
         this.validateSize(this.size);
-        this.watchDisabled();
         this.passControlAttrs();
         this.f.passAttrToLabel('required', String(this.required));
         this.optionsState = propsValueToArray(this.options);
@@ -5310,7 +5277,7 @@ class GovFormMultiSelect {
         }
     }
     render() {
-        return (hAsync(Host, { key: 'bb5855ba2a4cd63ad2093ae2aebd67f3349cea28', class: FormMultiSelectClass.root, size: this.size, variant: this.variant }, hAsync("div", { key: '3abae4b8ea9cc625a21dd45e1b9ee8befc49b8b6', class: FormMultiSelectClass.wrap }, this.h.hasSlot('prefix') && hAsync("slot", { key: '86da9e574fe68a4883b3df4da602e05f627e4714', name: "prefix" }), hAsync("div", { key: '87d30a0d40739f4a4dbeaa9b5cef946ed9873c00', class: "element" }, hAsync("gov-form-autocomplete", { key: 'ee44381d4eb97059d935135391951e7750afa648', value: this.valueState, disabled: this.disabled, identifier: this.identifier || this.selectId, required: false, size: this.size, variant: this.variant, placeholder: this.placeholder, "message-empty": this.messageEmpty, "message-loading": this.messageLoading, ref: el => (this.autocompleteRef = el), minlength: 0, "name-key": 'label', wcagDescribedBy: this.wcagDescribedBy, wcagLabelledBy: this.wcagLabelledBy, wcagOwns: this.listId }), hAsync("gov-icon", { key: '83bdc379de06eab7db28d17cd39cd34128e60090', slot: "right-icon", class: "icon-arrow", name: "chevron-down" }), this.h.hasSlot('right-icon') && !(this.success || this.invalid) && hAsync("slot", { key: '809ab0378b25182006e15effcb29babacb93274a', name: "right-icon" }), this.success && hAsync("gov-icon", { key: '85ef665e98040503ea14743e8497ceb7b48d3a9e', slot: "right-icon", class: "icon-validation", name: "check-lg" }), this.invalid && hAsync("gov-icon", { key: '88509ad301ad83c61957b0d1dd6e95586cf8d65a', slot: "right-icon", class: "icon-validation", name: "exclamation-lg" }), hAsync("select", { key: '382f9855fe424f6427d158568339c51fc7ea46a5', hidden: true, class: 'hidden-select-list', "aria-hidden": toBoolAttr(true), multiple: true, required: this.required, name: this.name, disabled: this.disabled, ref: el => (this.selectRef = el), "aria-disabled": toBoolAttrIfDefined(this.disabled), "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid), "aria-describedby": this.wcagDescribedBy, "aria-labelledby": this.wcagLabelledBy, "aria-owns": this.wcagOwns }, hAsync("slot", { key: '678201c2968bbb6d3e470ccc03d149b70fed50db' }))), this.h.hasSlot('sufix') && hAsync("slot", { key: '25a9c902b37c15988f4591a136006d9f3db0fa8d', name: "sufix" })), this.hideSelectedList === false ? (hAsync("ul", { role: "listbox", id: this.listId, class: FormMultiSelectClass.list }, Array.isArray(this.selectedOptionsState) && this.selectedOptionsState.map(selected => {
+        return (hAsync(Host, { key: 'd196b10aa1a15b405235bec76b0c9a50ce7b7a32', class: FormMultiSelectClass.root, size: this.size, variant: this.variant }, hAsync("div", { key: '18b3d6b6b568d4c2e6185cc2b5397dc0d0b397e3', class: FormMultiSelectClass.wrap }, this.h.hasSlot('prefix') && hAsync("slot", { key: 'b7c67fef5eea42e0f948487082cb481fbd8f6264', name: "prefix" }), hAsync("div", { key: 'a9c6e91522fa96fa40ba75afee7150c2f0b9c07a', class: "element" }, hAsync("gov-form-autocomplete", { key: '2792873c33eee760c93bffbaba9268e4dff4acba', value: this.valueState, disabled: this.disabled, identifier: this.identifier || this.selectId, required: false, size: this.size, variant: this.variant, placeholder: this.placeholder, "message-empty": this.messageEmpty, "message-loading": this.messageLoading, ref: el => (this.autocompleteRef = el), minlength: 0, "name-key": 'label', wcagDescribedBy: this.wcagDescribedBy, wcagLabelledBy: this.wcagLabelledBy, wcagOwns: this.listId }), hAsync("gov-icon", { key: 'd03af7b6c89e62d7f6054d8b5be3bc73f8b1fe96', slot: "right-icon", class: "icon-arrow", name: "chevron-down" }), this.h.hasSlot('right-icon') && !(this.success || this.invalid) && hAsync("slot", { key: '34299ffce891c3f31947ef8f6ccd5d7144a5e485', name: "right-icon" }), this.success && hAsync("gov-icon", { key: '0343f86ccaf5a9fad2f6c2c0aa82cf508e19c1c1', slot: "right-icon", class: "icon-validation", name: "check-lg" }), this.invalid && hAsync("gov-icon", { key: '481ae336432840d2994455371f3407644fd1e1b1', slot: "right-icon", class: "icon-validation", name: "exclamation-lg" }), hAsync("select", { key: '0348cced9ebf67b2047586a024c6fd05ec71dff1', hidden: true, class: 'hidden-select-list', "aria-hidden": toBoolAttr(true), multiple: true, required: this.required, name: this.name, disabled: this.disabled, ref: el => (this.selectRef = el), "aria-disabled": toBoolAttrIfDefined(this.disabled), "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid), "aria-describedby": this.wcagDescribedBy, "aria-labelledby": this.wcagLabelledBy, "aria-owns": this.wcagOwns }, hAsync("slot", { key: 'cc4d489c662d6515c2c5d6398bb34cc43871b426' }))), this.h.hasSlot('sufix') && hAsync("slot", { key: 'adabdc557faf6eab58d48e6ad40f6d01fb610132', name: "sufix" })), this.hideSelectedList === false ? (hAsync("ul", { role: "listbox", id: this.listId, class: FormMultiSelectClass.list }, Array.isArray(this.selectedOptionsState) && this.selectedOptionsState.map(selected => {
             var _a, _b;
             const option = this.getOption(selected);
             if (!option)
@@ -5382,12 +5349,12 @@ class GovFormMultiSelect {
     get host() { return getElement(this); }
     static get watchers() { return {
         "variant": ["validateVariant"],
-        "size": ["validateSize", "watchDisabled"],
+        "size": ["validateSize", "watchControlAttrs"],
         "options": ["watchOptions"],
         "value": ["watchValue"],
-        "disabled": ["watchDisabled"],
-        "invalid": ["watchDisabled"],
-        "success": ["watchDisabled"]
+        "disabled": ["watchControlAttrs"],
+        "invalid": ["watchControlAttrs"],
+        "success": ["watchControlAttrs"]
     }; }
     static get style() { return GovFormMultiSelectStyle0; }
     static get cmpMeta() { return {
@@ -5484,12 +5451,13 @@ class GovFormRadio {
     validateSize(newValue) {
         validateProp(FormRadioSizes, newValue, FormRadioClass.root);
     }
-    watchDisabled() {
+    watchControlAttrs() {
         this.passControlAttrs();
     }
     passControlAttrs() {
         this.f.passAttrToControl("size", this.size);
         this.f.passAttrToControl("invalid", toBoolAttr(this.invalid));
+        this.f.passAttrToControl("disabled", toBoolAttr(this.disabled));
         this.f.passAttrToControl("type", "radio");
     }
     componentWillLoad() {
@@ -5562,9 +5530,9 @@ class GovFormRadio {
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "size": ["validateSize", "watchDisabled"],
-        "disabled": ["watchDisabled"],
-        "invalid": ["watchDisabled"]
+        "size": ["validateSize", "watchControlAttrs"],
+        "disabled": ["watchControlAttrs"],
+        "invalid": ["watchControlAttrs"]
     }; }
     static get style() { return GovFormRadioStyle0; }
     static get cmpMeta() { return {
@@ -5731,7 +5699,7 @@ class GovFormSelect {
     watchOptions(newValue) {
         this.optionsState = propsValueToArray(newValue);
     }
-    watchDisabled() {
+    watchControlAttrs() {
         this.passControlAttrs();
     }
     watchValue() {
@@ -5740,7 +5708,8 @@ class GovFormSelect {
     passControlAttrs() {
         this.f.passAttrToControl('size', this.size);
         this.f.passAttrToControl('invalid', toBoolAttr(this.invalid));
-        this.f.passAttrToControl('type', 'select');
+        this.f.passAttrToControl('success', toBoolAttr(this.success));
+        this.f.passAttrToControl('disabled', toBoolAttr(this.disabled));
     }
     componentWillLoad() {
         this.validateVariant(this.variant);
@@ -5748,6 +5717,7 @@ class GovFormSelect {
         this.markSelectedValue();
         this.passControlAttrs();
         this.f.passAttrToLabel('required', String(this.required));
+        this.f.passAttrToControl('type', 'select');
         this.optionsState = propsValueToArray(this.options);
     }
     async componentDidRender() {
@@ -5768,10 +5738,10 @@ class GovFormSelect {
         });
     }
     render() {
-        return (hAsync(Host, { key: '5e9b2cdd4aae50ae5ee5ce8fe35db02888d682db', class: FormSelectClass.root, size: this.size, variant: this.variant }, this.h.hasSlot('prefix') && hAsync("slot", { key: '1eb66206a8dd47a44496c1566cd386b5183766ee', name: "prefix" }), hAsync("span", { key: 'df3d012666a80ca6e2ad96981f04f2adda0d8654', class: "element" }, hAsync("gov-icon", { key: 'e8ad512230dec7eb045e4dc91169b16709674f0b', slot: "right-icon", name: "chevron-down", class: "icon-arrow" }), this.h.hasSlot('right-icon') && !(this.success || this.invalid) && hAsync("slot", { key: 'f05864931816635b3dc3c4613680ba5c1dac0283', name: "right-icon" }), this.success && hAsync("gov-icon", { key: 'e5d8ad5dc8a6c5c14a1db233426ab2f56e4da6d3', slot: "right-icon", class: "icon-validation", name: "check-lg" }), this.invalid && hAsync("gov-icon", { key: 'c63c87a6cfc3eafdb979ebd40e019e3f65ecd35f', slot: "right-icon", class: "icon-validation", name: "exclamation-lg" }), hAsync("select", { key: 'b0d5876fb44872b8189870d7cf8ac374612153c7', id: this.identifier || this.selectId, onFocus: this.onFocusHandler.bind(this), onChange: this.onChangeHandler.bind(this), onBlur: this.onBlurHandler.bind(this), required: this.required, name: this.name, disabled: this.disabled, ref: el => (this.selectRef = el), "aria-disabled": toBoolAttrIfDefined(this.disabled), "aria-activedescendant": this.wcagActiveDescendant, "aria-controls": this.wcagControls, "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid), "aria-describedby": this.wcagDescribedBy, "aria-labelledby": this.wcagLabelledBy, "aria-owns": this.wcagOwns }, hAsync("slot", { key: '5edd39b36e1dc407a26c28e41eda625e9a780f3f' }), Array.isArray(this.optionsState) && this.optionsState.map((option) => {
+        return (hAsync(Host, { key: '0ef3419f4afce93b161ad8b71401a228ae8b9c4a', class: FormSelectClass.root, size: this.size, variant: this.variant }, this.h.hasSlot('prefix') && hAsync("slot", { key: '828f069b3672d5bb766a44ef37384b9117327eab', name: "prefix" }), hAsync("span", { key: '169ac6c9d58c88bbdcc96f36b8208ea05faa8e51', class: "element" }, hAsync("gov-icon", { key: 'a2501ad9ecc603d3e52fc0143fef2ee53ae63d4d', slot: "right-icon", name: "chevron-down", class: "icon-arrow" }), this.h.hasSlot('right-icon') && !(this.success || this.invalid) && hAsync("slot", { key: '97b2417a96a781620b67a557244c4c0cfa8b3669', name: "right-icon" }), this.success && hAsync("gov-icon", { key: 'cebe7eb826cb741bae4afdbd8d9b18948c410f8c', slot: "right-icon", class: "icon-validation", name: "check-lg" }), this.invalid && hAsync("gov-icon", { key: 'cef9b5715b1c134242f52439f65b88c7d228054f', slot: "right-icon", class: "icon-validation", name: "exclamation-lg" }), hAsync("select", { key: 'b8374d51d9a66f313db7f851446916e22debeee3', id: this.identifier || this.selectId, onFocus: this.onFocusHandler.bind(this), onChange: this.onChangeHandler.bind(this), onBlur: this.onBlurHandler.bind(this), required: this.required, name: this.name, disabled: this.disabled, ref: el => (this.selectRef = el), "aria-disabled": toBoolAttrIfDefined(this.disabled), "aria-activedescendant": this.wcagActiveDescendant, "aria-controls": this.wcagControls, "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid), "aria-describedby": this.wcagDescribedBy, "aria-labelledby": this.wcagLabelledBy, "aria-owns": this.wcagOwns }, hAsync("slot", { key: '5ad33b529b013a1e4846aaf3d6a778a0e7652f83' }), Array.isArray(this.optionsState) && this.optionsState.map((option) => {
             var _a;
             return (hAsync("option", { value: option.value, selected: option.value === this.value, disabled: option === null || option === void 0 ? void 0 : option.disabled }, (_a = option.label) !== null && _a !== void 0 ? _a : option.value));
-        }))), this.h.hasSlot('sufix') && hAsync("slot", { key: '9d2e12ec4dda23883e70b65773a7936cc231d03c', name: "sufix" })));
+        }))), this.h.hasSlot('sufix') && hAsync("slot", { key: '257ebbc1fbe845806360efbf491640c2c364d540', name: "sufix" })));
     }
     onFocusHandler(e) {
         this.focused = true;
@@ -5823,10 +5793,11 @@ class GovFormSelect {
     get host() { return getElement(this); }
     static get watchers() { return {
         "variant": ["validateVariant"],
-        "size": ["validateSize", "watchDisabled"],
+        "size": ["validateSize", "watchControlAttrs"],
         "options": ["watchOptions"],
-        "disabled": ["watchDisabled"],
-        "invalid": ["watchDisabled"],
+        "disabled": ["watchControlAttrs"],
+        "invalid": ["watchControlAttrs"],
+        "success": ["watchControlAttrs"],
         "value": ["watchValue"]
     }; }
     static get style() { return GovFormSelectStyle0; }
@@ -5895,7 +5866,7 @@ class GovFormSwitch {
     passControlAttrs() {
         this.f.passAttrToControl("size", this.size);
         this.f.passAttrToControl("invalid", toBoolAttr(this.invalid));
-        this.f.passAttrToControl("type", "switch");
+        this.f.passAttrToControl("disabled", toBoolAttr(this.disabled));
     }
     componentWillLoad() {
         this.passControlAttrs();
@@ -5903,6 +5874,7 @@ class GovFormSwitch {
     async componentDidRender() {
         this.f.passAttrToLabel("identifier", this.identifier || this.checkboxId);
         this.f.passAttrToLabel("required", String(this.required));
+        this.f.passAttrToControl("type", "switch");
         if (canValidateWcagOnRender()) {
             await delay(500);
             await this.validateWcag();
@@ -7933,7 +7905,7 @@ class GovTile {
         this.h = govHost(this.host);
     }
     render() {
-        return (hAsync(Host, { key: '94c2322c722ff5c79358c01eb303d66a22027fbf', class: this.h.classes(TileClass.root) }, this.h.hasSlot("icon") && (hAsync("span", { key: '844a8fdd671adb4bf5bcc4b89dcfe40a7e2e2c4c', class: TileClass.icon }, hAsync("slot", { key: '0039f4b07b8f373feeeb9e597f36b17576920602', name: "icon" }))), this.href ? (hAsync("a", { href: this.href, target: this.target, class: TileClass.link, ref: el => (this.triggerRef = el) }, this.h.hasSlot("title") && (hAsync("span", { class: TileClass.title }, hAsync("slot", { name: "title" }))))) : (this.h.hasSlot("title") && (hAsync("span", { class: TileClass.title }, hAsync("slot", { name: "title" })))), hAsync("div", { key: '6a49825e9ff9cd160d7142d4537fed7b6e6f8b7d', class: TileClass.content }, hAsync("slot", { key: '0dcf8ab4dbdaafd68bc0af6b9cb6928fc9029a6c' }))));
+        return (hAsync(Host, { key: '94c2322c722ff5c79358c01eb303d66a22027fbf', class: this.h.classes(TileClass.root) }, this.h.hasSlot("icon") && (hAsync("span", { key: '844a8fdd671adb4bf5bcc4b89dcfe40a7e2e2c4c', class: TileClass.icon }, hAsync("slot", { key: '0039f4b07b8f373feeeb9e597f36b17576920602', name: "icon" }))), this.href ? (hAsync("a", { href: this.href, target: this.target, class: TileClass.link, ref: el => (this.triggerRef = el) }, this.h.hasSlot("title") && (hAsync("span", { class: TileClass.title }, hAsync("slot", { name: "title" }), hAsync("gov-icon", { class: TileClass.arrow, name: "chevron-right" }))))) : (this.h.hasSlot("title") && (hAsync("span", { class: TileClass.title }, hAsync("slot", { name: "title" })))), hAsync("div", { key: '48844f936d995bab93594f87cd01f2a1da2fd37c', class: TileClass.content }, hAsync("slot", { key: '860a227cd05409613037658777a8e3edbfcc22d0' }))));
     }
     /**
      * Returns a clickable element instance