@siemens/ix 0.0.0-pr-2297-20251204163058 → 0.0.0-pr-2300-20260107140403

package/components/{p-hwPzPVf8.js → p-rFxiFp44.js}

@@ -1,6 +1,6 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-D-__gyet.js';
 
-const cardCss = ":host{display:flex;position:relative;flex-direction:column;align-items:flex-start;align-self:flex-start;overflow:hidden;cursor:pointer;width:20rem;border:var(--theme-card--border-width) solid var(--ix-card-border-color, var(--theme-color-soft-bdr));border-radius:var(--theme-card--border-radius)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .card-content{display:block;position:relative;flex-shrink:0;flex-grow:1;width:100%;height:calc(100% - 2rem);background-color:var(--ix-card-background, transparent);border-top-left-radius:var(--theme-card--border-radius);border-top-right-radius:var(--theme-card--border-radius);overflow:hidden}:host .card-content-wrapper{height:100%;width:100%;box-sizing:border-box}:host .card-footer{display:flex;position:relative;width:100%}:host(.card-outline){--ix-card-background:var(--theme-card-outline--background);--ix-card-border-color:var(--theme-card-outline--border-color);color:var(--theme-card-outline--color)}:host(.card-outline) ::slotted(ix-card-accordion){color:var(--theme-color-std-text)}:host(.card-filled){--ix-card-background:var(--theme-card-filled--background);--ix-card-border-color:var(--theme-card-filled--border-color);color:var(--theme-card-filled--color)}:host(.card-filled) ::slotted(ix-card-accordion){color:var(--theme-color-std-text)}:host(.card-alarm){--ix-card-background:var(--theme-card-alarm--background);--ix-card-border-color:var(--theme-card-alarm--border-color);color:var(--theme-card-alarm--color)}:host(.card-critical){--ix-card-background:var(--theme-card-critical--background);--ix-card-border-color:var(--theme-card-critical--border-color);color:var(--theme-card-critical--color)}:host(.card-warning){--ix-card-background:var(--theme-card-warning--background);--ix-card-border-color:var(--theme-card-warning--border-color);color:var(--theme-card-warning--color)}:host(.card-success){--ix-card-background:var(--theme-card-success--background);--ix-card-border-color:var(--theme-card-success--border-color);color:var(--theme-card-success--color)}:host(.card-info){--ix-card-background:var(--theme-card-info--background);--ix-card-border-color:var(--theme-card-info--border-color);color:var(--theme-card-info--color)}:host(.card-neutral){--ix-card-background:var(--theme-card-neutral--background);--ix-card-border-color:var(--theme-card-neutral--border-color);color:var(--theme-card-neutral--color)}:host(.card-primary){--ix-card-background:var(--theme-card-primary--background);--ix-card-border-color:var(--theme-card-primary--border-color);color:var(--theme-card-primary--color)}:host(:not(.card-insight,.card-outline)){--ix-card-border-color:transparent}:host(.card-outline:hover){--ix-card-border-color:var(--theme-card-outline--border-color--hover);--ix-card-background:var(--theme-card-outline--background--hover)}:host(.card-outline:active){--ix-card-border-color:var(--theme-card-outline--border-color--active);--ix-card-background:var(--theme-card-outline--background--active)}:host(.selected.card-outline){--ix-card-border-color:var(\n    --theme-card-outline--border-color--selected\n  );--ix-card-background:var(--theme-card-outline--background--selected)}:host(.card-filled:hover){--ix-card-border-color:var(--theme-card-filled--border-color--hover);--ix-card-background:var(--theme-card-filled--background--hover)}:host(.card-filled:active){--ix-card-border-color:var(--theme-card-filled--border-color--active);--ix-card-background:var(--theme-card-filled--background--active)}:host(.selected.card-filled){--ix-card-border-color:var(\n    --theme-card-filled--border-color--selected\n  );--ix-card-background:var(--theme-card-filled--background--selected)}:host(.card-alarm:hover){--ix-card-border-color:var(--theme-card-alarm--border-color--hover);--ix-card-background:var(--theme-card-alarm--background--hover)}:host(.card-alarm:active){--ix-card-border-color:var(--theme-card-alarm--border-color--active);--ix-card-background:var(--theme-card-alarm--background--active)}:host(.selected.card-alarm){--ix-card-border-color:var(\n    --theme-card-alarm--border-color--selected\n  );--ix-card-background:var(--theme-card-alarm--background--selected)}:host(.card-critical:hover){--ix-card-border-color:var(--theme-card-critical--border-color--hover);--ix-card-background:var(--theme-card-critical--background--hover)}:host(.card-critical:active){--ix-card-border-color:var(--theme-card-critical--border-color--active);--ix-card-background:var(--theme-card-critical--background--active)}:host(.selected.card-critical){--ix-card-border-color:var(\n    --theme-card-critical--border-color--selected\n  );--ix-card-background:var(--theme-card-critical--background--selected)}:host(.card-warning:hover){--ix-card-border-color:var(--theme-card-warning--border-color--hover);--ix-card-background:var(--theme-card-warning--background--hover)}:host(.card-warning:active){--ix-card-border-color:var(--theme-card-warning--border-color--active);--ix-card-background:var(--theme-card-warning--background--active)}:host(.selected.card-warning){--ix-card-border-color:var(\n    --theme-card-warning--border-color--selected\n  );--ix-card-background:var(--theme-card-warning--background--selected)}:host(.card-success:hover){--ix-card-border-color:var(--theme-card-success--border-color--hover);--ix-card-background:var(--theme-card-success--background--hover)}:host(.card-success:active){--ix-card-border-color:var(--theme-card-success--border-color--active);--ix-card-background:var(--theme-card-success--background--active)}:host(.selected.card-success){--ix-card-border-color:var(\n    --theme-card-success--border-color--selected\n  );--ix-card-background:var(--theme-card-success--background--selected)}:host(.card-info:hover){--ix-card-border-color:var(--theme-card-info--border-color--hover);--ix-card-background:var(--theme-card-info--background--hover)}:host(.card-info:active){--ix-card-border-color:var(--theme-card-info--border-color--active);--ix-card-background:var(--theme-card-info--background--active)}:host(.selected.card-info){--ix-card-border-color:var(\n    --theme-card-info--border-color--selected\n  );--ix-card-background:var(--theme-card-info--background--selected)}:host(.card-neutral:hover){--ix-card-border-color:var(--theme-card-neutral--border-color--hover);--ix-card-background:var(--theme-card-neutral--background--hover)}:host(.card-neutral:active){--ix-card-border-color:var(--theme-card-neutral--border-color--active);--ix-card-background:var(--theme-card-neutral--background--active)}:host(.selected.card-neutral){--ix-card-border-color:var(\n    --theme-card-neutral--border-color--selected\n  );--ix-card-background:var(--theme-card-neutral--background--selected)}:host(.card-primary:hover){--ix-card-border-color:var(--theme-card-primary--border-color--hover);--ix-card-background:var(--theme-card-primary--background--hover)}:host(.card-primary:active){--ix-card-border-color:var(--theme-card-primary--border-color--active);--ix-card-background:var(--theme-card-primary--background--active)}:host(.selected.card-primary){--ix-card-border-color:var(\n    --theme-card-primary--border-color--selected\n  );--ix-card-background:var(--theme-card-primary--background--selected)}";
+const cardCss = ":host{display:flex;position:relative;flex-direction:column;align-items:flex-start;align-self:flex-start;overflow:hidden;cursor:pointer;width:20rem;border:var(--theme-card--border-width) solid var(--ix-card-border-color, var(--theme-color-soft-bdr));border-radius:var(--theme-card--border-radius)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .card-content{display:block;position:relative;flex-shrink:0;flex-grow:1;width:100%;height:calc(100% - 2rem);background-color:var(--ix-card-background, transparent);border-top-left-radius:var(--theme-card--border-radius);border-top-right-radius:var(--theme-card--border-radius);overflow:hidden}:host .card-content-wrapper{height:100%;width:100%;box-sizing:border-box}:host .card-footer{display:flex;position:relative;width:100%}:host(.card-outline){--ix-card-background:var(--theme-card-outline--background);--ix-card-border-color:var(--theme-card-outline--border-color);color:var(--theme-card-outline--color)}:host(.card-outline) ::slotted(ix-card-accordion){color:var(--theme-color-std-text)}:host(.card-filled){--ix-card-background:var(--theme-card-filled--background);--ix-card-border-color:var(--theme-card-filled--border-color);color:var(--theme-card-filled--color)}:host(.card-filled) ::slotted(ix-card-accordion){color:var(--theme-color-std-text)}:host(.card-alarm){--ix-card-background:var(--theme-card-alarm--background);--ix-card-border-color:var(--theme-card-alarm--border-color);color:var(--theme-card-alarm--color)}:host(.card-critical){--ix-card-background:var(--theme-card-critical--background);--ix-card-border-color:var(--theme-card-critical--border-color);color:var(--theme-card-critical--color)}:host(.card-warning){--ix-card-background:var(--theme-card-warning--background);--ix-card-border-color:var(--theme-card-warning--border-color);color:var(--theme-card-warning--color)}:host(.card-success){--ix-card-background:var(--theme-card-success--background);--ix-card-border-color:var(--theme-card-success--border-color);color:var(--theme-card-success--color)}:host(.card-info){--ix-card-background:var(--theme-card-info--background);--ix-card-border-color:var(--theme-card-info--border-color);color:var(--theme-card-info--color)}:host(.card-neutral){--ix-card-background:var(--theme-card-neutral--background);--ix-card-border-color:var(--theme-card-neutral--border-color);color:var(--theme-card-neutral--color)}:host(.card-primary){--ix-card-background:var(--theme-card-primary--background);--ix-card-border-color:var(--theme-card-primary--border-color);color:var(--theme-card-primary--color)}:host(:not(.card-insight,.card-outline)){--ix-card-border-color:transparent}:host(.card-outline:hover){--ix-card-border-color:var(--theme-card-outline--border-color--hover);--ix-card-background:var(--theme-card-outline--background--hover)}:host(.card-outline:active){--ix-card-border-color:var(--theme-card-outline--border-color--active);--ix-card-background:var(--theme-card-outline--background--active)}:host(.selected.card-outline){--ix-card-border-color:var(\n    --theme-card-outline--border-color--selected\n  );--ix-card-background:var(--theme-card-outline--background--selected)}:host(.card-filled:hover){--ix-card-border-color:var(--theme-card-filled--border-color--hover);--ix-card-background:var(--theme-card-filled--background--hover)}:host(.card-filled:active){--ix-card-border-color:var(--theme-card-filled--border-color--active);--ix-card-background:var(--theme-card-filled--background--active)}:host(.selected.card-filled){--ix-card-border-color:var(\n    --theme-card-filled--border-color--selected\n  );--ix-card-background:var(--theme-card-filled--background--selected)}:host(.card-alarm:hover){--ix-card-border-color:var(--theme-card-alarm--border-color--hover);--ix-card-background:var(--theme-card-alarm--background--hover)}:host(.card-alarm:active){--ix-card-border-color:var(--theme-card-alarm--border-color--active);--ix-card-background:var(--theme-card-alarm--background--active)}:host(.selected.card-alarm){--ix-card-border-color:var(\n    --theme-card-alarm--border-color--selected\n  );--ix-card-background:var(--theme-card-alarm--background--selected)}:host(.card-critical:hover){--ix-card-border-color:var(--theme-card-critical--border-color--hover);--ix-card-background:var(--theme-card-critical--background--hover)}:host(.card-critical:active){--ix-card-border-color:var(--theme-card-critical--border-color--active);--ix-card-background:var(--theme-card-critical--background--active)}:host(.selected.card-critical){--ix-card-border-color:var(\n    --theme-card-critical--border-color--selected\n  );--ix-card-background:var(--theme-card-critical--background--selected)}:host(.card-warning:hover){--ix-card-border-color:var(--theme-card-warning--border-color--hover);--ix-card-background:var(--theme-card-warning--background--hover)}:host(.card-warning:active){--ix-card-border-color:var(--theme-card-warning--border-color--active);--ix-card-background:var(--theme-card-warning--background--active)}:host(.selected.card-warning){--ix-card-border-color:var(\n    --theme-card-warning--border-color--selected\n  );--ix-card-background:var(--theme-card-warning--background--selected)}:host(.card-success:hover){--ix-card-border-color:var(--theme-card-success--border-color--hover);--ix-card-background:var(--theme-card-success--background--hover)}:host(.card-success:active){--ix-card-border-color:var(--theme-card-success--border-color--active);--ix-card-background:var(--theme-card-success--background--active)}:host(.selected.card-success){--ix-card-border-color:var(\n    --theme-card-success--border-color--selected\n  );--ix-card-background:var(--theme-card-success--background--selected)}:host(.card-info:hover){--ix-card-border-color:var(--theme-card-info--border-color--hover);--ix-card-background:var(--theme-card-info--background--hover)}:host(.card-info:active){--ix-card-border-color:var(--theme-card-info--border-color--active);--ix-card-background:var(--theme-card-info--background--active)}:host(.selected.card-info){--ix-card-border-color:var(\n    --theme-card-info--border-color--selected\n  );--ix-card-background:var(--theme-card-info--background--selected)}:host(.card-neutral:hover){--ix-card-border-color:var(--theme-card-neutral--border-color--hover);--ix-card-background:var(--theme-card-neutral--background--hover)}:host(.card-neutral:active){--ix-card-border-color:var(--theme-card-neutral--border-color--active);--ix-card-background:var(--theme-card-neutral--background--active)}:host(.selected.card-neutral){--ix-card-border-color:var(\n    --theme-card-neutral--border-color--selected\n  );--ix-card-background:var(--theme-card-neutral--background--selected)}:host(.card-primary:hover){--ix-card-border-color:var(--theme-card-primary--border-color--hover);--ix-card-background:var(--theme-card-primary--background--hover)}:host(.card-primary:active){--ix-card-border-color:var(--theme-card-primary--border-color--active);--ix-card-background:var(--theme-card-primary--background--active)}:host(.selected.card-primary){--ix-card-border-color:var(\n    --theme-card-primary--border-color--selected\n  );--ix-card-background:var(--theme-card-primary--background--selected)}:host(.passive){cursor:default}:host(.passive.card-outline){--ix-card-background:var(--theme-card-outline--background);--ix-card-border-color:var(--theme-card-outline--border-color)}:host(.passive.card-filled){--ix-card-background:var(--theme-card-filled--background);--ix-card-border-color:var(--theme-card-filled--border-color)}:host(.passive.card-alarm){--ix-card-background:var(--theme-card-alarm--background);--ix-card-border-color:var(--theme-card-alarm--border-color)}:host(.passive.card-critical){--ix-card-background:var(--theme-card-critical--background);--ix-card-border-color:var(--theme-card-critical--border-color)}:host(.passive.card-warning){--ix-card-background:var(--theme-card-warning--background);--ix-card-border-color:var(--theme-card-warning--border-color)}:host(.passive.card-success){--ix-card-background:var(--theme-card-success--background);--ix-card-border-color:var(--theme-card-success--border-color)}:host(.passive.card-info){--ix-card-background:var(--theme-card-info--background);--ix-card-border-color:var(--theme-card-info--border-color)}:host(.passive.card-neutral){--ix-card-background:var(--theme-card-neutral--background);--ix-card-border-color:var(--theme-card-neutral--border-color)}:host(.passive.card-primary){--ix-card-background:var(--theme-card-primary--background);--ix-card-border-color:var(--theme-card-primary--border-color)}";
 
 const Card = /*@__PURE__*/ proxyCustomElement(class Card extends H {
     constructor(registerHost) {
@@ -17,18 +17,24 @@ const Card = /*@__PURE__*/ proxyCustomElement(class Card extends H {
          * Show card in selected state
          */
         this.selected = false;
+        /**
+         * If true, disables hover and active styles and changes cursor to default
+         */
+        this.passive = false;
     }
     render() {
-        return (h(Host, { key: '3b734eddf8516af24b52b1b2ba27766a913f943d', class: {
+        return (h(Host, { key: '3eed87586aed1916f7c1e3c2323a46c794d046d9', class: {
                 selected: this.selected,
                 [`card-${this.variant}`]: true,
-            } }, h("div", { key: '7a2cce1797c1e89c8568e9e196020747f0f4150b', class: "card-content" }, h("slot", { key: 'ea837bde282a62637ed15b96b8ca407219e949ae' })), h("div", { key: 'acc07c72e4a63a671fb945e4c0332825f4781a1d', class: "card-footer" }, h("slot", { key: '870004ea22909180bac56c8b7c040d914e268f1d', name: "card-accordion" }))));
+                passive: this.passive,
+            } }, h("div", { key: '7ae77cffe48272d0acc8cbd0dc7286d0fc835d8d', class: "card-content" }, h("slot", { key: 'ba07f9804dd1af6256ceb0cc972b2cc03a18f558' })), h("div", { key: '72bc9064c1d09188d60e1b9516811a91435f53b4', class: "card-footer" }, h("slot", { key: '7fbacfea4d8308e88b4db025567654a0a4ef0d96', name: "card-accordion" }))));
     }
     get hostElement() { return this; }
     static get style() { return cardCss; }
 }, [257, "ix-card", {
         "variant": [1],
-        "selected": [4]
+        "selected": [4],
+        "passive": [4]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {
@@ -45,6 +51,6 @@ function defineCustomElement() {
 }
 
 export { Card as C, defineCustomElement as d };
-//# sourceMappingURL=p-hwPzPVf8.js.map
+//# sourceMappingURL=p-rFxiFp44.js.map
 
-//# sourceMappingURL=p-hwPzPVf8.js.map
+//# sourceMappingURL=p-rFxiFp44.js.map

package/components/p-rFxiFp44.js.map

@@ -0,0 +1 @@
+{"file":"p-rFxiFp44.js","mappings":";;AAAA,MAAM,OAAO,GAAG,6lSAA6lS;;MCQhmS,IAAI,iBAAAA,kBAAA,CAAA,MAAA,IAAA,SAAAC,CAAA,CAAA;AALjB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;AAQE;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAgB,SAAS;AAExC;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAEjC;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;AAoBjC;IAlBC,MAAM,GAAA;QACJ,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACvB,gBAAA,CAAC,QAAQ,IAAI,CAAC,OAAO,CAAE,CAAA,GAAG,IAAI;gBAC9B,OAAO,EAAE,IAAI,CAAC,OAAO;aACtB,EAAA,EAED,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EACvB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,EACN,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,EAAA,EACtB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,gBAAgB,GAAQ,CAC/B,CACD;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/card/card.scss?tag=ix-card&encapsulation=shadow","src/components/card/card.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use 'mixins/shadow-dom/component';\n@use './card-vars' as card-vars;\n\n:host {\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  align-items: flex-start;\n  align-self: flex-start;\n  overflow: hidden;\n  cursor: pointer;\n\n  width: 20rem;\n\n  border: var(--theme-card--border-width) solid\n    var(--ix-card-border-color, var(--theme-color-soft-bdr));\n  border-radius: var(--theme-card--border-radius);\n\n  @include component.ix-component;\n\n  .card-content {\n    display: block;\n    position: relative;\n    flex-shrink: 0;\n    flex-grow: 1;\n    width: 100%;\n    height: calc(100% - 2rem);\n    background-color: var(--ix-card-background, transparent);\n    border-top-left-radius: var(--theme-card--border-radius);\n    border-top-right-radius: var(--theme-card--border-radius);\n    overflow: hidden;\n  }\n\n  .card-content-wrapper {\n    height: 100%;\n    width: 100%;\n    box-sizing: border-box;\n  }\n\n  .card-footer {\n    display: flex;\n    position: relative;\n    width: 100%;\n  }\n}\n\n@mixin accordionChevronColorPrimary {\n  ::slotted(ix-card-accordion) {\n    color: var(--theme-color-std-text);\n  }\n}\n\n@mixin card-variants($variant) {\n  :host(.card-#{$variant}) {\n    --ix-card-background: var(--theme-card-#{$variant}--background);\n    --ix-card-border-color: var(--theme-card-#{$variant}--border-color);\n\n    color: var(--theme-card-#{$variant}--color);\n\n    @if $variant == outline {\n      @include accordionChevronColorPrimary;\n    }\n\n    @if $variant == filled {\n      @include accordionChevronColorPrimary;\n    }\n  }\n}\n\n@each $variant in card-vars.$ix-card-variants {\n  @include card-variants($variant);\n}\n\n:host(:not(.card-insight, .card-outline)) {\n  --ix-card-border-color: transparent;\n}\n\n@mixin card-variants-active($variant) {\n  :host(.card-#{$variant}:active) {\n    --ix-card-border-color: var(--theme-card-#{$variant}--border-color--active);\n    --ix-card-background: var(--theme-card-#{$variant}--background--active);\n  }\n}\n\n@mixin card-variants-hover($variant) {\n  :host(.card-#{$variant}:hover) {\n    --ix-card-border-color: var(--theme-card-#{$variant}--border-color--hover);\n    --ix-card-background: var(--theme-card-#{$variant}--background--hover);\n  }\n}\n\n@mixin card-variants-selected($variant) {\n  :host(.selected.card-#{$variant}) {\n    --ix-card-border-color: var(\n      --theme-card-#{$variant}--border-color--selected\n    );\n    --ix-card-background: var(--theme-card-#{$variant}--background--selected);\n  }\n}\n\n@each $variant in card-vars.$ix-card-variants {\n  @include card-variants-hover($variant);\n  @include card-variants-active($variant);\n  @include card-variants-selected($variant);\n}\n\n:host(.passive) {\n  cursor: default;\n}\n\n@each $variant in card-vars.$ix-card-variants {\n  :host(.passive.card-#{$variant}) {\n    --ix-card-background: var(--theme-card-#{$variant}--background);\n    --ix-card-border-color: var(--theme-card-#{$variant}--border-color);\n  }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\nimport type { CardVariant } from './card.types';\n\n@Component({\n  tag: 'ix-card',\n  styleUrl: 'card.scss',\n  shadow: true,\n})\nexport class Card {\n  @Element() hostElement!: HTMLIxCardElement;\n\n  /**\n   * Card variant\n   */\n  @Prop() variant: CardVariant = 'outline';\n\n  /**\n   * Show card in selected state\n   */\n  @Prop() selected: boolean = false;\n\n  /**\n   * If true, disables hover and active styles and changes cursor to default\n   */\n  @Prop() passive: boolean = false;\n\n  render() {\n    return (\n      <Host\n        class={{\n          selected: this.selected,\n          [`card-${this.variant}`]: true,\n          passive: this.passive,\n        }}\n      >\n        <div class=\"card-content\">\n          <slot></slot>\n        </div>\n        <div class=\"card-footer\">\n          <slot name=\"card-accordion\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/components/{p-DlVaL0Yi.js → p-tpxSImkl.js}

@@ -26,6 +26,10 @@ const Toast = /*@__PURE__*/ proxyCustomElement(class Toast extends H {
          * Autoclose behavior
          */
         this.preventAutoClose = false;
+        /**
+         * Allows to hide the icon in the toast.
+         */
+        this.hideIcon = false;
         this.progress = 0;
         this.touched = false;
         this.paused = false;
@@ -82,11 +86,11 @@ const Toast = /*@__PURE__*/ proxyCustomElement(class Toast extends H {
             animationPlayState: this.touched || this.paused ? 'paused' : 'running',
         };
         progressBarClass.push('toast-progress-bar--animated');
-        return (h(Host, { key: 'b006843e5552e82ed437b10ab31c5cdff7ec90a6', class: "animate__animated animate__fadeIn" }, h("div", { key: '8d4c07604138e38235b3a2f042ce8550966df392', class: "toast-body", onPointerLeave: () => {
+        return (h(Host, { key: 'f2f95d77b28639b78e3fb0f82f471d8fba9b3a3d', class: "animate__animated animate__fadeIn" }, h("div", { key: 'c32a7a677f5d7ca00c209355e5af9679ad28fc28', class: "toast-body", onPointerLeave: () => {
                 this.touched = false;
             }, onPointerEnter: () => {
                 this.touched = true;
-            } }, this.type || this.icon ? (h("div", { class: "toast-icon" }, this.getIcon())) : null, h("div", { key: 'b5235db039ca12fa5a3823861f41e86fbf312661', class: "toast-content" }, this.toastTitle ? (h("ix-typography", { class: "toast-title", format: "h5" }, this.toastTitle)) : null, h("div", { key: '6577c06f5530655aafc974684aedbac7d48da649', class: "toast-message" }, h("slot", { key: '16675e05c803fe4ef8e246463f30c194e76a8428' })), h("div", { key: '84eeb321fc81b49d14468e7d517dd8cfc8769c8d', class: "toast-action" }, h("slot", { key: 'f55d9f57a23bf58006e1f3bc1d3e7fab85440dab', name: "action" }))), h("div", { key: 'd409d2622bce56496f6081cf55ab9ad1137dc222', class: "toast-close" }, h("ix-icon-button", { key: '873c0a73f6c5a9ae47cd39d63ff9c68dde219cbd', icon: iconClose, iconColor: "color-soft-text", size: "24", variant: "tertiary", onClick: () => this.closeToast.emit(), "aria-label": this.ariaLabelCloseIconButton }))), !this.preventAutoClose && (h("div", { key: '15a6b8556e7d22e9c9061a27e31b3138cb86380b', class: progressBarClass.join(' '), style: progressBarStyle, onAnimationEnd: () => {
+            } }, (this.type || this.icon) && !this.hideIcon ? (h("div", { class: "toast-icon" }, this.getIcon())) : null, h("div", { key: '853a02c2cedea5b66aabc754699e6aeab69dbb9a', class: "toast-content" }, this.toastTitle ? (h("ix-typography", { class: "toast-title", format: "h5" }, this.toastTitle)) : null, h("div", { key: '35d881b3af41b2400a873ea2e45a0634eb81831f', class: "toast-message" }, h("slot", { key: '9030ed64837f7ee0b4ffc8b9aa36d8553e3a97ae' })), h("div", { key: 'fee8e7ca8620d01f8de665ad80293f44b71879ca', class: "toast-action" }, h("slot", { key: '0b81d513c974da48e77cebc35806ab19f7bc9e6f', name: "action" }))), h("div", { key: '59f3cf1722fc9203cb9602387115019258014c55', class: "toast-close" }, h("ix-icon-button", { key: 'd6dceea9274e9266f9ac36c51546635e954ef963', icon: iconClose, iconColor: "color-soft-text", size: "24", variant: "tertiary", onClick: () => this.closeToast.emit(), "aria-label": this.ariaLabelCloseIconButton }))), !this.preventAutoClose && (h("div", { key: '3530a6781c5f32d787ef1a1b38eb39f98ca26062', class: progressBarClass.join(' '), style: progressBarStyle, onAnimationEnd: () => {
                 this.close();
             }, onTransitionEnd: () => {
                 if (this.progress === 0) {
@@ -103,6 +107,7 @@ const Toast = /*@__PURE__*/ proxyCustomElement(class Toast extends H {
         "preventAutoClose": [4, "prevent-auto-close"],
         "icon": [1],
         "iconColor": [1, "icon-color"],
+        "hideIcon": [4, "hide-icon"],
         "ariaLabelCloseIconButton": [1, "aria-label-close-icon-button"],
         "progress": [32],
         "touched": [32],
@@ -141,6 +146,6 @@ function defineCustomElement() {
 }
 
 export { Toast as T, defineCustomElement as d };
-//# sourceMappingURL=p-DlVaL0Yi.js.map
+//# sourceMappingURL=p-tpxSImkl.js.map
 
-//# sourceMappingURL=p-DlVaL0Yi.js.map
+//# sourceMappingURL=p-tpxSImkl.js.map

package/components/p-tpxSImkl.js.map

@@ -0,0 +1 @@
+{"file":"p-tpxSImkl.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/toast/toast.scss?tag=ix-toast&encapsulation=shadow","src/components/toast/toast.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use './common-variables' as vars;\n@use 'mixins/hover';\n@use 'mixins/text-truncation';\n@use 'mixins/shadow-dom/component';\n@use 'legacy/mixins/fonts';\n\n:host {\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  min-width: 17.5rem;\n  max-width: 17.5rem;\n  min-height: 3.5rem;\n\n  pointer-events: all;\n\n  background-color: var(--theme-toast--background);\n  border: var(--theme-toast--border-thickness) solid\n    var(--theme-toast--border-color);\n  border-radius: var(\n    --theme-toast--border-radius,\n    var(--theme-toast--border-radus)\n  );\n  box-shadow: var(--theme-toast--box-shadow);\n\n  --animate-duration: var(--theme-medium-time);\n\n  @include component.ix-component;\n\n  .toast-body {\n    display: flex;\n    position: relative;\n    min-height: 3.5rem;\n    width: 100%;\n    flex-grow: 1;\n    padding: 0.75rem;\n\n    .toast-icon {\n      display: flex;\n      align-items: flex-start;\n      margin-right: 0.5rem;\n    }\n\n    .toast-content {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      min-width: 0;\n      width: 100%;\n\n      .toast-title {\n        margin: 0.25rem 0px;\n      }\n\n      .toast-message {\n        min-width: 0;\n\n        @include fonts.text-default;\n      }\n\n      .toast-action {\n        margin-top: 0.5rem;\n      }\n    }\n\n    .toast-icon + .toast-content {\n      max-width: 10.25rem;\n    }\n  }\n\n  .toast-close {\n    display: flex;\n    position: relative;\n    pointer-events: all;\n    margin-left: auto;\n    margin-right: 0px;\n    opacity: 0.6;\n    &:hover {\n      opacity: 1;\n    }\n  }\n\n  .toast-progress-bar {\n    position: absolute;\n    bottom: 0;\n    height: 0.125rem;\n    width: 100%;\n    background-color: var(--theme-toast-timer-value--background);\n    transform-origin: left;\n\n    &--animated {\n      animation: trackProgress linear 1 forwards;\n    }\n  }\n\n  @keyframes trackProgress {\n    0% {\n      transform: scaleX(1);\n    }\n    100% {\n      transform: scaleX(0);\n    }\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { ToastType } from './toast-utils';\nimport {\n  iconClose,\n  iconError,\n  iconInfo,\n  iconSuccess,\n  iconWarning,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n  tag: 'ix-toast',\n  styleUrl: 'toast.scss',\n  shadow: true,\n})\nexport class Toast {\n  /**\n   * Toast type\n   */\n  @Prop() type: ToastType = 'info';\n\n  /**\n   * Toast title\n   */\n  @Prop() toastTitle?: string;\n\n  /**\n   * Autoclose title after delay\n   */\n  @Prop() autoCloseDelay = 5000;\n\n  /**\n   * Autoclose behavior\n   */\n  @Prop() preventAutoClose = false;\n\n  /**\n   * Icon of toast\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Icon color of toast\n   */\n  @Prop() iconColor?: string;\n\n  /**\n   * Allows to hide the icon in the toast.\n   */\n  @Prop() hideIcon: boolean = false;\n\n  /**\n   * ARIA label for the close icon button\n   * Will be set as aria-label on the nested HTML button element\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelCloseIconButton?: string;\n\n  /**\n   * Toast closed\n   */\n  @Event() closeToast!: EventEmitter;\n\n  @State() progress = 0;\n  @State() touched = false;\n  @State() paused = false;\n\n  @Element() hostElement!: HTMLIxToastElement;\n\n  private getIcon() {\n    if (this.icon) {\n      return (\n        <ix-icon\n          data-testid=\"toast-icon\"\n          name={this.icon}\n          color={this.iconColor}\n          size=\"24\"\n        />\n      );\n    }\n\n    switch (this.type) {\n      case 'info':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={iconInfo}\n            size=\"24\"\n            color=\"color-std-text\"\n          />\n        );\n\n      case 'error':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={iconError}\n            size=\"24\"\n            color=\"color-alarm\"\n          />\n        );\n\n      case 'success':\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={iconSuccess}\n            size=\"24\"\n            color=\"color-success\"\n          />\n        );\n\n      case 'warning':\n        //TODO(IX-3400): Replace icon colors with proper CSS variables when available\n        return (\n          <ix-icon\n            data-testid=\"toast-icon\"\n            name={iconWarning}\n            size=\"24\"\n            color=\"color-warning-text\"\n          />\n        );\n\n      default:\n        return '';\n    }\n  }\n\n  private close() {\n    if (this.hostElement) {\n      this.hostElement.classList.add('animate__fadeOut');\n    }\n    setTimeout(() => {\n      this.closeToast.emit();\n    }, 250);\n  }\n\n  /**\n   * Pause the toast's auto-close progress bar and timer.\n   */\n  @Method()\n  async pause() {\n    this.paused = true;\n  }\n\n  /**\n   * Resume the toast's auto-close progress bar and timer if previously paused.\n   */\n  @Method()\n  async resume() {\n    this.paused = false;\n  }\n\n  /**\n   * Returns whether the toast is currently paused (auto-close is paused).\n   */\n  @Method()\n  async isPaused(): Promise<boolean> {\n    return this.paused || this.touched;\n  }\n\n  render() {\n    let progressBarStyle: Record<string, string> = {};\n\n    const progressBarClass = ['toast-progress-bar'];\n\n    progressBarStyle = {\n      animationDuration: `${this.autoCloseDelay}ms`,\n      animationPlayState: this.touched || this.paused ? 'paused' : 'running',\n    };\n\n    progressBarClass.push('toast-progress-bar--animated');\n\n    return (\n      <Host class=\"animate__animated animate__fadeIn\">\n        <div\n          class=\"toast-body\"\n          onPointerLeave={() => {\n            this.touched = false;\n          }}\n          onPointerEnter={() => {\n            this.touched = true;\n          }}\n        >\n          {(this.type || this.icon) && !this.hideIcon ? (\n            <div class=\"toast-icon\">{this.getIcon()}</div>\n          ) : null}\n          <div class=\"toast-content\">\n            {this.toastTitle ? (\n              <ix-typography class=\"toast-title\" format=\"h5\">\n                {this.toastTitle}\n              </ix-typography>\n            ) : null}\n            <div class=\"toast-message\">\n              <slot></slot>\n            </div>\n            <div class=\"toast-action\">\n              <slot name=\"action\"></slot>\n            </div>\n          </div>\n          <div class=\"toast-close\">\n            <ix-icon-button\n              icon={iconClose}\n              iconColor=\"color-soft-text\"\n              size=\"24\"\n              variant=\"tertiary\"\n              onClick={() => this.closeToast.emit()}\n              aria-label={this.ariaLabelCloseIconButton}\n            />\n          </div>\n        </div>\n        {!this.preventAutoClose && (\n          <div\n            class={progressBarClass.join(' ')}\n            style={progressBarStyle}\n            onAnimationEnd={() => {\n              this.close();\n            }}\n            onTransitionEnd={() => {\n              if (this.progress === 0) {\n                this.close();\n              }\n            }}\n          ></div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/cjs/index.cjs.js

@@ -7,7 +7,7 @@ var modal = require('./modal-CsEGB0kd.js');
 var animation = require('./animation-DtTuOXbI.js');
 var typedEvent = require('./typed-event-DxWATHPL.js');
 var rwd_util = require('./rwd.util-GTn-vgCJ.js');
-var themeSwitcher = require('./theme-switcher-76Td30il.js');
+var themeSwitcher = require('./theme-switcher-BCyZa6wG.js');
 var setup = require('./setup-Do7b4BhK.js');
 require('./index-Dyz3z1FD.js');
 require('./index-C8Xo8L1k.js');

package/dist/cjs/index.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs.js","sources":["src/components/category-filter/filter-state.ts","src/components/toast/toast-utils.ts","src/components/utils/modal/loading.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LogicalFilterOperator } from './logical-filter-operator';\nexport class FilterState {\n  public tokens: string[] = [];\n  public categories: {\n    id: string;\n    value: string;\n    operator: LogicalFilterOperator;\n  }[] = [];\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport type { ShowToastResult } from './toast-container.types';\nexport type ToastType = 'info' | 'success' | 'error' | 'warning';\nexport type ToastPosition = 'bottom-right' | 'top-right';\n\nexport interface ToastConfig {\n  /**\n   * Title of the toast\n   */\n  title?: string;\n  /**\n   * Message of the toast\n   */\n  message?: string | HTMLElement;\n  /**\n   * Action element that is displayed below the toast message/title\n   */\n  action?: HTMLElement;\n  /**\n   * Type of the toast\n   */\n  type?: ToastType;\n  /**\n   * Controls whether the toast closes automatically after a delay\n   */\n  autoClose?: boolean;\n  /**\n   * Sets the delay for autoClose in milliseconds\n   */\n  autoCloseDelay?: number;\n  /**\n   * Icon that is displayed with the toast\n   */\n  icon?: string;\n  /**\n   * Color of the icon\n   */\n  iconColor?: string;\n}\n\nexport function getToastContainer() {\n  const containerList = Array.from(\n    document.querySelectorAll('ix-toast-container')\n  );\n  const [container] = containerList;\n  if (containerList.length > 1) {\n    console.warn(\n      'Multiple toast containers were found. Only the first one will be used.'\n    );\n    return container;\n  }\n  if (!container) {\n    const toastContainer = document.createElement('ix-toast-container');\n    document.body.appendChild(toastContainer);\n\n    return toastContainer;\n  }\n  return container;\n}\n\nexport function setToastPosition(position: ToastPosition) {\n  const container = getToastContainer();\n  container.setAttribute('position', position);\n}\n\nfunction toast(config: ToastConfig): Promise<ShowToastResult> {\n  const container = getToastContainer();\n  return container.showToast(config);\n}\n\ntoast.info = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'info',\n  });\n};\n\ntoast.error = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'error',\n  });\n};\n\ntoast.success = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'success',\n  });\n};\n\ntoast.warning = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'warning',\n  });\n};\n\nexport { toast };\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport Animation from '../animation';\nimport { getCoreDelegate } from '../delegate';\n\nexport type ModalLoadingContext = {\n  update: (text: string) => string;\n  finish: (text?: string, timeout?: number) => void;\n};\n\nexport function showModalLoading(message: string) {\n  const modal = document.createElement('ix-modal');\n  modal.disableEscapeClose = true;\n\n  const loading = document.createElement('ix-modal-loading');\n  loading.innerText = message;\n  modal.appendChild(loading);\n\n  getCoreDelegate().attachView(modal);\n  modal.showModal();\n\n  return {\n    update: (text: string) => (loading.innerHTML = text),\n    finish: (text?: string, timeout: number = 250) => {\n      if (text !== undefined) {\n        loading.innerText = text;\n      } else {\n        timeout = 0;\n      }\n      setTimeout(() => {\n        modal.closeModal(null);\n        setTimeout(\n          async () => await getCoreDelegate().removeView(modal),\n          Animation.mediumTime\n        );\n      }, timeout);\n    },\n  };\n}\n"],"names":["modal","getCoreDelegate","Animation"],"mappings":"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"}
+{"version":3,"file":"index.cjs.js","sources":["src/components/category-filter/filter-state.ts","src/components/toast/toast-utils.ts","src/components/utils/modal/loading.ts"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LogicalFilterOperator } from './logical-filter-operator';\nexport class FilterState {\n  public tokens: string[] = [];\n  public categories: {\n    id: string;\n    value: string;\n    operator: LogicalFilterOperator;\n  }[] = [];\n}\n","/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\nimport type { ShowToastResult } from './toast-container.types';\nexport type ToastType = 'info' | 'success' | 'error' | 'warning';\nexport type ToastPosition = 'bottom-right' | 'top-right';\n\nexport interface ToastConfig {\n  /**\n   * Title of the toast\n   */\n  title?: string;\n  /**\n   * Message of the toast\n   */\n  message?: string | HTMLElement;\n  /**\n   * Action element that is displayed below the toast message/title\n   */\n  action?: HTMLElement;\n  /**\n   * Type of the toast\n   */\n  type?: ToastType;\n  /**\n   * Controls whether the toast closes automatically after a delay\n   */\n  autoClose?: boolean;\n  /**\n   * Sets the delay for autoClose in milliseconds\n   */\n  autoCloseDelay?: number;\n  /**\n   * Icon that is displayed with the toast\n   */\n  icon?: string;\n  /**\n   * Color of the icon\n   */\n  iconColor?: string;\n  /**\n   * Allows to hide the icon in the toast\n   */\n  hideIcon?: boolean;\n}\n\nexport function getToastContainer() {\n  const containerList = Array.from(\n    document.querySelectorAll('ix-toast-container')\n  );\n  const [container] = containerList;\n  if (containerList.length > 1) {\n    console.warn(\n      'Multiple toast containers were found. Only the first one will be used.'\n    );\n    return container;\n  }\n  if (!container) {\n    const toastContainer = document.createElement('ix-toast-container');\n    document.body.appendChild(toastContainer);\n\n    return toastContainer;\n  }\n  return container;\n}\n\nexport function setToastPosition(position: ToastPosition) {\n  const container = getToastContainer();\n  container.setAttribute('position', position);\n}\n\nfunction toast(config: ToastConfig): Promise<ShowToastResult> {\n  const container = getToastContainer();\n  return container.showToast(config);\n}\n\ntoast.info = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'info',\n  });\n};\n\ntoast.error = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'error',\n  });\n};\n\ntoast.success = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'success',\n  });\n};\n\ntoast.warning = (config: ToastConfig) => {\n  return toast({\n    ...config,\n    type: 'warning',\n  });\n};\n\nexport { toast };\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport Animation from '../animation';\nimport { getCoreDelegate } from '../delegate';\n\nexport type ModalLoadingContext = {\n  update: (text: string) => string;\n  finish: (text?: string, timeout?: number) => void;\n};\n\nexport function showModalLoading(message: string) {\n  const modal = document.createElement('ix-modal');\n  modal.disableEscapeClose = true;\n\n  const loading = document.createElement('ix-modal-loading');\n  loading.innerText = message;\n  modal.appendChild(loading);\n\n  getCoreDelegate().attachView(modal);\n  modal.showModal();\n\n  return {\n    update: (text: string) => (loading.innerHTML = text),\n    finish: (text?: string, timeout: number = 250) => {\n      if (text !== undefined) {\n        loading.innerText = text;\n      } else {\n        timeout = 0;\n      }\n      setTimeout(() => {\n        modal.closeModal(null);\n        setTimeout(\n          async () => await getCoreDelegate().removeView(modal),\n          Animation.mediumTime\n        );\n      }, timeout);\n    },\n  };\n}\n"],"names":["modal","getCoreDelegate","Animation"],"mappings":"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"}

package/dist/cjs/ix-action-card.cjs.entry.js

@@ -20,6 +20,10 @@ const IxActionCard = class {
          * Card selection
          */
         this.selected = false;
+        /**
+         * If true, disables hover and active styles and changes cursor to default
+         */
+        this.passive = false;
     }
     getSubheadingTextColor() {
         return this.variant === 'outline' || this.variant === 'filled'
@@ -30,7 +34,7 @@ const IxActionCard = class {
         const ariaLabelledBy = !this.ariaLabelCard && this.heading
             ? 'ix-action-card-heading'
             : undefined;
-        return (index.h(index.Host, { key: '167db61afb0880052edd6e28ec9e907dbe98a186' }, index.h("ix-card", { key: 'e8014c544dbadee66135b8def9b868488a07773b', selected: this.selected, variant: this.variant, class: 'pointer', "aria-label": this.ariaLabelCard, "aria-labelledby": ariaLabelledBy, role: ariaLabelledBy ? 'group' : undefined }, index.h("ix-card-content", { key: 'bcb177b0fbe2a709d3ab9d8479077eb64ef2496a' }, this.icon ? (index.h("ix-icon", { class: 'icon', name: this.icon, size: "32", "aria-label": this.ariaLabelIcon || a11y.getFallbackLabelFromIconName(this.icon) })) : null, index.h("div", { key: '65aa3882ad626df59598626bf7a67e1431fcf6e4' }, this.heading ? (index.h("ix-typography", { id: "ix-action-card-heading", "aria-hidden": a11y.a11yBoolean(!ariaLabelledBy), format: "h4" }, this.heading)) : null, this.subheading ? (index.h("ix-typography", { format: "h5", "text-color": this.getSubheadingTextColor() }, this.subheading)) : null, index.h("slot", { key: '9ffacb3ea7d9642a2adbad41d9e6fc36a8e5118b' }))))));
+        return (index.h(index.Host, { key: '600ad1913e671fb47ec9da8f66e984bbde498fae' }, index.h("ix-card", { key: '1a8168a17a643908126f841e9cdd6d0055a62399', selected: this.selected, variant: this.variant, passive: this.passive, class: 'pointer', "aria-label": this.ariaLabelCard, "aria-labelledby": ariaLabelledBy, role: ariaLabelledBy ? 'group' : undefined }, index.h("ix-card-content", { key: 'c138b94b131af478fee65244f32b91cdf78b31df' }, this.icon ? (index.h("ix-icon", { class: 'icon', name: this.icon, size: "32", "aria-label": this.ariaLabelIcon || a11y.getFallbackLabelFromIconName(this.icon) })) : null, index.h("div", { key: 'eb0252c628c75709fddae387a3b4a7abbf7c3df0' }, this.heading ? (index.h("ix-typography", { id: "ix-action-card-heading", "aria-hidden": a11y.a11yBoolean(!ariaLabelledBy), format: "h4" }, this.heading)) : null, this.subheading ? (index.h("ix-typography", { format: "h5", "text-color": this.getSubheadingTextColor() }, this.subheading)) : null, index.h("slot", { key: 'f47fd515fc5b8f22344dc83b808e527116238618' }))))));
     }
 };
 IxActionCard.style = actionCardCss;

package/dist/cjs/ix-action-card.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ix-action-card.entry.cjs.js","sources":["src/components/action-card/action-card.scss?tag=ix-action-card&encapsulation=shadow","src/components/action-card/action-card.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use 'mixins/shadow-dom/component';\n\n:host {\n  display: block;\n  position: relative;\n  min-width: 13.375rem;\n  width: 13.375rem;\n  height: 7.5rem;\n  min-height: 7.5rem;\n  cursor: pointer;\n\n  margin: 0.25rem 0;\n\n  @include component.ix-component;\n\n  ix-card {\n    width: 100%;\n    height: 100%;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\nimport type { ActionCardVariant } from './action-card.types';\nimport { a11yBoolean, getFallbackLabelFromIconName } from '../utils/a11y';\n\n@Component({\n  tag: 'ix-action-card',\n  styleUrl: 'action-card.scss',\n  shadow: true,\n})\nexport class IxActionCard {\n  /**\n   * Card variant\n   */\n  @Prop() variant: ActionCardVariant = 'outline';\n\n  /**\n   * Card icon\n   */\n  @Prop() icon: string | undefined = undefined;\n\n  /**\n   * ARIA label for the icon\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelIcon?: string;\n\n  /**\n   * Card heading\n   */\n  @Prop() heading?: string;\n\n  /**\n   * Card subheading\n   */\n  @Prop() subheading?: string;\n\n  /**\n   * Card selection\n   */\n  @Prop() selected = false;\n\n  /**\n   * ARIA label for the card\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelCard?: string;\n\n  private getSubheadingTextColor() {\n    return this.variant === 'outline' || this.variant === 'filled'\n      ? 'soft'\n      : undefined;\n  }\n\n  render() {\n    const ariaLabelledBy =\n      !this.ariaLabelCard && this.heading\n        ? 'ix-action-card-heading'\n        : undefined;\n\n    return (\n      <Host>\n        <ix-card\n          selected={this.selected}\n          variant={this.variant}\n          class={'pointer'}\n          aria-label={this.ariaLabelCard}\n          aria-labelledby={ariaLabelledBy}\n          role={ariaLabelledBy ? 'group' : undefined}\n        >\n          <ix-card-content>\n            {this.icon ? (\n              <ix-icon\n                class={'icon'}\n                name={this.icon}\n                size=\"32\"\n                aria-label={\n                  this.ariaLabelIcon || getFallbackLabelFromIconName(this.icon)\n                }\n              ></ix-icon>\n            ) : null}\n            <div>\n              {this.heading ? (\n                <ix-typography\n                  id=\"ix-action-card-heading\"\n                  aria-hidden={a11yBoolean(!ariaLabelledBy)}\n                  format=\"h4\"\n                >\n                  {this.heading}\n                </ix-typography>\n              ) : null}\n              {this.subheading ? (\n                <ix-typography\n                  format=\"h5\"\n                  text-color={this.getSubheadingTextColor()}\n                >\n                  {this.subheading}\n                </ix-typography>\n              ) : null}\n              <slot></slot>\n            </div>\n          </ix-card-content>\n        </ix-card>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host","getFallbackLabelFromIconName","a11yBoolean"],"mappings":";;;;;AAAA,MAAM,aAAa,GAAG,q8BAAq8B;;MCkB98B,YAAY,GAAA,MAAA;AALzB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAsB,SAAS;AAE9C;;AAEG;AACK,QAAA,IAAI,CAAA,IAAA,GAAuB,SAAS;AAmB5C;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAmEzB;IA1DS,sBAAsB,GAAA;QAC5B,OAAO,IAAI,CAAC,OAAO,KAAK,SAAS,IAAI,IAAI,CAAC,OAAO,KAAK;AACpD,cAAE;cACA,SAAS;;IAGf,MAAM,GAAA;QACJ,MAAM,cAAc,GAClB,CAAC,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC;AAC1B,cAAE;cACA,SAAS;QAEf,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAE,SAAS,EAAA,YAAA,EACJ,IAAI,CAAC,aAAa,EAAA,iBAAA,EACb,cAAc,EAC/B,IAAI,EAAE,cAAc,GAAG,OAAO,GAAG,SAAS,EAAA,EAE1CA,OAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,IAAI,IACRA,OACE,CAAA,SAAA,EAAA,EAAA,KAAK,EAAE,MAAM,EACb,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAC,IAAI,gBAEP,IAAI,CAAC,aAAa,IAAIE,iCAA4B,CAAC,IAAI,CAAC,IAAI,CAAC,EAEtD,CAAA,IACT,IAAI,EACRF,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,OAAO,IACXA,OACE,CAAA,eAAA,EAAA,EAAA,EAAE,EAAC,wBAAwB,EACd,aAAA,EAAAG,gBAAW,CAAC,CAAC,cAAc,CAAC,EACzC,MAAM,EAAC,IAAI,EAEV,EAAA,IAAI,CAAC,OAAO,CACC,IACd,IAAI,EACP,IAAI,CAAC,UAAU,IACdH,OACE,CAAA,eAAA,EAAA,EAAA,MAAM,EAAC,IAAI,EACC,YAAA,EAAA,IAAI,CAAC,sBAAsB,EAAE,EAExC,EAAA,IAAI,CAAC,UAAU,CACF,IACd,IAAI,EACRA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACU,CACV,CACL;;;;;;;"}
+{"version":3,"file":"ix-action-card.entry.cjs.js","sources":["src/components/action-card/action-card.scss?tag=ix-action-card&encapsulation=shadow","src/components/action-card/action-card.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use 'mixins/shadow-dom/component';\n\n:host {\n  display: block;\n  position: relative;\n  min-width: 13.375rem;\n  width: 13.375rem;\n  height: 7.5rem;\n  min-height: 7.5rem;\n  cursor: pointer;\n\n  margin: 0.25rem 0;\n\n  @include component.ix-component;\n\n  ix-card {\n    width: 100%;\n    height: 100%;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, h, Host, Prop } from '@stencil/core';\nimport type { ActionCardVariant } from './action-card.types';\nimport { a11yBoolean, getFallbackLabelFromIconName } from '../utils/a11y';\n\n@Component({\n  tag: 'ix-action-card',\n  styleUrl: 'action-card.scss',\n  shadow: true,\n})\nexport class IxActionCard {\n  /**\n   * Card variant\n   */\n  @Prop() variant: ActionCardVariant = 'outline';\n\n  /**\n   * Card icon\n   */\n  @Prop() icon: string | undefined = undefined;\n\n  /**\n   * ARIA label for the icon\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelIcon?: string;\n\n  /**\n   * Card heading\n   */\n  @Prop() heading?: string;\n\n  /**\n   * Card subheading\n   */\n  @Prop() subheading?: string;\n\n  /**\n   * Card selection\n   */\n  @Prop() selected = false;\n\n  /**\n   * ARIA label for the card\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelCard?: string;\n\n  /**\n   * If true, disables hover and active styles and changes cursor to default\n   */\n  @Prop() passive: boolean = false;\n\n  private getSubheadingTextColor() {\n    return this.variant === 'outline' || this.variant === 'filled'\n      ? 'soft'\n      : undefined;\n  }\n\n  render() {\n    const ariaLabelledBy =\n      !this.ariaLabelCard && this.heading\n        ? 'ix-action-card-heading'\n        : undefined;\n\n    return (\n      <Host>\n        <ix-card\n          selected={this.selected}\n          variant={this.variant}\n          passive={this.passive}\n          class={'pointer'}\n          aria-label={this.ariaLabelCard}\n          aria-labelledby={ariaLabelledBy}\n          role={ariaLabelledBy ? 'group' : undefined}\n        >\n          <ix-card-content>\n            {this.icon ? (\n              <ix-icon\n                class={'icon'}\n                name={this.icon}\n                size=\"32\"\n                aria-label={\n                  this.ariaLabelIcon || getFallbackLabelFromIconName(this.icon)\n                }\n              ></ix-icon>\n            ) : null}\n            <div>\n              {this.heading ? (\n                <ix-typography\n                  id=\"ix-action-card-heading\"\n                  aria-hidden={a11yBoolean(!ariaLabelledBy)}\n                  format=\"h4\"\n                >\n                  {this.heading}\n                </ix-typography>\n              ) : null}\n              {this.subheading ? (\n                <ix-typography\n                  format=\"h5\"\n                  text-color={this.getSubheadingTextColor()}\n                >\n                  {this.subheading}\n                </ix-typography>\n              ) : null}\n              <slot></slot>\n            </div>\n          </ix-card-content>\n        </ix-card>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host","getFallbackLabelFromIconName","a11yBoolean"],"mappings":";;;;;AAAA,MAAM,aAAa,GAAG,q8BAAq8B;;MCkB98B,YAAY,GAAA,MAAA;AALzB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAsB,SAAS;AAE9C;;AAEG;AACK,QAAA,IAAI,CAAA,IAAA,GAAuB,SAAS;AAmB5C;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AASxB;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;AA6DjC;IA3DS,sBAAsB,GAAA;QAC5B,OAAO,IAAI,CAAC,OAAO,KAAK,SAAS,IAAI,IAAI,CAAC,OAAO,KAAK;AACpD,cAAE;cACA,SAAS;;IAGf,MAAM,GAAA;QACJ,MAAM,cAAc,GAClB,CAAC,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC;AAC1B,cAAE;cACA,SAAS;QAEf,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAA,CAAA,SAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAE,SAAS,gBACJ,IAAI,CAAC,aAAa,EAAA,iBAAA,EACb,cAAc,EAC/B,IAAI,EAAE,cAAc,GAAG,OAAO,GAAG,SAAS,EAAA,EAE1CA,OAAA,CAAA,iBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,IAAI,IACRA,OACE,CAAA,SAAA,EAAA,EAAA,KAAK,EAAE,MAAM,EACb,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAC,IAAI,gBAEP,IAAI,CAAC,aAAa,IAAIE,iCAA4B,CAAC,IAAI,CAAC,IAAI,CAAC,EAEtD,CAAA,IACT,IAAI,EACRF,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,OAAO,IACXA,OACE,CAAA,eAAA,EAAA,EAAA,EAAE,EAAC,wBAAwB,EACd,aAAA,EAAAG,gBAAW,CAAC,CAAC,cAAc,CAAC,EACzC,MAAM,EAAC,IAAI,EAEV,EAAA,IAAI,CAAC,OAAO,CACC,IACd,IAAI,EACP,IAAI,CAAC,UAAU,IACdH,OACE,CAAA,eAAA,EAAA,EAAA,MAAM,EAAC,IAAI,EACC,YAAA,EAAA,IAAI,CAAC,sBAAsB,EAAE,EAExC,EAAA,IAAI,CAAC,UAAU,CACF,IACd,IAAI,EACRA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,CACU,CACV,CACL;;;;;;;"}

package/dist/cjs/ix-application.cjs.entry.js

@@ -5,7 +5,7 @@ var context = require('./context-CmNuiaNz.js');
 var service = require('./service-DuiJmf7R.js');
 var menuService = require('./menu-service-CW0vT80Q.js');
 var shadowDom = require('./shadow-dom-DT01VwcB.js');
-var themeSwitcher = require('./theme-switcher-76Td30il.js');
+var themeSwitcher = require('./theme-switcher-BCyZa6wG.js');
 require('./typed-event-DxWATHPL.js');
 require('./breakpoints-C5ZrUCbZ.js');
 

package/dist/cjs/ix-card.ix-card-content.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ix-card.ix-card-content.entry.cjs.js","sources":["src/components/card/card.scss?tag=ix-card&encapsulation=shadow","src/components/card/card.tsx","src/components/card-content/card-content.scss?tag=ix-card-content&encapsulation=shadow","src/components/card-content/card-content.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use 'mixins/shadow-dom/component';\n@use './card-vars' as card-vars;\n\n:host {\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  align-items: flex-start;\n  align-self: flex-start;\n  overflow: hidden;\n  cursor: pointer;\n\n  width: 20rem;\n\n  border: var(--theme-card--border-width) solid\n    var(--ix-card-border-color, var(--theme-color-soft-bdr));\n  border-radius: var(--theme-card--border-radius);\n\n  @include component.ix-component;\n\n  .card-content {\n    display: block;\n    position: relative;\n    flex-shrink: 0;\n    flex-grow: 1;\n    width: 100%;\n    height: calc(100% - 2rem);\n    background-color: var(--ix-card-background, transparent);\n    border-top-left-radius: var(--theme-card--border-radius);\n    border-top-right-radius: var(--theme-card--border-radius);\n    overflow: hidden;\n  }\n\n  .card-content-wrapper {\n    height: 100%;\n    width: 100%;\n    box-sizing: border-box;\n  }\n\n  .card-footer {\n    display: flex;\n    position: relative;\n    width: 100%;\n  }\n}\n\n@mixin accordionChevronColorPrimary {\n  ::slotted(ix-card-accordion) {\n    color: var(--theme-color-std-text);\n  }\n}\n\n@mixin card-variants($variant) {\n  :host(.card-#{$variant}) {\n    --ix-card-background: var(--theme-card-#{$variant}--background);\n    --ix-card-border-color: var(--theme-card-#{$variant}--border-color);\n\n    color: var(--theme-card-#{$variant}--color);\n\n    @if $variant == outline {\n      @include accordionChevronColorPrimary;\n    }\n\n    @if $variant == filled {\n      @include accordionChevronColorPrimary;\n    }\n  }\n}\n\n@each $variant in card-vars.$ix-card-variants {\n  @include card-variants($variant);\n}\n\n:host(:not(.card-insight, .card-outline)) {\n  --ix-card-border-color: transparent;\n}\n\n@mixin card-variants-active($variant) {\n  :host(.card-#{$variant}:active) {\n    --ix-card-border-color: var(--theme-card-#{$variant}--border-color--active);\n    --ix-card-background: var(--theme-card-#{$variant}--background--active);\n  }\n}\n\n@mixin card-variants-hover($variant) {\n  :host(.card-#{$variant}:hover) {\n    --ix-card-border-color: var(--theme-card-#{$variant}--border-color--hover);\n    --ix-card-background: var(--theme-card-#{$variant}--background--hover);\n  }\n}\n\n@mixin card-variants-selected($variant) {\n  :host(.selected.card-#{$variant}) {\n    --ix-card-border-color: var(\n      --theme-card-#{$variant}--border-color--selected\n    );\n    --ix-card-background: var(--theme-card-#{$variant}--background--selected);\n  }\n}\n\n@each $variant in card-vars.$ix-card-variants {\n  @include card-variants-hover($variant);\n  @include card-variants-active($variant);\n  @include card-variants-selected($variant);\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\nimport type { CardVariant } from './card.types';\n\n@Component({\n  tag: 'ix-card',\n  styleUrl: 'card.scss',\n  shadow: true,\n})\nexport class Card {\n  @Element() hostElement!: HTMLIxCardElement;\n\n  /**\n   * Card variant\n   */\n  @Prop() variant: CardVariant = 'outline';\n\n  /**\n   * Show card in selected state\n   */\n  @Prop() selected: boolean = false;\n\n  render() {\n    return (\n      <Host\n        class={{\n          selected: this.selected,\n          [`card-${this.variant}`]: true,\n        }}\n      >\n        <div class=\"card-content\">\n          <slot></slot>\n        </div>\n        <div class=\"card-footer\">\n          <slot name=\"card-accordion\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use 'mixins/shadow-dom/component';\n\n:host {\n  display: flex;\n  padding: 1rem;\n  height: 100%;\n  overflow: hidden;\n\n  @include component.ix-component;\n\n  .content-wrapper {\n    box-sizing: border-box;\n    height: 100%;\n    width: 100%;\n    overflow: hidden;\n    gap: 0.5rem;\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n  }\n}\n","import { Component, h, Host } from '@stencil/core';\n\n@Component({\n  tag: 'ix-card-content',\n  styleUrl: 'card-content.scss',\n  shadow: true,\n})\nexport class CardContent {\n  render() {\n    return (\n      <Host>\n        <div class=\"content-wrapper\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,OAAO,GAAG,8vPAA8vP;;MCQjwP,IAAI,GAAA,MAAA;AALjB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAQE;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAgB,SAAS;AAExC;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAmBlC;IAjBC,MAAM,GAAA;QACJ,QACEA,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACvB,gBAAA,CAAC,QAAQ,IAAI,CAAC,OAAO,CAAE,CAAA,GAAG,IAAI;aAC/B,EAAA,EAEDD,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EACvBA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,EACNA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,EAAA,EACtBA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,gBAAgB,GAAQ,CAC/B,CACD;;;;;;ACnCb,MAAM,cAAc,GAAG,2+BAA2+B;;MCOr/B,WAAW,GAAA,MAAA;;;;IACtB,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1BA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;;"}
+{"version":3,"file":"ix-card.ix-card-content.entry.cjs.js","sources":["src/components/card/card.scss?tag=ix-card&encapsulation=shadow","src/components/card/card.tsx","src/components/card-content/card-content.scss?tag=ix-card-content&encapsulation=shadow","src/components/card-content/card-content.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2024 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use 'mixins/shadow-dom/component';\n@use './card-vars' as card-vars;\n\n:host {\n  display: flex;\n  position: relative;\n  flex-direction: column;\n  align-items: flex-start;\n  align-self: flex-start;\n  overflow: hidden;\n  cursor: pointer;\n\n  width: 20rem;\n\n  border: var(--theme-card--border-width) solid\n    var(--ix-card-border-color, var(--theme-color-soft-bdr));\n  border-radius: var(--theme-card--border-radius);\n\n  @include component.ix-component;\n\n  .card-content {\n    display: block;\n    position: relative;\n    flex-shrink: 0;\n    flex-grow: 1;\n    width: 100%;\n    height: calc(100% - 2rem);\n    background-color: var(--ix-card-background, transparent);\n    border-top-left-radius: var(--theme-card--border-radius);\n    border-top-right-radius: var(--theme-card--border-radius);\n    overflow: hidden;\n  }\n\n  .card-content-wrapper {\n    height: 100%;\n    width: 100%;\n    box-sizing: border-box;\n  }\n\n  .card-footer {\n    display: flex;\n    position: relative;\n    width: 100%;\n  }\n}\n\n@mixin accordionChevronColorPrimary {\n  ::slotted(ix-card-accordion) {\n    color: var(--theme-color-std-text);\n  }\n}\n\n@mixin card-variants($variant) {\n  :host(.card-#{$variant}) {\n    --ix-card-background: var(--theme-card-#{$variant}--background);\n    --ix-card-border-color: var(--theme-card-#{$variant}--border-color);\n\n    color: var(--theme-card-#{$variant}--color);\n\n    @if $variant == outline {\n      @include accordionChevronColorPrimary;\n    }\n\n    @if $variant == filled {\n      @include accordionChevronColorPrimary;\n    }\n  }\n}\n\n@each $variant in card-vars.$ix-card-variants {\n  @include card-variants($variant);\n}\n\n:host(:not(.card-insight, .card-outline)) {\n  --ix-card-border-color: transparent;\n}\n\n@mixin card-variants-active($variant) {\n  :host(.card-#{$variant}:active) {\n    --ix-card-border-color: var(--theme-card-#{$variant}--border-color--active);\n    --ix-card-background: var(--theme-card-#{$variant}--background--active);\n  }\n}\n\n@mixin card-variants-hover($variant) {\n  :host(.card-#{$variant}:hover) {\n    --ix-card-border-color: var(--theme-card-#{$variant}--border-color--hover);\n    --ix-card-background: var(--theme-card-#{$variant}--background--hover);\n  }\n}\n\n@mixin card-variants-selected($variant) {\n  :host(.selected.card-#{$variant}) {\n    --ix-card-border-color: var(\n      --theme-card-#{$variant}--border-color--selected\n    );\n    --ix-card-background: var(--theme-card-#{$variant}--background--selected);\n  }\n}\n\n@each $variant in card-vars.$ix-card-variants {\n  @include card-variants-hover($variant);\n  @include card-variants-active($variant);\n  @include card-variants-selected($variant);\n}\n\n:host(.passive) {\n  cursor: default;\n}\n\n@each $variant in card-vars.$ix-card-variants {\n  :host(.passive.card-#{$variant}) {\n    --ix-card-background: var(--theme-card-#{$variant}--background);\n    --ix-card-border-color: var(--theme-card-#{$variant}--border-color);\n  }\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\nimport type { CardVariant } from './card.types';\n\n@Component({\n  tag: 'ix-card',\n  styleUrl: 'card.scss',\n  shadow: true,\n})\nexport class Card {\n  @Element() hostElement!: HTMLIxCardElement;\n\n  /**\n   * Card variant\n   */\n  @Prop() variant: CardVariant = 'outline';\n\n  /**\n   * Show card in selected state\n   */\n  @Prop() selected: boolean = false;\n\n  /**\n   * If true, disables hover and active styles and changes cursor to default\n   */\n  @Prop() passive: boolean = false;\n\n  render() {\n    return (\n      <Host\n        class={{\n          selected: this.selected,\n          [`card-${this.variant}`]: true,\n          passive: this.passive,\n        }}\n      >\n        <div class=\"card-content\">\n          <slot></slot>\n        </div>\n        <div class=\"card-footer\">\n          <slot name=\"card-accordion\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use 'mixins/shadow-dom/component';\n\n:host {\n  display: flex;\n  padding: 1rem;\n  height: 100%;\n  overflow: hidden;\n\n  @include component.ix-component;\n\n  .content-wrapper {\n    box-sizing: border-box;\n    height: 100%;\n    width: 100%;\n    overflow: hidden;\n    gap: 0.5rem;\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n  }\n}\n","import { Component, h, Host } from '@stencil/core';\n\n@Component({\n  tag: 'ix-card-content',\n  styleUrl: 'card-content.scss',\n  shadow: true,\n})\nexport class CardContent {\n  render() {\n    return (\n      <Host>\n        <div class=\"content-wrapper\">\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host"],"mappings":";;;;AAAA,MAAM,OAAO,GAAG,6lSAA6lS;;MCQhmS,IAAI,GAAA,MAAA;AALjB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAQE;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAgB,SAAS;AAExC;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAY,KAAK;AAEjC;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAY,KAAK;AAoBjC;IAlBC,MAAM,GAAA;QACJ,QACEA,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;AACvB,gBAAA,CAAC,QAAQ,IAAI,CAAC,OAAO,CAAE,CAAA,GAAG,IAAI;gBAC9B,OAAO,EAAE,IAAI,CAAC,OAAO;aACtB,EAAA,EAEDD,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EACvBA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,EACNA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,EAAA,EACtBA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,IAAI,EAAC,gBAAgB,GAAQ,CAC/B,CACD;;;;;;ACzCb,MAAM,cAAc,GAAG,2+BAA2+B;;MCOr/B,WAAW,GAAA,MAAA;;;;IACtB,MAAM,GAAA;AACJ,QAAA,QACEA,QAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACHD,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,iBAAiB,EAAA,EAC1BA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;;"}

package/dist/cjs/ix-card_2.cjs.entry.js

@@ -2,7 +2,7 @@
 
 var index = require('./index-C8Xo8L1k.js');
 
-const cardCss = ":host{display:flex;position:relative;flex-direction:column;align-items:flex-start;align-self:flex-start;overflow:hidden;cursor:pointer;width:20rem;border:var(--theme-card--border-width) solid var(--ix-card-border-color, var(--theme-color-soft-bdr));border-radius:var(--theme-card--border-radius)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .card-content{display:block;position:relative;flex-shrink:0;flex-grow:1;width:100%;height:calc(100% - 2rem);background-color:var(--ix-card-background, transparent);border-top-left-radius:var(--theme-card--border-radius);border-top-right-radius:var(--theme-card--border-radius);overflow:hidden}:host .card-content-wrapper{height:100%;width:100%;box-sizing:border-box}:host .card-footer{display:flex;position:relative;width:100%}:host(.card-outline){--ix-card-background:var(--theme-card-outline--background);--ix-card-border-color:var(--theme-card-outline--border-color);color:var(--theme-card-outline--color)}:host(.card-outline) ::slotted(ix-card-accordion){color:var(--theme-color-std-text)}:host(.card-filled){--ix-card-background:var(--theme-card-filled--background);--ix-card-border-color:var(--theme-card-filled--border-color);color:var(--theme-card-filled--color)}:host(.card-filled) ::slotted(ix-card-accordion){color:var(--theme-color-std-text)}:host(.card-alarm){--ix-card-background:var(--theme-card-alarm--background);--ix-card-border-color:var(--theme-card-alarm--border-color);color:var(--theme-card-alarm--color)}:host(.card-critical){--ix-card-background:var(--theme-card-critical--background);--ix-card-border-color:var(--theme-card-critical--border-color);color:var(--theme-card-critical--color)}:host(.card-warning){--ix-card-background:var(--theme-card-warning--background);--ix-card-border-color:var(--theme-card-warning--border-color);color:var(--theme-card-warning--color)}:host(.card-success){--ix-card-background:var(--theme-card-success--background);--ix-card-border-color:var(--theme-card-success--border-color);color:var(--theme-card-success--color)}:host(.card-info){--ix-card-background:var(--theme-card-info--background);--ix-card-border-color:var(--theme-card-info--border-color);color:var(--theme-card-info--color)}:host(.card-neutral){--ix-card-background:var(--theme-card-neutral--background);--ix-card-border-color:var(--theme-card-neutral--border-color);color:var(--theme-card-neutral--color)}:host(.card-primary){--ix-card-background:var(--theme-card-primary--background);--ix-card-border-color:var(--theme-card-primary--border-color);color:var(--theme-card-primary--color)}:host(:not(.card-insight,.card-outline)){--ix-card-border-color:transparent}:host(.card-outline:hover){--ix-card-border-color:var(--theme-card-outline--border-color--hover);--ix-card-background:var(--theme-card-outline--background--hover)}:host(.card-outline:active){--ix-card-border-color:var(--theme-card-outline--border-color--active);--ix-card-background:var(--theme-card-outline--background--active)}:host(.selected.card-outline){--ix-card-border-color:var(\n    --theme-card-outline--border-color--selected\n  );--ix-card-background:var(--theme-card-outline--background--selected)}:host(.card-filled:hover){--ix-card-border-color:var(--theme-card-filled--border-color--hover);--ix-card-background:var(--theme-card-filled--background--hover)}:host(.card-filled:active){--ix-card-border-color:var(--theme-card-filled--border-color--active);--ix-card-background:var(--theme-card-filled--background--active)}:host(.selected.card-filled){--ix-card-border-color:var(\n    --theme-card-filled--border-color--selected\n  );--ix-card-background:var(--theme-card-filled--background--selected)}:host(.card-alarm:hover){--ix-card-border-color:var(--theme-card-alarm--border-color--hover);--ix-card-background:var(--theme-card-alarm--background--hover)}:host(.card-alarm:active){--ix-card-border-color:var(--theme-card-alarm--border-color--active);--ix-card-background:var(--theme-card-alarm--background--active)}:host(.selected.card-alarm){--ix-card-border-color:var(\n    --theme-card-alarm--border-color--selected\n  );--ix-card-background:var(--theme-card-alarm--background--selected)}:host(.card-critical:hover){--ix-card-border-color:var(--theme-card-critical--border-color--hover);--ix-card-background:var(--theme-card-critical--background--hover)}:host(.card-critical:active){--ix-card-border-color:var(--theme-card-critical--border-color--active);--ix-card-background:var(--theme-card-critical--background--active)}:host(.selected.card-critical){--ix-card-border-color:var(\n    --theme-card-critical--border-color--selected\n  );--ix-card-background:var(--theme-card-critical--background--selected)}:host(.card-warning:hover){--ix-card-border-color:var(--theme-card-warning--border-color--hover);--ix-card-background:var(--theme-card-warning--background--hover)}:host(.card-warning:active){--ix-card-border-color:var(--theme-card-warning--border-color--active);--ix-card-background:var(--theme-card-warning--background--active)}:host(.selected.card-warning){--ix-card-border-color:var(\n    --theme-card-warning--border-color--selected\n  );--ix-card-background:var(--theme-card-warning--background--selected)}:host(.card-success:hover){--ix-card-border-color:var(--theme-card-success--border-color--hover);--ix-card-background:var(--theme-card-success--background--hover)}:host(.card-success:active){--ix-card-border-color:var(--theme-card-success--border-color--active);--ix-card-background:var(--theme-card-success--background--active)}:host(.selected.card-success){--ix-card-border-color:var(\n    --theme-card-success--border-color--selected\n  );--ix-card-background:var(--theme-card-success--background--selected)}:host(.card-info:hover){--ix-card-border-color:var(--theme-card-info--border-color--hover);--ix-card-background:var(--theme-card-info--background--hover)}:host(.card-info:active){--ix-card-border-color:var(--theme-card-info--border-color--active);--ix-card-background:var(--theme-card-info--background--active)}:host(.selected.card-info){--ix-card-border-color:var(\n    --theme-card-info--border-color--selected\n  );--ix-card-background:var(--theme-card-info--background--selected)}:host(.card-neutral:hover){--ix-card-border-color:var(--theme-card-neutral--border-color--hover);--ix-card-background:var(--theme-card-neutral--background--hover)}:host(.card-neutral:active){--ix-card-border-color:var(--theme-card-neutral--border-color--active);--ix-card-background:var(--theme-card-neutral--background--active)}:host(.selected.card-neutral){--ix-card-border-color:var(\n    --theme-card-neutral--border-color--selected\n  );--ix-card-background:var(--theme-card-neutral--background--selected)}:host(.card-primary:hover){--ix-card-border-color:var(--theme-card-primary--border-color--hover);--ix-card-background:var(--theme-card-primary--background--hover)}:host(.card-primary:active){--ix-card-border-color:var(--theme-card-primary--border-color--active);--ix-card-background:var(--theme-card-primary--background--active)}:host(.selected.card-primary){--ix-card-border-color:var(\n    --theme-card-primary--border-color--selected\n  );--ix-card-background:var(--theme-card-primary--background--selected)}";
+const cardCss = ":host{display:flex;position:relative;flex-direction:column;align-items:flex-start;align-self:flex-start;overflow:hidden;cursor:pointer;width:20rem;border:var(--theme-card--border-width) solid var(--ix-card-border-color, var(--theme-color-soft-bdr));border-radius:var(--theme-card--border-radius)}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .card-content{display:block;position:relative;flex-shrink:0;flex-grow:1;width:100%;height:calc(100% - 2rem);background-color:var(--ix-card-background, transparent);border-top-left-radius:var(--theme-card--border-radius);border-top-right-radius:var(--theme-card--border-radius);overflow:hidden}:host .card-content-wrapper{height:100%;width:100%;box-sizing:border-box}:host .card-footer{display:flex;position:relative;width:100%}:host(.card-outline){--ix-card-background:var(--theme-card-outline--background);--ix-card-border-color:var(--theme-card-outline--border-color);color:var(--theme-card-outline--color)}:host(.card-outline) ::slotted(ix-card-accordion){color:var(--theme-color-std-text)}:host(.card-filled){--ix-card-background:var(--theme-card-filled--background);--ix-card-border-color:var(--theme-card-filled--border-color);color:var(--theme-card-filled--color)}:host(.card-filled) ::slotted(ix-card-accordion){color:var(--theme-color-std-text)}:host(.card-alarm){--ix-card-background:var(--theme-card-alarm--background);--ix-card-border-color:var(--theme-card-alarm--border-color);color:var(--theme-card-alarm--color)}:host(.card-critical){--ix-card-background:var(--theme-card-critical--background);--ix-card-border-color:var(--theme-card-critical--border-color);color:var(--theme-card-critical--color)}:host(.card-warning){--ix-card-background:var(--theme-card-warning--background);--ix-card-border-color:var(--theme-card-warning--border-color);color:var(--theme-card-warning--color)}:host(.card-success){--ix-card-background:var(--theme-card-success--background);--ix-card-border-color:var(--theme-card-success--border-color);color:var(--theme-card-success--color)}:host(.card-info){--ix-card-background:var(--theme-card-info--background);--ix-card-border-color:var(--theme-card-info--border-color);color:var(--theme-card-info--color)}:host(.card-neutral){--ix-card-background:var(--theme-card-neutral--background);--ix-card-border-color:var(--theme-card-neutral--border-color);color:var(--theme-card-neutral--color)}:host(.card-primary){--ix-card-background:var(--theme-card-primary--background);--ix-card-border-color:var(--theme-card-primary--border-color);color:var(--theme-card-primary--color)}:host(:not(.card-insight,.card-outline)){--ix-card-border-color:transparent}:host(.card-outline:hover){--ix-card-border-color:var(--theme-card-outline--border-color--hover);--ix-card-background:var(--theme-card-outline--background--hover)}:host(.card-outline:active){--ix-card-border-color:var(--theme-card-outline--border-color--active);--ix-card-background:var(--theme-card-outline--background--active)}:host(.selected.card-outline){--ix-card-border-color:var(\n    --theme-card-outline--border-color--selected\n  );--ix-card-background:var(--theme-card-outline--background--selected)}:host(.card-filled:hover){--ix-card-border-color:var(--theme-card-filled--border-color--hover);--ix-card-background:var(--theme-card-filled--background--hover)}:host(.card-filled:active){--ix-card-border-color:var(--theme-card-filled--border-color--active);--ix-card-background:var(--theme-card-filled--background--active)}:host(.selected.card-filled){--ix-card-border-color:var(\n    --theme-card-filled--border-color--selected\n  );--ix-card-background:var(--theme-card-filled--background--selected)}:host(.card-alarm:hover){--ix-card-border-color:var(--theme-card-alarm--border-color--hover);--ix-card-background:var(--theme-card-alarm--background--hover)}:host(.card-alarm:active){--ix-card-border-color:var(--theme-card-alarm--border-color--active);--ix-card-background:var(--theme-card-alarm--background--active)}:host(.selected.card-alarm){--ix-card-border-color:var(\n    --theme-card-alarm--border-color--selected\n  );--ix-card-background:var(--theme-card-alarm--background--selected)}:host(.card-critical:hover){--ix-card-border-color:var(--theme-card-critical--border-color--hover);--ix-card-background:var(--theme-card-critical--background--hover)}:host(.card-critical:active){--ix-card-border-color:var(--theme-card-critical--border-color--active);--ix-card-background:var(--theme-card-critical--background--active)}:host(.selected.card-critical){--ix-card-border-color:var(\n    --theme-card-critical--border-color--selected\n  );--ix-card-background:var(--theme-card-critical--background--selected)}:host(.card-warning:hover){--ix-card-border-color:var(--theme-card-warning--border-color--hover);--ix-card-background:var(--theme-card-warning--background--hover)}:host(.card-warning:active){--ix-card-border-color:var(--theme-card-warning--border-color--active);--ix-card-background:var(--theme-card-warning--background--active)}:host(.selected.card-warning){--ix-card-border-color:var(\n    --theme-card-warning--border-color--selected\n  );--ix-card-background:var(--theme-card-warning--background--selected)}:host(.card-success:hover){--ix-card-border-color:var(--theme-card-success--border-color--hover);--ix-card-background:var(--theme-card-success--background--hover)}:host(.card-success:active){--ix-card-border-color:var(--theme-card-success--border-color--active);--ix-card-background:var(--theme-card-success--background--active)}:host(.selected.card-success){--ix-card-border-color:var(\n    --theme-card-success--border-color--selected\n  );--ix-card-background:var(--theme-card-success--background--selected)}:host(.card-info:hover){--ix-card-border-color:var(--theme-card-info--border-color--hover);--ix-card-background:var(--theme-card-info--background--hover)}:host(.card-info:active){--ix-card-border-color:var(--theme-card-info--border-color--active);--ix-card-background:var(--theme-card-info--background--active)}:host(.selected.card-info){--ix-card-border-color:var(\n    --theme-card-info--border-color--selected\n  );--ix-card-background:var(--theme-card-info--background--selected)}:host(.card-neutral:hover){--ix-card-border-color:var(--theme-card-neutral--border-color--hover);--ix-card-background:var(--theme-card-neutral--background--hover)}:host(.card-neutral:active){--ix-card-border-color:var(--theme-card-neutral--border-color--active);--ix-card-background:var(--theme-card-neutral--background--active)}:host(.selected.card-neutral){--ix-card-border-color:var(\n    --theme-card-neutral--border-color--selected\n  );--ix-card-background:var(--theme-card-neutral--background--selected)}:host(.card-primary:hover){--ix-card-border-color:var(--theme-card-primary--border-color--hover);--ix-card-background:var(--theme-card-primary--background--hover)}:host(.card-primary:active){--ix-card-border-color:var(--theme-card-primary--border-color--active);--ix-card-background:var(--theme-card-primary--background--active)}:host(.selected.card-primary){--ix-card-border-color:var(\n    --theme-card-primary--border-color--selected\n  );--ix-card-background:var(--theme-card-primary--background--selected)}:host(.passive){cursor:default}:host(.passive.card-outline){--ix-card-background:var(--theme-card-outline--background);--ix-card-border-color:var(--theme-card-outline--border-color)}:host(.passive.card-filled){--ix-card-background:var(--theme-card-filled--background);--ix-card-border-color:var(--theme-card-filled--border-color)}:host(.passive.card-alarm){--ix-card-background:var(--theme-card-alarm--background);--ix-card-border-color:var(--theme-card-alarm--border-color)}:host(.passive.card-critical){--ix-card-background:var(--theme-card-critical--background);--ix-card-border-color:var(--theme-card-critical--border-color)}:host(.passive.card-warning){--ix-card-background:var(--theme-card-warning--background);--ix-card-border-color:var(--theme-card-warning--border-color)}:host(.passive.card-success){--ix-card-background:var(--theme-card-success--background);--ix-card-border-color:var(--theme-card-success--border-color)}:host(.passive.card-info){--ix-card-background:var(--theme-card-info--background);--ix-card-border-color:var(--theme-card-info--border-color)}:host(.passive.card-neutral){--ix-card-background:var(--theme-card-neutral--background);--ix-card-border-color:var(--theme-card-neutral--border-color)}:host(.passive.card-primary){--ix-card-background:var(--theme-card-primary--background);--ix-card-border-color:var(--theme-card-primary--border-color)}";
 
 const Card = class {
     constructor(hostRef) {
@@ -15,12 +15,17 @@ const Card = class {
          * Show card in selected state
          */
         this.selected = false;
+        /**
+         * If true, disables hover and active styles and changes cursor to default
+         */
+        this.passive = false;
     }
     render() {
-        return (index.h(index.Host, { key: '3b734eddf8516af24b52b1b2ba27766a913f943d', class: {
+        return (index.h(index.Host, { key: '3eed87586aed1916f7c1e3c2323a46c794d046d9', class: {
                 selected: this.selected,
                 [`card-${this.variant}`]: true,
-            } }, index.h("div", { key: '7a2cce1797c1e89c8568e9e196020747f0f4150b', class: "card-content" }, index.h("slot", { key: 'ea837bde282a62637ed15b96b8ca407219e949ae' })), index.h("div", { key: 'acc07c72e4a63a671fb945e4c0332825f4781a1d', class: "card-footer" }, index.h("slot", { key: '870004ea22909180bac56c8b7c040d914e268f1d', name: "card-accordion" }))));
+                passive: this.passive,
+            } }, index.h("div", { key: '7ae77cffe48272d0acc8cbd0dc7286d0fc835d8d', class: "card-content" }, index.h("slot", { key: 'ba07f9804dd1af6256ceb0cc972b2cc03a18f558' })), index.h("div", { key: '72bc9064c1d09188d60e1b9516811a91435f53b4', class: "card-footer" }, index.h("slot", { key: '7fbacfea4d8308e88b4db025567654a0a4ef0d96', name: "card-accordion" }))));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/ix-dropdown-button.cjs.entry.js

@@ -3,6 +3,7 @@
 var index = require('./index-C8Xo8L1k.js');
 var index$1 = require('./index-Dyz3z1FD.js');
 var makeRef = require('./make-ref-BaH6_YJk.js');
+var a11y = require('./a11y-B_6chCvu.js');
 
 const dropdownButtonCss = ":host{display:inline-block;position:relative;height:2rem;width:auto}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .hide{display:none}:host .dropdown-button{display:block;position:relative;width:100%;height:100%}:host .dropdown-button>ix-button{width:100%;height:100%}:host .dropdown-button .button-label{margin-right:auto;min-width:0px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .dropdown-button .dropdown-icon{margin-right:0.25rem}:host .triangle{position:absolute;margin-inline-start:1.5625rem;margin-block-start:-0.4375rem;border-right:0 solid transparent;border-left:4px solid transparent;border-top:0 solid transparent;border-bottom:4px solid;color:var(--theme-btn-primary--color)}:host .triangle.primary{color:var(--theme-btn-primary--color)}:host .triangle.secondary{color:var(--theme-btn-secondary--color)}:host .triangle.tertiary{color:var(--theme-btn-tertiary--color)}:host .triangle.primary.disabled{color:var(--theme-btn-primary--color--disabled)}:host .triangle.secondary.disabled{color:var(--theme-btn-secondary--color--disabled)}:host .triangle.tertiary.disabled{color:var(--theme-btn-tertiary--color--disabled)}:host .triangle.subtle-primary{color:var(--theme-btn-subtle-primary--color)}:host .triangle.subtle-secondary{color:var(--theme-btn-subtle-secondary--color)}:host .triangle.subtle-tertiary{color:var(--theme-btn-subtle-tertiary--color)}:host .triangle.subtle-primary.disabled{color:var(--theme-btn-subtle-primary--color--disabled)}:host .triangle.subtle-secondary.disabled{color:var(--theme-btn-subtle-secondary--color--disabled)}:host .triangle.subtle-tertiary.disabled{color:var(--theme-btn-subtle-tertiary--color--disabled)}:host .triangle.danger-primary{color:var(--theme-btn-danger-primary--color)}:host .triangle.danger-secondary{color:var(--theme-btn-danger-secondary--color)}:host .triangle.danger-tertiary{color:var(--theme-btn-danger-tertiary--color)}:host .triangle.danger-primary.disabled{color:var(--theme-btn-danger-primary--color--disabled)}:host .triangle.danger-secondary.disabled{color:var(--theme-btn-danger-secondary--color--disabled)}:host .triangle.danger-tertiary.disabled{color:var(--theme-btn-danger-tertiary--color--disabled)}:host .content{display:flex;align-items:center}:host(.disabled){pointer-events:none}";
 
@@ -24,6 +25,9 @@ const DropdownButton = class {
         this.dropdownShow = false;
         this.dropdownAnchor = makeRef.makeRef();
         this.onDropdownShowChanged = (event) => {
+            if (this.disabled && event.detail) {
+                return;
+            }
             this.dropdownShow = event.detail;
         };
     }
@@ -36,11 +40,11 @@ const DropdownButton = class {
             } }));
     }
     render() {
-        return (index.h(index.Host, { key: '4e4aca39eff13b8f665682b3f2dc9ace533c7ca0', class: {
+        return (index.h(index.Host, { key: '8e8bd476bd9a3dccfbd21fe10a10046f725d6e59', "aria-disabled": a11y.a11yBoolean(this.disabled), class: {
                 disabled: this.disabled,
-            }, ref: this.dropdownAnchor }, index.h("div", { key: '9583ed2274621e67d779e9668fead87f663b7558', class: "dropdown-button" }, this.label ? (index.h("ix-button", { variant: this.variant, disabled: this.disabled, alignment: "start", ariaLabel: this.ariaLabelDropdownButton }, index.h("div", { class: 'content' }, this.icon ? (index.h("ix-icon", { name: this.icon, size: "24", class: 'dropdown-icon' })) : null, index.h("div", { class: 'button-label' }, this.label), index.h("ix-icon", { name: this.dropdownShow
+            }, ref: this.dropdownAnchor }, index.h("div", { key: '0fa67ef9f3f779316882f38b17099394f0e99e04', class: "dropdown-button" }, this.label ? (index.h("ix-button", { variant: this.variant, disabled: this.disabled, alignment: "start", ariaLabel: this.ariaLabelDropdownButton, tabIndex: this.disabled ? -1 : 0 }, index.h("div", { class: 'content' }, this.icon ? (index.h("ix-icon", { name: this.icon, size: "24", class: 'dropdown-icon' })) : null, index.h("div", { class: 'button-label' }, this.label), index.h("ix-icon", { name: this.dropdownShow
                 ? index$1.iconChevronUpSmall
-                : index$1.iconChevronDownSmall, size: "24" })))) : (index.h("div", null, index.h("ix-icon-button", { icon: this.icon, variant: this.variant, disabled: this.disabled }), this.getTriangle()))), index.h("ix-dropdown", { key: 'e4fd6fb8451d8883fac84764758a90ce6dc4d433', class: "dropdown", trigger: this.dropdownAnchor.waitForCurrent(), placement: this.placement, closeBehavior: this.closeBehavior, onShowChanged: this.onDropdownShowChanged }, index.h("slot", { key: 'be8d3427e80c326bc7a6993f53190e290b824967' }))));
+                : index$1.iconChevronDownSmall, size: "24" })))) : (index.h("div", null, index.h("ix-icon-button", { icon: this.icon, variant: this.variant, disabled: this.disabled, tabIndex: this.disabled ? -1 : 0 }), this.getTriangle()))), index.h("ix-dropdown", { key: 'bf09de1c2af43bc3ea2085cf11c26e6fb56b694a', class: "dropdown", trigger: this.dropdownAnchor.waitForCurrent(), placement: this.placement, closeBehavior: this.closeBehavior, onShowChanged: this.onDropdownShowChanged }, index.h("slot", { key: '89bf77cd9781f906d801ffb0c874028f3feef6de' }))));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/ix-dropdown-button.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ix-dropdown-button.entry.cjs.js","sources":["src/components/dropdown-button/dropdown-button.scss?tag=ix-dropdown-button&encapsulation=shadow","src/components/dropdown-button/dropdown-button.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use './common-variables' as vars;\n@use 'mixins/shadow-dom/component';\n\n@mixin triangle($name: '') {\n  @if ($name != '') {\n    $name: '#{$name}-';\n  }\n\n  .triangle.#{$name}primary {\n    color: var(--theme-btn-#{$name}primary--color);\n  }\n  .triangle.#{$name}secondary {\n    color: var(--theme-btn-#{$name}secondary--color);\n  }\n  .triangle.#{$name}tertiary {\n    color: var(--theme-btn-#{$name}tertiary--color);\n  }\n\n  .triangle.#{$name}primary.disabled {\n    color: var(--theme-btn-#{$name}primary--color--disabled);\n  }\n  .triangle.#{$name}secondary.disabled {\n    color: var(--theme-btn-#{$name}secondary--color--disabled);\n  }\n  .triangle.#{$name}tertiary.disabled {\n    color: var(--theme-btn-#{$name}tertiary--color--disabled);\n  }\n}\n\n:host {\n  display: inline-block;\n  position: relative;\n  height: vars.$x-large-space;\n  width: auto;\n\n  @include component.ix-component;\n\n  .hide {\n    display: none;\n  }\n\n  .dropdown-button {\n    display: block;\n    position: relative;\n    width: 100%;\n    height: 100%;\n  }\n\n  .dropdown-button > ix-button {\n    width: 100%;\n    height: 100%;\n  }\n\n  .dropdown-button .button-label {\n    margin-right: auto;\n    min-width: 0px;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .dropdown-button .dropdown-icon {\n    margin-right: 0.25rem;\n  }\n\n  .triangle {\n    position: absolute;\n    margin-inline-start: 1.5625rem;\n    margin-block-start: -0.4375rem;\n    border-right: 0 solid transparent;\n    border-left: 4px solid transparent;\n    border-top: 0 solid transparent;\n    border-bottom: 4px solid;\n    color: var(--theme-btn-primary--color);\n  }\n\n  @include triangle();\n  @include triangle('subtle');\n  @include triangle('danger');\n\n  .content {\n    display: flex;\n    align-items: center;\n  }\n}\n\n:host(.disabled) {\n  pointer-events: none;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\nimport { AlignedPlacement } from '../dropdown/placement';\nimport {\n  iconChevronDownSmall,\n  iconChevronUpSmall,\n} from '@siemens/ix-icons/icons';\nimport { makeRef } from '../utils/make-ref';\nimport type { DropdownButtonVariant } from './dropdown-button.types';\n\n@Component({\n  tag: 'ix-dropdown-button',\n  styleUrl: 'dropdown-button.scss',\n  shadow: true,\n})\nexport class DropdownButton {\n  @Element() hostElement!: HTMLIxDropdownButtonElement;\n\n  /**\n   * Button variant\n   */\n  @Prop() variant: DropdownButtonVariant = 'primary';\n\n  /**\n   * Disable button\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Set label\n   */\n  @Prop() label?: string;\n\n  /**\n   * Button icon\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n   */\n  @Prop() closeBehavior: 'inside' | 'outside' | 'both' | boolean = 'both';\n\n  /**\n   * Placement of the dropdown\n   */\n  @Prop() placement?: AlignedPlacement;\n\n  /**\n   * ARIA label for the dropdown button\n   * Will be set as aria-label on the nested HTML button element\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelDropdownButton?: string;\n\n  @State() dropdownShow = false;\n\n  private readonly dropdownAnchor = makeRef<HTMLElement>();\n\n  private getTriangle() {\n    return (\n      <div\n        class={{\n          triangle: true,\n          [this.variant]: true,\n          hide: !!this.label,\n          disabled: this.disabled,\n        }}\n      ></div>\n    );\n  }\n\n  private readonly onDropdownShowChanged = (event: CustomEvent<boolean>) => {\n    this.dropdownShow = event.detail;\n  };\n\n  render() {\n    return (\n      <Host\n        class={{\n          disabled: this.disabled,\n        }}\n        ref={this.dropdownAnchor}\n      >\n        <div class=\"dropdown-button\">\n          {this.label ? (\n            <ix-button\n              variant={this.variant}\n              disabled={this.disabled}\n              alignment=\"start\"\n              ariaLabel={this.ariaLabelDropdownButton}\n            >\n              <div class={'content'}>\n                {this.icon ? (\n                  <ix-icon\n                    name={this.icon}\n                    size=\"24\"\n                    class={'dropdown-icon'}\n                  ></ix-icon>\n                ) : null}\n                <div class={'button-label'}>{this.label}</div>\n                <ix-icon\n                  name={\n                    this.dropdownShow\n                      ? iconChevronUpSmall\n                      : iconChevronDownSmall\n                  }\n                  size=\"24\"\n                ></ix-icon>\n              </div>\n            </ix-button>\n          ) : (\n            <div>\n              <ix-icon-button\n                icon={this.icon}\n                variant={this.variant}\n                disabled={this.disabled}\n              ></ix-icon-button>\n              {this.getTriangle()}\n            </div>\n          )}\n        </div>\n\n        <ix-dropdown\n          class=\"dropdown\"\n          trigger={this.dropdownAnchor.waitForCurrent()}\n          placement={this.placement}\n          closeBehavior={this.closeBehavior}\n          onShowChanged={this.onDropdownShowChanged}\n        >\n          <slot></slot>\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"names":["makeRef","h","Host","iconChevronUpSmall","iconChevronDownSmall"],"mappings":";;;;;;AAAA,MAAM,iBAAiB,GAAG,w9FAAw9F;;MCuBr+F,cAAc,GAAA,MAAA;AAL3B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAQE;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAA0B,SAAS;AAElD;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAYxB;;AAEG;AACK,QAAA,IAAa,CAAA,aAAA,GAA4C,MAAM;AAe9D,QAAA,IAAY,CAAA,YAAA,GAAG,KAAK;AAEZ,QAAA,IAAc,CAAA,cAAA,GAAGA,eAAO,EAAe;AAevC,QAAA,IAAA,CAAA,qBAAqB,GAAG,CAAC,KAA2B,KAAI;AACvE,YAAA,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,MAAM;AAClC,SAAC;AA6DF;IA5ES,WAAW,GAAA;AACjB,QAAA,QACEC,OACE,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE;AACL,gBAAA,QAAQ,EAAE,IAAI;AACd,gBAAA,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI;AACpB,gBAAA,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK;gBAClB,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,EAAA,CACI;;IAQX,MAAM,GAAA;QACJ,QACEA,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,EACD,GAAG,EAAE,IAAI,CAAC,cAAc,EAAA,EAExBD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,iBAAiB,EAAA,EACzB,IAAI,CAAC,KAAK,IACTA,OACE,CAAA,WAAA,EAAA,EAAA,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAC,OAAO,EACjB,SAAS,EAAE,IAAI,CAAC,uBAAuB,EAAA,EAEvCA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAE,SAAS,EAAA,EAClB,IAAI,CAAC,IAAI,IACRA,OACE,CAAA,SAAA,EAAA,EAAA,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,eAAe,EAAA,CACb,IACT,IAAI,EACRA,OAAA,CAAA,KAAA,EAAA,EAAK,KAAK,EAAE,cAAc,IAAG,IAAI,CAAC,KAAK,CAAO,EAC9CA,OAAA,CAAA,SAAA,EAAA,EACE,IAAI,EACF,IAAI,CAAC;AACH,kBAAEE;kBACAC,4BAAoB,EAE1B,IAAI,EAAC,IAAI,EACA,CAAA,CACP,CACI,KAEZH,OAAA,CAAA,KAAA,EAAA,IAAA,EACEA,OAAA,CAAA,gBAAA,EAAA,EACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACP,CAAA,EACjB,IAAI,CAAC,WAAW,EAAE,CACf,CACP,CACG,EAENA,OAAA,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,cAAc,EAAE,EAC7C,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,aAAa,EAAE,IAAI,CAAC,qBAAqB,EAAA,EAEzCA,OAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACD,CACT;;;;;;;;"}
+{"version":3,"file":"ix-dropdown-button.entry.cjs.js","sources":["src/components/dropdown-button/dropdown-button.scss?tag=ix-dropdown-button&encapsulation=shadow","src/components/dropdown-button/dropdown-button.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n@use './common-variables' as vars;\n@use 'mixins/shadow-dom/component';\n\n@mixin triangle($name: '') {\n  @if ($name != '') {\n    $name: '#{$name}-';\n  }\n\n  .triangle.#{$name}primary {\n    color: var(--theme-btn-#{$name}primary--color);\n  }\n  .triangle.#{$name}secondary {\n    color: var(--theme-btn-#{$name}secondary--color);\n  }\n  .triangle.#{$name}tertiary {\n    color: var(--theme-btn-#{$name}tertiary--color);\n  }\n\n  .triangle.#{$name}primary.disabled {\n    color: var(--theme-btn-#{$name}primary--color--disabled);\n  }\n  .triangle.#{$name}secondary.disabled {\n    color: var(--theme-btn-#{$name}secondary--color--disabled);\n  }\n  .triangle.#{$name}tertiary.disabled {\n    color: var(--theme-btn-#{$name}tertiary--color--disabled);\n  }\n}\n\n:host {\n  display: inline-block;\n  position: relative;\n  height: vars.$x-large-space;\n  width: auto;\n\n  @include component.ix-component;\n\n  .hide {\n    display: none;\n  }\n\n  .dropdown-button {\n    display: block;\n    position: relative;\n    width: 100%;\n    height: 100%;\n  }\n\n  .dropdown-button > ix-button {\n    width: 100%;\n    height: 100%;\n  }\n\n  .dropdown-button .button-label {\n    margin-right: auto;\n    min-width: 0px;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n\n  .dropdown-button .dropdown-icon {\n    margin-right: 0.25rem;\n  }\n\n  .triangle {\n    position: absolute;\n    margin-inline-start: 1.5625rem;\n    margin-block-start: -0.4375rem;\n    border-right: 0 solid transparent;\n    border-left: 4px solid transparent;\n    border-top: 0 solid transparent;\n    border-bottom: 4px solid;\n    color: var(--theme-btn-primary--color);\n  }\n\n  @include triangle();\n  @include triangle('subtle');\n  @include triangle('danger');\n\n  .content {\n    display: flex;\n    align-items: center;\n  }\n}\n\n:host(.disabled) {\n  pointer-events: none;\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\nimport { AlignedPlacement } from '../dropdown/placement';\nimport {\n  iconChevronDownSmall,\n  iconChevronUpSmall,\n} from '@siemens/ix-icons/icons';\nimport { makeRef } from '../utils/make-ref';\nimport type { DropdownButtonVariant } from './dropdown-button.types';\nimport { a11yBoolean } from '../utils/a11y';\n\n@Component({\n  tag: 'ix-dropdown-button',\n  styleUrl: 'dropdown-button.scss',\n  shadow: true,\n})\nexport class DropdownButton {\n  @Element() hostElement!: HTMLIxDropdownButtonElement;\n\n  /**\n   * Button variant\n   */\n  @Prop() variant: DropdownButtonVariant = 'primary';\n\n  /**\n   * Disable button\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * Set label\n   */\n  @Prop() label?: string;\n\n  /**\n   * Button icon\n   */\n  @Prop() icon?: string;\n\n  /**\n   * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n   */\n  @Prop() closeBehavior: 'inside' | 'outside' | 'both' | boolean = 'both';\n\n  /**\n   * Placement of the dropdown\n   */\n  @Prop() placement?: AlignedPlacement;\n\n  /**\n   * ARIA label for the dropdown button\n   * Will be set as aria-label on the nested HTML button element\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelDropdownButton?: string;\n\n  @State() dropdownShow = false;\n\n  private readonly dropdownAnchor = makeRef<HTMLElement>();\n\n  private getTriangle() {\n    return (\n      <div\n        class={{\n          triangle: true,\n          [this.variant]: true,\n          hide: !!this.label,\n          disabled: this.disabled,\n        }}\n      ></div>\n    );\n  }\n\n  private readonly onDropdownShowChanged = (event: CustomEvent<boolean>) => {\n    if (this.disabled && event.detail) {\n      return;\n    }\n    this.dropdownShow = event.detail;\n  };\n\n  render() {\n    return (\n      <Host\n        aria-disabled={a11yBoolean(this.disabled)}\n        class={{\n          disabled: this.disabled,\n        }}\n        ref={this.dropdownAnchor}\n      >\n        <div class=\"dropdown-button\">\n          {this.label ? (\n            <ix-button\n              variant={this.variant}\n              disabled={this.disabled}\n              alignment=\"start\"\n              ariaLabel={this.ariaLabelDropdownButton}\n              tabIndex={this.disabled ? -1 : 0}\n            >\n              <div class={'content'}>\n                {this.icon ? (\n                  <ix-icon\n                    name={this.icon}\n                    size=\"24\"\n                    class={'dropdown-icon'}\n                  ></ix-icon>\n                ) : null}\n                <div class={'button-label'}>{this.label}</div>\n                <ix-icon\n                  name={\n                    this.dropdownShow\n                      ? iconChevronUpSmall\n                      : iconChevronDownSmall\n                  }\n                  size=\"24\"\n                ></ix-icon>\n              </div>\n            </ix-button>\n          ) : (\n            <div>\n              <ix-icon-button\n                icon={this.icon}\n                variant={this.variant}\n                disabled={this.disabled}\n                tabIndex={this.disabled ? -1 : 0}\n              ></ix-icon-button>\n              {this.getTriangle()}\n            </div>\n          )}\n        </div>\n\n        <ix-dropdown\n          class=\"dropdown\"\n          trigger={this.dropdownAnchor.waitForCurrent()}\n          placement={this.placement}\n          closeBehavior={this.closeBehavior}\n          onShowChanged={this.onDropdownShowChanged}\n        >\n          <slot></slot>\n        </ix-dropdown>\n      </Host>\n    );\n  }\n}\n"],"names":["makeRef","h","Host","a11yBoolean","iconChevronUpSmall","iconChevronDownSmall"],"mappings":"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"}

package/dist/cjs/ix-dropdown-item.cjs.entry.js

@@ -2,6 +2,7 @@
 
 var index = require('./index-C8Xo8L1k.js');
 var index$1 = require('./index-Dyz3z1FD.js');
+var a11y = require('./a11y-B_6chCvu.js');
 
 const dropdownItemCss = ":host{--ix-dropdown-item-checked-color:var(--theme-color-primary);display:flex;flex-direction:row;position:relative;height:2.5rem;width:auto;overflow:hidden;cursor:pointer}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .dropdown-item{all:unset;display:flex;flex-direction:row;align-items:center;position:relative;height:calc(100% - 2px);border:0.0625rem solid transparent;white-space:nowrap;width:calc(100% - 0.5rem - 1.5rem);padding:0 0.5rem;padding-right:1.5rem}:host .dropdown-item.no-checked-field{width:calc(100% - 1rem - 1.5rem);padding:0 1rem;padding-right:1.5rem}:host .dropdown-item:focus-visible{border-color:var(--theme-color-focus-bdr)}:host .dropdown-item-checked{display:flex;align-items:center;justify-content:center;position:relative;height:100%;width:1rem;min-width:1rem;margin-right:0.5rem;color:var(--ix-dropdown-item-checked-color)}:host .dropdown-item-icon{margin-right:0.5rem;color:var(--theme-color-std-text)}:host .dropdown-item-text{display:block;position:relative;overflow:hidden;text-overflow:ellipsis;white-space:pre}:host .submenu-icon{margin-left:auto}:host(.icon-only) .dropdown-item-icon{margin-right:0px}:host(.icon-only) .dropdown-item-checked{display:none}:host(.icon-only) .dropdown-item{width:calc(100% - 0.5rem - 0.5rem);padding:0 0.5rem;padding-right:0.5rem}:host(.submenu) .dropdown-item{width:calc(100% - 0.5rem - 0.5rem);padding:0 0.5rem;padding-right:0.5rem}:host(:not(.disabled):not(:disabled).hover),:host(:not(.disabled):not(:disabled):hover){background-color:var(--theme-ghost--background--hover)}:host(:not(.disabled):not(:disabled).active),:host(:not(.disabled):not(:disabled):active){background-color:var(--theme-ghost--background--active)}:host(.disabled){pointer-events:none;color:var(--theme-color-weak-text) !important}:host(.disabled) .dropdown-item-icon{color:var(--theme-color-weak-text) !important}";
 
@@ -40,15 +41,20 @@ const DropdownItem = class {
             this.icon !== undefined);
     }
     render() {
-        return (index.h(index.Host, { key: '4683b34a35d26f4cdce448ed24cdc5115f838fed', class: {
+        return (index.h(index.Host, { key: '89d6023460273b60bf52f129e456e0d92e51c09d', class: {
                 hover: this.hover,
                 'icon-only': this.isIconOnly(),
                 disabled: this.disabled,
                 submenu: this.isSubMenu,
-            }, role: "listitem" }, index.h("button", { key: 'a655623c265f18e805a0f60a093dd4ac565ab35c', type: "button", tabIndex: 0, class: {
+            }, role: "listitem" }, index.h("button", { key: '32feebb5d24eb19af7b5081c4f771a489913180f', type: "button", tabIndex: this.disabled ? -1 : 0, class: {
                 'dropdown-item': true,
                 'no-checked-field': this.suppressChecked,
-            }, onClick: () => this.emitItemClick(), "aria-label": this.ariaLabelButton }, !this.suppressChecked ? (index.h("div", { class: "dropdown-item-checked" }, this.checked ? (index.h("ix-icon", { class: "checkmark", name: index$1.iconSingleCheck, size: "16" })) : null)) : null, this.icon ? (index.h("ix-icon", { class: "dropdown-item-icon", name: this.icon, "aria-label": this.ariaLabelIcon })) : null, index.h("div", { key: 'd88e90650387ce4dd0d440fe03bf21c19c785709', class: "dropdown-item-text" }, this.label, index.h("slot", { key: 'd892aabbb2e268d36c348b800c043d08f2ceef83' })), this.isSubMenu ? (index.h("ix-icon", { name: index$1.iconChevronRightSmall, class: 'submenu-icon' })) : null)));
+                disabled: this.disabled,
+            }, onClick: () => {
+                if (!this.disabled) {
+                    this.emitItemClick();
+                }
+            }, "aria-label": this.ariaLabelButton, "aria-disabled": a11y.a11yBoolean(this.disabled), disabled: this.disabled }, !this.suppressChecked ? (index.h("div", { class: "dropdown-item-checked" }, this.checked ? (index.h("ix-icon", { class: "checkmark", name: index$1.iconSingleCheck, size: "16" })) : null)) : null, this.icon ? (index.h("ix-icon", { class: "dropdown-item-icon", name: this.icon, "aria-label": this.ariaLabelIcon })) : null, index.h("div", { key: 'dbc0b8352eb200eca806604da06e884bc398c5f0', class: "dropdown-item-text" }, this.label, index.h("slot", { key: 'e9a0a489086d0990f613b9e44fbe16cd00a0794b' })), this.isSubMenu ? (index.h("ix-icon", { name: index$1.iconChevronRightSmall, class: 'submenu-icon' })) : null)));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/ix-dropdown-item.entry.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ix-dropdown-item.entry.cjs.js","sources":["src/components/dropdown-item/dropdown-item.scss?tag=ix-dropdown-item&encapsulation=shadow","src/components/dropdown-item/dropdown-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use 'mixins/shadow-dom/component';\n@use 'mixins/shadow-dom/hover';\n\n$itemPadding: 0.5rem;\n$itemPaddingRight: 1.5rem;\n$focusBorder: 0.0625rem;\n\n@mixin applyItemWidth($padding, $paddingRight) {\n  width: calc(100% - #{$padding} - #{$paddingRight});\n\n  padding: 0 $padding;\n  padding-right: $paddingRight;\n}\n\n:host {\n  --ix-dropdown-item-checked-color: var(--theme-color-primary);\n\n  display: flex;\n  flex-direction: row;\n\n  position: relative;\n  height: 2.5rem;\n  width: auto;\n  overflow: hidden;\n  cursor: pointer;\n\n  @include component.ix-component;\n\n  .dropdown-item {\n    all: unset;\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    position: relative;\n    height: calc(100% - 2px);\n    border: $focusBorder solid transparent;\n    white-space: nowrap;\n\n    @include applyItemWidth($itemPadding, $itemPaddingRight);\n  }\n\n  .dropdown-item.no-checked-field {\n    @include applyItemWidth(1rem, $itemPaddingRight);\n  }\n\n  .dropdown-item:focus-visible {\n    border-color: var(--theme-color-focus-bdr);\n  }\n\n  .dropdown-item-checked {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    height: 100%;\n    width: 1rem;\n    min-width: 1rem;\n    margin-right: 0.5rem;\n\n    color: var(--ix-dropdown-item-checked-color);\n  }\n\n  .dropdown-item-icon {\n    margin-right: 0.5rem;\n    color: var(--theme-color-std-text);\n  }\n\n  .dropdown-item-text {\n    display: block;\n    position: relative;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: pre;\n  }\n\n  .submenu-icon {\n    margin-left: auto;\n  }\n}\n\n:host(.icon-only) {\n  .dropdown-item-icon {\n    margin-right: 0px;\n  }\n\n  .dropdown-item-checked {\n    display: none;\n  }\n\n  .dropdown-item {\n    @include applyItemWidth(0.5rem, 0.5rem);\n  }\n}\n\n:host(.submenu) {\n  .dropdown-item {\n    @include applyItemWidth($itemPadding, 0.5rem);\n  }\n}\n\n@include hover.ghost-hover-pressed;\n\n:host(.disabled) {\n  pointer-events: none;\n  color: var(--theme-color-weak-text) !important;\n\n  .dropdown-item-icon {\n    color: var(--theme-color-weak-text) !important;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n} from '@stencil/core';\nimport { DropdownItemWrapper } from '../dropdown/dropdown-controller';\nimport {\n  iconChevronRightSmall,\n  iconSingleCheck,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n  tag: 'ix-dropdown-item',\n  styleUrl: 'dropdown-item.scss',\n  shadow: true,\n})\nexport class DropdownItem implements DropdownItemWrapper {\n  @Element() hostElement!: HTMLIxDropdownItemElement;\n\n  /**\n   * Label of dropdown item\n   */\n  @Prop() label?: string;\n\n  /**\n   * Icon of dropdown item\n   */\n  @Prop() icon?: string;\n\n  /**\n   * ARIA label for the icon\n   */\n  @Prop() ariaLabelIcon?: string;\n\n  /**\n   * ARIA label for the item's button\n   * Will be set as aria-label for the nested HTML button element\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelButton?: string;\n\n  /**\n   * Display hover state\n   */\n  @Prop() hover = false;\n\n  /**\n   * Disable item and remove event listeners\n   */\n  @Prop() disabled = false;\n\n  /**\n   * Whether the item is checked or not. If true a checkmark will mark the item as checked.\n   */\n  @Prop() checked = false;\n\n  /** @internal */\n  @Prop() isSubMenu = false;\n\n  /** @internal */\n  @Prop() suppressChecked = false;\n\n  /** @internal */\n  @Event() itemClick!: EventEmitter<HTMLIxDropdownItemElement>;\n\n  /** @internal */\n  @Method()\n  async emitItemClick() {\n    this.itemClick.emit(this.hostElement);\n  }\n\n  /** @internal */\n  @Method()\n  async getDropdownItemElement() {\n    return this.hostElement;\n  }\n\n  private isIconOnly() {\n    return (\n      this.label === undefined &&\n      this.hostElement.innerText === '' &&\n      this.icon !== undefined\n    );\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          hover: this.hover,\n          'icon-only': this.isIconOnly(),\n          disabled: this.disabled,\n          submenu: this.isSubMenu,\n        }}\n        role=\"listitem\"\n      >\n        <button\n          type=\"button\"\n          tabIndex={0}\n          class={{\n            'dropdown-item': true,\n            'no-checked-field': this.suppressChecked,\n          }}\n          onClick={() => this.emitItemClick()}\n          aria-label={this.ariaLabelButton}\n        >\n          {!this.suppressChecked ? (\n            <div class=\"dropdown-item-checked\">\n              {this.checked ? (\n                <ix-icon\n                  class=\"checkmark\"\n                  name={iconSingleCheck}\n                  size=\"16\"\n                ></ix-icon>\n              ) : null}\n            </div>\n          ) : null}\n          {this.icon ? (\n            <ix-icon\n              class=\"dropdown-item-icon\"\n              name={this.icon}\n              aria-label={this.ariaLabelIcon}\n            ></ix-icon>\n          ) : null}\n          <div class=\"dropdown-item-text\">\n            {this.label}\n            <slot></slot>\n          </div>\n          {this.isSubMenu ? (\n            <ix-icon\n              name={iconChevronRightSmall}\n              class={'submenu-icon'}\n            ></ix-icon>\n          ) : null}\n        </button>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host","iconSingleCheck","iconChevronRightSmall"],"mappings":";;;;;AAAA,MAAM,eAAe,GAAG,6iFAA6iF;;MC8BxjF,YAAY,GAAA,MAAA;AALzB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AA+BE;;AAEG;AACK,QAAA,IAAK,CAAA,KAAA,GAAG,KAAK;AAErB;;AAEG;AACK,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAExB;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAG,KAAK;;AAGf,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;;AAGjB,QAAA,IAAe,CAAA,eAAA,GAAG,KAAK;AA8EhC;;AAvEC,IAAA,MAAM,aAAa,GAAA;QACjB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC;;;AAKvC,IAAA,MAAM,sBAAsB,GAAA;QAC1B,OAAO,IAAI,CAAC,WAAW;;IAGjB,UAAU,GAAA;AAChB,QAAA,QACE,IAAI,CAAC,KAAK,KAAK,SAAS;AACxB,YAAA,IAAI,CAAC,WAAW,CAAC,SAAS,KAAK,EAAE;AACjC,YAAA,IAAI,CAAC,IAAI,KAAK,SAAS;;IAI3B,MAAM,GAAA;QACJ,QACEA,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,KAAK,EAAE;gBACL,KAAK,EAAE,IAAI,CAAC,KAAK;AACjB,gBAAA,WAAW,EAAE,IAAI,CAAC,UAAU,EAAE;gBAC9B,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,OAAO,EAAE,IAAI,CAAC,SAAS;aACxB,EACD,IAAI,EAAC,UAAU,EAAA,EAEfD,OACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,EACX,KAAK,EAAE;AACL,gBAAA,eAAe,EAAE,IAAI;gBACrB,kBAAkB,EAAE,IAAI,CAAC,eAAe;AACzC,aAAA,EACD,OAAO,EAAE,MAAM,IAAI,CAAC,aAAa,EAAE,EAAA,YAAA,EACvB,IAAI,CAAC,eAAe,EAAA,EAE/B,CAAC,IAAI,CAAC,eAAe,IACpBA,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,uBAAuB,EAAA,EAC/B,IAAI,CAAC,OAAO,IACXA,OACE,CAAA,SAAA,EAAA,EAAA,KAAK,EAAC,WAAW,EACjB,IAAI,EAAEE,uBAAe,EACrB,IAAI,EAAC,IAAI,EAAA,CACA,IACT,IAAI,CACJ,IACJ,IAAI,EACP,IAAI,CAAC,IAAI,IACRF,OACE,CAAA,SAAA,EAAA,EAAA,KAAK,EAAC,oBAAoB,EAC1B,IAAI,EAAE,IAAI,CAAC,IAAI,EAAA,YAAA,EACH,IAAI,CAAC,aAAa,EAAA,CACrB,IACT,IAAI,EACRA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,oBAAoB,EAAA,EAC5B,IAAI,CAAC,KAAK,EACXA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,EACL,IAAI,CAAC,SAAS,IACbA,OAAA,CAAA,SAAA,EAAA,EACE,IAAI,EAAEG,6BAAqB,EAC3B,KAAK,EAAE,cAAc,EACZ,CAAA,IACT,IAAI,CACD,CACJ;;;;;;;;"}
+{"version":3,"file":"ix-dropdown-item.entry.cjs.js","sources":["src/components/dropdown-item/dropdown-item.scss?tag=ix-dropdown-item&encapsulation=shadow","src/components/dropdown-item/dropdown-item.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\n@use 'mixins/shadow-dom/component';\n@use 'mixins/shadow-dom/hover';\n\n$itemPadding: 0.5rem;\n$itemPaddingRight: 1.5rem;\n$focusBorder: 0.0625rem;\n\n@mixin applyItemWidth($padding, $paddingRight) {\n  width: calc(100% - #{$padding} - #{$paddingRight});\n\n  padding: 0 $padding;\n  padding-right: $paddingRight;\n}\n\n:host {\n  --ix-dropdown-item-checked-color: var(--theme-color-primary);\n\n  display: flex;\n  flex-direction: row;\n\n  position: relative;\n  height: 2.5rem;\n  width: auto;\n  overflow: hidden;\n  cursor: pointer;\n\n  @include component.ix-component;\n\n  .dropdown-item {\n    all: unset;\n    display: flex;\n    flex-direction: row;\n    align-items: center;\n    position: relative;\n    height: calc(100% - 2px);\n    border: $focusBorder solid transparent;\n    white-space: nowrap;\n\n    @include applyItemWidth($itemPadding, $itemPaddingRight);\n  }\n\n  .dropdown-item.no-checked-field {\n    @include applyItemWidth(1rem, $itemPaddingRight);\n  }\n\n  .dropdown-item:focus-visible {\n    border-color: var(--theme-color-focus-bdr);\n  }\n\n  .dropdown-item-checked {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    position: relative;\n    height: 100%;\n    width: 1rem;\n    min-width: 1rem;\n    margin-right: 0.5rem;\n\n    color: var(--ix-dropdown-item-checked-color);\n  }\n\n  .dropdown-item-icon {\n    margin-right: 0.5rem;\n    color: var(--theme-color-std-text);\n  }\n\n  .dropdown-item-text {\n    display: block;\n    position: relative;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: pre;\n  }\n\n  .submenu-icon {\n    margin-left: auto;\n  }\n}\n\n:host(.icon-only) {\n  .dropdown-item-icon {\n    margin-right: 0px;\n  }\n\n  .dropdown-item-checked {\n    display: none;\n  }\n\n  .dropdown-item {\n    @include applyItemWidth(0.5rem, 0.5rem);\n  }\n}\n\n:host(.submenu) {\n  .dropdown-item {\n    @include applyItemWidth($itemPadding, 0.5rem);\n  }\n}\n\n@include hover.ghost-hover-pressed;\n\n:host(.disabled) {\n  pointer-events: none;\n  color: var(--theme-color-weak-text) !important;\n\n  .dropdown-item-icon {\n    color: var(--theme-color-weak-text) !important;\n  }\n}\n","/*\n * SPDX-FileCopyrightText: 2023 Siemens AG\n *\n * SPDX-License-Identifier: MIT\n *\n * This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n} from '@stencil/core';\nimport { DropdownItemWrapper } from '../dropdown/dropdown-controller';\nimport {\n  iconChevronRightSmall,\n  iconSingleCheck,\n} from '@siemens/ix-icons/icons';\nimport { a11yBoolean } from '../utils/a11y';\n\n@Component({\n  tag: 'ix-dropdown-item',\n  styleUrl: 'dropdown-item.scss',\n  shadow: true,\n})\nexport class DropdownItem implements DropdownItemWrapper {\n  @Element() hostElement!: HTMLIxDropdownItemElement;\n\n  /**\n   * Label of dropdown item\n   */\n  @Prop() label?: string;\n\n  /**\n   * Icon of dropdown item\n   */\n  @Prop() icon?: string;\n\n  /**\n   * ARIA label for the icon\n   */\n  @Prop() ariaLabelIcon?: string;\n\n  /**\n   * ARIA label for the item's button\n   * Will be set as aria-label for the nested HTML button element\n   *\n   * @since 3.2.0\n   */\n  @Prop() ariaLabelButton?: string;\n\n  /**\n   * Display hover state\n   */\n  @Prop() hover = false;\n\n  /**\n   * Disable item and remove event listeners\n   */\n  @Prop({ reflect: true }) disabled = false;\n\n  /**\n   * Whether the item is checked or not. If true a checkmark will mark the item as checked.\n   */\n  @Prop() checked = false;\n\n  /** @internal */\n  @Prop() isSubMenu = false;\n\n  /** @internal */\n  @Prop() suppressChecked = false;\n\n  /** @internal */\n  @Event() itemClick!: EventEmitter<HTMLIxDropdownItemElement>;\n\n  /** @internal */\n  @Method()\n  async emitItemClick() {\n    this.itemClick.emit(this.hostElement);\n  }\n\n  /** @internal */\n  @Method()\n  async getDropdownItemElement() {\n    return this.hostElement;\n  }\n\n  private isIconOnly() {\n    return (\n      this.label === undefined &&\n      this.hostElement.innerText === '' &&\n      this.icon !== undefined\n    );\n  }\n\n  render() {\n    return (\n      <Host\n        class={{\n          hover: this.hover,\n          'icon-only': this.isIconOnly(),\n          disabled: this.disabled,\n          submenu: this.isSubMenu,\n        }}\n        role=\"listitem\"\n      >\n        <button\n          type=\"button\"\n          tabIndex={this.disabled ? -1 : 0}\n          class={{\n            'dropdown-item': true,\n            'no-checked-field': this.suppressChecked,\n            disabled: this.disabled,\n          }}\n          onClick={() => {\n            if (!this.disabled) {\n              this.emitItemClick();\n            }\n          }}\n          aria-label={this.ariaLabelButton}\n          aria-disabled={a11yBoolean(this.disabled)}\n          disabled={this.disabled}\n        >\n          {!this.suppressChecked ? (\n            <div class=\"dropdown-item-checked\">\n              {this.checked ? (\n                <ix-icon\n                  class=\"checkmark\"\n                  name={iconSingleCheck}\n                  size=\"16\"\n                ></ix-icon>\n              ) : null}\n            </div>\n          ) : null}\n          {this.icon ? (\n            <ix-icon\n              class=\"dropdown-item-icon\"\n              name={this.icon}\n              aria-label={this.ariaLabelIcon}\n            ></ix-icon>\n          ) : null}\n          <div class=\"dropdown-item-text\">\n            {this.label}\n            <slot></slot>\n          </div>\n          {this.isSubMenu ? (\n            <ix-icon\n              name={iconChevronRightSmall}\n              class={'submenu-icon'}\n            ></ix-icon>\n          ) : null}\n        </button>\n      </Host>\n    );\n  }\n}\n"],"names":["h","Host","a11yBoolean","iconSingleCheck","iconChevronRightSmall"],"mappings":";;;;;;AAAA,MAAM,eAAe,GAAG,6iFAA6iF;;MC+BxjF,YAAY,GAAA,MAAA;AALzB,IAAA,WAAA,CAAA,OAAA,EAAA;;;AA+BE;;AAEG;AACK,QAAA,IAAK,CAAA,KAAA,GAAG,KAAK;AAErB;;AAEG;AACsB,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;AAEzC;;AAEG;AACK,QAAA,IAAO,CAAA,OAAA,GAAG,KAAK;;AAGf,QAAA,IAAS,CAAA,SAAA,GAAG,KAAK;;AAGjB,QAAA,IAAe,CAAA,eAAA,GAAG,KAAK;AAqFhC;;AA9EC,IAAA,MAAM,aAAa,GAAA;QACjB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC;;;AAKvC,IAAA,MAAM,sBAAsB,GAAA;QAC1B,OAAO,IAAI,CAAC,WAAW;;IAGjB,UAAU,GAAA;AAChB,QAAA,QACE,IAAI,CAAC,KAAK,KAAK,SAAS;AACxB,YAAA,IAAI,CAAC,WAAW,CAAC,SAAS,KAAK,EAAE;AACjC,YAAA,IAAI,CAAC,IAAI,KAAK,SAAS;;IAI3B,MAAM,GAAA;QACJ,QACEA,OAAA,CAACC,UAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,KAAK,EAAE;gBACL,KAAK,EAAE,IAAI,CAAC,KAAK;AACjB,gBAAA,WAAW,EAAE,IAAI,CAAC,UAAU,EAAE;gBAC9B,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,OAAO,EAAE,IAAI,CAAC,SAAS;AACxB,aAAA,EACD,IAAI,EAAC,UAAU,EAAA,EAEfD,OACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,EAAE,GAAG,CAAC,EAChC,KAAK,EAAE;AACL,gBAAA,eAAe,EAAE,IAAI;gBACrB,kBAAkB,EAAE,IAAI,CAAC,eAAe;gBACxC,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,EACD,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,IAAI,CAAC,QAAQ,EAAE;oBAClB,IAAI,CAAC,aAAa,EAAE;;AAExB,aAAC,gBACW,IAAI,CAAC,eAAe,EAAA,eAAA,EACjBE,gBAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,EACzC,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAA,EAEtB,CAAC,IAAI,CAAC,eAAe,IACpBF,OAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAC,uBAAuB,EAAA,EAC/B,IAAI,CAAC,OAAO,IACXA,OACE,CAAA,SAAA,EAAA,EAAA,KAAK,EAAC,WAAW,EACjB,IAAI,EAAEG,uBAAe,EACrB,IAAI,EAAC,IAAI,EAAA,CACA,IACT,IAAI,CACJ,IACJ,IAAI,EACP,IAAI,CAAC,IAAI,IACRH,OACE,CAAA,SAAA,EAAA,EAAA,KAAK,EAAC,oBAAoB,EAC1B,IAAI,EAAE,IAAI,CAAC,IAAI,EAAA,YAAA,EACH,IAAI,CAAC,aAAa,EAAA,CACrB,IACT,IAAI,EACRA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,oBAAoB,EAAA,EAC5B,IAAI,CAAC,KAAK,EACXA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAa,CACT,EACL,IAAI,CAAC,SAAS,IACbA,OAAA,CAAA,SAAA,EAAA,EACE,IAAI,EAAEI,6BAAqB,EAC3B,KAAK,EAAE,cAAc,EACZ,CAAA,IACT,IAAI,CACD,CACJ;;;;;;;;"}