@gov-design-system-ce/components 4.1.1 → 4.1.3-BETA-1

package/dist/collection/components/gov-form/group/gov-form-group.css

@@ -10,20 +10,15 @@
 /* stylelint-enable order/order */
 /* stylelint-disable order/order */
 /* stylelint-enable order/order */
-/* Variables - breakpoints */ /* Variables - Colors */ /* Variables - Sizes */ /* Variables - General */
-:root {
-  --roboto: Roboto, sans-serif;
-}
-
-/* Variables - Typography */ /* Variables - Container */ /* Variables - Forms */ /* Variables - shadows */ /* Variables - z-index */ /* stylelint-disable order/order */
+/* Variables - breakpoints */ /* Variables - Colors */ /* Variables - Sizes */ /* Variables - General */ /* Variables - Typography */ /* Variables - Container */ /* Variables - Forms */ /* Variables - shadows */ /* Variables - z-index */ /* stylelint-disable order/order */
 /* stylelint-enable order/order */
 /* Form Control */
 gov-form-group, .gov-form-group,
 gov-form-radio-group, .gov-form-radio-group,
 gov-form-checkbox-group, .gov-form-checkbox-group {
   /* Variables - Form group */
-  margin-top: 0 !important;
-  margin-bottom: 0 !important;
+  margin-top: 0;
+  margin-bottom: 0;
   position: relative;
   display: flex;
   width: 100%;

package/dist/collection/components/gov-form/group/gov-form-group.js

@@ -23,7 +23,7 @@ export class GovFormGroup {
         this.validateOrientation(this.orientation);
     }
     render() {
-        return (h(Host, { key: 'a6b2a022f3c8573fb1bb7424d6a5ac2dc54b101b', gap: this.gap, class: this.h.classes(FormGroupClass.root) }, h("slot", { key: 'e1b5f38d87e9f46f555e2fc3d247a9c3c10b5872' })));
+        return (h(Host, { key: 'b7a379997ac1f4080471c42c23cad6f0ed055fd7', gap: this.gap, class: this.h.classes(FormGroupClass.root) }, h("slot", { key: 'a36809822e81913ec6c8cabdee9eaf64c9f9f471' })));
     }
     static get is() { return "gov-form-group"; }
     static get properties() {

package/dist/collection/components/gov-form/group/gov-form-radio-group.js

@@ -45,7 +45,7 @@ export class GovFormRadioGroup {
         });
     }
     render() {
-        return (h(Host, { key: '5a9b1bd507ef9c0a57cdb25fb200ab6c9fb46604', gap: this.gap, class: this.h.classes(FormGroupClass.root), value: this.value }, h("slot", { key: '34b587d61d716b51729431c52879b6fcd0285fee' })));
+        return (h(Host, { key: '0526062e74e480edc22bdbbdf8c1f82a91ff463d', gap: this.gap, class: this.h.classes(FormGroupClass.root), value: this.value }, h("slot", { key: 'f11696b75d4f0c4bc72da3ca70d3111825edd36a' })));
     }
     static get is() { return "gov-form-radio-group"; }
     static get originalStyleUrls() {

package/dist/collection/components/gov-form/input/gov-form-input.js

@@ -84,11 +84,11 @@ export class GovFormInput {
     }
     render() {
         const Tag = this.multiline ? Tags.TEXTAREA : Tags.INPUT;
-        return (h(Host, { key: '5210373fd88e2b80df5a4206c5b25b5695f2894b', class: FormInputClass.root, size: this.size, type: this.type }, this.h.hasSlot("prefix") && h("slot", { key: '9215c45132a4b9dc8fd0da79ef8d082dcce0789b', name: "prefix" }), h("span", { key: 'e58ab94aa7926dbd8488ce8323b6c8dbec9ce765', class: "element" }, (this.h.hasSlot("icon-start") && !this.multiline) &&
-            h("div", { key: '8e67ba10cfb47232f6c0d817df292668c2a4a7e8', class: FormInputClass.icons, onClick: () => this.inputRef.focus() }, h("slot", { key: 'a186f1fbe47936219f6a6a26cb2d0c2b0dbe08f8', name: "icon-start" })), h(Tag, Object.assign({ key: '1090f6e6705365ffc83b5397ad669638d996f5bd', type: this.inputType === 'password' && this.showPassword ? 'text' : 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, 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, value: this.value }, this.inheritedAttributes, { "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid), "aria-disabled": toBoolAttrIfDefined(this.disabled) })), ((this.success || this.invalid || this.h.hasSlot("icon-end") || this.inputType === 'password') && !this.multiline) &&
-            h("div", { key: '49cb072b3448735677c47883d851557f107dd6cb', class: FormInputClass.icons, onClick: () => this.inputRef.focus() }, this.success && !this.multiline &&
-                h("gov-icon", { key: 'f00df3e88ba3a0d695bf9f33ddb51af7a8fb4a96', class: "validation-icon", name: "check-lg", type: "components" }), this.invalid && !this.multiline &&
-                h("gov-icon", { key: '523966e75d3f3d49eff396226673c3c96cf6de60', class: "validation-icon", name: "exclamation-lg", type: "components" }), this.h.hasSlot("icon-end") && this.inputType !== 'password' && h("slot", { key: 'b707c094fe32bf5864c66e40a95a22f2b27d79b3', name: "icon-end" }), this.inputType === 'password' ? (h("gov-button", { color: 'primary', type: 'base', size: this.size, "aria-label": this.showPassword ? this.accessibleHidePasswordLabel : this.accessibleShowPasswordLabel, "on-gov-click": () => this.showPassword = !this.showPassword }, h("gov-icon", { slot: "icon-start", name: "eye", type: "components" }))) : null)), this.h.hasSlot("sufix") && h("slot", { key: '945df71d1a6c3edd76769ae3310bdd33df694d2b', name: "sufix" })));
+        return (h(Host, { key: '8b60864f0792fe1946d4b7cb6489cff0ffc767e1', class: FormInputClass.root, size: this.size, type: this.type }, this.h.hasSlot("prefix") && h("slot", { key: '4d5d0bb755acbb42033f572633e4969c8e6e8b36', name: "prefix" }), h("span", { key: 'eaac4a690052077ca631ae1e9c69a65518a1902f', class: "element" }, (this.h.hasSlot("icon-start") && !this.multiline) &&
+            h("div", { key: 'e8be567c923c023bce7d0ebf0cccff592ac15c5a', class: FormInputClass.icons, onClick: () => this.inputRef.focus() }, h("slot", { key: '4c76013e8a7db99b43e7b8f426f3907d89708b5a', name: "icon-start" })), h(Tag, Object.assign({ key: '22e1714e66085290e7fe984a4672512324143397', type: this.inputType === 'password' && this.showPassword ? 'text' : 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, 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, value: this.value }, this.inheritedAttributes, { "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid), "aria-disabled": toBoolAttrIfDefined(this.disabled) })), ((this.success || this.invalid || this.h.hasSlot("icon-end") || this.inputType === 'password') && !this.multiline) &&
+            h("div", { key: '19ab7fe83fcecde7a506f21611fae64126464b88', class: FormInputClass.icons, onClick: () => this.inputRef.focus() }, this.success && !this.multiline &&
+                h("gov-icon", { key: '9dd7b8413b351d957a63f7df09aee8b6e3e0ac53', class: "validation-icon", name: "check-lg", type: "components" }), this.invalid && !this.multiline &&
+                h("gov-icon", { key: '06540c7f7cf3c0fbdab8b5a63aba35cf7a78df3a', class: "validation-icon", name: "exclamation-lg", type: "components" }), this.h.hasSlot("icon-end") && this.inputType !== 'password' && h("slot", { key: '8cb1103f101fa9bd5719f1657ae1a404fc3882f4', name: "icon-end" }), this.inputType === 'password' ? (h("gov-button", { color: 'primary', type: 'base', size: this.size, "aria-label": this.showPassword ? this.accessibleHidePasswordLabel : this.accessibleShowPasswordLabel, "on-gov-click": () => this.showPassword = !this.showPassword }, h("gov-icon", { slot: "icon-start", name: "eye", type: "components" }))) : null)), this.h.hasSlot("sufix") && h("slot", { key: '78308cfef71f34839d86af88df5dadb28c01adf1', name: "sufix" })));
     }
     onFocusHandler(e) {
         e.stopPropagation();

package/dist/collection/components/gov-form/label/gov-form-label.js

@@ -9,7 +9,7 @@ export class GovFormLabel {
     }
     render() {
         const Tag = this.legend ? 'legend' : 'label';
-        return (h(Host, { key: '3e02eaa899126807c31fac8d3b6f352a07a73a9d', class: FormLabelClass.root, size: this.size }, h(Tag, { key: 'a1213cf879e26565c4c84d31ab6a46dac2a9ee4e', class: FormLabelClass.label, htmlFor: this.identifier, onClick: () => this.govClick.emit() }, h("slot", { key: '46a6a39821d6f3f786b843c037b0b423ba2445ae' }), this.required ? h("span", { class: "gov-color--error-500" }, "\u00A0*") : null)));
+        return (h(Host, { key: '3f52c93a7721a458d430874b447421f7a5d30a41', class: FormLabelClass.root, size: this.size }, h(Tag, { key: 'c122a9bce9b9a98b0c8c336190b70bc4bf5389cf', class: FormLabelClass.label, htmlFor: this.identifier, onClick: () => this.govClick.emit() }, h("slot", { key: 'de892d47334dbd3448a33d18586c77248b08b036' }), this.required ? h("span", { class: "gov-color--error-500" }, "\u00A0*") : null)));
     }
     static get is() { return "gov-form-label"; }
     static get properties() {

package/dist/collection/components/gov-form/message/gov-form-message.js

@@ -17,7 +17,7 @@ export class GovFormMessage {
         this.validateColor(this.color);
     }
     render() {
-        return (h(Host, { key: '0fc757895a58267edf28d9139e460a14e664de04', class: this.h.classes(FormMessageClass.root), color: this.color, size: this.size }, this.h.hasSlot('icon') && (h("slot", { key: 'bca8235bbaebcd7066efb8e8e3fdbff7ba8e011c', name: "icon" })), h("span", { key: 'a0e46336d6a661bf6d6f2ee8f0cb89c967f5321d', id: this.messageId, class: FormMessageClass.content }, h("slot", { key: '2e0e474f9f9d35fc5cda1db690d2b7b4e2addb68' }))));
+        return (h(Host, { key: '86a59a0001123abc4ff9350657f71e4e4ac1b0c5', class: this.h.classes(FormMessageClass.root), color: this.color, size: this.size }, this.h.hasSlot('icon') && (h("slot", { key: '94f919d5d79ab453be3cccab92e695c9a9a79276', name: "icon" })), h("span", { key: 'e112ca627b1d4deef23eb1567bcbb014a82388d9', id: this.messageId, class: FormMessageClass.content }, h("slot", { key: '1733f5e338c14f5d353a77266359033b42469eff' }))));
     }
     /**
      * Returns unique identifier of message

package/dist/collection/components/gov-form/multiselect/gov-form-multi-select.js

@@ -165,11 +165,11 @@ export class GovFormMultiSelect {
         });
     }
     render() {
-        return (h(Host, { key: '11352c6950674badb00870e18c17a031c81235df', class: FormMultiSelectClass.root, size: this.size }, h("div", { key: 'edd74cbfbbf116700dfdcd7d33307c6416e2ad8c', class: FormMultiSelectClass.wrap }, this.h.hasSlot('prefix') && h("slot", { key: '6aa65aa9875527890bfecb2a1e6c56b2eb9ce827', name: "prefix" }), h("gov-form-autocomplete", { key: '60c5065ccb09073c2e1ca17c329f980cda52761f', value: this.valueState, disabled: this.disabled, identifier: this.identifier || this.selectId, required: false, invalid: this.invalid, success: this.success, size: this.size, placeholder: this.placeholder, "message-empty": this.messageEmpty, "message-loading": this.messageLoading, ref: el => (this.autocompleteRef = el), minlength: 0, "aria-owns": this.listId }, this.success && h("gov-icon", { key: '907aac2768a9bd5384326377fcad9e90795ff170', slot: "validation-icon", class: "validation-icon", name: "check-lg", type: "components" }), this.invalid && h("gov-icon", { key: '7294050c2910097d6a316b37fdc1f571f3450f8a', slot: "validation-icon", class: "validation-icon", name: "exclamation-lg", type: "components" }), h("gov-icon", { key: 'ac4474f517f8124831c22055e69d0eb45e6e2d4f', slot: "icon-end", class: "arrow-icon", name: "chevron-down", type: "components" })), h("select", Object.assign({ key: '9437199c079132409bdbf0f932605474b885781e', 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) }, this.inheritedAttributes, { "aria-disabled": toBoolAttrIfDefined(this.disabled), "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid) }), h("slot", { key: '59f4071b90b40ed6291b9180b5caa29101b5e95a' }), Array.isArray(this.optionsState) && this.optionsState.map((option) => {
+        return (h(Host, { key: 'e112f9d20d170e70616fd4f089b93dd040e737fa', class: FormMultiSelectClass.root, size: this.size }, h("div", { key: 'ffc5af48051e7d24559e0c77a595b48e287771f5', class: FormMultiSelectClass.wrap }, this.h.hasSlot('prefix') && h("slot", { key: '3c22442cfbcb010f240a014ba7c9c48ec4522555', name: "prefix" }), h("gov-form-autocomplete", { key: 'c02857a7ea06c203aa94b317837ea2c7c921b505', value: this.valueState, disabled: this.disabled, identifier: this.identifier || this.selectId, required: false, invalid: this.invalid, success: this.success, size: this.size, placeholder: this.placeholder, "message-empty": this.messageEmpty, "message-loading": this.messageLoading, ref: el => (this.autocompleteRef = el), minlength: 0, "aria-owns": this.listId }, this.success && h("gov-icon", { key: '2b06057b6343fce21d08731f5a6675ffccfa3f6e', slot: "validation-icon", class: "validation-icon", name: "check-lg", type: "components" }), this.invalid && h("gov-icon", { key: '6f33cb3764c0df058b0743ba617c950cf7909cdc', slot: "validation-icon", class: "validation-icon", name: "exclamation-lg", type: "components" }), h("gov-icon", { key: '05be66ee199dee177d0b18a7a6a59e25a724571f', slot: "icon-end", class: "arrow-icon", name: "chevron-down", type: "components" })), h("select", Object.assign({ key: 'd50fe47c2c859561b8aba62e6d6dedd7bceed6ae', 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) }, this.inheritedAttributes, { "aria-disabled": toBoolAttrIfDefined(this.disabled), "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid) }), h("slot", { key: 'cf2ebfd8dc2cdf49c3581ba0ba3fff959a50a221' }), Array.isArray(this.optionsState) && this.optionsState.map((option) => {
             var _a;
             const selectedOption = this.selectedValueIndex(option.value);
             return (h("option", { value: option.value, selected: selectedOption > -1, disabled: option === null || option === void 0 ? void 0 : option.disabled }, (_a = option.label) !== null && _a !== void 0 ? _a : option.value));
-        })), this.h.hasSlot('sufix') && h("slot", { key: '0620c4ab3b9d9d122456f91cc3dd5cefd85e8bba', name: "sufix" })), this.hideSelectedList === false ? (h("ul", { role: "listbox", id: this.listId, class: FormMultiSelectClass.list }, Array.isArray(this.selectedOptionsState) && this.selectedOptionsState.map(selected => {
+        })), this.h.hasSlot('sufix') && h("slot", { key: 'dddc8a99daeb345be9d778ade22622ae9ed35769', name: "sufix" })), this.hideSelectedList === false ? (h("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)

package/dist/collection/components/gov-form/password-power/gov-form-password-power.js

@@ -5,7 +5,7 @@ export class GovFormPasswordPower {
         this.power = undefined;
     }
     render() {
-        return (h(Host, { key: '9125566cb99bfc49e2e61edb5af71b5b052d6790', class: FormPasswordPowerClass.root }, h("span", { key: 'b293292f3b8faca38bbbd6cb03fdd49d8601aab3', class: FormPasswordPowerClass.bar }, h("span", { key: '20995fbc87342a8e0db8031b0ff23a9cb01b4068' }), h("span", { key: '4fec375a3f27cc35025c165badbff731c8fb26ab' }), h("span", { key: '426f641b8b8e179e25e8a1006a0afd0394615058' })), h("span", { key: '7aeaf7222b484ad59084bb20fcbff4660cdcb1db', class: FormPasswordPowerClass.text }, h("slot", { key: '57c3415c9b2dfc688ec5762c33cdad473b8110bd' }))));
+        return (h(Host, { key: 'ca17606a7f29175d97da93daed3005a27b38d607', class: FormPasswordPowerClass.root }, h("span", { key: 'b2b80382c10034b88adb971db02c7e3f901453ee', class: FormPasswordPowerClass.bar }, h("span", { key: '0c0de35b5c257c175281792765d3fec89f5ee498' }), h("span", { key: '92847bc51174d38543a2e0f9a1a7c3ba37fec6f4' }), h("span", { key: '7cc7a9cbda4c54c4d1269874a1f8d2b91e533bad' })), h("span", { key: 'de62cf845c51d870e4fa1b1b6156348be8460d6b', class: FormPasswordPowerClass.text }, h("slot", { key: '8132df44d6ce3f83f89d1d45b34c182850663571' }))));
     }
     static get is() { return "gov-form-password-power"; }
     static get properties() {

package/dist/collection/components/gov-form/search/gov-form-search.js

@@ -6,7 +6,7 @@ export class GovFormSearch {
         this.color = 'neutral';
     }
     render() {
-        return (h(Host, { key: '9d628d34bd6f19132ea398437faf9023a322bdcf', class: FormSearchClass.root, color: this.color, size: this.size }, h("slot", { key: 'aa70625f5e6b754a18b36ad87634fe5be1a34fb7', name: "input" }), h("slot", { key: 'd098e011406c85877131ee57c04bc9a3f05ded18', name: "button-erase" }), h("slot", { key: '6a5226ae29cf22f4ec33ecf5604db44d8154d2fa', name: "button" })));
+        return (h(Host, { key: '05f033c30dffd615b36b181535329704d46665ae', class: FormSearchClass.root, color: this.color, size: this.size }, h("slot", { key: '7c7fb4e2d90ace38aef4b63454e1f9513903977c', name: "input" }), h("slot", { key: '92484cbbbae29ba45bb963f80da8237d9406a91b', name: "button-erase" }), h("slot", { key: '92ebb818ee922d790534ffb7816be400ff4a1f98', name: "button" })));
     }
     static get is() { return "gov-form-search"; }
     static get properties() {

package/dist/collection/components/gov-form/select/gov-form-select.js

@@ -81,10 +81,10 @@ export class GovFormSelect {
         });
     }
     render() {
-        return (h(Host, { key: 'b403868aaf854a9dc40f68cf093a8867cd20c4c4', class: FormSelectClass.root, size: this.size }, this.h.hasSlot('prefix') && h("slot", { key: 'de3d0cb80bd3b33a9b23b60f91739f0e23fdab4a', name: "prefix" }), h("span", { key: 'c501806b949bc6e1314922fce0ce088180fdebba', class: "element" }, h("select", Object.assign({ key: '7c1a04a65e69edda672d70b101b430d3c6105543', 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) }, this.inheritedAttributes, { "aria-disabled": toBoolAttrIfDefined(this.disabled), "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid) }), h("slot", { key: '0bd46e42f5e5267366088b9902a5ef8c6aa99064' }), Array.isArray(this.optionsState) && this.optionsState.map((option) => {
+        return (h(Host, { key: '1c2fb05a5cff0e1b1208130cc11568423f5a78a0', class: FormSelectClass.root, size: this.size }, this.h.hasSlot('prefix') && h("slot", { key: '3dadb5773f1a2abe0c54f6ee45bb3a404fc99a5b', name: "prefix" }), h("span", { key: '82bc3345147debd858c5f0eb4dd9c58faf168d5d', class: "element" }, h("select", Object.assign({ key: 'ee77d1768a549faa0e94025eb5b08390c49d2d32', 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) }, this.inheritedAttributes, { "aria-disabled": toBoolAttrIfDefined(this.disabled), "aria-required": toBoolAttrIfDefined(this.required), "aria-invalid": toBoolAttrIfDefined(this.invalid) }), h("slot", { key: '2c6e5a91381a7a9819b92aa7844a8d512aed9577' }), Array.isArray(this.optionsState) && this.optionsState.map((option) => {
             var _a;
             return (h("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.success && h("gov-icon", { key: '8e919bd8dd122618b2b0233c7b14c8def277540f', class: "validation-icon", name: "check-lg", type: "components" }), this.invalid && h("gov-icon", { key: '78610616be9cdf65e9bbc1359e27bc9003c8fc34', class: "validation-icon", name: "exclamation-lg", type: "components" }), h("gov-icon", { key: '56c1ca03e5b23154a93056bba8758553a5c93f30', class: "arrow-icon", name: "chevron-down", type: "components" })), this.h.hasSlot('sufix') && h("slot", { key: 'f3e3f1416d15a34402d446e6a72d0607cc8d90fc', name: "sufix" })));
+        })), this.success && h("gov-icon", { key: 'b08abba818740a7250956bf03962fb86eade55c2', class: "validation-icon", name: "check-lg", type: "components" }), this.invalid && h("gov-icon", { key: '5b9c0a3e7f7b6b678880b2e17e43ae702fff023b', class: "validation-icon", name: "exclamation-lg", type: "components" }), h("gov-icon", { key: '8b9afa5ebf08b1dd680aac751f8a0559b83132fc', class: "arrow-icon", name: "chevron-down", type: "components" })), this.h.hasSlot('sufix') && h("slot", { key: '9178ca16301992f32c30f3609a388a2251d3bf85', name: "sufix" })));
     }
     onFocusHandler(e) {
         this.focused = true;

package/dist/collection/components/gov-grid/gov-grid-item.js

@@ -11,7 +11,7 @@ export class GovGridItem {
         this.h = govHost(this.host);
     }
     render() {
-        return (h(Host, { key: 'd830b7cb16e1ad4a07b5b5348c05434eb31a1f9e', class: this.h.classes(GridItemClass.root), role: "listitem", size: this.size, "size-sm": this.sizeSm, "size-md": this.sizeMd, "size-lg": this.sizeLg, "size-xl": this.sizeXl }, h("slot", { key: '235bd47e47d94457cdbbf1d4530cf2e0bcddc4a3' })));
+        return (h(Host, { key: 'e1dc6e3517618361ab3b5e3ad499a5bbbaae3d6a', class: this.h.classes(GridItemClass.root), role: "listitem", size: this.size, "size-sm": this.sizeSm, "size-md": this.sizeMd, "size-lg": this.sizeLg, "size-xl": this.sizeXl }, h("slot", { key: '53780db95fa728f252302cb86923ad9e9fcd9b66' })));
     }
     static get is() { return "gov-grid-item"; }
     static get properties() {

package/dist/collection/components/gov-grid/gov-grid.js

@@ -9,7 +9,7 @@ export class GovGrid {
     }
     // vertical / horizontal align
     render() {
-        return (h(Host, { key: '81e96a065c6472ae76e4768cf2b8373b94f0d0a4', class: this.h.classes(GridClass.root), "align-x": this.alignX, "align-y": this.alignY, role: "list" }, h("slot", { key: 'c3965bafe6a5870352a7cded3fc96adfbeb41724' })));
+        return (h(Host, { key: 'd2f4e42a186e0d8020abc96ef3ca0956e1492d05', class: this.h.classes(GridClass.root), "align-x": this.alignX, "align-y": this.alignY, role: "list" }, h("slot", { key: '46c60ccdda81ce271aeaca46bead1bf33e22c041' })));
     }
     static get is() { return "gov-grid"; }
     static get properties() {

package/dist/collection/components/gov-icon/gov-icon.js

@@ -24,12 +24,17 @@ export class GovIcon {
     }
     async loadIconPathData() {
         const { name, visible } = this;
+        console.log('name, visible', name, visible);
+        console.log('Build.isBrowser', Build.isBrowser);
         if (!Build.isBrowser || !name || !visible) {
+            console.log('return');
             return;
         }
         await this.loadIcon();
     }
     connectedCallback() {
+        console.log('connectedCallback icon', this.name);
+        console.log('iconsLazyLoad()', iconsLazyLoad());
         if (iconsLazyLoad()) {
             this.visible = true;
             this.loadIconPathData().finally();
@@ -42,12 +47,14 @@ export class GovIcon {
         }
     }
     disconnectedCallback() {
+        console.log('disconnectedCallback');
         if (this.intersectionObserver) {
             this.intersectionObserver.disconnect();
             this.intersectionObserver = null;
         }
     }
     async componentWillLoad() {
+        console.log('componentWillLoad');
         this.validateSize(this.size);
         this.validateColor(this.color);
         await this.loadIconPathData();
@@ -73,6 +80,7 @@ export class GovIcon {
     async loadIcon() {
         try {
             const { name, type } = this;
+            console.log('loadIcon -> name, type', name, type);
             const data = await fetchIcon({ name, type });
             const isValid = isValidSVG(data);
             this.host.innerHTML = isValid ? data : null;

package/dist/collection/components/gov-icon/gov-icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"gov-icon.js","sourceRoot":"","sources":["../../../../../../src/components/gov-icon/gov-icon.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Build, Component, Element, h, Host, Prop, State, Watch} from \"@stencil/core\"\nimport {IconClass, IconColors, type IconColorType, IconSizesType} from \"./constants\"\nimport {fetchIcon} from \"../../utils/icon.utils\"\nimport {govHost} from \"../../helpers/Dom/template\"\nimport {GovHost} from \"../../helpers/Dom/template.types\"\nimport {iconsLazyLoad} from \"../../helpers/Dom/win\"\nimport {validateProp} from \"../../helpers/Validate/props\";\nimport {Sizes} from \"../../core/constants/sizes\";\nimport {isValidSVG} from \"../../helpers/Dom/document\";\n\n@Component({\n\tassetsDirs: [\"assets\"],\n\ttag: \"gov-icon\",\n})\nexport class GovIcon {\n\tprivate h: GovHost\n\tprivate intersectionObserver: IntersectionObserver\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovIconElement\n\t/**\n\t * Icon size\n\t */\n\t@Prop({reflect: true}) readonly size?: IconSizesType\n\t/**\n\t * Icon color\n\t */\n\t@Prop({reflect: true}) readonly color?: IconColorType\n\t/**\n\t * Name of icon in folder\n\t */\n\t@Prop({reflect: true}) name: string = null\n\t/**\n\t * Type (folder) of icon\n\t */\n\t@Prop({reflect: true}) type = \"components\"\n\n\t@State() private visible = false\n\t@State() private error = false\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(Sizes, newValue, IconClass.root)\n\t}\n\n\t@Watch(\"color\")\n\tvalidateColor(newValue: string): void {\n\t\tvalidateProp(IconColors, newValue, IconClass.root)\n\t}\n\n\t@Watch(\"name\")\n\tprivate async loadIconPathData(): Promise<void> {\n\t\tconst {name, visible} = this\n\t\tif (!Build.isBrowser || !name || !visible) {\n\t\t\treturn\n\t\t}\n\t\tawait this.loadIcon()\n\t}\n\n\tconnectedCallback(): void {\n\t\tif (iconsLazyLoad()) {\n\t\t\tthis.visible = true\n\t\t\tthis.loadIconPathData().finally()\n\t\t} else {\n\t\t\tthis.waitUntilVisible(async () => {\n\t\t\t\tthis.visible = true\n\t\t\t\tawait this.loadIconPathData()\n\t\t\t})\n\t\t}\n\t}\n\n\tdisconnectedCallback(): void {\n\t\tif (this.intersectionObserver) {\n\t\t\tthis.intersectionObserver.disconnect()\n\t\t\tthis.intersectionObserver = null\n\t\t}\n\t}\n\n\tasync componentWillLoad(): Promise<void> {\n\t\tthis.validateSize(this.size)\n\t\tthis.validateColor(this.color)\n\t\tawait this.loadIconPathData()\n\t}\n\n\tprivate waitUntilVisible(callback: () => void): void {\n\t\tif (!Build.isBrowser || typeof window === \"undefined\" || !(window as any).IntersectionObserver) {\n\t\t\tcallback()\n\t\t\treturn\n\t\t}\n\t\tthis.intersectionObserver = new IntersectionObserver(\n\t\t\tentries => {\n\t\t\t\tentries.forEach(entry => {\n\t\t\t\t\tif (entry.isIntersecting) {\n\t\t\t\t\t\tif (this.intersectionObserver) {\n\t\t\t\t\t\t\tthis.intersectionObserver.disconnect()\n\t\t\t\t\t\t\tthis.intersectionObserver = null\n\t\t\t\t\t\t}\n\t\t\t\t\t\tcallback()\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t},\n\t\t\t{rootMargin: \"50px\"},\n\t\t)\n\t\tthis.intersectionObserver.observe(this.host)\n\t}\n\n\tprivate async loadIcon() {\n\t\ttry {\n\t\t\tconst {name, type} = this\n\t\t\tconst data = await fetchIcon({name, type})\n\t\t\tconst isValid = isValidSVG(data)\n\t\t\tthis.host.innerHTML = isValid ? data : null;\n\t\t} catch (e) {\n\t\t\tthis.host.innerHTML = ''\n\t\t\tthis.error = true\n\t\t}\n\t}\n\n\trender() {\n\t\tif (this.error) {\n\t\t\treturn null\n\t\t}\n\t\treturn (\n\t\t\t<Host class={this.h.classes(IconClass.root)} size={this.size} color={this.color}/>\n\t\t)\n\t}\n}\n"]}
+{"version":3,"file":"gov-icon.js","sourceRoot":"","sources":["../../../../../../src/components/gov-icon/gov-icon.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Build, Component, Element, h, Host, Prop, State, Watch} from \"@stencil/core\"\nimport {IconClass, IconColors, type IconColorType, IconSizesType} from \"./constants\"\nimport {fetchIcon} from \"../../utils/icon.utils\"\nimport {govHost} from \"../../helpers/Dom/template\"\nimport {GovHost} from \"../../helpers/Dom/template.types\"\nimport {iconsLazyLoad} from \"../../helpers/Dom/win\"\nimport {validateProp} from \"../../helpers/Validate/props\";\nimport {Sizes} from \"../../core/constants/sizes\";\nimport {isValidSVG} from \"../../helpers/Dom/document\";\n\n@Component({\n\tassetsDirs: [\"assets\"],\n\ttag: \"gov-icon\",\n})\nexport class GovIcon {\n\tprivate h: GovHost\n\tprivate intersectionObserver: IntersectionObserver\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovIconElement\n\t/**\n\t * Icon size\n\t */\n\t@Prop({reflect: true}) readonly size?: IconSizesType\n\t/**\n\t * Icon color\n\t */\n\t@Prop({reflect: true}) readonly color?: IconColorType\n\t/**\n\t * Name of icon in folder\n\t */\n\t@Prop({reflect: true}) name: string = null\n\t/**\n\t * Type (folder) of icon\n\t */\n\t@Prop({reflect: true}) type = \"components\"\n\n\t@State() private visible = false\n\t@State() private error = false\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(Sizes, newValue, IconClass.root)\n\t}\n\n\t@Watch(\"color\")\n\tvalidateColor(newValue: string): void {\n\t\tvalidateProp(IconColors, newValue, IconClass.root)\n\t}\n\n\t@Watch(\"name\")\n\tprivate async loadIconPathData(): Promise<void> {\n\t\tconst {name, visible} = this\n\t\tconsole.log('name, visible', name, visible);\n\t\tconsole.log('Build.isBrowser', Build.isBrowser);\n\t\tif (!Build.isBrowser || !name || !visible) {\n\t\t\tconsole.log('return');\n\t\t\treturn\n\t\t}\n\t\tawait this.loadIcon()\n\t}\n\n\tconnectedCallback(): void {\n\t\tconsole.log('connectedCallback icon', this.name);\n\t\tconsole.log('iconsLazyLoad()', iconsLazyLoad());\n\t\tif (iconsLazyLoad()) {\n\t\t\tthis.visible = true\n\t\t\tthis.loadIconPathData().finally()\n\t\t} else {\n\t\t\tthis.waitUntilVisible(async () => {\n\t\t\t\tthis.visible = true\n\t\t\t\tawait this.loadIconPathData()\n\t\t\t})\n\t\t}\n\t}\n\n\tdisconnectedCallback(): void {\n\t\tconsole.log('disconnectedCallback');\n\t\tif (this.intersectionObserver) {\n\t\t\tthis.intersectionObserver.disconnect()\n\t\t\tthis.intersectionObserver = null\n\t\t}\n\t}\n\n\tasync componentWillLoad(): Promise<void> {\n\t\tconsole.log('componentWillLoad');\n\t\tthis.validateSize(this.size)\n\t\tthis.validateColor(this.color)\n\t\tawait this.loadIconPathData()\n\t}\n\n\tprivate waitUntilVisible(callback: () => void): void {\n\t\tif (!Build.isBrowser || typeof window === \"undefined\" || !(window as any).IntersectionObserver) {\n\t\t\tcallback()\n\t\t\treturn\n\t\t}\n\t\tthis.intersectionObserver = new IntersectionObserver(\n\t\t\tentries => {\n\t\t\t\tentries.forEach(entry => {\n\t\t\t\t\tif (entry.isIntersecting) {\n\t\t\t\t\t\tif (this.intersectionObserver) {\n\t\t\t\t\t\t\tthis.intersectionObserver.disconnect()\n\t\t\t\t\t\t\tthis.intersectionObserver = null\n\t\t\t\t\t\t}\n\t\t\t\t\t\tcallback()\n\t\t\t\t\t}\n\t\t\t\t})\n\t\t\t},\n\t\t\t{rootMargin: \"50px\"},\n\t\t)\n\t\tthis.intersectionObserver.observe(this.host)\n\t}\n\n\tprivate async loadIcon() {\n\t\ttry {\n\t\t\tconst {name, type} = this\n\t\t\tconsole.log('loadIcon -> name, type', name, type);\n\t\t\tconst data = await fetchIcon({name, type})\n\t\t\tconst isValid = isValidSVG(data)\n\t\t\tthis.host.innerHTML = isValid ? data : null;\n\t\t} catch (e) {\n\t\t\tthis.host.innerHTML = ''\n\t\t\tthis.error = true\n\t\t}\n\t}\n\n\trender() {\n\t\tif (this.error) {\n\t\t\treturn null\n\t\t}\n\t\treturn (\n\t\t\t<Host class={this.h.classes(IconClass.root)} size={this.size} color={this.color}/>\n\t\t)\n\t}\n}\n"]}

package/dist/collection/components/gov-infobar/gov-infobar.js

@@ -39,8 +39,8 @@ export class GovInfobar {
         this.inheritedAttributes = Object.assign(Object.assign({}, this.inheritedAttributes), { [attributeName]: newValue });
     }
     render() {
-        const closeButton = (h("gov-button", { key: '4569d98296984f33ff83947f92a95a0a3bf0d3e3', size: "s", "aria-label": this.accessibleCloseLabel, type: "base", color: this.isBold ? this.color : "neutral", "on-gov-click": this.onCloseHandler.bind(this), class: InfobarClass.close }, h("gov-icon", { key: 'aafcdbde7ca0e13d9e733036da6cc6085143966d', name: "x-lg", type: "components" })));
-        return (h(Host, { key: '9b558a0c786862d032ed6fb5d274fc0c3cdae617', class: this.h.classes(InfobarClass.root), color: this.color, type: this.type }, h("section", Object.assign({ key: '9bded4750afdfef6ace0e5a39be2d6283b30d725', class: InfobarClass.section }, this.inheritedAttributes, { role: this.role }), h("slot", { key: '011f9d52f9f971a560fd0220be40b5a221a5f4b3', name: "icon" }), h("div", { key: 'd613d4ab22f89da935fe60b866ea262802c5d18f', class: InfobarClass.content }, this.h.hasSlot('headline') ? (h(Fragment, null, h("div", { class: InfobarClass.headline }, h("slot", { name: "headline" }), h("gov-button", { size: "s", type: "base", color: this.isBold ? this.color : "neutral", "aria-label": this.accessibleToggleLabel, "on-gov-click": () => (this.toggleContent = !this.toggleContent) }, h("gov-icon", { name: this.toggleContent ? 'chevron-up' : 'chevron-down', type: "components" }))), h("div", { hidden: !this.toggleContent, "aria-hidden": toBoolAttr(this.toggleContent) }, h("slot", null)))) : (h("slot", null))), this.closable && closeButton)));
+        const closeButton = (h("gov-button", { key: '2d0597a56f6edb97e7feff654ba98885fa48033a', size: "s", "aria-label": this.accessibleCloseLabel, type: "base", color: this.isBold ? this.color : "neutral", "on-gov-click": this.onCloseHandler.bind(this), class: InfobarClass.close }, h("gov-icon", { key: 'c17ba542b02a4910a136eec6cb4556d1857dffb2', name: "x-lg", type: "components" })));
+        return (h(Host, { key: 'd71d1b8ffe158de90f3fb520bd996a8246988d3d', class: this.h.classes(InfobarClass.root), color: this.color, type: this.type }, h("section", Object.assign({ key: '12cce82faa13fa39135fe92b0ab61bc2b01fa083', class: InfobarClass.section }, this.inheritedAttributes, { role: this.role }), h("slot", { key: 'bc48d4e5dfad03cd9c54054225a4c3db0ec09cd9', name: "icon" }), h("div", { key: '70422e59cb69504d1aca5d45b9f9700b35b344f0', class: InfobarClass.content }, this.h.hasSlot('headline') ? (h(Fragment, null, h("div", { class: InfobarClass.headline }, h("slot", { name: "headline" }), h("gov-button", { size: "s", type: "base", color: this.isBold ? this.color : "neutral", "aria-label": this.accessibleToggleLabel, "on-gov-click": () => (this.toggleContent = !this.toggleContent) }, h("gov-icon", { name: this.toggleContent ? 'chevron-up' : 'chevron-down', type: "components" }))), h("div", { hidden: !this.toggleContent, "aria-hidden": toBoolAttr(this.toggleContent) }, h("slot", null)))) : (h("slot", null))), this.closable && closeButton)));
     }
     onCloseHandler(e) {
         this.govClose.emit({

package/dist/collection/components/gov-layout/gov-layout-column.js

@@ -6,7 +6,7 @@ export class GovLayoutColumn {
         this.h = govHost(this.host);
     }
     render() {
-        return (h(Host, { key: '8566cc892984b1ce728c679107e228d8320f3048', class: this.h.classes(LayoutColumnClass.root) }, h("slot", { key: 'e3a085ef568fa75ef813b775344adbd6f4ef2773' })));
+        return (h(Host, { key: 'ebef4ca76b1308a566c862b5a49eecf1eb3fce99', class: this.h.classes(LayoutColumnClass.root) }, h("slot", { key: 'aaeefeb1a56b294d91b1327fd52eb16486cfb918' })));
     }
     static get is() { return "gov-layout-column"; }
     static get elementRef() { return "host"; }

package/dist/collection/components/gov-layout/gov-layout.js

@@ -15,7 +15,7 @@ export class GovLayout {
         return originalClass + ' ' + originalClass + isType + isVariant + isInverse;
     }
     render() {
-        return (h(Host, { key: 'ba8fc53df2f13fcf8b87f25f073d0284b68b0a3a', type: this.type, class: this.h.classes(LayoutClass.root) }, h("section", { key: 'f645a9b32495c4fc1c0c86a0078c78c4bc00a1e8', class: this.typeClass(LayoutClass.section, this.type, this.variant, this.inverse) }, h("slot", { key: '5b0d1a3a137a8fe3bb90ae5dff2dbc179575af56' }))));
+        return (h(Host, { key: 'c35fc39e07229363bdf36be5856165e7e8eb7985', type: this.type, class: this.h.classes(LayoutClass.root) }, h("section", { key: 'dc50cf9cba8bd4e879291fddfbd41955f2d10330', class: this.typeClass(LayoutClass.section, this.type, this.variant, this.inverse) }, h("slot", { key: '017a329c119529d3893e187b6a8bbccfbbc76679' }))));
     }
     static get is() { return "gov-layout"; }
     static get properties() {

package/dist/collection/components/gov-lifecycle-tester/gov-lifecycle-tester.js

@@ -32,7 +32,7 @@ export class GovLifecycle {
         console.log('componentDidUpdate', this.uniqueId);
     }
     render() {
-        return (h(Host, { key: '7bd4b9b30b6fe4e1732232fa4e70d66756c2139d', identifier: this.uniqueId }, h("span", { key: '70d6b8d178133ee89b795c4018687c7afb2576f0' }, "lifecycle ", this.uniqueId)));
+        return (h(Host, { key: '506eabaae01ae888fa838c10572e55bbe6fb7015', identifier: this.uniqueId }, h("span", { key: '7604a29214fdffb1a470d83d7db37a583e5072ed' }, "lifecycle ", this.uniqueId)));
     }
     static get is() { return "gov-lifecycle"; }
 }

package/dist/collection/components/gov-link/gov-link.js

@@ -24,7 +24,7 @@ export class GovLink {
         this.inheritedAttributes = Object.assign(Object.assign({}, this.inheritedAttributes), { [attributeName]: newValue });
     }
     render() {
-        return (h(Host, { key: '8723fc6fc0cf3faf4a0fb48b38ad2f0d0a21704b', class: this.h.classes(LinkClass.root), size: this.size, href: this.href, external: this.external }, h("a", Object.assign({ key: '1bfe7837dab38690789ec818f6134a50a93d1e4e', class: "element", href: this.href, target: this.target }, this.inheritedAttributes), h("slot", { key: '96d6ce9e164a8fa5b6d5c115d52988bdfff3eceb', name: "icon-start" }), h("slot", { key: 'bcc373fec9e7e159c6b31a2ad846dd929d189d1e' }), this.external ? h("gov-icon", { name: "box-arrow-up-right", type: "components" }) : h("slot", { name: "icon-end" }))));
+        return (h(Host, { key: '233af48c179501fe03ee2e5931806e1955913b59', class: this.h.classes(LinkClass.root), size: this.size, href: this.href, external: this.external }, h("a", Object.assign({ key: '679067805205d76500979620b1ef4405139bb339', class: "element", href: this.href, target: this.target }, this.inheritedAttributes), h("slot", { key: 'd24c4ab99451f317a453c8131bd0506606322553', name: "icon-start" }), h("slot", { key: '276923f48cdc13985115e8d4e8860a2fb0c692e2' }), this.external ? h("gov-icon", { name: "box-arrow-up-right", type: "components" }) : h("slot", { name: "icon-end" }))));
     }
     static get is() { return "gov-link"; }
     static get properties() {

package/dist/collection/components/gov-loading/loading/gov-loading.js

@@ -14,7 +14,7 @@ export class GovLoading {
         this.validateSize(this.size);
     }
     render() {
-        return (h(Host, { key: '3f7cec1f98aa0c68f42eb3049ae8d34270e17258', class: this.h.classes(LoadingClass.root), size: this.size }, h("div", { key: '9ad1ca86b0221f2668f47eb72c080e9ecd05ed68', class: LoadingClass.content }, h("gov-icon", { key: '5d75c634386c8226c553b787355b29b0581601c5', class: prepareClasses([LoadingClass.icon, "gov-spin-animation"]), name: "loader", type: "components" }), h("slot", { key: '99ff7f6f1c8bd8135959ea36bc484eab6c9a4b6b' })), h("gov-backdrop", { key: 'dcaa2ab6dbcca347d5934df52e0f4989701c0259', inverse: true })));
+        return (h(Host, { key: '4c33339523674f2f2415dfb326131858de9eecf9', class: this.h.classes(LoadingClass.root), size: this.size }, h("div", { key: '8c25628dd3072fd89665ccfedb9596383181b13d', class: LoadingClass.content }, h("gov-icon", { key: 'a9969874350b5316c61a94b12d41a0130eeded0f', class: prepareClasses([LoadingClass.icon, "gov-spin-animation"]), name: "loader", type: "components" }), h("slot", { key: '14c716ecc352a0d947a6e3d932d2ab9075dedb97' })), h("gov-backdrop", { key: '507610e5a61b34be2166fb4a30539a134dc1b262', inverse: true })));
     }
     static get is() { return "gov-loading"; }
     static get properties() {

package/dist/collection/components/gov-loading/skeleton/gov-skeleton.js

@@ -66,7 +66,7 @@ export class GovSkeleton {
         return Object.assign({}, dimenssionsStyles);
     }
     render() {
-        return (h(Host, Object.assign({ key: '9e026075a3ee04f09546bb686ec04309374da466', size: this.size, color: this.color, class: {
+        return (h(Host, Object.assign({ key: '175dad78f57ee2e44fe3097e0595f59254e1003b', size: this.size, color: this.color, class: {
                 [SkeletonClass.root]: true,
                 circle: this.shape === "circle",
                 line: this.shape === "line",

package/dist/collection/components/gov-message/gov-message.js

@@ -13,7 +13,7 @@ export class GovMessage {
         validateProp(Colors, newValue, MessageClass.root);
     }
     render() {
-        return (h(Host, { key: 'e9250a61d94bf14a9d32eef5a69a9347df89a1e2', class: this.h.classes(MessageClass.root), color: this.color, type: this.type, role: "status" }, this.h.hasSlot("icon") && (h("slot", { key: '00a69ab91656245790d88c02cbaa14d365f48140', name: "icon" })), h("div", { key: 'c95cb839c2f24f744aff2a9580c44c18102d1fc9', class: MessageClass.content }, h("slot", { key: '71d8d21cff90b5498940d99947d62fec1f400f1e' }))));
+        return (h(Host, { key: 'b9e06c8f94940edf9d2c60119c35ec32baa23fc9', class: this.h.classes(MessageClass.root), color: this.color, type: this.type, role: "status" }, this.h.hasSlot("icon") && (h("slot", { key: 'd478f414de8eaa276cc867ae5bb325c1090b08ac', name: "icon" })), h("div", { key: 'd5a113ca4061b445c583fb1b4f22fff594570b1e', class: MessageClass.content }, h("slot", { key: 'e9be2f4ff3603c5f77d46e042455174e6ccfb7be' }))));
     }
     static get is() { return "gov-message"; }
     static get properties() {

package/dist/collection/components/gov-spacer/gov-spacer.js

@@ -19,7 +19,7 @@ export class GovSpacer {
         this.validateBreakpoint(this.breakpoint);
     }
     render() {
-        return h(Host, { key: '49415f0b2a4bfb25ececcd115bd1e8bfad250938', class: this.h.classes(SpacerClass.root), size: this.size, breakpoint: this.breakpoint });
+        return h(Host, { key: '23aedb7f3b112a356319aba076eedf9a4743e25b', class: this.h.classes(SpacerClass.root), size: this.size, breakpoint: this.breakpoint });
     }
     static get is() { return "gov-spacer"; }
     static get properties() {

package/dist/collection/components/gov-stepper/gov-stepper-item.js

@@ -25,7 +25,7 @@ export class GovStepperItem {
     render() {
         const triggerId = this.identifier || this.triggerId;
         const contentId = this.contentId;
-        return (h(Host, { key: 'f722a022748d8fcb4ca0a27108a7e2e2980a1602', id: triggerId, class: this.h.classes(StepperItemClass.root), color: this.color, role: "listitem", hydrated: this.hydrated }, this.h.hasSlot('prefix') && (h("span", { key: 'eed745cace26ca1d31c6441dd7be76d3dfa6bd4c', class: StepperItemClass.prefix }, h("slot", { key: 'd5cab6411231cd082468bcc5c244ee75e0dba147', name: "prefix" }))), h("div", { key: 'c13c92aa7890f8406eb5870caa93d186801c0a75' }, h("span", { key: 'ad456eb4699a3d32dfa2d5d477bd346cb1814473', class: StepperItemClass.headline }, h("slot", { key: '0dfdb036dcc108943be0795269e7e0b5f8ac0a29', name: "headline" })), h("slot", { key: '24220b19c2f3c6af35407da423bb1900dc363db8', name: "annotation" }), this.h.hasSlot('content') && (h("div", { key: '2bdd3feeaeafdcf73534bfadb5ff29d90eb9e037', class: StepperItemClass.content, id: contentId, "aria-labelledby": triggerId, role: "tabpanel" }, h("slot", { key: 'f2f70633c3c2adcc7bd407a23863e0a6fba5ec89', name: "content" }))))));
+        return (h(Host, { key: 'c24400b8ee5917005e6e3a21f47024c7ebad2960', id: triggerId, class: this.h.classes(StepperItemClass.root), color: this.color, role: "listitem", hydrated: this.hydrated }, this.h.hasSlot('prefix') && (h("span", { key: '010401daa60b44eed322de007fdd6e4ca035ff8d', class: StepperItemClass.prefix }, h("slot", { key: '27287e54365c7e72e01dd21f8d07f7144dc03f3c', name: "prefix" }))), h("div", { key: 'b50e23ee80b270bb5bb781c46e2cf2de73cad1bb' }, h("span", { key: '84500822ca2e529bff5e5cf4eb7ac7c9f0fc9d97', class: StepperItemClass.headline }, h("slot", { key: '18410e07be87715a96540789a82403bfab45e55c', name: "headline" })), h("slot", { key: 'dd2c20b9f07d2bcbf4223eca8de0d7592d178e86', name: "annotation" }), this.h.hasSlot('content') && (h("div", { key: 'cd34d17b5a14816dd91ee84f91a14217952bcfe5', class: StepperItemClass.content, id: contentId, "aria-labelledby": triggerId, role: "tabpanel" }, h("slot", { key: 'c90f411f8d63c6381f55a0e6ac819369a9bfd2e5', name: "content" }))))));
     }
     static get is() { return "gov-stepper-item"; }
     static get properties() {

package/dist/collection/components/gov-stepper/gov-stepper.js

@@ -27,7 +27,7 @@ export class GovStepper {
         this.hydrated = true;
     }
     render() {
-        return (h(Host, { key: '208bca5b06fce13b8f87f0cc4497860c01d2d56b', class: this.h.classes(StepperClass.root), role: "list", size: this.size, hydrated: this.hydrated }, h("slot", { key: 'a0ec9b8b5e03062e4b9547cb9fbfc73fddaa0519' })));
+        return (h(Host, { key: '0815470dbe86e888ab922139e6f02347f89f4700', class: this.h.classes(StepperClass.root), role: "list", size: this.size, hydrated: this.hydrated }, h("slot", { key: '2585c79a48236a8c2d333a437beb4d7f1d9d9d6c' })));
     }
     static get is() { return "gov-stepper"; }
     static get properties() {

package/dist/collection/components/gov-tabs/gov-tabs-item.js

@@ -23,7 +23,7 @@ export class GovTabsItem {
         }
     }
     render() {
-        return (h(Host, { key: '7cf18cf8a10a4c03dd51922e31e18dac86aa217d', class: this.h.classes(TabsItemClass.root), default: this.default }, h("div", { key: '3a707d9494c5055c3763f4cdf840522fae5e7a2a', class: TabsItemClass.inner, role: "tabpanel", id: this.identifier || this.contentId, hidden: !this.isActive, "aria-labelledby": this.triggerIdentifier || this.triggerId, "aria-hidden": toBoolAttrIfDefined(!this.isActive) }, h("slot", { key: '289b661851fc6d68a5d6dd376a6e31b691e25aea' }))));
+        return (h(Host, { key: '89b01b0d025a89f89085dba24db6b8fadcd97e68', class: this.h.classes(TabsItemClass.root), default: this.default }, h("div", { key: '8868371d0da63c1727c8b3a55b930a4d0ce30a3c', class: TabsItemClass.inner, role: "tabpanel", id: this.identifier || this.contentId, hidden: !this.isActive, "aria-labelledby": this.triggerIdentifier || this.triggerId, "aria-hidden": toBoolAttrIfDefined(!this.isActive) }, h("slot", { key: '0d47bea8c416b1c57aac006f9eea9101ade9427d' }))));
     }
     /**
      * Returns a unique tab content identifier

package/dist/collection/components/gov-tabs/gov-tabs.js

@@ -112,7 +112,7 @@ export class GovTabs {
         });
     }
     render() {
-        return (h(Host, { key: '75a6dc2d1bb8afb13e3d63b44bdd00e230a49fe6', class: this.h.classes(TabsClass.root), size: this.size, color: this.color, type: this.type, direction: this.direction, onKeyDown: this.onKeydownHandler.bind(this) }, h("div", Object.assign({ key: '1fc7ff9eafaaab713727787a1bb0c7364ad3cf4e', class: TabsClass.tabs, role: "tablist" }, this.inheritedAttributes), h("ul", { key: '82a67f585c9a394175bb64be57e669d886b3d4f6', class: TabsClass.list }, this.controllers.map(control => (h("li", { class: TabsClass.item }, this.type == "text" ? (h("button", { class: TabsClass.btn, id: control.triggerIdentifier, role: "tab", onClick: () => this.onSelectHandler(control), disabled: control.disabled, "aria-disabled": toBoolAttr(control.disabled), "aria-selected": toBoolAttr(control.active), "aria-controls": control.contentIdentifier, tabindex: control.active && !control.disabled ? 0 : -1, ref: el => (this.triggerRefs[control.triggerIdentifier] = el) }, control.iconStart ? (h("gov-icon", { name: control.iconStart.name, type: control.iconStart.type })) : null, control.label, control.iconEnd ? (h("gov-icon", { name: control.iconEnd.name, type: control.iconEnd.type })) : null)) : (h("gov-chip", { role: "tab", tag: 'button', identifier: control.triggerIdentifier, "aria-selected": booleanString(control.active), "aria-controls": control.contentIdentifier, focusable: control.active, disabled: control.disabled, color: this.color, size: this.size === "xs" ? "xs" : (this.size === "s" ? "s" : "m"), type: control.active ? "solid" : "outlined", ref: el => (this.triggerRefs[control.triggerIdentifier] = el), "on-gov-click": () => this.onSelectHandler(control) }, control.iconStart ? (h("gov-icon", { name: control.iconStart.name, type: control.iconStart.type, slot: "icon-start" })) : null, control.label, control.iconEnd ? (h("gov-icon", { name: control.iconEnd.name, type: control.iconEnd.type, slot: "icon-end" })) : null))))))), h("slot", { key: '8af7e27c0410ba9a4c0f79a1c44275e5811e9463' })));
+        return (h(Host, { key: '4efcbedcc355a74456cc899bc48c7aaf8c604c12', class: this.h.classes(TabsClass.root), size: this.size, color: this.color, type: this.type, direction: this.direction, onKeyDown: this.onKeydownHandler.bind(this) }, h("div", Object.assign({ key: 'a64d1a7cadd5950ebc687c3f3d741ea0a59a3684', class: TabsClass.tabs, role: "tablist" }, this.inheritedAttributes), h("ul", { key: 'adab5148c97b041e11f3e7d11a4d87492df5320a', class: TabsClass.list }, this.controllers.map(control => (h("li", { class: TabsClass.item }, this.type == "text" ? (h("button", { class: TabsClass.btn, id: control.triggerIdentifier, role: "tab", onClick: () => this.onSelectHandler(control), disabled: control.disabled, "aria-disabled": toBoolAttr(control.disabled), "aria-selected": toBoolAttr(control.active), "aria-controls": control.contentIdentifier, tabindex: control.active && !control.disabled ? 0 : -1, ref: el => (this.triggerRefs[control.triggerIdentifier] = el) }, control.iconStart ? (h("gov-icon", { name: control.iconStart.name, type: control.iconStart.type })) : null, control.label, control.iconEnd ? (h("gov-icon", { name: control.iconEnd.name, type: control.iconEnd.type })) : null)) : (h("gov-chip", { role: "tab", tag: 'button', identifier: control.triggerIdentifier, "aria-selected": booleanString(control.active), "aria-controls": control.contentIdentifier, focusable: control.active, disabled: control.disabled, color: this.color, size: this.size === "xs" ? "xs" : (this.size === "s" ? "s" : "m"), type: control.active ? "solid" : "outlined", ref: el => (this.triggerRefs[control.triggerIdentifier] = el), "on-gov-click": () => this.onSelectHandler(control) }, control.iconStart ? (h("gov-icon", { name: control.iconStart.name, type: control.iconStart.type, slot: "icon-start" })) : null, control.label, control.iconEnd ? (h("gov-icon", { name: control.iconEnd.name, type: control.iconEnd.type, slot: "icon-end" })) : null))))))), h("slot", { key: '2a3720ce9449d62ecd1d58bac806bf356d37375a' })));
     }
     getCurrentTab() {
         return this.controllers.find(control => control.active) || null;

package/dist/collection/components/gov-tag/gov-tag.js

@@ -11,6 +11,7 @@ export class GovTag {
         this.size = TagSizes._S;
         this.color = ButtonColors.PRIMARY;
         this.type = undefined;
+        this.expanded = false;
         this.h = govHost(this.host);
     }
     validateColor(newValue) {
@@ -26,7 +27,7 @@ export class GovTag {
     render() {
         const iconStart = prepareIconFormat(this.iconStart);
         const iconEnd = prepareIconFormat(this.iconEnd);
-        return (h(Host, { key: 'c883cf9721b32aa8c06609bf09272ef196456e18', class: this.h.classes(TagClass.root), color: this.color, size: this.size, type: this.type }, h("span", { key: '614f39f6f1004d6c3ee1d0f13990a4e52dee66bc', class: "element" }, h("slot", { key: 'f7d4dc9576768e917a363bc7cafa86567213ea82', name: "icon-start" }, iconStart && h("gov-icon", { key: '8d57b52a0314e8d76461872116b4ce04e546c180', type: iconStart.type, name: iconStart.name })), h("slot", { key: '4cd134377c3ea7843aa899b0a2962aa19f5d569e' }), h("slot", { key: '4dc1cccaced24ef26bb15e648788590a4b7d1838', name: "icon-end" }, iconEnd && h("gov-icon", { key: '7946e18900c98bdff4c610813b2422bf75b30049', type: iconEnd.type, name: iconEnd.name })))));
+        return (h(Host, { key: '8865709f2568a754160000138f413f352409e248', class: this.h.classes(TagClass.root), color: this.color, size: this.size, type: this.type }, h("span", { key: '4ae6dc1d60a207510de61c2391af9eb268dd3588', class: "element" }, h("slot", { key: 'f08057eb346b918d1be45ad7561a71bac54237aa', name: "icon-start" }, iconStart && h("gov-icon", { key: '37554fce04335c45bb724efeb5e7701513336b7b', type: iconStart.type, name: iconStart.name })), h("slot", { key: 'b66970bf42b9fd9217cb2e3a03c2f47c608b14a5' }), h("slot", { key: '85bf0010dac55b808bba5a442d977e8538f93d3a', name: "icon-end" }, iconEnd && h("gov-icon", { key: '70bf541bac6a69871618cb520c7008099aa6f341', type: iconEnd.type, name: iconEnd.name })))));
     }
     static get is() { return "gov-tag"; }
     static get properties() {
@@ -135,6 +136,24 @@ export class GovTag {
                 },
                 "attribute": "type",
                 "reflect": true
+            },
+            "expanded": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Expands the tag to fill 100% of the container width"
+                },
+                "attribute": "expanded",
+                "reflect": true,
+                "defaultValue": "false"
             }
         };
     }

package/dist/collection/components/gov-tag/gov-tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"gov-tag.js","sourceRoot":"","sources":["../../../../../../src/components/gov-tag/gov-tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAC,MAAM,eAAe,CAAA;AACtE,OAAO,EAAC,OAAO,EAAC,MAAM,4BAA4B,CAAA;AAElD,OAAO,EAAC,YAAY,EAAC,MAAM,8BAA8B,CAAA;AACzD,OAAO,EAAC,WAAW,EAAE,YAAY,EAAkB,MAAM,gCAAgC,CAAA;AACzF,OAAO,EAAC,QAAQ,EAAE,QAAQ,EAA6B,MAAM,aAAa,CAAA;AAC1E,OAAO,EAAC,iBAAiB,EAAC,MAAM,qBAAqB,CAAC;AAKtD,MAAM,OAAO,MAAM;IAGlB;;;oBAiBqD,QAAQ,CAAC,EAAE;qBAIP,YAAY,CAAC,OAAO;;QApB5E,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IA0BD,aAAa,CAAC,QAAgB;QAC7B,YAAY,CAAC,YAAY,EAAE,QAAQ,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAA;IACpD,CAAC;IAGD,YAAY,CAAC,QAAgB;QAC5B,YAAY,CAAC,WAAW,EAAE,QAAQ,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAA;IACnD,CAAC;IAED,iBAAiB;QAChB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QAC9B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAC7B,CAAC;IAED,MAAM;QACL,MAAM,SAAS,GAAG,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QACnD,MAAM,OAAO,GAAG,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;QAC/C,OAAO,CACN,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,EACzC,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI;YAEf,6DAAM,KAAK,EAAC,SAAS;gBACpB,6DAAM,IAAI,EAAC,YAAY,IACrB,SAAS,IAAI,iEAAU,IAAI,EAAE,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,SAAS,CAAC,IAAI,GAAa,CACzE;gBACP,8DAAO;gBACP,6DAAM,IAAI,EAAC,UAAU,IACnB,OAAO,IAAI,iEAAU,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,IAAI,EAAE,OAAO,CAAC,IAAI,GAAa,CACnE,CACD,CACD,CACP,CAAA;IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import {Component, Element, h, Host, Prop, Watch} from '@stencil/core'\nimport {govHost} from '../../helpers/Dom/template'\nimport {GovHost} from '../../helpers/Dom/template.types'\nimport {validateProp} from '../../helpers/Validate/props'\nimport {ButtonSizes, ButtonColors, ButtonColorType} from '../gov-button/button/constants'\nimport {TagClass, TagSizes, TagSizesType, TagTypesType} from './constants'\nimport {prepareIconFormat} from \"../gov-icon/helpers\";\n\n@Component({\n\ttag: 'gov-tag',\n})\nexport class GovTag {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovTagElement\n\n\t/**\n\t * Definition of the button icon on the left. The icon must be defined in the form \"type/name\".\n\t */\n\t@Prop({attribute: \"icon-start\"}) readonly iconStart?: string\n\t/**\n\t * Definition of the button icon on the left. The icon must be defined in the form \"type/name\".\n\t */\n\t@Prop({attribute: \"icon-end\"}) readonly iconEnd?: string\n\t/**\n\t * Tag’s size.\n\t */\n\t@Prop({reflect: true}) readonly size: TagSizesType = TagSizes._S\n\t/**\n\t * Style variation of the tag.\n\t */\n\t@Prop({reflect: true}) readonly color: ButtonColorType = ButtonColors.PRIMARY\n\t/**\n\t * Tag’s type\n\t */\n\t@Prop({reflect: true}) readonly type: TagTypesType\n\n\t@Watch('color')\n\tvalidateColor(newValue: string): void {\n\t\tvalidateProp(ButtonColors, newValue, TagClass.root)\n\t}\n\n\t@Watch('size')\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(ButtonSizes, newValue, TagClass.root)\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.validateColor(this.color)\n\t\tthis.validateSize(this.size)\n\t}\n\n\trender() {\n\t\tconst iconStart = prepareIconFormat(this.iconStart)\n\t\tconst iconEnd = prepareIconFormat(this.iconEnd)\n\t\treturn (\n\t\t\t<Host class={this.h.classes(TagClass.root)}\n\t\t\t\tcolor={this.color}\n\t\t\t\tsize={this.size}\n\t\t\t\ttype={this.type}\n\t\t\t>\n\t\t\t\t<span class=\"element\">\n\t\t\t\t\t<slot name=\"icon-start\">\n\t\t\t\t\t\t{iconStart && <gov-icon type={iconStart.type} name={iconStart.name}></gov-icon>}\n\t\t\t\t\t</slot>\n\t\t\t\t\t<slot/>\n\t\t\t\t\t<slot name=\"icon-end\">\n\t\t\t\t\t\t{iconEnd && <gov-icon type={iconEnd.type} name={iconEnd.name}></gov-icon>}\n\t\t\t\t\t</slot>\n\t\t\t\t</span>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}
+{"version":3,"file":"gov-tag.js","sourceRoot":"","sources":["../../../../../../src/components/gov-tag/gov-tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAC,MAAM,eAAe,CAAA;AACtE,OAAO,EAAC,OAAO,EAAC,MAAM,4BAA4B,CAAA;AAElD,OAAO,EAAC,YAAY,EAAC,MAAM,8BAA8B,CAAA;AACzD,OAAO,EAAC,WAAW,EAAE,YAAY,EAAkB,MAAM,gCAAgC,CAAA;AACzF,OAAO,EAAC,QAAQ,EAAE,QAAQ,EAA6B,MAAM,aAAa,CAAA;AAC1E,OAAO,EAAC,iBAAiB,EAAC,MAAM,qBAAqB,CAAC;AAKtD,MAAM,OAAO,MAAM;IAGlB;;;oBAiBqD,QAAQ,CAAC,EAAE;qBAIP,YAAY,CAAC,OAAO;;wBAQzB,KAAK;QA5BxD,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IA8BD,aAAa,CAAC,QAAgB;QAC7B,YAAY,CAAC,YAAY,EAAE,QAAQ,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAA;IACpD,CAAC;IAGD,YAAY,CAAC,QAAgB;QAC5B,YAAY,CAAC,WAAW,EAAE,QAAQ,EAAE,QAAQ,CAAC,IAAI,CAAC,CAAA;IACnD,CAAC;IAED,iBAAiB;QAChB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QAC9B,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAC7B,CAAC;IAED,MAAM;QACL,MAAM,SAAS,GAAG,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAA;QACnD,MAAM,OAAO,GAAG,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;QAC/C,OAAO,CACN,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC,EACzC,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI;YAEf,6DAAM,KAAK,EAAC,SAAS;gBACpB,6DAAM,IAAI,EAAC,YAAY,IACrB,SAAS,IAAI,iEAAU,IAAI,EAAE,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,SAAS,CAAC,IAAI,GAAa,CACzE;gBACP,8DAAO;gBACP,6DAAM,IAAI,EAAC,UAAU,IACnB,OAAO,IAAI,iEAAU,IAAI,EAAE,OAAO,CAAC,IAAI,EAAE,IAAI,EAAE,OAAO,CAAC,IAAI,GAAa,CACnE,CACD,CACD,CACP,CAAA;IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import {Component, Element, h, Host, Prop, Watch} from '@stencil/core'\nimport {govHost} from '../../helpers/Dom/template'\nimport {GovHost} from '../../helpers/Dom/template.types'\nimport {validateProp} from '../../helpers/Validate/props'\nimport {ButtonSizes, ButtonColors, ButtonColorType} from '../gov-button/button/constants'\nimport {TagClass, TagSizes, TagSizesType, TagTypesType} from './constants'\nimport {prepareIconFormat} from \"../gov-icon/helpers\";\n\n@Component({\n\ttag: 'gov-tag',\n})\nexport class GovTag {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovTagElement\n\n\t/**\n\t * Definition of the button icon on the left. The icon must be defined in the form \"type/name\".\n\t */\n\t@Prop({attribute: \"icon-start\"}) readonly iconStart?: string\n\t/**\n\t * Definition of the button icon on the left. The icon must be defined in the form \"type/name\".\n\t */\n\t@Prop({attribute: \"icon-end\"}) readonly iconEnd?: string\n\t/**\n\t * Tag’s size.\n\t */\n\t@Prop({reflect: true}) readonly size: TagSizesType = TagSizes._S\n\t/**\n\t * Style variation of the tag.\n\t */\n\t@Prop({reflect: true}) readonly color: ButtonColorType = ButtonColors.PRIMARY\n\t/**\n\t * Tag’s type\n\t */\n\t@Prop({reflect: true}) readonly type: TagTypesType\n\t/**\n\t * Expands the tag to fill 100% of the container width\n\t */\n\t@Prop({reflect: true}) readonly expanded: boolean = false\n\n\t@Watch('color')\n\tvalidateColor(newValue: string): void {\n\t\tvalidateProp(ButtonColors, newValue, TagClass.root)\n\t}\n\n\t@Watch('size')\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(ButtonSizes, newValue, TagClass.root)\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.validateColor(this.color)\n\t\tthis.validateSize(this.size)\n\t}\n\n\trender() {\n\t\tconst iconStart = prepareIconFormat(this.iconStart)\n\t\tconst iconEnd = prepareIconFormat(this.iconEnd)\n\t\treturn (\n\t\t\t<Host class={this.h.classes(TagClass.root)}\n\t\t\t\tcolor={this.color}\n\t\t\t\tsize={this.size}\n\t\t\t\ttype={this.type}\n\t\t\t>\n\t\t\t\t<span class=\"element\">\n\t\t\t\t\t<slot name=\"icon-start\">\n\t\t\t\t\t\t{iconStart && <gov-icon type={iconStart.type} name={iconStart.name}></gov-icon>}\n\t\t\t\t\t</slot>\n\t\t\t\t\t<slot/>\n\t\t\t\t\t<slot name=\"icon-end\">\n\t\t\t\t\t\t{iconEnd && <gov-icon type={iconEnd.type} name={iconEnd.name}></gov-icon>}\n\t\t\t\t\t</slot>\n\t\t\t\t</span>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"]}

package/dist/collection/components/gov-theme-switch/constants.js

@@ -6,8 +6,6 @@ export const ThemeSwitchClass = {
     indicator: 'gov-theme-switch__indicator',
     iconLight: 'gov-theme-switch__icon-light',
     iconDark: 'gov-theme-switch__icon-dark',
-    labelLight: 'gov-theme-switch__label-light',
-    labelDark: 'gov-theme-switch__label-dark',
 };
 export const ATTRIBUTE_THEME_NAME = 'data-theme';
 //# sourceMappingURL=constants.js.map

package/dist/collection/components/gov-theme-switch/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../../src/components/gov-theme-switch/constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAC,KAAK,EAAC,MAAM,4BAA4B,CAAC;AAGjD,MAAM,CAAC,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC,CAAA;AAG7E,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC/B,IAAI,EAAE,kBAAkB;IACxB,SAAS,EAAE,6BAA6B;IACxC,SAAS,EAAE,8BAA8B;IACzC,QAAQ,EAAE,6BAA6B;IACvC,UAAU,EAAE,+BAA+B;IAC3C,SAAS,EAAE,8BAA8B;CACzC,CAAA;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAG,YAAY,CAAA","sourcesContent":["import {pick} from \"../../utils/utils\";\nimport {Sizes} from \"../../core/constants/sizes\";\nimport {ValueOf} from \"../../types/interfaces\";\n\nexport const ThemeSwitchSizes = pick(Sizes, ['_XS', '_S', '_M', '_L', '_XL'])\nexport type ThemeSwitchSizesType = `${ValueOf<typeof ThemeSwitchSizes>}`\n\nexport const ThemeSwitchClass = {\n\troot: 'gov-theme-switch',\n\tindicator: 'gov-theme-switch__indicator',\n\ticonLight: 'gov-theme-switch__icon-light',\n\ticonDark: 'gov-theme-switch__icon-dark',\n\tlabelLight: 'gov-theme-switch__label-light',\n\tlabelDark: 'gov-theme-switch__label-dark',\n}\n\nexport const ATTRIBUTE_THEME_NAME = 'data-theme'\n"]}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../../src/components/gov-theme-switch/constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAC,KAAK,EAAC,MAAM,4BAA4B,CAAC;AAGjD,MAAM,CAAC,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC,CAAA;AAG7E,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC/B,IAAI,EAAE,kBAAkB;IACxB,SAAS,EAAE,6BAA6B;IACxC,SAAS,EAAE,8BAA8B;IACzC,QAAQ,EAAE,6BAA6B;CACvC,CAAA;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAG,YAAY,CAAA","sourcesContent":["import {pick} from \"../../utils/utils\";\nimport {Sizes} from \"../../core/constants/sizes\";\nimport {ValueOf} from \"../../types/interfaces\";\n\nexport const ThemeSwitchSizes = pick(Sizes, ['_XS', '_S', '_M', '_L', '_XL'])\nexport type ThemeSwitchSizesType = `${ValueOf<typeof ThemeSwitchSizes>}`\n\nexport const ThemeSwitchClass = {\n\troot: 'gov-theme-switch',\n\tindicator: 'gov-theme-switch__indicator',\n\ticonLight: 'gov-theme-switch__icon-light',\n\ticonDark: 'gov-theme-switch__icon-dark',\n}\n\nexport const ATTRIBUTE_THEME_NAME = 'data-theme'\n"]}