@ukic/canary-web-components 2.0.0-canary.30 → 2.0.0-canary.32

package/hydrate/index.js

@@ -8053,6 +8053,10 @@ const removeFormResetListener$1 = (el, callbackFn) => {
     (_a = el.closest("FORM")) === null || _a === void 0 ? void 0 : _a.removeEventListener("reset", callbackFn);
 };
 const pxToRem$1 = (px, base = 16) => `${(1 / base) * parseInt(px)}rem`;
+/**
+ * Removes the disabled attribute from the provided element when its value is set to false.
+ * This effectively makes it null, to not confuse screen readers that cannot interpret the false value
+ */
 const removeDisabledFalse$1 = (disabled, element) => {
     if (!disabled) {
         element.removeAttribute("disabled");
@@ -8143,6 +8147,9 @@ class Accordion {
         this.message = "";
         this.size = "default";
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     // Every time expanded is set via toggleExpanded or accordionGroup, animate to open or close
     handleExpandedWatch() {
         this.animateExpandedContent();
@@ -8155,6 +8162,9 @@ class Accordion {
             this.accordionBtnHeading.focus();
         }
     }
+    componentWillLoad() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     disconnectedCallback() {
         if (this.expandedContentEl) {
             this.expandedContentEl.removeEventListener("transitionend", (e) => this.setExpandedContentStyle(e, this.expandedContentEl), true);
@@ -8186,6 +8196,7 @@ class Accordion {
     }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
         "expanded": ["handleExpandedWatch"]
     }; }
     static get style() { return icAccordionCss; }
@@ -9497,6 +9508,9 @@ class Card$1 {
         this.subheading = undefined;
         this.target = undefined;
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     disconnectedCallback() {
         var _a;
         if (this.parentIsAnchorTag) {
@@ -9582,6 +9596,9 @@ class Card$1 {
             }, "aria-label": "Toggle expandable area", "aria-expanded": `${this.areaExpanded}`, "aria-controls": this.areaExpanded ? "expanded-content-area" : null, onClick: this.toggleExpanded, innerHTML: chevronIcon }))))), isSlotUsed$1(this.el, "expanded-content") && this.areaExpanded && (hAsync("div", { class: "expanded-content", id: "expanded-content-area" }, hAsync("slot", { name: "expanded-content" }))), isSlotUsed$1(this.el, "badge") && hAsync("slot", { name: "badge" })));
     }
     get el() { return getElement(this); }
