@ukic/web-components 3.26.0 → 3.28.0

package/dist/cjs/ic-status-tag.cjs.entry.js

@@ -43,12 +43,12 @@ const StatusTag = class {
     }
     render() {
         const { label, status, variant, size, announced, theme, uppercase } = this;
-        return (index.h(index.Host, { key: '06426990cc94da53c570547331c63d161675f620', class: { [`ic-theme-${theme}`]: theme !== "inherit" }, role: announced ? "status" : null, "aria-label": "Status" }, index.h("strong", { key: '2c6d0e05018d59bfc7c1acab4b8ffda5ba4cfce3', class: {
+        return (index.h(index.Host, { key: 'c8599ea4942bb14073e77f10f4a0a0fbf39e9930', class: { [`ic-theme-${theme}`]: theme !== "inherit" }, role: announced ? "status" : null, "aria-label": "Status" }, index.h("strong", { key: '7e2ec2e04c901980e1171373a9b671b75b6a7d07', class: {
                 ["tag"]: true,
                 [`${variant}-${status}`]: true,
                 ["outlined"]: variant === "outlined",
                 [`${size}`]: true,
-            } }, index.h("ic-typography", { key: '3af29b781e35ed4817043d4f2f697f468502189a', variant: uppercase ? "label-uppercase" : "label", "apply-vertical-margins": false }, index.h("span", { key: '4f4759e8dabfff3d686ed3e4cd3975cc0b0c33b4' }, label)))));
+            } }, index.h("ic-typography", { key: '060d641be483e3f6406ef415931f5cebdb8da2c8', variant: uppercase ? "label-uppercase" : "label", "apply-vertical-margins": false }, index.h("span", { key: '4e78eb5d8af2fdcb5b4d083ad0cb1adc4b61ec0e' }, label)))));
     }
 };
 StatusTag.style = IcStatusTagStyle0;

package/dist/cjs/ic-step.cjs.entry.js

