npm - @siemens/ix - Versions diffs - 2.1.0 → 2.1.1-beta.0 - Mend

@siemens/ix 2.1.0 → 2.1.1-beta.0

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

Files changed (602) hide show

package/components/menu-item.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { c as createMutationObserver } from './mutation-observer.js';
-const menuItemCss = ":host{position:relative;display:block;cursor:pointer;height:var(--ix-menu-item-height, 3rem);min-height:var(--ix-menu-item-height, 3rem);max-height:var(--ix-menu-item-height, 3rem)}:host .tab{all:unset;box-sizing:border-box;display:flex;position:relative;align-items:center;height:var(--ix-menu-item-height, 3rem);width:100%;z-index:500;padding-left:0.875rem}:host .tab:not(.disabled):not(:disabled).hover,:host .tab:not(.disabled):not(:disabled):hover{background-color:var(--theme-ghost--background--hover)}:host .tab:not(.disabled):not(:disabled).active,:host .tab:not(.disabled):not(:disabled):active{background-color:var(--theme-ghost--background--active)}:host .tab-icon{color:var(--theme-nav-item-primary-icon--color);position:relative;pointer-events:none}:host .tab:focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:-1px}:host .tab:not(:last-child){margin-bottom:0.5rem}:host .notification{display:inline-flex;position:absolute;top:0.25rem;left:1.75rem}:host .notification .pill{display:inline-flex;justify-content:center;align-items:center;height:0.5rem;min-width:1rem;position:relative;border-radius:6.25rem;background-color:var(--theme-color-primary);border-radius:6.25rem;font-size:0.75rem;font-weight:bold;line-height:1;font-family:Siemens Sans, Arial, sans-serif;color:var(--theme-color-primary--contrast);padding:0.25rem}:host .tab-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--theme-nav-item-primary--color);margin:0 1.25rem;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}:host(.active) .tab,:host(.selected) .tab{background-color:var(--theme-nav-item-primary--background--selected)}:host(.active) .tab::before,:host(.selected) .tab::before{content:\"\";background-color:var(--theme-nav-item-primary--border-color--selected);height:var(--ix-menu-item-height, 3rem);width:0.25rem;left:0;position:absolute}:host(.active) .tab>.glyph,:host(.selected) .tab>.glyph{color:var(--theme-nav-item-primary-icon--color--selected)}:host(.disabled){color:var(--theme-color-weak-text);pointer-events:none;cursor:default}:host(.disabled) .tab>.tab-icon{color:var(--theme-color-weak-text)}:host(.disabled) .tab-text{color:var(--theme-color-weak-text)}:host(.bottom-tab),:host([slot=bottom]){min-height:2.25rem;height:2.25rem;max-height:2.25rem}:host(.bottom-tab) .tab,:host([slot=bottom]) .tab{height:2.25rem}:host(.bottom-tab) .tab::before,:host([slot=bottom]) .tab::before{height:2.25rem;background-color:transparent}:host(.bottom-tab).active:hover,:host(.bottom-tab).selected:hover,:host([slot=bottom]).active:hover,:host([slot=bottom]).selected:hover{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.bottom-tab).active:active,:host(.bottom-tab).selected:active,:host([slot=bottom]).active:active,:host([slot=bottom]).selected:active{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.bottom-tab.active) .tab,:host(.bottom-tab.selected) .tab,:host(.active[slot=bottom]) .tab,:host(.selected[slot=bottom]) .tab{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.tab-nested) .tab::before{display:none}";
+const menuItemCss = ":host{position:relative;display:block;cursor:pointer;height:var(--ix-menu-item-height, 3rem);min-height:var(--ix-menu-item-height, 3rem);max-height:var(--ix-menu-item-height, 3rem)}:host .tab{all:unset;box-sizing:border-box;display:flex;position:relative;align-items:center;height:var(--ix-menu-item-height, 3rem);width:100%;z-index:500;padding-left:0.875rem}:host .tab:not(.disabled):not(:disabled).hover,:host .tab:not(.disabled):not(:disabled):hover{background-color:var(--theme-ghost--background--hover)}:host .tab:not(.disabled):not(:disabled).active,:host .tab:not(.disabled):not(:disabled):active{background-color:var(--theme-ghost--background--active)}:host .tab-icon{color:var(--theme-nav-item-primary-icon--color);position:relative;pointer-events:none}:host .tab:focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:-1px}:host .tab:not(:last-child){margin-bottom:0.5rem}:host .notification{display:inline-flex;position:absolute;top:0.25rem;left:1.5rem}:host .notification .pill{display:inline-flex;justify-content:center;align-items:center;height:0.5rem;min-width:1rem;position:relative;border-radius:6.25rem;background-color:var(--theme-color-primary);border-radius:6.25rem;font-size:0.75rem;font-weight:bold;line-height:1;font-family:Siemens Sans, Arial, sans-serif;color:var(--theme-color-primary--contrast);padding:0.25rem}:host .tab-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--theme-nav-item-primary--color);margin:0 1.25rem;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:100%}:host(.active) .tab,:host(.selected) .tab{background-color:var(--theme-nav-item-primary--background--selected)}:host(.active) .tab::before,:host(.selected) .tab::before{content:\"\";background-color:var(--theme-nav-item-primary--border-color--selected);height:var(--ix-menu-item-height, 3rem);width:0.25rem;left:0;position:absolute}:host(.active) .tab>.glyph,:host(.selected) .tab>.glyph{color:var(--theme-nav-item-primary-icon--color--selected)}:host(.disabled){color:var(--theme-color-weak-text);pointer-events:none;cursor:default}:host(.disabled) .tab>.tab-icon{color:var(--theme-color-weak-text)}:host(.disabled) .tab-text{color:var(--theme-color-weak-text)}:host(.bottom-tab),:host([slot=bottom]){min-height:2.25rem;height:2.25rem;max-height:2.25rem}:host(.bottom-tab) .tab,:host([slot=bottom]) .tab{height:2.25rem}:host(.bottom-tab) .tab::before,:host([slot=bottom]) .tab::before{height:2.25rem;background-color:transparent}:host(.bottom-tab).active:hover,:host(.bottom-tab).selected:hover,:host([slot=bottom]).active:hover,:host([slot=bottom]).selected:hover{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.bottom-tab).active:active,:host(.bottom-tab).selected:active,:host([slot=bottom]).active:active,:host([slot=bottom]).selected:active{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.bottom-tab.active) .tab,:host(.bottom-tab.selected) .tab,:host(.active[slot=bottom]) .tab,:host(.selected[slot=bottom]) .tab{background-color:var(--theme-nav-item-secondary--background--selected)}:host(.tab-nested) .tab{flex-direction:row;padding-left:1.375rem}:host(.tab-nested) .tab .notification{position:relative;top:0;left:0;padding-left:0.5rem}:host(.tab-nested) .tab .tab-icon{padding-left:0.5rem;padding-right:0.5rem}:host(.tab-nested) .tab .tab-text{margin-left:0.5rem}:host(.tab-nested) .tab::before{display:none}";
 const IxMenuItemStyle0 = menuItemCss;
 const MenuItem = /*@__PURE__*/ proxyCustomElement(class MenuItem extends HTMLElement {
@@ -12,7 +12,7 @@ const MenuItem = /*@__PURE__*/ proxyCustomElement(class MenuItem extends HTMLEle
         this.isHostedInsideCategory = false;
         this.home = false;
         this.bottom = false;
-        this.tabIcon = 'document';
+        this.tabIcon = undefined;
         this.icon = undefined;
         this.notifications = undefined;
         this.active = undefined;
@@ -22,6 +22,8 @@ const MenuItem = /*@__PURE__*/ proxyCustomElement(class MenuItem extends HTMLEle
     componentWillLoad() {
         this.isHostedInsideCategory =
             !!this.hostElement.closest('ix-menu-category');
+        this.onIconChange();
+        this.onTabIconChange();
     }
     componentWillRender() {
         this.title = this.hostElement.innerText;
@@ -41,6 +43,20 @@ const MenuItem = /*@__PURE__*/ proxyCustomElement(class MenuItem extends HTMLEle
             this.observer.disconnect();
         }
     }
+    onIconChange() {
+        if (!this.isHostedInsideCategory &&
+            !this.hostElement.icon &&
+            !this.hostElement.tabIcon) {
+            this.icon = 'document';
+        }
+    }
+    onTabIconChange() {
+        if (!this.isHostedInsideCategory &&
+            !this.hostElement.icon &&
+            !this.hostElement.tabIcon) {
+            this.tabIcon = 'document';
+        }
+    }
     render() {
         var _a;
         let extendedAttributes = {};
@@ -54,25 +70,32 @@ const MenuItem = /*@__PURE__*/ proxyCustomElement(class MenuItem extends HTMLEle
                 slot: 'bottom',
             };
         }
-        return (h(Host, Object.assign({ key: 'd00ab2e99c623bcb386887b3173ad3afe94fcb35', class: {
+        return (h(Host, Object.assign({ key: 'cf7c3ee73c7ff53d9825bc64460a72a876c46f03', class: {
                 disabled: this.disabled,
                 'home-tab': this.home,
                 'bottom-tab': this.bottom,
                 active: this.active,
                 'tab-nested': this.isHostedInsideCategory,
-            } }, extendedAttributes), h("button", { key: '8d6b02cc96f0477c1eee2a665fbbcbacfada4197', class: "tab", title: this.title, tabIndex: this.disabled ? -1 : 0, role: "listitem" }, h("ix-icon", { key: '881303994ea8a29f49ac55b4599bee5b4755beec', class: 'tab-icon', name: (_a = this.icon) !== null && _a !== void 0 ? _a : this.tabIcon }), h("div", { key: '2cb1cc719ca29def024b81b72dfe6861d0e4c77c', class: "notification" }, this.notifications ? (h("div", { class: "pill" }, this.notifications)) : null), h("span", { key: 'cbe86fcfb2b26056b7d9c3bc1ec26539ec7bf481', class: "tab-text text-default" }, h("slot", { key: '9c71b007cff4024971ae2f64a3e3fbe2c8ac85b5' })))));
+            } }, extendedAttributes), h("button", { key: 'd79e9ab5097e712949a65e59e08426166dfa4091', class: "tab", title: this.title, tabIndex: this.disabled ? -1 : 0, role: "listitem" }, (this.icon || this.tabIcon) && (h("ix-icon", { class: 'tab-icon', name: (_a = this.icon) !== null && _a !== void 0 ? _a : this.tabIcon })), this.notifications ? (h("div", { class: "notification" }, h("div", { class: "pill" }, this.notifications))) : null, h("span", { key: 'edbdefc1edd5b572c49d2f74e184a466989500e6', class: "tab-text text-default" }, h("slot", { key: 'f3d75d13c9b68b69e7731f9c947c423e304a76d6' })))));
     }
     get hostElement() { return this; }
+    static get watchers() { return {
+        "icon": ["onIconChange"],
+        "tabIcon": ["onTabIconChange"]
+    }; }
     static get style() { return IxMenuItemStyle0; }
 }, [1, "ix-menu-item", {
         "home": [4],
         "bottom": [4],
-        "tabIcon": [1, "tab-icon"],
-        "icon": [1],
+        "tabIcon": [1025, "tab-icon"],
+        "icon": [1025],
         "notifications": [2],
         "active": [4],
         "disabled": [4],
         "title": [32]
+    }, undefined, {
+        "icon": ["onIconChange"],
+        "tabIcon": ["onTabIconChange"]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {

package/components/menu-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"menu-item.js","mappings":";;;AAAA,MAAM,WAAW,GAAG,gmGAAgmG,CAAC;AACrnG,yBAAe,WAAW;;MCmBb,QAAQ;;;;;QA6CX,2BAAsB,GAAG,KAAK,CAAC;oBAzCxB,KAAK;sBAOH,KAAK;uBAOJ,UAAU;;;;;;;IA6B5B,iBAAiB;QACf,IAAI,CAAC,sBAAsB;YACzB,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;KAClD;IAED,mBAAmB;QACjB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC;KACzC;IAED,iBAAiB;QACf,IAAI,CAAC,QAAQ,GAAG,sBAAsB,CAAC;YACrC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC;SACzC,CAAC,CAAC;QAEH,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE;YACtC,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,IAAI;YACf,aAAa,EAAE,IAAI;SACpB,CAAC,CAAC;KACJ;IAED,oBAAoB;QAClB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;SAC5B;KACF;IAED,MAAM;;QACJ,IAAI,kBAAkB,GAAG,EAAE,CAAC;QAC5B,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,kBAAkB,GAAG;gBACnB,IAAI,EAAE,MAAM;aACb,CAAC;SACH;QAED,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,kBAAkB,GAAG;gBACnB,IAAI,EAAE,QAAQ;aACf,CAAC;SACH;QACD,QACE,EAAC,IAAI,mEACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,UAAU,EAAE,IAAI,CAAC,IAAI;gBACrB,YAAY,EAAE,IAAI,CAAC,MAAM;gBACzB,MAAM,EAAE,IAAI,CAAC,MAAM;gBACnB,YAAY,EAAE,IAAI,CAAC,sBAAsB;aAC1C,IACG,kBAAkB,GAEtB,+DACE,KAAK,EAAC,KAAK,EACX,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC,EAChC,IAAI,EAAC,UAAU,IAEf,gEACE,KAAK,EAAE,UAAU,EACjB,IAAI,EAAE,MAAA,IAAI,CAAC,IAAI,mCAAI,IAAI,CAAC,OAAO,GACtB,EACX,4DAAK,KAAK,EAAC,cAAc,IACtB,IAAI,CAAC,aAAa,IACjB,WAAK,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,aAAa,CAAO,IAC1C,IAAI,CACJ,EACN,6DAAM,KAAK,EAAC,uBAAuB,IACjC,8DAAa,CACR,CACA,CACJ,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/menu-item/menu-item.scss?tag=ix-menu-item&encapsulation=shadow","src/components/menu-item/menu-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@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n$menuItemHeight: 3rem;\n$menuItemPadding: 0.875rem;\n\n:host {\n position: relative;\n display: block;\n cursor: pointer;\n\n height: var(--ix-menu-item-height, $menuItemHeight);\n min-height: var(--ix-menu-item-height, $menuItemHeight);\n max-height: var(--ix-menu-item-height, $menuItemHeight);\n\n .tab {\n all: unset;\n box-sizing: border-box;\n display: flex;\n position: relative;\n align-items: center;\n height: var(--ix-menu-item-height, $menuItemHeight);\n width: calc(100%);\n z-index: 500;\n padding-left: $menuItemPadding;\n\n @include ghost-hover-pressed;\n }\n\n .tab-icon {\n color: var(--theme-nav-item-primary-icon--color);\n position: relative;\n pointer-events: none;\n }\n\n .tab:focus-visible {\n outline: 1px solid var(--theme-color-focus-bdr);\n outline-offset: -1px;\n }\n\n .tab:not(:last-child) {\n margin-bottom: $small-space;\n }\n\n .notification {\n display: inline-flex;\n position: absolute;\n top: 0.25rem;\n left: 1.75rem;\n\n .pill {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n height: 0.5rem;\n min-width: 1rem;\n position: relative;\n border-radius: 6.25rem;\n background-color: var(--theme-color-primary);\n border-radius: 6.25rem;\n font-size: 0.75rem;\n font-weight: bold;\n line-height: 1;\n font-family: Siemens Sans, Arial, sans-serif;\n color: var(--theme-color-primary--contrast);\n padding: $tiny-space;\n }\n }\n\n .tab-text {\n @include ellipsis;\n color: var(--theme-nav-item-primary--color);\n margin: 0 1.25rem;\n user-select: none;\n width: 100%;\n }\n}\n\n:host(.active),\n:host(.selected) {\n .tab {\n background-color: var(--theme-nav-item-primary--background--selected);\n }\n\n .tab::before {\n content: '';\n background-color: var(--theme-nav-item-primary--border-color--selected);\n height: var(--ix-menu-item-height, $menuItemHeight);\n width: 0.25rem;\n left: 0;\n position: absolute;\n }\n\n .tab > .glyph {\n color: var(--theme-nav-item-primary-icon--color--selected);\n }\n}\n\n:host(.disabled) {\n color: var(--theme-color-weak-text);\n pointer-events: none;\n cursor: default;\n\n .tab > .tab-icon {\n color: var(--theme-color-weak-text);\n }\n\n .tab-text {\n color: var(--theme-color-weak-text);\n }\n}\n\n:host(.bottom-tab),\n:host([slot='bottom']) {\n $bottom-height: 2.25rem;\n\n min-height: $bottom-height;\n height: $bottom-height;\n max-height: $bottom-height;\n\n .tab {\n height: $bottom-height;\n }\n\n .tab::before {\n height: $bottom-height;\n background-color: transparent;\n }\n\n &.active,\n &.selected {\n &:hover {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n\n &:active {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n }\n}\n\n:host(.bottom-tab.active),\n:host(.bottom-tab.selected),\n:host(.active[slot='bottom']),\n:host(.selected[slot='bottom']) {\n .tab {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n}\n\n:host(.tab-nested) {\n .tab::before {\n display: none;\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, Element, h, Host, Prop, State } from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\n\n/\n @slot menu-item-label Custom label\n /\n@Component({\n tag: 'ix-menu-item',\n styleUrl: 'menu-item.scss',\n shadow: true,\n})\nexport class MenuItem {\n /\n Move the Tab to a top position.\n /\n @Prop() home = false;\n\n /\n Caution: this is no longer working. Please use slot=\"bottom\" instead.\n \n Place tab on bottom\n /\n @Prop() bottom = false;\n\n /\n Name of the icon you want to display. Icon names can be resolved from the documentation @link https://ix.siemens.io/docs/icon-library/icons\n \n @deprecated since 2.0.0 use `icon` property. Will be removed in 3.0.0\n /\n @Prop() tabIcon = 'document';\n\n /\n Name of the icon you want to display. Icon names can be resolved from the documentation @link https://ix.siemens.io/docs/icon-library/icons\n /\n @Prop() icon: string;\n\n /\n Show notification count on tab\n /\n @Prop() notifications: number;\n\n /\n State to display active\n /\n @Prop() active: boolean;\n\n /\n Disable tab and remove event handlers\n */\n @Prop() disabled: boolean;\n\n @Element() hostElement: HTMLIxMenuItemElement;\n\n @State() title: string;\n\n private observer: MutationObserver;\n private isHostedInsideCategory = false;\n\n componentWillLoad() {\n this.isHostedInsideCategory =\n !!this.hostElement.closest('ix-menu-category');\n }\n\n componentWillRender() {\n this.title = this.hostElement.innerText;\n }\n\n connectedCallback() {\n this.observer = createMutationObserver(() => {\n this.title = this.hostElement.innerText;\n });\n\n this.observer.observe(this.hostElement, {\n subtree: true,\n childList: true,\n characterData: true,\n });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n let extendedAttributes = {};\n if (this.home) {\n extendedAttributes = {\n slot: 'home',\n };\n }\n\n if (this.bottom) {\n extendedAttributes = {\n slot: 'bottom',\n };\n }\n return (\n <Host\n class={{\n disabled: this.disabled,\n 'home-tab': this.home,\n 'bottom-tab': this.bottom,\n active: this.active,\n 'tab-nested': this.isHostedInsideCategory,\n }}\n {...extendedAttributes}\n >\n <button\n class=\"tab\"\n title={this.title}\n tabIndex={this.disabled ? -1 : 0}\n role=\"listitem\"\n >\n <ix-icon\n class={'tab-icon'}\n name={this.icon ?? this.tabIcon}\n ></ix-icon>\n <div class=\"notification\">\n {this.notifications ? (\n <div class=\"pill\">{this.notifications}</div>\n ) : null}\n </div>\n <span class=\"tab-text text-default\">\n <slot></slot>\n </span>\n </button>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"menu-item.js","mappings":";;;AAAA,MAAM,WAAW,GAAG,y3GAAy3G,CAAC;AAC94G,yBAAe,WAAW;;MCmBb,QAAQ;;;;;QA6CX,2BAAsB,GAAG,KAAK,CAAC;oBAzCxB,KAAK;sBAOH,KAAK;;;;;;;;IAoCtB,iBAAiB;QACf,IAAI,CAAC,sBAAsB;YACzB,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QAEjD,IAAI,CAAC,YAAY,EAAE,CAAC;QACpB,IAAI,CAAC,eAAe,EAAE,CAAC;KACxB;IAED,mBAAmB;QACjB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC;KACzC;IAED,iBAAiB;QACf,IAAI,CAAC,QAAQ,GAAG,sBAAsB,CAAC;YACrC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC;SACzC,CAAC,CAAC;QAEH,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE;YACtC,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,IAAI;YACf,aAAa,EAAE,IAAI;SACpB,CAAC,CAAC;KACJ;IAED,oBAAoB;QAClB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;SAC5B;KACF;IAGD,YAAY;QACV,IACE,CAAC,IAAI,CAAC,sBAAsB;YAC5B,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI;YACtB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,EACzB;YACA,IAAI,CAAC,IAAI,GAAG,UAAU,CAAC;SACxB;KACF;IAGD,eAAe;QACb,IACE,CAAC,IAAI,CAAC,sBAAsB;YAC5B,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI;YACtB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,EACzB;YACA,IAAI,CAAC,OAAO,GAAG,UAAU,CAAC;SAC3B;KACF;IAED,MAAM;;QACJ,IAAI,kBAAkB,GAAG,EAAE,CAAC;QAC5B,IAAI,IAAI,CAAC,IAAI,EAAE;YACb,kBAAkB,GAAG;gBACnB,IAAI,EAAE,MAAM;aACb,CAAC;SACH;QAED,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,kBAAkB,GAAG;gBACnB,IAAI,EAAE,QAAQ;aACf,CAAC;SACH;QACD,QACE,EAAC,IAAI,mEACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,UAAU,EAAE,IAAI,CAAC,IAAI;gBACrB,YAAY,EAAE,IAAI,CAAC,MAAM;gBACzB,MAAM,EAAE,IAAI,CAAC,MAAM;gBACnB,YAAY,EAAE,IAAI,CAAC,sBAAsB;aAC1C,IACG,kBAAkB,GAEtB,+DACE,KAAK,EAAC,KAAK,EACX,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAG,CAAC,CAAC,GAAG,CAAC,EAChC,IAAI,EAAC,UAAU,IAEd,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,MACzB,eACE,KAAK,EAAE,UAAU,EACjB,IAAI,EAAE,MAAA,IAAI,CAAC,IAAI,mCAAI,IAAI,CAAC,OAAO,GACtB,CACZ,EACA,IAAI,CAAC,aAAa,IACjB,WAAK,KAAK,EAAC,cAAc,IACvB,WAAK,KAAK,EAAC,MAAM,IAAE,IAAI,CAAC,aAAa,CAAO,CACxC,IACJ,IAAI,EACR,6DAAM,KAAK,EAAC,uBAAuB,IACjC,8DAAa,CACR,CACA,CACJ,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/menu-item/menu-item.scss?tag=ix-menu-item&encapsulation=shadow","src/components/menu-item/menu-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@import 'common-variables';\n@import 'mixins/hover';\n@import 'mixins/text-truncation';\n\n$menuItemHeight: 3rem;\n$menuItemPadding: 0.875rem;\n\n:host {\n position: relative;\n display: block;\n cursor: pointer;\n\n height: var(--ix-menu-item-height, $menuItemHeight);\n min-height: var(--ix-menu-item-height, $menuItemHeight);\n max-height: var(--ix-menu-item-height, $menuItemHeight);\n\n .tab {\n all: unset;\n box-sizing: border-box;\n display: flex;\n position: relative;\n align-items: center;\n height: var(--ix-menu-item-height, $menuItemHeight);\n width: calc(100%);\n z-index: 500;\n padding-left: $menuItemPadding;\n\n @include ghost-hover-pressed;\n }\n\n .tab-icon {\n color: var(--theme-nav-item-primary-icon--color);\n position: relative;\n pointer-events: none;\n }\n\n .tab:focus-visible {\n outline: 1px solid var(--theme-color-focus-bdr);\n outline-offset: -1px;\n }\n\n .tab:not(:last-child) {\n margin-bottom: $small-space;\n }\n\n .notification {\n display: inline-flex;\n position: absolute;\n top: 0.25rem;\n left: 1.5rem;\n\n .pill {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n height: 0.5rem;\n min-width: 1rem;\n position: relative;\n border-radius: 6.25rem;\n background-color: var(--theme-color-primary);\n border-radius: 6.25rem;\n font-size: 0.75rem;\n font-weight: bold;\n line-height: 1;\n font-family: Siemens Sans, Arial, sans-serif;\n color: var(--theme-color-primary--contrast);\n padding: $tiny-space;\n }\n }\n\n .tab-text {\n @include ellipsis;\n color: var(--theme-nav-item-primary--color);\n margin: 0 1.25rem;\n user-select: none;\n width: 100%;\n }\n}\n\n:host(.active),\n:host(.selected) {\n .tab {\n background-color: var(--theme-nav-item-primary--background--selected);\n }\n\n .tab::before {\n content: '';\n background-color: var(--theme-nav-item-primary--border-color--selected);\n height: var(--ix-menu-item-height, $menuItemHeight);\n width: 0.25rem;\n left: 0;\n position: absolute;\n }\n\n .tab > .glyph {\n color: var(--theme-nav-item-primary-icon--color--selected);\n }\n}\n\n:host(.disabled) {\n color: var(--theme-color-weak-text);\n pointer-events: none;\n cursor: default;\n\n .tab > .tab-icon {\n color: var(--theme-color-weak-text);\n }\n\n .tab-text {\n color: var(--theme-color-weak-text);\n }\n}\n\n:host(.bottom-tab),\n:host([slot='bottom']) {\n $bottom-height: 2.25rem;\n\n min-height: $bottom-height;\n height: $bottom-height;\n max-height: $bottom-height;\n\n .tab {\n height: $bottom-height;\n }\n\n .tab::before {\n height: $bottom-height;\n background-color: transparent;\n }\n\n &.active,\n &.selected {\n &:hover {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n\n &:active {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n }\n}\n\n:host(.bottom-tab.active),\n:host(.bottom-tab.selected),\n:host(.active[slot='bottom']),\n:host(.selected[slot='bottom']) {\n .tab {\n background-color: var(--theme-nav-item-secondary--background--selected);\n }\n}\n\n:host(.tab-nested) {\n .tab {\n flex-direction: row;\n padding-left: calc(0.5rem + $menuItemPadding);\n\n .notification {\n position: relative;\n top: 0;\n left: 0;\n padding-left: 0.5rem;\n }\n\n .tab-icon {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n }\n\n .tab-text {\n margin-left: 0.5rem;\n }\n\n &::before {\n display: none;\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\nimport { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\nimport { createMutationObserver } from '../utils/mutation-observer';\n\n/\n @slot menu-item-label Custom label\n /\n@Component({\n tag: 'ix-menu-item',\n styleUrl: 'menu-item.scss',\n shadow: true,\n})\nexport class MenuItem {\n /\n Move the Tab to a top position.\n /\n @Prop() home = false;\n\n /\n Caution: this is no longer working. Please use slot=\"bottom\" instead.\n \n Place tab on bottom\n /\n @Prop() bottom = false;\n\n /\n Name of the icon you want to display. Icon names can be resolved from the documentation @link https://ix.siemens.io/docs/icon-library/icons\n \n @deprecated since 2.0.0 use `icon` property. Will be removed in 3.0.0\n /\n @Prop({ mutable: true }) tabIcon: string;\n\n /\n Name of the icon you want to display. Icon names can be resolved from the documentation @link https://ix.siemens.io/docs/icon-library/icons\n /\n @Prop({ mutable: true }) icon: string;\n\n /\n Show notification count on tab\n /\n @Prop() notifications: number;\n\n /\n State to display active\n /\n @Prop() active: boolean;\n\n /\n Disable tab and remove event handlers\n */\n @Prop() disabled: boolean;\n\n @Element() hostElement: HTMLIxMenuItemElement;\n\n @State() title: string;\n\n private observer: MutationObserver;\n private isHostedInsideCategory = false;\n\n componentWillLoad() {\n this.isHostedInsideCategory =\n !!this.hostElement.closest('ix-menu-category');\n\n this.onIconChange();\n this.onTabIconChange();\n }\n\n componentWillRender() {\n this.title = this.hostElement.innerText;\n }\n\n connectedCallback() {\n this.observer = createMutationObserver(() => {\n this.title = this.hostElement.innerText;\n });\n\n this.observer.observe(this.hostElement, {\n subtree: true,\n childList: true,\n characterData: true,\n });\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n @Watch('icon')\n onIconChange() {\n if (\n !this.isHostedInsideCategory &&\n !this.hostElement.icon &&\n !this.hostElement.tabIcon\n ) {\n this.icon = 'document';\n }\n }\n\n @Watch('tabIcon')\n onTabIconChange() {\n if (\n !this.isHostedInsideCategory &&\n !this.hostElement.icon &&\n !this.hostElement.tabIcon\n ) {\n this.tabIcon = 'document';\n }\n }\n\n render() {\n let extendedAttributes = {};\n if (this.home) {\n extendedAttributes = {\n slot: 'home',\n };\n }\n\n if (this.bottom) {\n extendedAttributes = {\n slot: 'bottom',\n };\n }\n return (\n <Host\n class={{\n disabled: this.disabled,\n 'home-tab': this.home,\n 'bottom-tab': this.bottom,\n active: this.active,\n 'tab-nested': this.isHostedInsideCategory,\n }}\n {...extendedAttributes}\n >\n <button\n class=\"tab\"\n title={this.title}\n tabIndex={this.disabled ? -1 : 0}\n role=\"listitem\"\n >\n {(this.icon \|\| this.tabIcon) && (\n <ix-icon\n class={'tab-icon'}\n name={this.icon ?? this.tabIcon}\n ></ix-icon>\n )}\n {this.notifications ? (\n <div class=\"notification\">\n <div class=\"pill\">{this.notifications}</div>\n </div>\n ) : null}\n <span class=\"tab-text text-default\">\n <slot></slot>\n </span>\n </button>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/modal-content.js CHANGED Viewed

@@ -10,7 +10,7 @@ const ModalContent = /*@__PURE__*/ proxyCustomElement(class ModalContent extends
         this.__attachShadow();
     }
     render() {
-        return (h(Host, { key: 'ae7d626442e1d32189d5811a76b9921e893a2708' }, h("slot", { key: '09c33581a65e4db3f54ee84f625bf5c601b0178c' })));
+        return (h(Host, { key: '7d65ee586b3d78c89cc6f6a90689eaa1d98f4ec2' }, h("slot", { key: 'a2cb0a30400cf62e782a0fbb9e2926f4127ace4f' })));
     }
     static get style() { return IxModalContentStyle0; }
 }, [1, "ix-modal-content"]);

package/components/modal-header.js CHANGED Viewed

@@ -39,7 +39,7 @@ const ModalHeader = /*@__PURE__*/ proxyCustomElement(class ModalHeader extends H
         this.parentDialog.dismissModal();
     }
     render() {
-        return (h(Host, { key: '330fd598a3b07d2f41c9f683923101f77d214fe5' }, this.icon ? (h("ix-icon", { class: 'modal-icon', name: this.icon, color: this.iconColor })) : null, h("ix-typography", { key: 'a07ec792401066c71a1f4d50aa318a38c3fbe0ee', variant: 'default-title' }, h("slot", { key: '9c1ba3358ad6efb9971ed896764441c1a3fc4a89' })), !this.hideClose ? (h("ix-icon-button", { onClick: (event) => this.onCloseClick(event), ghost: true, icon: "close", class: 'modal-close' })) : null));
+        return (h(Host, { key: '93f0022e034724d55e1ef5d158e26c3c52f187ea' }, this.icon ? (h("ix-icon", { class: 'modal-icon', name: this.icon, color: this.iconColor })) : null, h("ix-typography", { key: 'da388b084f8a380c731a45ae72d9b40fce7b2ef5', variant: 'default-title' }, h("slot", { key: '425ec3dd532be2169aa3782e01e923c0518646bb' })), !this.hideClose ? (h("ix-icon-button", { onClick: (event) => this.onCloseClick(event), ghost: true, icon: "close", class: 'modal-close' })) : null));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/components/modal.js CHANGED Viewed

@@ -223,7 +223,7 @@ async function showModal(config) {
     }
     setA11yAttributes(dialogRef, config);
     Object.assign(dialogRef, config);
-    dialogRef.showModal();
+    await dialogRef.showModal();
     dialogRef.addEventListener('dialogClose', async ({ detail }) => {
         onClose.emit(detail);
         await delegate.removeView(dialogRef);

package/components/modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"modal.js","mappings":"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","names":["setA11yAttributes"],"sources":["src/components/utils/delegate.ts","src/components/utils/modal/message.ts","src/components/utils/modal/modal.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\nexport type DelegateConfig = {\n parentElement?: Element;\n};\n\nexport interface FrameworkDelegate {\n attachView<R = HTMLElement>(view: any, config?: DelegateConfig): Promise<R>;\n removeView(view: any): Promise<void>;\n}\n\nclass DefaultFrameworkDelegate implements FrameworkDelegate {\n async attachView<R = HTMLElement>(\n view: any,\n config?: DelegateConfig\n ): Promise<R> {\n const attachToElement = config?.parentElement ?? document.body;\n attachToElement.appendChild(view);\n return view;\n }\n\n async removeView(view: any) {\n view.remove();\n }\n}\n\nconst coreDelegate = new DefaultFrameworkDelegate();\nlet currentDelegate: FrameworkDelegate = coreDelegate;\n\nexport function registerFrameworkDelegate(delegate: FrameworkDelegate) {\n currentDelegate = delegate;\n}\n\nexport const resolveDelegate = () => {\n return currentDelegate;\n};\n\nexport const getCoreDelegate = () => coreDelegate;\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 { getCoreDelegate } from '../delegate';\nimport { TypedEvent } from '../typed-event';\n\nfunction setA11yAttributes(element: HTMLElement, config: MessageContent) {\n const ariaDescribedby = config.ariaDescribedby;\n const ariaLabelledby = config.ariaLabelledby;\n\n delete config['ariaDescribedby'];\n delete config['ariaLabelledby'];\n\n if (ariaDescribedby) {\n element.setAttribute('aria-describedby', ariaDescribedby);\n }\n\n if (ariaLabelledby) {\n element.setAttribute('aria-labelledby', ariaLabelledby);\n }\n}\n\nfunction createConfirmButtons(\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) {\n let actions = [];\n if (textCancel !== undefined) {\n actions = [\n ...actions,\n {\n id: 'cancel',\n text: textCancel,\n type: 'cancel',\n payload: payloadCancel,\n },\n ];\n }\n return [\n ...actions,\n {\n id: 'okay',\n text: textOkay,\n type: 'okay',\n payload: payloadOkay,\n },\n ];\n}\n\nexport type MessageContent = {\n icon: string;\n iconColor?: string;\n messageTitle: string;\n message: string;\n actions: {\n id: string;\n type: 'button-primary' \| 'button-secondary' \| 'okay' \| 'cancel';\n text: string;\n payload?: any;\n }[];\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n};\n\nexport async function showMessage<T>(config: MessageContent) {\n const onMessageAction = new TypedEvent<{\n actionId: string;\n payload: T;\n }>();\n const dialog = document.createElement('ix-modal');\n const header = document.createElement('ix-modal-header');\n const content = document.createElement('ix-modal-content');\n const footer = document.createElement('ix-modal-footer');\n\n setA11yAttributes(dialog, config);\n\n Object.assign(header, config);\n Object.assign(content, config);\n Object.assign(footer, config);\n\n header.innerText = config.messageTitle;\n content.innerText = config.message;\n\n config.actions.forEach(({ id, text, type, payload }) => {\n const button = document.createElement('ix-button');\n button.innerText = text;\n footer.appendChild(button);\n\n if (type === 'okay') {\n button.variant = 'primary';\n button.addEventListener('click', () =>\n dialog.closeModal({\n actionId: id,\n payload,\n })\n );\n return;\n }\n if (type === 'cancel') {\n button.variant = 'primary';\n button.outline = true;\n button.addEventListener('click', () =>\n dialog.dismissModal({\n actionId: id,\n payload,\n })\n );\n return;\n }\n });\n\n dialog.appendChild(header);\n dialog.appendChild(content);\n dialog.appendChild(footer);\n\n const dialogRef = await getCoreDelegate().attachView<HTMLIxModalElement>(\n dialog\n );\n\n dialogRef.addEventListener(\n 'dialogClose',\n (\n event: CustomEvent<{\n actionId: string;\n payload: T;\n }>\n ) => {\n onMessageAction.emit(event.detail);\n dialogRef.remove();\n }\n );\n\n dialogRef.addEventListener(\n 'dialogDismiss',\n (\n event: CustomEvent<{\n actionId: string;\n payload: T;\n }>\n ) => {\n onMessageAction.emit(event.detail);\n dialogRef.remove();\n }\n );\n\n dialogRef.showModal();\n return onMessageAction;\n}\n\nshowMessage.info = (\n title: string,\n message: string,\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) => {\n return showMessage({\n message,\n messageTitle: title,\n icon: 'info',\n actions: createConfirmButtons(\n textOkay,\n textCancel,\n payloadOkay,\n payloadCancel\n ),\n });\n};\n\nshowMessage.warning = (\n title: string,\n message: string,\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) => {\n return showMessage({\n message,\n messageTitle: title,\n icon: 'warning',\n iconColor: 'color-warning',\n actions: createConfirmButtons(\n textOkay,\n textCancel,\n payloadOkay,\n payloadCancel\n ),\n });\n};\n\nshowMessage.error = (\n title: string,\n message: string,\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) => {\n return showMessage({\n message,\n messageTitle: title,\n icon: 'error',\n iconColor: 'color-alarm',\n actions: createConfirmButtons(\n textOkay,\n textCancel,\n payloadOkay,\n payloadCancel\n ),\n });\n};\n\nshowMessage.success = (\n title: string,\n message: string,\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) => {\n return showMessage({\n message,\n messageTitle: title,\n icon: 'success',\n iconColor: 'color-success',\n actions: createConfirmButtons(\n textOkay,\n textCancel,\n payloadOkay,\n payloadCancel\n ),\n });\n};\n\nshowMessage.question = (\n title: string,\n message: string,\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) => {\n return showMessage({\n message,\n messageTitle: title,\n icon: 'question',\n actions: createConfirmButtons(\n textOkay,\n textCancel,\n payloadOkay,\n payloadCancel\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\nimport { IxModalSize } from '../../modal/modal';\nimport { getCoreDelegate, resolveDelegate } from '../delegate';\nimport { TypedEvent } from '../typed-event';\n\nexport function setA11yAttributes(element: HTMLElement, config: ModalConfig) {\n const ariaDescribedby = config.ariaDescribedby;\n const ariaLabelledby = config.ariaLabelledby;\n\n delete config['ariaDescribedby'];\n delete config['ariaLabelledby'];\n\n if (ariaDescribedby) {\n element.setAttribute('aria-describedby', ariaDescribedby);\n }\n\n if (ariaLabelledby) {\n element.setAttribute('aria-labelledby', ariaLabelledby);\n }\n}\n\nexport interface ModalConfig<TReason = any, CONTENT = any> {\n animation?: boolean;\n ariaDescribedby?: string;\n ariaLabelledby?: string;\n backdrop?: boolean;\n closeOnBackdropClick?: boolean;\n beforeDismiss?: (reason?: TReason) => boolean \| Promise<boolean>;\n centered?: boolean;\n container?: string \| HTMLElement;\n content: CONTENT \| string;\n keyboard?: boolean;\n size?: IxModalSize;\n title?: string;\n}\n\nexport interface ModalInstance<TReason = any> {\n htmlElement: HTMLIxModalElement;\n onClose: TypedEvent<TReason>;\n onDismiss: TypedEvent<TReason>;\n}\n\nfunction getIxModal(element: Element) {\n return element.closest('ix-modal');\n}\n\nexport function closeModal<TClose = any>(\n element: Element,\n closeResult: TClose\n) {\n const dialog = getIxModal(element);\n if (dialog) {\n dialog.closeModal(closeResult);\n return;\n }\n}\n\nexport function dismissModal(element: Element, dismissResult?: any) {\n const dialog = getIxModal(element);\n if (dialog) {\n dialog.dismissModal(dismissResult);\n return;\n }\n}\n\nexport async function showModal<T>(\n config: ModalConfig<T>\n): Promise<ModalInstance<T>> {\n const delegate = resolveDelegate();\n let dialogRef: HTMLIxModalElement;\n const onClose = new TypedEvent<T>();\n const onDismiss = new TypedEvent<T>();\n\n if (typeof config.content === 'string') {\n const dialog = document.createElement('ix-modal');\n dialog.innerText = config.content;\n dialogRef = await getCoreDelegate().attachView(dialog);\n }\n\n if (\n config.content instanceof HTMLElement &&\n config.content.tagName !== 'IX-MODAL'\n ) {\n const dialog = document.createElement('ix-modal');\n dialog.appendChild(config.content);\n dialogRef = await getCoreDelegate().attachView(dialog);\n }\n\n if (!dialogRef) {\n dialogRef = await delegate.attachView<HTMLIxModalElement>(config.content);\n }\n\n setA11yAttributes(dialogRef, config);\n Object.assign(dialogRef, config);\n\n dialogRef.showModal();\n dialogRef.addEventListener('dialogClose', async ({ detail }: CustomEvent) => {\n onClose.emit(detail);\n await delegate.removeView(dialogRef);\n });\n\n dialogRef.addEventListener(\n 'dialogDismiss',\n async ({ detail }: CustomEvent) => {\n onDismiss.emit(detail);\n await delegate.removeView(dialogRef);\n }\n );\n\n return {\n htmlElement: dialogRef,\n onClose,\n onDismiss,\n };\n}\n"],"version":3}
1	+ {"file":"modal.js","mappings":"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","names":["setA11yAttributes"],"sources":["src/components/utils/delegate.ts","src/components/utils/modal/message.ts","src/components/utils/modal/modal.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\nexport type DelegateConfig = {\n parentElement?: Element;\n};\n\nexport interface FrameworkDelegate {\n attachView<R = HTMLElement>(view: any, config?: DelegateConfig): Promise<R>;\n removeView(view: any): Promise<void>;\n}\n\nclass DefaultFrameworkDelegate implements FrameworkDelegate {\n async attachView<R = HTMLElement>(\n view: any,\n config?: DelegateConfig\n ): Promise<R> {\n const attachToElement = config?.parentElement ?? document.body;\n attachToElement.appendChild(view);\n return view;\n }\n\n async removeView(view: any) {\n view.remove();\n }\n}\n\nconst coreDelegate = new DefaultFrameworkDelegate();\nlet currentDelegate: FrameworkDelegate = coreDelegate;\n\nexport function registerFrameworkDelegate(delegate: FrameworkDelegate) {\n currentDelegate = delegate;\n}\n\nexport const resolveDelegate = () => {\n return currentDelegate;\n};\n\nexport const getCoreDelegate = () => coreDelegate;\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 { getCoreDelegate } from '../delegate';\nimport { TypedEvent } from '../typed-event';\n\nfunction setA11yAttributes(element: HTMLElement, config: MessageContent) {\n const ariaDescribedby = config.ariaDescribedby;\n const ariaLabelledby = config.ariaLabelledby;\n\n delete config['ariaDescribedby'];\n delete config['ariaLabelledby'];\n\n if (ariaDescribedby) {\n element.setAttribute('aria-describedby', ariaDescribedby);\n }\n\n if (ariaLabelledby) {\n element.setAttribute('aria-labelledby', ariaLabelledby);\n }\n}\n\nfunction createConfirmButtons(\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) {\n let actions = [];\n if (textCancel !== undefined) {\n actions = [\n ...actions,\n {\n id: 'cancel',\n text: textCancel,\n type: 'cancel',\n payload: payloadCancel,\n },\n ];\n }\n return [\n ...actions,\n {\n id: 'okay',\n text: textOkay,\n type: 'okay',\n payload: payloadOkay,\n },\n ];\n}\n\nexport type MessageContent = {\n icon: string;\n iconColor?: string;\n messageTitle: string;\n message: string;\n actions: {\n id: string;\n type: 'button-primary' \| 'button-secondary' \| 'okay' \| 'cancel';\n text: string;\n payload?: any;\n }[];\n ariaLabelledby?: string;\n ariaDescribedby?: string;\n};\n\nexport async function showMessage<T>(config: MessageContent) {\n const onMessageAction = new TypedEvent<{\n actionId: string;\n payload: T;\n }>();\n const dialog = document.createElement('ix-modal');\n const header = document.createElement('ix-modal-header');\n const content = document.createElement('ix-modal-content');\n const footer = document.createElement('ix-modal-footer');\n\n setA11yAttributes(dialog, config);\n\n Object.assign(header, config);\n Object.assign(content, config);\n Object.assign(footer, config);\n\n header.innerText = config.messageTitle;\n content.innerText = config.message;\n\n config.actions.forEach(({ id, text, type, payload }) => {\n const button = document.createElement('ix-button');\n button.innerText = text;\n footer.appendChild(button);\n\n if (type === 'okay') {\n button.variant = 'primary';\n button.addEventListener('click', () =>\n dialog.closeModal({\n actionId: id,\n payload,\n })\n );\n return;\n }\n if (type === 'cancel') {\n button.variant = 'primary';\n button.outline = true;\n button.addEventListener('click', () =>\n dialog.dismissModal({\n actionId: id,\n payload,\n })\n );\n return;\n }\n });\n\n dialog.appendChild(header);\n dialog.appendChild(content);\n dialog.appendChild(footer);\n\n const dialogRef = await getCoreDelegate().attachView<HTMLIxModalElement>(\n dialog\n );\n\n dialogRef.addEventListener(\n 'dialogClose',\n (\n event: CustomEvent<{\n actionId: string;\n payload: T;\n }>\n ) => {\n onMessageAction.emit(event.detail);\n dialogRef.remove();\n }\n );\n\n dialogRef.addEventListener(\n 'dialogDismiss',\n (\n event: CustomEvent<{\n actionId: string;\n payload: T;\n }>\n ) => {\n onMessageAction.emit(event.detail);\n dialogRef.remove();\n }\n );\n\n dialogRef.showModal();\n return onMessageAction;\n}\n\nshowMessage.info = (\n title: string,\n message: string,\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) => {\n return showMessage({\n message,\n messageTitle: title,\n icon: 'info',\n actions: createConfirmButtons(\n textOkay,\n textCancel,\n payloadOkay,\n payloadCancel\n ),\n });\n};\n\nshowMessage.warning = (\n title: string,\n message: string,\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) => {\n return showMessage({\n message,\n messageTitle: title,\n icon: 'warning',\n iconColor: 'color-warning',\n actions: createConfirmButtons(\n textOkay,\n textCancel,\n payloadOkay,\n payloadCancel\n ),\n });\n};\n\nshowMessage.error = (\n title: string,\n message: string,\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) => {\n return showMessage({\n message,\n messageTitle: title,\n icon: 'error',\n iconColor: 'color-alarm',\n actions: createConfirmButtons(\n textOkay,\n textCancel,\n payloadOkay,\n payloadCancel\n ),\n });\n};\n\nshowMessage.success = (\n title: string,\n message: string,\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) => {\n return showMessage({\n message,\n messageTitle: title,\n icon: 'success',\n iconColor: 'color-success',\n actions: createConfirmButtons(\n textOkay,\n textCancel,\n payloadOkay,\n payloadCancel\n ),\n });\n};\n\nshowMessage.question = (\n title: string,\n message: string,\n textOkay: string,\n textCancel?: string,\n payloadOkay?: any,\n payloadCancel?: any\n) => {\n return showMessage({\n message,\n messageTitle: title,\n icon: 'question',\n actions: createConfirmButtons(\n textOkay,\n textCancel,\n payloadOkay,\n payloadCancel\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\nimport { IxModalSize } from '../../modal/modal';\nimport { getCoreDelegate, resolveDelegate } from '../delegate';\nimport { TypedEvent } from '../typed-event';\n\nexport function setA11yAttributes(element: HTMLElement, config: ModalConfig) {\n const ariaDescribedby = config.ariaDescribedby;\n const ariaLabelledby = config.ariaLabelledby;\n\n delete config['ariaDescribedby'];\n delete config['ariaLabelledby'];\n\n if (ariaDescribedby) {\n element.setAttribute('aria-describedby', ariaDescribedby);\n }\n\n if (ariaLabelledby) {\n element.setAttribute('aria-labelledby', ariaLabelledby);\n }\n}\n\nexport interface ModalConfig<TReason = any, CONTENT = any> {\n animation?: boolean;\n ariaDescribedby?: string;\n ariaLabelledby?: string;\n backdrop?: boolean;\n closeOnBackdropClick?: boolean;\n beforeDismiss?: (reason?: TReason) => boolean \| Promise<boolean>;\n centered?: boolean;\n container?: string \| HTMLElement;\n content: CONTENT \| string;\n keyboard?: boolean;\n size?: IxModalSize;\n title?: string;\n}\n\nexport interface ModalInstance<TReason = any> {\n htmlElement: HTMLIxModalElement;\n onClose: TypedEvent<TReason>;\n onDismiss: TypedEvent<TReason>;\n}\n\nfunction getIxModal(element: Element) {\n return element.closest('ix-modal');\n}\n\nexport function closeModal<TClose = any>(\n element: Element,\n closeResult: TClose\n) {\n const dialog = getIxModal(element);\n if (dialog) {\n dialog.closeModal(closeResult);\n return;\n }\n}\n\nexport function dismissModal(element: Element, dismissResult?: any) {\n const dialog = getIxModal(element);\n if (dialog) {\n dialog.dismissModal(dismissResult);\n return;\n }\n}\n\nexport async function showModal<T>(\n config: ModalConfig<T>\n): Promise<ModalInstance<T>> {\n const delegate = resolveDelegate();\n let dialogRef: HTMLIxModalElement;\n const onClose = new TypedEvent<T>();\n const onDismiss = new TypedEvent<T>();\n\n if (typeof config.content === 'string') {\n const dialog = document.createElement('ix-modal');\n dialog.innerText = config.content;\n dialogRef = await getCoreDelegate().attachView(dialog);\n }\n\n if (\n config.content instanceof HTMLElement &&\n config.content.tagName !== 'IX-MODAL'\n ) {\n const dialog = document.createElement('ix-modal');\n dialog.appendChild(config.content);\n dialogRef = await getCoreDelegate().attachView(dialog);\n }\n if (!dialogRef) {\n dialogRef = await delegate.attachView<HTMLIxModalElement>(config.content);\n }\n\n setA11yAttributes(dialogRef, config);\n Object.assign(dialogRef, config);\n\n await dialogRef.showModal();\n dialogRef.addEventListener('dialogClose', async ({ detail }: CustomEvent) => {\n onClose.emit(detail);\n await delegate.removeView(dialogRef);\n });\n\n dialogRef.addEventListener(\n 'dialogDismiss',\n async ({ detail }: CustomEvent) => {\n onDismiss.emit(detail);\n await delegate.removeView(dialogRef);\n }\n );\n\n return {\n htmlElement: dialogRef,\n onClose,\n onDismiss,\n };\n}\n"],"version":3}

package/components/row.js CHANGED Viewed

@@ -10,7 +10,7 @@ const Row = /*@__PURE__*/ proxyCustomElement(class Row extends HTMLElement {
         this.__attachShadow();
     }
     render() {
-        return (h(Host, { key: '1ffd343609151d842c357f2e7663e4c772b8ef5a' }, h("slot", { key: 'f3c73ee49974fb8baa706a9b699fe703166f2f96' })));
+        return (h(Host, { key: 'ae640297aa02dba7d4ca3f43f929ba9149889a3d' }, h("slot", { key: '38c1e1ee0c51c93c79e1f1a8e8c6a95e08760f24' })));
     }
     static get style() { return IxRowStyle0; }
 }, [1, "ix-row"]);

package/components/select-item.js CHANGED Viewed

@@ -53,7 +53,7 @@ const SelectItem = /*@__PURE__*/ proxyCustomElement(class SelectItem extends HTM
         }));
     }
     render() {
-        return (h(Host, { key: '35faa739f5231e8e6b41953779a378a0f2a14b8a' }, h("ix-dropdown-item", { key: 'd4cbca749e7d4515788cf8ed8263ce132ffd68e4', class: {
+        return (h(Host, { key: 'c56aa1ee5e174f9de7905bcaef381e0a8fd212a2' }, h("ix-dropdown-item", { key: '00ec7a1e52a6b17cf94ce702239fef06df0cb936', class: {
                 'select-item-checked': this.selected,
             }, checked: this.selected, label: this.label ? this.label : this.value, onItemClick: (e) => this.onItemClick(e) })));
     }

package/components/select.js CHANGED Viewed

@@ -313,7 +313,7 @@ const Select = /*@__PURE__*/ proxyCustomElement(class Select extends HTMLElement
     }
     render() {
         var _a, _b, _c;
-        return (h(Host, { key: '6536d14cec8d025f31445826ad0f9a9190ea82a6' }, h("div", { key: 'd7721f4ff6861fa35905fe58718cd3dbc789ad9e', class: {
+        return (h(Host, { key: '2a59659f35973f2297d3b34cb0ae84c3e5d80c04' }, h("div", { key: 'cca889f2ba4c3db6e74a65fd21d9ca7428e9dc52', class: {
                 select: true,
                 disabled: this.disabled,
                 readonly: this.readonly,
@@ -321,13 +321,13 @@ const Select = /*@__PURE__*/ proxyCustomElement(class Select extends HTMLElement
                 this.dropdownAnchor = ref;
                 if (!this.editable)
                     this.dropdownWrapperRef = ref;
-            } }, h("div", { key: '5457a0d20ad7242cd846eed525c5b0b16ac0d83d', class: "input-container" }, h("div", { key: '0ef7de5167e84c91cd37b2173712a5ffb4cb8098', class: "chips" }, this.isMultipleMode
+            } }, h("div", { key: '98ca1de8783cd95db76d969bade2aa2078c8224f', class: "input-container" }, h("div", { key: '4d4ac31033855345467e355f168a5ce7e47ce8c6', class: "chips" }, this.isMultipleMode
             ? (_a = this.selectedItems) === null || _a === void 0 ? void 0 : _a.map((item) => (h("ix-filter-chip", { disabled: this.disabled || this.readonly, key: item.value, onCloseClick: (e) => {
                     e.preventDefault();
                     e.stopPropagation();
                     this.itemClick(item.value);
                 } }, item.label)))
-            : '', h("div", { key: '1a892994b8edac949885b740fad4bd3f8aa41db2', class: "trigger" }, h("input", { key: 'd20af5812e4ddb15b641f4ab2e8397263a1ce3e1', autocomplete: "off", "data-testid": "input", disabled: this.disabled, readOnly: this.readonly, type: "text", class: {
+            : '', h("div", { key: 'd50bab808cbf2bd146c39052f7f008f94ad93f70', class: "trigger" }, h("input", { key: '1b91bbc00aed4ec69543d3e4c3fe1eff00c87c90', autocomplete: "off", "data-testid": "input", disabled: this.disabled, readOnly: this.readonly, type: "text", class: {
                 'allow-clear': this.allowClear && !!((_b = this.selectedLabels) === null || _b === void 0 ? void 0 : _b.length),
             }, placeholder: this.placeholderValue(), value: this.inputValue, ref: (ref) => (this.inputRef = ref), onBlur: (e) => this.onInputBlur(e), onFocus: () => {
                 this.navigationItem = undefined;
@@ -339,16 +339,16 @@ const Select = /*@__PURE__*/ proxyCustomElement(class Select extends HTMLElement
             } })) : null, this.disabled || this.readonly ? null : (h("ix-icon-button", { "data-select-dropdown": true, class: { 'dropdown-visible': this.dropdownShow }, icon: "chevron-down-small", ghost: true, ref: (ref) => {
                 if (this.editable)
                     this.dropdownWrapperRef = ref;
-            } })))))), h("ix-dropdown", { key: 'f9e3c1b810945146435b4b8a375b502cc35a722e', ref: (ref) => (this.dropdownRef = ref), show: this.dropdownShow, closeBehavior: this.isMultipleMode ? 'outside' : 'both', class: {
+            } })))))), h("ix-dropdown", { key: '3feb553427991c96b45b49aecce64de203846902', ref: (ref) => (this.dropdownRef = ref), show: this.dropdownShow, closeBehavior: this.isMultipleMode ? 'outside' : 'both', class: {
                 'd-none': this.disabled || this.readonly,
             }, anchor: this.dropdownAnchor, trigger: this.dropdownWrapperRef, onShowChanged: (e) => this.dropdownVisibilityChanged(e), placement: "bottom-start", overwriteDropdownStyle: async () => {
                 return {
                     minWidth: `${this.hostElement.clientWidth}px`,
                 };
-            } }, h("div", { key: 'f313946bf9c83f52f15e2ffee4239f67220dea36', class: {
+            } }, h("div", { key: '3c07355d8c3ebcc3a5f180ac8acf57297f9768ac', class: {
                 'select-list-header': true,
                 hidden: this.hideListHeader || this.isDropdownEmpty,
-            }, title: this.i18nSelectListHeader }, this.i18nSelectListHeader), h("slot", { key: '89f489aac0cc3851dc7c946a512c1a58a7e8ae10' }), h("div", { key: '5f05d541f64e404a47947385f1f8ff70eaa8baad', ref: (ref) => (this.addItemRef = ref), class: "d-contents" }), this.isAddItemVisible() ? (h("ix-dropdown-item", { "data-testid": "add-item", icon: 'plus', class: {
+            }, title: this.i18nSelectListHeader }, this.i18nSelectListHeader), h("slot", { key: '2bb33255f9a58b647d0897e8ff1b38fa6aba888b' }), h("div", { key: '2e9bcf50f2a45e292103e4a201d421ad904becd2', ref: (ref) => (this.addItemRef = ref), class: "d-contents" }), this.isAddItemVisible() ? (h("ix-dropdown-item", { "data-testid": "add-item", icon: 'plus', class: {
                 'add-item': true,
             }, label: this.inputFilterText, onItemClick: (e) => {
                 e.preventDefault();

package/components/spinner.js CHANGED Viewed

@@ -13,7 +13,7 @@ const Spinner = /*@__PURE__*/ proxyCustomElement(class Spinner extends HTMLEleme
         this.hideTrack = false;
     }
     render() {
-        return (h(Host, { key: '6ca735841b5d203cf8ef66f8675f73d2988d7518', class: {
+        return (h(Host, { key: '764ff87a7fd663a12419610e551a54778bd7700a', class: {
                 primary: this.variant === 'primary',
                 'xx-small': this.size === 'xx-small',
                 'x-small': this.size === 'x-small',

package/components/tabs.js CHANGED Viewed

@@ -220,13 +220,13 @@ const Tabs = /*@__PURE__*/ proxyCustomElement(class Tabs extends HTMLElement {
         });
     }
     render() {
-        return (h(Host, { key: 'd78a0e8848762853905f0a00ad0e29eb8010f058' }, h("div", { key: '81f8018608a4ead1b07a2c8dbc275f3e6b1a4f9f', class: "arrow", "data-arrow-left": true, onClick: () => this.move(this.scrollAmount, true) }, h("ix-icon", { key: '74ac11767dded217d438e58f3d9af659b5f7913c', name: 'chevron-left-small' })), h("div", { key: '22172b312ee82c63c590780030766262d5655be3', class: {
+        return (h(Host, { key: '44c009492a3faabd3dc4266f6a4070037f590caa' }, h("div", { key: 'c002c0b7c606bf6dd37738f2c8b233ed0556ae24', class: "arrow", "data-arrow-left": true, onClick: () => this.move(this.scrollAmount, true) }, h("ix-icon", { key: '30291a5baf33ad74ca4d4cdd52aa3de6fdaac6f5', name: 'chevron-left-small' })), h("div", { key: 'fd0842c04c463afb21e29bfb64a32189550204f0', class: {
                 'tab-items': true,
                 'overflow-shadow': true,
                 'shadow-left': this.showPreviousArrow(),
                 'shadow-right': this.showNextArrow(),
                 'shadow-both': this.showNextArrow() && this.showPreviousArrow(),
-            } }, h("div", { key: '31a8df74124a12d6abc6e3af8c45e2f59c9e8e7f', class: "items-content" }, h("slot", { key: '0a37dea0573b5123c6de66831c028401d1da86b4' }))), h("div", { key: 'cd946069a8dbb2708bc90923c2bb8a897eeaf3b5', class: "arrow right", "data-arrow-right": true, onClick: () => this.move(-this.scrollAmount, true) }, h("ix-icon", { key: '3542fc3e7cba8477f2367492620dc16cdaecbad8', name: 'chevron-right-small' }))));
+            } }, h("div", { key: 'b62dda398149a5eef215992b4a9ce5e297fa803f', class: "items-content" }, h("slot", { key: '0383abae773ba6f7f5b4ebd9e76b4a20c9a18732' }))), h("div", { key: '7ef4269bac60f31a97ae5affa4574bbab4ba2726', class: "arrow right", "data-arrow-right": true, onClick: () => this.move(-this.scrollAmount, true) }, h("ix-icon", { key: '9071de44d99c4650f6ad432b40ca6592e4fa9045', name: 'chevron-right-small' }))));
     }
     get hostElement() { return this; }
     static get style() { return IxTabsStyle0; }

package/components/toast.js CHANGED Viewed

@@ -53,11 +53,11 @@ const Toast = /*@__PURE__*/ proxyCustomElement(class Toast extends HTMLElement {
             animationPlayState: this.touched ? 'paused' : 'running',
         };
         progressBarClass.push('toast-progress-bar--animated');
-        return (h(Host, { key: '810bc3df901d56ca3993af891568cd1b29f8249c', class: "animate__animated animate__fadeIn" }, h("div", { key: 'ce9b3e2af4353748c500b1449c66632c41a3c19f', class: "toast-body", onPointerLeave: () => {
+        return (h(Host, { key: 'fc536c407da22e873ddd6b0c57ff1a33f031fff3', class: "animate__animated animate__fadeIn" }, h("div", { key: '364d9a603523b34526abbf60b79fc28b4861f551', 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: '9c6ab3a05d61898fa48c2f754056f9cfb998e894', class: "toast-content" }, this.toastTitle ? (h("div", { class: "toast-title" }, this.toastTitle)) : null, h("div", { key: '61c1f3ada793cb475786c8d8016cba948887d1f4', class: "toast-message" }, h("slot", { key: '8f2e0ecd8e067a237730a4b76e37d0efb573c834' }))), h("div", { key: 'b4657b460bbcada73181dfe79f31ec13b5a800ce', class: "toast-close" }, h("ix-icon-button", { key: 'eca72e89cb24c00a20e1d1529665b9c1f68c5160', icon: 'close', size: "24", ghost: true, onClick: () => this.closeToast.emit() }))), this.autoClose ? (h("div", { class: progressBarClass.join(' '), style: progressBarStyle, onAnimationEnd: () => {
+            } }, this.type || this.icon ? (h("div", { class: "toast-icon" }, this.getIcon())) : null, h("div", { key: 'a428a1d86aade38d43d14c7a6045ec0132346f1d', class: "toast-content" }, this.toastTitle ? (h("div", { class: "toast-title" }, this.toastTitle)) : null, h("div", { key: 'ba2928faa70dc5deb313f5e5bda49c7413be0c1d', class: "toast-message" }, h("slot", { key: '5af45c142c3812239d9874448b584bd8364b50ec' }))), h("div", { key: 'cf9b6eb78786400f372c473cd3e6e6d168dd07c3', class: "toast-close" }, h("ix-icon-button", { key: '7adbc3c276e209a906f1e1a224cba994fbaacbad', icon: 'close', size: "24", ghost: true, onClick: () => this.closeToast.emit() }))), this.autoClose ? (h("div", { class: progressBarClass.join(' '), style: progressBarStyle, onAnimationEnd: () => {
                 this.close();
             }, onTransitionEnd: () => {
                 if (this.progress === 0) {

package/components/tooltip.js CHANGED Viewed

@@ -17,13 +17,11 @@ var __decorate = (undefined && undefined.__decorate) || function (decorators, ta
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
 const numberToPixel = (value) => (value != null ? `${value}px` : '');
-let sequentialInstanceId = 0;
 const Tooltip = /*@__PURE__*/ proxyCustomElement(class Tooltip extends HTMLElement {
     constructor() {
         super();
         this.__registerHost();
         this.__attachShadow();
-        this.id = ++sequentialInstanceId;
         this.onEnterElementBind = this.onTooltipShow.bind(this);
         this.onLeaveElementBind = this.onTooltipHide.bind(this);
         this.tooltipCloseTimeInMS = 50;
@@ -137,25 +135,22 @@ const Tooltip = /*@__PURE__*/ proxyCustomElement(class Tooltip extends HTMLEleme
     queryAnchorElements() {
         return Array.from(document.querySelectorAll(this.for));
     }
-    updateAriaDescribedBy(element, describedBy) {
-        const oldDescribedBy = element.getAttribute('aria-describedby');
-        if ((oldDescribedBy === null || oldDescribedBy === void 0 ? void 0 : oldDescribedBy.indexOf(describedBy)) != -1) {
-            return;
-        }
-        const newDescribedBy = `${oldDescribedBy} ${describedBy}`;
-        element.setAttribute('aria-describedby', newDescribedBy);
-    }
-    getTooltipId() {
-        return this.hostElement.id || 'ix-tooltip-' + this.id;
-    }
     registerTriggerListener() {
-        const elements = this.queryAnchorElements();
-        elements.forEach((e) => {
-            e.addEventListener('mouseenter', this.onEnterElementBind);
-            e.addEventListener('mouseleave', this.onLeaveElementBind);
-            e.addEventListener('focusin', this.onEnterElementBind);
-            e.addEventListener('focusout', this.onLeaveElementBind);
-            this.updateAriaDescribedBy(e, this.getTooltipId());
+        const triggerElementList = this.queryAnchorElements();
+        if (this.disposeListener) {
+            this.disposeListener();
+        }
+        triggerElementList.forEach((element) => {
+            element.addEventListener('mouseenter', this.onEnterElementBind);
+            element.addEventListener('mouseleave', this.onLeaveElementBind);
+            element.addEventListener('focusin', this.onEnterElementBind);
+            element.addEventListener('focusout', this.onLeaveElementBind);
+            this.disposeListener = () => {
+                element.removeEventListener('mouseenter', this.onEnterElementBind);
+                element.removeEventListener('mouseleave', this.onLeaveElementBind);
+                element.removeEventListener('focusin', this.onEnterElementBind);
+                element.removeEventListener('focusout', this.onLeaveElementBind);
+            };
         });
     }
     registerTooltipListener() {
@@ -197,9 +192,9 @@ const Tooltip = /*@__PURE__*/ proxyCustomElement(class Tooltip extends HTMLEleme
         const tooltipContentClass = {
             'tooltip-content': true,
         };
-        return (h(Host, { key: '880b3df938f04b1f5c1ff4c9f048cc699ee8ec76', class: {
+        return (h(Host, { key: '8f85f75338cc78b38c6090fb75c9623123894a19', class: {
                 visible: this.visible,
-            }, id: this.getTooltipId(), role: "tooltip" }, h("div", { key: '96ba08a6f141815be165b4917bc4fffde3d160b4', class: 'tooltip-title' }, h("slot", { key: '28121179a33c5720f3095ab42a7cc5c2b4522250', name: "title-icon" }), h("ix-typography", { key: 'dba156abc4e07032f7329ff083e89df41126d1a7', variant: "default-title" }, this.titleContent, h("slot", { key: '514c22948dc96e8d16b12e390ce57dee32d17491', name: "title-content" }))), h("div", { key: '2d88d2f84e42bac7284cb7cc84ea9e6554034bbd', class: tooltipContentClass }, h("slot", { key: 'bb79e6141a6749c171b892552d74931414ef5daf' })), h("div", { key: '2a29893e37cfbb8749f02833ee7edd45dd449a4d', class: "arrow" })));
+            }, role: "tooltip" }, h("div", { key: '875b514167bfe9f7186c86d2a746e16c4425d833', class: 'tooltip-title' }, h("slot", { key: '0cd77bf05e8dfd1a37d71b44f66eed1847743856', name: "title-icon" }), h("ix-typography", { key: '50db3d851852796ba8bd247eefd10d7c9d3920a3', variant: "default-title" }, this.titleContent, h("slot", { key: '5b26a7a70f46036fc7f041b7d2f8a6742dc92cf4', name: "title-content" }))), h("div", { key: '6b161d389cae7f6e30ee047d78cfb90bd6f70b4e', class: tooltipContentClass }, h("slot", { key: '3c1b118a9ee09de941547d5171d8201f1d76e739' })), h("div", { key: '269cb211d6c4005e17eb2710f999e8390cd91236', class: "arrow" })));
     }
     get hostElement() { return this; }
     static get style() { return IxTooltipStyle0; }

package/components/tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"tooltip.js","mappings":"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","names":[],"sources":["src/components/tooltip/tooltip.scss?tag=ix-tooltip&encapsulation=shadow","src/components/tooltip/tooltip.tsx"],"sourcesContent":[":host {\n display: inline-block;\n position: fixed;\n left: 0px;\n top: 0px;\n z-index: var(--theme-z-index-tooltip);\n\n max-width: 18.25rem;\n\n opacity: 0;\n visibility: collapse !important;\n overflow-wrap: break-word;\n\n border-radius: 0.25rem;\n background-color: var(--theme-tootlip--background);\n padding: 0.375rem 0.75rem 0.375rem 0.875rem;\n\n box-shadow: var(--theme-shadow-4);\n\n .tooltip-title {\n display: flex;\n align-items: center;\n\n ::slotted(ix-icon) {\n margin-right: 0.35rem;\n }\n }\n}\n\n:host(.visible) {\n opacity: 1;\n visibility: visible !important;\n}\n\n:host(.visible) {\n .arrow,\n .arrow::before {\n position: absolute;\n width: 8px;\n height: 8px;\n background: inherit;\n }\n\n .arrow {\n visibility: hidden;\n }\n\n .arrow::before {\n visibility: visible;\n content: '';\n transform: rotate(45deg);\n background-color: var(--theme-tootlip--background);\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 /\nimport {\n arrow,\n autoUpdate,\n computePosition,\n ComputePositionReturn,\n flip,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport { OnListener } from '../utils/listener';\n\ntype ArrowPosition = {\n top?: string;\n left?: string;\n right?: string;\n};\n\nconst numberToPixel = (value: number) => (value != null ? `${value}px` : '');\n\nlet sequentialInstanceId = 0;\n\n/\n @slot title-icon - Icon of tooltip title\n * @slot title-content - Content of tooltip title\n \n @since 1.4.0\n /\n@Component({\n tag: 'ix-tooltip',\n styleUrl: 'tooltip.scss',\n shadow: true,\n})\nexport class Tooltip {\n /\n CSS selector for hover trigger element e.g. `for=\"[data-my-custom-select]\"`\n /\n @Prop() for: string;\n\n /\n Title of the tooltip\n /\n @Prop() titleContent: string;\n\n /\n Define if the user can access the tooltip via mouse.\n /\n @Prop() interactive = false;\n\n /\n Initial placement of the tooltip. If the placement don\"t have enough space,\n * the tooltip will placed on another location.\n \n @since 1.5.0\n /\n @Prop() placement: 'top' \| 'right' \| 'bottom' \| 'left' = 'top';\n\n /* @internal /\n @Prop() animationFrame = false;\n\n @State() visible = false;\n\n @Element() hostElement: HTMLIxTooltipElement;\n\n private id = ++sequentialInstanceId;\n private observer: MutationObserver;\n private hideTooltipTimeout: NodeJS.Timeout;\n private onEnterElementBind = this.onTooltipShow.bind(this);\n private onLeaveElementBind = this.onTooltipHide.bind(this);\n private disposeAutoUpdate?: () => void;\n private tooltipCloseTimeInMS = 50;\n\n private get arrowElement() {\n return this.hostElement.shadowRoot.querySelector('.arrow') as HTMLElement;\n }\n\n private destroyAutoUpdate() {\n if (this.disposeAutoUpdate !== undefined) {\n this.disposeAutoUpdate();\n }\n }\n\n private onTooltipShow(e: Event) {\n this.showTooltip(e.target as Element);\n }\n\n private onTooltipHide() {\n this.hideTooltip();\n }\n\n /* @internal /\n @Method()\n async showTooltip(anchorElement: any) {\n clearTimeout(this.hideTooltipTimeout);\n await this.computeTooltipPosition(anchorElement);\n this.visible = true;\n }\n\n /* @internal */\n @Method()\n async hideTooltip() {\n this.hideTooltipTimeout = setTimeout(() => {\n this.visible = false;\n }, this.tooltipCloseTimeInMS);\n this.destroyAutoUpdate();\n }\n\n private computeArrowPosition({\n placement,\n middlewareData,\n }: ComputePositionReturn): ArrowPosition {\n let { x, y } = middlewareData.arrow;\n\n if (placement.startsWith('top')) {\n return {\n left: numberToPixel(x),\n top: numberToPixel(y),\n };\n }\n\n if (placement.startsWith('right')) {\n return {\n left: numberToPixel(-4),\n top: numberToPixel(y),\n };\n }\n\n if (placement.startsWith('bottom')) {\n return {\n left: numberToPixel(x),\n top: numberToPixel(-4),\n };\n }\n\n if (placement.startsWith('left')) {\n return {\n right: numberToPixel(-4),\n top: numberToPixel(y),\n };\n }\n }\n\n private async computeTooltipPosition(target: Element) {\n if (!target) {\n return;\n }\n\n return new Promise<void>((resolve) => {\n this.disposeAutoUpdate = autoUpdate(\n target,\n this.hostElement,\n async () => {\n setTimeout(async () => {\n const computeResponse = await computePosition(\n target,\n this.hostElement,\n {\n strategy: 'fixed',\n placement: this.placement,\n middleware: [\n shift(),\n offset(8),\n arrow({\n element: this.arrowElement,\n }),\n flip({\n fallbackStrategy: 'initialPlacement',\n padding: 10,\n }),\n ],\n }\n );\n\n if (computeResponse.middlewareData.arrow) {\n const arrowPosition = this.computeArrowPosition(computeResponse);\n Object.assign(this.arrowElement.style, arrowPosition);\n }\n\n const { x, y } = computeResponse;\n Object.assign(this.hostElement.style, {\n left: x !== null ? `${x}px` : '',\n top: y !== null ? `${y}px` : '',\n });\n\n resolve();\n });\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n animationFrame: this.animationFrame,\n }\n );\n });\n }\n\n private clearHideTimeout() {\n if (this.interactive) {\n clearTimeout(this.hideTooltipTimeout);\n }\n }\n\n private queryAnchorElements() {\n return Array.from(document.querySelectorAll(this.for));\n }\n\n private updateAriaDescribedBy(element: Element, describedBy: string) {\n const oldDescribedBy = element.getAttribute('aria-describedby');\n\n if (oldDescribedBy?.indexOf(describedBy) != -1) {\n return;\n }\n\n const newDescribedBy = `${oldDescribedBy} ${describedBy}`;\n element.setAttribute('aria-describedby', newDescribedBy);\n }\n\n private getTooltipId() {\n return this.hostElement.id \|\| 'ix-tooltip-' + this.id;\n }\n\n private registerTriggerListener() {\n const elements = this.queryAnchorElements();\n elements.forEach((e) => {\n e.addEventListener('mouseenter', this.onEnterElementBind);\n e.addEventListener('mouseleave', this.onLeaveElementBind);\n e.addEventListener('focusin', this.onEnterElementBind);\n e.addEventListener('focusout', this.onLeaveElementBind);\n this.updateAriaDescribedBy(e, this.getTooltipId());\n });\n }\n\n private registerTooltipListener() {\n const { hostElement } = this;\n hostElement.addEventListener('mouseenter', () => this.clearHideTimeout());\n hostElement.addEventListener('focusin', () => this.clearHideTimeout());\n hostElement.addEventListener('mouseleave', () => this.onTooltipHide());\n hostElement.addEventListener('focusout', () => this.onTooltipHide());\n }\n\n @OnListener<Tooltip>('keydown', (self) => self.visible)\n async onKeydown(event: KeyboardEvent) {\n if (event.code === 'Escape') {\n this.onTooltipHide();\n }\n }\n\n componentWillLoad() {\n this.registerTriggerListener();\n }\n\n componentDidLoad() {\n if (this.interactive) {\n this.tooltipCloseTimeInMS = 150;\n }\n\n this.observer = new MutationObserver(() => {\n this.registerTriggerListener();\n });\n\n this.observer.observe(document.body, {\n attributes: true,\n attributeFilter: ['data-ix-tooltip'],\n childList: true,\n subtree: true,\n });\n\n this.registerTooltipListener();\n }\n\n disconnectedCallback() {\n this.observer?.disconnect();\n this.destroyAutoUpdate();\n }\n\n render() {\n const tooltipContentClass = {\n 'tooltip-content': true,\n };\n\n return (\n <Host\n class={{\n visible: this.visible,\n }}\n id={this.getTooltipId()}\n role=\"tooltip\"\n >\n <div class={'tooltip-title'}>\n <slot name=\"title-icon\"></slot>\n <ix-typography variant=\"default-title\">\n {this.titleContent}\n <slot name=\"title-content\"></slot>\n </ix-typography>\n </div>\n <div class={tooltipContentClass}>\n <slot></slot>\n </div>\n <div class=\"arrow\"></div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"tooltip.js","mappings":"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","names":[],"sources":["src/components/tooltip/tooltip.scss?tag=ix-tooltip&encapsulation=shadow","src/components/tooltip/tooltip.tsx"],"sourcesContent":[":host {\n display: inline-block;\n position: fixed;\n left: 0px;\n top: 0px;\n z-index: var(--theme-z-index-tooltip);\n\n max-width: 18.25rem;\n\n opacity: 0;\n visibility: collapse !important;\n overflow-wrap: break-word;\n\n border-radius: 0.25rem;\n background-color: var(--theme-tootlip--background);\n padding: 0.375rem 0.75rem 0.375rem 0.875rem;\n\n box-shadow: var(--theme-shadow-4);\n\n .tooltip-title {\n display: flex;\n align-items: center;\n\n ::slotted(ix-icon) {\n margin-right: 0.35rem;\n }\n }\n}\n\n:host(.visible) {\n opacity: 1;\n visibility: visible !important;\n}\n\n:host(.visible) {\n .arrow,\n .arrow::before {\n position: absolute;\n width: 8px;\n height: 8px;\n background: inherit;\n }\n\n .arrow {\n visibility: hidden;\n }\n\n .arrow::before {\n visibility: visible;\n content: '';\n transform: rotate(45deg);\n background-color: var(--theme-tootlip--background);\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 /\nimport {\n arrow,\n autoUpdate,\n computePosition,\n ComputePositionReturn,\n flip,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport { OnListener } from '../utils/listener';\n\ntype ArrowPosition = {\n top?: string;\n left?: string;\n right?: string;\n};\n\nconst numberToPixel = (value: number) => (value != null ? `${value}px` : '');\n\n/\n @slot title-icon - Icon of tooltip title\n * @slot title-content - Content of tooltip title\n \n @since 1.4.0\n /\n@Component({\n tag: 'ix-tooltip',\n styleUrl: 'tooltip.scss',\n shadow: true,\n})\nexport class Tooltip {\n /\n CSS selector for hover trigger element e.g. `for=\"[data-my-custom-select]\"`\n /\n @Prop() for: string;\n\n /\n Title of the tooltip\n /\n @Prop() titleContent: string;\n\n /\n Define if the user can access the tooltip via mouse.\n /\n @Prop() interactive = false;\n\n /\n Initial placement of the tooltip. If the placement don\"t have enough space,\n * the tooltip will placed on another location.\n \n @since 1.5.0\n /\n @Prop() placement: 'top' \| 'right' \| 'bottom' \| 'left' = 'top';\n\n /* @internal /\n @Prop() animationFrame = false;\n\n @State() visible = false;\n\n @Element() hostElement: HTMLIxTooltipElement;\n\n private observer: MutationObserver;\n private hideTooltipTimeout: NodeJS.Timeout;\n private onEnterElementBind = this.onTooltipShow.bind(this);\n private onLeaveElementBind = this.onTooltipHide.bind(this);\n private disposeAutoUpdate?: () => void;\n private tooltipCloseTimeInMS = 50;\n\n private disposeListener: Function;\n\n private get arrowElement() {\n return this.hostElement.shadowRoot.querySelector('.arrow') as HTMLElement;\n }\n\n private destroyAutoUpdate() {\n if (this.disposeAutoUpdate !== undefined) {\n this.disposeAutoUpdate();\n }\n }\n\n private onTooltipShow(e: Event) {\n this.showTooltip(e.target as Element);\n }\n\n private onTooltipHide() {\n this.hideTooltip();\n }\n\n /* @internal /\n @Method()\n async showTooltip(anchorElement: any) {\n clearTimeout(this.hideTooltipTimeout);\n await this.computeTooltipPosition(anchorElement);\n this.visible = true;\n }\n\n /* @internal */\n @Method()\n async hideTooltip() {\n this.hideTooltipTimeout = setTimeout(() => {\n this.visible = false;\n }, this.tooltipCloseTimeInMS);\n this.destroyAutoUpdate();\n }\n\n private computeArrowPosition({\n placement,\n middlewareData,\n }: ComputePositionReturn): ArrowPosition {\n let { x, y } = middlewareData.arrow;\n\n if (placement.startsWith('top')) {\n return {\n left: numberToPixel(x),\n top: numberToPixel(y),\n };\n }\n\n if (placement.startsWith('right')) {\n return {\n left: numberToPixel(-4),\n top: numberToPixel(y),\n };\n }\n\n if (placement.startsWith('bottom')) {\n return {\n left: numberToPixel(x),\n top: numberToPixel(-4),\n };\n }\n\n if (placement.startsWith('left')) {\n return {\n right: numberToPixel(-4),\n top: numberToPixel(y),\n };\n }\n }\n\n private async computeTooltipPosition(target: Element) {\n if (!target) {\n return;\n }\n\n return new Promise<void>((resolve) => {\n this.disposeAutoUpdate = autoUpdate(\n target,\n this.hostElement,\n async () => {\n setTimeout(async () => {\n const computeResponse = await computePosition(\n target,\n this.hostElement,\n {\n strategy: 'fixed',\n placement: this.placement,\n middleware: [\n shift(),\n offset(8),\n arrow({\n element: this.arrowElement,\n }),\n flip({\n fallbackStrategy: 'initialPlacement',\n padding: 10,\n }),\n ],\n }\n );\n\n if (computeResponse.middlewareData.arrow) {\n const arrowPosition = this.computeArrowPosition(computeResponse);\n Object.assign(this.arrowElement.style, arrowPosition);\n }\n\n const { x, y } = computeResponse;\n Object.assign(this.hostElement.style, {\n left: x !== null ? `${x}px` : '',\n top: y !== null ? `${y}px` : '',\n });\n\n resolve();\n });\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n animationFrame: this.animationFrame,\n }\n );\n });\n }\n\n private clearHideTimeout() {\n if (this.interactive) {\n clearTimeout(this.hideTooltipTimeout);\n }\n }\n\n private queryAnchorElements() {\n return Array.from(document.querySelectorAll(this.for));\n }\n\n private registerTriggerListener() {\n const triggerElementList = this.queryAnchorElements();\n\n if (this.disposeListener) {\n this.disposeListener();\n }\n\n triggerElementList.forEach((element) => {\n element.addEventListener('mouseenter', this.onEnterElementBind);\n element.addEventListener('mouseleave', this.onLeaveElementBind);\n element.addEventListener('focusin', this.onEnterElementBind);\n element.addEventListener('focusout', this.onLeaveElementBind);\n\n this.disposeListener = () => {\n element.removeEventListener('mouseenter', this.onEnterElementBind);\n element.removeEventListener('mouseleave', this.onLeaveElementBind);\n element.removeEventListener('focusin', this.onEnterElementBind);\n element.removeEventListener('focusout', this.onLeaveElementBind);\n };\n });\n }\n\n private registerTooltipListener() {\n const { hostElement } = this;\n hostElement.addEventListener('mouseenter', () => this.clearHideTimeout());\n hostElement.addEventListener('focusin', () => this.clearHideTimeout());\n hostElement.addEventListener('mouseleave', () => this.onTooltipHide());\n hostElement.addEventListener('focusout', () => this.onTooltipHide());\n }\n\n @OnListener<Tooltip>('keydown', (self) => self.visible)\n async onKeydown(event: KeyboardEvent) {\n if (event.code === 'Escape') {\n this.onTooltipHide();\n }\n }\n\n componentWillLoad() {\n this.registerTriggerListener();\n }\n\n componentDidLoad() {\n if (this.interactive) {\n this.tooltipCloseTimeInMS = 150;\n }\n\n this.observer = new MutationObserver(() => {\n this.registerTriggerListener();\n });\n\n this.observer.observe(document.body, {\n attributes: true,\n attributeFilter: ['data-ix-tooltip'],\n childList: true,\n subtree: true,\n });\n\n this.registerTooltipListener();\n }\n\n disconnectedCallback() {\n this.observer?.disconnect();\n this.destroyAutoUpdate();\n }\n\n render() {\n const tooltipContentClass = {\n 'tooltip-content': true,\n };\n\n return (\n <Host\n class={{\n visible: this.visible,\n }}\n role=\"tooltip\"\n >\n <div class={'tooltip-title'}>\n <slot name=\"title-icon\"></slot>\n <ix-typography variant=\"default-title\">\n {this.titleContent}\n <slot name=\"title-content\"></slot>\n </ix-typography>\n </div>\n <div class={tooltipContentClass}>\n <slot></slot>\n </div>\n <div class=\"arrow\"></div>\n </Host>\n );\n }\n}\n"],"version":3}

package/components/tree-item.js CHANGED Viewed

@@ -16,16 +16,16 @@ const TreeItem = /*@__PURE__*/ proxyCustomElement(class TreeItem extends HTMLEle
     }
     render() {
         var _a, _b, _c;
-        return (h(Host, { key: '99e897ca5c1340a85b8cadcfa8810860ebc2225a', class: {
+        return (h(Host, { key: 'ba0c464b633cb3ca1ed0c5690245c1a69612e7fb', class: {
                 selected: (_a = this.context) === null || _a === void 0 ? void 0 : _a.isSelected,
-            } }, h("div", { key: '065d1d4f45a0a99645607078585ed430bf9d9a2b', class: "icon-toggle-container", onClick: (e) => {
+            } }, h("div", { key: 'b94962dfd5d8be52ae6dab6b209d7f235dc2fc97', class: "icon-toggle-container", onClick: (e) => {
                 e.preventDefault();
                 this.toggle.emit();
             } }, this.hasChildren ? (h("ix-icon", { name: 'chevron-right', size: "16", class: {
                 ['icon-toggle-down']: (_b = this.context) === null || _b === void 0 ? void 0 : _b.isExpanded,
-            }, color: `color-${((_c = this.context) === null || _c === void 0 ? void 0 : _c.isExpanded) ? 'primary' : 'std-text'}` })) : null), h("div", { key: 'db08394f2be510f16a937a13224c7c57e7cf76ed', class: "tree-node-container", onClick: () => {
+            }, color: `color-${((_c = this.context) === null || _c === void 0 ? void 0 : _c.isExpanded) ? 'primary' : 'std-text'}` })) : null), h("div", { key: 'ec90acd5573bbb23978666fc9e43e4c107d35ce1', class: "tree-node-container", onClick: () => {
                 this.itemClick.emit();
-            } }, this.text, h("slot", { key: 'b0cbaa0b26cdfcd32ec5d0a1e262abfd5e3f401a' }))));
+            } }, this.text, h("slot", { key: 'd70e947ceceeb7ecef901da3bc48ba58f898d419' }))));
     }
     static get style() { return IxTreeItemStyle0; }
 }, [1, "ix-tree-item", {

package/dist/cjs/{base-button-86ed26da.js → base-button-2d5bec30.js} RENAMED Viewed

@@ -1,6 +1,6 @@
 'use strict';
-const index = require('./index-ace435aa.js');
+const index = require('./index-7bcb694d.js');
 /*
  * SPDX-FileCopyrightText: 2023 Siemens AG
@@ -47,4 +47,4 @@ function BaseButton(props, children) {
 exports.BaseButton = BaseButton;
 exports.getButtonClasses = getButtonClasses;
-//# sourceMappingURL=base-button-86ed26da.js.map
+//# sourceMappingURL=base-button-2d5bec30.js.map

package/dist/cjs/{base-button-86ed26da.js.map → base-button-2d5bec30.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"base-button-~~86ed26da~~.js","mappings":";;;;AAAA;;;;;;;;AAcA,MAAM,SAAS,GAAG,CAAC,OAAe;IAChC,OAAO,OAAO,CAAC,WAAW,EAAE,KAAK,SAAS,CAAC,WAAW,EAAE,CAAC;AAC3D,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,OAAe;IAClC,OAAO,OAAO,CAAC,WAAW,EAAE,KAAK,WAAW,CAAC,WAAW,EAAE,CAAC;AAC7D,CAAC,CAAC;MAEW,gBAAgB,GAAG,CAC9B,OAAsB,EACtB,OAAgB,EAChB,KAAc,EACd,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAiB,EACjB,QAAiB;IAEjB,OAAO;QACL,GAAG,EAAE,IAAI;QACT,aAAa,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,KAAK;QACvD,qBAAqB,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC,KAAK;QAC9D,uBAAuB,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,KAAK;QAChE,eAAe,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,KAAK;QAC3D,uBAAuB,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC,KAAK;QAClE,yBAAyB,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,KAAK;QACpE,UAAU,EAAE,QAAQ;QACpB,UAAU,EAAE,QAAQ;QACpB,QAAQ,EAAE,QAAQ;QAClB,QAAQ,EAAE,QAAQ;KACnB,CAAC;AACJ,EAAE;SAuBc,UAAU,CAAC,KAAsB,EAAE,QAAQ;;IACzD,MAAM,YAAY,GAAG,MAAA,KAAK,CAAC,YAAY,mCAAI,EAAE,CAAC;IAE9C,QACEA,oCACM,KAAK,CAAC,cAAc,IACxB,OAAO,EAAE,CAAC,CAAQ,MAAM,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,EACrE,QAAQ,EAAE,KAAK,CAAC,QAAQ,GAAG,CAAC,CAAC,GAAG,MAAA,KAAK,CAAC,QAAQ,mCAAI,CAAC,EACnD,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,kCACA,gBAAgB,CACjB,KAAK,CAAC,OAAO,EACb,KAAK,CAAC,OAAO,EACb,KAAK,CAAC,KAAK,EACX,KAAK,CAAC,QAAQ,EACd,KAAK,CAAC,QAAQ,EACd,KAAK,CAAC,QAAQ,EACd,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,OAAO,CAChC,GACE,YAAY;QAGhB,KAAK,CAAC,OAAO,GAAGA,wBAAY,IAAI,EAAC,OAAO,EAAC,SAAS,SAAc,GAAG,IAAI;QACvE,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,IAC3BA,qBACE,KAAK,EAAC,MAAM,EACZ,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,IAAI,EAAE,KAAK,CAAC,QAAe,EAC3B,KAAK,EAAE,KAAK,CAAC,SAAS,GACb,IACT,IAAI;QACRA,iBACE,KAAK,EAAE;gBACL,OAAO,EAAE,IAAI;gBACb,CAAC,WAAW,KAAK,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC,KAAK,CAAC,SAAS;aAClD,IAEA,QAAQ,CACL;QACL,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,CACxC,EACT;AACJ;;;;;","names":["h"],"sources":["src/components/button/base-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 */\nimport { h } from '@stencil/core';\nimport { A11yAttributes } from '../utils/a11y';\nimport { ButtonVariant } from './button';\n\nexport type ButtonAlignment = 'center' \| 'start';\n\nconst isPrimary = (variant: string) => {\n return variant.toUpperCase() === 'Primary'.toUpperCase();\n};\n\nconst isSecondary = (variant: string) => {\n return variant.toUpperCase() === 'Secondary'.toUpperCase();\n};\n\nexport const getButtonClasses = (\n variant: ButtonVariant,\n outline: boolean,\n ghost: boolean,\n iconOnly = false,\n iconOval = false,\n selected: boolean,\n disabled: boolean\n) => {\n return {\n btn: true,\n 'btn-primary': isPrimary(variant) && !outline && !ghost,\n 'btn-outline-primary': isPrimary(variant) && outline && !ghost,\n 'btn-invisible-primary': isPrimary(variant) && !outline && ghost,\n 'btn-secondary': isSecondary(variant) && !outline && !ghost,\n 'btn-outline-secondary': isSecondary(variant) && outline && !ghost,\n 'btn-invisible-secondary': isSecondary(variant) && !outline && ghost,\n 'btn-icon': iconOnly,\n 'btn-oval': iconOval,\n selected: selected,\n disabled: disabled,\n };\n};\n\nexport type BaseButtonProps = {\n type: string;\n variant: ButtonVariant;\n outline: boolean;\n ghost: boolean;\n iconOnly: boolean;\n iconOval: boolean;\n selected: boolean;\n disabled: boolean;\n loading: boolean;\n icon: string;\n onClick?: Function;\n ariaAttributes?: A11yAttributes;\n extraClasses?: { [key: string]: boolean };\n iconSize?: string;\n iconColor?: string;\n alignment?: ButtonAlignment;\n tabIndex?: number;\n afterContent?: any;\n};\n\nexport function BaseButton(props: BaseButtonProps, children) {\n const extraClasses = props.extraClasses ?? {};\n\n return (\n <button\n {...props.ariaAttributes}\n onClick={(e: Event) => (props.onClick ? props.onClick(e) : undefined)}\n tabindex={props.disabled ? -1 : props.tabIndex ?? 0}\n type={props.type}\n class={{\n ...getButtonClasses(\n props.variant,\n props.outline,\n props.ghost,\n props.iconOnly,\n props.iconOval,\n props.selected,\n props.disabled \|\| props.loading\n ),\n ...extraClasses,\n }}\n >\n {props.loading ? <ix-spinner size=\"small\" hideTrack></ix-spinner> : null}\n {props.icon && !props.loading ? (\n <ix-icon\n class=\"icon\"\n name={props.icon}\n size={props.iconSize as any}\n color={props.iconColor}\n ></ix-icon>\n ) : null}\n <div\n class={{\n content: true,\n [`content-${props.alignment}`]: !!props.alignment,\n }}\n >\n {children}\n </div>\n {props.afterContent ? props.afterContent : null}\n </button>\n );\n}\n"],"version":3}
1	+ {"file":"base-button-2d5bec30.js","mappings":";;;;AAAA;;;;;;;;AAcA,MAAM,SAAS,GAAG,CAAC,OAAe;IAChC,OAAO,OAAO,CAAC,WAAW,EAAE,KAAK,SAAS,CAAC,WAAW,EAAE,CAAC;AAC3D,CAAC,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,OAAe;IAClC,OAAO,OAAO,CAAC,WAAW,EAAE,KAAK,WAAW,CAAC,WAAW,EAAE,CAAC;AAC7D,CAAC,CAAC;MAEW,gBAAgB,GAAG,CAC9B,OAAsB,EACtB,OAAgB,EAChB,KAAc,EACd,QAAQ,GAAG,KAAK,EAChB,QAAQ,GAAG,KAAK,EAChB,QAAiB,EACjB,QAAiB;IAEjB,OAAO;QACL,GAAG,EAAE,IAAI;QACT,aAAa,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,KAAK;QACvD,qBAAqB,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC,KAAK;QAC9D,uBAAuB,EAAE,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,KAAK;QAChE,eAAe,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,KAAK;QAC3D,uBAAuB,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,OAAO,IAAI,CAAC,KAAK;QAClE,yBAAyB,EAAE,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,IAAI,KAAK;QACpE,UAAU,EAAE,QAAQ;QACpB,UAAU,EAAE,QAAQ;QACpB,QAAQ,EAAE,QAAQ;QAClB,QAAQ,EAAE,QAAQ;KACnB,CAAC;AACJ,EAAE;SAuBc,UAAU,CAAC,KAAsB,EAAE,QAAQ;;IACzD,MAAM,YAAY,GAAG,MAAA,KAAK,CAAC,YAAY,mCAAI,EAAE,CAAC;IAE9C,QACEA,oCACM,KAAK,CAAC,cAAc,IACxB,OAAO,EAAE,CAAC,CAAQ,MAAM,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,SAAS,CAAC,EACrE,QAAQ,EAAE,KAAK,CAAC,QAAQ,GAAG,CAAC,CAAC,GAAG,MAAA,KAAK,CAAC,QAAQ,mCAAI,CAAC,EACnD,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,KAAK,kCACA,gBAAgB,CACjB,KAAK,CAAC,OAAO,EACb,KAAK,CAAC,OAAO,EACb,KAAK,CAAC,KAAK,EACX,KAAK,CAAC,QAAQ,EACd,KAAK,CAAC,QAAQ,EACd,KAAK,CAAC,QAAQ,EACd,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,OAAO,CAChC,GACE,YAAY;QAGhB,KAAK,CAAC,OAAO,GAAGA,wBAAY,IAAI,EAAC,OAAO,EAAC,SAAS,SAAc,GAAG,IAAI;QACvE,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,IAC3BA,qBACE,KAAK,EAAC,MAAM,EACZ,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,IAAI,EAAE,KAAK,CAAC,QAAe,EAC3B,KAAK,EAAE,KAAK,CAAC,SAAS,GACb,IACT,IAAI;QACRA,iBACE,KAAK,EAAE;gBACL,OAAO,EAAE,IAAI;gBACb,CAAC,WAAW,KAAK,CAAC,SAAS,EAAE,GAAG,CAAC,CAAC,KAAK,CAAC,SAAS;aAClD,IAEA,QAAQ,CACL;QACL,KAAK,CAAC,YAAY,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,CACxC,EACT;AACJ;;;;;","names":["h"],"sources":["src/components/button/base-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 */\nimport { h } from '@stencil/core';\nimport { A11yAttributes } from '../utils/a11y';\nimport { ButtonVariant } from './button';\n\nexport type ButtonAlignment = 'center' \| 'start';\n\nconst isPrimary = (variant: string) => {\n return variant.toUpperCase() === 'Primary'.toUpperCase();\n};\n\nconst isSecondary = (variant: string) => {\n return variant.toUpperCase() === 'Secondary'.toUpperCase();\n};\n\nexport const getButtonClasses = (\n variant: ButtonVariant,\n outline: boolean,\n ghost: boolean,\n iconOnly = false,\n iconOval = false,\n selected: boolean,\n disabled: boolean\n) => {\n return {\n btn: true,\n 'btn-primary': isPrimary(variant) && !outline && !ghost,\n 'btn-outline-primary': isPrimary(variant) && outline && !ghost,\n 'btn-invisible-primary': isPrimary(variant) && !outline && ghost,\n 'btn-secondary': isSecondary(variant) && !outline && !ghost,\n 'btn-outline-secondary': isSecondary(variant) && outline && !ghost,\n 'btn-invisible-secondary': isSecondary(variant) && !outline && ghost,\n 'btn-icon': iconOnly,\n 'btn-oval': iconOval,\n selected: selected,\n disabled: disabled,\n };\n};\n\nexport type BaseButtonProps = {\n type: string;\n variant: ButtonVariant;\n outline: boolean;\n ghost: boolean;\n iconOnly: boolean;\n iconOval: boolean;\n selected: boolean;\n disabled: boolean;\n loading: boolean;\n icon: string;\n onClick?: Function;\n ariaAttributes?: A11yAttributes;\n extraClasses?: { [key: string]: boolean };\n iconSize?: string;\n iconColor?: string;\n alignment?: ButtonAlignment;\n tabIndex?: number;\n afterContent?: any;\n};\n\nexport function BaseButton(props: BaseButtonProps, children) {\n const extraClasses = props.extraClasses ?? {};\n\n return (\n <button\n {...props.ariaAttributes}\n onClick={(e: Event) => (props.onClick ? props.onClick(e) : undefined)}\n tabindex={props.disabled ? -1 : props.tabIndex ?? 0}\n type={props.type}\n class={{\n ...getButtonClasses(\n props.variant,\n props.outline,\n props.ghost,\n props.iconOnly,\n props.iconOval,\n props.selected,\n props.disabled \|\| props.loading\n ),\n ...extraClasses,\n }}\n >\n {props.loading ? <ix-spinner size=\"small\" hideTrack></ix-spinner> : null}\n {props.icon && !props.loading ? (\n <ix-icon\n class=\"icon\"\n name={props.icon}\n size={props.iconSize as any}\n color={props.iconColor}\n ></ix-icon>\n ) : null}\n <div\n class={{\n content: true,\n [`content-${props.alignment}`]: !!props.alignment,\n }}\n >\n {children}\n </div>\n {props.afterContent ? props.afterContent : null}\n </button>\n );\n}\n"],"version":3}