@ukic/web-components 3.7.0 → 3.9.0

package/dist/collection/components/ic-search-bar/ic-search-bar.js

@@ -528,39 +528,39 @@ export class SearchBar {
         const menuRendered = menuOpen && value.length >= charactersUntilSuggestion;
         const labelValue = getLabelFromValue(value, options, valueField, labelField);
         renderHiddenInput(this.el, value, name, disabledMode);
-        return (h(Host, { key: '52cd7f9c675ebb5a73d43d8aba5c564a09975983', class: {
+        return (h(Host, { key: '0446a1092d484ef29e0424eb22c6ae00b8fe8a72', class: {
                 "ic-search-bar-search": true,
                 "ic-search-bar-full-width": fullWidth,
                 "ic-search-bar-disabled": disabled,
                 "ic-search-bar-small": size === "small",
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, onFocus: this.handleHostFocus, onBlur: this.handleHostBlur }, h("ic-input-container", { key: '93f1f86abb836848f4a77e8bea800402a7c3d792', readonly: readonly, disabled: disabledMode }, !hideLabel && (h("ic-input-label", { key: '3408fa52e67fbc9420cb7f763198ea950e356b7e', for: inputId, label: label, helperText: helperText, required: required, disabled: disabledMode && !readonly, readonly: readonly }, h("slot", { key: '24fed7a49fc79140dabb28e1f77c8321bc51729b', name: "helper-text", slot: "helper-text" }))), h("ic-input-component-container", { key: 'be1083aceb07c1235666cb3f1f9892f8e1b8538d', ref: (el) => (this.anchorEl = el), size: size, disabled: disabledMode, readonly: readonly, fullWidth: fullWidth }, h("input", { key: '4ea2d718f3b6e4e524f534719630c618bb25a4d4', id: inputId, name: name, ref: (el) => (this.inputEl = el), value: options && !!labelValue ? labelValue : value, class: {
+            }, onFocus: this.handleHostFocus, onBlur: this.handleHostBlur }, h("ic-input-container", { key: 'fc32e70f7fa9397bc355774f58b8ab62af231083', readonly: readonly, disabled: disabledMode }, !hideLabel && (h("ic-input-label", { key: '32b8c40811415afc37480ed00416fde752704235', for: inputId, label: label, helperText: helperText, required: required, disabled: disabledMode && !readonly, readonly: readonly }, h("slot", { key: 'be47eb0acd1cde1b3d4f80ae5e4300021fe069d6', name: "helper-text", slot: "helper-text" }))), h("ic-input-component-container", { key: '266d999ac46d480655e325db420850e495c3cae7', ref: (el) => (this.anchorEl = el), size: size, disabled: disabledMode, readonly: readonly, fullWidth: fullWidth }, h("input", { key: 'f9f3b64cd1bf88eeb7a7cd52d9d41240c7afa14f', id: inputId, name: name, ref: (el) => (this.inputEl = el), value: options && !!labelValue ? labelValue : value, class: {
                 "no-left-pad": readonly,
                 readonly,
                 "truncate-value": truncateValue,
-            }, placeholder: placeholder, required: required, disabled: disabledMode, readonly: readonly, onInput: this.onInput, onBlur: this.onInputBlur, onFocus: this.onInputFocus, "aria-label": hideLabel ? label : undefined, "aria-activedescendant": ariaActiveDescendant, "aria-expanded": options.length > 0 && menuRendered ? `${menuOpen}` : undefined, "aria-owns": menuRendered ? menuId : undefined, "aria-describedby": describedById, "aria-controls": menuRendered ? menuId : undefined, "aria-haspopup": options.length > 0 ? "listbox" : undefined, "aria-autocomplete": hasSuggestedSearch ? "list" : undefined, role: options.length > 0 && menuRendered ? "combobox" : undefined, autocomplete: autocomplete, autocapitalize: autocapitalize, autoFocus: autofocus, spellcheck: spellcheck, inputmode: "search" }), h("div", { key: '447b4da477637a70ac3f2b9c180df87aebee044b', class: {
+            }, placeholder: placeholder, required: required, disabled: disabledMode, readonly: readonly, onInput: this.onInput, onBlur: this.onInputBlur, onFocus: this.onInputFocus, "aria-label": hideLabel ? label : undefined, "aria-activedescendant": ariaActiveDescendant, "aria-expanded": options.length > 0 && menuRendered ? `${menuOpen}` : undefined, "aria-owns": menuRendered ? menuId : undefined, "aria-describedby": describedById, "aria-controls": menuRendered ? menuId : undefined, "aria-haspopup": options.length > 0 ? "listbox" : undefined, "aria-autocomplete": hasSuggestedSearch ? "list" : undefined, role: options.length > 0 && menuRendered ? "combobox" : undefined, autocomplete: autocomplete, autocapitalize: autocapitalize, autoFocus: autofocus, spellcheck: spellcheck, inputmode: "search" }), h("div", { key: 'cd71148d381416ce2aac9a4c6899bbbe5077ebb9', class: {
                 "clear-button-container": true,
                 "clear-button-visible": !!value && !disabledMode && showClearButton,
-            } }, h("ic-button", { key: '3a740c60761c034298c1cabf4173a4168a2cbaee', id: "clear-button", class: {
+            } }, h("ic-button", { key: '3cf8c824075d6df594b65f7885f664ffce21fca8', id: "clear-button", class: {
                 "clear-button": true,
                 "clear-button-unfocused": !clearButtonFocused,
-            }, "aria-label": "Clear", innerHTML: clearIcon, onClick: this.handleClear, onMouseDown: this.handleMouseDown, size: size, onFocus: this.handleFocusClearButton, onBlur: this.handleClearBlur, onKeyDown: this.handleClear, type: "button", variant: "icon", theme: clearButtonFocused ? "light" : "dark" }), h("div", { key: '7fec0530f8a21476d808203bc79857a0c44538ab', class: "divider" })), h("div", { key: '376a77d494db324f5e469932009692cab51c58fe', class: {
+            }, "aria-label": "Clear", innerHTML: clearIcon, onClick: this.handleClear, onMouseDown: this.handleMouseDown, size: size, onFocus: this.handleFocusClearButton, onBlur: this.handleClearBlur, onKeyDown: this.handleClear, type: "button", variant: "icon", theme: clearButtonFocused ? "light" : "dark" }), h("div", { key: 'a8dd7dad12686d0d6dac4bde194d0df7eaf04c00', class: "divider" })), h("div", { key: '0d3eb9dff9d6ebbdf4063826077c410256772aed', class: {
                 "search-submit-button-container": true,
                 "search-submit-button-disabled": this.isSubmitDisabled(),
-            } }, h("ic-button", { key: 'c94e42dc5907d0e7dc412b8a09792090d4359783', id: "search-submit-button", "aria-label": "Search", ref: (el) => (this.searchSubmitButton = el), class: {
+            } }, h("ic-button", { key: '7d6a4c3a6f2a63178db90324e6f66804bd74ae07', id: "search-submit-button", "aria-label": "Search", ref: (el) => (this.searchSubmitButton = el), class: {
                 "search-submit-button": true,
                 "search-submit-button-small": size === "small",
                 "search-submit-button-unfocused": !searchSubmitFocused,
                 "search-submit-button-disabled": this.isSubmitDisabled(),
-            }, disabled: this.isSubmitDisabled(), innerHTML: searchIcon, size: size, onClick: this.handleSubmitSearch, onMouseDown: this.handleMouseDown, onBlur: this.handleSubmitSearchBlur, onFocus: this.handleSubmitSearchFocus, onKeyDown: this.handleSubmitSearchKeyDown, type: searchButtonType, variant: "icon", theme: searchSubmitFocused ? "light" : "dark" }))), h("div", { key: 'd59837a4d8626cb434d74920c3d16ebad1aa38e8', class: {
+            }, disabled: this.isSubmitDisabled(), innerHTML: searchIcon, size: size, onClick: this.handleSubmitSearch, onMouseDown: this.handleMouseDown, onBlur: this.handleSubmitSearchBlur, onFocus: this.handleSubmitSearchFocus, onKeyDown: this.handleSubmitSearchKeyDown, type: searchButtonType, variant: "icon", theme: searchSubmitFocused ? "light" : "dark" }))), h("div", { key: '7dbb3fd0f8374fffc17c3405e905d7307462a4c9', class: {
                 "menu-container": true,
                 fullwidth: fullWidth,
-            } }, menuRendered && this.anchorEl && this.inputEl && (h("ic-menu", { key: 'db6985b5af28d19536d7c3f1a19e84be95c765da', class: {
+            } }, menuRendered && this.anchorEl && this.inputEl && (h("ic-menu", { key: '9af74de47a4042857e8bed7691ce97397bc19f06', class: {
                 "no-results": this.hadNoOptions() ||
                     (filteredOptions.length === 1 &&
                         (filteredOptions[0][labelField] === loadingLabel ||
                             filteredOptions[0][labelField] === loadingErrorLabel)),
-            }, activationType: "manual", anchorEl: this.anchorEl, autofocusOnSelected: false, searchMode: searchMode, inputEl: this.inputEl, inputLabel: label, ref: (el) => (this.menu = el), fullWidth: fullWidth, menuId: menuId, open: true, options: filteredOptions, onMenuOptionSelect: this.handleOptionSelect, onMenuStateChange: this.handleMenuChange, onMenuOptionId: this.handleMenuOptionHighlight, onRetryButtonClicked: this.handleRetry, parentEl: this.el, value: value, labelField: labelField, valueField: valueField, searchBar: true })))), h("div", { key: '9d3ffbf8df67646d6262b275d27b90d4ff27ca8f', "aria-live": "polite", role: "status", class: "search-results-status" })));
+            }, activationType: "manual", anchorEl: this.anchorEl, autofocusOnSelected: false, searchMode: searchMode, inputEl: this.inputEl, inputLabel: label, ref: (el) => (this.menu = el), fullWidth: fullWidth, menuId: menuId, open: true, options: filteredOptions, onMenuOptionSelect: this.handleOptionSelect, onMenuStateChange: this.handleMenuChange, onMenuOptionId: this.handleMenuOptionHighlight, onRetryButtonClicked: this.handleRetry, parentEl: this.el, value: value, labelField: labelField, valueField: valueField, searchBar: true })))), h("div", { key: 'cf5b06c06543f839da43f37b3b105a16f2ca37f4', "aria-live": "polite", role: "status", class: "search-results-status" })));
     }
     static get is() { return "ic-search-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-section-container/ic-section-container.js

@@ -12,12 +12,12 @@ export class SectionContainer {
     }
     render() {
         const { aligned, fullHeight } = this;
-        return (h(Host, { key: '9e23a2afe1ae3c15369906d28f55755f69254f8e', class: {
+        return (h(Host, { key: '7e3838f9957b51b23ee95dac75e4180fcab480e3', class: {
                 ["aligned-left"]: aligned === "left" || aligned === null,
                 ["aligned-center"]: aligned === "center",
                 ["aligned-full-width"]: aligned === "full-width",
                 ["no-vertical-padding"]: !!fullHeight,
-            } }, h("slot", { key: '75e12e8d9f4b61ff68aba436e7206129d143ddba' })));
+            } }, h("slot", { key: 'aafd106b176cf123f56af5917ef6d04765d95538' })));
     }
     static get is() { return "ic-section-container"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-select/ic-select.js

@@ -784,18 +784,18 @@ export class Select {
             (searchable
                 ? !!searchableSelectInputValue
                 : !!currValue && !loading && showClearButton);
-        return (h(Host, { key: '4772c66e1053f7c19cafff3753af54715eab05d9', class: {
+        return (h(Host, { key: '7b99a667632c04cccbe465f90c4f5a9436ed04e2', class: {
                 "ic-select-disabled": disabled,
                 "ic-select-searchable": searchable,
                 [`ic-select-${size}`]: size !== "medium",
                 "ic-select-full-width": fullWidth,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, onBlur: this.onBlur }, h("ic-input-container", { key: '8d4a5a0b53f01cc6740b9fc1f5fa0805e45c8169', readonly: readonly }, !hideLabel && (h("ic-input-label", { key: '37e19194734f052932dd6ac7c56994f67802a1bd', for: inputId, label: label, helperText: helperText, required: required, disabled: disabled, readonly: readonly }, h("slot", { key: '3b27f513ffc78d514c7695b1e5941041837efd55', name: "helper-text", slot: "helper-text" }))), h("ic-input-component-container", { key: 'a5bf5d711e23862ec08fb8f8e85ce0beec436ccc', ref: (el) => (this.anchorEl = el), class: { "menu-open": open }, size: size, fullWidth: fullWidth, disabled: disabled, readonly: readonly, validationStatus: validationStatus }, isSlotUsed(this.el, "icon") &&
+            }, onBlur: this.onBlur }, h("ic-input-container", { key: 'be3746b8ac59d37562999157b5b70fbc5fb6cc18', readonly: readonly }, !hideLabel && (h("ic-input-label", { key: 'ccb2417565197ba5d71ce4ed25c2951a042bdcab', for: inputId, label: label, helperText: helperText, required: required, disabled: disabled, readonly: readonly }, h("slot", { key: 'eec64f5e410f4bbdfbea7afd23f8fd3bc4592429', name: "helper-text", slot: "helper-text" }))), h("ic-input-component-container", { key: '1b059596836c96987edadd6b0ec5a46c057e5fb6', ref: (el) => (this.anchorEl = el), class: { "menu-open": open }, size: size, fullWidth: fullWidth, disabled: disabled, readonly: readonly, validationStatus: validationStatus }, isSlotUsed(this.el, "icon") &&
             !disabled &&
-            (!readonly || !!value) && (h("span", { key: '42fc8c78302cde968d3c96ad72c9aac66652829e', slot: "left-icon", class: {
+            (!readonly || !!value) && (h("span", { key: '594527db6666a07c89038b173b1abd7e4191efc5', slot: "left-icon", class: {
                 readonly,
                 "has-value": !!value,
-            } }, h("slot", { key: '0cf7160335785716303e4e2e602be1a2d975098e', name: "icon" }))), readonly ? (h("ic-typography", null, h("p", null, valueLabelString))) : isMobileOrTablet() && !multiple ? (h("select", Object.assign({ ref: (el) => (this.nativeSelectElement = el), disabled: disabled, onChange: this.handleNativeSelectChange, required: required, id: inputId, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.handleNativeSelectKeyDown, form: form }, inheritedAttributes), h("option", { value: "", selected: true, disabled: !showClearButton }, placeholder), options.map((option) => option.children ? (h("optgroup", { label: option.label }, option.children.map((child) => this.renderNativeOption(child)))) : (this.renderNativeOption(option))))) : searchable ? (h("div", { class: "searchable-select-container" }, h("input", { class: {
+            } }, h("slot", { key: '5b982f545b7a35f2a2b16ca15278de2c6decfd00', name: "icon" }))), readonly ? (h("ic-typography", null, h("p", null, valueLabelString))) : isMobileOrTablet() && !multiple ? (h("select", Object.assign({ ref: (el) => (this.nativeSelectElement = el), disabled: disabled, onChange: this.handleNativeSelectChange, required: required, id: inputId, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.handleNativeSelectKeyDown, form: form }, inheritedAttributes), h("option", { value: "", selected: true, disabled: !showClearButton }, placeholder), options.map((option) => option.children ? (h("optgroup", { label: option.label }, option.children.map((child) => this.renderNativeOption(child)))) : (this.renderNativeOption(option))))) : searchable ? (h("div", { class: "searchable-select-container" }, h("input", { class: {
                 "select-input": true,
                 "with-clear-button": !!searchableSelectInputValue,
             }, role: "combobox", autocomplete: "off", "aria-label": label, "aria-describedby": describedBy, "aria-activedescendant": ariaActiveDescendant, "aria-autocomplete": "list", "aria-expanded": `${open}`, "aria-invalid": invalid, "aria-required": `${required}`, "aria-controls": menuId, ref: (el) => (this.searchableSelectElement = el), id: inputId, value: searchableSelectInputValue || undefined, placeholder: placeholder, disabled: disabled, onInput: this.handleSearchableSelectInput, onClick: this.handleClick, onKeyDown: this.handleKeyDown, onFocus: this.onFocus, onBlur: this.onBlur, form: form }), isClearable && (h("div", { class: "clear-button-container" }, h("ic-button", { id: "clear-button", ref: (el) => (this.clearButton = el), "aria-label": searchableSelectInputValue &&
@@ -815,13 +815,13 @@ export class Select {
             } }, valueLabelString || placeholder), h("div", { class: "select-input-end" }, isClearable && h("div", { class: "divider" }), h("span", { class: {
                 "expand-icon": true,
                 "expand-icon-open": open,
-            }, innerHTML: Expand, "aria-hidden": "true" }))), isClearable && (h("ic-button", { id: "clear-button", "aria-label": "Clear selection", class: "clear-button", innerHTML: Clear, onClick: this.handleClear, onFocus: this.handleClearButtonFocus, onBlur: this.handleClearButtonBlur, size: size, variant: "icon", theme: clearButtonFocused ? "light" : "dark" }))))), (!isMobileOrTablet() || multiple) && (h("ic-menu", { key: '56ad9e2340b8c7f7242a33b35cd2ccda78123f1c', class: {
+            }, innerHTML: Expand, "aria-hidden": "true" }))), isClearable && (h("ic-button", { id: "clear-button", "aria-label": "Clear selection", class: "clear-button", innerHTML: Clear, onClick: this.handleClear, onFocus: this.handleClearButtonFocus, onBlur: this.handleClearButtonBlur, size: size, variant: "icon", theme: clearButtonFocused ? "light" : "dark" }))))), (!isMobileOrTablet() || multiple) && (h("ic-menu", { key: '841eb3f04181992c0b00b033d19fe3650544c0ad', class: {
                 "no-results": loading ||
                     hasTimedOut ||
                     ((_a = noOptions === null || noOptions === void 0 ? void 0 : noOptions[0]) === null || _a === void 0 ? void 0 : _a.label) === emptyOptionListText,
             }, ref: (el) => (this.menu = el), inputEl: searchable
                 ? this.searchableSelectElement
-                : this.customSelectElement, inputLabel: label, anchorEl: this.anchorEl, size: size, menuId: menuId, open: open, options: searchable ? filteredOptions : uniqueOptions, value: multiple ? currValue : currValue, fullWidth: fullWidth, selectOnEnter: selectOnEnter, onMenuStateChange: this.handleMenuChange, onMenuOptionSelect: this.handleCustomSelectChange, onMenuOptionSelectAll: this.handleSelectAllChange, onMenuKeyPress: this.handleMenuKeyPress, onUngroupedOptionsSet: this.setUngroupedOptions, onRetryButtonClicked: this.handleRetry, parentEl: this.el, onTimeoutBlur: this.onTimeoutBlur, activationType: searchable || multiple || selectOnEnter ? "manual" : "automatic", closeOnSelect: !multiple, multiSelect: multiple ? true : false, searchableSelect: searchable ? true : false })), multiple && (h("div", { key: '7f06215c9bf2ea494abde73bc6245c08ef0b6a0a', "aria-live": "polite", role: "status", class: "multi-select-selected-count" })), hasValidationStatus(validationStatus, disabled) && (h("ic-input-validation", { key: '15510a6e9e5b5ea184bf97d2f863d6d5e5aacd48', class: { "menu-open": open }, ariaLiveMode: "polite", status: validationStatus, message: validationText, for: inputId })))));
+                : this.customSelectElement, inputLabel: label, anchorEl: this.anchorEl, size: size, menuId: menuId, open: open, options: searchable ? filteredOptions : uniqueOptions, value: multiple ? currValue : currValue, fullWidth: fullWidth, selectOnEnter: selectOnEnter, onMenuStateChange: this.handleMenuChange, onMenuOptionSelect: this.handleCustomSelectChange, onMenuOptionSelectAll: this.handleSelectAllChange, onMenuKeyPress: this.handleMenuKeyPress, onUngroupedOptionsSet: this.setUngroupedOptions, onRetryButtonClicked: this.handleRetry, parentEl: this.el, onTimeoutBlur: this.onTimeoutBlur, activationType: searchable || multiple || selectOnEnter ? "manual" : "automatic", closeOnSelect: !multiple, multiSelect: multiple ? true : false, searchableSelect: searchable ? true : false })), multiple && (h("div", { key: 'fecc09136ac127471d4f70ba69d3a26ba0a0a602', "aria-live": "polite", role: "status", class: "multi-select-selected-count" })), hasValidationStatus(validationStatus, disabled) && (h("ic-input-validation", { key: 'b03f8b488a2b31686e1fa7150c0a407c3533accf', class: { "menu-open": open }, ariaLiveMode: "polite", status: validationStatus, message: validationText, for: inputId })))));
     }
     static get is() { return "ic-select"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-side-navigation/ic-side-navigation.js

@@ -451,7 +451,7 @@ export class SideNavigation {
             isAppNameSubtitleVariant,
             appTitle: appTitle || "",
         };
-        return (h(Host, { key: '3c2b5578401f4cb5aec4443e08d0dd201e3b68a5', class: {
+        return (h(Host, { key: '3a4a405aa30061588d0ac895db6e59f3c6b10636', class: {
                 "xs-menu-open": menuOpen && isSDevice,
                 "xs-menu-close": !menuOpen && isSDevice,
                 "sm-collapsed": !isSDevice && !menuExpanded,
@@ -460,12 +460,12 @@ export class SideNavigation {
                 [`ic-side-navigation-${IcBrandForegroundEnum.Dark}`]: foregroundColor === IcBrandForegroundEnum.Dark,
                 ["collapsed-labels"]: !isSDevice && !menuExpanded && !!collapsedIconLabels,
                 ["ic-side-navigation-inline"]: !!inline,
-            } }, isSDevice && this.renderTopBar(Object.assign({}, topBarProps)), h("div", { key: 'e23e83b3b8ab5745d3336b9046d73b2093b3ce2b', class: "side-navigation", id: "side-navigation" }, !isSDevice && this.renderTopBar(Object.assign({}, topBarProps)), h("div", { key: '015266a0a9c86247a1304a261a8854f6f09c2cc9', class: "side-navigation-inner" }, isSlotUsed(this.el, "primary-navigation") && (h("nav", { key: 'dd6adfcf6555b8733c3a54e986c376a8173b67f4', class: "primary-navigation", "aria-labelledby": "primary-navigation-landmark" }, h("span", { key: '2496078c272bd4a2330a71a92fe5b6814d57f057', "aria-hidden": "true", class: "navigation-landmark-title", id: "primary-navigation-landmark" }, "Primary"), h("ul", { key: '9357b0f4413ffb8a27454e76f4ef8f31a0268edd', class: "navigation-list" }, h("slot", { key: 'f16b2e21c42f8bb71090bdf2616821a7f3971bb6', name: "primary-navigation" }))))), h("div", { key: '526a5d6b53d96281d1f94ccba74fff0656bae624', class: {
+            } }, isSDevice && this.renderTopBar(Object.assign({}, topBarProps)), h("div", { key: '158fd91a6728e919125eef39fe46a03efe9b0728', class: "side-navigation", id: "side-navigation" }, !isSDevice && this.renderTopBar(Object.assign({}, topBarProps)), h("div", { key: 'd77452616f1f0bd6c49e0c0e28ea20474f70eadc', class: "side-navigation-inner" }, isSlotUsed(this.el, "primary-navigation") && (h("nav", { key: '4d8dc4620dbe4288f92ac43a341104b989a5b0c6', class: "primary-navigation", "aria-labelledby": "primary-navigation-landmark" }, h("span", { key: 'acd709a0b58914936c593e5ed82d045b01a19ef9', "aria-hidden": "true", class: "navigation-landmark-title", id: "primary-navigation-landmark" }, "Primary"), h("ul", { key: '6c754d54f09ad1b8264817d5c141fa9bdc63b7fd', class: "navigation-list" }, h("slot", { key: '7f5de9f4adae9d6e0f9a24c095aca5d64049a0b4', name: "primary-navigation" }))))), h("div", { key: 'e0e68cefffb5a521c0a051c4af87c28fae21f922', class: {
                 ["bottom-wrapper"]: true,
                 ["classification-spacing"]: hasClassificationBanner(),
-            } }, isSlotUsed(this.el, "secondary-navigation") && (h("nav", { key: 'b4ca53bf595e01cca2fa4f6be6c206df17ca9dea', class: "secondary-navigation", "aria-labelledby": "secondary-navigation-landmark" }, h("span", { key: '3297c45f0206ad300b91bc72fd3f73833344e0a6', "aria-hidden": "true", class: "navigation-landmark-title", id: "secondary-navigation-landmark" }, "Secondary"), h("ul", { key: '9e26f92a7d9b7a336c030d5d9341e72e8d0c8869', class: "navigation-list" }, h("slot", { key: '7542d4061e0b546499e5b5323c39957c1607435a', name: "secondary-navigation" })))), h("div", { key: '3b7e932d373b189762584a180a13bc06ec702d77', class: "bottom-side-nav" }, this.hasSecondaryNavigation && h("ic-divider", { key: 'fa143397381376b142bef4fc6318ad98f329a358' }), displayExpandBtn && (h("button", { key: '1d92181c969e5fd7c960ff2b28dbc9588b0339cc', class: "menu-expand-button", innerHTML: chevronIcon, onClick: () => this.toggleMenuExpanded(!this.menuExpanded), "aria-label": `${menuExpanded ? "Collapse" : "Expand"} side navigation` })), h("div", { key: 'f82c9aec7d5b2175bcf0a71edef6e7dbd4d2914e', class: "app-status-wrapper" }, status && (h("div", { key: 'b632cb7118accac8f8085e433a76e69c0e3d092f', class: {
+            } }, isSlotUsed(this.el, "secondary-navigation") && (h("nav", { key: '2e72b5c8f510d5fb599c5805a37da30962246011', class: "secondary-navigation", "aria-labelledby": "secondary-navigation-landmark" }, h("span", { key: 'c661911fe2c13a2ddd477e69895ad3aa4f8d84b2', "aria-hidden": "true", class: "navigation-landmark-title", id: "secondary-navigation-landmark" }, "Secondary"), h("ul", { key: '0939467dc8307899228ed8391a055ace7fe3d7f6', class: "navigation-list" }, h("slot", { key: 'e9e954d9fd1f909e2ff2112b4b27f0755e237372', name: "secondary-navigation" })))), h("div", { key: 'e7de76b5fa8ba07f3d09faf9d551aea352a4a1eb', class: "bottom-side-nav" }, this.hasSecondaryNavigation && h("ic-divider", { key: '7031b8cd739921ebad638e6130b010b32aa8a14c' }), displayExpandBtn && (h("button", { key: '00aebdc20f176a5c850b5d133c2c240ba0e31574', class: "menu-expand-button", innerHTML: chevronIcon, onClick: () => this.toggleMenuExpanded(!this.menuExpanded), "aria-label": `${menuExpanded ? "Collapse" : "Expand"} side navigation` })), h("div", { key: '8e40643e70455334b03973942c86a3c7ecf84b63', class: "app-status-wrapper" }, status && (h("div", { key: '3634f6bd04cb1cd8c7b5b60b6635b2851209169c', class: {
                 ["app-status"]: true,
-            } }, h("ic-typography", { key: '8f2135a81cfd74a6cf79a6ebabec9f09eac6116d', "aria-label": "app tag", variant: "label-uppercase", class: "app-status-text" }, status))), version && (h("ic-typography", { key: '8eb1e6ec8476d68071803b511c857cd9252bcb50', variant: "label", class: "app-version", "aria-label": "app version" }, version))))))));
+            } }, h("ic-typography", { key: 'b39a8f9fe15256bd4604e1edf4dba0f0ccead9a3', "aria-label": "app tag", variant: "label-uppercase", class: "app-status-text" }, status))), version && (h("ic-typography", { key: '8b5473fedef7d77f42cffd1471715518f2dfd43b', variant: "label", class: "app-version", "aria-label": "app version" }, version))))))));
     }
     static get is() { return "ic-side-navigation"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-skeleton/ic-skeleton.js

@@ -23,11 +23,11 @@ export class Skeleton {
                 width: el.style.width || (variant === "circle" ? "25px" : "260px"),
             }
             : undefined;
-        return (h(Host, { key: '5818b75264565b11565affe9e6edbd0ebc850b5a', class: {
+        return (h(Host, { key: 'bc26af3bed291b88d9eba417aba8b1bd20d02071', class: {
                 skeleton: true,
                 "ic-skeleton-circle": variant === "circle",
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, style: style, "aria-disabled": "true" }, h("slot", { key: 'dac00f75ef41cba4df058a87ac54a7346e93f747' })));
+            }, style: style, "aria-disabled": "true" }, h("slot", { key: 'b7e19d9b7fc55069b1a5a3d82698378fb2a4fff4' })));
     }
     static get is() { return "ic-skeleton"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-skip-link/ic-skip-link.js

@@ -35,9 +35,9 @@ export class SkipLink {
     }
     render() {
         const { fullWidth, inline, label, monochrome, target, theme, transparentBackground, } = this;
-        return (h(Host, { key: '48ebe55664670d4b67c3063a4d0d309b7a7b001a', class: {
+        return (h(Host, { key: 'a6229f2e79e16d35283ae63e617e5dbee39f1a31', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h("ic-link", { key: 'effeead1403ff76b176d5bb7b3863c53e3677dd9', class: {
+            } }, h("ic-link", { key: 'f54ffd72b46d9124023ef6bfe0cf60f7b1091c25', class: {
                 "display-top": !inline,
                 "full-width": !!fullWidth,
                 "show-background": !transparentBackground,

package/dist/collection/components/ic-status-tag/ic-status-tag.js

@@ -33,12 +33,12 @@ export class StatusTag {
     }
     render() {
         const { label, status, variant, size, announced, theme, uppercase } = this;
-        return (h(Host, { key: '1364b3edcf4a5ebe148cfb8aa777bda105a3282f', class: { [`ic-theme-${theme}`]: theme !== "inherit" }, role: announced ? "status" : null, "aria-label": "Status" }, h("strong", { key: '96a6e601c3aeef8600835dc1e114c7be5a240164', class: {
+        return (h(Host, { key: '0ff5d3de133c300d744be1d57a42e5a393735572', class: { [`ic-theme-${theme}`]: theme !== "inherit" }, role: announced ? "status" : null, "aria-label": "Status" }, h("strong", { key: '09e1eeedac25e8128fe42a6fb5435dc06dc7d331', class: {
                 ["tag"]: true,
                 [`${variant}-${status}`]: true,
                 ["outlined"]: variant === "outlined",
                 [`${size}`]: true,
-            } }, h("ic-typography", { key: 'dd831bf604192af5ee4b29676be2eda2d5d12e24', variant: uppercase ? "label-uppercase" : "label", "apply-vertical-margins": false }, h("span", { key: 'd7c07a02acbb5db23516389b41a752c75f6c3da6' }, label)))));
+            } }, h("ic-typography", { key: '8543c7387e3337ec720eecaf3dbebbc09edfcb6d', variant: uppercase ? "label-uppercase" : "label", "apply-vertical-margins": false }, h("span", { key: '3673500383906cd09f4f409abff0c2aa12a0c30f' }, label)))));
     }
     static get is() { return "ic-status-tag"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-step/ic-step.js

@@ -57,29 +57,29 @@ export class Step {
         // STATUS ICON FOR COMPACT STEP
         let statusIcon;
         if (this.type === "completed" || this.compactStepStyling === "completed") {
-            statusIcon = (h("span", { key: 'da8e370996e92dde0f17f6460ecb0c11d8def086', class: "check-icon step-icon", "aria-hidden": "true", innerHTML: checkIcon }));
+            statusIcon = (h("span", { key: '8831990f0422a89e28d83c33bf98e6f5e47d09a6', class: "check-icon step-icon", "aria-hidden": "true", innerHTML: checkIcon }));
         }
         else if (this.type === "disabled" ||
             this.compactStepStyling === "disabled") {
-            statusIcon = (h("span", { key: '581de517797d73b13bab42503a084a579c540d5f', class: "warning-icon step-icon", "aria-hidden": "true", innerHTML: warningIcon }));
+            statusIcon = (h("span", { key: 'aedd81eacbe9ca6a4e331142d09053926b00dcd4', class: "warning-icon step-icon", "aria-hidden": "true", innerHTML: warningIcon }));
         }
         // COMPACT STEP COMPONENT
-        const compactStep = (h("div", { key: '2b0b01b29c81bd1ae351b56f04c18f7eab1ca4f1', class: {
+        const compactStep = (h("div", { key: '384c84c08600c48982959a9a19a54e638bdd76a9', class: {
                 ["step"]: true,
                 ["current"]: !!this.current,
                 [`compact-step-${this.compactStepStyling}`]: !!this.compactStepStyling,
                 ["disabled"]: this.type === "disabled" || this.compactStepStyling === "disabled",
-            } }, h("ic-loading-indicator", { key: '4f2234e8dc571338c71f63263d2cd45460920717', class: {
+            } }, h("ic-loading-indicator", { key: 'fb3373a16a3519a77689395882b77b07f84d00b2', class: {
                 "compact-step-progress-indicator": true,
                 "not-required": this.type === "disabled" ||
                     this.compactStepStyling === "disabled",
-            }, "aria-hidden": "true", size: "small", "inner-label": this.stepNum, progress: this.progress }), h("div", { key: 'bb3834decc5d6e971b8da1b225987f41d7542b67', class: "heading-area" }, h("ic-typography", { key: 'c9ac23c26ecb3a002f065583c36b105dd7a80d35', variant: "h4", class: "heading" }, this.heading), h("div", { key: '72a46d0b49c4b09db01fd6a7a4000efb4d4f6da9', class: "info-line" }, h("ic-typography", { key: '0a8f7b16a04431260d1650474ea86faa0248af2d', variant: "caption", class: "step-num" }, `${this.stepNum} of ${this.lastStepNum}`, h("span", { key: '497ad4a0febb2b9f5380a0bb28f0effc6368cf1d', class: "visually-hidden" }, " steps")), (this.subheading ||
+            }, "aria-hidden": "true", size: "small", "inner-label": this.stepNum, progress: this.progress }), h("div", { key: 'e404a8d7fd56af5a6c3b38e7dd146ccbf6c0a921', class: "heading-area" }, h("ic-typography", { key: 'e2d2d3a3b2e2d1080a500f06c11fd2b19305e733', variant: "h4", class: "heading" }, this.heading), h("div", { key: 'a04253bd63d0e9cbc2ebd2ccc6c6cf1d684611b4', class: "info-line" }, h("ic-typography", { key: '35699c8fd101642bcedacbb0e636f5f5e72d87d0', variant: "caption", class: "step-num" }, `${this.stepNum} of ${this.lastStepNum}`, h("span", { key: '0bc9e891b17f66419150733982711999983197a1', class: "visually-hidden" }, " steps")), (this.subheading ||
             this.type === "completed" ||
             this.type === "disabled" ||
             (this.variant === "compact" &&
                 !!this.compactStepStyling &&
                 this.compactStepStyling !== "active") ||
-            !!this.status) && (h("div", { key: 'ee5da9d5d75229d3bffbc761dfc4c779b22b063d', class: "step-status" }, statusIcon !== undefined && statusIcon, (this.subheading || stepType) && (h("ic-typography", { key: 'b249e660a2eff61dc1d537ab14e2bf027c2ffab2', variant: "caption" }, this.subheading !== null && isPropDefined(this.subheading)
+            !!this.status) && (h("div", { key: 'ce2356ecbc86e3805ddf84d7fa785f2a1495ef60', class: "step-status" }, statusIcon !== undefined && statusIcon, (this.subheading || stepType) && (h("ic-typography", { key: 'f9ada98e6d45ff5dcd8784dbb24c4402b7bd378e', variant: "caption" }, this.subheading !== null && isPropDefined(this.subheading)
             ? this.subheading
             : this.type === "disabled" ||
                 (this.variant === "compact" &&
@@ -92,26 +92,26 @@ export class Step {
         // ICON FOR DEFAULT STEP
         let icon;
         if (this.type !== "completed") {
-            icon = (h("ic-typography", { key: '8d6b60fe3b7cb9426536ac8afaeb798de0291b1c', variant: "subtitle-small" }, h("span", { key: '464e32e9503075944e90e9e42c72ef3955c948d0', class: "step-icon-inner", "aria-hidden": "true" }, this.stepNum)));
+            icon = (h("ic-typography", { key: '5b3734765f9d5e5db8f0b2818ffd471817a96cc5', variant: "subtitle-small" }, h("span", { key: 'd4d3ffd87c95a0b98fce8a437a6afb3f4639993f', class: "step-icon-inner", "aria-hidden": "true" }, this.stepNum)));
         }
         else {
-            icon = (h("div", { key: '620c7f67632c073a4e339427bedc5ffed0a4a320', class: "step-icon-inner", "aria-hidden": "true" }, h("span", { key: '1396290202c009168bf4b7983a2af4f5d8fdeb64', class: "check-icon", innerHTML: checkIcon })));
+            icon = (h("div", { key: '42447f9ec070e7e284aecfd49983259650d9abd3', class: "step-icon-inner", "aria-hidden": "true" }, h("span", { key: '4c7469fba1cf544d1d48c209c25db0bcaca14309', class: "check-icon", innerHTML: checkIcon })));
         }
         // STEP CONNECT FOR DEFAULT STEP
-        const partialBar = this.type === "current" && (h("div", { key: '7d27dc6a29aca34dcb14c0624c66309614c5378a', class: "step-connect-inner" }));
-        const finalStep = !this.lastStep && (h("div", { key: '70aeb7052405a7977a12562c329f227c71e35a8b', class: {
+        const partialBar = this.type === "current" && (h("div", { key: '800764f8ca21ac1118c77ed860a163b3103fe62e', class: "step-connect-inner" }));
+        const finalStep = !this.lastStep && (h("div", { key: 'e5c0f38f7140800d60e5046d77d6cde34c5e7bd5', class: {
                 ["step-connect"]: true,
                 ["aligned-full-width"]: !!(((_a = this.el.parentElement) === null || _a === void 0 ? void 0 : _a.classList.contains("ic-stepper-default")) &&
                     !this.el.parentElement.classList.contains("ic-stepper-aligned-left")),
             } }, partialBar));
         // DEFAULT STEP COMPONENT
-        const defaultStep = (h("div", { key: '130b7d2d16c416a5e699a20564b475fe0620af18', class: {
+        const defaultStep = (h("div", { key: 'cdfd23786b75a88fe1630318d8a1369a89090544', class: {
                 ["step"]: true,
                 [`${this.type}`]: true,
-            } }, h("div", { key: '6b71087d2f67a0858fdd819424fed8d36084d98e', class: "step-top" }, h("div", { key: 'a9d0fc4317db6cc4b60c8429909fe30dbae3001e', class: "step-icon" }, icon), finalStep), (this.heading || this.subheading || this.status) && (h("div", { key: '13c274e45d81977b4ceeaf98a4e092a2d90fec97', class: "heading-area" }, this.heading && (h("ic-typography", { key: '1c4307d5780fff0c7200631e7b729024e3ca8315', variant: "subtitle-large", class: "heading" }, this.heading)), this.heading && (this.subheading || this.status) && (h("ic-typography", { key: '4e6b789f77f40ed85e486bb8bf25b2209e042a91', variant: "caption", class: "subheading" }, this.subheading !== null && isPropDefined(this.subheading)
+            } }, h("div", { key: 'c83625070a1ffe89fc53f66d55f06c994f868570', class: "step-top" }, h("div", { key: 'a6758050efffeb98522092fefa9b1261b3d9217b', class: "step-icon" }, icon), finalStep), (this.heading || this.subheading || this.status) && (h("div", { key: '3ecf8d32da66fe336b7c0540c47726d060e8eaf8', class: "heading-area" }, this.heading && (h("ic-typography", { key: '79557ec3d9a26be0fee2253a58c2f09132322017', variant: "subtitle-large", class: "heading" }, this.heading)), this.heading && (this.subheading || this.status) && (h("ic-typography", { key: 'f5a90f68ebc0721fec936541824ab79b415f566d', variant: "caption", class: "subheading" }, this.subheading !== null && isPropDefined(this.subheading)
             ? this.subheading
             : stepStatus))))));
-        return (h(Host, { key: 'aaeb6b423f4a746831b15ec90ae450a4a4c3fc9e', role: "listitem", "aria-label": `Step ${this.stepNum}${ariaLabel}`, "aria-current": (this.current || this.type === "current") && "step", class: {
+        return (h(Host, { key: '0cb6b6649c9af4565e5f663131b800a79b9b040d', role: "listitem", "aria-label": `Step ${this.stepNum}${ariaLabel}`, "aria-current": (this.current || this.type === "current") && "step", class: {
                 ["aligned-full-width"]: !!(((_b = this.el.parentElement) === null || _b === void 0 ? void 0 : _b.classList.contains("ic-stepper-default")) &&
                     !this.el.parentElement.classList.contains("ic-stepper-aligned-left")),
                 [`ic-step-${this.variant}`]: true,

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

@@ -241,11 +241,11 @@ export class Stepper {
         checkResizeObserver(this.runResizeObserver);
     }
     render() {
-        return (h(Host, { key: '82128e652194f8c19692211d4170bab0651112c6', class: {
+        return (h(Host, { key: 'a4b87028ee91e542fd7d2b66689e8fabe33a9358', class: {
                 [`ic-stepper-${this.variant}`]: true,
                 ["ic-stepper-aligned-left"]: this.variant === "default" && this.aligned === "left",
                 [`ic-theme-${this.theme}`]: this.theme !== "inherit",
-            } }, h("ul", { key: '887be84fa976e8aae0bc1fd659781f4650543725', class: "step-item-list" }, h("slot", { key: '09dfecb16ef10d0920e0b781befed025e16af13c' }))));
+            } }, h("ul", { key: '65236609f6b2109bba5bbb88d084f9fd4e88d48a', class: "step-item-list" }, h("slot", { key: '2b542740488d922dca26cabda564db76de1ffd82' }))));
     }
     static get is() { return "ic-stepper"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-switch/ic-switch.js

@@ -91,16 +91,16 @@ export class Switch {
         const { label, checkedState, size, disabled, name, value, hideLabel, helperText, inputId, theme, } = this;
         const isSmall = size === "small";
         renderHiddenInput(this.el, checkedState ? value : "", name, disabled);
-        return (h(Host, { key: '41b8e3edfe4befcf823ba88af9b476301be738c0', class: {
+        return (h(Host, { key: '4d5830cca94b2dd699ad0f906dc1095f267675d4', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h("label", { key: 'b7be9f77c5ff10bd8f4ebcc76588d5b84567f37c', class: {
+            } }, h("label", { key: '61c6e73d0435b8911566ac628313f6a44c67d297', class: {
                 "ic-switch-container": true,
                 "ic-switch-disabled": !!disabled,
                 "ic-switch-small": isSmall,
-            }, htmlFor: inputId }, !hideLabel && (h("ic-input-label", { key: '799058374e555336d45376ddd645afeee32bafcb', for: inputId, label: label, helperText: helperText, readonly: false, disabled: disabled, class: {
+            }, htmlFor: inputId }, !hideLabel && (h("ic-input-label", { key: 'e8be8d74b3183a3b4a8ab53e7f38e0eda8d8b4e0', for: inputId, label: label, helperText: helperText, readonly: false, disabled: disabled, class: {
                 "ic-switch-label": true,
                 "ic-switch-label-small": isSmall,
-            } }, h("slot", { key: '509cfc15006377cd5cbb7ead4d33d29069e1ae25', name: "helper-text", slot: "helper-text" }))), !hideLabel && h("span", { key: '01ab8db129ac0a1cb0d1eb36c220211102c77696', class: "ic-switch-line-break" }), h("input", { key: '71c1a210fb9323c0d0bf1139f4bbd68e529b1c1f', checked: checkedState, disabled: disabled, "aria-label": label, "aria-checked": checkedState ? "true" : "false", "aria-describedby": getInputDescribedByText(this.el, inputId, helperText !== "", false), role: "switch", class: "ic-switch-input", type: "checkbox", name: "toggle", id: inputId, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.handleChange }), h("span", { key: '835ba78c97c3af1916e4214e781ecd3e4f465828', class: "ic-switch-toggle" }, h("svg", { key: '8bb00a2e5f95ebe996e73be959467df033c44881', class: "ic-switch-icon", "aria-hidden": "true", focusable: "false", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg" }, h("line", { key: 'a3d47d6105d552f920ef6143e385515da508500f', class: "ic-switch-icon-line", x1: "9", y1: isSmall ? "2" : "1", x2: "9", y2: isSmall ? "8" : "9" })), h("svg", { key: '2d7a5654aebbb042123a706edb2dec1c605d5f9d', class: "ic-switch-icon", "aria-hidden": "true", focusable: "false", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { key: '6c0645133ac7a2fa747ce1cd81df0d2b528e19a5', class: "ic-switch-icon-circle", fill: "none", cx: "5", cy: "5", r: isSmall ? "3.335" : "4.445" }))), h("slot", { key: 'f7ac187630acff4dabd2c264a6ebdbc717c21221', name: "right-adornment" }))));
+            } }, h("slot", { key: 'c26f98190a6dac0fcbcac0e76d512de045ed728e', name: "helper-text", slot: "helper-text" }))), !hideLabel && h("span", { key: '138bab016cba136f3f5bf5f8ed04fef823dfa7c1', class: "ic-switch-line-break" }), h("input", { key: 'e1ee536f3683fbf23a874fa3b33099107df38636', checked: checkedState, disabled: disabled, "aria-label": label, "aria-checked": checkedState ? "true" : "false", "aria-describedby": getInputDescribedByText(this.el, inputId, helperText !== "", false), role: "switch", class: "ic-switch-input", type: "checkbox", name: "toggle", id: inputId, onFocus: this.onFocus, onBlur: this.onBlur, onChange: this.handleChange }), h("span", { key: '1148ac346b57bac965f562511a4d05e480bddd6c', class: "ic-switch-toggle" }, h("svg", { key: '78508c5b97bf67b0e9e3b23911bb53aaeeb7271c', class: "ic-switch-icon", "aria-hidden": "true", focusable: "false", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg" }, h("line", { key: 'c32e2f0c7d95be778ba673085d95b03275e17d42', class: "ic-switch-icon-line", x1: "9", y1: isSmall ? "2" : "1", x2: "9", y2: isSmall ? "8" : "9" })), h("svg", { key: 'ba5c613c591a7d1b7d9c11682b3db371449bf9e6', class: "ic-switch-icon", "aria-hidden": "true", focusable: "false", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg" }, h("circle", { key: 'c15318f31f8b84ac4d38488ab90808ba8fd6886c', class: "ic-switch-icon-circle", fill: "none", cx: "5", cy: "5", r: isSmall ? "3.335" : "4.445" }))), h("slot", { key: '9ea7ffdc5e061674be43b1f5a06e262acc7ebd3a', name: "right-adornment" }))));
     }
     static get is() { return "ic-switch"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-tab/ic-tab.js

@@ -82,13 +82,13 @@ export class Tab {
     }
     render() {
         const { disabled, selected, theme, monochrome, handleClick, handleFocus, handleMouseDown, } = this;
-        return (h(Host, { key: '52491eaab3f7b7c56d59a13b4c57970642e04465', class: {
+        return (h(Host, { key: 'fe6e517a696ed23c6fb64028d617997439ebbac6', class: {
                 ["with-transition"]: !this.isInitialRender,
                 ["ic-tab-selected"]: !!selected,
                 ["ic-tab-disabled"]: !!disabled,
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 ["ic-tab-monochrome"]: !!monochrome,
-            }, role: "tab", "aria-selected": `${selected}`, onClick: handleClick, onFocus: handleFocus, onMouseDown: handleMouseDown, "aria-disabled": `${disabled}`, tabindex: selected ? 0 : -1 }, isSlotUsed(this.el, "icon") && h("slot", { key: '89b73a37ff1080ae55554ebed5afc5f3146bbfb0', name: "icon" }), h("ic-typography", { key: '61d61ac5b3739403ebc02a61509289e5f49edb31', class: "ic-tab-label", variant: "label" }, h("span", { key: 'a57666e5fa982b54d8d3f2fa4774edcf11d7300e' }, h("slot", { key: '30700a48cbb5226d548ce0944d83bfaf85b9de39' }))), isSlotUsed(this.el, "badge") && h("slot", { key: 'ee78c3cc07ddf5609ca26e1b6261c023b068571e', name: "badge" })));
+            }, role: "tab", "aria-selected": `${selected}`, onClick: handleClick, onFocus: handleFocus, onMouseDown: handleMouseDown, "aria-disabled": `${disabled}`, tabindex: selected ? 0 : -1 }, isSlotUsed(this.el, "icon") && h("slot", { key: '9c2bf173facd6f4b4fa96824bb14db06a2b97c6b', name: "icon" }), h("ic-typography", { key: 'f1d4732d8f5ad9f198f2da6c08c3717731dcd8da', class: "ic-tab-label", variant: "label" }, h("span", { key: '9f993fe757e86acb507a58259e47e507a5feddc3' }, h("slot", { key: '2bfe6c474802a62771ce58947305f0b71db1803d' }))), isSlotUsed(this.el, "badge") && h("slot", { key: '23c6074e338df9e72b77b5449938f61f9ee042a0', name: "badge" })));
     }
     static get is() { return "ic-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-tab-context/ic-tab-context.js

@@ -220,7 +220,7 @@ export class TabContext {
         }
     }
     render() {
-        return h("slot", { key: 'b2129a3c599ca4b97df30f14833761780c2c0940' });
+        return h("slot", { key: 'a0fd989c3705d70d9bc2d1746dcce7f3df79c0d0' });
     }
     static get is() { return "ic-tab-context"; }
     static get properties() {

package/dist/collection/components/ic-tab-group/ic-tab-group.js

@@ -16,11 +16,11 @@ export class TabGroup {
     }
     render() {
         const { inline, theme, label, monochrome } = this;
-        return (h(Host, { key: '5e2ac19760c3c6f6a5fa4e24e4b65d06bf958734', role: "tablist", "aria-label": label, class: {
+        return (h(Host, { key: '907693650fa274e54826ca116016e8bea75aa29c', role: "tablist", "aria-label": label, class: {
                 ["ic-tab-group-inline"]: !!inline,
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 ["ic-tab-group-monochrome"]: !!monochrome,
-            } }, h("ic-horizontal-scroll", { key: 'c1af66d6ccce50093586a87024d2fc2064204e65', theme: theme, "focus-trigger": "tabFocus", monochrome: monochrome }, h("div", { key: '5d74a60b33b216eea766a5d15e9d130cda924d2b', class: "tabs-container" }, h("slot", { key: '7d95c9b98a270810c391abc779ca0bda5c7fa24f' })))));
+            } }, h("ic-horizontal-scroll", { key: '94a5fd18b222a07d6119c6bc291522b12aaf91f3', theme: theme, "focus-trigger": "tabFocus", monochrome: monochrome }, h("div", { key: 'a81bf05bd2e9d2d079a9b05899da06c6a27cb231', class: "tabs-container" }, h("slot", { key: '434bc2798a1f471d7365a9854254f82bafa3c2d5' })))));
     }
     static get is() { return "ic-tab-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-tab-panel/ic-tab-panel.js

@@ -17,10 +17,10 @@ export class TabPanel {
     }
     render() {
         const { active, theme } = this;
-        return (h(Host, { key: '866d13ac3e2c93c8ea20e83d8513a74664aabfcb', class: {
+        return (h(Host, { key: '51756c01996190f5a90e7018a2146f6e27e6185a', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 "ic-tab-panel-hidden": !active,
-            }, role: "tabpanel", "aria-hidden": `${!active}` }, h("div", { key: 'a44da18c8534659c240dcb84ba9941b61574f546' }, h("slot", { key: '91a267e9b16c4ebdadb1b5facb9f7f50f3944f8e' }))));
+            }, role: "tabpanel", "aria-hidden": `${!active}` }, h("div", { key: 'fbe0b579017645beeb19d419f1ccf2fcde4c51e1' }, h("slot", { key: '482a66418dc7c89364da609e03f544f5b71d9849' }))));
     }
     static get is() { return "ic-tab-panel"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-text-field/ic-text-field.js

@@ -366,14 +366,14 @@ export class TextField {
         hiddenInput
             ? renderHiddenInput(this.el, value, name, disabledMode)
             : removeHiddenInput(this.el);
-        return (h(Host, { key: '353a70181ab18c4f636b34e2177bb9d088567885', class: {
+        return (h(Host, { key: 'af9f4dab9e78765b8e1e578d57783e5487d83f6b', class: {
                 "ic-text-field-full-width": fullWidth,
                 "ic-text-field-disabled": disabledMode,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h("ic-input-container", { key: '96d0ef6132ed2a26ee535cfc5055ddc6287446f6', readonly: readonly, disabled: disabledMode }, !hideLabel && (h("ic-input-label", { key: 'dfcb7859651f74678636e4cda1ba0706b2e3b1fb', for: inputId, label: label, helperText: helperText, required: required, disabled: disabledText, readonly: readonly }, h("slot", { key: 'd9ee297f2de674a969486a3d00eef54526eace50', name: "helper-text", slot: "helper-text" }))), h("ic-input-component-container", { key: '0a178235ced26ef73fd907d41424a8b4942659dc', size: size, validationStatus: currentStatus, multiLine: multiline, disabled: disabledMode, readonly: readonly, validationInline: validationInline, fullWidth: fullWidth }, showLeftIcon && (h("span", { key: 'c5206e3d1af81d4bf9bf0afcc9277899ca2287be', class: {
+            } }, h("ic-input-container", { key: '7417dcc2f53f877899b713093e81a4db38c394c7', readonly: readonly, disabled: disabledMode }, !hideLabel && (h("ic-input-label", { key: '36ae0e2a6a99024c0b8fbd141519dcd4d5390e6d', for: inputId, label: label, helperText: helperText, required: required, disabled: disabledText, readonly: readonly }, h("slot", { key: '9392299204d1bc2ef1b0bb464984b8f8bc148834', name: "helper-text", slot: "helper-text" }))), h("ic-input-component-container", { key: 'd6819ae02cab210950e11d74c1dac6dd3c5505ed', size: size, validationStatus: currentStatus, multiLine: multiline, disabled: disabledMode, readonly: readonly, validationInline: validationInline, fullWidth: fullWidth }, showLeftIcon && (h("span", { key: '660f12ab2717dfd7b75bd19a60c92c167fb06db3', class: {
                 readonly,
                 "has-value": this.getNumberOfCharacters(value) > 0,
-            }, slot: "left-icon" }, h("slot", { key: 'f3945929b482d9a0a954dc1afa658fc0c45d90c8', name: "icon" }))), !multiline ? (h("input", Object.assign({ id: inputId, name: name, ref: (el) => (this.inputEl = el), type: type, min: min, max: max, value: value, class: {
+            }, slot: "left-icon" }, h("slot", { key: '8631fc623d4f5b422921add6d01992b736acdf22', name: "icon" }))), !multiline ? (h("input", Object.assign({ id: inputId, name: name, ref: (el) => (this.inputEl = el), type: type, min: min, max: max, value: value, class: {
                 "no-left-pad": !showLeftIcon && readonly,
                 readonly,
                 "truncate-value": truncateValue,
@@ -381,19 +381,19 @@ export class TextField {
                 "no-resize": resize === false || !!readonly,
                 "no-left-pad": !showLeftIcon && !!readonly,
                 readonly: !!readonly,
-            }, name: name, ref: (el) => (this.inputEl = el), value: value, rows: rows, required: required, disabled: disabledMode, placeholder: placeholder, readonly: readonly, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onScroll: this.onTextAreaScroll, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, autocapitalize: autocapitalize, spellcheck: spellcheck, inputmode: inputmode, maxlength: maxCharactersReached ? maxCharacters : undefined, minlength: minCharactersUnattained ? minCharacters : undefined }, inheritedAttributes))), isSlotUsed(el, "clear-button") && (h("slot", { key: '6397d66b59b148884cb2fd7f8913063ca24f0de1', name: "clear-button" })), isSlotUsed(el, "search-submit-button") && (h("slot", { key: 'c5e7f94345cebe1dc99ba475aa5bde1b45dda0e0', name: "search-submit-button" }))), isSlotUsed(el, "menu") && h("slot", { key: '1c7fe7d7654373753295a44a3e126ce2409099cc', name: "menu" }), (!isEmptyString(validationStatus) ||
+            }, name: name, ref: (el) => (this.inputEl = el), value: value, rows: rows, required: required, disabled: disabledMode, placeholder: placeholder, readonly: readonly, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onScroll: this.onTextAreaScroll, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, autocapitalize: autocapitalize, spellcheck: spellcheck, inputmode: inputmode, maxlength: maxCharactersReached ? maxCharacters : undefined, minlength: minCharactersUnattained ? minCharacters : undefined }, inheritedAttributes))), isSlotUsed(el, "clear-button") && (h("slot", { key: 'c92ce219c83dccaec610f5caeb2a71b4753cbe2f', name: "clear-button" })), isSlotUsed(el, "search-submit-button") && (h("slot", { key: '4ee50a7855e3a2c3fb5ab4ad655b278bb7a2190d', name: "search-submit-button" }))), isSlotUsed(el, "menu") && h("slot", { key: '9ab8449f815482c7cd689d3d22b918de4c72c27b', name: "menu" }), (!isEmptyString(validationStatus) ||
             !isEmptyString(validationText) ||
             maxNumChars > 0 ||
             maxValueExceeded ||
             maxCharactersWarning ||
             minCharactersUnattained ||
             minValueUnattained) &&
-            !validationInlineInternal && (h("ic-input-validation", { key: '2ba3ff987910423696b822529b36e59f04b36025', status: this.hasStatus(currentStatus) === false ||
+            !validationInlineInternal && (h("ic-input-validation", { key: 'b87afc1859b8a33d5767b5b0c61056936b760de7', status: this.hasStatus(currentStatus) === false ||
                 (currentStatus === IcInformationStatus.Success &&
                     validationInline) ||
                 validationInlineInternal
                 ? ""
-                : currentStatus, message: showStatusText ? currentValidationText : "", ariaLiveMode: messageAriaLive, for: inputId, fullWidth: fullWidth }, !readonly && maxNumChars > 0 && (h("div", { key: '01e443574b72a18ebd0b0646b0c2c30b59cc5726', slot: "validation-message-adornment" }, !hideCharCount && (h("ic-typography", { key: '90d4e1d9325a34444c38a9c75eaaa5e256c23cae', variant: "caption", class: "char-count-text" }, h("span", { key: '901a7db053e3fa59e6db506a53be92ddbf54be5d', class: "char-count" }, numChars, "/", maxNumChars))), h("span", { key: '83b08ec8e8ba8286cc8024b647552c5b3e0d09e5', class: "remaining-char-count-desc", "aria-live": "polite", hidden: !isFocussed, id: remainingCharCountDescId }, remainingCharCountDesc), h("span", { key: '28e0fc0de7a73057a7b00bd7e40e71c7611a980c', hidden: true, id: hiddenCharCountDescId }, "Field can contain a maximum of ", maxNumChars, " characters."))))))));
+                : currentStatus, message: showStatusText ? currentValidationText : "", ariaLiveMode: messageAriaLive, for: inputId, fullWidth: fullWidth }, !readonly && maxNumChars > 0 && (h("div", { key: 'b0f41b53066d1c7b6fa4442796ec5122198575bf', slot: "validation-message-adornment" }, !hideCharCount && (h("ic-typography", { key: 'acc961a28e30293d1031a8469327e3f70c179936', variant: "caption", class: "char-count-text" }, h("span", { key: '94e2d9e62a04beccd7abc4309a70f6a0908f4d34', class: "char-count" }, numChars, "/", maxNumChars))), h("span", { key: 'caf33b69417c2a5d956b7a88ea3855212c7e3e19', class: "remaining-char-count-desc", "aria-live": "polite", hidden: !isFocussed, id: remainingCharCountDescId }, remainingCharCountDesc), h("span", { key: 'f69c682178137ae9da47c05c15b81de48e06189a', hidden: true, id: hiddenCharCountDescId }, "Field can contain a maximum of ", maxNumChars, " characters."))))))));
     }
     static get is() { return "ic-text-field"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-theme/ic-theme.js

@@ -65,7 +65,7 @@ export class Theme {
     }
     render() {
         const { themeClass } = this;
-        return (h(Host, { key: 'b49257f527c4a26eca25d04500d822785cba320b', class: themeClass }, h("slot", { key: '09782aca70372e6897e9032b66a166335778a6fe' })));
+        return (h(Host, { key: 'ee89cdd36cb4cb7e0589dfea2dd5a60b5de40041', class: themeClass }, h("slot", { key: 'e7803bf5fc0974bfcf9a2a52cb5870254453a1bd' })));
     }
     static get is() { return "ic-theme"; }
     static get properties() {

package/dist/collection/components/ic-toast/ic-toast.css

@@ -518,6 +518,10 @@ video {
   background-color: var(--ic-toast-status-success);
 }
 
+.divider-ai {
+  background-color: var(--ic-toast-status-ai);
+}
+
 .toast-icon,
 ::slotted(svg) {
   height: var(--ic-space-lg);
@@ -546,6 +550,10 @@ video {
   fill: var(--ic-toast-icon-success);
 }
 
+:host([variant="ai"]) .toast-icon svg {
+  fill: var(--ic-toast-icon-ai);
+}
+
 .toast-content {
   margin-left: var(--ic-space-xs);
   width: 100%;

package/dist/collection/components/ic-toast/ic-toast.js

@@ -202,13 +202,13 @@ export class Toast {
     }
     render() {
         const { variant, heading, message, visible, isManual, dismissButtonAriaLabel, } = this;
-        return (h(Host, { key: '77ff93e63eaa0ac86b8afc447c5f2190131dd758', class: { ["ic-toast-hidden"]: !visible }, tabindex: "0", onFocus: this.onFocus, onBlur: this.onBlur, role: isManual ? "dialog" : "alert", "aria-live": isManual ? null : "polite" }, h("div", { key: '0fcc1bf6aaf4c42a8ba4828c82777f75426b63bd', class: "container" }, variant && visible && (h("div", { key: '87093bc655aa884d3e815f49a7ed5675e7e26b60', class: "toast-icon-container" }, h("div", { key: 'b169b9bad445f582c0d0019cb646f0648ea589a1', class: {
+        return (h(Host, { key: 'ced9ccd739749f996c2c9a116bffa32cf19dbec1', class: { ["ic-toast-hidden"]: !visible }, tabindex: "0", onFocus: this.onFocus, onBlur: this.onBlur, role: isManual ? "dialog" : "alert", "aria-live": isManual ? null : "polite" }, h("div", { key: 'cb61a3180810c26fa2b2e093f9bef2887a876d0e', class: "container" }, variant && visible && (h("div", { key: 'b4fa17e0010310b293431201e9149b182ba3bd23', class: "toast-icon-container" }, h("div", { key: '70d2193d9b7ebad46c05bb50839c1d2f512d004e', class: {
                 ["divider"]: true,
                 [`divider-${variant}`]: true,
-            } }), variant === "neutral" ? (h("slot", { name: "neutral-icon" })) : (h("span", { class: "toast-icon", innerHTML: VARIANT_ICONS[variant].icon })))), h("div", { key: '22a0c86247222789d4590a8c2698120c74fe3c59', class: {
+            } }), variant === "neutral" ? (h("slot", { name: "neutral-icon" })) : (h("span", { class: "toast-icon", innerHTML: VARIANT_ICONS[variant].icon })))), h("div", { key: '6a78e344040bd9e5d5a20dd5922e97091a89f0bc', class: {
                 ["toast-content"]: true,
                 ["no-icon"]: variant === "neutral" && !isSlotUsed(this.el, "neutral-icon"),
-            } }, h("div", { key: 'fba229f896689a7309d2e6e1d566e3e7dbd32932', class: "toast-text" }, h("ic-typography", { key: 'd672976872f8789ed4a51c4af23e64a48ba19bc8', variant: "subtitle-large", class: "toast-heading" }, visible && (isManual ? h("h5", null, heading) : h("p", null, heading))), message && (h("ic-typography", { key: 'f51c64d977c09cc5e6502b780dc70de84ebaa035', variant: "body", class: "toast-message" }, visible && h("p", { key: 'f827dbff18b4b0cfd713747f09d62e0040f8f1a3' }, message)))), isSlotUsed(this.el, "action") && (h("div", { key: '3f5cee133b54735d6d7466ceb37389d27b61c7a0', class: "toast-action-container" }, h("slot", { key: 'b7882de8b13f069887ebd612ab6e260b063c65d1', name: "action" })))), !isManual ? (h("ic-loading-indicator", { class: "toast-dismiss-timer", theme: "dark", monochrome: true, size: "icon", progress: this.timerProgress, description: "Dismiss timer" })) : (h("ic-button", { id: "dismiss-button", innerHTML: closeIcon, onClick: this.dismissAction, variant: "icon", "aria-label": dismissButtonAriaLabel })))));
+            } }, h("div", { key: '6f9807f536c6f37b6868bc651fd0cc90bff3817f', class: "toast-text" }, h("ic-typography", { key: 'e86371c512f1413ec2482b0e8c88baa0357c346b', variant: "subtitle-large", class: "toast-heading" }, visible && (isManual ? h("h5", null, heading) : h("p", null, heading))), message && (h("ic-typography", { key: '593526ebb19c0fe0f9761b316ba75557f17dc545', variant: "body", class: "toast-message" }, visible && h("p", { key: '15b6099aeaca00f3124d80fad1ce94d396343d17' }, message)))), isSlotUsed(this.el, "action") && (h("div", { key: 'bda528607c243a094a3c61f509e12902133245e9', class: "toast-action-container" }, h("slot", { key: '35c924efff99f3882daaec3f3589057a67eb9d46', name: "action" })))), !isManual ? (h("ic-loading-indicator", { class: "toast-dismiss-timer", theme: "dark", monochrome: true, size: "icon", progress: this.timerProgress, description: "Dismiss timer" })) : (h("ic-button", { id: "dismiss-button", innerHTML: closeIcon, onClick: this.dismissAction, variant: "icon", "aria-label": dismissButtonAriaLabel })))));
     }
     static get is() { return "ic-toast"; }
     static get encapsulation() { return "shadow"; }
@@ -352,7 +352,7 @@ export class Toast {
                 "mutable": true,
                 "complexType": {
                     "original": "IcStatusVariants",
-                    "resolved": "\"error\" | \"info\" | \"neutral\" | \"success\" | \"warning\" | undefined",
+                    "resolved": "\"ai\" | \"error\" | \"info\" | \"neutral\" | \"success\" | \"warning\" | undefined",
                     "references": {
                         "IcStatusVariants": {
                             "location": "import",

package/dist/collection/components/ic-toast/ic-toast.stories.js

@@ -368,10 +368,10 @@ export const Playground = {
     },
 
     variant: {
-      options: ["neutral", "info", "warning", "error", "success", ""],
+      options: ["neutral", "info", "warning", "error", "success", "ai", ""],
 
       control: {
-        type: "select",
+        type: "inline-radio",
       },
     },
 

package/dist/collection/components/ic-toast-region/ic-toast-region.js

@@ -40,7 +40,7 @@ export class ToastRegion {
         }
     }
     render() {
-        return h("slot", { key: '9a80027a3b497771ca83af4172fdccc2bfcc10f0' });
+        return h("slot", { key: '5f8c46d718f868942c5b46b431b2cee136e215b4' });
     }
     static get is() { return "ic-toast-region"; }
     static get properties() {

package/dist/collection/components/ic-toggle-button/ic-toggle-button.js

@@ -137,7 +137,7 @@ export class ToggleButton {
     render() {
         const { accessibleLabel, checked, disabled, fullWidth, iconPlacement, monochrome, label, loading, outline, size, theme, tooltipPlacement, variant, } = this;
         const iconVariant = variant === "icon";
-        return (h(Host, { key: 'f2118b4a93ef348f3df18806e1e8e50d6583aadb', class: {
+        return (h(Host, { key: '5560cb91c78fd8167fb76bb1cab0bcb20723828c', class: {
                 "ic-toggle-button-checked": checked,
                 "ic-toggle-button-disabled": disabled,
                 "ic-toggle-button-icon": iconVariant,
@@ -147,7 +147,7 @@ export class ToggleButton {
                 "ic-toggle-button-hide-outline": !outline,
                 [`ic-toggle-button-${size}`]: true,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, onFocus: this.handleFocus }, h("ic-button", { key: 'ad1c3c331cb9d900a8c815aa3e1fce192111d7a3', "aria-pressed": `${checked}`, variant: iconVariant ? "icon" : "secondary", onClick: this.handleClick, title: accessibleLabel, "aria-label": `${accessibleLabel ? accessibleLabel : label}, ${checked ? "ticked" : "unticked"}`, disabled: disabled, size: size, fullWidth: fullWidth, loading: loading, tooltipPlacement: tooltipPlacement }, !iconVariant && label, h("slot", { key: '4fa14905c645f54646c70aa054d2c7f47254c77d' }), isSlotUsed(this.el, "icon") && (h("slot", { key: 'ea79cad11be50ce8a6a35a6cf8e743237e349d2c', name: "icon", slot: `${iconPlacement}-icon` })), isSlotUsed(this.el, "badge") && (h("slot", { key: 'dc96229f6178198a47c7f597179e069208e49acb', name: "badge", slot: "badge" })))));
+            }, onFocus: this.handleFocus }, h("ic-button", { key: 'e56f66ed52343d9c34df12a306028a799fab6f7a', "aria-pressed": `${checked}`, variant: iconVariant ? "icon" : "secondary", onClick: this.handleClick, title: accessibleLabel, "aria-label": `${accessibleLabel ? accessibleLabel : label}, ${checked ? "ticked" : "unticked"}`, disabled: disabled, size: size, fullWidth: fullWidth, loading: loading, tooltipPlacement: tooltipPlacement }, !iconVariant && label, h("slot", { key: '57f73405674f826c39962f85ab030685bf18f11d' }), isSlotUsed(this.el, "icon") && (h("slot", { key: '1b26441ed5bd3a0a18bdaa7d8432fd5d5434cfb4', name: "icon", slot: `${iconPlacement}-icon` })), isSlotUsed(this.el, "badge") && (h("slot", { key: 'bf12638f891f2ba6c01df01d03ee860f7f15e0b1', name: "badge", slot: "badge" })))));
     }
     static get is() { return "ic-toggle-button"; }
     static get encapsulation() { return "shadow"; }