npm - @ukic/web-components - Versions diffs - 3.6.0 → 3.8.0 - Mend

@ukic/web-components 3.6.0 → 3.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (468) hide show

package/dist/components/ic-card-vertical.js CHANGED Viewed

@@ -145,19 +145,19 @@ const CardVertical = /*@__PURE__*/ proxyCustomElement(class CardVertical extends
             rel: rel,
             target: target,
         };
-        return (h(Host, { key: 'd62f341e096d81fa917e578aa55c99d6d828c9e3', class: {
+        return (h(Host, { key: '2dc8070692fc796401c84c6156d1f66c8053310a', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h(Component, Object.assign({ key: '742b03d9281d850a9052638038980b45ca567c17', class: {
+            } }, h(Component, Object.assign({ key: 'a1a8763990ed7e5ac5eecfc69e4b29ab184b9e6e', class: {
                 card: true,
                 clickable: !!clickable && !disabled,
                 disabled: !!disabled,
                 fullwidth: !!fullWidth,
                 focussed: isFocussed,
                 monochrome: monochrome,
-            }, tabindex: clickable && !parentIsAnchorTag ? 0 : undefined, "aria-disabled": disabled ? "true" : null, disabled: disabled }, attrs), isSlotUsed(this.el, "image-top") && (h("div", { key: 'd5f584871df498cf11acb97ff3694115d4819a73', class: "image-top" }, h("slot", { key: '88fa5d9566421a5ca724622bb11b0ad593babecb', name: "image-top" }))), h("div", { key: '3211c93ebca0fcddad4ac7ce75999ab8d7939442', class: "card-header" }, isSlotUsed(this.el, "icon") && (h("div", { key: 'c80cf3c24f0cbdf7cac901ee8c945c4d1432fe9f', class: "icon" }, h("slot", { key: '7e087604510f545b891f104f972ee50ac686b9be', name: "icon" }))), h("div", { key: '02bc7be8d85faee7b497c2b2608d80f70b79ec86', class: "card-title" }, h("slot", { key: 'e5285ad53121d899dd27966860b664fe1ecc388f', name: "heading" }, h("ic-typography", { key: '00573eddbbdd537b86a1331bd2b2db4a443a13c0', variant: "h4" }, h("p", { key: 'bccc52bc8feadd3abe0cd8092819258dc2e155c8' }, heading)))), isSlotUsed(this.el, "interaction-button") && (h("div", { key: 'f9f2baeee122976ab5ffa8e3dff9027bb78db6b4', class: "interaction-button" }, h("slot", { key: '01b087c7b7ff9fa54dfb1171c5a4899cf090b45c', name: "interaction-button" })))), (subheading || isSlotUsed(this.el, "subheading")) && (h("div", { key: '81f19c8c0d726ebbb35f71375a35fac342e4e7cd', class: "subheading" }, h("slot", { key: '17c871d9694857824afb3c9f7593c8498873d810', name: "subheading" }, h("ic-typography", { key: '9ca1068e95a3c69def8ec0bf82135dd36ed57fbc', variant: "subtitle-small" }, subheading)))), isSlotUsed(this.el, "adornment") && (h("div", { key: 'e43dadfb629c3a5dd28a6b1c46555dfade8d498f', class: "adornment" }, h("slot", { key: 'b8f63d79ffaff166020d643497ad8b92f4580a0e', name: "adornment" }))), isSlotUsed(this.el, "image-mid") && (h("div", { key: '1077bd869310c629a1b154e031dbed14559798b7', class: "image-mid" }, h("slot", { key: 'f598c5ddfb5a591f3988c49b3f7be1e84fb87552', name: "image-mid" }))), (message || isSlotUsed(this.el, "message")) && (h("div", { key: '08d46a26aac3972495cc7724ff8fbd55cc90a31c', class: "card-message" }, message && (h("ic-typography", { key: '50c632b1ac9fed137e668ceec4f1fe35f9a2cf99', variant: "body" }, message)), isSlotUsed(this.el, "message") && h("slot", { key: '2b971484237d985d4318993477d39b5f6d1e8f0d', name: "message" }))), (isSlotUsed(this.el, "interaction-controls") || expandable) && (h("div", { key: '3e7f6bc8df858349187486fb9e9ebec56d42d0a5', class: "interaction-area" }, h("div", { key: '4fd96e05aa6daef84d93d8f1da4dd80b2d349623', class: "interaction-controls" }, h("slot", { key: '2f690307f464bb1f710344723b2f76078334ea30', name: "interaction-controls" })), expandable && (h("ic-tooltip", { key: '9880fae8f9a52bdfe1820df5cbfc92af33080e2a', id: "ic-tooltip-expand-button", label: "Toggle expandable area", silent: true }, h("button", { key: '0d1656a001fa061ebae17757a560ba11dae90339', class: {
+            }, tabindex: clickable && !parentIsAnchorTag ? 0 : undefined, "aria-disabled": disabled ? "true" : null, disabled: disabled }, attrs), isSlotUsed(this.el, "image-top") && (h("div", { key: '2c12f461a8b8972d8a4de1a6560a2c52ecadc36f', class: "image-top" }, h("slot", { key: '9afec40e5ef6b57a10ca922d7f3da378f962200f', name: "image-top" }))), h("div", { key: 'bb92939da24dbfa2fb2e4bc2606d4f7ef9d2ba37', class: "card-header" }, isSlotUsed(this.el, "icon") && (h("div", { key: '165af9342325b430548209cf2bcd5b9781b752fd', class: "icon" }, h("slot", { key: '4b2cdd47b1f2abfc16097dee848b630c93c1b835', name: "icon" }))), h("div", { key: '02f1b6357a696bc43b9d5cc7c8030647b52e311c', class: "card-title" }, h("slot", { key: 'b71ca0fa6a4aeb1cf75579920a66f58abe11d5ae', name: "heading" }, h("ic-typography", { key: '63f9c6478987888f41a53d5beadec2b3deaa52ae', variant: "h4" }, h("p", { key: '6d642c20d4656a408cf439c969a1895cb834c15e' }, heading)))), isSlotUsed(this.el, "interaction-button") && (h("div", { key: '7a44d7d2c17cd980fa14da2a65aa68ddd8832f77', class: "interaction-button" }, h("slot", { key: '6a9e0f0ca96125d94d39b31474c82ffe088ea475', name: "interaction-button" })))), (subheading || isSlotUsed(this.el, "subheading")) && (h("div", { key: 'dc19ca8ae488c30aa1fc58e56db23fc0dc2a2c0f', class: "subheading" }, h("slot", { key: 'bae9a057f813ef5c5df04befed60d09ccb106857', name: "subheading" }, h("ic-typography", { key: '13a32e2d9bc3258b65edf8a5c385f181f39a2c8d', variant: "subtitle-small" }, subheading)))), isSlotUsed(this.el, "adornment") && (h("div", { key: 'c359631c9d1ed0643290e1db2a5e521d6702b29d', class: "adornment" }, h("slot", { key: '398a65927df066f96bffc5b59b95fd27ec558c12', name: "adornment" }))), isSlotUsed(this.el, "image-mid") && (h("div", { key: '463a2495779d1faca6efd98a3e1425e3486fc0d1', class: "image-mid" }, h("slot", { key: '049daa3cbf2542b0a47951a8758bb50a1ad699e2', name: "image-mid" }))), (message || isSlotUsed(this.el, "message")) && (h("div", { key: '9f6b4ea8e3a8cfa0e8ad58366f4e2a198cb0f8f6', class: "card-message" }, message && (h("ic-typography", { key: '1a32ff3958de50ea5732a0fb52616d04c6ebedcc', variant: "body" }, message)), isSlotUsed(this.el, "message") && h("slot", { key: '0dabb8f6ed9bd42a0982284fa4976734c0d5e16f', name: "message" }))), (isSlotUsed(this.el, "interaction-controls") || expandable) && (h("div", { key: '2d6292c895df325c53cffc72a330720855644c59', class: "interaction-area" }, h("div", { key: 'a8c4c10d85a5608f49dbccb8cb65443d56d64a3f', class: "interaction-controls" }, h("slot", { key: '5caebe86117ec6ef31d096a284aa035153e02a56', name: "interaction-controls" })), expandable && (h("ic-tooltip", { key: '1d66d84f3181cc1694cdf779befca1610c538f71', id: "ic-tooltip-expand-button", label: "Toggle expandable area", silent: true }, h("button", { key: 'eaa2b9484428dab89fb67677b80a09a6174b011b', class: {
                 "toggle-button": true,
                 [`toggle-button-${this.areaExpanded ? "expanded" : "closed"}`]: true,
-            }, "aria-label": "Toggle expandable area", "aria-expanded": `${this.areaExpanded}`, "aria-controls": this.areaExpanded ? "expanded-content-area" : null, onClick: this.toggleExpanded, innerHTML: chevronIcon }))))), isSlotUsed(this.el, "expanded-content") && this.areaExpanded && (h("div", { key: 'dc55cb4419b35c1f5f6b771cf5dc62c1d77626a7', class: "expanded-content", id: "expanded-content-area" }, h("slot", { key: '3b0d0c87d0467ffde6e62ed49b9116280a6c7108', name: "expanded-content" }))), isSlotUsed(this.el, "badge") && h("slot", { key: 'f51d29f2b88429b0e0024c6f9ba34abaf4e1a6d1', name: "badge" }))));
+            }, "aria-label": "Toggle expandable area", "aria-expanded": `${this.areaExpanded}`, "aria-controls": this.areaExpanded ? "expanded-content-area" : null, onClick: this.toggleExpanded, innerHTML: chevronIcon }))))), isSlotUsed(this.el, "expanded-content") && this.areaExpanded && (h("div", { key: 'd896c331bad9e027c4b56dd1fce75bc530218516', class: "expanded-content", id: "expanded-content-area" }, h("slot", { key: '7fc81de39ef8a949674f22089d413bf946befdd7', name: "expanded-content" }))), isSlotUsed(this.el, "badge") && h("slot", { key: '283bff90fab9be3b640ab7d04384d7ce2873bad8', name: "badge" }))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/ic-checkbox-group.js CHANGED Viewed

@@ -100,11 +100,11 @@ const CheckboxGroup = /*@__PURE__*/ proxyCustomElement(class CheckboxGroup exten
         const { disabled, helperText, hideLabel, label, name, required, size, theme, validationStatus, validationText, } = this;
         const describedBy = getInputDescribedByText(this.el, name, helperText !== "", validationStatus !== "");
         const renderSRText = validationStatus === "error" || required || hideLabel;
-        return (h(Host, { key: '3eab3a8d0cc27b77ac7daf1f6d3068533ab675bb', class: {
+        return (h(Host, { key: '977492f0ca432ab5dc9d7435c66cf6aafa8c44f1', class: {
                 "ic-checkbox-group-disabled": !!disabled,
                 [`ic-checkbox-group-${size}`]: true,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, renderSRText && (h("span", { key: '3cbf05ef6c6df9737d8f40ecbe6db5944f8a2406', id: "screenReaderOnlyText", class: "screen-reader-only-text", "aria-hidden": "true" }, label, " ", validationStatus === "error" ? "invalid data " : null, " ", required ? "required" : null)), h("fieldset", { key: 'ce2d74b5e4f88c2cdfc6b730db2b3763c48df206', id: name, "aria-labelledby": `${renderSRText ? "screenReaderOnlyText" : ""} ${describedBy}`.trim(), disabled: disabled }, !hideLabel && (h("legend", { key: '70a1b515ccd08e731837ee10f248163f342536b2' }, h("ic-input-label", { key: '67be3445bb1dee8a2e1ccee88f16ae58fc81c77e', class: { [`${validationStatus}`]: true }, label: label, helperText: helperText, required: required, disabled: disabled, useLabelTag: false }, h("slot", { key: 'be393bdcf6138057e1e0c65082817f590dbcadf7', name: "helper-text", slot: "helper-text" })))), h("div", { key: 'd43399d04efc5501f5a8b118aedbba213410593b', class: "checkboxes-container" }, h("slot", { key: '96c715128256965fb3acbe3ff5eca7bb5be9897b' }))), hasValidationStatus(validationStatus, disabled) && (h("ic-input-validation", { key: '6b4b02fd8819946472c6a0c60c050ef885168312', for: name, ariaLiveMode: "polite", status: validationStatus, message: validationText }))));
+            } }, renderSRText && (h("span", { key: '5a9d1c9fcf5f1b837e4f6ff3ae516db0b105e1ac', id: "screenReaderOnlyText", class: "screen-reader-only-text", "aria-hidden": "true" }, label, " ", validationStatus === "error" ? "invalid data " : null, " ", required ? "required" : null)), h("fieldset", { key: 'c3afb98a671db4dba8229d461c33d4b5a69d5e31', id: name, "aria-labelledby": `${renderSRText ? "screenReaderOnlyText" : ""} ${describedBy}`.trim(), disabled: disabled }, !hideLabel && (h("legend", { key: 'bc4e450767c3fb6f7deb01370d9d1599d4515417' }, h("ic-input-label", { key: '7c0c76b80d4b89673495b56a79cf8a05f0a224f3', class: { [`${validationStatus}`]: true }, label: label, helperText: helperText, required: required, disabled: disabled, useLabelTag: false }, h("slot", { key: '348730e9c8ffbd0701a00e9380a11e403957604b', name: "helper-text", slot: "helper-text" })))), h("div", { key: 'c4065c98766a8447ed51c0a84f953cc70c529d2c', class: "checkboxes-container" }, h("slot", { key: 'cadbff332d84cf70bbbb42f1c40f4cb0bc705e38' }))), hasValidationStatus(validationStatus, disabled) && (h("ic-input-validation", { key: '0259abfb51282b2dfc8ed9aed0a2b97ccb769ac2', for: name, ariaLiveMode: "polite", status: validationStatus, message: validationText }))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/ic-checkbox.js CHANGED Viewed

@@ -111,17 +111,17 @@ const Checkbox = /*@__PURE__*/ proxyCustomElement(class Checkbox extends HTMLEle
         checked
             ? renderHiddenInput(el, value, name, disabled)
             : removeHiddenInput(el);
-        return (h(Host, { key: 'eda047a45e6d0dc558095d7d23b16422633fe633', class: {
+        return (h(Host, { key: '153b0b333ca1d0755d4e52dd9119d48cd1c246cc', class: {
                 "ic-checkbox-disabled": disabled,
                 [`ic-checkbox-${size}`]: !!size,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h("div", { key: '20623bca4b576eb2da3050ce19c99ad5288a6957', class: "container" }, displayIndeterminate ? (h("div", { class: "indeterminate-symbol" })) : (checked && (h("svg", { class: "checkmark", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", "fill-rule": "evenodd", "clip-rule": "evenodd" }, h("title", null, "checkmark icon"), h("path", { d: "M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z" })))), h("input", { key: '37fcfb382fc5aac6c9d07e9ce9e7929e21528c15', role: "checkbox", class: {
+            } }, h("div", { key: 'c0f56ee4fbbdd38fea208d133cdd1fa91a41d6c7', class: "container" }, displayIndeterminate ? (h("div", { class: "indeterminate-symbol" })) : (checked && (h("svg", { class: "checkmark", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", "fill-rule": "evenodd", "clip-rule": "evenodd" }, h("title", null, "checkmark icon"), h("path", { d: "M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z" })))), h("input", { key: 'f8335e54b2f765591b3781d76a01632c34065855', role: "checkbox", class: {
                 checkbox: true,
                 checked,
                 indeterminate: displayIndeterminate,
-            }, ref: (el) => (this.checkboxEl = el), type: "checkbox", name: name, id: id, value: value, disabled: disabled, checked: checked, indeterminate: displayIndeterminate, onClick: handleClick, form: form, "aria-label": hideLabel ? label : undefined }), !hideLabel && (h("ic-typography", { key: '0d8d605e8aa6dcb86362bb561a024a8c03a66854', class: "checkbox-label", variant: "body" }, h("label", { key: '3f2c395f32f47684475a7b6a1cefdb7d67c8beac', htmlFor: id }, label)))), isSlotUsed(el, "additional-field") && (h("div", { key: 'a6701087045999eb177a3a743770dad9aa47c79f', class: "dynamic-container", ref: (el) => (this.additionalFieldContainer = el) }, isDynamicAdditionalField && h("div", { key: '18719e04d6854a600f87fe777fd475b424204875', class: "branch-corner" }), h("div", { key: 'a73508e06dea3c65f731db0050ca365bd31998c9', class: "dynamic-field-container" }, isDynamicAdditionalField && (h("ic-typography", { key: 'd4f422ba5eb1815418871081efc8c5cd55821775', variant: "caption" }, h("p", { key: 'd43c97bdcd3b22acc1ef3664544ca9783606ea15', class: "dynamic-text", "aria-live": "polite" }, dynamicText))), h("div", { key: '66fb65fdd27f2db8550ef58c5601391c7b88357d', class: {
+            }, ref: (el) => (this.checkboxEl = el), type: "checkbox", name: name, id: id, value: value, disabled: disabled, checked: checked, indeterminate: displayIndeterminate, onClick: handleClick, form: form, "aria-label": hideLabel ? label : undefined }), !hideLabel && (h("ic-typography", { key: '2ba4862a349e6b3f34c050c434ce247687f0dfd8', class: "checkbox-label", variant: "body" }, h("label", { key: 'a3f3c733b5dc0a0acdf89d3b7db603e965102618', htmlFor: id }, label)))), isSlotUsed(el, "additional-field") && (h("div", { key: 'ad38f0547dda8ce82cd107fec3f3ff9d555cc1e8', class: "dynamic-container", ref: (el) => (this.additionalFieldContainer = el) }, isDynamicAdditionalField && h("div", { key: 'd2c8566cada65dbd60546873ccbfedb33ec0e093', class: "branch-corner" }), h("div", { key: '05489504f66d7f6e79bbbf18302dd63348f2f4a7', class: "dynamic-field-container" }, isDynamicAdditionalField && (h("ic-typography", { key: 'eb397dc91080f791a4fd13e3c1815fad70c7cb87', variant: "caption" }, h("p", { key: '49633d6c0806655957055fbef51688bfdeb11411', class: "dynamic-text", "aria-live": "polite" }, dynamicText))), h("div", { key: '916e20f79f80cd7ff0fb5c4b030caf07f146ffcc', class: {
                 "additional-field-wrapper": !isDynamicAdditionalField,
-            } }, h("slot", { key: '02493cc3d3c3aae17cfb61bf1e7e12e9f41fabba', name: "additional-field" })))))));
+            } }, h("slot", { key: '5783108ca7c6edb7c55dad2cc9469549e31d7cd3', name: "additional-field" })))))));
     }
     static get delegatesFocus() { return true; }
     get el() { return this; }

package/dist/components/ic-chip.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { j as convertToRGBA, k as getBrandForegroundAppearance, r as removeDisabledFalse, o as onComponentRequiredPropUndefined, i as isSlotUsed, a as isElInAGGrid } from './helpers.js';
+import { j as convertToRGBA, k as getBrandForegroundAppearance, r as removeDisabledFalse, o as onComponentRequiredPropUndefined, f as renderDynamicChildSlots, i as isSlotUsed, a as isElInAGGrid } from './helpers.js';
 import { d as defineCustomElement$3 } from './ic-tooltip2.js';
 import { d as defineCustomElement$2 } from './ic-typography2.js';
@@ -72,12 +72,20 @@ const Chip = /*@__PURE__*/ proxyCustomElement(class Chip extends HTMLElement {
     watchDisabledHandler() {
         removeDisabledFalse(this.disabled, this.el);
     }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.hostMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+    }
     componentWillLoad() {
         removeDisabledFalse(this.disabled, this.el);
         this.customColorHandler();
     }
     componentDidLoad() {
         onComponentRequiredPropUndefined([{ prop: this.label, propName: "label" }], "Chip");
+        this.hostMutationObserver = new MutationObserver((mutationList) => renderDynamicChildSlots(mutationList, ["icon", "badge"], this));
+        this.hostMutationObserver.observe(this.el, {
+            childList: true,
+        });
     }
     handleClick() {
         this.visible = !this.visible;
@@ -92,10 +100,10 @@ const Chip = /*@__PURE__*/ proxyCustomElement(class Chip extends HTMLElement {
     render() {
         const { label, variant, size, dismissible, visible, disabled, hovered, theme, foregroundColor, dismissLabel, transparentBackground, } = this;
         const ariaLabel = `${label} chip`;
-        return (h(Host, { key: '9a61d8ecacb78fcdf17dbbaf32e1cf79de705d78', class: {
+        return (h(Host, { key: 'ced030b6d7a5aeb6b7030ea7858200187d16ae90', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 [`ic-chip-${foregroundColor}-text`]: variant === "filled" && !!foregroundColor,
-            } }, visible && (h("div", { key: '5cfa78f3d8647cf3f6a98649bfe583af89f3458f', class: {
+            } }, visible && (h("div", { key: 'dca2da18144d1ee47d9507cbb616bc6493060f94', class: {
                 chip: true,
                 [`${variant}`]: true,
                 [`${size}`]: true,
@@ -103,7 +111,7 @@ const Chip = /*@__PURE__*/ proxyCustomElement(class Chip extends HTMLElement {
                 dismissible,
                 hovered,
                 "non-transparent": variant === "outlined" && !transparentBackground,
-            } }, isSlotUsed(this.el, "icon") && (h("div", { key: 'd7f72306a186b66c4a215a3928655989870e34b3', class: "icon" }, h("slot", { key: '71b8d9a59d43e0580e7f56c1977f2992ee582d95', name: "icon" }))), h("ic-typography", { key: '46ba6cddc7c12f2c246cc2d23e6d403517ad54b3', variant: "label", "apply-vertical-margins": false, class: { label: true, "in-ag-grid": isElInAGGrid(this.el) } }, h("span", { key: '7e62d43da1b1d21a3b660839154aaaaedf96f935' }, label)), dismissible && (h("ic-tooltip", { key: 'c82c6387a16c2cf5006710b1623a332a1f5f3122', label: dismissLabel, target: "dismiss-icon", class: { "tooltip-disabled": disabled } }, h("button", { key: '0411f0e6d7ce468a6f7a489e652240724dee0213', id: "dismiss-icon", class: "dismiss-icon", ref: (el) => (this.buttonEl = el), "aria-label": `${dismissLabel} ${ariaLabel}`, disabled: disabled, tabindex: disabled ? -1 : 0, onClick: this.dismissAction, onMouseEnter: this.mouseEnterHandler, onMouseLeave: this.mouseLeaveHandler, innerHTML: dismissIcon }))), isSlotUsed(this.el, "badge") && h("slot", { key: '31e71e22e0d9b8755a8bc483934aabcc4ccb9033', name: "badge" }))), dismissible && (h("div", { key: 'c899f3ba330e9231e461b7869363ce85ff005b31', class: "sr-only", "aria-live": "polite" }, !visible ? `Dismissed ${ariaLabel}` : ""))));
+            } }, isSlotUsed(this.el, "icon") && (h("div", { key: '3e1537327125e7cfd54a20aeeb3f6279560da02f', class: "icon" }, h("slot", { key: '33a229dad89f94f165c0a3f77e83720e1cc0603f', name: "icon" }))), h("ic-typography", { key: '7445c7ae2254c909af206b43e5044f643177f1af', variant: "label", "apply-vertical-margins": false, class: { label: true, "in-ag-grid": isElInAGGrid(this.el) } }, h("span", { key: 'af34cb3ca942ea778c3ba4716f983755571626db' }, label)), dismissible && (h("ic-tooltip", { key: '7664945e7ddc8cb66a302265a5b7affcea514241', label: dismissLabel, target: "dismiss-icon", class: { "tooltip-disabled": disabled } }, h("button", { key: '692fd13b54eef71e29ef4d3639182617770684df', id: "dismiss-icon", class: "dismiss-icon", ref: (el) => (this.buttonEl = el), "aria-label": `${dismissLabel} ${ariaLabel}`, disabled: disabled, tabindex: disabled ? -1 : 0, onClick: this.dismissAction, onMouseEnter: this.mouseEnterHandler, onMouseLeave: this.mouseLeaveHandler, innerHTML: dismissIcon }))), isSlotUsed(this.el, "badge") && h("slot", { key: '6db0a5f0dd29df3315caa52aba01d339449e3bdd', name: "badge" }))), dismissible && (h("div", { key: '2d989a411ff7eedad1e9238714c704c3e2d0d536', class: "sr-only", "aria-live": "polite" }, !visible ? `Dismissed ${ariaLabel}` : ""))));
     }
     static get delegatesFocus() { return true; }
     get el() { return this; }

package/dist/components/ic-chip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-chip.js","mappings":"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","names":[],"sources":["src/components/ic-chip/ic-chip.css?tag=ic-chip&encapsulation=shadow","src/components/ic-chip/ic-chip.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: inline-block;\n max-width: 100%;\n vertical-align: middle;\n}\n\n.chip {\n --chip-bg-color: transparent;\n --chip-hover-bg: var(--ic-chip-action-hover);\n --chip-pressed-bg: var(--ic-chip-action-pressed);\n\n display: flex;\n padding: var(--ic-space-xxs);\n font-size: 0.875rem;\n border-radius: var(--ic-space-md);\n text-align: left;\n text-decoration: none;\n position: relative;\n background-color: var(--chip-bg-color);\n border: var(--ic-border-width) solid transparent;\n justify-content: space-between;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n .chip {\n transition: var(--ic-easing-transition-fast);\n }\n}\n\n.chip.small {\n padding: var(--ic-space-xxxs);\n border-radius: calc(var(--ic-space-md) - var(--ic-space-xxxs));\n}\n\n.chip.large {\n padding: var(--ic-space-xs);\n border-radius: calc(var(--ic-space-md) + var(--ic-space-xxs));\n}\n\n.label {\n padding: 0 var(--ic-space-xs);\n}\n\n.chip:focus-within {\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n z-index: 1;\n}\n\nic-tooltip:focus-within {\n z-index: 1;\n}\n\n.filled {\n --chip-bg-color: var(\n --chip-custom-color,\n var(--ic-chip-background-filled-default)\n );\n --ic-typography-color: var(\n --chip-custom-foreground-color,\n var(--ic-chip-label)\n );\n\n color: var(--chip-custom-foreground-color, var(--ic-chip-label));\n}\n\n.filled.disabled {\n --chip-bg-color: var(--ic-chip-background-filled-inactive);\n}\n\n:host(.ic-chip-dark-text) {\n --chip-custom-foreground-color: var(--ic-architectural-black);\n}\n\n:host(.ic-chip-light-text) {\n --chip-custom-foreground-color: var(--ic-architectural-white);\n}\n\n:host(.ic-chip-dark-text) .chip.filled.hovered:not(:focus-within) {\n --chip-hover-bg: var(--ic-action-dark-bg-hover);\n}\n\n:host(.ic-chip-dark-text) .chip.filled:focus-within {\n --chip-pressed-bg: var(--ic-action-dark-bg-pressed);\n}\n\n:host(.ic-chip-light-text) .chip.filled.hovered:not(:focus-within) {\n --chip-hover-bg: var(--ic-action-light-bg-hover);\n}\n\n:host(.ic-chip-light-text) .chip.filled:focus-within {\n --chip-pressed-bg: var(--ic-action-light-bg-pressed);\n}\n\n.outlined {\n color: var(--ic-chip-outline-label);\n border-color: var(--chip-custom-color, var(--ic-chip-outline));\n padding: calc(var(--ic-space-xxs));\n\n --ic-typography-color: var(--ic-chip-outline-label);\n}\n\n.outlined.disabled {\n border: var(--ic-border-disabled);\n border-color: var(--ic-chip-outline-inactive);\n}\n\n.chip.disabled ic-typography {\n --ic-typography-color: var(--ic-chip-label-inactive);\n}\n\n.dismiss-icon {\n border: none;\n border-radius: 50%;\n padding: 0;\n color: currentcolor;\n background: none;\n cursor: pointer;\n margin: var(--ic-space-xxxs);\n height: calc(var(--ic-space-lg) - var(--ic-space-xxs));\n width: calc(var(--ic-space-lg) - var(--ic-space-xxs));\n}\n\n.dismiss-icon:focus {\n outline: var(--ic-hc-focus-outline);\n}\n\n.dismiss-icon[disabled] {\n pointer-events: none;\n color: var(--ic-chip-icon-inactive);\n}\n\n.icon {\n padding: var(--ic-space-xxxs);\n box-sizing: border-box;\n}\n\n.icon,\nic-tooltip {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n.chip.disabled path,\n.chip.disabled ::slotted(svg) {\n fill: var(--ic-chip-icon-inactive);\n}\n\n.outlined.non-transparent {\n background-color: var(--ic-chip-outline-background);\n}\n\n:host .chip.hovered:not(:focus-within) {\n background-image: linear-gradient(var(--chip-hover-bg) 0 0);\n}\n\n:host .chip:focus-within {\n background-image: linear-gradient(var(--chip-pressed-bg) 0 0);\n}\n\n.sr-only {\n position: absolute;\n left: -9999px;\n}\n\n.sr-only:dir(rtl) {\n right: -9999px;\n}\n\n@media (forced-colors: active) {\n .chip {\n border: var(--ic-border-hc);\n }\n\n .chip.disabled {\n appearance: none;\n border-color: GrayText;\n }\n\n .chip.disabled ic-typography {\n --ic-typography-color: GrayText;\n }\n\n .chip.disabled path,\n .chip.disabled ::slotted(svg) {\n fill: GrayText;\n }\n\n .chip:focus-within {\n outline: none;\n border-color: Highlight;\n }\n}\n","import {\n Component,\n h,\n Prop,\n State,\n Listen,\n Event,\n EventEmitter,\n Element,\n Method,\n Watch,\n Host,\n} from \"@stencil/core\";\nimport {\n onComponentRequiredPropUndefined,\n isSlotUsed,\n removeDisabledFalse,\n convertToRGBA,\n isElInAGGrid,\n getBrandForegroundAppearance,\n} from \"../../utils/helpers\";\nimport {\n IcBrandForegroundNoDefault,\n IcColor,\n IcEmphasisType,\n IcSizes,\n IcThemeMode,\n} from \"../../utils/types\";\nimport dismissIcon from \"../../assets/dismiss-icon.svg\";\n\n/*\n @slot icon - Content will be rendered at the start of the chip.\n * @slot badge - Badge component overlaying the top right of the chip.\n /\n@Component({\n tag: \"ic-chip\",\n styleUrl: \"ic-chip.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Chip {\n private buttonEl?: HTMLButtonElement;\n\n @Element() el: HTMLIcChipElement;\n\n @State() foregroundColor: IcBrandForegroundNoDefault \| null = null;\n @State() hovered = false;\n @State() visible = true;\n\n /\n The custom chip colour. This will override the theme colour.\n * Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\".\n /\n @Prop() customColor?: IcColor;\n @Watch(\"customColor\")\n customColorHandler(): void {\n const colorRGBA = this.customColor && convertToRGBA(this.customColor);\n if (!colorRGBA) {\n this.foregroundColor = null;\n return;\n }\n\n const { r, g, b, a } = colorRGBA;\n this.foregroundColor = getBrandForegroundAppearance(\n (r 299 + g * 587 + b * 114) / 1000\n );\n this.el.setAttribute(\n \"style\",\n `--chip-custom-color: rgba(${r}, ${g}, ${b}, ${a});`\n );\n }\n\n /*\n If `true`, the chip will appear disabled.\n /\n @Prop() disabled = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n If `true`, the chip will have a close button at the end to dismiss it.\n /\n @Prop() dismissible = false;\n\n /\n The text in the dismiss button tooltip and aria label. Makes the user aware of the action resulting from clicking the 'Dismiss chip' button.\n /\n @Prop() dismissLabel = \"Dismiss\";\n\n /\n The text rendered within the chip.\n /\n @Prop() label!: string;\n\n /\n The size of the chip.\n /\n @Prop() size: IcSizes = \"medium\";\n /\n Sets the chip to the dark or light theme colors. \"inherit\" will set the color based on the system settings or ic-theme component.\n * Setting the \"customColor\" prop will override this.\n /\n @Prop() theme: IcThemeMode = \"inherit\";\n\n /\n If `true`, the outlined variant of chip will have a transparent background rather than the theme defined color.\n /\n @Prop() transparentBackground = true;\n\n /\n The emphasis of the chip.\n /\n @Prop() variant: IcEmphasisType = \"filled\";\n\n /\n Is emitted when the user dismisses the chip.\n /\n @Event() icDismiss: EventEmitter<void>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n this.customColorHandler();\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Chip\"\n );\n }\n\n @Listen(\"icDismiss\", { capture: true })\n handleClick(): void {\n this.visible = !this.visible;\n }\n\n /\n Sets focus on the chip.\n */\n @Method()\n async setFocus(): Promise<void> {\n this.buttonEl?.focus();\n }\n\n private dismissAction = () => {\n this.icDismiss.emit();\n };\n\n private mouseEnterHandler = () => {\n this.hovered = true;\n };\n\n private mouseLeaveHandler = () => {\n this.hovered = false;\n };\n\n render() {\n const {\n label,\n variant,\n size,\n dismissible,\n visible,\n disabled,\n hovered,\n theme,\n foregroundColor,\n dismissLabel,\n transparentBackground,\n } = this;\n\n const ariaLabel = `${label} chip`;\n\n return (\n <Host\n class={{\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n [`ic-chip-${foregroundColor}-text`]:\n variant === \"filled\" && !!foregroundColor,\n }}\n >\n {visible && (\n <div\n class={{\n chip: true,\n [`${variant}`]: true,\n [`${size}`]: true,\n disabled,\n dismissible,\n hovered,\n \"non-transparent\":\n variant === \"outlined\" && !transparentBackground,\n }}\n >\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon\">\n <slot name=\"icon\" />\n </div>\n )}\n <ic-typography\n variant=\"label\"\n apply-vertical-margins={false}\n class={{ label: true, \"in-ag-grid\": isElInAGGrid(this.el) }}\n >\n <span>{label}</span>\n </ic-typography>\n {dismissible && (\n <ic-tooltip\n label={dismissLabel}\n target=\"dismiss-icon\"\n class={{ \"tooltip-disabled\": disabled }}\n >\n <button\n id=\"dismiss-icon\"\n class=\"dismiss-icon\"\n ref={(el) => (this.buttonEl = el)}\n aria-label={`${dismissLabel} ${ariaLabel}`}\n disabled={disabled}\n tabindex={disabled ? -1 : 0}\n onClick={this.dismissAction}\n onMouseEnter={this.mouseEnterHandler}\n onMouseLeave={this.mouseLeaveHandler}\n innerHTML={dismissIcon}\n ></button>\n </ic-tooltip>\n )}\n {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n </div>\n )}\n {dismissible && (\n <div class=\"sr-only\" aria-live=\"polite\">\n {!visible ? `Dismissed ${ariaLabel}` : \"\"}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-chip.js","mappings":"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","names":[],"sources":["src/components/ic-chip/ic-chip.css?tag=ic-chip&encapsulation=shadow","src/components/ic-chip/ic-chip.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: inline-block;\n max-width: 100%;\n vertical-align: middle;\n}\n\n.chip {\n --chip-bg-color: transparent;\n --chip-hover-bg: var(--ic-chip-action-hover);\n --chip-pressed-bg: var(--ic-chip-action-pressed);\n\n display: flex;\n padding: var(--ic-space-xxs);\n font-size: 0.875rem;\n border-radius: var(--ic-space-md);\n text-align: left;\n text-decoration: none;\n position: relative;\n background-color: var(--chip-bg-color);\n border: var(--ic-border-width) solid transparent;\n justify-content: space-between;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n .chip {\n transition: var(--ic-easing-transition-fast);\n }\n}\n\n.chip.small {\n padding: var(--ic-space-xxxs);\n border-radius: calc(var(--ic-space-md) - var(--ic-space-xxxs));\n}\n\n.chip.large {\n padding: var(--ic-space-xs);\n border-radius: calc(var(--ic-space-md) + var(--ic-space-xxs));\n}\n\n.label {\n padding: 0 var(--ic-space-xs);\n}\n\n.chip:focus-within {\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n z-index: 1;\n}\n\nic-tooltip:focus-within {\n z-index: 1;\n}\n\n.filled {\n --chip-bg-color: var(\n --chip-custom-color,\n var(--ic-chip-background-filled-default)\n );\n --ic-typography-color: var(\n --chip-custom-foreground-color,\n var(--ic-chip-label)\n );\n\n color: var(--chip-custom-foreground-color, var(--ic-chip-label));\n}\n\n.filled.disabled {\n --chip-bg-color: var(--ic-chip-background-filled-inactive);\n}\n\n:host(.ic-chip-dark-text) {\n --chip-custom-foreground-color: var(--ic-architectural-black);\n}\n\n:host(.ic-chip-light-text) {\n --chip-custom-foreground-color: var(--ic-architectural-white);\n}\n\n:host(.ic-chip-dark-text) .chip.filled.hovered:not(:focus-within) {\n --chip-hover-bg: var(--ic-action-dark-bg-hover);\n}\n\n:host(.ic-chip-dark-text) .chip.filled:focus-within {\n --chip-pressed-bg: var(--ic-action-dark-bg-pressed);\n}\n\n:host(.ic-chip-light-text) .chip.filled.hovered:not(:focus-within) {\n --chip-hover-bg: var(--ic-action-light-bg-hover);\n}\n\n:host(.ic-chip-light-text) .chip.filled:focus-within {\n --chip-pressed-bg: var(--ic-action-light-bg-pressed);\n}\n\n.outlined {\n color: var(--ic-chip-outline-label);\n border-color: var(--chip-custom-color, var(--ic-chip-outline));\n padding: calc(var(--ic-space-xxs));\n\n --ic-typography-color: var(--ic-chip-outline-label);\n}\n\n.outlined.disabled {\n border: var(--ic-border-disabled);\n border-color: var(--ic-chip-outline-inactive);\n}\n\n.chip.disabled ic-typography {\n --ic-typography-color: var(--ic-chip-label-inactive);\n}\n\n.dismiss-icon {\n border: none;\n border-radius: 50%;\n padding: 0;\n color: currentcolor;\n background: none;\n cursor: pointer;\n margin: var(--ic-space-xxxs);\n height: calc(var(--ic-space-lg) - var(--ic-space-xxs));\n width: calc(var(--ic-space-lg) - var(--ic-space-xxs));\n}\n\n.dismiss-icon:focus {\n outline: var(--ic-hc-focus-outline);\n}\n\n.dismiss-icon[disabled] {\n pointer-events: none;\n color: var(--ic-chip-icon-inactive);\n}\n\n.icon {\n padding: var(--ic-space-xxxs);\n box-sizing: border-box;\n}\n\n.icon,\nic-tooltip {\n width: var(--ic-space-lg);\n height: var(--ic-space-lg);\n}\n\n.chip.disabled path,\n.chip.disabled ::slotted(svg) {\n fill: var(--ic-chip-icon-inactive);\n}\n\n.outlined.non-transparent {\n background-color: var(--ic-chip-outline-background);\n}\n\n:host .chip.hovered:not(:focus-within) {\n background-image: linear-gradient(var(--chip-hover-bg) 0 0);\n}\n\n:host .chip:focus-within {\n background-image: linear-gradient(var(--chip-pressed-bg) 0 0);\n}\n\n.sr-only {\n position: absolute;\n left: -9999px;\n}\n\n.sr-only:dir(rtl) {\n right: -9999px;\n}\n\n@media (forced-colors: active) {\n .chip {\n border: var(--ic-border-hc);\n }\n\n .chip.disabled {\n appearance: none;\n border-color: GrayText;\n }\n\n .chip.disabled ic-typography {\n --ic-typography-color: GrayText;\n }\n\n .chip.disabled path,\n .chip.disabled ::slotted(svg) {\n fill: GrayText;\n }\n\n .chip:focus-within {\n outline: none;\n border-color: Highlight;\n }\n}\n","import {\n Component,\n h,\n Prop,\n State,\n Listen,\n Event,\n EventEmitter,\n Element,\n Method,\n Watch,\n Host,\n} from \"@stencil/core\";\nimport {\n onComponentRequiredPropUndefined,\n isSlotUsed,\n removeDisabledFalse,\n convertToRGBA,\n isElInAGGrid,\n getBrandForegroundAppearance,\n renderDynamicChildSlots,\n} from \"../../utils/helpers\";\nimport {\n IcBrandForegroundNoDefault,\n IcColor,\n IcEmphasisType,\n IcSizes,\n IcThemeMode,\n} from \"../../utils/types\";\nimport dismissIcon from \"../../assets/dismiss-icon.svg\";\n\n/*\n @slot icon - Content will be rendered at the start of the chip.\n * @slot badge - Badge component overlaying the top right of the chip.\n /\n@Component({\n tag: \"ic-chip\",\n styleUrl: \"ic-chip.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Chip {\n private buttonEl?: HTMLButtonElement;\n private hostMutationObserver?: MutationObserver;\n\n @Element() el: HTMLIcChipElement;\n\n @State() foregroundColor: IcBrandForegroundNoDefault \| null = null;\n @State() hovered = false;\n @State() visible = true;\n\n /\n The custom chip colour. This will override the theme colour.\n * Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\".\n /\n @Prop() customColor?: IcColor;\n @Watch(\"customColor\")\n customColorHandler(): void {\n const colorRGBA = this.customColor && convertToRGBA(this.customColor);\n if (!colorRGBA) {\n this.foregroundColor = null;\n return;\n }\n\n const { r, g, b, a } = colorRGBA;\n this.foregroundColor = getBrandForegroundAppearance(\n (r 299 + g * 587 + b * 114) / 1000\n );\n this.el.setAttribute(\n \"style\",\n `--chip-custom-color: rgba(${r}, ${g}, ${b}, ${a});`\n );\n }\n\n /*\n If `true`, the chip will appear disabled.\n /\n @Prop() disabled = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n If `true`, the chip will have a close button at the end to dismiss it.\n /\n @Prop() dismissible = false;\n\n /\n The text in the dismiss button tooltip and aria label. Makes the user aware of the action resulting from clicking the 'Dismiss chip' button.\n /\n @Prop() dismissLabel = \"Dismiss\";\n\n /\n The text rendered within the chip.\n /\n @Prop() label!: string;\n\n /\n The size of the chip.\n /\n @Prop() size: IcSizes = \"medium\";\n /\n Sets the chip to the dark or light theme colors. \"inherit\" will set the color based on the system settings or ic-theme component.\n * Setting the \"customColor\" prop will override this.\n /\n @Prop() theme: IcThemeMode = \"inherit\";\n\n /\n If `true`, the outlined variant of chip will have a transparent background rather than the theme defined color.\n /\n @Prop() transparentBackground = true;\n\n /\n The emphasis of the chip.\n /\n @Prop() variant: IcEmphasisType = \"filled\";\n\n /\n Is emitted when the user dismisses the chip.\n /\n @Event() icDismiss: EventEmitter<void>;\n\n disconnectedCallback(): void {\n this.hostMutationObserver?.disconnect();\n }\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n this.customColorHandler();\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Chip\"\n );\n\n this.hostMutationObserver = new MutationObserver((mutationList) =>\n renderDynamicChildSlots(mutationList, [\"icon\", \"badge\"], this)\n );\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n }\n\n @Listen(\"icDismiss\", { capture: true })\n handleClick(): void {\n this.visible = !this.visible;\n }\n\n /\n Sets focus on the chip.\n */\n @Method()\n async setFocus(): Promise<void> {\n this.buttonEl?.focus();\n }\n\n private dismissAction = () => {\n this.icDismiss.emit();\n };\n\n private mouseEnterHandler = () => {\n this.hovered = true;\n };\n\n private mouseLeaveHandler = () => {\n this.hovered = false;\n };\n\n render() {\n const {\n label,\n variant,\n size,\n dismissible,\n visible,\n disabled,\n hovered,\n theme,\n foregroundColor,\n dismissLabel,\n transparentBackground,\n } = this;\n\n const ariaLabel = `${label} chip`;\n\n return (\n <Host\n class={{\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n [`ic-chip-${foregroundColor}-text`]:\n variant === \"filled\" && !!foregroundColor,\n }}\n >\n {visible && (\n <div\n class={{\n chip: true,\n [`${variant}`]: true,\n [`${size}`]: true,\n disabled,\n dismissible,\n hovered,\n \"non-transparent\":\n variant === \"outlined\" && !transparentBackground,\n }}\n >\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon\">\n <slot name=\"icon\" />\n </div>\n )}\n <ic-typography\n variant=\"label\"\n apply-vertical-margins={false}\n class={{ label: true, \"in-ag-grid\": isElInAGGrid(this.el) }}\n >\n <span>{label}</span>\n </ic-typography>\n {dismissible && (\n <ic-tooltip\n label={dismissLabel}\n target=\"dismiss-icon\"\n class={{ \"tooltip-disabled\": disabled }}\n >\n <button\n id=\"dismiss-icon\"\n class=\"dismiss-icon\"\n ref={(el) => (this.buttonEl = el)}\n aria-label={`${dismissLabel} ${ariaLabel}`}\n disabled={disabled}\n tabindex={disabled ? -1 : 0}\n onClick={this.dismissAction}\n onMouseEnter={this.mouseEnterHandler}\n onMouseLeave={this.mouseLeaveHandler}\n innerHTML={dismissIcon}\n ></button>\n </ic-tooltip>\n )}\n {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n </div>\n )}\n {dismissible && (\n <div class=\"sr-only\" aria-live=\"polite\">\n {!visible ? `Dismissed ${ariaLabel}` : \"\"}\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/ic-classification-banner.js CHANGED Viewed

@@ -48,10 +48,10 @@ const ClassificationBanner = /*@__PURE__*/ proxyCustomElement(class Classificati
         if (!classification ||
             (classification && !classificationText[classification]))
             classification = "default";
-        return (h(Host, { key: 'f30aac02756628e8538572d0b2cab67b0ffc4b75', class: { ["ic-classification-banner-inline"]: !!inline } }, h("banner", { key: '5eda99cbdf376e20ad9ed03fc5c7fc515805c6da', "aria-label": "Protective marking", class: {
+        return (h(Host, { key: '8ccd98249fea7e78da349f2c97243366305c5dcc', class: { ["ic-classification-banner-inline"]: !!inline } }, h("banner", { key: 'a108ace2bf5f64c5867f993d9d130595b61ccac9', "aria-label": "Protective marking", class: {
                 ["classification-banner"]: true,
                 [`${classification}`]: classification,
-            } }, classification !== "default" ? (h("span", { class: "offscreen" }, "The protective marking of this page is:", " ")) : null, h("ic-typography", { key: '3f094aa6b0ed00ec4f70858a81a030b2599829f9', variant: "caption-uppercase" }, classification === "default"
+            } }, classification !== "default" ? (h("span", { class: "offscreen" }, "The protective marking of this page is:", " ")) : null, h("ic-typography", { key: '09edc559ec7b205d092210ef73ef95faa43c1a8a', variant: "caption-uppercase" }, classification === "default"
             ? classificationText[classification]
             : `${upTo ? "up to" : ""}
                ${country}

package/dist/components/ic-data-list.js CHANGED Viewed

@@ -23,10 +23,10 @@ const DataList = /*@__PURE__*/ proxyCustomElement(class DataList extends HTMLEle
         if (size === "small") {
             Array.from(el.children).forEach((child) => child.setAttribute("size", "small"));
         }
-        return (h(Host, { key: 'a10decea9f6872dd3a86cb4e8d989f1628ddd8dd', class: {
+        return (h(Host, { key: '5e7af483f24335b47442b4aa768c7b04bc14bb64', class: {
                 "ic-data-list-small": size === "small",
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h("div", { key: '5e818e459c2dd23b6e021d82012150757b7520e9', class: "heading", id: "data-list-heading" }, h("slot", { key: '2d68d50a52c8fc3882aa9138ce427c23ccdbc394', name: "heading" }, h("ic-typography", { key: '275d859a1075fd96294913acf1a3b2b9bb1777c2', variant: "h3" }, heading))), h("div", { key: '06e942c78939bf9526ef3bcebba1c76db3c3f608', class: "divider" }), h("ul", { key: '9e7218ee17444774d184680d27e3e11424953bfc', "aria-labelledby": "data-list-heading", class: "rows" }, h("slot", { key: 'a75aec759140988dc2d673385d7eef1fc0e7dba5' }))));
+            } }, h("div", { key: 'a74f7d4a87b21b053a500cab89ca978ada43263e', class: "heading", id: "data-list-heading" }, h("slot", { key: 'c4896992d8558dfbe2a1d8dd689cabae2581ce89', name: "heading" }, h("ic-typography", { key: 'b05016df276422f769464a73d6ae71533d3c028f', variant: "h3" }, heading))), h("div", { key: 'a984729dc0849a27d09cd6403efd230cfc927007', class: "divider" }), h("ul", { key: '916c5b5c74f16f3fab74e2a157c2216b570420f5', "aria-labelledby": "data-list-heading", class: "rows" }, h("slot", { key: 'e5e05b0957b4cf986139795f31771556fd5f6150' }))));
     }
     get el() { return this; }
     static get style() { return IcDataListStyle0; }

package/dist/components/ic-data-row.js CHANGED Viewed

@@ -71,12 +71,12 @@ const DataRow = /*@__PURE__*/ proxyCustomElement(class DataRow extends HTMLEleme
     }
     render() {
         const { el, listSize, hasEndComponent, label, renderCellContent, size, theme, value, } = this;
-        return (h(Host, { key: '2faf353c648f521406dc1318be100192dece1aab', class: {
+        return (h(Host, { key: '9a94132a8884960a5ec1c2f2772e89f46dbcc995', class: {
                 ["ic-data-row-small"]: size === "small",
                 ["breakpoint-medium"]: listSize === "m",
                 ["breakpoint-xs"]: listSize === "xs",
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, role: "listitem" }, h("div", { key: '3d8e82d44292400dc5cf92230967eb3c9cc57cd0', class: "data" }, h("div", { key: '1e1edf0e3cefbe7cf2bb7e6ab973e55eeab1c0e3', class: "text-cells" }, (isSlotUsed(el, "label") || label) && renderCellContent("label"), (isSlotUsed(el, "value") || value) && renderCellContent("value")), hasEndComponent && (h("div", { key: '0b60b67c17cce484293060ec5ba89619f527e5c9', class: "end-component" }, h("slot", { key: '403f6290fd00ef44fa02baaeed36932caf6f9902', name: "end-component" })))), h("div", { key: '653123df7e4243474aa5254d948b1666c9b50722', class: "divider" })));
+            }, role: "listitem" }, h("div", { key: '8a354952861f100d66f454998c5b6a40eff226bd', class: "data" }, h("div", { key: '55359f425068a3a2b16cf194bc562ea8a2f865be', class: "text-cells" }, (isSlotUsed(el, "label") || label) && renderCellContent("label"), (isSlotUsed(el, "value") || value) && renderCellContent("value")), hasEndComponent && (h("div", { key: '1bb95d477f8d30759480a304c5214c9530a118d2', class: "end-component" }, h("slot", { key: '11284607c2c69d5b231d41ae307ca3044b49b8d1', name: "end-component" })))), h("div", { key: 'c4289c8446de02edbf8491e6d1d3cdb66561483e', class: "divider" })));
     }
     get el() { return this; }
     static get style() { return IcDataRowStyle0; }

package/dist/components/ic-dialog.js CHANGED Viewed

@@ -343,7 +343,7 @@ const Dialog = /*@__PURE__*/ proxyCustomElement(class Dialog extends HTMLElement
     }
     render() {
         const { dialogRendered, disableHeightConstraint, fadeIn, theme } = this;
-        return (h(Host, { key: 'f970a5b8d2c69eae29f0877f078a9a4c0ead56ba', class: {
+        return (h(Host, { key: 'ff1c220a6687596221a97f380dd78692d1689ca7', class: {
                 "ic-dialog-hidden": !dialogRendered,
                 "ic-dialog-fade-in": fadeIn,
                 "disable-height-constraint": !!disableHeightConstraint,

package/dist/components/ic-empty-state.js CHANGED Viewed

@@ -38,11 +38,11 @@ const EmptyState = /*@__PURE__*/ proxyCustomElement(class EmptyState extends HTM
     }
     render() {
         const { aligned, body, maxLines, heading, imageSize, subheading, theme } = this;
-        return (h(Host, { key: '1742fa428f2c887fd9b0a200fa5f4040c3ceedf3', class: {
+        return (h(Host, { key: '4bb35d1c3476b88cc58e952b1b8785e4425d5339', class: {
                 [`ic-empty-state-${aligned}`]: true,
                 [`image-${imageSize}`]: isSlotUsed(this.el, "image"),
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, isSlotUsed(this.el, "image") && h("slot", { key: '781c3afcd34547dba24bdc777fed7b704d2d27ad', name: "image" }), h("div", { key: 'a8eb38fb47f8e03d3654cc3f26d12ff1369a52ff' }, h("slot", { key: '4375bf33214131da721591bfbea44d03514b9836', name: "heading" }, h("ic-typography", { key: 'd83b8868e417e55a574716e380be3e99ea2f3aa3', variant: "h4", class: "empty-state-heading" }, heading)), h("slot", { key: '79d4fe82562ba2d44ffa5a693a3e9d5743984bbd', name: "subheading" }, h("ic-typography", { key: 'ffd4e8d460b03c3b90b477c0d2f420492a337165', variant: "subtitle-small", class: "empty-state-subheading" }, subheading)), h("slot", { key: '166e1b63631dc5f6a5ada15867fae52442c18e14', name: "body" }, h("ic-typography", { key: 'f63a9ec68fe53dadddd3cb26ffe6478164caf3af', maxLines: maxLines, class: "empty-state-body" }, body))), isSlotUsed(this.el, "actions") && (h("div", { key: 'ccf0fe966f7a2c6f5225005d5bd4266523bf5267', class: "action-area" }, h("slot", { key: 'f9f8f74c450aed47b1e8f0467e290714237251b0', name: "actions" })))));
+            } }, isSlotUsed(this.el, "image") && h("slot", { key: '9e87ed9f746d37f57505a75c62b10279b31ef54e', name: "image" }), h("div", { key: '4f94dc11d843660d3fecd976fa71f9c57644c89b' }, h("slot", { key: 'be23c55a8dc832904fbae342890d2a3d2d74ae85', name: "heading" }, h("ic-typography", { key: '52bf3dca695fecff3e5d650bd81db23d09665258', variant: "h4", class: "empty-state-heading" }, heading)), h("slot", { key: '7ed10d78475ac8b9c3f5a084a1294ad1be180f15', name: "subheading" }, h("ic-typography", { key: '5772d056578a64a951178c3c3026b36d4b316496', variant: "subtitle-small", class: "empty-state-subheading" }, subheading)), h("slot", { key: '14a8815b51a06521642921f09fa8346483522e84', name: "body" }, h("ic-typography", { key: 'bca780cc2275e81d4e25bae45f5065f6fab3bcd5', maxLines: maxLines, class: "empty-state-body" }, body))), isSlotUsed(this.el, "actions") && (h("div", { key: 'd6c0f61a358c1d0c86c4da922ed0504ffdc8228f', class: "action-area" }, h("slot", { key: 'ac150a34e883376bfee43a6edbeb8992c3bc3f96', name: "actions" })))));
     }
     get el() { return this; }
     static get style() { return IcEmptyStateStyle0; }

package/dist/components/ic-footer-link.js CHANGED Viewed

@@ -47,12 +47,12 @@ const FooterLink = /*@__PURE__*/ proxyCustomElement(class FooterLink extends HTM
         const { footerConfig, href, hreflang, referrerpolicy, rel, target, download, } = this;
         const { small, grouped } = footerConfig;
         const isLogoLink = !!this.el.closest("div[slot='logo']");
-        return (h(Host, { key: 'da292a4ecbb670fb85eddac93d4e8743a7f7a5a3', class: {
+        return (h(Host, { key: 'b8797484e397b1a952f2df6f644c985deec5be65', class: {
                 "footer-link": true,
                 [`footer-link-${grouped ? "grouped" : "ungrouped"}-${small ? "small" : "sparse"}`]: true,
                 [`footer-link-${this.foregroundColor}`]: true,
                 "footer-logo-link": isLogoLink,
-            }, role: "listitem" }, h("ic-link", { key: 'ba008bce21d6a1a062d69515578c158908c4f413', class: "footer-link", href: href, hreflang: hreflang, referrerpolicy: referrerpolicy, rel: rel, download: download !== false ? download : undefined, target: target }, h("slot", { key: '45d18d8d1009b438338c2153a2b59c88d6f3c320' }))));
+            }, role: "listitem" }, h("ic-link", { key: '1cd559f7c768a70d2bc0c92845ad6ae6761b584a', class: "footer-link", href: href, hreflang: hreflang, referrerpolicy: referrerpolicy, rel: rel, download: download !== false ? download : undefined, target: target }, h("slot", { key: 'f2104f33d9651f96414a4963b30ea2e6c2414b18' }))));
     }
     static get delegatesFocus() { return true; }
     get el() { return this; }

package/dist/components/ic-footer.js CHANGED Viewed

@@ -91,7 +91,7 @@ const Footer = /*@__PURE__*/ proxyCustomElement(class Footer extends HTMLElement
             isSlotUsed(el, "caption") ||
             caption ||
             copyright;
-        return (h(Host, { key: 'b25023d5362ca9baca9c01a319c038eb4540e97a', class: {
+        return (h(Host, { key: '5e9f3b92157b9ffa5fc6e2dbe8f8a5c6a63a6237', class: {
                 ["ic-footer"]: true,
                 [`ic-footer-${small ? "small" : "sparse"}`]: true,
                 [`ic-footer-${groupLinks ? "grouped" : "ungrouped"}`]: true,
@@ -99,10 +99,10 @@ const Footer = /*@__PURE__*/ proxyCustomElement(class Footer extends HTMLElement
                 // Slots will be able to infer their own color
                 [`ic-footer-${IcBrandForegroundEnum.Dark}`]: foregroundColor === IcBrandForegroundEnum.Dark,
                 [`ic-footer-${IcBrandForegroundEnum.Light}`]: foregroundColor === IcBrandForegroundEnum.Light,
-            } }, h("footer", { key: '053aafbd7016c4a74230cb3f4bd15ff1bd331761', ref: (el) => (this.footerEl = el) }, (isSlotUsed(el, "description") || description) && (h("div", { key: 'c963c42c0f4d0a19d8fe9c133ca3cf9261398d70', class: "footer-description" }, h("ic-section-container", { key: '0dd1fd94781722a494368e146f2a0b8417e1849d', aligned: aligned, fullHeight: true }, h("div", { key: '61a25339f136d624ef39c3f72ff920735eac3656', class: "footer-description-inner" }, h("ic-typography", { key: '4655d70fa69d5cc7ed44e352d37646a93b95067a', variant: "body" }, h("slot", { key: '3a04c622d16c8fbad42bde6e5a62b94a7cc0dbfc', name: "description" }, description)))))), isSlotUsed(el, "link") && (h("div", { key: '9a98191b7712a906aafa5295786586cdca8fdd63', class: "footer-links" }, groupLinks && small ? (h("div", { class: "footer-links-inner", role: "list" }, h("slot", { name: "link" }))) : (h("ic-section-container", { fullHeight: true, aligned: aligned }, h("div", { class: "footer-links-inner", role: "list" }, h("slot", { name: "link" })))))), showComplianceSection && (h("div", { key: '26f71e1feac14df4ffd9a5f945823e7d8a334f87', class: "footer-compliance" }, h("ic-section-container", { key: 'd4b53cd4e8b1170b629f6493188f48438c1edd00', aligned: aligned, fullHeight: true }, h("div", { key: '50b07020da89a9ebe53d6fd035b7139ac8ca2282', class: "footer-compliance-inner" }, isSlotUsed(el, "logo") && (h("div", { key: '2ea27171f29498639b56426d4d21fbf4afc98798', class: "footer-logo" }, h("slot", { key: 'b09b28173314c1b0a63ce1ecdf60822d7497ed80', name: "logo" }))), (isSlotUsed(el, "caption") || caption) && (h("div", { key: 'b4ce260f52b3216ec3c73430311b7659e651a544', class: "footer-caption" }, h("ic-typography", { key: 'f83868bac58237dcd8586d4d161db7677f0b2b16', variant: deviceSize <= IC_DEVICE_SIZES.M ? "caption" : "body" }, h("slot", { key: '3da3e317b1f62be124bbabc9283e08258dc57141', name: "caption" }, caption)))), copyright && (h("div", { key: '63b18007efa190d038048a1d57223dc0547a64ad', class: {
+            } }, h("footer", { key: 'cfae5dcdd5a431bba915b83e5ef2ae2347d5bb6d', ref: (el) => (this.footerEl = el) }, (isSlotUsed(el, "description") || description) && (h("div", { key: '9f960b8fcae0e3281b177bcfe1adf365657406dc', class: "footer-description" }, h("ic-section-container", { key: '49455d77e8d5e9e8a1199dc0dcc00226291e9adc', aligned: aligned, fullHeight: true }, h("div", { key: 'dab1fa34ca43acd9ff4c354f324c7c426d53c77b', class: "footer-description-inner" }, h("ic-typography", { key: '484158672386c4fed447390ab0d92bfd759a9272', variant: "body" }, h("slot", { key: '4a500553fd0f76a8d4f7ef8410dbd927896561b1', name: "description" }, description)))))), isSlotUsed(el, "link") && (h("div", { key: 'ed8613714e2bf4d79cd062f55f2b716d3e0cd304', class: "footer-links" }, groupLinks && small ? (h("div", { class: "footer-links-inner", role: "list" }, h("slot", { name: "link" }))) : (h("ic-section-container", { fullHeight: true, aligned: aligned }, h("div", { class: "footer-links-inner", role: "list" }, h("slot", { name: "link" })))))), showComplianceSection && (h("div", { key: 'c3876f5fa89d39f28e64db1bc0fca90978102a01', class: "footer-compliance" }, h("ic-section-container", { key: '3e169ea49bcd2698b84c58f8105b0915777d8bf3', aligned: aligned, fullHeight: true }, h("div", { key: '9cfaa13eb736d3aa44b15db43221bf28bf4deb57', class: "footer-compliance-inner" }, isSlotUsed(el, "logo") && (h("div", { key: '853fdedd70405ebb2e96cec2adc6407e5ed11538', class: "footer-logo" }, h("slot", { key: '4eaaad7a4f17cd51cbdab414cdbadf3096891d38', name: "logo" }))), (isSlotUsed(el, "caption") || caption) && (h("div", { key: '44a611218c4ea0f494df1551ecb26a8687d57a95', class: "footer-caption" }, h("ic-typography", { key: 'b970144c7d85b7e05e319233be68cc91ef2d0476', variant: deviceSize <= IC_DEVICE_SIZES.M ? "caption" : "body" }, h("slot", { key: '512d173a680ddd65b3583bada7530aa67d3f1f98', name: "caption" }, caption)))), copyright && (h("div", { key: '604ac3c72ae99883f27fdb609202782f6069bfde', class: {
                 ["footer-copyright"]: true,
                 ["classification-spacing"]: hasClassificationBanner(),
-            } }, h("ic-typography", { key: '0dc6200bfb89a7b34743c442f9c61829cd4b9374', variant: deviceSize <= IC_DEVICE_SIZES.M
+            } }, h("ic-typography", { key: '144bbc0144a865f8a55a1df5606cea9dfa87b5e8', variant: deviceSize <= IC_DEVICE_SIZES.M
                 ? "caption-uppercase"
                 : "label-uppercase" }, "\u00A9 Crown Copyright"))))))))));
     }

package/dist/components/ic-hero.js CHANGED Viewed

@@ -76,18 +76,18 @@ const Hero = /*@__PURE__*/ proxyCustomElement(class Hero extends HTMLElement {
                 "background-position": scrollFactor,
             };
         }
-        return (h(Host, { key: '4c88b4471d3485baff1f6c55f859639feb3166d8', class: {
+        return (h(Host, { key: '482bc3a82ab3561d6f88c999ca302006a1d1aa0f', class: {
                 [`ic-hero-${IcBrandForegroundEnum.Dark}`]: foregroundColor === IcBrandForegroundEnum.Dark,
                 ["has-background-image"]: backgroundImage !== undefined,
                 ["has-right-content"]: this.rightContent,
                 ["ic-hero-small"]: size === "small",
                 ["secondary-heading"]: !!secondaryHeading,
-            }, style: style }, h("ic-section-container", { key: 'b68716e353d9b2767dc16a5f701e3cdcbd32c748', aligned: aligned, fullHeight: true, class: "section-container" }, h("div", { key: '6dd6f422c0bd36725be4b41b42633aeebfa1911d', class: {
+            }, style: style }, h("ic-section-container", { key: '178b06d47614a00c4dabe06841acfebe369f7c0a', aligned: aligned, fullHeight: true, class: "section-container" }, h("div", { key: '3cec4f74434ae64cc7c7df77755c32a54719e08a', class: {
                 ["left-container"]: true,
                 ["left-container-full-width"]: this.leftContentFullWidth,
-            } }, h("div", { key: '54ffef99b79eef5eedbf1571bff89270982b5671', class: "heading" }, h("slot", { key: '6b7f71caecbaa84d1a39295e100aedef32d1d522', name: "heading" }, h("ic-typography", { key: '841b429a53b8b72dd60017cb2b2404b826f5bbe8', variant: size === "small" ? "h2" : "h1", class: {
+            } }, h("div", { key: '8053a5fad4279b04af9bb3ec1f606ec443c70b80', class: "heading" }, h("slot", { key: 'ea0ec581076b555f8cbc03bd26be611e0e002df3', name: "heading" }, h("ic-typography", { key: '93e39803e6d71599ee3831161dee785b0fa6dda7', variant: size === "small" ? "h2" : "h1", class: {
                 ["heading-bottom-spacing"]: size !== "small",
-            } }, h("h2", { key: 'ee802d396bb8a5638f2ab8a62fddbf764436e20e' }, heading)))), h("div", { key: '9a051783a24c9a92fc0aeff2db50689befe4834e', class: "subheading" }, h("slot", { key: 'eb894eaeb4b4303be0caf090d85d487aa11284fb', name: "subheading" }, h("ic-typography", { key: '92b4d9af6118e2ff9bf2b9166862067c610fffee', variant: "body" }, subheading))), h("div", { key: 'cacf81a4666eba19211493914e9b1af466e61478', class: "interaction-container" }, h("slot", { key: '982fb4b528bea4c486d9c0df2cf47fb3ace19414', name: "interaction" }))), (isPropDefined(secondaryHeading) || this.rightContent) && (h("div", { key: '32cd6196da302dd5d0896c90d53d1b35c060e31c', class: "right-container" }, h("slot", { key: '655f0a9978d8402faab43e7e143987f2934255f6', name: "secondary" }, secondaryHeading && (h("div", { key: '94de7e79fd9122b4084b57bf0b5b0571d77e7adc', class: "secondary-container" }, h("div", { key: 'afd414fd37f9b1c8fb6d9f2d7957314f35a1da40', class: "secondary-heading" }, h("ic-typography", { key: 'd643e471ec716d3e6f33ec7761027323ca31bc8c', variant: "h4" }, h("h3", { key: 'f6296bbd33d2ca70beb5100151cebfa8732206d0' }, secondaryHeading))), h("div", { key: '0575ef33984c79674626d9f114ad90a3f973e63a', class: "secondary-subheading" }, h("ic-typography", { key: '8045e445231e4cbbd07ad9fa21a7b6bbf5015eff', variant: "subtitle-small" }, secondarySubheading))))))))));
+            } }, h("h2", { key: '6931cd6ef37ca5ab9d01d4ca969130b9daf8d7a5' }, heading)))), h("div", { key: 'a6212993adb3a6f3e4b267825e73cbf02e3129e7', class: "subheading" }, h("slot", { key: '993071f73747a2d880a1b858f4fd6d9fec507002', name: "subheading" }, h("ic-typography", { key: 'e16fd2e61701713aa782b9d128de9187cc81edd3', variant: "body" }, subheading))), h("div", { key: '0ecd487ff2614787759eb35bdc8c6aecb385d795', class: "interaction-container" }, h("slot", { key: '653843aca5d99e5bed6d0343e31c285ca1ad7e6d', name: "interaction" }))), (isPropDefined(secondaryHeading) || this.rightContent) && (h("div", { key: 'ce6b3edc98f9f112b0bde6c590e1fbf7d3b75af8', class: "right-container" }, h("slot", { key: '173399d87b56f858542b71da3105d25f639aad87', name: "secondary" }, secondaryHeading && (h("div", { key: 'a2e895801f1611c60baacde029f2c55ce36b60a3', class: "secondary-container" }, h("div", { key: 'aedd5eb54afb5f93a263cf366223257c6074b697', class: "secondary-heading" }, h("ic-typography", { key: '6ec103c17df879c443aa587c09e32bfac942c2e3', variant: "h4" }, h("h3", { key: '37623268a450894886e5ae7fe773a950a120c3cc' }, secondaryHeading))), h("div", { key: '8e0ca17e68cf68c016040827d2999635babd1c9d', class: "secondary-subheading" }, h("ic-typography", { key: '14c59d487b56af4c70a4ec37ab6091262bcc4b69', variant: "subtitle-small" }, secondarySubheading))))))))));
     }
     get el() { return this; }
     static get style() { return IcHeroStyle0; }

package/dist/components/ic-horizontal-scroll2.js CHANGED Viewed

@@ -170,22 +170,22 @@ const HorizontalScroll = /*@__PURE__*/ proxyCustomElement(class HorizontalScroll
     }
     render() {
         const { firstItemVisible, lastItemVisible, itemOverflow } = this;
-        return (h(Host, { key: '3c307f5bddcc7b6c8ab7764d08504585f61e203d', class: {
+        return (h(Host, { key: '5c313665e71e0abc91a19f204ccf08d7b017f46b', class: {
                 ["ic-horizontal-scroll-visible"]: itemOverflow,
                 ["ic-horizontal-scroll-dark"]: this.appearance === IcBrandForegroundEnum.Dark,
                 ["ic-horizontal-scroll-light"]: this.appearance === IcBrandForegroundEnum.Light,
                 [`ic-theme-${this.theme}`]: this.theme !== "inherit",
-            } }, h("div", { key: 'f4bda7e5c0108e986191cde56ef8e255a80b604f', "aria-hidden": "true", class: {
+            } }, h("div", { key: '7a65d56af26a6bfe660c3e923beaf7b512f77de8', "aria-hidden": "true", class: {
                 ["scroll-container-left"]: true,
                 ["hidden"]: !itemOverflow,
                 ["disabled"]: firstItemVisible,
-            }, role: "tab" }, h("ic-button", { key: '5eb199e69ca500c8e84e9b79cec4a3448b604c39', class: "scroll-arrow", variant: "icon-tertiary", "aria-label": "Scroll left", theme: this.theme === "light" || this.theme === "inherit"
+            }, role: "tab" }, h("ic-button", { key: '0203d6acdde7444d03038b3ec86f3e318615030d', class: "scroll-arrow", variant: "icon-tertiary", "aria-label": "Scroll left", theme: this.theme === "light" || this.theme === "inherit"
                 ? "dark"
-                : "light", monochrome: this.monochrome, innerHTML: LeftArrow, disabled: firstItemVisible, tabindex: "-1", onClick: this.scrollLeft, onMouseDown: this.leftArrowMouseDownHandler }), h("span", { key: 'c939c5db95cc4b61645045ef498cc9b80c4f3d69', class: "scroll-splitter-left" })), h("slot", { key: '3ded812f11a7bbdc25157d840ee32f23ed58131b' }), h("div", { key: 'e713490eb2995ff19ec70bf0a098193eaa9829a8', "aria-hidden": "true", class: {
+                : "light", monochrome: this.monochrome, innerHTML: LeftArrow, disabled: firstItemVisible, tabindex: "-1", onClick: this.scrollLeft, onMouseDown: this.leftArrowMouseDownHandler }), h("span", { key: 'dffb5fee1c17005205216d0901141317e2dc4aa6', class: "scroll-splitter-left" })), h("slot", { key: 'f637c15f3020e1572a61179c2132dece11d0699a' }), h("div", { key: 'c563d5ca6d07a66f2111bea5aebe7d36ae481770', "aria-hidden": "true", class: {
                 ["scroll-container-right"]: true,
                 ["hidden"]: !itemOverflow,
                 ["disabled"]: lastItemVisible,
-            }, role: "tab" }, h("span", { key: 'a2427e872d8ab79ef0022ccb216238867e49065c', class: "scroll-splitter-right" }), h("ic-button", { key: 'a58d98e7d695fe15e3c085f1bec0079045817b2d', class: "scroll-arrow", variant: "icon-tertiary", "aria-label": "Scroll right", theme: this.theme === "light" || this.theme === "inherit"
+            }, role: "tab" }, h("span", { key: 'd8afe9aaf2304d13909815aeb8e60ac4f8952f7f', class: "scroll-splitter-right" }), h("ic-button", { key: '4f3be747e736a50705793742b0a1e9fab44d56db', class: "scroll-arrow", variant: "icon-tertiary", "aria-label": "Scroll right", theme: this.theme === "light" || this.theme === "inherit"
                 ? "dark"
                 : "light", monochrome: this.monochrome, innerHTML: RightArrow, disabled: lastItemVisible, tabindex: "-1", onClick: this.scrollRight, onMouseDown: this.rightArrowMouseDownHandler }))));
     }

package/dist/components/ic-input-component-container2.js CHANGED Viewed

@@ -49,15 +49,15 @@ const InputComponentContainer = /*@__PURE__*/ proxyCustomElement(class InputComp
     }
     render() {
         const { size, validationStatus, disabled, readonly, multiLine, fullWidth, validationInline, } = this;
-        return (h(Host, { key: 'fc70461ae7d3922f07aa5a85209e376d42bfc451', class: {
+        return (h(Host, { key: 'c33ebfd9dd18101fb9161259538e8e0046f77a3d', class: {
                 [`ic-input-component-container-${size}`]: true,
                 [`ic-input-component-container-${validationStatus}`]: validationStatus !== "" && !disabled && !readonly,
                 "ic-input-component-container-disabled": !!disabled,
                 "ic-input-component-container-readonly": !!readonly,
                 "ic-input-component-container-multiline": !!multiLine,
                 "ic-input-component-container-full-width": !!fullWidth,
-            }, "aria-disabled": disabled ? "true" : null }, h("div", { key: '20934b81740e6c907bff86cc706d3aafe3a790df', class: "focus-indicator" }, slotHasContent(this.el, "left-icon") && (h("div", { key: '3577416fc719a575372188c43a78ac945b1b1526', class: "icon-container" }, h("slot", { key: '36ee3e5c85ec77c69f88c2b74d272bdb6ee42ca1', name: "left-icon" }))), h("slot", { key: 'e0a79f50c8ba34c0d989e2402df8b00587c5878f' }), validationInline &&
-            validationStatus === IcInformationStatus.Success && (h("span", { key: 'b156fb5bb6fcfec8c6dec6febdeea6d2adc7e009', class: "inline-success", innerHTML: successIcon })))));
+            }, "aria-disabled": disabled ? "true" : null }, h("div", { key: 'a70f27a3235ac0edb9d9c5a18983ae3c02de2a48', class: "focus-indicator" }, slotHasContent(this.el, "left-icon") && (h("div", { key: 'aa0b233280382bd0e95a8ff932bf60a63603b7bf', class: "icon-container" }, h("slot", { key: 'ceb8ec9b420073ac2ecd5d6793ad4342ab9ebbdd', name: "left-icon" }))), h("slot", { key: '1850c6ed04510e678600c653a36e2114f982e561' }), validationInline &&
+            validationStatus === IcInformationStatus.Success && (h("span", { key: '58d228c595577c1cc9a0fe2b10538cc3efff53ab', class: "inline-success", innerHTML: successIcon })))));
     }
     get el() { return this; }
     static get watchers() { return {

package/dist/components/ic-input-container2.js CHANGED Viewed

@@ -17,11 +17,11 @@ const InputContainer = /*@__PURE__*/ proxyCustomElement(class InputContainer ext
         this.readonly = false;
     }
     render() {
-        return (h(Host, { key: '49cd31d8dca09cc4b2f49e0b2e7829bb1771a5d6' }, h("div", { key: 'bb0e3a80161a86b40e0dc424264e71cf6c95c88a', class: {
+        return (h(Host, { key: '32ae22db5e182cc2c092c8f48e61d42a318284a0' }, h("div", { key: 'bae9ef74f7f92004ec99c387a213822315c505ba', class: {
                 ["component-container"]: true,
                 ["disabled"]: !!this.disabled,
                 ["readonly"]: !!this.readonly,
-            } }, h("slot", { key: '4916ff0aebd6632d6e6f5daaa3c318e1e696ff2f' }))));
+            } }, h("slot", { key: 'acca571eaa0d8f19b0e3379d2592409aacf9dd95' }))));
     }
     static get style() { return IcInputContainerStyle0; }
 }, [4, "ic-input-container", {

package/dist/components/ic-input-label2.js CHANGED Viewed

@@ -70,11 +70,11 @@ const InputLabel = /*@__PURE__*/ proxyCustomElement(class InputLabel extends HTM
             "helpertext-readonly": readonly,
         };
         const helperTextSlot = this.el.querySelector("slot[name='helper-text']");
-        return (h(Host, { key: 'f03d8032ac769d4ecea37fe7a60e9d5acea54cd9', class: {
+        return (h(Host, { key: 'da58fe3cac026661d1c624c69c56c6e64ff3c07a', class: {
                 "ic-input-label-disabled": !!disabled,
                 "ic-input-label-readonly": readonly,
                 "with-helper": this.isHelperTextSlotUsed(helperTextSlot) || helperText !== "",
-            } }, !hideLabel && (h("ic-typography", { key: '7af61c1f2a1b9068fb9a9b649f60da1784207aa3', variant: "label", class: {
+            } }, !hideLabel && (h("ic-typography", { key: 'bb221e5f51681a0caa721c66f03fd475e4e08749', variant: "label", class: {
                 "readonly-label": readonly,
                 "error-label": status === "error" && !(readonly || disabled),
             } }, readonly || !useLabelTag ? (`${labelText}`) : (h("label", { htmlFor: this.for }, labelText)))), this.isHelperTextSlotUsed(helperTextSlot) ? (h("span", { id: helperTextId, class: helperTextClass }, h("slot", { name: "helper-text" }))) : (helperText !== "" && (h("ic-typography", { variant: "caption", class: helperTextClass }, h("span", { id: helperTextId }, helperText))))));

package/dist/components/ic-input-validation2.js CHANGED Viewed

@@ -33,13 +33,13 @@ const InputValidation = /*@__PURE__*/ proxyCustomElement(class InputValidation e
     render() {
         const { ariaLiveMode, fullWidth, status, message } = this;
         const displayIcon = status !== "" ? icon[status] : "";
-        return (h(Host, { key: '2ab746f75a46252bc0755dfd28220dbe555b93b3', class: {
+        return (h(Host, { key: '149fe6ed6f86bb49ff8179e617542c048da4b80f', class: {
                 [`ic-input-validation-${status}`]: status !== "",
                 "ic-input-validation-full-width": !!fullWidth,
-            } }, displayIcon !== "" && (h("span", { key: 'fc02067a0c0f1e9672e190f1bd30774cd2cfcfe0', class: {
+            } }, displayIcon !== "" && (h("span", { key: 'e9e0ad999d435642e02a9f9c4abb95840fe13b3f', class: {
                 "status-icon": true,
                 [`icon-${status}`]: true,
-            }, innerHTML: displayIcon })), h("ic-typography", { key: 'f8d3c1d9d7f30e232ebbc827033ad318485f7c98', variant: "caption", class: "statustext" }, h("span", { key: '73b35c4a5c4dbe77fe4c71032020a0346e34fcfd', "aria-live": ariaLiveMode, id: this.for && getInputValidationTextID(this.for) }, message)), h("slot", { key: '629f37113c9354db274019eadc9ae7140adf921a', name: "validation-message-adornment" })));
+            }, innerHTML: displayIcon })), h("ic-typography", { key: '7494901b17b7bb3c91167e95190c415fd06f03c9', variant: "caption", class: "statustext" }, h("span", { key: '5e7d2d4cdcef0d32d5338f25365bc9831203a9c9', "aria-live": ariaLiveMode, id: this.for && getInputValidationTextID(this.for) }, message)), h("slot", { key: '445c0fe4b8effa3b9d98a9b240921e613ef43e24', name: "validation-message-adornment" })));
     }
     get el() { return this; }
     static get style() { return IcInputValidationStyle0; }

package/dist/components/ic-link2.js CHANGED Viewed

@@ -93,7 +93,7 @@ const Link = /*@__PURE__*/ proxyCustomElement(class Link extends HTMLElement {
     }
     render() {
         const { download, href, hreflang, referrerpolicy, rel, target, monochrome, theme, } = this;
-        return (h(Host, { key: '769bea68e79e8b28fb9c0ea007c24dd11968d332', class: {
+        return (h(Host, { key: 'bc07dfd2d7467391a9c121f1263df5d053f7a59c', class: {
                 ["ic-link"]: true,
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 ["ic-link-monochrome"]: !!monochrome,

package/dist/components/ic-loading-indicator2.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { d as defineCustomElement$1 } from './ic-typography2.js';
-const icLoadingIndicatorCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;--linear-border-radius:0.25rem;--inner-color:var(--ic-loading-indicator-inner-color);--outer-color:var(--ic-loading-indicator-outer-color);--label-color:var(--ic-loading-indicator-label-color);--margin:none;--linear-line-height:var(--ic-space-xs)}:host(.ic-loading-indicator-monochrome){--inner-color:var(--ic-loading-indicator-inner-color-monochrome);--outer-color:var(--ic-loading-indicator-outer-color-monochrome);--label-color:var(--ic-loading-indicator-label-color-monochrome)}.ic-loading-container{display:flex;flex-direction:column;justify-content:center;align-items:center}:host([size=\"small\"]){--circular-diameter:2.5rem;--linear-line-height:var(--ic-space-xxs)}:host([size=\"medium\"]){--circular-diameter:5rem}:host([size=\"large\"]){--circular-diameter:7.5rem}:host([size=\"icon\"]){display:inline-block;--margin:var(--ic-space-xxxs);--circular-diameter:1.25rem}:host(.ic-loading-indicator-label){--margin:0 0 var(--ic-space-xs) 0}.ic-loading-label{--ic-typography-color:var(--label-color);margin-left:var(--label-margin-left)}.ic-loading-circular-outer{height:var(--circular-diameter);width:var(--circular-diameter)}.ic-loading-circular-outer.indeterminate{animation:circular-animation 1s linear;animation-iteration-count:infinite}@keyframes circular-animation{100%{transform:rotate(360deg)}}.ic-loading-circular-outer,.ic-loading-linear-outer{margin:var(--margin)}.ic-loading-linear-outer{background-color:var(--outer-color);height:var(--linear-line-height);width:100%;border-radius:var(--linear-border-radius);overflow:hidden}.ic-loading-linear-inner{position:relative;height:100%;background-color:var(--inner-color);border-radius:var(--linear-border-radius)}.indeterminate>.ic-loading-linear-inner{animation:linear-animation 2s infinite}.determinate>.ic-loading-linear-inner{transition:width 0.5s;width:var(--linear-width)}:host(.ic-loading-indicator-full-width){--linear-border-radius:none}@keyframes linear-animation{0%{width:0%;left:-1%}25%{width:0%;left:-1%}50%{width:101%;left:-1%}75%{width:0%;left:101%}100%{width:0%;left:101%}}.ic-loading-circular-svg{position:relative;width:100%;height:100%;transform:rotate(-90deg)}.ic-loading-circular-svg circle{width:100%;height:100%;fill:none;stroke:var(--compact-step-outer-color, var(--outer-color));stroke-width:var(--circular-line-width);stroke-linecap:round}.ic-loading-circular-svg circle:nth-child(2){--circular-indeterminate:calc(\n    (0.25 * var(--stroke-dasharray)) - var(--stroke-dasharray)\n  );stroke-dasharray:var(--stroke-dasharray), var(--stroke-dasharray);stroke-dashoffset:var(--stroke-dashoffset, var(--circular-indeterminate));stroke:var(--compact-step-inner-color, var(--inner-color))}.inner-label{height:100%;display:grid}.inner-label .ic-loading-circular-svg,.inner-text{grid-column:1;grid-row:1}:host(.not-required.compact-step-progress-indicator) .ic-loading-circular-svg circle:nth-child(2){stroke:var(--ic-architectural-300)}.inner-text{display:flex;align-items:center;justify-content:center;width:var(--ic-space-lg);height:inherit;overflow:hidden;margin:auto;--ic-typography-color:var(\n    --ic-step-indicator-text-current,\n    var(--ic-status-info-default)\n  )}:host(.not-required.compact-step-progress-indicator) .inner-text{--ic-typography-color:var(--ic-step-indicator-text-disabled)}:host(.ic-loading-indicator-light.not-required.compact-step-progress-indicator) .inner-text{--ic-typography-color:var(--ic-architectural-400)}@media (forced-colors: active){.indeterminate>.ic-loading-circular-inner{forced-color-adjust:none}.ic-loading-linear-outer{border:var(--ic-border-hc)}.ic-loading-linear-inner{background-color:canvastext}.ic-loading-circular-svg circle{stroke:Background}.ic-loading-circular-svg circle:nth-child(2){stroke:canvastext}:host(.not-required.compact-step-progress-indicator) .ic-loading-circular-svg circle:nth-child(2){stroke:GrayText}}";
+const icLoadingIndicatorCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;--linear-border-radius:0.25rem;--inner-color:var(--ic-loading-indicator-inner-color);--outer-color:var(--ic-loading-indicator-outer-color);--label-color:var(--ic-loading-indicator-label-color);--margin:none;--linear-line-height:var(--ic-space-xs)}:host(.ic-loading-indicator-monochrome){--inner-color:var(--ic-loading-indicator-inner-color-monochrome);--outer-color:var(--ic-loading-indicator-outer-color-monochrome);--label-color:var(--ic-loading-indicator-label-color-monochrome)}.ic-loading-container{display:flex;flex-direction:column;justify-content:center;align-items:center}:host([size=\"small\"]){--circular-diameter:2.5rem;--linear-line-height:var(--ic-space-xxs)}:host([size=\"medium\"]){--circular-diameter:5rem}:host([size=\"large\"]){--circular-diameter:7.5rem}:host([size=\"icon\"]){display:inline-block;--margin:var(--ic-space-xxxs);--circular-diameter:1.25rem}:host(.ic-loading-indicator-label){--margin:0 0 var(--ic-space-xs) 0}.ic-loading-label{--ic-typography-color:var(--label-color);margin-left:var(--label-margin-left)}.ic-loading-circular-outer{height:var(--circular-diameter);width:var(--circular-diameter)}.ic-loading-circular-outer.indeterminate{animation:circular-animation 1s linear;animation-iteration-count:infinite}@keyframes circular-animation{100%{transform:rotate(360deg)}}.ic-loading-circular-outer,.ic-loading-linear-outer{margin:var(--margin)}.ic-loading-linear-outer{background-color:var(--outer-color);height:var(--linear-line-height);width:100%;border-radius:var(--linear-border-radius);overflow:hidden}.ic-loading-circular-outer[aria-valuenow=\"0\"] .ic-loading-circular-inner,.ic-loading-linear-outer[aria-valuenow=\"0\"] .ic-loading-linear-inner{--inner-color:var(--outer-color)}.ic-loading-linear-inner{position:relative;height:100%;background-color:var(--inner-color);border-radius:var(--linear-border-radius)}.indeterminate>.ic-loading-linear-inner{animation:linear-animation 2s infinite}.determinate>.ic-loading-linear-inner{transition:width 0.5s;width:var(--linear-width)}:host(.ic-loading-indicator-full-width){--linear-border-radius:none}@keyframes linear-animation{0%{width:0%;left:-1%}25%{width:0%;left:-1%}50%{width:101%;left:-1%}75%{width:0%;left:101%}100%{width:0%;left:101%}}.ic-loading-circular-svg{position:relative;width:100%;height:100%;transform:rotate(-90deg)}.ic-loading-circular-svg circle{width:100%;height:100%;fill:none;stroke:var(--compact-step-outer-color, var(--outer-color));stroke-width:var(--circular-line-width);stroke-linecap:round}.ic-loading-circular-svg circle:nth-child(2){--circular-indeterminate:calc(\n    (0.25 * var(--stroke-dasharray)) - var(--stroke-dasharray)\n  );stroke-dasharray:var(--stroke-dasharray), var(--stroke-dasharray);stroke-dashoffset:var(--stroke-dashoffset, var(--circular-indeterminate));stroke:var(--compact-step-inner-color, var(--inner-color))}.inner-label{height:100%;display:grid}.inner-label .ic-loading-circular-svg,.inner-text{grid-column:1;grid-row:1}:host(.not-required.compact-step-progress-indicator) .ic-loading-circular-svg circle:nth-child(2){stroke:var(--ic-architectural-300)}.inner-text{display:flex;align-items:center;justify-content:center;width:var(--ic-space-lg);height:inherit;overflow:hidden;margin:auto;--ic-typography-color:var(\n    --ic-step-indicator-text-current,\n    var(--ic-status-info-default)\n  )}:host(.not-required.compact-step-progress-indicator) .inner-text{--ic-typography-color:var(--ic-step-indicator-text-disabled)}:host(.ic-loading-indicator-light.not-required.compact-step-progress-indicator) .inner-text{--ic-typography-color:var(--ic-architectural-400)}@media (forced-colors: active){.indeterminate>.ic-loading-circular-inner{forced-color-adjust:none}.ic-loading-linear-outer{border:var(--ic-border-hc)}.ic-loading-linear-inner{background-color:canvastext}.ic-loading-circular-svg circle{stroke:Background}.ic-loading-circular-svg circle:nth-child(2){stroke:canvastext}:host(.not-required.compact-step-progress-indicator) .ic-loading-circular-svg circle:nth-child(2){stroke:GrayText}}";
 const IcLoadingIndicatorStyle0 = icLoadingIndicatorCss;
 const LOADING_INDICATOR_WIDTHS = {
@@ -187,23 +187,23 @@ const LoadingIndicator = /*@__PURE__*/ proxyCustomElement(class LoadingIndicator
     }
     render() {
         const { circularDiameter, circularDimensions: { x, y, r, dashArray, dashOffset }, description, fullWidth, indicatorLabel, innerLabel, label, max, min, monochrome, progress, size, theme, type, } = this;
-        return (h(Host, { key: '8ee440b25dde3874c36eb6c70f3eaac1bf7649d1', class: {
+        return (h(Host, { key: 'a56bc4f2265b8697fb78fe0cb021df4f7c84b34d', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 "ic-loading-indicator-full-width": fullWidth,
                 "ic-loading-indicator-label": !!label,
                 "ic-loading-indicator-monochrome": monochrome,
-            } }, h("div", { key: '3d06914b8253b77c9df58d5c94a44442ea3f2d16', class: "ic-loading-container", part: "ic-loading-container" }, h("div", { key: '43a11cf45e813b5560721472c431452a761593fb', ref: (el) => (this.outerElement = el), class: {
+            } }, h("div", { key: '8da5f575ce68a85df03c23e256125ed968d55496', class: "ic-loading-container", part: "ic-loading-container" }, h("div", { key: '1a32acb1ce270a95b88a77d13591151d8a280fe8', ref: (el) => (this.outerElement = el), class: {
                 [`ic-loading-${type}-outer`]: true,
                 [progress === undefined ? "indeterminate" : "determinate"]: true,
-            }, role: "progressbar", "aria-labelledby": label && size !== "icon" && "ic-loading-label", "aria-label": description, "aria-valuenow": progress, "aria-valuemin": min, "aria-valuemax": max }, h("div", { key: 'a95cd8ed7e58821c8ac4001c8926d202719e63f7', ref: (el) => (this.innerElement = el), class: {
+            }, role: "progressbar", "aria-labelledby": label && size !== "icon" && "ic-loading-label", "aria-label": description, "aria-valuenow": progress, "aria-valuemin": min, "aria-valuemax": max }, h("div", { key: '0189f89d2f2f5a9f7530e1bbef1874fd52a00f87', ref: (el) => (this.innerElement = el), class: {
                 [`ic-loading-${type}-inner`]: true,
                 "inner-label": !!innerLabel,
-            } }, innerLabel && size === "small" && (h("ic-typography", { key: '04b25f8cba789f316ba2db771b4a7d30eac7fe10', variant: "subtitle-small", class: "inner-text" }, innerLabel)), type === "circular" && (h("svg", { key: 'ff98da2b3f382ad698855d7ce1b0a553dbfadae3', class: "ic-loading-circular-svg", viewBox: `0 0 ${circularDiameter} ${circularDiameter}` }, h("circle", { key: 'b53c7477ae972370739b908141776337f277fc48', cx: x, cy: y, r: r }), h("circle", { key: 'b652351de6695c077a1f276710e0fe558ff393e4', style: {
+            } }, innerLabel && size === "small" && (h("ic-typography", { key: '83c67de5d281dca4c293f3d06b278eabe63ccee3', variant: "subtitle-small", class: "inner-text" }, innerLabel)), type === "circular" && (h("svg", { key: 'e2449654d4dcb904c56ba47f6f72cfda5bcee7f0', class: "ic-loading-circular-svg", viewBox: `0 0 ${circularDiameter} ${circularDiameter}` }, h("circle", { key: '6436f697d6e7d7e030178fc3653ec86a509c2965', cx: x, cy: y, r: r }), h("circle", { key: '19da0a067ffdd864a08a630eabff268e9bfd1c33', style: {
                 "--circular-steps-max": progress ? `${max}` : undefined,
                 "--progress-value": progress !== undefined ? `${progress}` : undefined,
                 "--stroke-dasharray": dashArray,
                 "--stroke-dashoffset": dashOffset,
-            }, cx: x, cy: y, r: r }))))), label && size !== "icon" && (h("ic-typography", { key: 'b070b1975f52606aa8df8f8575859a12ab4e7982', id: "ic-loading-label", class: "ic-loading-label", role: "alert", variant: this.getLabelVariant() }, h("p", { key: 'b654d871fff4ad30b2fa7bfff7b2756f0b7475ed' }, indicatorLabel))))));
+            }, cx: x, cy: y, r: r }))))), label && size !== "icon" && (h("ic-typography", { key: 'e4d24f7e59633400c36e0e380e52ea1714c7f88f', id: "ic-loading-label", class: "ic-loading-label", role: "alert", variant: this.getLabelVariant() }, h("p", { key: 'e89f399cb0c43c4cc7dd743a201789cf50a73ed9' }, indicatorLabel))))));
     }
     get el() { return this; }
     static get watchers() { return {