+    static get watchers() { return {
+        "disabled": ["watchDisabledHandler"]
+    }; }
     static get style() { return icCardCss; }
     static get cmpMeta() { return {
         "$flags$": 9,
@@ -9978,19 +9995,21 @@ const checkSlotInChildMutations = (addedNodes, removedNodes, slotName) => {
 const addDataToPosition = (dataObject, newKeys, newValue) => {
     const newData = {};
     const newIndexes = newKeys.map((key) => key.index);
-    let controlledIndex = 0; // When a new key is added to the data, need to increment the index to account for this new object value
-    Object.keys(dataObject).forEach((dataKey) => {
-        if (newIndexes.includes(controlledIndex)) {
-            newData[newKeys[newIndexes.indexOf(controlledIndex)].key] = newValue;
-            controlledIndex++;
-        }
-        newData[dataKey] = dataObject[dataKey];
-        controlledIndex++;
-    });
+    const keys = Object.keys(dataObject);
+    const values = Object.values(dataObject);
+    const numberOfKeys = keys.length + newIndexes.length;
+    for (let i = 0, j = 0; i < numberOfKeys; i++) {
+        if (newIndexes.includes(i)) {
+            newData[newKeys[newIndexes.indexOf(i)].key] = newValue;
+            continue;
+        }
+        newData[keys[j]] = values[j];
+        j++;
+    }
     return newData;
 };
 
-const icCardHorizontalCss = "/*!@html*/html.sc-ic-card-horizontal{line-height:1.15;-webkit-text-size-adjust:100%}/*!@body*/body.sc-ic-card-horizontal{margin:0}/*!@main*/main.sc-ic-card-horizontal{display:block}/*!@h1*/h1.sc-ic-card-horizontal{font-size:2em;margin:0.67em 0}/*!@hr*/hr.sc-ic-card-horizontal{box-sizing:content-box;height:0;overflow:visible}/*!@pre*/pre.sc-ic-card-horizontal{font-family:monospace, monospace;font-size:1em}/*!@a*/a.sc-ic-card-horizontal{background-color:transparent}/*!@abbr[title]*/abbr[title].sc-ic-card-horizontal{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}/*!@b,\nstrong*/b.sc-ic-card-horizontal,strong.sc-ic-card-horizontal{font-weight:bolder}/*!@code,\nkbd,\nsamp*/code.sc-ic-card-horizontal,kbd.sc-ic-card-horizontal,samp.sc-ic-card-horizontal{font-family:monospace, monospace;font-size:1em}/*!@small*/small.sc-ic-card-horizontal{font-size:80%}/*!@sub,\nsup*/sub.sc-ic-card-horizontal,sup.sc-ic-card-horizontal{font-size:75%;line-height:0;position:relative;vertical-align:baseline}/*!@sub*/sub.sc-ic-card-horizontal{bottom:-0.25em}/*!@sup*/sup.sc-ic-card-horizontal{top:-0.5em}/*!@img*/img.sc-ic-card-horizontal{border-style:none}/*!@button,\ninput,\noptgroup,\nselect,\ntextarea*/button.sc-ic-card-horizontal,input.sc-ic-card-horizontal,optgroup.sc-ic-card-horizontal,select.sc-ic-card-horizontal,textarea.sc-ic-card-horizontal{font-family:inherit;font-size:100%;line-height:1.15;margin:0}/*!@button,\ninput*/button.sc-ic-card-horizontal,input.sc-ic-card-horizontal{overflow:visible}/*!@button,\nselect*/button.sc-ic-card-horizontal,select.sc-ic-card-horizontal{text-transform:none}/*!@button,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"]*/button.sc-ic-card-horizontal,[type=\"button\"].sc-ic-card-horizontal,[type=\"reset\"].sc-ic-card-horizontal,[type=\"submit\"].sc-ic-card-horizontal{-webkit-appearance:button}/*!@button::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner*/button.sc-ic-card-horizontal::-moz-focus-inner,[type=\"button\"].sc-ic-card-horizontal::-moz-focus-inner,[type=\"reset\"].sc-ic-card-horizontal::-moz-focus-inner,[type=\"submit\"].sc-ic-card-horizontal::-moz-focus-inner{border-style:none;padding:0}/*!@button:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring*/button.sc-ic-card-horizontal:-moz-focusring,[type=\"button\"].sc-ic-card-horizontal:-moz-focusring,[type=\"reset\"].sc-ic-card-horizontal:-moz-focusring,[type=\"submit\"].sc-ic-card-horizontal:-moz-focusring{outline:1px dotted ButtonText}/*!@fieldset*/fieldset.sc-ic-card-horizontal{padding:0.35em 0.75em 0.625em}/*!@legend*/legend.sc-ic-card-horizontal{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}/*!@progress*/progress.sc-ic-card-horizontal{vertical-align:baseline}/*!@textarea*/textarea.sc-ic-card-horizontal{overflow:auto}/*!@[type=\"checkbox\"],\n[type=\"radio\"]*/[type=\"checkbox\"].sc-ic-card-horizontal,[type=\"radio\"].sc-ic-card-horizontal{box-sizing:border-box;padding:0}/*!@[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button*/[type=\"number\"].sc-ic-card-horizontal::-webkit-inner-spin-button,[type=\"number\"].sc-ic-card-horizontal::-webkit-outer-spin-button{height:auto}/*!@[type=\"search\"]*/[type=\"search\"].sc-ic-card-horizontal{-webkit-appearance:textfield;outline-offset:-2px}/*!@[type=\"search\"]::-webkit-search-decoration*/[type=\"search\"].sc-ic-card-horizontal::-webkit-search-decoration{-webkit-appearance:none}/*!@::-webkit-file-upload-button*/.sc-ic-card-horizontal::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}/*!@details*/details.sc-ic-card-horizontal{display:block}/*!@summary*/summary.sc-ic-card-horizontal{display:list-item}/*!@template*/template.sc-ic-card-horizontal{display:none}/*!@[hidden]*/[hidden].sc-ic-card-horizontal{display:none}/*!@html,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo*/html.sc-ic-card-horizontal,body.sc-ic-card-horizontal,div.sc-ic-card-horizontal,span.sc-ic-card-horizontal,applet.sc-ic-card-horizontal,object.sc-ic-card-horizontal,iframe.sc-ic-card-horizontal,h1.sc-ic-card-horizontal,h2.sc-ic-card-horizontal,h3.sc-ic-card-horizontal,h4.sc-ic-card-horizontal,h5.sc-ic-card-horizontal,h6.sc-ic-card-horizontal,p.sc-ic-card-horizontal,blockquote.sc-ic-card-horizontal,pre.sc-ic-card-horizontal,a.sc-ic-card-horizontal,abbr.sc-ic-card-horizontal,acronym.sc-ic-card-horizontal,address.sc-ic-card-horizontal,big.sc-ic-card-horizontal,cite.sc-ic-card-horizontal,code.sc-ic-card-horizontal,del.sc-ic-card-horizontal,dfn.sc-ic-card-horizontal,em.sc-ic-card-horizontal,img.sc-ic-card-horizontal,ins.sc-ic-card-horizontal,kbd.sc-ic-card-horizontal,q.sc-ic-card-horizontal,s.sc-ic-card-horizontal,samp.sc-ic-card-horizontal,small.sc-ic-card-horizontal,strike.sc-ic-card-horizontal,strong.sc-ic-card-horizontal,sub.sc-ic-card-horizontal,sup.sc-ic-card-horizontal,tt.sc-ic-card-horizontal,var.sc-ic-card-horizontal,b.sc-ic-card-horizontal,u.sc-ic-card-horizontal,i.sc-ic-card-horizontal,center.sc-ic-card-horizontal,dl.sc-ic-card-horizontal,dt.sc-ic-card-horizontal,dd.sc-ic-card-horizontal,ol.sc-ic-card-horizontal,ul.sc-ic-card-horizontal,li.sc-ic-card-horizontal,fieldset.sc-ic-card-horizontal,form.sc-ic-card-horizontal,label.sc-ic-card-horizontal,legend.sc-ic-card-horizontal,table.sc-ic-card-horizontal,caption.sc-ic-card-horizontal,tbody.sc-ic-card-horizontal,tfoot.sc-ic-card-horizontal,thead.sc-ic-card-horizontal,tr.sc-ic-card-horizontal,th.sc-ic-card-horizontal,td.sc-ic-card-horizontal,article.sc-ic-card-horizontal,aside.sc-ic-card-horizontal,canvas.sc-ic-card-horizontal,details.sc-ic-card-horizontal,embed.sc-ic-card-horizontal,figure.sc-ic-card-horizontal,figcaption.sc-ic-card-horizontal,footer.sc-ic-card-horizontal,header.sc-ic-card-horizontal,hgroup.sc-ic-card-horizontal,menu.sc-ic-card-horizontal,nav.sc-ic-card-horizontal,output.sc-ic-card-horizontal,ruby.sc-ic-card-horizontal,section.sc-ic-card-horizontal,summary.sc-ic-card-horizontal,time.sc-ic-card-horizontal,mark.sc-ic-card-horizontal,audio.sc-ic-card-horizontal,video.sc-ic-card-horizontal{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}/*!@:host*/.sc-ic-card-horizontal-h{display:flex;--card-max-width:548px;--image-size:114px;--message-max-lines:2}/*!@.card.small*/.card.small.sc-ic-card-horizontal{--card-max-width:360px}/*!@.card.large*/.card.large.sc-ic-card-horizontal{--card-max-width:720px;--image-size:142px;--message-max-lines:3}/*!@.card.extra-large*/.card.extra-large.sc-ic-card-horizontal{--card-max-width:1130px;--image-size:186px;--message-max-lines:5}/*!@a*/a.sc-ic-card-horizontal{text-decoration:none !important;color:var(--ic-architectural-black) !important}/*!@button*/button.sc-ic-card-horizontal{border:none;background-color:transparent;outline:var(--ic-hc-focus-outline);padding:0}/*!@.card,\n.card.clickable*/.card.sc-ic-card-horizontal,.card.clickable.sc-ic-card-horizontal{display:flex;flex-direction:row;border:var(--ic-border-default);border-radius:var(--ic-border-radius);box-sizing:border-box;text-align:left;color:var(--ic-architectural-black);transition:var(--ic-easing-transition-fast);position:relative;max-width:var(--card-max-width);height:-moz-fit-content;height:fit-content;width:var(--card-horizontal-width, -moz-fit-content);width:var(--card-horizontal-width, fit-content)}/*!@.dark.card,\n.dark.card.clickable*/.dark.card.sc-ic-card-horizontal,.dark.card.clickable.sc-ic-card-horizontal{border:var(--ic-border-width) solid var(--ic-architectural-700)}/*!@.card.clickable:hover*/.card.clickable.sc-ic-card-horizontal:hover{background-color:var(--ic-action-default-bg-hover);border:var(--ic-border-hover);cursor:pointer}/*!@.card.clickable:focus,\n.card.clickable.focussed*/.card.clickable.sc-ic-card-horizontal:focus,.card.clickable.focussed.sc-ic-card-horizontal{background-color:var(--ic-action-default-bg-hover);box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline);border:var(--ic-border-pressed)}/*!@.card.clickable:active*/.card.clickable.sc-ic-card-horizontal:active{background-color:var(--ic-action-default-bg-active);box-shadow:var(--ic-border-focus)}/*!@.card.disabled*/.card.disabled.sc-ic-card-horizontal{border:var(--ic-border-disabled)}/*!@.card-header*/.card-header.sc-ic-card-horizontal{display:flex;align-items:center}/*!@.icon*/.icon.sc-ic-card-horizontal{display:flex;align-items:center;padding-right:var(--ic-space-xs)}/*!@.card.disabled ::slotted(svg)*/.card.disabled .sc-ic-card-horizontal-s>svg{fill:var(--ic-color-tertiary-text)}/*!@.card.clickable .card-title*/.card.clickable.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{color:var(--ic-hyperlink);text-decoration:underline;text-decoration-thickness:var(--ic-space-1px)}/*!@.card.clickable:hover .card-title,\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title*/.card.clickable.sc-ic-card-horizontal:hover .card-title.sc-ic-card-horizontal,.card.clickable.sc-ic-card-horizontal:focus .card-title.sc-ic-card-horizontal,.card.clickable.focussed.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{display:inline-block;border-bottom:0.25rem solid !important;margin-bottom:-0.25rem !important;text-decoration:none}/*!@.card.clickable:active .card-title*/.card.clickable.sc-ic-card-horizontal:active .card-title.sc-ic-card-horizontal{text-decoration:none}/*!@.card.disabled .card-title*/.card.disabled.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{text-decoration:underline;text-decoration-thickness:var(--ic-space-1px);text-decoration-color:var(--ic-color-tertiary-text);color:var(--ic-color-tertiary-text)}/*!@.card-message*/.card-message.sc-ic-card-horizontal{margin-top:var(--ic-space-xxxs);align-items:left}/*!@.card.disabled .card-message*/.card.disabled.sc-ic-card-horizontal .card-message.sc-ic-card-horizontal{color:var(--ic-color-tertiary-text)}/*!@.image*/.image.sc-ic-card-horizontal{display:flex;height:var(--image-size);width:var(--image-size);border-radius:var(--ic-border-radius)}/*!@.card-content*/.card-content.sc-ic-card-horizontal{display:flex;flex-direction:column;padding:var(--ic-space-md)}/*!@.card .card-title ::slotted([slot=\"heading\"]),\n.card .card-title ic-typography p*/.card .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:calc(var(--card-max-width) - var(--ic-space-xl))}/*!@.card.with-icon .card-title ::slotted([slot=\"heading\"]),\n.card.with-icon .card-title ic-typography p*/.card.with-icon .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.with-icon.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{max-width:calc(var(--card-max-width) - (2 * var(--ic-space-xl)))}/*!@.card.with-image .card-title ::slotted([slot=\"heading\"]),\n.card.with-image .card-title ic-typography p*/.card.with-image .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.with-image.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{max-width:calc(\n    var(--card-max-width) - var(--image-size) - var(--ic-space-xl)\n  )}/*!@.card.with-image.with-icon .card-title ::slotted([slot=\"heading\"]),\n.card.with-image.with-icon .card-title ic-typography p*/.card.with-image.with-icon .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.with-image.with-icon.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{max-width:calc(\n    var(--card-max-width) - var(--image-size) - (2 * var(--ic-space-xl))\n  )}/*!@.card .card-message ::slotted([slot=\"message\"]),\n.card .card-message ic-typography*/.card .card-message .sc-ic-card-horizontal-s>[slot=\"message\"],.card.sc-ic-card-horizontal .card-message.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal{display:-webkit-box;-webkit-box-orient:vertical;line-clamp:var(--message-max-lines, initial);-webkit-line-clamp:var(--message-max-lines, initial);overflow:hidden}@media (forced-colors: active){/*!@.card ::slotted(svg)*/.card .sc-ic-card-horizontal-s>svg{fill:currentcolor}/*!@.card.disabled ::slotted(svg)*/.card.disabled .sc-ic-card-horizontal-s>svg{fill:GrayText !important}/*!@.card.disabled*/.card.disabled.sc-ic-card-horizontal{border-color:GrayText !important}/*!@.card.disabled .card-message,\n  .card.disabled .card-title*/.card.disabled.sc-ic-card-horizontal .card-message.sc-ic-card-horizontal,.card.disabled.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{color:GrayText}}";
+const icCardHorizontalCss = "/*!@html*/html.sc-ic-card-horizontal{line-height:1.15;-webkit-text-size-adjust:100%}/*!@body*/body.sc-ic-card-horizontal{margin:0}/*!@main*/main.sc-ic-card-horizontal{display:block}/*!@h1*/h1.sc-ic-card-horizontal{font-size:2em;margin:0.67em 0}/*!@hr*/hr.sc-ic-card-horizontal{box-sizing:content-box;height:0;overflow:visible}/*!@pre*/pre.sc-ic-card-horizontal{font-family:monospace, monospace;font-size:1em}/*!@a*/a.sc-ic-card-horizontal{background-color:transparent}/*!@abbr[title]*/abbr[title].sc-ic-card-horizontal{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}/*!@b,\nstrong*/b.sc-ic-card-horizontal,strong.sc-ic-card-horizontal{font-weight:bolder}/*!@code,\nkbd,\nsamp*/code.sc-ic-card-horizontal,kbd.sc-ic-card-horizontal,samp.sc-ic-card-horizontal{font-family:monospace, monospace;font-size:1em}/*!@small*/small.sc-ic-card-horizontal{font-size:80%}/*!@sub,\nsup*/sub.sc-ic-card-horizontal,sup.sc-ic-card-horizontal{font-size:75%;line-height:0;position:relative;vertical-align:baseline}/*!@sub*/sub.sc-ic-card-horizontal{bottom:-0.25em}/*!@sup*/sup.sc-ic-card-horizontal{top:-0.5em}/*!@img*/img.sc-ic-card-horizontal{border-style:none}/*!@button,\ninput,\noptgroup,\nselect,\ntextarea*/button.sc-ic-card-horizontal,input.sc-ic-card-horizontal,optgroup.sc-ic-card-horizontal,select.sc-ic-card-horizontal,textarea.sc-ic-card-horizontal{font-family:inherit;font-size:100%;line-height:1.15;margin:0}/*!@button,\ninput*/button.sc-ic-card-horizontal,input.sc-ic-card-horizontal{overflow:visible}/*!@button,\nselect*/button.sc-ic-card-horizontal,select.sc-ic-card-horizontal{text-transform:none}/*!@button,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"]*/button.sc-ic-card-horizontal,[type=\"button\"].sc-ic-card-horizontal,[type=\"reset\"].sc-ic-card-horizontal,[type=\"submit\"].sc-ic-card-horizontal{-webkit-appearance:button}/*!@button::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner*/button.sc-ic-card-horizontal::-moz-focus-inner,[type=\"button\"].sc-ic-card-horizontal::-moz-focus-inner,[type=\"reset\"].sc-ic-card-horizontal::-moz-focus-inner,[type=\"submit\"].sc-ic-card-horizontal::-moz-focus-inner{border-style:none;padding:0}/*!@button:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring*/button.sc-ic-card-horizontal:-moz-focusring,[type=\"button\"].sc-ic-card-horizontal:-moz-focusring,[type=\"reset\"].sc-ic-card-horizontal:-moz-focusring,[type=\"submit\"].sc-ic-card-horizontal:-moz-focusring{outline:1px dotted ButtonText}/*!@fieldset*/fieldset.sc-ic-card-horizontal{padding:0.35em 0.75em 0.625em}/*!@legend*/legend.sc-ic-card-horizontal{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}/*!@progress*/progress.sc-ic-card-horizontal{vertical-align:baseline}/*!@textarea*/textarea.sc-ic-card-horizontal{overflow:auto}/*!@[type=\"checkbox\"],\n[type=\"radio\"]*/[type=\"checkbox\"].sc-ic-card-horizontal,[type=\"radio\"].sc-ic-card-horizontal{box-sizing:border-box;padding:0}/*!@[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button*/[type=\"number\"].sc-ic-card-horizontal::-webkit-inner-spin-button,[type=\"number\"].sc-ic-card-horizontal::-webkit-outer-spin-button{height:auto}/*!@[type=\"search\"]*/[type=\"search\"].sc-ic-card-horizontal{-webkit-appearance:textfield;outline-offset:-2px}/*!@[type=\"search\"]::-webkit-search-decoration*/[type=\"search\"].sc-ic-card-horizontal::-webkit-search-decoration{-webkit-appearance:none}/*!@::-webkit-file-upload-button*/.sc-ic-card-horizontal::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}/*!@details*/details.sc-ic-card-horizontal{display:block}/*!@summary*/summary.sc-ic-card-horizontal{display:list-item}/*!@template*/template.sc-ic-card-horizontal{display:none}/*!@[hidden]*/[hidden].sc-ic-card-horizontal{display:none}/*!@html,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo*/html.sc-ic-card-horizontal,body.sc-ic-card-horizontal,div.sc-ic-card-horizontal,span.sc-ic-card-horizontal,applet.sc-ic-card-horizontal,object.sc-ic-card-horizontal,iframe.sc-ic-card-horizontal,h1.sc-ic-card-horizontal,h2.sc-ic-card-horizontal,h3.sc-ic-card-horizontal,h4.sc-ic-card-horizontal,h5.sc-ic-card-horizontal,h6.sc-ic-card-horizontal,p.sc-ic-card-horizontal,blockquote.sc-ic-card-horizontal,pre.sc-ic-card-horizontal,a.sc-ic-card-horizontal,abbr.sc-ic-card-horizontal,acronym.sc-ic-card-horizontal,address.sc-ic-card-horizontal,big.sc-ic-card-horizontal,cite.sc-ic-card-horizontal,code.sc-ic-card-horizontal,del.sc-ic-card-horizontal,dfn.sc-ic-card-horizontal,em.sc-ic-card-horizontal,img.sc-ic-card-horizontal,ins.sc-ic-card-horizontal,kbd.sc-ic-card-horizontal,q.sc-ic-card-horizontal,s.sc-ic-card-horizontal,samp.sc-ic-card-horizontal,small.sc-ic-card-horizontal,strike.sc-ic-card-horizontal,strong.sc-ic-card-horizontal,sub.sc-ic-card-horizontal,sup.sc-ic-card-horizontal,tt.sc-ic-card-horizontal,var.sc-ic-card-horizontal,b.sc-ic-card-horizontal,u.sc-ic-card-horizontal,i.sc-ic-card-horizontal,center.sc-ic-card-horizontal,dl.sc-ic-card-horizontal,dt.sc-ic-card-horizontal,dd.sc-ic-card-horizontal,ol.sc-ic-card-horizontal,ul.sc-ic-card-horizontal,li.sc-ic-card-horizontal,fieldset.sc-ic-card-horizontal,form.sc-ic-card-horizontal,label.sc-ic-card-horizontal,legend.sc-ic-card-horizontal,table.sc-ic-card-horizontal,caption.sc-ic-card-horizontal,tbody.sc-ic-card-horizontal,tfoot.sc-ic-card-horizontal,thead.sc-ic-card-horizontal,tr.sc-ic-card-horizontal,th.sc-ic-card-horizontal,td.sc-ic-card-horizontal,article.sc-ic-card-horizontal,aside.sc-ic-card-horizontal,canvas.sc-ic-card-horizontal,details.sc-ic-card-horizontal,embed.sc-ic-card-horizontal,figure.sc-ic-card-horizontal,figcaption.sc-ic-card-horizontal,footer.sc-ic-card-horizontal,header.sc-ic-card-horizontal,hgroup.sc-ic-card-horizontal,menu.sc-ic-card-horizontal,nav.sc-ic-card-horizontal,output.sc-ic-card-horizontal,ruby.sc-ic-card-horizontal,section.sc-ic-card-horizontal,summary.sc-ic-card-horizontal,time.sc-ic-card-horizontal,mark.sc-ic-card-horizontal,audio.sc-ic-card-horizontal,video.sc-ic-card-horizontal{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}/*!@:host*/.sc-ic-card-horizontal-h{display:flex;--card-max-width:548px;--image-size:114px;--message-max-lines:2}/*!@.card.small*/.card.small.sc-ic-card-horizontal{--card-max-width:360px}/*!@.card.large*/.card.large.sc-ic-card-horizontal{--card-max-width:720px;--image-size:142px;--message-max-lines:3}/*!@.card.extra-large*/.card.extra-large.sc-ic-card-horizontal{--card-max-width:1130px;--image-size:186px;--message-max-lines:5}/*!@a*/a.sc-ic-card-horizontal{text-decoration:none !important;color:var(--ic-architectural-black) !important}/*!@button*/button.sc-ic-card-horizontal{border:none;background-color:transparent;outline:var(--ic-hc-focus-outline);padding:0}/*!@.card,\n.card.clickable*/.card.sc-ic-card-horizontal,.card.clickable.sc-ic-card-horizontal{display:flex;flex-direction:row;border:var(--ic-border-default);border-radius:var(--ic-border-radius);box-sizing:border-box;text-align:left;color:var(--ic-architectural-black);transition:var(--ic-easing-transition-fast);position:relative;max-width:var(--card-max-width);height:-moz-fit-content;height:fit-content;width:var(--card-horizontal-width, -moz-fit-content);width:var(--card-horizontal-width, fit-content)}/*!@.dark.card,\n.dark.card.clickable*/.dark.card.sc-ic-card-horizontal,.dark.card.clickable.sc-ic-card-horizontal{border:var(--ic-border-width) solid var(--ic-architectural-700)}/*!@.card.clickable:hover*/.card.clickable.sc-ic-card-horizontal:hover{background-color:var(--ic-action-default-bg-hover);border:var(--ic-border-hover);cursor:pointer}/*!@.card.clickable:focus,\n.card.clickable.focussed*/.card.clickable.sc-ic-card-horizontal:focus,.card.clickable.focussed.sc-ic-card-horizontal{background-color:var(--ic-action-default-bg-hover);box-shadow:var(--ic-border-focus);outline:var(--ic-hc-focus-outline);border:var(--ic-border-pressed)}/*!@.card.clickable:active*/.card.clickable.sc-ic-card-horizontal:active{background-color:var(--ic-action-default-bg-active);box-shadow:var(--ic-border-focus)}/*!@.card.disabled*/.card.disabled.sc-ic-card-horizontal{border:var(--ic-border-disabled)}/*!@.card-header*/.card-header.sc-ic-card-horizontal{display:flex;align-items:center}/*!@.icon*/.icon.sc-ic-card-horizontal{display:flex;align-items:center;padding-right:var(--ic-space-xs)}/*!@.card.disabled ::slotted(svg)*/.card.disabled .sc-ic-card-horizontal-s>svg{fill:var(--ic-color-tertiary-text)}/*!@.card.clickable .card-title*/.card.clickable.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{color:var(--ic-hyperlink);text-decoration:underline;text-decoration-thickness:var(--ic-space-1px)}/*!@.card.clickable:hover .card-title,\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title*/.card.clickable.sc-ic-card-horizontal:hover .card-title.sc-ic-card-horizontal,.card.clickable.sc-ic-card-horizontal:focus .card-title.sc-ic-card-horizontal,.card.clickable.focussed.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{display:inline-block;border-bottom:0.25rem solid !important;margin-bottom:-0.25rem !important;text-decoration:none}/*!@.card.clickable:active .card-title*/.card.clickable.sc-ic-card-horizontal:active .card-title.sc-ic-card-horizontal{text-decoration:none}/*!@.card.disabled .card-title*/.card.disabled.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{text-decoration:underline;text-decoration-thickness:var(--ic-space-1px);text-decoration-color:var(--ic-color-tertiary-text);color:var(--ic-color-tertiary-text)}/*!@.card-message*/.card-message.sc-ic-card-horizontal{margin-top:var(--ic-space-xxxs);align-items:left}/*!@.card.disabled .card-message*/.card.disabled.sc-ic-card-horizontal .card-message.sc-ic-card-horizontal{color:var(--ic-color-tertiary-text)}/*!@.image*/.image.sc-ic-card-horizontal{display:flex;border-radius:var(--ic-border-radius)}/*!@.image ::slotted([slot=\"image\"])*/.image .sc-ic-card-horizontal-s>[slot=\"image\"]{height:var(--image-size);width:var(--image-size)}/*!@.card-content*/.card-content.sc-ic-card-horizontal{display:flex;flex-direction:column;padding:var(--ic-space-md)}/*!@.card .card-title ::slotted([slot=\"heading\"]),\n.card .card-title ic-typography p*/.card .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:calc(var(--card-max-width) - var(--ic-space-xl))}/*!@.card.with-icon .card-title ::slotted([slot=\"heading\"]),\n.card.with-icon .card-title ic-typography p*/.card.with-icon .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.with-icon.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{max-width:calc(var(--card-max-width) - (2 * var(--ic-space-xl)))}/*!@.card.with-image .card-title ::slotted([slot=\"heading\"]),\n.card.with-image .card-title ic-typography p*/.card.with-image .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.with-image.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{max-width:calc(\n    var(--card-max-width) - var(--image-size) - var(--ic-space-xl)\n  )}/*!@.card.with-image.with-icon .card-title ::slotted([slot=\"heading\"]),\n.card.with-image.with-icon .card-title ic-typography p*/.card.with-image.with-icon .card-title .sc-ic-card-horizontal-s>[slot=\"heading\"],.card.with-image.with-icon.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal p.sc-ic-card-horizontal{max-width:calc(\n    var(--card-max-width) - var(--image-size) - (2 * var(--ic-space-xl))\n  )}/*!@.card .card-message ::slotted([slot=\"message\"]),\n.card .card-message ic-typography*/.card .card-message .sc-ic-card-horizontal-s>[slot=\"message\"],.card.sc-ic-card-horizontal .card-message.sc-ic-card-horizontal ic-typography.sc-ic-card-horizontal{display:-webkit-box;-webkit-box-orient:vertical;line-clamp:var(--message-max-lines, initial);-webkit-line-clamp:var(--message-max-lines, initial);overflow:hidden}@media (forced-colors: active){/*!@.card ::slotted(svg)*/.card .sc-ic-card-horizontal-s>svg{fill:currentcolor}/*!@.card.disabled ::slotted(svg)*/.card.disabled .sc-ic-card-horizontal-s>svg{fill:GrayText !important}/*!@.card.disabled*/.card.disabled.sc-ic-card-horizontal{border-color:GrayText !important}/*!@.card.disabled .card-message,\n  .card.disabled .card-title*/.card.disabled.sc-ic-card-horizontal .card-message.sc-ic-card-horizontal,.card.disabled.sc-ic-card-horizontal .card-title.sc-ic-card-horizontal{color:GrayText}}";
 
 /**
  * @slot heading - Content will be placed at the top of the horizontal card to the right of the icon.
@@ -10029,6 +10048,9 @@ class Card {
         this.size = "medium";
         this.target = undefined;
     }
+    watchDisabledHandler() {
+        removeDisabledFalse(this.disabled, this.el);
+    }
     disconnectedCallback() {
         var _a;
         if (this.parentIsAnchorTag) {
@@ -10113,6 +10135,9 @@ class Card {
             } }, message && (hAsync("ic-typography", { variant: "body" }, message)), isSlotUsed(this.el, "message") && hAsync("slot", { name: "message" })))), isSlotUsed(this.el, "badge") && hAsync("slot", { name: "badge" })));
     }
     get el() { return getElement(this); }
+    static get watchers() { return {
+        "disabled": ["watchDisabledHandler"]
+    }; }
     static get style() { return icCardHorizontalCss; }
     static get cmpMeta() { return {
         "$flags$": 9,
@@ -10184,6 +10209,9 @@ class Checkbox {
         this.value = undefined;
         this.hideLabel = false;
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     watchIndeterminateHandler() {
         this.displayIndeterminate = this.nativeIndeterminateBehaviour
             ? this.indeterminate
@@ -10254,6 +10282,7 @@ class Checkbox {
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
         "indeterminate": ["watchIndeterminateHandler"]
     }; }
     static get style() { return icCheckboxCss; }
@@ -10308,6 +10337,9 @@ class CheckboxGroup {
         this.validationStatus = "";
         this.validationText = "";
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     labelNameHandler(newValue, oldValue, propName) {
         Array.from(this.el.querySelectorAll("ic-checkbox")).forEach((checkbox) => {
             if (propName === "label")
@@ -10357,6 +10389,7 @@ class CheckboxGroup {
     }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
         "label": ["labelNameHandler"],
         "name": ["labelNameHandler"]
     }; }
@@ -10427,12 +10460,16 @@ class Chip {
         this.size = "default";
         this.transparentBackground = true;
         this.variant = "filled";
+        this.dismissLabel = "Dismiss";
     }
     customColorHandler() {
         if (!this.dismissible) {
             this.setChipColour();
         }
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     componentWillLoad() {
         removeDisabledFalse$1(this.disabled, this.el);
         if (!this.dismissible) {
@@ -10461,7 +10498,7 @@ class Chip {
         (_a = this.el.shadowRoot.querySelector("button")) === null || _a === void 0 ? void 0 : _a.focus();
     }
     render() {
-        const { label, appearance, variant, size, dismissible, visible, disabled, hovered, } = this;
+        const { label, appearance, variant, size, dismissible, visible, disabled, hovered, dismissLabel, } = this;
         return (visible && (hAsync("div", { class: {
                 chip: true,
                 [`${appearance}`]: appearance !== undefined,
@@ -10471,12 +10508,13 @@ class Chip {
                 dismissible,
                 hovered,
                 "white-background": this.variant === "outlined" && !this.transparentBackground,
-            } }, isSlotUsed$1(this.el, "icon") && (hAsync("div", { class: "icon" }, hAsync("slot", { name: "icon" }))), hAsync("ic-typography", { variant: "label", "apply-vertical-margins": false, class: { label: true, "in-ag-grid": this.inAGGrid } }, hAsync("span", null, label)), dismissible && (hAsync("ic-tooltip", { label: "Dismiss", target: "dismiss-icon", class: { "tooltip-disabled": disabled } }, hAsync("button", { id: "dismiss-icon", class: "dismiss-icon", "aria-label": `Dismiss ${label} chip`, disabled: disabled, tabindex: disabled ? -1 : 0, onClick: this.dismissAction, onMouseEnter: this.mouseEnterHandler, onMouseLeave: this.mouseLeaveHandler, innerHTML: dismissIcon }))), isSlotUsed$1(this.el, "badge") && hAsync("slot", { name: "badge" }))));
+            } }, isSlotUsed$1(this.el, "icon") && (hAsync("div", { class: "icon" }, hAsync("slot", { name: "icon" }))), hAsync("ic-typography", { variant: "label", "apply-vertical-margins": false, class: { label: true, "in-ag-grid": this.inAGGrid } }, hAsync("span", null, label)), dismissible && (hAsync("ic-tooltip", { label: dismissLabel, target: "dismiss-icon", class: { "tooltip-disabled": disabled } }, hAsync("button", { id: "dismiss-icon", class: "dismiss-icon", "aria-label": `${dismissLabel} ${label} chip`, disabled: disabled, tabindex: disabled ? -1 : 0, onClick: this.dismissAction, onMouseEnter: this.mouseEnterHandler, onMouseLeave: this.mouseLeaveHandler, innerHTML: dismissIcon }))), isSlotUsed$1(this.el, "badge") && hAsync("slot", { name: "badge" }))));
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
     static get watchers() { return {
-        "customColor": ["customColorHandler"]
+        "customColor": ["customColorHandler"],
+        "disabled": ["watchDisabledHandler"]
     }; }
     static get style() { return icChipCss; }
     static get cmpMeta() { return {
@@ -10491,6 +10529,7 @@ class Chip {
             "size": [1],
             "transparentBackground": [4, "transparent-background"],
             "variant": [1],
+            "dismissLabel": [1, "dismiss-label"],
             "hovered": [32],
             "visible": [32],
             "setFocus": [64]
@@ -10691,7 +10730,7 @@ var descendingIcon = `<svg focusable="false" aria-hidden="true" viewBox="0 0 24
     <path d="M16.01 11H4v2h12.01v3L20 12l-3.99-4z"></path>
 </svg>`;
 
-const icDataTableCss = "/*!@:host*/.sc-ic-data-table-h{position:relative;display:inline-flex;max-height:100%;width:var(--table-width, 100%);height:100%;min-width:var(--table-min-width);max-width:var(--table-max-width)}/*!@tbody*/tbody.sc-ic-data-table{vertical-align:top}/*!@.table-container*/.table-container.sc-ic-data-table{position:relative;height:calc(100% - var(--ic-space-xxxs));display:flex;flex-direction:column;width:100%}/*!@.cell-container*/.cell-container.sc-ic-data-table{display:flex;min-height:1.5rem;overflow-y:hidden;height:var(--row-height)}/*!@.truncation-show-hide*/.truncation-show-hide.sc-ic-data-table{overflow:visible;display:block}/*!@.cell-icon.truncation-show-hide*/.cell-icon.truncation-show-hide.sc-ic-data-table{display:flex}/*!@.cell-container:not(.data-type-element, .truncation-show-hide)*/.cell-container.sc-ic-data-table:not(.data-type-element,.truncation-show-hide).sc-ic-data-table{overflow-x:hidden}/*!@ic-loading-indicator*/ic-loading-indicator.sc-ic-data-table{position:sticky;top:20px}/*!@.table-row-container*/.table-row-container.sc-ic-data-table{position:relative;height:100%;overflow:auto;transition:var(--ic-easing-transition-fast);overflow-anchor:none}/*!@:host([show-pagination=\"true\"]) .table-row-container*/[show-pagination=\"true\"].sc-ic-data-table-h .table-row-container.sc-ic-data-table{height:calc(100% - 3.5625rem)}/*!@table*/table.sc-ic-data-table{table-layout:var(--table-layout, \"fixed\");border-spacing:0;width:100%;height:var(--table-height, auto)}/*!@.table-row-container:focus*/.table-row-container.sc-ic-data-table:focus{outline:none;box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-fast);z-index:1}/*!@:host([embedded=\"true\"]) .table-row-container*/[embedded=\"true\"].sc-ic-data-table-h .table-row-container.sc-ic-data-table{border:var(--ic-border-light)}/*!@.column-header-inner-container*/.column-header-inner-container.sc-ic-data-table{padding:var(--ic-space-xs);box-sizing:border-box}/*!@.column-header-inner-container ic-tooltip*/.column-header-inner-container.sc-ic-data-table ic-tooltip.sc-ic-data-table{pointer-events:none}/*!@.column-header-inner-container ic-tooltip.show-trunc-tooltip*/.column-header-inner-container.sc-ic-data-table ic-tooltip.show-trunc-tooltip.sc-ic-data-table{pointer-events:auto}/*!@.column-header-inner-container ic-tooltip .column-header-text*/.column-header-inner-container.sc-ic-data-table ic-tooltip.sc-ic-data-table .column-header-text.sc-ic-data-table{--ic-line-clamp:1}/*!@.column-header-sticky*/.column-header-sticky.sc-ic-data-table{position:sticky;top:0;z-index:1}/*!@.column-header-overlay*/.column-header-overlay.sc-ic-data-table{position:sticky;top:0;z-index:1;box-shadow:0 0.375rem var(--ic-space-xs) calc(var(--ic-space-xxs * -1))\n    rgb(0 0 0 / 20%)}/*!@.row-header-sticky*/.row-header-sticky.sc-ic-data-table{position:sticky;left:0}/*!@.column-header,\n.table-row*/.column-header.sc-ic-data-table,.table-row.sc-ic-data-table{box-sizing:border-box}/*!@.table-row-selected*/.table-row-selected.sc-ic-data-table{background-color:var(--ic-table-row-selected) !important}/*!@.sort-button*/.sort-button.sc-ic-data-table{margin-left:auto}/*!@.sort-button:hover*/.sort-button.sc-ic-data-table:hover{background-color:var(--ic-action-dark-bg-hover)}/*!@.sort-button:active*/.sort-button.sc-ic-data-table:active{background-color:var(--ic-action-dark-bg-active)}/*!@.sort-button svg*/.sort-button.sc-ic-data-table svg.sc-ic-data-table{color:var(--ic-architectural-black)}/*!@.sort-button-unsorted svg*/.sort-button-unsorted.sc-ic-data-table svg.sc-ic-data-table{color:var(--ic-color-tertiary-text)}/*!@.table-density-dense .column-header-inner-container,\ntd.table-density-dense*/.table-density-dense.sc-ic-data-table .column-header-inner-container.sc-ic-data-table,td.table-density-dense.sc-ic-data-table{padding:var(--ic-space-xxs) var(--ic-space-xs) !important}/*!@.text-dense*/.text-dense.sc-ic-data-table{font-size:var(--ic-font-size-label)}/*!@.table-density-spacious .column-header-inner-container,\ntd.table-density-spacious*/.table-density-spacious.sc-ic-data-table .column-header-inner-container.sc-ic-data-table,td.table-density-spacious.sc-ic-data-table{padding:0.625rem var(--ic-space-xs) !important}/*!@.text-spacious*/.text-spacious.sc-ic-data-table{font-size:1.125rem}/*!@.column-header-text*/.column-header-text.sc-ic-data-table{font-weight:var(--ic-font-weight-bold)}/*!@.dummy-column-header-text*/.dummy-column-header-text.sc-ic-data-table{white-space:nowrap;overflow:hidden;height:0;width:-moz-fit-content;width:fit-content}/*!@.row-header,\n.column-header*/.row-header.sc-ic-data-table,.column-header.sc-ic-data-table{text-align:left;padding:var(--ic-space-xs);background-color:var(--ic-architectural-40);border-right:var(--ic-border-light);border-bottom:var(--ic-border-light)}/*!@.column-header*/.column-header.sc-ic-data-table{padding:0;width:var(--column-width);min-width:var(--column-min-width, 4rem);max-width:var(--column-max-width)}/*!@.column-header:last-child*/.column-header.sc-ic-data-table:last-child{border-right:none}/*!@.scrollable .column-header:last-child*/.scrollable.sc-ic-data-table .column-header.sc-ic-data-table:last-child{border-right:var(--ic-border-light) !important}/*!@:host([embedded=\"true\"]) tr:last-child .table-cell,\n:host([embedded=\"true\"]) tr:last-child .row-header*/[embedded=\"true\"].sc-ic-data-table-h tr.sc-ic-data-table:last-child .table-cell.sc-ic-data-table,[embedded=\"true\"].sc-ic-data-table-h tr.sc-ic-data-table:last-child .row-header.sc-ic-data-table{border-bottom:none}/*!@.column-header-alignment-left,\n.row-header-alignment-left,\n.cell-alignment-left*/.column-header-alignment-left.sc-ic-data-table,.row-header-alignment-left.sc-ic-data-table,.cell-alignment-left.sc-ic-data-table{text-align:left !important;justify-content:start !important}/*!@.column-header-alignment-right,\n.row-header-alignment-right,\n.cell-alignment-right*/.column-header-alignment-right.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table,.cell-alignment-right.sc-ic-data-table{text-align:right !important;justify-content:end !important}/*!@.cell-alignment-right.truncation-tooltip ic-tooltip ic-typography*/.cell-alignment-right.truncation-tooltip.sc-ic-data-table ic-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table{padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}/*!@.cell-alignment-right.truncation-show-hide ic-typography*/.cell-alignment-right.truncation-show-hide.sc-ic-data-table ic-typography.sc-ic-data-table{--ellipsis-padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}/*!@.column-header-alignment-center,\n.row-header-alignment-center,\n.cell-alignment-center*/.column-header-alignment-center.sc-ic-data-table,.row-header-alignment-center.sc-ic-data-table,.cell-alignment-center.sc-ic-data-table{text-align:center !important;justify-content:center !important}/*!@.table-row:nth-child(even)*/.table-row.sc-ic-data-table:nth-child(even){background-color:var(--ic-architectural-20)}/*!@.table-cell*/.table-cell.sc-ic-data-table{padding:var(--ic-space-xs);border-bottom:solid var(--ic-architectural-100) var(--ic-space-1px);overflow:hidden;box-sizing:border-box;max-width:var(--column-max-width);min-width:var(--column-min-width)}/*!@.table-cell.with-overflow*/.table-cell.with-overflow.sc-ic-data-table{overflow:visible}/*!@.data-type-string,\n.data-type-address*/.data-type-string.sc-ic-data-table,.data-type-address.sc-ic-data-table{text-align:left;vertical-align:top}/*!@.data-type-number,\n.data-type-date*/.data-type-number.sc-ic-data-table,.data-type-date.sc-ic-data-table{text-align:right;justify-content:end;vertical-align:top}/*!@.cell-alignment-top*/.cell-alignment-top.sc-ic-data-table{vertical-align:top;align-items:flex-start}/*!@.cell-alignment-middle*/.cell-alignment-middle.sc-ic-data-table{vertical-align:middle;align-items:center}/*!@.cell-alignment-bottom*/.cell-alignment-bottom.sc-ic-data-table{vertical-align:bottom;align-items:flex-end}/*!@.cell-emphasis-low*/.cell-emphasis-low.sc-ic-data-table{color:var(--ic-color-secondary-text)}/*!@.cell-emphasis-high*/.cell-emphasis-high.sc-ic-data-table{font-weight:var(--ic-font-weight-bold)}/*!@.pagination-container*/.pagination-container.sc-ic-data-table{background-color:var(--ic-architectural-40);border-top:var(--ic-border-light)}/*!@.screen-reader-sort-text,\n.table-caption*/.screen-reader-sort-text.sc-ic-data-table,.table-caption.sc-ic-data-table{position:absolute;left:-100rem}/*!@.table-cell,\n.column-header,\n.row-header*/.table-cell.sc-ic-data-table,.column-header.sc-ic-data-table,.row-header.sc-ic-data-table{word-wrap:break-word;white-space:pre-wrap}/*!@.loading-empty*/.loading-empty.sc-ic-data-table{padding:var(--ic-space-xl) var(--ic-space-xxl);margin-top:var(--ic-space-xl)}/*!@.updating-state*/.updating-state.sc-ic-data-table{padding:0;border-bottom:var(--ic-border-light)}/*!@.updating-state-headers*/.updating-state-headers.sc-ic-data-table{border-bottom:none}/*!@.loading*/.loading.sc-ic-data-table{position:absolute;left:calc(50% - 5.9741rem);opacity:0;transition:opacity var(--ic-transition-duration-slow)}/*!@.loading.show-background*/.loading.show-background.sc-ic-data-table{background-color:var(--ic-architectural-white);border:var(--ic-border-light)}/*!@.loading.show*/.loading.show.sc-ic-data-table{opacity:1}/*!@.icon,\n::slotted(svg)*/.icon.sc-ic-data-table,.sc-ic-data-table-s>svg{height:var(--ic-space-lg);width:var(--ic-space-lg);margin-right:var(--ic-space-xxs)}/*!@.column-header-alignment-right > .icon,\n.row-header-alignment-right > .icon,\n.cell-alignment-right > .icon,\n.column-header-alignment-right > ::slotted(svg),\n.row-header-alignment-right > ::slotted(svg),\n.cell-alignment-right > ::slotted(svg)*/.column-header-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.cell-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.column-header-alignment-right>.sc-ic-data-table-s>svg,.row-header-alignment-right>.sc-ic-data-table-s>svg,.cell-alignment-right>.sc-ic-data-table-s>svg{margin-right:auto}/*!@.column-header-alignment-center > ic-typography,\n.row-header-alignment-right > ic-typography,\n.cell-alignment-center > ic-typography*/.column-header-alignment-center.sc-ic-data-table>ic-typography.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table>ic-typography.sc-ic-data-table,.cell-alignment-center.sc-ic-data-table>ic-typography.sc-ic-data-table{flex:1}/*!@.icon > svg*/.icon.sc-ic-data-table>svg.sc-ic-data-table{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}/*!@.truncation-tooltip ic-typography*/.truncation-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table{display:-webkit-box;-webkit-line-clamp:var(--ic-line-clamp, 0);-webkit-box-orient:vertical;overflow:hidden}/*!@.truncation-tooltip ic-typography,\n.truncation-show-hide ic-typography*/.truncation-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table,.truncation-show-hide.sc-ic-data-table ic-typography.sc-ic-data-table{white-space:normal}/*!@.ic-tooltip-overflow*/.ic-tooltip-overflow.sc-ic-data-table{overflow:hidden;width:100%}@media screen and (min-width: 577px){/*!@.column-header-inner-container*/.column-header-inner-container.sc-ic-data-table{display:flex;align-items:center}}";
+const icDataTableCss = "/*!@:host*/.sc-ic-data-table-h{position:relative;display:inline-flex;max-height:100%;width:var(--table-width, 100%);height:100%;min-width:var(--table-min-width);max-width:var(--table-max-width)}/*!@tbody*/tbody.sc-ic-data-table{vertical-align:top}/*!@.table-container*/.table-container.sc-ic-data-table{position:relative;height:calc(100% - var(--ic-space-xxxs));display:flex;flex-direction:column;width:100%}/*!@.cell-container*/.cell-container.sc-ic-data-table{display:flex;min-height:1.5rem;overflow-y:hidden;height:var(--row-height)}/*!@.truncation-show-hide*/.truncation-show-hide.sc-ic-data-table{overflow:visible;display:block}/*!@.cell-icon.truncation-show-hide*/.cell-icon.truncation-show-hide.sc-ic-data-table{display:flex}/*!@.cell-container:not(.data-type-element, .truncation-show-hide)*/.cell-container.sc-ic-data-table:not(.data-type-element,.truncation-show-hide).sc-ic-data-table{overflow-x:hidden}/*!@ic-loading-indicator*/ic-loading-indicator.sc-ic-data-table{position:sticky;top:20px}/*!@.table-row-container*/.table-row-container.sc-ic-data-table{position:relative;height:100%;overflow:auto;transition:var(--ic-easing-transition-fast);overflow-anchor:none}/*!@:host([show-pagination=\"true\"]) .table-row-container*/[show-pagination=\"true\"].sc-ic-data-table-h .table-row-container.sc-ic-data-table{height:calc(100% - 3.5625rem)}/*!@table*/table.sc-ic-data-table{table-layout:var(--table-layout, \"fixed\");border-spacing:0;width:100%;height:var(--table-height, auto)}/*!@.table-row-container:focus*/.table-row-container.sc-ic-data-table:focus{outline:none;box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-easing-transition-fast);z-index:1}/*!@:host([embedded=\"true\"]) .table-row-container*/[embedded=\"true\"].sc-ic-data-table-h .table-row-container.sc-ic-data-table{border:var(--ic-border-light)}/*!@.column-header-inner-container*/.column-header-inner-container.sc-ic-data-table{padding:var(--ic-space-xs);box-sizing:border-box}/*!@.column-header-inner-container ic-tooltip*/.column-header-inner-container.sc-ic-data-table ic-tooltip.sc-ic-data-table{pointer-events:none}/*!@.column-header-inner-container ic-tooltip.show-trunc-tooltip*/.column-header-inner-container.sc-ic-data-table ic-tooltip.show-trunc-tooltip.sc-ic-data-table{pointer-events:auto}/*!@.column-header-inner-container ic-tooltip .column-header-text*/.column-header-inner-container.sc-ic-data-table ic-tooltip.sc-ic-data-table .column-header-text.sc-ic-data-table{--ic-line-clamp:1}/*!@.column-header-sticky*/.column-header-sticky.sc-ic-data-table{position:sticky;top:0;z-index:1}/*!@.column-header-overlay*/.column-header-overlay.sc-ic-data-table{position:sticky;top:0;z-index:1;box-shadow:0 0.375rem var(--ic-space-xs) calc(var(--ic-space-xxs * -1))\n    rgb(0 0 0 / 20%)}/*!@.row-header-sticky*/.row-header-sticky.sc-ic-data-table{position:sticky;left:0}/*!@.column-header,\n.table-row*/.column-header.sc-ic-data-table,.table-row.sc-ic-data-table{box-sizing:border-box}/*!@.table-row-selected*/.table-row-selected.sc-ic-data-table{background-color:var(--ic-table-row-selected) !important}/*!@.sort-button*/.sort-button.sc-ic-data-table{margin-left:auto}/*!@.sort-button:hover*/.sort-button.sc-ic-data-table:hover{background-color:var(--ic-action-dark-bg-hover)}/*!@.sort-button:active*/.sort-button.sc-ic-data-table:active{background-color:var(--ic-action-dark-bg-active)}/*!@.sort-button svg*/.sort-button.sc-ic-data-table svg.sc-ic-data-table{color:var(--ic-architectural-black)}/*!@.sort-button-unsorted svg*/.sort-button-unsorted.sc-ic-data-table svg.sc-ic-data-table{color:var(--ic-color-tertiary-text)}/*!@.table-density-dense .column-header-inner-container,\ntd.table-density-dense*/.table-density-dense.sc-ic-data-table .column-header-inner-container.sc-ic-data-table,td.table-density-dense.sc-ic-data-table{padding:var(--ic-space-xxs) var(--ic-space-xs) !important}/*!@.text-dense*/.text-dense.sc-ic-data-table{font-size:var(--ic-font-size-label)}/*!@.table-density-spacious .column-header-inner-container,\ntd.table-density-spacious*/.table-density-spacious.sc-ic-data-table .column-header-inner-container.sc-ic-data-table,td.table-density-spacious.sc-ic-data-table{padding:0.625rem var(--ic-space-xs) !important}/*!@.text-spacious*/.text-spacious.sc-ic-data-table{font-size:1.125rem}/*!@.column-header-text*/.column-header-text.sc-ic-data-table{font-weight:var(--ic-font-weight-bold)}/*!@.dummy-column-header-text*/.dummy-column-header-text.sc-ic-data-table{white-space:nowrap;overflow:hidden;height:0;width:-moz-fit-content;width:fit-content}/*!@.row-header,\n.column-header*/.row-header.sc-ic-data-table,.column-header.sc-ic-data-table{text-align:left;padding:var(--ic-space-xs);background-color:var(--ic-architectural-40);border-right:var(--ic-border-light);border-bottom:var(--ic-border-light)}/*!@.column-header*/.column-header.sc-ic-data-table{padding:0;width:var(--column-width);min-width:var(--column-min-width, 4rem);max-width:var(--column-max-width)}/*!@.column-header:last-child*/.column-header.sc-ic-data-table:last-child{border-right:none}/*!@.scrollable .column-header:last-child*/.scrollable.sc-ic-data-table .column-header.sc-ic-data-table:last-child{border-right:var(--ic-border-light) !important}/*!@:host([embedded=\"true\"]) tr:last-child .table-cell,\n:host([embedded=\"true\"]) tr:last-child .row-header*/[embedded=\"true\"].sc-ic-data-table-h tr.sc-ic-data-table:last-child .table-cell.sc-ic-data-table,[embedded=\"true\"].sc-ic-data-table-h tr.sc-ic-data-table:last-child .row-header.sc-ic-data-table{border-bottom:none}/*!@.column-header-alignment-left,\n.row-header-alignment-left,\n.cell-alignment-left*/.column-header-alignment-left.sc-ic-data-table,.row-header-alignment-left.sc-ic-data-table,.cell-alignment-left.sc-ic-data-table{text-align:left !important;justify-content:start !important}/*!@.column-header-alignment-right,\n.row-header-alignment-right,\n.cell-alignment-right*/.column-header-alignment-right.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table,.cell-alignment-right.sc-ic-data-table{text-align:right !important;justify-content:end !important}/*!@.cell-alignment-right.truncation-tooltip ic-tooltip ic-typography*/.cell-alignment-right.truncation-tooltip.sc-ic-data-table ic-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table{padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}/*!@.cell-alignment-right.truncation-show-hide ic-typography*/.cell-alignment-right.truncation-show-hide.sc-ic-data-table ic-typography.sc-ic-data-table{--ellipsis-padding-right:calc(var(--ic-space-xxs) + var(--ic-space-xs))}/*!@.column-header-alignment-center,\n.row-header-alignment-center,\n.cell-alignment-center*/.column-header-alignment-center.sc-ic-data-table,.row-header-alignment-center.sc-ic-data-table,.cell-alignment-center.sc-ic-data-table{text-align:center !important;justify-content:center !important}/*!@.table-row:nth-child(even)*/.table-row.sc-ic-data-table:nth-child(even){background-color:var(--ic-architectural-20)}/*!@.table-cell*/.table-cell.sc-ic-data-table{padding:var(--ic-space-xs);border-bottom:solid var(--ic-architectural-100) var(--ic-space-1px);overflow:hidden;box-sizing:border-box;max-width:var(--column-max-width);min-width:var(--column-min-width)}/*!@.table-cell.with-overflow*/.table-cell.with-overflow.sc-ic-data-table{overflow:visible}/*!@.data-type-string,\n.data-type-address*/.data-type-string.sc-ic-data-table,.data-type-address.sc-ic-data-table{text-align:left;vertical-align:top}/*!@.data-type-number,\n.data-type-date*/.data-type-number.sc-ic-data-table,.data-type-date.sc-ic-data-table{text-align:right;justify-content:end;vertical-align:top}/*!@.cell-alignment-top*/.cell-alignment-top.sc-ic-data-table{vertical-align:top;align-items:flex-start}/*!@.cell-alignment-middle*/.cell-alignment-middle.sc-ic-data-table{vertical-align:middle;align-items:center}/*!@.cell-alignment-bottom*/.cell-alignment-bottom.sc-ic-data-table{vertical-align:bottom;align-items:flex-end}/*!@.cell-emphasis-low*/.cell-emphasis-low.sc-ic-data-table{color:var(--ic-color-secondary-text)}/*!@.cell-emphasis-high*/.cell-emphasis-high.sc-ic-data-table{font-weight:var(--ic-font-weight-bold)}/*!@.pagination-container*/.pagination-container.sc-ic-data-table{background-color:var(--ic-architectural-40);border-top:var(--ic-border-light)}/*!@.screen-reader-sort-text,\n.table-caption*/.screen-reader-sort-text.sc-ic-data-table,.table-caption.sc-ic-data-table{position:absolute;left:-100rem}/*!@.table-cell,\n.column-header,\n.row-header*/.table-cell.sc-ic-data-table,.column-header.sc-ic-data-table,.row-header.sc-ic-data-table{word-wrap:break-word;white-space:pre-wrap}/*!@.loading-empty*/.loading-empty.sc-ic-data-table{padding:var(--ic-space-xl) var(--ic-space-xxl);margin-top:var(--ic-space-xl)}/*!@.updating-state*/.updating-state.sc-ic-data-table{padding:0;border-bottom:var(--ic-border-light)}/*!@.updating-state-headers*/.updating-state-headers.sc-ic-data-table{border-bottom:none}/*!@.loading*/.loading.sc-ic-data-table{position:absolute;left:calc(50% - 5.9741rem);opacity:0;transition:opacity var(--ic-transition-duration-slow)}/*!@.loading.show-background*/.loading.show-background.sc-ic-data-table{background-color:var(--ic-architectural-white);border:var(--ic-border-light)}/*!@.loading.show*/.loading.show.sc-ic-data-table{opacity:1}/*!@.icon,\n::slotted(svg)*/.icon.sc-ic-data-table,.sc-ic-data-table-s>svg{height:var(--ic-space-lg);width:var(--ic-space-lg);margin-right:var(--ic-space-xxs)}/*!@.column-header-alignment-right > .icon,\n.row-header-alignment-right > .icon,\n.cell-alignment-right > .icon,\n.column-header-alignment-right > ::slotted(svg),\n.row-header-alignment-right > ::slotted(svg),\n.cell-alignment-right > ::slotted(svg)*/.column-header-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.cell-alignment-right.sc-ic-data-table>.icon.sc-ic-data-table,.column-header-alignment-right>.sc-ic-data-table-s>svg,.row-header-alignment-right>.sc-ic-data-table-s>svg,.cell-alignment-right>.sc-ic-data-table-s>svg{margin-right:auto}/*!@.column-header-alignment-center > ic-typography,\n.row-header-alignment-right > ic-typography,\n.cell-alignment-center > ic-typography*/.column-header-alignment-center.sc-ic-data-table>ic-typography.sc-ic-data-table,.row-header-alignment-right.sc-ic-data-table>ic-typography.sc-ic-data-table,.cell-alignment-center.sc-ic-data-table>ic-typography.sc-ic-data-table{flex:1}/*!@.icon > svg*/.icon.sc-ic-data-table>svg.sc-ic-data-table{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}/*!@.truncation-tooltip ic-typography*/.truncation-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table{display:-webkit-box;-webkit-line-clamp:var(--ic-line-clamp, 0);-webkit-box-orient:vertical;overflow:hidden}/*!@.truncation-tooltip ic-typography,\n.truncation-show-hide ic-typography*/.truncation-tooltip.sc-ic-data-table ic-typography.sc-ic-data-table,.truncation-show-hide.sc-ic-data-table ic-typography.sc-ic-data-table{white-space:normal}/*!@.ic-tooltip-overflow*/.ic-tooltip-overflow.sc-ic-data-table{overflow:hidden;width:100%}/*!@.action-element*/.action-element.sc-ic-data-table{display:flex;justify-content:right}/*!@.cell-grid-wrapper*/.cell-grid-wrapper.sc-ic-data-table{display:grid;grid-template-columns:auto auto}@media screen and (min-width: 577px){/*!@.column-header-inner-container*/.column-header-inner-container.sc-ic-data-table{display:flex;align-items:center}}";
 
 /**
  * @slot empty-state - Content is slotted below the table header when there is no data and the table is not loading.
@@ -10900,7 +10939,7 @@ class DataTable {
                 this.timerStarted = null;
             }, this.minimumLoadingDisplayDuration);
         };
-        this.isObject = (value) => typeof value === "object";
+        this.isObject = (value) => value !== undefined && value !== null && typeof value === "object";
         this.notDefaultDensity = () => this.density !== "default";
         this.getCellContent = (cell, dataType) => {
             switch (dataType) {
@@ -10966,6 +11005,45 @@ class DataTable {
             }
             return {};
         };
+        this.adjustWidthForActionElement = () => {
+            const elements = this.el.shadowRoot.querySelectorAll(".action-element");
+            elements.forEach((element) => {
+                const width = element.firstChild.getBoundingClientRect()
+                    .width;
+                const gridWrapper = element.closest(".cell-grid-wrapper");
+                gridWrapper.style.gridTemplateColumns = `auto calc(${width}px + var(--ic-space-xs))`;
+            });
+        };
+        this.createCellContent = (columnProps, cell, cellSlotName, rowOptions, rowAlignment, hasIcon, currentRowHeight, cellValue, rowEmphasis) => {
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+            return (hAsync("div", { innerHTML: (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) === "element" &&
+                    !isSlotUsed(this.el, cellSlotName)
+                    ? cell
+                    : null, class: Object.assign({ "cell-container": (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "element", [`cell-alignment-${((_a = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _a === void 0 ? void 0 : _a.vertical) ||
+                        ((_b = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _b === void 0 ? void 0 : _b.vertical) ||
+                        rowAlignment ||
+                        this.getCellAlignment(cell, "vertical")}`]: !!((_c = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _c === void 0 ? void 0 : _c.vertical) ||
+                        !!((_d = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _d === void 0 ? void 0 : _d.vertical) ||
+                        !!rowAlignment ||
+                        !!this.getCellAlignment(cell, "vertical"), [`cell-alignment-${((_e = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _e === void 0 ? void 0 : _e.horizontal) ||
+                        ((_f = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _f === void 0 ? void 0 : _f.horizontal) ||
+                        this.getCellAlignment(cell, "horizontal")}`]: !!((_g = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _g === void 0 ? void 0 : _g.horizontal) ||
+                        !!((_h = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _h === void 0 ? void 0 : _h.horizontal) ||
+                        !!this.getCellAlignment(cell, "horizontal"), [`data-type-${columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType}`]: true, [this.TEXT_WRAP_STRING]: (columnProps === null || columnProps === void 0 ? void 0 : columnProps.textWrap) ||
+                        (rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.textWrap) ||
+                        !!this.getCellOptions(cell, "textWrap"), ["cell-icon"]: hasIcon || !!((_j = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _j === void 0 ? void 0 : _j.icon) }, this.setTruncationClass()), style: Object.assign(Object.assign({}, this.getRowHeight(currentRowHeight, columnProps, rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.textWrap, cell)), this.getColumnWidth(columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnWidth)), "data-row-height": this.truncationPattern || currentRowHeight
+                    ? this.setRowHeight(currentRowHeight)
+                    : null }, isSlotUsed(this.el, cellSlotName) ? (hAsync("slot", { name: cellSlotName })) : (hAsync(Fragment, null, isSlotUsed(this.el, `${cellSlotName}-icon`) ? (hAsync("slot", { name: `${cellSlotName}-icon` })) : ((hasIcon || ((_k = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _k === void 0 ? void 0 : _k.onAllCells)) &&
+                (cellValue("icon") || ((_l = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _l === void 0 ? void 0 : _l.icon)) && (hAsync("span", { class: "icon", innerHTML: cellValue("icon") || ((_m = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _m === void 0 ? void 0 : _m.icon) }))), (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "element" &&
+                !isSlotUsed(this.el, cellSlotName) && (hAsync("ic-typography", { variant: "body", class: {
+                    [`cell-emphasis-${(this.isObject(cell) && cellValue("emphasis")) ||
+                        (columnProps === null || columnProps === void 0 ? void 0 : columnProps.emphasis) ||
+                        rowEmphasis}`]: (this.isObject(cell) && !!cellValue("emphasis")) ||
+                        !!(columnProps === null || columnProps === void 0 ? void 0 : columnProps.emphasis) ||
+                        !!rowEmphasis,
+                    [`text-${this.density}`]: this.notDefaultDensity(),
+                } }, this.isObject(cell) && (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "date" ? (Object.keys(cell).includes("href") ? (hAsync("ic-link", { href: cellValue("href"), target: cellValue("target") || undefined, rel: cellValue("rel") || undefined }, cellValue("data"))) : (cellValue("data"))) : (this.getCellContent(cell, columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType))))))));
+        };
         this.createCells = (row, rowIndex) => {
             var _a;
             const rowValues = Object.values(row);
@@ -10983,7 +11061,6 @@ class DataTable {
                 ? variableRowHeightVal !== "auto" && variableRowHeightVal
                 : this.globalRowHeight !== "auto" && this.globalRowHeight;
             return rowValues.map((cell, index) => {
-                var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
                 const columnProps = this.columns[index];
                 const cellSlotName = `${columnProps === null || columnProps === void 0 ? void 0 : columnProps.key}-${rowIndex}`;
                 const hasIcon = this.isObject(cell) && Object.keys(cell).includes("icon");
@@ -11000,67 +11077,39 @@ class DataTable {
                             ["table-cell"]: true,
                             [`table-density-${this.density}`]: this.notDefaultDensity(),
                             ["with-overflow"]: (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) === "element",
-                        }, style: Object.assign({}, this.getColumnWidth(columnProps.columnWidth)) }, hAsync("div", { innerHTML: (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) === "element" &&
-                            !isSlotUsed(this.el, cellSlotName)
-                            ? cell
-                            : null, class: Object.assign({ "cell-container": (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "element", [`cell-alignment-${((_a = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _a === void 0 ? void 0 : _a.vertical) ||
-                                ((_b = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _b === void 0 ? void 0 : _b.vertical) ||
-                                rowAlignment ||
-                                this.getCellAlignment(cell, "vertical")}`]: !!((_c = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _c === void 0 ? void 0 : _c.vertical) ||
-                                !!((_d = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _d === void 0 ? void 0 : _d.vertical) ||
-                                !!rowAlignment ||
-                                !!this.getCellAlignment(cell, "vertical"), [`cell-alignment-${((_e = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _e === void 0 ? void 0 : _e.horizontal) ||
-                                ((_f = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _f === void 0 ? void 0 : _f.horizontal) ||
-                                this.getCellAlignment(cell, "horizontal")}`]: !!((_g = columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnAlignment) === null || _g === void 0 ? void 0 : _g.horizontal) ||
-                                !!((_h = rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.rowAlignment) === null || _h === void 0 ? void 0 : _h.horizontal) ||
-                                !!this.getCellAlignment(cell, "horizontal"), [`data-type-${columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType}`]: true, [this.TEXT_WRAP_STRING]: (columnProps === null || columnProps === void 0 ? void 0 : columnProps.textWrap) ||
-                                (rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.textWrap) ||
-                                !!this.getCellOptions(cell, "textWrap"), ["cell-icon"]: hasIcon || !!((_j = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _j === void 0 ? void 0 : _j.icon) }, this.setTruncationClass()), style: Object.assign(Object.assign({}, this.getRowHeight(currentRowHeight, columnProps, rowOptions === null || rowOptions === void 0 ? void 0 : rowOptions.textWrap, cell)), this.getColumnWidth(columnProps === null || columnProps === void 0 ? void 0 : columnProps.columnWidth)), "data-row-height": this.truncationPattern || currentRowHeight
-                            ? this.setRowHeight(currentRowHeight)
-                            : null }, isSlotUsed(this.el, cellSlotName) ? (hAsync("slot", { name: cellSlotName })) : (hAsync(Fragment, null, isSlotUsed(this.el, `${cellSlotName}-icon`) ? (hAsync("slot", { name: `${cellSlotName}-icon` })) : ((hasIcon || ((_k = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _k === void 0 ? void 0 : _k.onAllCells)) &&
-                        (cellValue("icon") || ((_l = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _l === void 0 ? void 0 : _l.icon)) && (hAsync("span", { class: "icon", innerHTML: cellValue("icon") || ((_m = columnProps === null || columnProps === void 0 ? void 0 : columnProps.icon) === null || _m === void 0 ? void 0 : _m.icon) }))), (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "element" &&
-                        !isSlotUsed(this.el, cellSlotName) && (hAsync("ic-typography", { variant: "body", class: {
-                            [`cell-emphasis-${(this.isObject(cell) && cellValue("emphasis")) ||
-                                (columnProps === null || columnProps === void 0 ? void 0 : columnProps.emphasis) ||
-                                rowEmphasis}`]: (this.isObject(cell) && !!cellValue("emphasis")) ||
-                                !!(columnProps === null || columnProps === void 0 ? void 0 : columnProps.emphasis) ||
-                                !!rowEmphasis,
-                            [`text-${this.density}`]: this.notDefaultDensity(),
-                        } }, this.isObject(cell) &&
-                        (columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType) !== "date" ? (Object.keys(cell).includes("href") ? (hAsync("ic-link", { href: cellValue("href") }, cellValue("data"))) : (cellValue("data"))) : (this.getCellContent(cell, columnProps === null || columnProps === void 0 ? void 0 : columnProps.dataType)))))))));
+                        }, style: Object.assign({}, this.getColumnWidth(columnProps.columnWidth)) }, this.isObject(cell) &&
+                        Object.keys(cell).includes("actionElement") ? (hAsync("div", { class: "cell-grid-wrapper" }, this.createCellContent(columnProps, cell, cellSlotName, rowOptions, rowAlignment, hasIcon, currentRowHeight, cellValue, rowEmphasis), hAsync("span", { class: "action-element", innerHTML: cellValue("actionElement") }))) : (this.createCellContent(columnProps, cell, cellSlotName, rowOptions, rowAlignment, hasIcon, currentRowHeight, cellValue, rowEmphasis))));
                 }
             });
         };
-        this.createColumnHeaders = () => {
-            return this.columns.map(({ cellAlignment, colspan, icon, key, title, columnWidth }, index) => (hAsync("th", { scope: "col", class: {
-                    ["column-header"]: true,
-                    [`table-density-${this.density}`]: this.notDefaultDensity(),
-                    ["updating-state-headers"]: this.updating && !this.loading,
-                }, style: Object.assign({}, this.getColumnWidth(columnWidth)), colSpan: colspan }, hAsync("div", { class: {
-                    "column-header-inner-container": true,
-                    "truncation-tooltip": this.columnHeaderTruncation,
-                    [`column-header-alignment-${cellAlignment}`]: !!cellAlignment,
-                } }, isSlotUsed(this.el, `${key}-column-icon`) ? (hAsync("slot", { name: `${key}-column-icon` })) : (icon &&
-                !icon.hideOnHeader && (hAsync("span", { class: "icon", innerHTML: icon.icon }))), this.columnHeaderTruncation ? (hAsync("ic-tooltip", { label: title, target: `column-header-${index}` }, hAsync("ic-typography", { id: `column-header-${index}`, variant: "body", class: {
-                    ["column-header-text"]: true,
-                    [`text-${this.density}`]: this.notDefaultDensity(),
-                } }, title))) : (hAsync("ic-typography", { variant: "body", class: {
-                    ["column-header-text"]: true,
-                    [`text-${this.density}`]: this.notDefaultDensity(),
-                } }, title)), this.sortable && (hAsync("ic-button", { variant: "icon", id: `sort-button-${key}`, "aria-label": this.getSortButtonLabel(key),
-                // eslint-disable-next-line react/jsx-no-bind
-                onClick: () => this.sortRows(key), innerHTML: this.SORT_ICONS[this.sortedColumn === key
-                    ? this.sortedColumnOrder
-                    : "unsorted"], class: {
-                    ["sort-button"]: true,
-                    ["sort-button-unsorted"]: this.sortedColumn !== key ||
-                        this.sortedColumnOrder === "unsorted",
-                } }))), this.columnHeaderTruncation && (hAsync("ic-typography", { variant: "body", "aria-hidden": "true", class: {
-                    ["column-header-text"]: true,
-                    ["dummy-column-header-text"]: this.columnHeaderTruncation,
-                    [`text-${this.density}`]: this.notDefaultDensity(),
-                } }, title)))));
-        };
+        this.createColumnHeaders = () => this.columns.map(({ cellAlignment, colspan, icon, key, title, columnWidth }, index) => (hAsync("th", { scope: "col", class: {
+                ["column-header"]: true,
+                [`table-density-${this.density}`]: this.notDefaultDensity(),
+                ["updating-state-headers"]: this.updating && !this.loading,
+            }, style: Object.assign({}, this.getColumnWidth(columnWidth)), colSpan: colspan }, hAsync("div", { class: {
+                "column-header-inner-container": true,
+                "truncation-tooltip": this.columnHeaderTruncation,
+                [`column-header-alignment-${cellAlignment}`]: !!cellAlignment,
+            } }, isSlotUsed(this.el, `${key}-column-icon`) ? (hAsync("slot", { name: `${key}-column-icon` })) : (icon &&
+            !icon.hideOnHeader && (hAsync("span", { class: "icon", innerHTML: icon.icon }))), this.columnHeaderTruncation ? (hAsync("ic-tooltip", { label: title, target: `column-header-${index}` }, hAsync("ic-typography", { id: `column-header-${index}`, variant: "body", class: {
+                ["column-header-text"]: true,
+                [`text-${this.density}`]: this.notDefaultDensity(),
+            } }, title))) : (hAsync("ic-typography", { variant: "body", class: {
+                ["column-header-text"]: true,
+                [`text-${this.density}`]: this.notDefaultDensity(),
+            } }, title)), this.sortable && (hAsync("ic-button", { variant: "icon", id: `sort-button-${key}`, "aria-label": this.getSortButtonLabel(key),
+            // eslint-disable-next-line react/jsx-no-bind
+            onClick: () => this.sortRows(key), innerHTML: this.SORT_ICONS[this.sortedColumn === key
+                ? this.sortedColumnOrder
+                : "unsorted"], class: {
+                ["sort-button"]: true,
+                ["sort-button-unsorted"]: this.sortedColumn !== key ||
+                    this.sortedColumnOrder === "unsorted",
+            } }))), this.columnHeaderTruncation && (hAsync("ic-typography", { variant: "body", "aria-hidden": "true", class: {
+                ["column-header-text"]: true,
+                ["dummy-column-header-text"]: this.columnHeaderTruncation,
+                [`text-${this.density}`]: this.notDefaultDensity(),
+            } }, title)))));
         this.onRowClick = (row) => {
             this.selectedRow =
                 this.selectedRow !== row && !this.loading && !this.updating && row;
@@ -11078,7 +11127,9 @@ class DataTable {
             const organisedData = data.map((row, rowIndex) => {
                 const slottedColumns = this.columns
                     .map(({ key }, index) => isSlotUsed(this.el, `${key}-${rowIndex}`) && { key, index })
-                    .filter((col) => !!col);
+                    .filter((col) => !!col &&
+                    // skip the column if its already in the row
+                    !Object.prototype.hasOwnProperty.call(row, col.key));
                 return slottedColumns.length > 0
                     ? addDataToPosition(row, slottedColumns, "")
                     : row;
@@ -11338,6 +11389,7 @@ class DataTable {
     }
     componentDidRender() {
         this.fixCellTooltips();
+        this.adjustWidthForActionElement();
     }
     truncateUpdatedData() {
         if (this.dataUpdated) {
@@ -11731,6 +11783,7 @@ class DataTable {
         tooltipEl.appendChild(typographyEl);
     }
     render() {
+        var _a;
         const { caption, createColumnHeaders, createRows, createUpdatingIndicator, data, hideColumnHeaders, loading, loadingOptions, paginationBarOptions, scrollable, scrollOffset, showPagination, sortable, sortedColumnOrder, sortedColumn, stickyColumnHeaders, updateScrollOffset, updating, } = this;
         return (hAsync(Host, { style: Object.assign({}, this.setTableDimensions()) }, hAsync("div", { class: "table-container" }, isSlotUsed(this.el, "title-bar") && hAsync("slot", { name: "title-bar" }), hAsync("div", { class: {
                 ["table-row-container"]: true,
@@ -11748,7 +11801,7 @@ class DataTable {
                 "loading-empty": loading,
                 loading: true,
                 "show-background": loadingOptions.showBackground,
-            }, description: loadingOptions.description || "Loading table data", label: loadingOptions.label || "Loading...", labelDuration: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.labelDuration, max: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.max, min: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.min, progress: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.progress, ref: (el) => (this.loadingIndicator = el) })), (showPagination || isSlotUsed(this.el, "pagination-bar")) && (hAsync("div", { class: "pagination-container" }, isSlotUsed(this.el, "pagination-bar") ? (hAsync("slot", { name: "pagination-bar" })) : (hAsync("ic-pagination-bar", { totalItems: data.length, type: paginationBarOptions.type, rangeLabelType: paginationBarOptions.rangeLabelType, showItemsPerPageControl: paginationBarOptions.showItemsPerPageControl, showGoToPageControl: paginationBarOptions.showGoToPageControl, itemsPerPageOptions: paginationBarOptions.itemsPerPageOptions, alignment: paginationBarOptions.alignment, appearance: paginationBarOptions.appearance, itemLabel: paginationBarOptions.itemLabel, pageLabel: paginationBarOptions.pageLabel, hideRangeLabel: paginationBarOptions.hideRangeLabel, hideAllFromItemsPerPage: paginationBarOptions.hideAllFromItemsPerPage })))), sortable && (hAsync("div", { class: "screen-reader-sort-text", "aria-live": "polite" }, sortedColumnOrder !== "unsorted" && sortedColumn
+            }, description: loadingOptions.description || "Loading table data", label: loadingOptions.label || "Loading...", labelDuration: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.labelDuration, max: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.max, min: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.min, progress: loadingOptions === null || loadingOptions === void 0 ? void 0 : loadingOptions.progress, ref: (el) => (this.loadingIndicator = el) })), (showPagination || isSlotUsed(this.el, "pagination-bar")) && (hAsync("div", { class: "pagination-container" }, isSlotUsed(this.el, "pagination-bar") ? (hAsync("slot", { name: "pagination-bar" })) : (hAsync("ic-pagination-bar", { totalItems: (_a = data === null || data === void 0 ? void 0 : data.length) !== null && _a !== void 0 ? _a : 0, type: paginationBarOptions.type, rangeLabelType: paginationBarOptions.rangeLabelType, showItemsPerPageControl: paginationBarOptions.showItemsPerPageControl, showGoToPageControl: paginationBarOptions.showGoToPageControl, itemsPerPageOptions: paginationBarOptions.itemsPerPageOptions, alignment: paginationBarOptions.alignment, appearance: paginationBarOptions.appearance, itemLabel: paginationBarOptions.itemLabel, pageLabel: paginationBarOptions.pageLabel, hideRangeLabel: paginationBarOptions.hideRangeLabel, hideAllFromItemsPerPage: paginationBarOptions.hideAllFromItemsPerPage })))), sortable && (hAsync("div", { class: "screen-reader-sort-text", "aria-live": "polite" }, sortedColumnOrder !== "unsorted" && sortedColumn
             ? `${sortedColumn} sorted ${sortedColumnOrder}`
             : "table unsorted")))));
     }
@@ -12849,6 +12902,9 @@ class DateInput {
         this.validationStatus = "";
         this.validationText = "";
     }
+    watchDisabledHandler() {
+        removeDisabledFalse(this.disabled, this.el);
+    }
     watchDisableFutureHandler() {
         this.watchMaxHandler();
     }
@@ -12909,6 +12965,7 @@ class DateInput {
         this.assistiveHintId = `${this.inputId}-assistive-hint`;
         this.selectedDateInfoId = `${this.inputId}-selected-date-info`;
         addFormResetListener(this.el, this.handleFormReset);
+        removeDisabledFalse(this.disabled, this.el);
     }
     componentDidLoad() {
         this.setInputsInOrder();
@@ -13103,6 +13160,7 @@ class DateInput {
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
         "disableFuture": ["watchDisableFutureHandler"],
         "disablePast": ["watchDisablePastHandler"],
         "max": ["watchMaxHandler"],
@@ -14015,6 +14073,9 @@ class DatePicker {
         this.validationText = "";
         this.value = "";
     }
+    watchDisabledHandler() {
+        removeDisabledFalse(this.disabled, this.el);
+    }
     watchDisableFutureHandler() {
         this.watchMaxHandler();
     }
@@ -14127,6 +14188,7 @@ class DatePicker {
         this.watchStartOfWeekHandler();
         this.watchMaxHandler();
         this.watchMinHandler();
+        removeDisabledFalse(this.disabled, this.el);
     }
     componentWillRender() {
         this.dateInputProps = this.setDateInputProps();
@@ -14202,6 +14264,7 @@ class DatePicker {
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
         "disableFuture": ["watchDisableFutureHandler"],
         "disablePast": ["watchDisablePastHandler"],
         "max": ["watchMaxHandler"],
@@ -15351,6 +15414,12 @@ class InputComponentContainer {
         this.validationInline = false;
         this.validationStatus = "";
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
+    componentWillLoad() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     componentDidLoad() {
         this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);
         this.hostMutationObserver.observe(this.el, { childList: true });
@@ -15369,7 +15438,7 @@ class InputComponentContainer {
                 ["multiline"]: multiLine,
                 ["fullwidth"]: fullWidth,
                 ["dark"]: dark || appearance === "dark",
-            }, "aria-disabled": disabled && `${disabled}` }, hAsync("div", { class: {
+            }, "aria-disabled": disabled ? "true" : null }, hAsync("div", { class: {
                 "focus-indicator": true,
                 dark: dark || appearance === "dark",
             } }, slotHasContent(this.el, "left-icon") && (hAsync("div", { class: {
@@ -15380,6 +15449,9 @@ class InputComponentContainer {
             }, innerHTML: successIcon })))));
     }
     get el() { return getElement(this); }
+    static get watchers() { return {
+        "disabled": ["watchDisabledHandler"]
+    }; }
     static get style() { return icInputComponentContainerCss; }
     static get cmpMeta() { return {
         "$flags$": 4,
@@ -21183,6 +21255,9 @@ class MenuItem {
         this.toggleChecked = false;
         this.variant = "default";
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     componentWillLoad() {
         // This ensures that trigger menu items are always set to the default variant
         if (isPropDefined$1(this.submenuTriggerFor) && this.variant !== "default") {
@@ -21219,6 +21294,9 @@ class MenuItem {
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
+    static get watchers() { return {
+        "disabled": ["watchDisabledHandler"]
+    }; }
     static get style() { return icMenuItemCss; }
     static get cmpMeta() { return {
         "$flags$": 25,
@@ -22280,6 +22358,9 @@ class Pagination {
             this.boundaryCount = 2;
         }
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     watchNumberPagesHandler() {
         this.watchPageChangeHandler();
     }
@@ -22410,6 +22491,7 @@ class Pagination {
     static get watchers() { return {
         "adjacentCount": ["watchAdjacentCountHandler"],
         "boundaryCount": ["watchBoundaryCountHandler"],
+        "disabled": ["watchDisabledHandler"],
         "pages": ["watchNumberPagesHandler"],
         "type": ["watchTypeHandler"],
         "currentPage": ["watchPageChangeHandler"]
@@ -22572,7 +22654,10 @@ class PaginationBar {
             this.icPageChange.emit({ value: this.activePage, fromItemsPerPage: true });
         };
         this.setPaginationBarContent = () => {
-            const displayedItemsPerPageOptions = this.itemsPerPageOptions ||
+            const clonedItemsPerPageOptions = this.itemsPerPageOptions
+                ? JSON.parse(JSON.stringify(this.itemsPerPageOptions))
+                : null;
+            const displayedItemsPerPageOptions = clonedItemsPerPageOptions ||
                 (this.totalItems <= 100
                     ? [
                         { label: "10", value: "10" },
@@ -22762,6 +22847,9 @@ class PaginationItem {
         this.selected = false;
         this.type = undefined;
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     watchLabelHandler() {
         this.capitalizedLabel = capitalize$1(this.label);
     }
@@ -22794,6 +22882,7 @@ class PaginationItem {
     }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
         "label": ["watchLabelHandler"]
     }; }
     static get style() { return icPaginationItemCss; }
@@ -23188,6 +23277,7 @@ class RadioGroup {
     }
     watchDisabledHandler(newValue) {
         this.radioOptions.forEach((radioOption) => (radioOption.disabled = newValue));
+        removeDisabledFalse$1(this.disabled, this.el);
     }
     orientationChangeHandler() {
         this.initialOrientation = this.orientation;
@@ -23370,6 +23460,9 @@ class RadioOption {
         this.selected = false;
         this.initiallySelected = this.selected;
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     watchSelectedHandler() {
         this.icSelectedChange.emit();
     }
@@ -23451,6 +23544,7 @@ class RadioOption {
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
         "selected": ["watchSelectedHandler"]
     }; }
     static get style() { return icRadioOptionCss; }
@@ -23800,6 +23894,9 @@ class SearchBar {
         this.options = [];
         this.value = "";
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     loadingHandler(newValue) {
         if (newValue && !this.hasTimedOut) {
             this.preLoad = false;
@@ -23965,6 +24062,7 @@ class SearchBar {
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
         "loading": ["loadingHandler"],
         "filteredOptions": ["filteredOptionsHandler"],
         "options": ["watchOptionsHandler"],
@@ -24576,6 +24674,9 @@ class Select$1 {
         this.inputValueToFilter = this.value;
         this.currValue = this.value;
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     loadingHandler(newValue) {
         newValue && this.triggerLoading();
     }
@@ -24757,6 +24858,7 @@ class Select$1 {
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
         "loading": ["loadingHandler"],
         "options": ["watchOptionsHandler"],
         "debounce": ["debounceChangedHandler"],
@@ -25879,9 +25981,11 @@ class SideNavigation {
                 navItems[0].querySelector("div");
             const navItemSVG = navItems[0].querySelector("svg");
             const navStyles = {
-                gap: window.getComputedStyle(navItemLink).gap,
-                iconWidth: window.getComputedStyle(navItemSVG).width,
-                paddingLeft: window.getComputedStyle(navItemLink).paddingLeft,
+                gap: navItemLink ? window.getComputedStyle(navItemLink).gap : "0",
+                iconWidth: navItemSVG ? window.getComputedStyle(navItemSVG).width : "0",
+                paddingLeft: navItemLink
+                    ? window.getComputedStyle(navItemLink).paddingLeft
+                    : "0",
             };
             return Object.values(navStyles).reduce((prev, curr) => {
                 return (prev += parseInt(curr));
@@ -25924,10 +26028,12 @@ class SideNavigation {
          * @param value - padding-top css value
          */
         this.setParentPaddingTop = (value) => {
-            this.el.parentElement.style.setProperty("padding-top", value);
+            var _a;
+            (_a = this.el.parentElement) === null || _a === void 0 ? void 0 : _a.style.setProperty("padding-top", value);
         };
         this.setParentPaddingLeft = (value) => {
-            this.el.parentElement.style.setProperty("padding-left", value);
+            var _a;
+            (_a = this.el.parentElement) === null || _a === void 0 ? void 0 : _a.style.setProperty("padding-left", value);
         };
         this.renderAppTitle = (isAppNameSubtitleVariant) => {
             const displayShortAppTitle = this.deviceSize <= DEVICE_SIZES.S && !isEmptyString$1(this.shortAppTitle);
@@ -25938,7 +26044,7 @@ class SideNavigation {
                     : undefined }, hAsync("h1", null, displayShortAppTitle ? this.shortAppTitle : this.appTitle)));
         };
         this.resizeObserverCallback = (currSize) => {
-            var _a;
+            var _a, _b, _c;
             this.deviceSize = currSize;
             const isSmallAndDisableTopBar = currSize === DEVICE_SIZES.S && !this.disableTopBarBehaviour;
             if (!this.disableAutoParentStyling) {
@@ -25947,10 +26053,10 @@ class SideNavigation {
                 if (isSmallAndDisableTopBar)
                     this.setParentPaddingLeft("0");
                 if (isSmallAndDisableTopBar && this.inline) {
-                    this.el.parentElement.style.setProperty("height", `calc(100% - ${topBarHeight}px)`);
+                    (_b = this.el.parentElement) === null || _b === void 0 ? void 0 : _b.style.setProperty("height", `calc(100% - ${topBarHeight}px)`);
                 }
                 else if (!isSmallAndDisableTopBar) {
-                    this.el.parentElement.style.setProperty("height", "100%");
+                    (_c = this.el.parentElement) === null || _c === void 0 ? void 0 : _c.style.setProperty("height", "100%");
                 }
             }
             if (!this.disableAutoParentStyling) {
@@ -26674,6 +26780,9 @@ class Switch {
     checkedChangeHandler() {
         this.checkedState = this.checked;
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     disconnectedCallback() {
         removeFormResetListener$1(this.el, this.handleFormReset);
     }
@@ -26709,7 +26818,8 @@ class Switch {
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
     static get watchers() { return {
-        "checked": ["checkedChangeHandler"]
+        "checked": ["checkedChangeHandler"],
+        "disabled": ["watchDisabledHandler"]
     }; }
     static get style() { return icSwitchCss; }
     static get cmpMeta() { return {
@@ -26790,6 +26900,9 @@ class Tab {
         this.tabId = undefined;
         this.tabPosition = undefined;
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     disabledWatchHandler() {
         this.tabEnabled.emit();
     }
@@ -26826,7 +26939,7 @@ class Tab {
     }
     get el() { return getElement(this); }
     static get watchers() { return {
-        "disabled": ["disabledWatchHandler"]
+        "disabled": ["watchDisabledHandler", "disabledWatchHandler"]
     }; }
     static get style() { return icTabCss; }
     static get cmpMeta() { return {
@@ -27212,6 +27325,17 @@ class TextField {
                 }
             });
         };
+        this.showValidation = () => {
+            const maxNumChars = this.readonly ? 0 : this.maxLength;
+            const emptyString = isEmptyString$1(this.validationStatus) ||
+                isEmptyString$1(this.validationText);
+            const valueOutsideRange = this.minValueUnattained || this.maxValueExceeded;
+            const charOutsideRange = maxNumChars > 0 ||
+                this.maxCharactersError ||
+                this.minCharactersUnattained;
+            return ((!emptyString || valueOutsideRange || charOutsideRange) &&
+                !this.validationInlineInternal);
+        };
         this.numChars = 0;
         this.maxCharactersReached = false;
         this.maxCharactersError = false;
@@ -27261,6 +27385,9 @@ class TextField {
         this.value = "";
         this.initialValue = this.value;
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     debounceChanged() {
         this.icChange = debounceEvent(this.icChange, this.debounce);
     }
@@ -27318,7 +27445,7 @@ class TextField {
         (_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.focus();
     }
     render() {
-        const { inputId, name, label, required, size, small, placeholder, helperText, rows, resize, disabled, value, min, max, maxLength, numChars, readonly, maxLengthExceeded, maxCharacters, maxCharactersError, maxCharactersReached, minCharacters, minCharactersUnattained, minValueUnattained, maxValueExceeded, validationStatus, validationText, validationInline, validationInlineInternal, spellcheck, inputmode, fullWidth, truncateValue, hiddenInput, } = this;
+        const { inputId, name, label, required, size, small, placeholder, helperText, rows, resize, disabled, value, min, max, maxLength, numChars, readonly, maxLengthExceeded, maxCharacters, maxCharactersError, maxCharactersReached, minCharacters, minCharactersUnattained, minValueUnattained, maxValueExceeded, validationStatus, validationText, validationInline, validationInlineInternal, spellcheck, inputmode, fullWidth, truncateValue, hiddenInput, showValidation, } = this;
         const disabledMode = readonly || disabled;
         const currentStatus = maxLengthExceeded ||
             maxValueExceeded ||
@@ -27371,14 +27498,7 @@ class TextField {
                 ["no-resize"]: resize === false || readonly,
                 ["no-left-pad"]: !showLeftIcon && readonly,
                 ["readonly"]: readonly,
-            }, name: name, ref: (el) => (this.inputEl = el), value: value, rows: rows, required: required, disabled: disabledMode, placeholder: placeholder ? placeholder : "", readonly: readonly, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, autocapitalize: this.autocapitalize, autoFocus: this.autoFocus, spellcheck: spellcheck, inputmode: inputmode, maxlength: maxCharactersReached ? maxCharacters : null, minlength: minCharactersUnattained ? minCharacters : null }, this.inheritedAttributes))), isSlotUsed$1(this.el, "clear-button") && (hAsync("slot", { name: "clear-button" })), isSlotUsed$1(this.el, "search-submit-button") && (hAsync("slot", { name: "search-submit-button" }))), isSlotUsed$1(this.el, "menu") && hAsync("slot", { name: "menu" }), (!isEmptyString$1(validationStatus) ||
-            !isEmptyString$1(validationText) ||
-            maxNumChars > 0 ||
-            maxValueExceeded ||
-            maxCharactersError ||
-            minCharactersUnattained ||
-            minValueUnattained) &&
-            !validationInlineInternal && (hAsync("ic-input-validation", { status: this.hasStatus(currentStatus) === false ||
+            }, name: name, ref: (el) => (this.inputEl = el), value: value, rows: rows, required: required, disabled: disabledMode, placeholder: placeholder ? placeholder : "", readonly: readonly, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, autocapitalize: this.autocapitalize, autoFocus: this.autoFocus, spellcheck: spellcheck, inputmode: inputmode, maxlength: maxCharactersReached ? maxCharacters : null, minlength: minCharactersUnattained ? minCharacters : null }, this.inheritedAttributes))), isSlotUsed$1(this.el, "clear-button") && (hAsync("slot", { name: "clear-button" })), isSlotUsed$1(this.el, "search-submit-button") && (hAsync("slot", { name: "search-submit-button" }))), isSlotUsed$1(this.el, "menu") && hAsync("slot", { name: "menu" }), showValidation() && (hAsync("ic-input-validation", { status: this.hasStatus(currentStatus) === false ||
                 (currentStatus === IcInformationStatus$1.Success &&
                     validationInline) ||
                 validationInlineInternal
@@ -27391,6 +27511,7 @@ class TextField {
     }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
         "debounce": ["debounceChanged"],
         "value": ["watchValueHandler"]
     }; }
@@ -27794,6 +27915,9 @@ class ToggleButton {
         this.toggleChecked = false;
         this.variant = "default";
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     componentWillLoad() {
         removeDisabledFalse$1(this.disabled, this.el);
         const parentIconPlacement = this.el.parentElement.iconPlacement;
@@ -27839,6 +27963,9 @@ class ToggleButton {
     }
     static get delegatesFocus() { return true; }
     get el() { return getElement(this); }
+    static get watchers() { return {
+        "disabled": ["watchDisabledHandler"]
+    }; }
     static get style() { return icToggleButtonCss; }
     static get cmpMeta() { return {
         "$flags$": 25,
@@ -27956,6 +28083,9 @@ class ToggleButtonGroup {
         this.size = "default";
         this.variant = "default";
     }
+    watchDisabledHandler() {
+        removeDisabledFalse$1(this.disabled, this.el);
+    }
     selectHandler(ev, tabTarget) {
         const allToggles = this.getAllToggleButtons();
         let clickedToggle = ev.target;
@@ -27989,6 +28119,7 @@ class ToggleButtonGroup {
     componentWillLoad() {
         this.selectType === "multi" && (this.selectMethod = "manual");
         document.addEventListener("keydown", this.keyListener);
+        removeDisabledFalse$1(this.disabled, this.el);
     }
     componentDidLoad() {
         this.getAllToggleButtons().forEach((el, i) => {
@@ -28033,6 +28164,9 @@ class ToggleButtonGroup {
             }, onFocus: this.handleHostFocus }, hAsync("slot", null)));
     }
     get el() { return getElement(this); }
+    static get watchers() { return {
+        "disabled": ["watchDisabledHandler"]
+    }; }
     static get style() { return icToggleButtonGroupCss; }
     static get cmpMeta() { return {
         "$flags$": 9,
@@ -28517,7 +28651,7 @@ var arrowDropdown = `<svg width="24" height="24" viewBox="0 0 24 24" fill="none"
     <path d="M7 9.5L12 14.5L17 9.5H7Z" fill="currentColor"/>
 </svg>`;
 
-const icTreeItemCss = "/*!@:host*/.sc-ic-tree-item-h{display:block;border:none;position:relative}/*!@:host .tree-item-content*/.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item{display:flex;align-items:center;height:calc(var(--ic-space-xl) + var(--ic-space-xs));padding:0 var(--ic-space-xs);text-decoration:none;color:var(--ic-primary-text)}/*!@::slotted([slot=\"router-item\"])*/.sc-ic-tree-item-s>[slot=\"router-item\"]{display:flex;align-items:center;height:calc(var(--ic-space-xl) + var(--ic-space-xs));text-decoration:none;font-family:var(--ic-font-body-family);color:var(--ic-primary-text);padding:0 var(--ic-space-xs) !important}/*!@::slotted([slot=\"router-item\"].ic-tree-item-single)*/.sc-ic-tree-item-s>[slot=\"router-item\"].ic-tree-item-single{padding-left:calc(var(--ic-space-xl) + var(--ic-space-xs)) !important}/*!@:host .tree-item-content:focus,\n::slotted([slot=\"router-item\"]:focus)*/.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item:focus,.sc-ic-tree-item-s>[slot=\"router-item\"]:focus{box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-transition-duration-fast);outline:none}/*!@:host .tree-item-content:hover,\n::slotted([slot=\"router-item\"]:hover)*/.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item:hover,.sc-ic-tree-item-s>[slot=\"router-item\"]:hover{background-color:var(--ic-action-dark-bg-hover) !important;cursor:pointer}/*!@:host .tree-item-content:active,\n::slotted([slot=\"router-item\"]:active)*/.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item:active,.sc-ic-tree-item-s>[slot=\"router-item\"]:active{background-color:var(--ic-action-dark-bg-active) !important}/*!@:host(.ic-tree-item-selected) .tree-item-content,\n:host(.ic-tree-item-selected) ::slotted([slot=\"router-item\"])*/.ic-tree-item-selected.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-selected.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-selected .sc-ic-tree-item-s>[slot=\"router-item\"]{background-color:var(--ic-action-default-bg-hover) !important}/*!@:host(.ic-tree-item-small) .tree-item-content,\n:host(.ic-tree-item-small) ::slotted([slot=\"router-item\"])*/.ic-tree-item-small.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-small.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-small .sc-ic-tree-item-s>[slot=\"router-item\"]{height:var(--ic-space-xl)}/*!@:host(.ic-tree-item-large) .tree-item-content,\n:host(.ic-tree-item-large) ::slotted([slot=\"router-item\"])*/.ic-tree-item-large.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-large.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-large .sc-ic-tree-item-s>[slot=\"router-item\"]{height:var(--ic-space-xxl)}/*!@:host(.ic-tree-item-disabled)*/.ic-tree-item-disabled.sc-ic-tree-item-h{pointer-events:none}/*!@:host(.ic-tree-item-disabled) .tree-item-content,\n:host(.ic-tree-item-disabled) .arrow-dropdown,\n:host(.ic-tree-item-disabled) ::slotted([slot=\"icon\"]),\n:host(.ic-tree-item-disabled) ::slotted([slot=\"router-item\"])*/.ic-tree-item-disabled.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.ic-tree-item-disabled.sc-ic-tree-item-h .arrow-dropdown.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-disabled.sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-disabled .sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-disabled.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-disabled .sc-ic-tree-item-s>[slot=\"router-item\"]{color:var(--ic-architectural-200) !important;fill:var(--ic-architectural-200);pointer-events:none}/*!@:host(.ic-tree-item-light) .tree-item-content,\n:host(.ic-tree-item-light) .arrow-dropdown,\n:host(.ic-tree-item-light) ::slotted([slot=\"icon\"]),\n:host(.ic-tree-item-light) ::slotted([slot=\"router-item\"])*/.ic-tree-item-light.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.ic-tree-item-light.sc-ic-tree-item-h .arrow-dropdown.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-light.sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-light .sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-light.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-light .sc-ic-tree-item-s>[slot=\"router-item\"]{color:var(--ic-architectural-white);fill:var(--ic-architectural-white)}/*!@:host .arrow-dropdown*/.sc-ic-tree-item-h .arrow-dropdown.sc-ic-tree-item{color:var(--ic-action-default);margin-right:var(--ic-space-xs)}/*!@:host(.ic-tree-item-small) .arrow-dropdown*/.ic-tree-item-small.sc-ic-tree-item-h .arrow-dropdown.sc-ic-tree-item{margin-right:var(--ic-space-xxs)}/*!@:host .tree-item-expanded*/.sc-ic-tree-item-h .tree-item-expanded.sc-ic-tree-item{transform:rotate(180deg);margin-top:calc(-1 * var(--ic-space-xxs))}/*!@:host .ic-tree-item-single*/.sc-ic-tree-item-h .ic-tree-item-single.sc-ic-tree-item{padding-left:calc(var(--ic-space-xl) + var(--ic-space-xs))}/*!@:host(.ic-tree-item-small) .ic-tree-item-single*/.ic-tree-item-small.sc-ic-tree-item-h .ic-tree-item-single.sc-ic-tree-item{padding-left:calc(var(--ic-space-xl) + var(--ic-space-xxs))}/*!@.icon-container*/.icon-container.sc-ic-tree-item{width:var(--ic-space-lg);height:var(--ic-space-lg);margin:0 var(--ic-space-xs) 0 0}/*!@:host(.ic-tree-item-small) .icon-container*/.ic-tree-item-small.sc-ic-tree-item-h .icon-container.sc-ic-tree-item{margin:0 var(--ic-space-xxs) 0 0}/*!@.ic-text-overflow*/.ic-text-overflow.sc-ic-tree-item{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}/*!@.ic-tooltip-overflow*/.ic-tooltip-overflow.sc-ic-tree-item{overflow:hidden}@media (forced-colors: active){/*!@::slotted([slot=\"icon\"])*/.sc-ic-tree-item-s>[slot=\"icon\"]{fill:currentcolor}/*!@:host(.ic-tree-item-disabled) .tree-item-content,\n  :host(.ic-tree-item-disabled) .arrow-dropdown,\n  :host(.ic-tree-item-disabled) ::slotted([slot=\"icon\"]),\n  :host(.ic-tree-item-disabled) ::slotted([slot=\"router-item\"])*/.ic-tree-item-disabled.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.ic-tree-item-disabled.sc-ic-tree-item-h .arrow-dropdown.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-disabled.sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-disabled .sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-disabled.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-disabled .sc-ic-tree-item-s>[slot=\"router-item\"]{color:GrayText !important;fill:GrayText !important}/*!@:host .tree-item-content:focus,\n  ::slotted([slot=\"router-item\"]:focus)*/.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item:focus,.sc-ic-tree-item-s>[slot=\"router-item\"]:focus{border:var(--ic-hc-border) !important}/*!@:host(.ic-tree-item-selected) .tree-item-content,\n  :host(.ic-tree-item-selected) ::slotted([slot=\"router-item\"])*/.ic-tree-item-selected.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-selected.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-selected .sc-ic-tree-item-s>[slot=\"router-item\"]{color:Highlight !important}}";
+const icTreeItemCss = "/*!@:host*/.sc-ic-tree-item-h{display:block;border:none;position:relative}/*!@:host .tree-item-content*/.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item{display:flex;align-items:center;min-height:calc(var(--ic-space-xl) + var(--ic-space-xs));padding:0 var(--ic-space-xs);text-decoration:none;color:var(--ic-primary-text)}/*!@::slotted([slot=\"router-item\"])*/.sc-ic-tree-item-s>[slot=\"router-item\"]{display:flex;align-items:center;min-height:calc(var(--ic-space-xl) + var(--ic-space-xs));text-decoration:none;font-family:var(--ic-font-body-family);color:var(--ic-primary-text);padding:0 var(--ic-space-xs) !important}/*!@:host(.ic-tree-item-truncate) .tree-item-content,\n:host(.ic-tree-item-truncate) ::slotted([slot=\"router-item\"])*/.ic-tree-item-truncate.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-truncate.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-truncate .sc-ic-tree-item-s>[slot=\"router-item\"]{height:calc(var(--ic-space-xl) + var(--ic-space-xs))}/*!@::slotted([slot=\"router-item\"].ic-tree-item-single)*/.sc-ic-tree-item-s>[slot=\"router-item\"].ic-tree-item-single{padding-left:calc(var(--ic-space-xl) + var(--ic-space-xs)) !important}/*!@:host .tree-item-content:focus,\n::slotted([slot=\"router-item\"]:focus)*/.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item:focus,.sc-ic-tree-item-s>[slot=\"router-item\"]:focus{box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-transition-duration-fast);outline:none}/*!@:host .tree-item-content:hover,\n::slotted([slot=\"router-item\"]:hover)*/.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item:hover,.sc-ic-tree-item-s>[slot=\"router-item\"]:hover{background-color:var(--ic-action-dark-bg-hover) !important;cursor:pointer}/*!@:host .tree-item-content:active,\n::slotted([slot=\"router-item\"]:active)*/.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item:active,.sc-ic-tree-item-s>[slot=\"router-item\"]:active{background-color:var(--ic-action-dark-bg-active) !important}/*!@:host(.ic-tree-item-selected) .tree-item-content,\n:host(.ic-tree-item-selected) ::slotted([slot=\"router-item\"])*/.ic-tree-item-selected.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-selected.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-selected .sc-ic-tree-item-s>[slot=\"router-item\"]{background-color:var(--ic-action-default-bg-hover) !important}/*!@:host(.ic-tree-item-small) .tree-item-content,\n:host(.ic-tree-item-small) ::slotted([slot=\"router-item\"])*/.ic-tree-item-small.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-small.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-small .sc-ic-tree-item-s>[slot=\"router-item\"]{min-height:var(--ic-space-xl)}/*!@:host(.ic-tree-item-large) .tree-item-content,\n:host(.ic-tree-item-large) ::slotted([slot=\"router-item\"])*/.ic-tree-item-large.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-large.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-large .sc-ic-tree-item-s>[slot=\"router-item\"]{min-height:var(--ic-space-xxl)}/*!@:host(.ic-tree-item-truncate.ic-tree-item-small) .tree-item-content,\n:host(.ic-tree-item-truncate.ic-tree-item-small)\n  ::slotted([slot=\"router-item\"])*/.ic-tree-item-truncate.ic-tree-item-small.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-truncate.ic-tree-item-small .sc-ic-tree-item-s>[slot=\"router-item\"]{height:var(--ic-space-xl)}/*!@:host(.ic-tree-item-truncate.ic-tree-item-large) .tree-item-content,\n:host(.ic-tree-item-truncate.ic-tree-item-large)\n  ::slotted([slot=\"router-item\"])*/.ic-tree-item-truncate.ic-tree-item-large.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-truncate.ic-tree-item-large .sc-ic-tree-item-s>[slot=\"router-item\"]{height:var(--ic-space-xxl)}/*!@:host(.ic-tree-item-disabled)*/.ic-tree-item-disabled.sc-ic-tree-item-h{pointer-events:none}/*!@:host(.ic-tree-item-disabled) .tree-item-content,\n:host(.ic-tree-item-disabled) .arrow-dropdown,\n:host(.ic-tree-item-disabled) ::slotted([slot=\"icon\"]),\n:host(.ic-tree-item-disabled) ::slotted([slot=\"router-item\"])*/.ic-tree-item-disabled.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.ic-tree-item-disabled.sc-ic-tree-item-h .arrow-dropdown.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-disabled.sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-disabled .sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-disabled.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-disabled .sc-ic-tree-item-s>[slot=\"router-item\"]{color:var(--ic-architectural-200) !important;fill:var(--ic-architectural-200);pointer-events:none}/*!@:host(.ic-tree-item-light) .tree-item-content,\n:host(.ic-tree-item-light) .arrow-dropdown,\n:host(.ic-tree-item-light) ::slotted([slot=\"icon\"]),\n:host(.ic-tree-item-light) ::slotted([slot=\"router-item\"])*/.ic-tree-item-light.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.ic-tree-item-light.sc-ic-tree-item-h .arrow-dropdown.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-light.sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-light .sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-light.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-light .sc-ic-tree-item-s>[slot=\"router-item\"]{color:var(--ic-architectural-white);fill:var(--ic-architectural-white)}/*!@:host .arrow-dropdown*/.sc-ic-tree-item-h .arrow-dropdown.sc-ic-tree-item{color:var(--ic-action-default);margin-right:var(--ic-space-xs)}/*!@:host(.ic-tree-item-small) .arrow-dropdown*/.ic-tree-item-small.sc-ic-tree-item-h .arrow-dropdown.sc-ic-tree-item{margin-right:var(--ic-space-xxs)}/*!@:host .tree-item-expanded*/.sc-ic-tree-item-h .tree-item-expanded.sc-ic-tree-item{transform:rotate(180deg);margin-top:calc(-1 * var(--ic-space-xxs))}/*!@:host .ic-tree-item-single*/.sc-ic-tree-item-h .ic-tree-item-single.sc-ic-tree-item{padding-left:calc(var(--ic-space-xl) + var(--ic-space-xs))}/*!@:host(.ic-tree-item-small) .ic-tree-item-single*/.ic-tree-item-small.sc-ic-tree-item-h .ic-tree-item-single.sc-ic-tree-item{padding-left:calc(var(--ic-space-xl) + var(--ic-space-xxs))}/*!@.icon-container*/.icon-container.sc-ic-tree-item{width:var(--ic-space-lg);height:var(--ic-space-lg);margin:0 var(--ic-space-xs) 0 0}/*!@:host(.ic-tree-item-small) .icon-container*/.ic-tree-item-small.sc-ic-tree-item-h .icon-container.sc-ic-tree-item{margin:0 var(--ic-space-xxs) 0 0}/*!@.ic-text-overflow*/.ic-text-overflow.sc-ic-tree-item{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}/*!@.ic-tooltip-overflow*/.ic-tooltip-overflow.sc-ic-tree-item{overflow:hidden}@media (forced-colors: active){/*!@::slotted([slot=\"icon\"])*/.sc-ic-tree-item-s>[slot=\"icon\"]{fill:currentcolor}/*!@:host(.ic-tree-item-disabled) .tree-item-content,\n  :host(.ic-tree-item-disabled) .arrow-dropdown,\n  :host(.ic-tree-item-disabled) ::slotted([slot=\"icon\"]),\n  :host(.ic-tree-item-disabled) ::slotted([slot=\"router-item\"])*/.ic-tree-item-disabled.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.ic-tree-item-disabled.sc-ic-tree-item-h .arrow-dropdown.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-disabled.sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-disabled .sc-ic-tree-item-s>[slot=\"icon\"],.sc-ic-tree-item-h.ic-tree-item-disabled.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-disabled .sc-ic-tree-item-s>[slot=\"router-item\"]{color:GrayText !important;fill:GrayText !important}/*!@:host .tree-item-content:focus,\n  ::slotted([slot=\"router-item\"]:focus)*/.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item:focus,.sc-ic-tree-item-s>[slot=\"router-item\"]:focus{border:var(--ic-hc-border) !important}/*!@:host(.ic-tree-item-selected) .tree-item-content,\n  :host(.ic-tree-item-selected) ::slotted([slot=\"router-item\"])*/.ic-tree-item-selected.sc-ic-tree-item-h .tree-item-content.sc-ic-tree-item,.sc-ic-tree-item-h.ic-tree-item-selected.sc-ic-tree-item-s>[slot=\"router-item\"],.sc-ic-tree-item-h.ic-tree-item-selected .sc-ic-tree-item-s>[slot=\"router-item\"]{color:Highlight !important}}";
 
 let treeItemIds = 0;
 /**
@@ -28626,6 +28760,10 @@ class TreeItem {
         this.selected = false;
         this.size = "default";
         this.target = undefined;
+        this.truncateTreeItem = undefined;
+    }
+    watchDisabledHandler() {
+        removeDisabledFalse(this.disabled, this.el);
     }
     watchSelectedHandler() {
         if (this.selected) {
@@ -28637,6 +28775,9 @@ class TreeItem {
         var _a;
         (_a = this.hostMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
+    componentWillLoad() {
+        removeDisabledFalse(this.disabled, this.el);
+    }
     componentDidLoad() {
         this.childTreeItems = Array.from(this.el.children).filter((child) => child.tagName === this.treeItemTag);
         if (this.childTreeItems.length > 0) {
@@ -28645,7 +28786,7 @@ class TreeItem {
         this.setTreeItemPadding();
         this.updateAriaLabel();
         setTimeout(() => {
-            this.truncateTreeItemLabel(this.el);
+            this.truncateTreeItem && this.truncateTreeItemLabel(this.el);
         }, 100);
         !isSlotUsed(this.el, "label") &&
             onComponentRequiredPropUndefined([{ prop: this.label, propName: "label" }], "Tree item");
@@ -28657,7 +28798,7 @@ class TreeItem {
     componentDidUpdate() {
         if (this.hasParentExpanded) {
             this.childTreeItems.forEach((child) => {
-                this.truncateTreeItemLabel(child);
+                child.truncateTreeItem && this.truncateTreeItemLabel(child);
             });
             this.hasParentExpanded = false;
         }
@@ -28735,6 +28876,7 @@ class TreeItem {
                 "ic-tree-item-disabled": disabled,
                 "ic-tree-item-selected": !disabled && selected,
                 [`ic-tree-item-${size}`]: size !== "default",
+                "ic-tree-item-truncate": this.truncateTreeItem,
             }, id: this.treeItemId }, this.hasRouterSlot() ? (hAsync("slot", { name: "router-item" })) : (hAsync(Component, Object.assign({ class: {
                 "tree-item-content": true,
             }, tabIndex: disabled ? -1 : 0, onClick: this.handleTreeItemClicked, ref: (el) => (this.treeItemElement = el), "aria-disabled": disabled ? "true" : "false", "aria-live": "polite" }, attrs, { onFocus: () => this.handleDisplayTooltip(true), onBlur: () => this.handleDisplayTooltip(false) }), this.isParent && (hAsync("span", { class: {
@@ -28744,6 +28886,7 @@ class TreeItem {
     }
     get el() { return getElement(this); }
     static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
         "selected": ["watchSelectedHandler"]
     }; }
     static get style() { return icTreeItemCss; }
@@ -28764,6 +28907,7 @@ class TreeItem {
             "selected": [1028],
             "size": [1],
             "target": [1],
+            "truncateTreeItem": [4, "truncate-tree-item"],
             "childTreeItems": [32],
             "setFocus": [64],
             "updateAriaLabel": [64]
@@ -28774,7 +28918,7 @@ class TreeItem {
     }; }
 }
 
-const icTreeViewCss = "/*!@:host*/.sc-ic-tree-view-h{display:block;width:var(--tree-view-width, 100%)}/*!@:host .heading-area-container*/.sc-ic-tree-view-h .heading-area-container.sc-ic-tree-view{border-bottom:var(--ic-border-default);display:flex;align-items:center;height:calc(var(--ic-space-xl) + var(--ic-space-xs) - var(--ic-space-1px));padding:0 var(--ic-space-xs)}/*!@:host(.ic-tree-view-small) .heading-area-container*/.ic-tree-view-small.sc-ic-tree-view-h .heading-area-container.sc-ic-tree-view{height:calc(var(--ic-space-xl) - var(--ic-space-1px))}/*!@:host(.ic-tree-view-large) .heading-area-container*/.ic-tree-view-large.sc-ic-tree-view-h .heading-area-container.sc-ic-tree-view{height:calc(var(--ic-space-xxl) - var(--ic-space-1px))}/*!@:host(.ic-tree-view-light) .heading-area-container*/.ic-tree-view-light.sc-ic-tree-view-h .heading-area-container.sc-ic-tree-view{color:var(--ic-architectural-white);fill:var(--ic-architectural-white)}/*!@.icon-container*/.icon-container.sc-ic-tree-view{width:var(--ic-space-lg);height:var(--ic-space-lg);margin:0 var(--ic-space-xs) 0 0}/*!@:host(.ic-tree-view-small) .icon-container*/.ic-tree-view-small.sc-ic-tree-view-h .icon-container.sc-ic-tree-view{margin:0 var(--ic-space-xxs) 0 0}/*!@.ic-text-overflow*/.ic-text-overflow.sc-ic-tree-view{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}/*!@.ic-tooltip-overflow*/.ic-tooltip-overflow.sc-ic-tree-view{overflow:hidden}@media (forced-colors: active){/*!@::slotted([slot=\"icon\"])*/.sc-ic-tree-view-s>[slot=\"icon\"]{fill:currentcolor}}";
+const icTreeViewCss = "/*!@:host*/.sc-ic-tree-view-h{display:block;width:var(--tree-view-width, 100%)}/*!@:host .heading-area-container*/.sc-ic-tree-view-h .heading-area-container.sc-ic-tree-view{border-bottom:var(--ic-border-default);display:flex;align-items:center;min-height:calc(\n    var(--ic-space-xl) + var(--ic-space-xs) - var(--ic-space-1px)\n  );padding:0 var(--ic-space-xs)}/*!@:host(.ic-tree-view-small) .heading-area-container*/.ic-tree-view-small.sc-ic-tree-view-h .heading-area-container.sc-ic-tree-view{min-height:calc(var(--ic-space-xl) - var(--ic-space-1px))}/*!@:host(.ic-tree-view-large) .heading-area-container*/.ic-tree-view-large.sc-ic-tree-view-h .heading-area-container.sc-ic-tree-view{min-height:calc(var(--ic-space-xxl) - var(--ic-space-1px))}/*!@:host(.ic-tree-view-truncate) .heading-area-container*/.ic-tree-view-truncate.sc-ic-tree-view-h .heading-area-container.sc-ic-tree-view{height:calc(var(--ic-space-xl) + var(--ic-space-xs) - var(--ic-space-1px))}/*!@:host(.ic-tree-view-truncate.ic-tree-view-small) .heading-area-container*/.ic-tree-view-truncate.ic-tree-view-small.sc-ic-tree-view-h .heading-area-container.sc-ic-tree-view{height:calc(var(--ic-space-xl) - var(--ic-space-1px))}/*!@:host(.ic-tree-view-truncate.ic-tree-view-large) .heading-area-container*/.ic-tree-view-truncate.ic-tree-view-large.sc-ic-tree-view-h .heading-area-container.sc-ic-tree-view{height:calc(var(--ic-space-xxl) - var(--ic-space-1px))}/*!@:host(.ic-tree-view-light) .heading-area-container*/.ic-tree-view-light.sc-ic-tree-view-h .heading-area-container.sc-ic-tree-view{color:var(--ic-architectural-white);fill:var(--ic-architectural-white)}/*!@.icon-container*/.icon-container.sc-ic-tree-view{width:var(--ic-space-lg);height:var(--ic-space-lg);margin:0 var(--ic-space-xs) 0 0}/*!@:host(.ic-tree-view-small) .icon-container*/.ic-tree-view-small.sc-ic-tree-view-h .icon-container.sc-ic-tree-view{margin:0 var(--ic-space-xxs) 0 0}/*!@.ic-text-overflow*/.ic-text-overflow.sc-ic-tree-view{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}/*!@.ic-tooltip-overflow*/.ic-tooltip-overflow.sc-ic-tree-view{overflow:hidden}@media (forced-colors: active){/*!@::slotted([slot=\"icon\"])*/.sc-ic-tree-view-s>[slot=\"icon\"]{fill:currentcolor}}";
 
 let treeViewIds = 0;
 /**
@@ -28905,6 +29049,8 @@ class TreeView {
         this.appearance = "dark";
         this.heading = "";
         this.size = "default";
+        this.truncateHeading = false;
+        this.truncateTreeItems = false;
     }
     watchAppearanceHandler() {
         this.treeItems.forEach((treeItem) => {
@@ -28916,6 +29062,13 @@ class TreeView {
             treeItem.size = this.size;
         });
     }
+    watchTruncateTreeItemsHandler() {
+        this.treeItems.forEach((treeItem) => {
+            if (treeItem.truncateTreeItem === undefined) {
+                treeItem.truncateTreeItem = this.truncateTreeItems;
+            }
+        });
+    }
     disconnectedCallback() {
         var _a, _b;
         (_a = this.el) === null || _a === void 0 ? void 0 : _a.removeEventListener("slotchange", this.setTreeItems);
@@ -28925,8 +29078,9 @@ class TreeView {
         this.setTreeItems();
         this.watchAppearanceHandler();
         this.watchSizeHandler();
+        this.watchTruncateTreeItemsHandler();
         setTimeout(() => {
-            this.truncateTreeViewHeading();
+            this.truncateHeading && this.truncateTreeViewHeading();
         }, 100);
         this.addSlotChangeListener();
         this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);
@@ -28959,12 +29113,14 @@ class TreeView {
         return (hAsync(Host, { "context-id": this.treeViewId, class: {
                 [`ic-tree-view-${appearance}`]: true,
                 [`ic-tree-view-${size}`]: size !== "default",
+                "ic-tree-view-truncate": this.truncateHeading,
             }, onKeyDown: this.handleKeyDown, "aria-label": this.isHeadingDefined() ? heading : null }, this.hasHeadingAreaContent() && (hAsync("div", { class: "heading-area-container" }, isSlotUsed(this.el, "icon") && (hAsync("div", { class: "icon-container" }, hAsync("slot", { name: "icon" }))), hAsync("ic-typography", { variant: "subtitle-large", class: "tree-view-header" }, isSlotUsed(this.el, "heading") ? (hAsync("slot", { name: "heading" })) : (heading)))), hAsync("slot", null)));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
         "appearance": ["watchAppearanceHandler"],
-        "size": ["watchSizeHandler"]
+        "size": ["watchSizeHandler"],
+        "truncateTreeItems": ["watchTruncateTreeItemsHandler"]
     }; }
     static get style() { return icTreeViewCss; }
     static get cmpMeta() { return {
@@ -28974,6 +29130,8 @@ class TreeView {
             "appearance": [1],
             "heading": [1],
             "size": [1],
+            "truncateHeading": [4, "truncate-heading"],
+            "truncateTreeItems": [4, "truncate-tree-items"],
             "treeItems": [32]
         },
         "$listeners$": [[0, "icTreeItemSelected", "handleTreeItemSelected"]],