@@ -87,27 +87,27 @@ const Step = class {
         // STATUS ICON FOR COMPACT STEP
         let statusIcon;
         if (type === "completed" || compactStepStyling === "completed") {
-            statusIcon = (index.h("span", { key: '4d1011a9a12449bd324aff3f404522fde6912be3', class: "check-icon step-icon", "aria-hidden": "true", innerHTML: checkIcon.Check }));
+            statusIcon = (index.h("span", { key: 'b90ba4eba47bd4dda8a547010d3e701f07e96ff1', class: "check-icon step-icon", "aria-hidden": "true", innerHTML: checkIcon.Check }));
         }
         else if (type === "disabled" || compactStepStyling === "disabled") {
-            statusIcon = (index.h("span", { key: '7825f61e87546bcaa9100c439239022abb0f3eb7', class: "warning-icon step-icon", "aria-hidden": "true", innerHTML: warningIcon }));
+            statusIcon = (index.h("span", { key: '46566361dcad0d5a29ad7f28fe2224f5ac813152', class: "warning-icon step-icon", "aria-hidden": "true", innerHTML: warningIcon }));
         }
         // COMPACT STEP COMPONENT
-        const compactStep = (index.h("div", { key: '82c7c26c90ce286582f7ef477129d2ce241200c1', class: {
+        const compactStep = (index.h("div", { key: 'f5f4f7d6a4923975cb16a023a128e948f6af8d37', class: {
                 ["step"]: true,
                 ["current"]: !!current,
                 [`compact-step-${compactStepStyling}`]: !!compactStepStyling,
                 ["disabled"]: type === "disabled" || compactStepStyling === "disabled",
-            } }, index.h("ic-loading-indicator", { key: 'd3d1b2aa382bd8b307433f16aa05f644b275902f', class: {
+            } }, index.h("ic-loading-indicator", { key: '9c68a687dfe74aef9d5402a22b849be5adde9e9e', class: {
                 "compact-step-progress-indicator": true,
                 "not-required": type === "disabled" || compactStepStyling === "disabled",
-            }, "aria-hidden": "true", size: "small", "inner-label": stepNum, progress: progress }), index.h("div", { key: 'd0f78f477b4fe29b2ac33798712b70c0c3d2ce41', class: "heading-area" }, helpers.isSlotUsed(this.el, "heading") ? (index.h("slot", { name: "heading" })) : (index.h("ic-typography", { variant: "h4", class: "heading" }, heading)), index.h("div", { key: 'f9a074c126d393ec82cf72621e5941c32dbd72fb', class: "info-line" }, index.h("ic-typography", { key: '1b6bd91bcb1013fa1e23a9e9af49d3da1f25448e', variant: "caption", class: "step-num" }, `${stepNum} ${icI18n.of} ${lastStepNum}`, index.h("span", { key: '753bbc4c12a2b968cde11238f46ff4ffbc4f39fd', class: "visually-hidden" }, ` ${icI18n.steps}`)), (this.subheading ||
+            }, "aria-hidden": "true", size: "small", "inner-label": stepNum, progress: progress }), index.h("div", { key: 'e084007d227386e58d9f709bc5c2cf7b4a316626', class: "heading-area" }, helpers.isSlotUsed(this.el, "heading") ? (index.h("slot", { name: "heading" })) : (index.h("ic-typography", { variant: "h4", class: "heading" }, heading)), index.h("div", { key: '4010df0644f1cffe57f8f34bf165ede6743836b9', class: "info-line" }, index.h("ic-typography", { key: 'cd19369014430c710590a2e8feba86224022444e', variant: "caption", class: "step-num" }, `${stepNum} ${icI18n.of} ${lastStepNum}`, index.h("span", { key: '75135b7a00db90e483ad6dcfdd624cc3f8e90202', class: "visually-hidden" }, ` ${icI18n.steps}`)), (this.subheading ||
             type === "completed" ||
             type === "disabled" ||
             (this.variant === "compact" &&
                 !!compactStepStyling &&
                 compactStepStyling !== "active") ||
-            !!status) && (index.h("div", { key: '93968f9752cf90df5f67994a3942f38d94323b50', class: "step-status" }, statusIcon !== undefined && statusIcon, (subheading || stepType) && (index.h("ic-typography", { key: 'd1879f9dc5a7ea2e9b468fc95593056527e08095', variant: "caption" }, subheading !== null && helpers.isPropDefined(subheading)
+            !!status) && (index.h("div", { key: 'adeabd1fd1668c0689ccba491b17579d5491dc2d', class: "step-status" }, statusIcon !== undefined && statusIcon, (subheading || stepType) && (index.h("ic-typography", { key: 'f3454673badfbbdd1b5e15e92902050c51a2b07b', variant: "caption" }, subheading !== null && helpers.isPropDefined(subheading)
             ? subheading
             : type === "disabled" ||
                 (variant === "compact" &&
@@ -120,26 +120,26 @@ const Step = class {
         // ICON FOR DEFAULT STEP
         let icon;
         if (type !== "completed") {
-            icon = (index.h("ic-typography", { key: 'e76d3c6f2fc82ae27e9f19af2ad29374c75271b1', variant: "subtitle-small" }, index.h("span", { key: '2ada7f696f0e90ecca298a2109d9aaeb70777a1a', class: "step-icon-inner", "aria-hidden": "true" }, this.stepNum)));
+            icon = (index.h("ic-typography", { key: '44128ff95829366b8b12045763fdb2a5aea9e21b', variant: "subtitle-small" }, index.h("span", { key: 'd3bacdb5ba89356a38cd92470eb84272a3996fde', class: "step-icon-inner", "aria-hidden": "true" }, this.stepNum)));
         }
         else {
-            icon = (index.h("div", { key: '195a5f5dd31061a4059020d7fa1d65b15eb29a11', class: "step-icon-inner", "aria-hidden": "true" }, index.h("span", { key: 'd11d3bf512968fa286309bcd69faa20cd12d3396', class: "check-icon", innerHTML: checkIcon.Check })));
+            icon = (index.h("div", { key: 'fb984a7273ba46b3fdc088349e9fce02b8f3d586', class: "step-icon-inner", "aria-hidden": "true" }, index.h("span", { key: '510ba94dc70ec87727f9d2cdc603e032c22922ce', class: "check-icon", innerHTML: checkIcon.Check })));
         }
         // STEP CONNECT FOR DEFAULT STEP
-        const partialBar = type === "current" && (index.h("div", { key: '5564ceeb1d40367572f3ae679e7212a2a2a53578', class: "step-connect-inner" }));
-        const finalStep = !lastStep && (index.h("div", { key: 'fae846f5c7d46ad65c7d21a2785526ed6d841444', class: {
+        const partialBar = type === "current" && (index.h("div", { key: '4b5eff7f3e115a8416a0d7b57780e1cab7681058', class: "step-connect-inner" }));
+        const finalStep = !lastStep && (index.h("div", { key: 'e3550d0d527981b7e455d7f2c36ad925f551bde2', 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 = (index.h("div", { key: 'f02d7139a59a46207e7bd308cf90ffd42c14a93e', class: {
+        const defaultStep = (index.h("div", { key: '244453c9e732a101832a953a438c93322e2e0e09', class: {
                 ["step"]: true,
                 [`${type}`]: true,
-            } }, index.h("div", { key: 'd3cb91eb9ae01c50255fefe75c9cf15dac9899a2', class: "step-top" }, index.h("div", { key: '71afc47b70d57c6d98aacd824c304e661d97a97d', class: "step-icon" }, icon), finalStep), (hasHeading || subheading || status) && (index.h("div", { key: '7b11bdfc83c4071d6aff8f026e7ab32f2033a666', class: "heading-area" }, helpers.isSlotUsed(this.el, "heading") ? (index.h("slot", { name: "heading" })) : (index.h("ic-typography", { variant: "subtitle-large", class: "heading" }, heading)), hasHeading && (subheading || status) && (index.h("ic-typography", { key: '10da1844c1af5252f89bc59254e23c45c5400a2d', variant: "caption", class: "subheading" }, subheading !== null && helpers.isPropDefined(subheading)
+            } }, index.h("div", { key: '65bed254efe5970c3c115d18cd60f597670ce6b0', class: "step-top" }, index.h("div", { key: 'a8e79bfa9ded3a224d634a30062799611ff654ff', class: "step-icon" }, icon), finalStep), (hasHeading || subheading || status) && (index.h("div", { key: '526d11252e72905887bf6fbfd0a40efdb3a15f60', class: "heading-area" }, helpers.isSlotUsed(this.el, "heading") ? (index.h("slot", { name: "heading" })) : (index.h("ic-typography", { variant: "subtitle-large", class: "heading" }, heading)), hasHeading && (subheading || status) && (index.h("ic-typography", { key: '13c8779c38422f01ad9b1b38acf224fcb85a0767', variant: "caption", class: "subheading" }, subheading !== null && helpers.isPropDefined(subheading)
             ? subheading
             : stepStatus))))));
-        return (index.h(index.Host, { key: '6605252cf1e05ba81b2adbcf6e41f2c9c23b1f09', role: "listitem", "aria-label": `${icI18n.step} ${stepNum}${ariaLabel}`, "aria-current": (current || type === "current") && "step", class: {
+        return (index.h(index.Host, { key: '92aa3a74f7b073e325a21c446b7d4cce619b9dea', role: "listitem", "aria-label": `${icI18n.step} ${stepNum}${ariaLabel}`, "aria-current": (current || 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-${variant}`]: true,

package/dist/cjs/ic-stepper.cjs.entry.js

@@ -289,11 +289,11 @@ const Stepper = class {
         helpers.checkResizeObserver(this.runResizeObserver);
     }
     render() {
-        return (index.h(index.Host, { key: '4fbff633235fba3d0c146427b74d1c4e69cff419', class: {
+        return (index.h(index.Host, { key: '43ebd8034b0dc4cad15543c27a8c668b9e7326af', class: {
                 [`ic-stepper-${this.variant}`]: true,
                 ["ic-stepper-aligned-left"]: this.variant === "default" && this.aligned === "left",
                 [`ic-theme-${this.theme}`]: this.theme !== "inherit",
-            } }, index.h("ul", { key: '452b6724f1b286aa3ff75fd460cdc4dfa36e8e55', class: "step-item-list" }, index.h("slot", { key: 'e6e6465ee3c505fab2bbe1c7c502defa7e587571' }))));
+            } }, index.h("ul", { key: '8952857df3eb9fef64eb467ee2c89c78672b9c22', class: "step-item-list" }, index.h("slot", { key: 'e22c1e35f0679a1caf67c1552ea3534932c76949' }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ic-switch.cjs.entry.js

@@ -99,15 +99,15 @@ const Switch = class {
     render() {
         const { label, checkedState, size, disabled, name, value, hideLabel, helperText, inputId, theme, } = this;
         helpers.renderHiddenInput(this.el, checkedState ? value : "", name, disabled);
-        return (index.h(index.Host, { key: '5c000ca3e49cd14427153c3621794df417e8cf20', class: {
+        return (index.h(index.Host, { key: '85b905e7a3d8cb86e6d61ef5b54f330f50c2d3c1', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, index.h("label", { key: '8460399d045a653d8c5e3c93f87d2759b99d4095', class: {
+            } }, index.h("label", { key: '9e22110d5b1de8c730a24ca2149ae7b6e5d74c82', class: {
                 "ic-switch-container": true,
                 "ic-switch-disabled": !!disabled,
                 [`ic-switch-${size}`]: true,
-            }, htmlFor: inputId }, !hideLabel && (index.h("ic-input-label", { key: '5bd95a31f589a3569373427072b91153b9af825d', for: inputId, label: label, helperText: helperText, readonly: false, disabled: disabled, class: {
+            }, htmlFor: inputId }, !hideLabel && (index.h("ic-input-label", { key: '7bdf109dc8ba30c4112d21ce8f8bdab24712b2cc', for: inputId, label: label, helperText: helperText, readonly: false, disabled: disabled, class: {
                 "ic-switch-label": true,
-            } }, index.h("slot", { key: 'a89047529ee17453676191651624842e5b1643ff', name: "helper-text", slot: "helper-text" }))), !hideLabel && index.h("span", { key: 'ef6b29d8bfa4ad565aca3fdadc61f9d7e9c8a51c', class: "ic-switch-line-break" }), index.h("input", { key: '0299a7208ea94969af14ded8f92a3c602e4d9260', checked: checkedState, disabled: disabled, "aria-label": label, "aria-checked": checkedState ? "true" : "false", "aria-describedby": helpers.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 }), index.h("span", { key: '5576c0aff81d9a5825111f62a00dfc69516ff52d', class: "ic-switch-toggle" }, index.h("span", { key: '3bd162d8cd5b5d08b1a71625edaa7905d837414b', class: "ic-switch-icon-line", "aria-hidden": "true" }), index.h("svg", { key: '592dd6027032283ed67502269b80fd6a5ca922ae', class: "ic-switch-icon", "aria-hidden": "true", focusable: "false", viewBox: "0 0 8 8", xmlns: "http://www.w3.org/2000/svg", fill: "none" }, index.h("circle", { key: '6479b349e98272f1578e84b7213949ed064e84f7', class: "ic-switch-icon-circle", fill: "none", cx: "4", cy: "4", r: "3.5", "vector-effect": "non-scaling-stroke" }))), index.h("slot", { key: '66d14ab0f462f8f050ffb425a154bde647821377', name: "right-adornment" }))));
+            } }, index.h("slot", { key: '1f3f4de4efbc6cdd0b5b0306ff27ac8780e1e47f', name: "helper-text", slot: "helper-text" }))), !hideLabel && index.h("span", { key: '86baca2c69733b230b44b1bdc7e77abbf0cea409', class: "ic-switch-line-break" }), index.h("input", { key: '001d2c6d58ded2aa77dcb5f6d2a80e2a8cdb3524', checked: checkedState, disabled: disabled, "aria-label": label, "aria-checked": checkedState ? "true" : "false", "aria-describedby": helpers.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 }), index.h("span", { key: 'bc1e5f01e53597a87540a46caff33e9ffed4ff0f', class: "ic-switch-toggle" }, index.h("span", { key: 'ba85178e18aae2eb3e194cebb753e7b8897ed82e', class: "ic-switch-icon-line", "aria-hidden": "true" }), index.h("svg", { key: '8de43ad4d2131a4baca546ff67d5be97e023f7a5', class: "ic-switch-icon", "aria-hidden": "true", focusable: "false", viewBox: "0 0 8 8", xmlns: "http://www.w3.org/2000/svg", fill: "none" }, index.h("circle", { key: '094881005f0b9d3141fdad8396dac30d6a275f66', class: "ic-switch-icon-circle", fill: "none", cx: "4", cy: "4", r: "3.5", "vector-effect": "non-scaling-stroke" }))), index.h("slot", { key: '432b56eaca3fb21d04bd97e3faec9241959aee25', name: "right-adornment" }))));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/cjs/ic-tab-context.cjs.entry.js

@@ -234,7 +234,7 @@ const TabContext = class {
         }
     }
     render() {
-        return index.h("slot", { key: '717530e623d11f274e79fe3be4bcbd0ff9e71033' });
+        return index.h("slot", { key: 'f2db3869afceb11de996c0f653c07951c7305e5d' });
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ic-tab-group.cjs.entry.js

@@ -26,11 +26,11 @@ const TabGroup = class {
     }
     render() {
         const { inline, theme, label, monochrome } = this;
-        return (index.h(index.Host, { key: '1681c117c989b999a55a9646350f26efe3dac55c', role: "tablist", "aria-label": label, class: {
+        return (index.h(index.Host, { key: '746c326f525b2691bfb8b9e9f791ed31f8a81294', role: "tablist", "aria-label": label, class: {
                 ["ic-tab-group-inline"]: !!inline,
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 ["ic-tab-group-monochrome"]: !!monochrome,
-            } }, index.h("ic-horizontal-scroll", { key: '86003202cd06e1bbd9f99124c10ceebe9414049d', theme: theme, "focus-trigger": "tabFocus", monochrome: monochrome }, index.h("div", { key: '4e1b79906c19817adf8a4d01332f8066e8d5e1c4', class: "tabs-container" }, index.h("slot", { key: '697f2ce044588082937aff666d1f04976b310785' })))));
+            } }, index.h("ic-horizontal-scroll", { key: '1320fc43a99bceeda1f8e96951b5a418223e16f5', theme: theme, "focus-trigger": "tabFocus", monochrome: monochrome }, index.h("div", { key: '496f3884e5247d4beeabe7bb76e99bd3d00119a5', class: "tabs-container" }, index.h("slot", { key: '06c43c2548f716780e1f91feace9740ddb87381b' })))));
     }
     static get delegatesFocus() { return true; }
 };

package/dist/cjs/ic-tab-panel.cjs.entry.js

@@ -28,10 +28,10 @@ const TabPanel = class {
     }
     render() {
         const { active, theme } = this;
-        return (index.h(index.Host, { key: 'c00d3917329516768eb37409203d897251b75d76', class: {
+        return (index.h(index.Host, { key: '502d4cbb643330e279c6afde8c450b2dc779c1bd', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 "ic-tab-panel-hidden": !active,
-            }, role: "tabpanel", "aria-hidden": `${!active}` }, index.h("div", { key: 'f5cc419286a31c1b6da62a34926dcf8060c12dfd' }, index.h("slot", { key: '05c9bfb071d304e758c0bb8dd780bf000b3d8bf1' }))));
+            }, role: "tabpanel", "aria-hidden": `${!active}` }, index.h("div", { key: '190467658b87437167436d21350a69f33950666d' }, index.h("slot", { key: '17420f5488493a8ce0e3ad31dca3f1bb3a78722e' }))));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/ic-theme.cjs.entry.js

@@ -72,7 +72,7 @@ const Theme = class {
     }
     render() {
         const { themeClass } = this;
-        return (index.h(index.Host, { key: '63d492e3dd31089565a15df543420f375dbad1b6', class: themeClass }, index.h("slot", { key: '479a3cbc49286aa2e3853956721f26a5ee37e9ef' })));
+        return (index.h(index.Host, { key: '5f64aa19e0ea1f3762574949daabfd2ad9f99054', class: themeClass }, index.h("slot", { key: '3f115261b958d3c4287b95fc80564b7f0788fd04' })));
     }
     static get watchers() { return {
         "brandColor": ["watchBrandColorPropHandler"],

package/dist/cjs/ic-toast-region.cjs.entry.js

@@ -46,7 +46,7 @@ const ToastRegion = class {
         }
     }
     render() {
-        return index.h("slot", { key: '28f5e26c6dbfb2de076cff231b72722f1ff403c7' });
+        return index.h("slot", { key: 'fbf09e6464725a2f68a81254e49305ba33c88632' });
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ic-toast.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-d337cd8a.js');
-const closeIcon = require('./close-icon-7f6ef8e4.js');
+const closeIcon = require('./close-icon-30d8bb41.js');
 const constants = require('./constants-4d389abc.js');
 const helpers = require('./helpers-51bab4b5.js');
 
@@ -213,20 +213,20 @@ const Toast = class {
     }
     render() {
         const { variant, heading, message, visible, isManual, dismissButtonAriaLabel, theme, } = this;
-        return (index.h(index.Host, { key: '57c068f4c9a9e3017733432a596f78e2bcbffae6', class: {
+        return (index.h(index.Host, { key: 'cef80fb621cd0b6201b4b2d5fd851e4a498d5142', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 ["ic-toast-hidden"]: !visible,
                 [`ic-toast-variant-${variant}`]: variant !== undefined,
-            }, tabindex: "0", onFocus: this.onFocus, onBlur: this.onBlur, role: isManual ? "dialog" : "alert", "aria-live": isManual ? null : "polite" }, index.h("div", { key: 'e24bd72e435cc443c375eee309ae98fc9e030c0b', class: {
+            }, tabindex: "0", onFocus: this.onFocus, onBlur: this.onBlur, role: isManual ? "dialog" : "alert", "aria-live": isManual ? null : "polite" }, index.h("div", { key: '10abf5970e3c5db7db3045cc056afbcf5e8bbb13', class: {
                 ["container"]: true,
                 [`container-${variant}`]: variant !== undefined,
-            } }, variant && visible && (index.h("div", { key: 'bdabfabb04efcd93ab88ecb691b3baa73fc9da0a', class: "toast-icon-container" }, index.h("div", { key: 'bede66dcf6189ac321e9bee90dc144e9d38a09dc', class: {
+            } }, variant && visible && (index.h("div", { key: '4924bda7ebc227ed24d396a7f3c4263b28a1a9e4', class: "toast-icon-container" }, index.h("div", { key: '95c259f5a27fc76ce6e9cc613c06d82dd9042e51', class: {
                 ["divider"]: true,
                 [`divider-${variant}`]: true,
-            } }), variant === "neutral" ? (index.h("slot", { name: "neutral-icon" })) : (index.h("span", { class: "toast-icon", innerHTML: constants.VARIANT_ICONS[variant].icon })))), index.h("div", { key: '57480804dc55695e555a16dd818c5febcaffbe00', class: {
+            } }), variant === "neutral" ? (index.h("slot", { name: "neutral-icon" })) : (index.h("span", { class: "toast-icon", innerHTML: constants.VARIANT_ICONS[variant].icon })))), index.h("div", { key: '285745e35591ea6e756cd6e454bb85bf53ebe881', class: {
                 ["toast-content"]: true,
                 ["no-icon"]: variant === "neutral" && !helpers.isSlotUsed(this.el, "neutral-icon"),
-            } }, index.h("div", { key: '8540288f9f34f0b72c86fa3039d579c93be1277f', class: "toast-text" }, index.h("ic-typography", { key: 'c5e8f2d0a2fe026b430dddf7a81e825845f5ce72', variant: "subtitle-large", class: "toast-heading" }, visible && (isManual ? index.h("h5", null, heading) : index.h("p", null, heading))), message && (index.h("ic-typography", { key: '89fe3df8f98581ef66c1ea74930d9042a579a359', variant: "body", class: "toast-message" }, visible && index.h("p", { key: 'd805d260febad5f8d58aeffe2dfef9f84d6d0911' }, message)))), helpers.isSlotUsed(this.el, "action") && (index.h("div", { key: 'c9cfd3cd4bf5f77cea072bb15f8629ab4a368ad0', class: "toast-action-container" }, index.h("slot", { key: '26b2fb447b937f327719edfe531e5b1260fa7c6c', name: "action" })))), !isManual ? (index.h("ic-loading-indicator", { class: "toast-dismiss-timer", theme: "dark", monochrome: true, size: "icon", progress: this.timerProgress, description: "Dismiss timer" })) : (index.h("ic-button", { id: "dismiss-button", innerHTML: closeIcon.closeIcon, onClick: this.dismissAction, variant: "icon-tertiary", "aria-label": dismissButtonAriaLabel })))));
+            } }, index.h("div", { key: 'dc166897b94413e2c3866eb0c0328d62cbf0f0a5', class: "toast-text" }, index.h("ic-typography", { key: '26ea18b090584efff61a52b0f2f844a9c1cfef60', variant: "subtitle-large", class: "toast-heading" }, visible && (isManual ? index.h("h5", null, heading) : index.h("p", null, heading))), message && (index.h("ic-typography", { key: 'd227ddebf0c720551df72337aeaebb072eb89bea', variant: "body", class: "toast-message" }, visible && index.h("p", { key: '79847b1d2d0811d36fac74c91b581c4a9a61eb8c' }, message)))), helpers.isSlotUsed(this.el, "action") && (index.h("div", { key: 'b5267c41c27c60988c3db05f7a3259b3df9243fb', class: "toast-action-container" }, index.h("slot", { key: 'e4c2998404cfc36697eb6e47d981fe229d6941f5', name: "action" })))), !isManual ? (index.h("ic-loading-indicator", { class: "toast-dismiss-timer", theme: "dark", monochrome: true, size: "icon", progress: this.timerProgress, description: "Dismiss timer" })) : (index.h("ic-button", { id: "dismiss-button", innerHTML: closeIcon.closeIcon, onClick: this.dismissAction, variant: "icon-tertiary", "aria-label": dismissButtonAriaLabel })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ic-toggle-button-group.cjs.entry.js

@@ -254,14 +254,14 @@ const ToggleButtonGroup = class {
     }
     render() {
         const { accessibleLabel, disabled, fullWidth, loading, monochrome, outline, theme, } = this;
-        return (index.h(index.Host, { key: 'b312b6cae074758bad82c66446709925e19cf5ce', role: "group", "aria-label": accessibleLabel, tabindex: disabled ? -1 : 0, class: {
+        return (index.h(index.Host, { key: 'ab56f2045174be8e5968420734bf6c8b9f5a256b', role: "group", "aria-label": accessibleLabel, tabindex: disabled ? -1 : 0, class: {
                 "ic-toggle-button-group-disabled": disabled,
                 "ic-toggle-button-group-full-width": fullWidth,
                 "ic-toggle-button-group-loading": loading,
                 "ic-toggle-button-group-monochrome": monochrome,
                 "ic-toggle-button-group-hide-outline": !outline,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, onFocus: this.handleHostFocus }, index.h("slot", { key: '8b09d946e7a8983b66f8bef384901899f88a54af' })));
+            }, onFocus: this.handleHostFocus }, index.h("slot", { key: 'fcc57106e303e056f7c2160808e174981978a665' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ic-toggle-button.cjs.entry.js

@@ -157,7 +157,7 @@ const ToggleButton = class {
     render() {
         const { accessibleLabel, checked, disabled, fullWidth, iconPlacement, monochrome, label, loading, outline, size, theme, tooltipPlacement, variant, } = this;
         const iconVariant = variant === "icon";
-        return (index.h(index.Host, { key: 'a90e2a846a52531dc542d039724dc8516a00ae14', class: {
+        return (index.h(index.Host, { key: '51e7ef6d36426ee5d3d5e9d351cdc187ca33073b', class: {
                 "ic-toggle-button-checked": checked,
                 "ic-toggle-button-disabled": disabled,
                 "ic-toggle-button-icon": iconVariant,
@@ -167,7 +167,7 @@ const ToggleButton = class {
                 "ic-toggle-button-hide-outline": !outline,
                 [`ic-toggle-button-${size}`]: true,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, onFocus: this.handleFocus }, index.h("ic-button", { key: '6f15f0c63675bd099d370ce02e2b02eeac4e913a', "aria-pressed": `${checked}`, variant: iconVariant ? "icon-tertiary" : "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, index.h("slot", { key: '2503823bad70fa984db6c71d16cc863daaede0e3' }), helpers.isSlotUsed(this.el, "icon") && (index.h("slot", { key: '53969441b6446ec012b538c2f3d468ea0e793547', name: "icon", slot: `${iconPlacement}-icon` })), helpers.isSlotUsed(this.el, "badge") && (index.h("slot", { key: '2619be7d1528115db996708b102aadd611fd1b4b', name: "badge", slot: "badge" })))));
+            }, onFocus: this.handleFocus }, index.h("ic-button", { key: '5cdffac929f622e9cb9f68223e19790b2d88d88b', "aria-pressed": `${checked}`, variant: iconVariant ? "icon-tertiary" : "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, index.h("slot", { key: 'a44c32ddde5e25fb5578fbbf401b2748383108c5' }), helpers.isSlotUsed(this.el, "icon") && (index.h("slot", { key: '1c3d1b51c2d982329362451693fede634b3949fc', name: "icon", slot: `${iconPlacement}-icon` })), helpers.isSlotUsed(this.el, "badge") && (index.h("slot", { key: 'bb1f9f00737980b895aee938af606246c2b667c5', name: "badge", slot: "badge" })))));
     }
     static get delegatesFocus() { return true; }
     get el() { return index.getElement(this); }

package/dist/collection/assets/close-icon.svg

@@ -1,5 +1,4 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
-    <path d="M0 0h24v24H0z" fill="none"/>
-    <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/>
+    <path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" fill="currentColor"/>
     <title>close icon</title>
 </svg>

package/dist/collection/components/ic-data-list/ic-data-list.css

@@ -481,6 +481,10 @@ video {
   margin-bottom: var(--ic-space-xs);
 }
 
+:host(.ic-data-list-small) .divider.divider-no-heading {
+  margin-top: 0;
+}
+
 @media (forced-colors: active) {
   .divider {
     background-color: canvastext;

package/dist/collection/components/ic-data-row/ic-data-row.css

@@ -479,7 +479,7 @@ slot[name="value"]::slotted(ic-text-field[readonly][hide-label]) {
   margin-top: calc(var(--ic-space-xs) * -1);
 }
 
-slot[name="value"]::slotted(ic-text-field[small][readonly][hide-label]) {
+slot[name="value"]::slotted(ic-text-field[size="small"][readonly][hide-label]) {
   margin-top: calc(var(--ic-space-xxs) * -1);
 }
 

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

@@ -687,6 +687,25 @@ video {
   pointer-events: none;
 }
 
+.focus-border {
+  border-radius: var(--ic-border-radius);
+  padding: var(--ic-space-xxs);
+  border: var(--ic-space-xxxs) dashed transparent;
+  border-color: var(--ic-popover-menu-border);
+  background-color: var(--ic-color-focus-inner) !important;
+
+  --icon-height: auto;
+}
+
+.focus-disabled {
+  background-color: var(--ic-color-focus-inner) !important;
+  padding: calc(var(--ic-space-xs) - var(--ic-space-xxxs) - var(--ic-space-xxs))
+    calc(
+      var(--ic-space-xs) - var(--ic-space-1px) - var(--ic-space-xxxs) -
+        var(--ic-space-xxs)
+    );
+}
+
 .focused-option,
 .focused-option .option-description {
   background-color: var(--ic-color-focus-inner) !important;

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

@@ -121,30 +121,34 @@ export class Menu {
             }
         };
         this.setNextOptionValue = (selectedOptionIndex) => {
-            if (this.ungroupedOptions[selectedOptionIndex + 1]) {
-                this.menuOptionSelect.emit({
-                    value: this.ungroupedOptions[selectedOptionIndex + 1][this.valueField],
-                    optionId: this.getOptionId(this.ungroupedOptions[selectedOptionIndex + 1][this.valueField]),
+            const nextIndex = selectedOptionIndex % this.ungroupedOptions.length;
+            const nextOption = this.ungroupedOptions[nextIndex];
+            this.setHighlightedOption(nextIndex);
+            if (nextOption.disabled) {
+                this.menuOptionId.emit({
+                    optionId: this.getOptionId(nextOption[this.valueField]),
                 });
             }
             else {
                 this.menuOptionSelect.emit({
-                    value: this.ungroupedOptions[0][this.valueField],
-                    optionId: this.getOptionId(this.ungroupedOptions[0][this.valueField]),
+                    value: nextOption[this.valueField],
+                    optionId: this.getOptionId(nextOption[this.valueField]),
                 });
             }
         };
         this.setPreviousOptionValue = (selectedOptionIndex) => {
-            if (this.ungroupedOptions[selectedOptionIndex - 1]) {
-                this.menuOptionSelect.emit({
-                    value: this.ungroupedOptions[selectedOptionIndex - 1][this.valueField],
-                    optionId: this.getOptionId(this.ungroupedOptions[selectedOptionIndex - 1][this.valueField]),
+            const prevIndex = selectedOptionIndex % this.ungroupedOptions.length;
+            const prevOption = this.ungroupedOptions[prevIndex];
+            this.setHighlightedOption(prevIndex);
+            if (prevOption.disabled) {
+                this.menuOptionId.emit({
+                    optionId: this.getOptionId(prevOption[this.valueField]),
                 });
             }
             else {
                 this.menuOptionSelect.emit({
-                    value: this.ungroupedOptions[this.ungroupedOptions.length - 1][this.valueField],
-                    optionId: this.getOptionId(this.ungroupedOptions[this.ungroupedOptions.length - 1][this.valueField]),
+                    value: prevOption[this.valueField],
+                    optionId: this.getOptionId(prevOption[this.valueField]),
                 });
             }
         };
@@ -175,7 +179,7 @@ export class Menu {
                     const nextIndex = selectedOptionIndex < this.ungroupedOptions.length - 1
                         ? selectedOptionIndex + 1
                         : 0;
-                    this.setNextOptionValue(selectedOptionIndex);
+                    this.setNextOptionValue(nextIndex);
                     this.emitOptionId(nextIndex);
                     break;
                 }
@@ -185,7 +189,7 @@ export class Menu {
                     const prevIndex = selectedOptionIndex > 0
                         ? selectedOptionIndex - 1
                         : this.ungroupedOptions.length - 1;
-                    this.setPreviousOptionValue(selectedOptionIndex);
+                    this.setPreviousOptionValue(prevIndex);
                     this.emitOptionId(prevIndex);
                     break;
                 }
@@ -224,6 +228,7 @@ export class Menu {
                         if (this.searchBar &&
                             options[highlightedOptionIndex].disabled === true) {
                             this.disabledOptionSelected = true;
+                            this.optionHighlighted = undefined;
                         }
                         else {
                             this.setInputValue(highlightedOptionIndex);
@@ -449,14 +454,15 @@ export class Menu {
         };
         this.setInputValue = (highlightedOptionIndex) => {
             const menuOptions = this.getMenuOptions();
-            if (menuOptions[highlightedOptionIndex] !== undefined) {
+            if (menuOptions[highlightedOptionIndex] !== undefined &&
+                !menuOptions[highlightedOptionIndex].disabled) {
                 this.menuOptionSelect.emit({
                     value: menuOptions[highlightedOptionIndex][this.valueField],
                 });
-                if (this.closeOnSelect) {
-                    this.optionHighlighted = undefined;
-                    this.menuOptionId.emit({ optionId: undefined });
-                }
+            }
+            if (this.closeOnSelect) {
+                this.optionHighlighted = undefined;
+                this.menuOptionId.emit({ optionId: undefined });
             }
             if (this.closeOnSelect) {
                 if (!this.hasTimedOut) {
@@ -613,11 +619,12 @@ export class Menu {
             var _a, _b;
             // Select all if there is either no value or not all options are selected
             // 'true' means select all, 'false' means clear all
+            const enabledOptionsCount = this.ungroupedOptions.filter((option) => !option.disabled).length;
             this.menuOptionSelectAll.emit({
-                select: !this.value || !(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) === this.ungroupedOptions.length),
+                select: !this.value || !(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) === enabledOptionsCount),
             });
-            // Emit clear event if all options are selected
-            if (((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) === this.ungroupedOptions.length) {
+            // Emit clear event if all non-disabled options are selected
+            if (((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) === enabledOptionsCount) {
                 this.icClear.emit();
             }
         };
@@ -630,7 +637,10 @@ export class Menu {
         this.autoSetValueOnMenuKeyDown = (event) => {
             var _a;
             event.cancelBubble = true;
-            const selectedOptionIndex = this.ungroupedOptions.findIndex((option) => option[this.valueField] === this.value);
+            const highlightedOptionIndex = this.getOptionHighlightedIndex();
+            const selectedOptionIndex = highlightedOptionIndex >= 0
+                ? highlightedOptionIndex
+                : this.ungroupedOptions.findIndex((option) => option[this.valueField] === this.value);
             const isSearchableSelect = !!this.inputEl && this.inputEl.tagName === "INPUT";
             this.keyboardNav = false;
             switch (event.key) {
@@ -640,20 +650,22 @@ export class Menu {
                 case "ArrowUp":
                     if (!this.hasTimedOut) {
                         event.preventDefault();
-                        this.setPreviousOptionValue(selectedOptionIndex);
-                        this.emitOptionId(selectedOptionIndex > 0
+                        const prevIndex = selectedOptionIndex > 0
                             ? selectedOptionIndex - 1
-                            : this.ungroupedOptions.length - 1);
+                            : this.ungroupedOptions.length - 1;
+                        this.setPreviousOptionValue(prevIndex);
+                        this.emitOptionId(prevIndex);
                         this.keyboardNav = true;
                     }
                     break;
                 case "ArrowDown":
                     if (!this.hasTimedOut) {
                         event.preventDefault();
-                        this.setNextOptionValue(selectedOptionIndex);
-                        this.emitOptionId(selectedOptionIndex < this.ungroupedOptions.length - 1
+                        const nextIndex = selectedOptionIndex < this.ungroupedOptions.length - 1
                             ? selectedOptionIndex + 1
-                            : 0);
+                            : 0;
+                        this.setNextOptionValue(nextIndex);
+                        this.emitOptionId(nextIndex);
                         this.keyboardNav = true;
                     }
                     break;
@@ -754,7 +766,7 @@ export class Menu {
                     if (option.children) {
                         option.children.map((option) => !option.disabled && this.ungroupedOptions.push(option));
                     }
-                    else if (!option.disabled) {
+                    else {
                         this.ungroupedOptions.push(option);
                     }
                 });
@@ -784,6 +796,9 @@ export class Menu {
             return (h(Fragment, null, option.loading && h("ic-loading-indicator", { size: "icon" }), h("div", { class: {
                     "option-text-container": true,
                     "show-check-icon": showCheckIcon,
+                    "focus-border": (this.keyboardNav || this.initialOptionsListRender) &&
+                        option[this.valueField] === this.optionHighlighted &&
+                        !!option.disabled,
                 } }, (option.icon || !option.hideLabel) && (h("div", { class: "option-label" }, option.icon && (h("div", { class: "option-icon", innerHTML: sanitizeHTMLIconString(option.icon), "aria-hidden": "true" })), !option.hideLabel && (h("ic-typography", { variant: "body", "aria-hidden": "true" }, option[this.labelField])))), option.description && (h("ic-typography", { id: `${this.getOptionId(option[this.valueField])}-description`, class: "option-description", variant: "caption", "aria-hidden": "true" }, h("p", null, option.description))), option.element && (h("div", { class: {
                     "option-element": option.icon || !option.hideLabel || option.description,
                 }, innerHTML: sanitizeHTMLString(option.element.component), "aria-hidden": "true" }))), showCheckIcon && (h("span", { class: "check-icon", innerHTML: Check, "aria-hidden": "true" }))));
@@ -795,8 +810,18 @@ export class Menu {
                     option: true,
                     "focused-option": isManualMode
                         ? (keyboardNav || initialOptionsListRender) &&
-                            option[this.valueField] === optionHighlighted
-                        : keyboardNav && selected,
+                            option[this.valueField] === optionHighlighted &&
+                            !option.disabled
+                        : keyboardNav &&
+                            option[this.valueField] === optionHighlighted &&
+                            !option.disabled,
+                    "focus-disabled": isManualMode
+                        ? (keyboardNav || initialOptionsListRender) &&
+                            option[this.valueField] === optionHighlighted &&
+                            !!option.disabled
+                        : keyboardNav &&
+                            option[this.valueField] === optionHighlighted &&
+                            !!option.disabled,
                     "last-recommended-option": !!(option.recommended &&
                         options[index + 1] &&
                         !options[index + 1].recommended),
@@ -990,9 +1015,10 @@ export class Menu {
     }
     render() {
         const { inputLabel, options, menuId, value, fullWidth, hasTimedOut, isLoading, size, open, inputEl, keyboardNav, parentEl, SEARCH_BAR_TAG, multiSelect, } = this;
-        const selectAllButtonText = `${(value === null || value === void 0 ? void 0 : value.length) === this.ungroupedOptions.length ? "Clear" : "Select"} all`;
+        const enabledOptionsCount = this.ungroupedOptions.filter((option) => !option.disabled).length;
+        const selectAllButtonText = `${(value === null || value === void 0 ? void 0 : value.length) === enabledOptionsCount ? "Clear" : "Select"} all`;
         const hasNoResults = this.host.classList.contains("no-results");
-        return (h(Host, { key: 'c8002b0985f20231f9e24b2e446a67cf3230be7e', class: {
+        return (h(Host, { key: 'f2126f99757d13606827ea1eac7c08b023b97bae', class: {
                 "ic-menu-full-width": !!fullWidth,
                 "ic-menu-no-focus": ((inputEl === null || inputEl === void 0 ? void 0 : inputEl.tagName) === "INPUT" &&
                     (parentEl === null || parentEl === void 0 ? void 0 : parentEl.tagName) !== SEARCH_BAR_TAG) ||
@@ -1001,7 +1027,7 @@ export class Menu {
                 [`ic-menu-${size}`]: true,
                 "ic-menu-open": open && options.length !== 0,
                 "ic-menu-multiple": multiSelect,
-            } }, options.length !== 0 && (h("ul", { key: 'c7f0134bd0f14aae16fc4f2f0ba20f72553e4af5', id: menuId, class: "menu", role: "listbox", "aria-label": `${inputLabel} pop-up`, "aria-multiselectable": multiSelect ? "true" : "false", "aria-activedescendant": this.optionHighlighted
+            } }, options.length !== 0 && (h("ul", { key: '9b41a2c0ab9d6b08dca829db341614b248675050', id: menuId, class: "menu", role: "listbox", "aria-label": `${inputLabel} pop-up`, "aria-multiselectable": multiSelect ? "true" : "false", "aria-activedescendant": this.optionHighlighted
                 ? this.getOptionId(this.optionHighlighted)
                 : undefined, tabindex: !this.allowMenuFocus
                 ? "-1"
@@ -1033,7 +1059,7 @@ export class Menu {
             multiSelect &&
             !isLoading &&
             !hasTimedOut &&
-            !hasNoResults && (h("div", { key: '6dc5d80d88ac368c6274e709ba5a8a1dc79bf9e8', class: "option-bar" }, h("ic-typography", { key: '5a62bb37a7c338c00e296519077a8254c39c1c4a' }, h("p", { key: 'd5209b3fa671a87fc4ad2039732315d51d042c9f' }, `${value ? value.length : 0}/${getOptionsWithoutGroupTitlesCount(this.options)} selected`)), h("ic-button", { key: '543d14896d83e275257adf6808a4f855b694a5d4', class: "select-all-button", "aria-label": `${selectAllButtonText} options for ${inputLabel}`, ref: (el) => (this.selectAllButton = el), variant: "tertiary", onClick: this.handleSelectAllClick, onMouseDown: this.handleSelectAllMouseDown, onBlur: this.handleSelectAllBlur, onFocus: this.handleSelectAllFocus, size: size === "small" ? "small" : "medium" }, selectAllButtonText)))));
+            !hasNoResults && (h("div", { key: '7440008eccba1fc099d09ae3916e0d186686d59e', class: "option-bar" }, h("ic-typography", { key: '802bd46a5d028a541060eb4cc57c2c4607cb1b86' }, h("p", { key: '17a482e5bbff099b44550f9800980a649a319358' }, `${value ? value.length : 0}/${getOptionsWithoutGroupTitlesCount(this.options)} selected`)), h("ic-button", { key: '5aa400fd2be98bc038400b699c33bd2b1814cb5d', class: "select-all-button", "aria-label": `${selectAllButtonText} options for ${inputLabel}`, ref: (el) => (this.selectAllButton = el), variant: "tertiary", onClick: this.handleSelectAllClick, onMouseDown: this.handleSelectAllMouseDown, onBlur: this.handleSelectAllBlur, onFocus: this.handleSelectAllFocus, size: size === "small" ? "small" : "medium" }, selectAllButtonText)))));
     }
     static get is() { return "ic-menu"; }
     static get encapsulation() { return "scoped"; }