npm - @siemens/ix - Versions diffs - 2.6.1 → 2.7.0 - Mend

@siemens/ix 2.6.1 → 2.7.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 (1128) hide show

package/dist/cjs/ix-map-navigation-overlay.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-map-navigation-overlay.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,uBAAuB,GAAG,6qJAA6qJ,CAAC;AAC9sJ,qCAAe,uBAAuB;;MCwBzB,oBAAoB;;;;;;;;;IAiC/B,iBAAiB;QACfA,cAAK,CAAC;YACJ,OAAO,EAAE,IAAI,CAAC,WAAW;YACzB,QAAQ,EAAE,oBAAoB,CAAC,QAAQ;YACvC,cAAc,EAAE,CAAC,CAAC,EAAE,YAAY,CAAC;YACjC,UAAU,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC;YACxB,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;YACf,MAAM,EAAE,aAAa;YACrB,KAAK,EAAE;gBACL,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;aAC7C;SACF,CAAC,CAAC;KACJ;IAEO,YAAY;QAClBA,cAAK,CAAC;YACJ,OAAO,EAAE,IAAI,CAAC,WAAW;YACzB,QAAQ,EAAE,oBAAoB,CAAC,QAAQ;YACvC,cAAc,EAAE,CAAC,YAAY,EAAE,CAAC,CAAC;YACjC,UAAU,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC;YACxB,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;YACf,MAAM,EAAE,YAAY;YACpB,QAAQ,EAAE;gBACR,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;gBACvB,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;aAC1C;SACF,CAAC,CAAC;KACJ;IAED,MAAM;;QACJ,QACEC,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,gBAAgB,IACzBA,kEACE,KAAK,EAAE;gBACL,iBAAiB,EAAE,IAAI;gBACvB,QAAQ,EAAE,CAAC,MAAA,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,MAAM,SAAS;aACvD,EACD,KAAK,EAAE;gBACL,kBAAkB,EAChB,CAAA,MAAA,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK;sBACxB,eAAe,MAAA,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,GAAG;sBAC9C,EAAE;aACT,GACI,EACPA,kEAAK,KAAK,EAAC,wBAAwB,IACjCA,sEAAS,IAAI,EAAC,IAAI,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,GAAY,EAC9CA,mEAAM,KAAK,EAAC,sBAAsB,EAAC,KAAK,EAAE,IAAI,CAAC,IAAI,IAChD,IAAI,CAAC,IAAI,CACL,CACH,EACNA,6EACE,KAAK,EAAC,eAAe,EACrB,KAAK,QACL,IAAI,EAAE,OAAO,EACb,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,GAClB,CACd,EAENA,oEAAa,CACR,EACP;KACH;;;AA/FuB,6BAAQ,GAAG,GAAH,CAAO;;;;;","names":["anime","h","Host"],"sources":["src/components/map-navigation-overlay/map-navigation-overlay.scss?tag=ix-map-navigation-overlay&encapsulation=shadow","src/components/map-navigation-overlay/map-navigation-overlay.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@import 'mixins/shadow-dom/component';\n@import 'common-variables';\n@import 'legacy/fonts';\n@import 'mixins/text-truncation';\n\n:host {\n @include ix-component;\n\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 2;\n top: 0;\n left: 0;\n\n background-color: var(--theme-overlay--background);\n\n .overlay-header {\n display: flex;\n position: relative;\n justify-content: flex-start;\n align-items: center;\n height: 3.5rem;\n\n background-color: var(--theme-overlay-header--background);\n }\n\n .overlay-header-content {\n display: flex;\n align-items: center;\n min-width: 0;\n\n ix-icon {\n margin-inline-start: $default-space;\n color: var(--theme-overlay-header--color);\n }\n\n .overlay-header-title {\n @include text-h2;\n @include ellipsis;\n color: var(--theme-overlay-header--color);\n margin-inline-start: $default-space;\n }\n }\n\n .color-indicator {\n display: inline-block;\n position: relative;\n width: $small-space;\n height: 100%;\n background-color: var(--theme-color-neutral);\n }\n\n .overlay-close {\n margin-inline-start: auto;\n margin-inline-end: $default-space;\n }\n\n .d-none {\n display: none;\n }\n}\n\n:host(.d-none) {\n display: none;\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n} from '@stencil/core';\nimport anime from 'animejs';\n\n@Component({\n tag: 'ix-map-navigation-overlay',\n styleUrl: 'map-navigation-overlay.scss',\n shadow: true,\n})\nexport class MapNavigationOverlay {\n private static readonly slowTime = 500;\n\n @Element() hostElement: HTMLIxMapNavigationOverlayElement;\n\n /\n Title of overlay\n /\n @Prop() name: string;\n\n /\n Icon of overlay\n /\n @Prop() icon: string;\n\n /\n Color of icon\n \n @deprecated since 2.1.0. Use `icon-color`\n /\n // eslint-disable-next-line @stencil-community/reserved-member-names\n @Prop() color: string;\n\n /\n Color of icon\n /\n @Prop() iconColor: string;\n\n /\n Event closed\n */\n @Event() closeClick: EventEmitter;\n\n componentWillLoad() {\n anime({\n targets: this.hostElement,\n duration: MapNavigationOverlay.slowTime,\n backdropFilter: [0, 'blur(1rem)'],\n translateX: ['-4rem', 0],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n this.hostElement.classList.remove('d-none');\n },\n });\n }\n\n private closeOverlay() {\n anime({\n targets: this.hostElement,\n duration: MapNavigationOverlay.slowTime,\n backdropFilter: ['blur(1rem)', 0],\n translateX: [0, '-4rem'],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n this.closeClick.emit();\n this.hostElement.classList.add('d-none');\n },\n });\n }\n\n render() {\n return (\n <Host>\n <div class=\"overlay-header\">\n <div\n class={{\n 'color-indicator': true,\n 'd-none': (this.iconColor ?? this.color) === undefined,\n }}\n style={{\n 'background-color':\n this.iconColor ?? this.color\n ? `var(--theme-${this.iconColor ?? this.color})`\n : '',\n }}\n ></div>\n <div class=\"overlay-header-content\">\n <ix-icon size=\"32\" name={this.icon}></ix-icon>\n <span class=\"overlay-header-title\" title={this.name}>\n {this.name}\n </span>\n </div>\n <ix-icon-button\n class=\"overlay-close\"\n ghost\n icon={'close'}\n size=\"24\"\n onClick={() => this.closeOverlay()}\n ></ix-icon-button>\n </div>\n\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-map-navigation-overlay.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,uBAAuB,GAAG,6qJAA6qJ,CAAC;AAC9sJ,qCAAe,uBAAuB;;MCwBzB,oBAAoB;;;;;;;;;IAiC/B,iBAAiB;QACfA,cAAK,CAAC;YACJ,OAAO,EAAE,IAAI,CAAC,WAAW;YACzB,QAAQ,EAAE,oBAAoB,CAAC,QAAQ;YACvC,cAAc,EAAE,CAAC,CAAC,EAAE,YAAY,CAAC;YACjC,UAAU,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC;YACxB,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;YACf,MAAM,EAAE,aAAa;YACrB,KAAK,EAAE;gBACL,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;aAC7C;SACF,CAAC,CAAC;KACJ;IAEO,YAAY;QAClBA,cAAK,CAAC;YACJ,OAAO,EAAE,IAAI,CAAC,WAAW;YACzB,QAAQ,EAAE,oBAAoB,CAAC,QAAQ;YACvC,cAAc,EAAE,CAAC,YAAY,EAAE,CAAC,CAAC;YACjC,UAAU,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC;YACxB,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;YACf,MAAM,EAAE,YAAY;YACpB,QAAQ,EAAE;gBACR,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;gBACvB,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;aAC1C;SACF,CAAC,CAAC;KACJ;IAED,MAAM;;QACJ,QACEC,QAACC,UAAI,uDACHD,kEAAK,KAAK,EAAC,gBAAgB,IACzBA,kEACE,KAAK,EAAE;gBACL,iBAAiB,EAAE,IAAI;gBACvB,QAAQ,EAAE,CAAC,MAAA,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,MAAM,SAAS;aACvD,EACD,KAAK,EAAE;gBACL,kBAAkB,EAChB,CAAA,MAAA,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK;sBACxB,eAAe,MAAA,IAAI,CAAC,SAAS,mCAAI,IAAI,CAAC,KAAK,GAAG;sBAC9C,EAAE;aACT,GACI,EACPA,kEAAK,KAAK,EAAC,wBAAwB,IACjCA,sEAAS,IAAI,EAAC,IAAI,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,GAAY,EAC9CA,mEAAM,KAAK,EAAC,sBAAsB,EAAC,KAAK,EAAE,IAAI,CAAC,IAAI,IAChD,IAAI,CAAC,IAAI,CACL,CACH,EACNA,6EACE,KAAK,EAAC,eAAe,EACrB,KAAK,QACL,IAAI,EAAE,OAAO,EACb,IAAI,EAAC,IAAI,EACT,OAAO,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,GAClB,CACd,EAENA,oEAAa,CACR,EACP;KACH;;;AA/FuB,6BAAQ,GAAG,GAAH,CAAO;;;;;","names":["anime","h","Host"],"sources":["src/components/map-navigation-overlay/map-navigation-overlay.scss?tag=ix-map-navigation-overlay&encapsulation=shadow","src/components/map-navigation-overlay/map-navigation-overlay.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@import 'mixins/shadow-dom/component';\n@import 'common-variables';\n@import 'legacy/fonts';\n@import 'mixins/text-truncation';\n\n:host {\n @include ix-component;\n\n position: absolute;\n width: 100%;\n height: 100%;\n z-index: 2;\n top: 0;\n left: 0;\n\n background-color: var(--theme-overlay--background);\n\n .overlay-header {\n display: flex;\n position: relative;\n justify-content: flex-start;\n align-items: center;\n height: 3.5rem;\n\n background-color: var(--theme-overlay-header--background);\n }\n\n .overlay-header-content {\n display: flex;\n align-items: center;\n min-width: 0;\n\n ix-icon {\n margin-inline-start: $default-space;\n color: var(--theme-overlay-header--color);\n }\n\n .overlay-header-title {\n @include text-h2;\n @include ellipsis;\n color: var(--theme-overlay-header--color);\n margin-inline-start: $default-space;\n }\n }\n\n .color-indicator {\n display: inline-block;\n position: relative;\n width: $small-space;\n height: 100%;\n background-color: var(--theme-color-neutral);\n }\n\n .overlay-close {\n margin-inline-start: auto;\n margin-inline-end: $default-space;\n }\n\n .d-none {\n display: none;\n }\n}\n\n:host(.d-none) {\n display: none;\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n} from '@stencil/core';\nimport anime from 'animejs';\n\n@Component({\n tag: 'ix-map-navigation-overlay',\n styleUrl: 'map-navigation-overlay.scss',\n shadow: true,\n})\nexport class MapNavigationOverlay {\n private static readonly slowTime = 500;\n\n @Element() hostElement!: HTMLIxMapNavigationOverlayElement;\n\n /\n Title of overlay\n /\n @Prop() name?: string;\n\n /\n Icon of overlay\n /\n @Prop() icon?: string;\n\n /\n Color of icon\n \n @deprecated since 2.1.0. Use `icon-color`\n /\n // eslint-disable-next-line @stencil-community/reserved-member-names\n @Prop() color?: string;\n\n /\n Color of icon\n /\n @Prop() iconColor?: string;\n\n /\n Event closed\n */\n @Event() closeClick!: EventEmitter;\n\n componentWillLoad() {\n anime({\n targets: this.hostElement,\n duration: MapNavigationOverlay.slowTime,\n backdropFilter: [0, 'blur(1rem)'],\n translateX: ['-4rem', 0],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n this.hostElement.classList.remove('d-none');\n },\n });\n }\n\n private closeOverlay() {\n anime({\n targets: this.hostElement,\n duration: MapNavigationOverlay.slowTime,\n backdropFilter: ['blur(1rem)', 0],\n translateX: [0, '-4rem'],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n this.closeClick.emit();\n this.hostElement.classList.add('d-none');\n },\n });\n }\n\n render() {\n return (\n <Host>\n <div class=\"overlay-header\">\n <div\n class={{\n 'color-indicator': true,\n 'd-none': (this.iconColor ?? this.color) === undefined,\n }}\n style={{\n 'background-color':\n this.iconColor ?? this.color\n ? `var(--theme-${this.iconColor ?? this.color})`\n : '',\n }}\n ></div>\n <div class=\"overlay-header-content\">\n <ix-icon size=\"32\" name={this.icon}></ix-icon>\n <span class=\"overlay-header-title\" title={this.name}>\n {this.name}\n </span>\n </div>\n <ix-icon-button\n class=\"overlay-close\"\n ghost\n icon={'close'}\n size=\"24\"\n onClick={() => this.closeOverlay()}\n ></ix-icon-button>\n </div>\n\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ix-map-navigation.cjs.entry.js CHANGED Viewed

@@ -121,9 +121,9 @@ const MapNavigation = class {
             },
         });
         const overlayInstance = document.createElement('ix-map-navigation-overlay');
-        overlayInstance.setAttribute('color', color);
+        overlayInstance.setAttribute('color', color !== null && color !== void 0 ? color : '');
         overlayInstance.setAttribute('name', name);
-        overlayInstance.setAttribute('icon', icon);
+        overlayInstance.setAttribute('icon', icon !== null && icon !== void 0 ? icon : '');
         overlayInstance.setAttribute('slot', 'overlay');
         overlayInstance.addEventListener('closeClick', () => this.closeOverlay());
         overlayInstance.appendChild(component);
@@ -158,11 +158,11 @@ const MapNavigation = class {
         this.hasContentHeader = (nodes === null || nodes === void 0 ? void 0 : nodes.length) !== 0;
     }
     render() {
-        return (index.h(index.Host, { key: '9b4c4bb24f19945428477be04c10c6f80868ded0' }, index.h("slot", { key: '6f0db803a6755ed73737fe783e8d082a2df54f5b', name: "menu" }), index.h("div", { key: 'e8c578da79eed996626ed15e959dfc7c18675bfb', class: "map-nav" }, index.h("div", { key: 'fb834017ce2d372bc8ec93d16dd8c1975f8b6939', class: "map-nav-sidebar" }, index.h("div", { key: 'e0378fb0501f8e08b4c60d4051c8f0d1a72b7104', class: "map-nav-header" }, index.h("ix-application-header", { key: 'c03535cc7a7739e1a072a1687ab263f8a1c77d69', name: this.applicationName, class: "map-nav-header-brand" }, index.h("slot", { key: '9c4a8847d90dbdaf42bb9591b55680e547b1d52c', slot: "logo", name: "logo" }))), index.h("div", { key: '98b3542ea500a543322a84a640b839e2959cc0fe', class: "map-nav-sidebar-content" }, index.h("div", { key: 'a6d2f51e083a9e9b9d9839ea0b55090ee1354b42', class: "map-nav-sidebar-static-content" }, index.h("div", { key: '08a2f1f9c3c3730be3b5af9f6637cf4480461cda', class: "map-nav-title" }, this.navigationTitle), this.hideContextMenu ? ('') : (index.h("ix-icon-button", { icon: 'context-menu', ghost: true, size: "24", variant: "secondary", onClick: (_) => this.contextMenuClick.emit() }))), index.h("div", { key: 'b9f9fec616e9d53a5144d651c8f33cb65bd43d6b', class: "map-nav-sidebar-user-content" }, index.h("slot", { key: 'affb80bf56de7fab01f7c959d37f041cf8100fd2', name: "sidebar-content" })))), index.h("div", { key: 'ae33912f9c102c78d08c7e0a1e473ebbf4905a9c', class: "content" }, index.h("div", { key: '2385a7c87ded8cd7a1db225b3e45c16120b43aef', class: {
+        return (index.h(index.Host, { key: 'ba41878a23093475533042d9a4ba4cfd16a37893' }, index.h("slot", { key: 'f65ea5d5ebf9543216f1786a147cdd3fda54bee0', name: "menu" }), index.h("div", { key: '86908ea0b2be743f577b8cee84369db8221bd341', class: "map-nav" }, index.h("div", { key: 'f92f1db6cc25ce3db8b04b6e269fe8efddf8a5f9', class: "map-nav-sidebar" }, index.h("div", { key: 'c4332a42558bfecbc72b2c2b42e99a7553bba2cc', class: "map-nav-header" }, index.h("ix-application-header", { key: '69e211ad7403a7e8e07d26639be248aae4e894a1', name: this.applicationName, class: "map-nav-header-brand" }, index.h("slot", { key: 'b721fc8c3f21e5d1e7f6840f3fb10e1a5febbc30', slot: "logo", name: "logo" }))), index.h("div", { key: '23abf0ad64887cd90edb757cde71db08b872a00e', class: "map-nav-sidebar-content" }, index.h("div", { key: '5378b320ab76b6613518336c60e7addd2598b599', class: "map-nav-sidebar-static-content" }, index.h("div", { key: 'f7f1638e6efcefb36a5786203a6d98283ce17947', class: "map-nav-title" }, this.navigationTitle), this.hideContextMenu ? ('') : (index.h("ix-icon-button", { icon: 'context-menu', ghost: true, size: "24", variant: "secondary", onClick: (_) => this.contextMenuClick.emit() }))), index.h("div", { key: '930d10792f23e6df31639ae959ec08b6e009085b', class: "map-nav-sidebar-user-content" }, index.h("slot", { key: '82f6edb84570324b0d9cf854fda4b280a7af6f15', name: "sidebar-content" })))), index.h("div", { key: '66e3e8a0408705b77bc220df8cf398f75f456de9', class: "content" }, index.h("div", { key: 'c8bf3586553e1f82c88f922f6c03d2aeeb7fe5af', class: {
                 'map-nav-header-content': true,
                 'bg-2': true,
                 empty: !this.hasContentHeader,
-            } }, index.h("slot", { key: 'e230b473f2729038bc75d6b97f7a1bb5dc7b8b8e', name: "content-header", onSlotchange: (e) => this.checkHasContentHeader(e) })), index.h("main", { key: '062163caaa4a2b61b48c2124d23d047041688ce2' }, index.h("slot", { key: '444718852cea947e7bf581321cae89f113c474b5' }), index.h("slot", { key: 'c2160f945e134d90db2820c5ba4505d85845e5d6', name: "overlay" }))))));
+            } }, index.h("slot", { key: '54050e2def4b2f5e9722fb01ec5821f97e9850e8', name: "content-header", onSlotchange: (e) => this.checkHasContentHeader(e) })), index.h("main", { key: 'f429b81681627e65628c35e002149425835d8fb3' }, index.h("slot", { key: 'e1103cdef2ccdf6a225afc2c61fa439779e1a540' }), index.h("slot", { key: '588bd4fe946d4d074af395c0ce92b971bf19da26', name: "overlay" }))))));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/ix-map-navigation.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-map-navigation.entry.cjs.js","mappings":"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","names":["useContextProvider","ApplicationLayoutContext","anime","h","Host"],"sources":["src/components/map-navigation/map-navigation.scss?tag=ix-map-navigation&encapsulation=shadow","src/components/map-navigation/map-navigation.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 'legacy/mixins/fonts';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n\n $appHeaderHeight: 3.5rem;\n $appHeaderGradientHeight: 4rem;\n $navHeaderHeight: 11.5rem;\n $sidebarWidth: 29.75rem;\n\n display: flex;\n position: relative;\n width: 100%;\n height: 100%;\n\n .map-nav {\n display: flex;\n margin-left: 3.25rem;\n position: relative;\n height: 100%;\n flex-grow: 1;\n overflow: hidden;\n }\n\n .map-nav-sidebar {\n display: flex;\n flex-direction: column;\n align-items: center;\n width: $sidebarWidth;\n max-width: $sidebarWidth;\n min-width: $sidebarWidth;\n height: 100%;\n left: 4rem;\n background-color: var(--theme-map-navigation--background);\n border-inline-end: 0.125rem solid\n var(--theme-map-navigation-separator--background);\n z-index: 99;\n }\n\n .map-nav-sidebar-content {\n align-items: center;\n position: relative;\n overflow: auto;\n height: 100%;\n width: 100%;\n\n .map-nav-sidebar-static-content {\n @include text-h2;\n display: flex;\n justify-content: space-between;\n margin-top: 0.437rem;\n margin-bottom: 0.812rem;\n margin-left: $default-space;\n margin-right: $default-space;\n }\n }\n\n .map-nav-header {\n display: flex;\n position: relative;\n align-items: center;\n height: $appHeaderHeight;\n min-height: $appHeaderHeight;\n width: 100%;\n\n .map-nav-header-brand {\n background-color: var(--theme-map-navigation-background);\n\n padding-left: $default-space;\n padding-right: $default-space;\n padding-bottom: 0.625rem;\n height: 100%;\n width: 100%;\n --theme-app-header--color: var(--theme-map-navigation-header--color);\n --theme-app-header-logo--color: var(--theme-map-navigation-logo--color);\n\n button {\n margin-left: $default-space;\n }\n }\n }\n\n .map-nav-header-content {\n display: flex;\n height: $appHeaderHeight;\n align-items: center;\n overflow: hidden;\n padding: 0 $default-space;\n\n &.empty {\n height: 0;\n }\n }\n\n .map-nav-title {\n @include text-h2();\n\n display: flex;\n align-items: center;\n flex-grow: 1;\n }\n\n .content {\n display: block;\n flex-grow: 1;\n position: relative;\n height: 100%;\n overflow: hidden;\n z-index: calc(var(--theme-z-index-sticky) - 1);\n }\n\n ::slotted(ix-menu) {\n position: absolute;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { ApplicationLayoutContext } from '../utils/application-layout/context';\nimport { useContextProvider } from '../utils/context';\n\n@Component({\n tag: 'ix-map-navigation',\n styleUrl: 'map-navigation.scss',\n shadow: true,\n})\nexport class MapNavigation {\n private static readonly defaultTime = 150;\n private static readonly slowTime = 500;\n\n @Element() hostElement: HTMLIxMapNavigationElement;\n\n /\n Application name\n /\n @Prop() applicationName: string;\n\n /\n Navigation title\n /\n @Prop() navigationTitle: string;\n\n /\n Hide the sidebar context menu button when set to true\n /\n @Prop() hideContextMenu = true;\n\n /\n Navigation toggled\n /\n @Event() navigationToggled: EventEmitter<boolean>;\n\n /\n Context menu clicked\n /\n @Event() contextMenuClick: EventEmitter<void>;\n\n @State() isSidebarOpen = true;\n @State() hasContentHeader = false;\n\n get menu() {\n return this.hostElement.querySelector('ix-menu');\n }\n\n get menuOverlay() {\n return this.hostElement.querySelector('ix-menu-overlay');\n }\n\n get mapNavMenu() {\n return this.hostElement.shadowRoot.querySelector('.map-nav-menu');\n }\n\n get sidebar() {\n return this.hostElement.shadowRoot.querySelector('.map-nav-sidebar');\n }\n\n get overlay() {\n return this.hostElement.shadowRoot.querySelector('#overlay');\n }\n\n componentDidRender() {\n this.appendMenu();\n this.closeOverlay();\n }\n\n componentWillLoad() {\n useContextProvider(this.hostElement, ApplicationLayoutContext, {\n hideHeader: false,\n host: 'map-navigation',\n });\n }\n\n private appendMenu() {\n this.menu.addEventListener(\n 'mapExpandChange',\n (event: CustomEvent<boolean>) => {\n const state = !event.detail;\n this.toggleSidebar(state);\n }\n );\n this.menu.enableMapExpand = true;\n }\n\n /\n Change the visibility of the sidebar\n \n @param show new visibility state\n * @since 1.6.0\n /\n @Method()\n async toggleSidebar(show?: boolean) {\n if (show !== undefined) {\n this.isSidebarOpen = show;\n } else {\n this.isSidebarOpen = !this.isSidebarOpen;\n }\n\n if (this.isSidebarOpen) {\n this.openSidebar();\n } else {\n this.closeSidebar();\n }\n\n this.navigationToggled.emit(this.isSidebarOpen);\n this.menu.toggleMapExpand(this.isSidebarOpen);\n }\n\n private closeSidebar() {\n anime({\n targets: this.sidebar,\n duration: MapNavigation.defaultTime,\n marginLeft: [0, '-29.75rem'],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n this.sidebar.classList.add('d-none');\n },\n });\n }\n\n private openSidebar() {\n anime({\n targets: this.sidebar,\n duration: MapNavigation.defaultTime,\n marginLeft: ['-29.75rem', 0],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n this.sidebar.classList.remove('d-none');\n },\n });\n }\n\n /\n Open a overlay inside content area\n * @deprecated Will be removed in 2.0.0. Use slot based approach\n \n @param name\n * @param component\n * @param icon\n * @param color\n /\n @Method()\n async openOverlay(\n name: string,\n component: HTMLElement,\n icon?: string,\n color?: string\n ) {\n anime({\n targets: this.overlay,\n duration: MapNavigation.slowTime,\n backdropFilter: [0, 'blur(1rem)'],\n translateX: ['-4rem', 0],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n this.overlay.classList.remove('d-none');\n },\n });\n\n const overlayInstance = document.createElement('ix-map-navigation-overlay');\n overlayInstance.setAttribute('color', color);\n overlayInstance.setAttribute('name', name);\n overlayInstance.setAttribute('icon', icon);\n overlayInstance.setAttribute('slot', 'overlay');\n overlayInstance.addEventListener('closeClick', () => this.closeOverlay());\n overlayInstance.appendChild(component);\n this.hostElement.appendChild(overlayInstance);\n }\n\n /\n Close current shown overlay\n * @deprecated Will be removed in 2.0.0. Use slot based approach\n */\n @Method()\n async closeOverlay() {\n anime({\n targets: this.overlay,\n duration: MapNavigation.slowTime,\n backdropFilter: ['blur(1rem)', 0],\n translateX: [0, '-4rem'],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n if (!this.overlay) {\n return;\n }\n this.overlay.firstChild?.remove();\n this.overlay.classList.add('d-none');\n },\n });\n }\n\n private checkHasContentHeader(e: Event) {\n const nodes = (e.currentTarget as HTMLSlotElement).assignedNodes({\n flatten: true,\n });\n\n this.hasContentHeader = nodes?.length !== 0;\n }\n\n render() {\n return (\n <Host>\n <slot name=\"menu\"></slot>\n <div class=\"map-nav\">\n <div class=\"map-nav-sidebar\">\n <div class=\"map-nav-header\">\n <ix-application-header\n name={this.applicationName}\n class=\"map-nav-header-brand\"\n >\n <slot slot=\"logo\" name=\"logo\"></slot>\n </ix-application-header>\n </div>\n <div class=\"map-nav-sidebar-content\">\n <div class=\"map-nav-sidebar-static-content\">\n <div class=\"map-nav-title\">{this.navigationTitle}</div>\n {this.hideContextMenu ? (\n ''\n ) : (\n <ix-icon-button\n icon={'context-menu'}\n ghost\n size=\"24\"\n variant=\"secondary\"\n onClick={(_) => this.contextMenuClick.emit()}\n ></ix-icon-button>\n )}\n </div>\n <div class=\"map-nav-sidebar-user-content\">\n <slot name=\"sidebar-content\"></slot>\n </div>\n </div>\n </div>\n <div class=\"content\">\n <div\n class={{\n 'map-nav-header-content': true,\n 'bg-2': true,\n empty: !this.hasContentHeader,\n }}\n >\n <slot\n name=\"content-header\"\n onSlotchange={(e) => this.checkHasContentHeader(e)}\n ></slot>\n </div>\n <main>\n <slot></slot>\n <slot name=\"overlay\"></slot>\n </main>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-map-navigation.entry.cjs.js","mappings":"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","names":["useContextProvider","ApplicationLayoutContext","anime","h","Host"],"sources":["src/components/map-navigation/map-navigation.scss?tag=ix-map-navigation&encapsulation=shadow","src/components/map-navigation/map-navigation.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 'legacy/mixins/fonts';\n@import 'mixins/text-truncation';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n\n $appHeaderHeight: 3.5rem;\n $appHeaderGradientHeight: 4rem;\n $navHeaderHeight: 11.5rem;\n $sidebarWidth: 29.75rem;\n\n display: flex;\n position: relative;\n width: 100%;\n height: 100%;\n\n .map-nav {\n display: flex;\n margin-left: 3.25rem;\n position: relative;\n height: 100%;\n flex-grow: 1;\n overflow: hidden;\n }\n\n .map-nav-sidebar {\n display: flex;\n flex-direction: column;\n align-items: center;\n width: $sidebarWidth;\n max-width: $sidebarWidth;\n min-width: $sidebarWidth;\n height: 100%;\n left: 4rem;\n background-color: var(--theme-map-navigation--background);\n border-inline-end: 0.125rem solid\n var(--theme-map-navigation-separator--background);\n z-index: 99;\n }\n\n .map-nav-sidebar-content {\n align-items: center;\n position: relative;\n overflow: auto;\n height: 100%;\n width: 100%;\n\n .map-nav-sidebar-static-content {\n @include text-h2;\n display: flex;\n justify-content: space-between;\n margin-top: 0.437rem;\n margin-bottom: 0.812rem;\n margin-left: $default-space;\n margin-right: $default-space;\n }\n }\n\n .map-nav-header {\n display: flex;\n position: relative;\n align-items: center;\n height: $appHeaderHeight;\n min-height: $appHeaderHeight;\n width: 100%;\n\n .map-nav-header-brand {\n background-color: var(--theme-map-navigation-background);\n\n padding-left: $default-space;\n padding-right: $default-space;\n padding-bottom: 0.625rem;\n height: 100%;\n width: 100%;\n --theme-app-header--color: var(--theme-map-navigation-header--color);\n --theme-app-header-logo--color: var(--theme-map-navigation-logo--color);\n\n button {\n margin-left: $default-space;\n }\n }\n }\n\n .map-nav-header-content {\n display: flex;\n height: $appHeaderHeight;\n align-items: center;\n overflow: hidden;\n padding: 0 $default-space;\n\n &.empty {\n height: 0;\n }\n }\n\n .map-nav-title {\n @include text-h2();\n\n display: flex;\n align-items: center;\n flex-grow: 1;\n }\n\n .content {\n display: block;\n flex-grow: 1;\n position: relative;\n height: 100%;\n overflow: hidden;\n z-index: calc(var(--theme-z-index-sticky) - 1);\n }\n\n ::slotted(ix-menu) {\n position: absolute;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n State,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { ApplicationLayoutContext } from '../utils/application-layout/context';\nimport { useContextProvider } from '../utils/context';\n\n@Component({\n tag: 'ix-map-navigation',\n styleUrl: 'map-navigation.scss',\n shadow: true,\n})\nexport class MapNavigation {\n private static readonly defaultTime = 150;\n private static readonly slowTime = 500;\n\n @Element() hostElement!: HTMLIxMapNavigationElement;\n\n /\n Application name\n /\n @Prop() applicationName?: string;\n\n /\n Navigation title\n /\n @Prop() navigationTitle?: string;\n\n /\n Hide the sidebar context menu button when set to true\n /\n @Prop() hideContextMenu = true;\n\n /\n Navigation toggled\n /\n @Event() navigationToggled!: EventEmitter<boolean>;\n\n /\n Context menu clicked\n /\n @Event() contextMenuClick!: EventEmitter<void>;\n\n @State() isSidebarOpen = true;\n @State() hasContentHeader = false;\n\n get menu() {\n return this.hostElement.querySelector('ix-menu')!;\n }\n\n get menuOverlay() {\n return this.hostElement.querySelector('ix-menu-overlay')!;\n }\n\n get mapNavMenu() {\n return this.hostElement.shadowRoot!.querySelector('.map-nav-menu')!;\n }\n\n get sidebar() {\n return this.hostElement.shadowRoot!.querySelector('.map-nav-sidebar')!;\n }\n\n get overlay() {\n return this.hostElement.shadowRoot!.querySelector('#overlay')!;\n }\n\n componentDidRender() {\n this.appendMenu();\n this.closeOverlay();\n }\n\n componentWillLoad() {\n useContextProvider(this.hostElement, ApplicationLayoutContext, {\n hideHeader: false,\n host: 'map-navigation',\n });\n }\n\n private appendMenu() {\n this.menu.addEventListener(\n 'mapExpandChange',\n (event: CustomEvent<boolean>) => {\n const state = !event.detail;\n this.toggleSidebar(state);\n }\n );\n this.menu.enableMapExpand = true;\n }\n\n /\n Change the visibility of the sidebar\n \n @param show new visibility state\n * @since 1.6.0\n /\n @Method()\n async toggleSidebar(show?: boolean) {\n if (show !== undefined) {\n this.isSidebarOpen = show;\n } else {\n this.isSidebarOpen = !this.isSidebarOpen;\n }\n\n if (this.isSidebarOpen) {\n this.openSidebar();\n } else {\n this.closeSidebar();\n }\n\n this.navigationToggled.emit(this.isSidebarOpen);\n this.menu.toggleMapExpand(this.isSidebarOpen);\n }\n\n private closeSidebar() {\n anime({\n targets: this.sidebar,\n duration: MapNavigation.defaultTime,\n marginLeft: [0, '-29.75rem'],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n this.sidebar.classList.add('d-none');\n },\n });\n }\n\n private openSidebar() {\n anime({\n targets: this.sidebar,\n duration: MapNavigation.defaultTime,\n marginLeft: ['-29.75rem', 0],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n this.sidebar.classList.remove('d-none');\n },\n });\n }\n\n /\n Open a overlay inside content area\n * @deprecated Will be removed in 2.0.0. Use slot based approach\n \n @param name\n * @param component\n * @param icon\n * @param color\n /\n @Method()\n async openOverlay(\n name: string,\n component: HTMLElement,\n icon?: string,\n color?: string\n ) {\n anime({\n targets: this.overlay,\n duration: MapNavigation.slowTime,\n backdropFilter: [0, 'blur(1rem)'],\n translateX: ['-4rem', 0],\n opacity: [0, 1],\n easing: 'easeOutSine',\n begin: () => {\n this.overlay.classList.remove('d-none');\n },\n });\n\n const overlayInstance = document.createElement('ix-map-navigation-overlay');\n overlayInstance.setAttribute('color', color ?? '');\n overlayInstance.setAttribute('name', name);\n overlayInstance.setAttribute('icon', icon ?? '');\n overlayInstance.setAttribute('slot', 'overlay');\n overlayInstance.addEventListener('closeClick', () => this.closeOverlay());\n overlayInstance.appendChild(component);\n this.hostElement.appendChild(overlayInstance);\n }\n\n /\n Close current shown overlay\n * @deprecated Will be removed in 2.0.0. Use slot based approach\n */\n @Method()\n async closeOverlay() {\n anime({\n targets: this.overlay,\n duration: MapNavigation.slowTime,\n backdropFilter: ['blur(1rem)', 0],\n translateX: [0, '-4rem'],\n opacity: [1, 0],\n easing: 'easeInSine',\n complete: () => {\n if (!this.overlay) {\n return;\n }\n this.overlay.firstChild?.remove();\n this.overlay.classList.add('d-none');\n },\n });\n }\n\n private checkHasContentHeader(e: Event) {\n const nodes = (e.currentTarget as HTMLSlotElement).assignedNodes({\n flatten: true,\n });\n\n this.hasContentHeader = nodes?.length !== 0;\n }\n\n render() {\n return (\n <Host>\n <slot name=\"menu\"></slot>\n <div class=\"map-nav\">\n <div class=\"map-nav-sidebar\">\n <div class=\"map-nav-header\">\n <ix-application-header\n name={this.applicationName}\n class=\"map-nav-header-brand\"\n >\n <slot slot=\"logo\" name=\"logo\"></slot>\n </ix-application-header>\n </div>\n <div class=\"map-nav-sidebar-content\">\n <div class=\"map-nav-sidebar-static-content\">\n <div class=\"map-nav-title\">{this.navigationTitle}</div>\n {this.hideContextMenu ? (\n ''\n ) : (\n <ix-icon-button\n icon={'context-menu'}\n ghost\n size=\"24\"\n variant=\"secondary\"\n onClick={(_) => this.contextMenuClick.emit()}\n ></ix-icon-button>\n )}\n </div>\n <div class=\"map-nav-sidebar-user-content\">\n <slot name=\"sidebar-content\"></slot>\n </div>\n </div>\n </div>\n <div class=\"content\">\n <div\n class={{\n 'map-nav-header-content': true,\n 'bg-2': true,\n empty: !this.hasContentHeader,\n }}\n >\n <slot\n name=\"content-header\"\n onSlotchange={(e) => this.checkHasContentHeader(e)}\n ></slot>\n </div>\n <main>\n <slot></slot>\n <slot name=\"overlay\"></slot>\n </main>\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ix-menu-about-item.cjs.entry.js CHANGED Viewed

@@ -21,7 +21,7 @@ const MenuAboutItem = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: '68812cdc3ba23e05419a02de3f3339ac6bb6b8b7' }, index.h("slot", { key: '7e4ea0cc6deaef2fd45e7eb91e99736afbdc2677' })));
+        return (index.h(index.Host, { key: '64625e5eb62e019f6e42a9a36dae6207bad0701f' }, index.h("slot", { key: '519c77be9ef20bc794b1840c4a0f4cba4f924994' })));
     }
     static get watchers() { return {
         "label": ["watchLabel"]

package/dist/cjs/ix-menu-about-item.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-menu-about-item.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,gBAAgB,GAAG,sBAAsB,CAAC;AAChD,8BAAe,gBAAgB;;MCwBlB,aAAa;;;;;;IAYxB,UAAU,CAAC,QAAgB,EAAE,QAAgB;QAC3C,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;YACpB,IAAI,EAAE,oBAAoB;YAC1B,QAAQ,EAAE,QAAQ;YAClB,QAAQ,EAAE,QAAQ;SACnB,CAAC,CAAC;KACJ;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,oEAAa,CACR,EACP;KACH;;;;;;;;;","names":["h","Host"],"sources":["src/components/menu-about-item/menu-about-item.css?tag=ix-menu-about-item&encapsulation=shadow","src/components/menu-about-item/menu-about-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:host {\n display: block;\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { CustomLabelChangeEvent } from '../utils/menu-tabs/menu-tabs-utils';\n\n@Component({\n tag: 'ix-menu-about-item',\n styleUrl: 'menu-about-item.css',\n shadow: true,\n})\nexport class MenuAboutItem {\n /\n About Item label\n /\n @Prop({ reflect: true }) label: string;\n\n /\n Label changed\n */\n @Event() labelChange: EventEmitter<CustomLabelChangeEvent>;\n\n @Watch('label')\n watchLabel(newValue: string, oldValue: string) {\n this.labelChange.emit({\n name: 'ix-menu-about-item',\n oldLabel: oldValue,\n newLabel: newValue,\n });\n }\n\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-menu-about-item.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,gBAAgB,GAAG,sBAAsB,CAAC;AAChD,8BAAe,gBAAgB;;MCwBlB,aAAa;;;;;;IAYxB,UAAU,CAAC,QAAgB,EAAE,QAAgB;QAC3C,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;YACpB,IAAI,EAAE,oBAAoB;YAC1B,QAAQ,EAAE,QAAQ;YAClB,QAAQ,EAAE,QAAQ;SACnB,CAAC,CAAC;KACJ;IAED,MAAM;QACJ,QACEA,QAACC,UAAI,uDACHD,oEAAa,CACR,EACP;KACH;;;;;;;;;","names":["h","Host"],"sources":["src/components/menu-about-item/menu-about-item.css?tag=ix-menu-about-item&encapsulation=shadow","src/components/menu-about-item/menu-about-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:host {\n display: block;\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { CustomLabelChangeEvent } from '../utils/menu-tabs/menu-tabs-utils';\n\n@Component({\n tag: 'ix-menu-about-item',\n styleUrl: 'menu-about-item.css',\n shadow: true,\n})\nexport class MenuAboutItem {\n /\n About Item label\n /\n @Prop({ reflect: true }) label?: string;\n\n /\n Label changed\n */\n @Event() labelChange!: EventEmitter<CustomLabelChangeEvent>;\n\n @Watch('label')\n watchLabel(newValue: string, oldValue: string) {\n this.labelChange.emit({\n name: 'ix-menu-about-item',\n oldLabel: oldValue,\n newLabel: newValue,\n });\n }\n\n render() {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ix-menu-about-news.cjs.entry.js CHANGED Viewed

@@ -20,16 +20,16 @@ const MenuAboutNews = class {
         this.expanded = false;
     }
     render() {
-        return (index.h(index.Host, { key: '83f1ba400d8000a12796a2817259ad56b442d177', class: {
+        return (index.h(index.Host, { key: 'f049e1713ce75c3cf0a066dbcd3878c5752d63b8', class: {
                 expanded: this.expanded,
                 show: !this.show,
-            } }, index.h("div", { key: '908c7d853a4e51cd9ff1511d03256de50ee1ff28', class: "banner-container" }, index.h("ix-icon", { key: '66f28b4daa8e7b3779718de1cbb9a8adc53a88df', color: "color-inv-contrast-text", name: 'shout', size: "32" }), index.h("svg", { key: '6825e46de08ee4ee0d7cea4a5e7bce0c7f843189', viewBox: "0 0 48 56", xmlns: "http://www.w3.org/2000/svg" }, index.h("polygon", { key: '8126f241e46af7c27a316e8d3938bc4fdd5c9eda', points: "0 0 48 0 48 56 24 48 0 56" }))), index.h("div", { key: '26eddce36c663f819d76fb99660150358e1e46cd', class: "cui-popover-news-header" }, index.h("ix-typography", { key: '010285ae6e2a5f171febbe764ef36d3a6a90a75f', format: "label", bold: true }, this.label)), index.h("ix-icon-button", { key: 'c6d685ef430721c8364c8ddf78c7f76d41f7c634', size: "24", icon: 'close', ghost: true, onClick: () => {
+            } }, index.h("div", { key: '23f5331fd81c1ac67f36a3f7c2eb0e408f1517a5', class: "banner-container" }, index.h("ix-icon", { key: 'b2b6cc51da89551b5e9ec4f31b026202cb3370a4', color: "color-inv-contrast-text", name: 'shout', size: "32" }), index.h("svg", { key: '2c5b9496a40c3e96af0e12e5f647bac4975060d4', viewBox: "0 0 48 56", xmlns: "http://www.w3.org/2000/svg" }, index.h("polygon", { key: 'ad6a493b513524ed82fb78ad5c9a912c394ac068', points: "0 0 48 0 48 56 24 48 0 56" }))), index.h("div", { key: '6c9ae33a65929aaa7da29f91727f298e7ed7ae92', class: "cui-popover-news-header" }, index.h("ix-typography", { key: 'b8e0d8e7b8c2087a0ac5b787db60074fc482cd0e', format: "label", bold: true }, this.label)), index.h("ix-icon-button", { key: '92b7e27a53e227688f8794d6dffa451453f3416f', size: "24", icon: 'close', ghost: true, onClick: () => {
                 this.show = false;
                 this.closePopover.emit();
-            } }), index.h("div", { key: '1f98461c288ac98e75c1d9504e01673b35d5488a', class: "slot-container" }, index.h("slot", { key: '42806d437962511fd3469f2ce14fc8bf8e186dbe' })), this.aboutItemLabel ? (index.h("div", { class: "cui-popover-news-footer" }, index.h("ix-button", { variant: "primary", onClick: (e) => {
+            } }), index.h("div", { key: 'eb0cdf640a458dcf0f98563402cd1ccd4e111a43', class: "slot-container" }, index.h("slot", { key: 'f59b5a5825a4daa8b2026e3385b22198c0a893b2' })), this.aboutItemLabel ? (index.h("div", { class: "cui-popover-news-footer" }, index.h("ix-button", { variant: "primary", onClick: (e) => {
                 this.show = false;
                 this.showMore.emit(e);
-            } }, this.i18nShowMore))) : null, index.h("div", { key: '64671055f20f56aa598beca6bd017c1ecfc4e412', id: "arrow" })));
+            } }, this.i18nShowMore))) : null, index.h("div", { key: '227e365fa14960bd5f01a54eef9434260cac4055', id: "arrow" })));
     }
 };
 MenuAboutNews.style = IxMenuAboutNewsStyle0;

package/dist/cjs/ix-menu-about-news.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-menu-about-news.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,gBAAgB,GAAG,wuEAAwuE,CAAC;AAClwE,8BAAe,gBAAgB;;MCelB,aAAa;;;;;oBAIuB,KAAK;;4BAU7B,WAAW;;4BAUX,CAAC;wBAeL,KAAK;;IAExB,MAAM;QACJ,QACEA,QAACC,UAAI,qDACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,IAAI,EAAE,CAAC,IAAI,CAAC,IAAI;aACjB,IAEDD,kEAAK,KAAK,EAAC,kBAAkB,IAC3BA,sEACE,KAAK,EAAC,yBAAyB,EAC/B,IAAI,EAAE,OAAO,EACb,IAAI,EAAC,IAAI,GACA,EACXA,kEAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,IACzDA,sEAAS,MAAM,EAAC,2BAA2B,GAAG,CAC1C,CACF,EAENA,kEAAK,KAAK,EAAC,yBAAyB,IAClCA,4EAAe,MAAM,EAAC,OAAO,EAAC,IAAI,UAC/B,IAAI,CAAC,KAAK,CACG,CACZ,EAENA,6EACE,IAAI,EAAC,IAAI,EACT,IAAI,EAAE,OAAO,EACb,KAAK,QACL,OAAO,EAAE;gBACP,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;gBAClB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;aAC1B,GACe,EAClBA,kEAAK,KAAK,EAAC,gBAAgB,IACzBA,oEAAa,CACT,EACL,IAAI,CAAC,cAAc,IAClBA,iBAAK,KAAK,EAAC,yBAAyB,IAClCA,uBACE,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,CAAC,CAAC;gBACT,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;gBAClB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;aACvB,IAEA,IAAI,CAAC,YAAY,CACR,CACR,IACJ,IAAI,EACRA,kEAAK,EAAE,EAAC,OAAO,GAAO,CACjB,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/menu-about-news/menu-about-news.scss?tag=ix-menu-about-news&encapsulation=shadow","src/components/menu-about-news/menu-about-news.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/break-points';\n@import 'mixins/shadows';\n@import 'mixins/shadow-dom/component';\n$left: 3.4rem;\n\n:host {\n @include ix-component;\n\n --margin: 0.5rem;\n\n display: block;\n position: fixed;\n width: 20rem;\n height: auto;\n background-color: var(--theme-color-2);\n border-radius: $default-border-radius;\n padding: 1rem;\n left: $left;\n z-index: 10000;\n transition: left var(--theme-default-time);\n\n margin-inline-start: var(--margin) !important;\n\n @include box-shadow(4);\n\n .banner-container {\n position: absolute;\n top: 0.0625rem;\n left: $default-space;\n\n svg {\n position: absolute;\n height: 3.625rem;\n width: 3rem;\n\n polygon {\n fill: var(--theme-color-primary);\n }\n }\n\n ix-icon {\n margin: $small-space;\n position: absolute;\n z-index: 1;\n }\n }\n\n .cui-popover-news-header {\n margin-bottom: 2.5rem;\n margin-inline-start: 4rem;\n margin-block-start: -$tiny-space;\n }\n\n .popover-body {\n color: var(--theme-color-std-text);\n }\n\n .cui-popover-news-footer {\n display: flex;\n justify-content: flex-end;\n margin-top: 1rem;\n }\n\n ix-icon-button {\n top: $small-space;\n right: $small-space;\n position: absolute;\n }\n\n #arrow {\n position: absolute;\n width: 0.5rem;\n height: 0.5rem;\n background-color: var(--theme-color-2);\n transform: translateX(calc(var(--margin) -1 - 0.8rem)) rotateZ(45deg);\n }\n}\n\n:host(.expanded) {\n left: calc(#{$left} + 12.7rem);\n}\n\n:host(.show) {\n display: none;\n}\n\n@include media-breakpoint-match('sm') {\n :host {\n display: flex;\n flex-direction: column;\n max-height: calc(100vh - 4.75rem);\n width: calc(100% - 2rem);\n max-width: 30rem;\n transform: translateX(calc(1rem - 50%));\n left: calc(50% - 1rem) !important;\n bottom: 1rem !important;\n margin-inline: 0 !important;\n z-index: calc(var(--theme-z-index-sticky) - 1);\n\n .slot-container {\n overflow-y: auto;\n }\n\n #arrow {\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, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-about-news',\n styleUrl: 'menu-about-news.scss',\n shadow: true,\n})\nexport class MenuAboutNews {\n /\n Show about news\n /\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /\n Title of the about news\n /\n @Prop() label: string;\n\n /\n \n /\n @Prop() i18nShowMore = 'Show more';\n\n /\n Subtitle of the about news\n /\n @Prop() aboutItemLabel: string;\n\n /\n Bottom offset\n /\n @Prop() offsetBottom = 0;\n\n /\n Show More button is pressed\n /\n @Event() showMore: EventEmitter<MouseEvent>;\n\n /\n Popover closed\n /\n @Event() closePopover: EventEmitter<void>;\n\n /\n Internal\n */\n @Prop() expanded = false;\n\n render() {\n return (\n <Host\n class={{\n expanded: this.expanded,\n show: !this.show,\n }}\n >\n <div class=\"banner-container\">\n <ix-icon\n color=\"color-inv-contrast-text\"\n name={'shout'}\n size=\"32\"\n ></ix-icon>\n <svg viewBox=\"0 0 48 56\" xmlns=\"http://www.w3.org/2000/svg\">\n <polygon points=\"0 0 48 0 48 56 24 48 0 56\" />\n </svg>\n </div>\n\n <div class=\"cui-popover-news-header\">\n <ix-typography format=\"label\" bold>\n {this.label}\n </ix-typography>\n </div>\n\n <ix-icon-button\n size=\"24\"\n icon={'close'}\n ghost\n onClick={() => {\n this.show = false;\n this.closePopover.emit();\n }}\n ></ix-icon-button>\n <div class=\"slot-container\">\n <slot></slot>\n </div>\n {this.aboutItemLabel ? (\n <div class=\"cui-popover-news-footer\">\n <ix-button\n variant=\"primary\"\n onClick={(e) => {\n this.show = false;\n this.showMore.emit(e);\n }}\n >\n {this.i18nShowMore}\n </ix-button>\n </div>\n ) : null}\n <div id=\"arrow\"></div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-menu-about-news.entry.cjs.js","mappings":";;;;;;AAAA,MAAM,gBAAgB,GAAG,wuEAAwuE,CAAC;AAClwE,8BAAe,gBAAgB;;MCelB,aAAa;;;;;oBAIuB,KAAK;;4BAU7B,WAAW;;4BAUX,CAAC;wBAeL,KAAK;;IAExB,MAAM;QACJ,QACEA,QAACC,UAAI,qDACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,IAAI,EAAE,CAAC,IAAI,CAAC,IAAI;aACjB,IAEDD,kEAAK,KAAK,EAAC,kBAAkB,IAC3BA,sEACE,KAAK,EAAC,yBAAyB,EAC/B,IAAI,EAAE,OAAO,EACb,IAAI,EAAC,IAAI,GACA,EACXA,kEAAK,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,4BAA4B,IACzDA,sEAAS,MAAM,EAAC,2BAA2B,GAAG,CAC1C,CACF,EAENA,kEAAK,KAAK,EAAC,yBAAyB,IAClCA,4EAAe,MAAM,EAAC,OAAO,EAAC,IAAI,UAC/B,IAAI,CAAC,KAAK,CACG,CACZ,EAENA,6EACE,IAAI,EAAC,IAAI,EACT,IAAI,EAAE,OAAO,EACb,KAAK,QACL,OAAO,EAAE;gBACP,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;gBAClB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;aAC1B,GACe,EAClBA,kEAAK,KAAK,EAAC,gBAAgB,IACzBA,oEAAa,CACT,EACL,IAAI,CAAC,cAAc,IAClBA,iBAAK,KAAK,EAAC,yBAAyB,IAClCA,uBACE,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,CAAC,CAAC;gBACT,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;gBAClB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;aACvB,IAEA,IAAI,CAAC,YAAY,CACR,CACR,IACJ,IAAI,EACRA,kEAAK,EAAE,EAAC,OAAO,GAAO,CACjB,EACP;KACH;;;;;;","names":["h","Host"],"sources":["src/components/menu-about-news/menu-about-news.scss?tag=ix-menu-about-news&encapsulation=shadow","src/components/menu-about-news/menu-about-news.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/break-points';\n@import 'mixins/shadows';\n@import 'mixins/shadow-dom/component';\n$left: 3.4rem;\n\n:host {\n @include ix-component;\n\n --margin: 0.5rem;\n\n display: block;\n position: fixed;\n width: 20rem;\n height: auto;\n background-color: var(--theme-color-2);\n border-radius: $default-border-radius;\n padding: 1rem;\n left: $left;\n z-index: 10000;\n transition: left var(--theme-default-time);\n\n margin-inline-start: var(--margin) !important;\n\n @include box-shadow(4);\n\n .banner-container {\n position: absolute;\n top: 0.0625rem;\n left: $default-space;\n\n svg {\n position: absolute;\n height: 3.625rem;\n width: 3rem;\n\n polygon {\n fill: var(--theme-color-primary);\n }\n }\n\n ix-icon {\n margin: $small-space;\n position: absolute;\n z-index: 1;\n }\n }\n\n .cui-popover-news-header {\n margin-bottom: 2.5rem;\n margin-inline-start: 4rem;\n margin-block-start: -$tiny-space;\n }\n\n .popover-body {\n color: var(--theme-color-std-text);\n }\n\n .cui-popover-news-footer {\n display: flex;\n justify-content: flex-end;\n margin-top: 1rem;\n }\n\n ix-icon-button {\n top: $small-space;\n right: $small-space;\n position: absolute;\n }\n\n #arrow {\n position: absolute;\n width: 0.5rem;\n height: 0.5rem;\n background-color: var(--theme-color-2);\n transform: translateX(calc(var(--margin) -1 - 0.8rem)) rotateZ(45deg);\n }\n}\n\n:host(.expanded) {\n left: calc(#{$left} + 12.7rem);\n}\n\n:host(.show) {\n display: none;\n}\n\n@include media-breakpoint-match('sm') {\n :host {\n display: flex;\n flex-direction: column;\n max-height: calc(100vh - 4.75rem);\n width: calc(100% - 2rem);\n max-width: 30rem;\n transform: translateX(calc(1rem - 50%));\n left: calc(50% - 1rem) !important;\n bottom: 1rem !important;\n margin-inline: 0 !important;\n z-index: calc(var(--theme-z-index-sticky) - 1);\n\n .slot-container {\n overflow-y: auto;\n }\n\n #arrow {\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, Event, EventEmitter, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'ix-menu-about-news',\n styleUrl: 'menu-about-news.scss',\n shadow: true,\n})\nexport class MenuAboutNews {\n /\n Show about news\n /\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /\n Title of the about news\n /\n @Prop() label?: string;\n\n /\n \n /\n @Prop() i18nShowMore = 'Show more';\n\n /\n Subtitle of the about news\n /\n @Prop() aboutItemLabel?: string;\n\n /\n Bottom offset\n /\n @Prop() offsetBottom = 0;\n\n /\n Show More button is pressed\n /\n @Event() showMore!: EventEmitter<MouseEvent>;\n\n /\n Popover closed\n /\n @Event() closePopover!: EventEmitter<void>;\n\n /\n Internal\n */\n @Prop() expanded = false;\n\n render() {\n return (\n <Host\n class={{\n expanded: this.expanded,\n show: !this.show,\n }}\n >\n <div class=\"banner-container\">\n <ix-icon\n color=\"color-inv-contrast-text\"\n name={'shout'}\n size=\"32\"\n ></ix-icon>\n <svg viewBox=\"0 0 48 56\" xmlns=\"http://www.w3.org/2000/svg\">\n <polygon points=\"0 0 48 0 48 56 24 48 0 56\" />\n </svg>\n </div>\n\n <div class=\"cui-popover-news-header\">\n <ix-typography format=\"label\" bold>\n {this.label}\n </ix-typography>\n </div>\n\n <ix-icon-button\n size=\"24\"\n icon={'close'}\n ghost\n onClick={() => {\n this.show = false;\n this.closePopover.emit();\n }}\n ></ix-icon-button>\n <div class=\"slot-container\">\n <slot></slot>\n </div>\n {this.aboutItemLabel ? (\n <div class=\"cui-popover-news-footer\">\n <ix-button\n variant=\"primary\"\n onClick={(e) => {\n this.show = false;\n this.showMore.emit(e);\n }}\n >\n {this.i18nShowMore}\n </ix-button>\n </div>\n ) : null}\n <div id=\"arrow\"></div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ix-menu-about.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-757233c7.js');
-const menuTabsFc = require('./menu-tabs-fc-eb899b0d.js');
+const menuTabsFc = require('./menu-tabs-fc-a9f928f5.js');
 const menuAboutCss = ".text-xs{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text)}.text-s{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-caption-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text)}.text-default{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text)}.text-default-title{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text)}.text-default-title-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text)}.text-l{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text)}.text-l-title{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text)}.text-l-title-single{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text)}.text-h2{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text)}.text-xl{-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale;font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text)}a{color:var(--theme-color-primary)}:host{display:block;background-color:var(--theme-nav-overlay--background);padding:0.75rem 1rem 1rem 2rem;flex-grow:1;position:absolute;width:100%;height:100%}:host .about-header{display:flex;justify-content:space-between;flex-direction:row;align-items:center;height:2rem;margin-bottom:0.5rem}:host .about-header h2{color:var(--theme-nav-overlay-header--color);margin-bottom:1rem}:host ix-tabs{margin-bottom:1.5rem}:host ix-menu-about-item{display:none}";
 const IxMenuAboutStyle0 = menuAboutCss;
@@ -27,7 +27,7 @@ const MenuAbout = class {
         index.forceUpdate(this.el);
     }
     render() {
-        return index.h(menuTabsFc.MenuTabs, { key: 'de6857ca0dab82a0edf10e30e18259a50c9c3221', context: this });
+        return index.h(menuTabsFc.MenuTabs, { key: 'bb24c389af5981d177e70c71a2dda92cb7ab2b55', context: this });
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ix-menu-about.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-menu-about.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,YAAY,GAAG,ozGAAozG,CAAC;AAC10G,0BAAe,YAAY;;MC+Bd,SAAS;;;;;qBAYJ,2BAA2B;oBAK5B,KAAK;;;IAUpB,SAAS,CAAC,KAAa;QACrBA,iBAAM,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;KACrB;IAED,iBAAiB;QACfC,qBAAU,CAAC,IAAI,CAAC,CAAC;KAClB;IAED,gBAAgB;QACdC,iBAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KACtB;IAED,MAAM;QACJ,OAAOC,QAACC,mBAAQ,qDAAC,OAAO,EAAE,IAAI,GAAI,CAAC;KACpC;;;;;;;;;;","names":["setTab","initialize","forceUpdate","h","MenuTabs"],"sources":["src/components/menu-about/menu-about.scss?tag=ix-menu-about&encapsulation=shadow","src/components/menu-about/menu-about.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 'legacy/fonts';\n\n:host {\n display: block;\n background-color: var(--theme-nav-overlay--background);\n padding: $medium-space $default-space $default-space $x-large-space;\n flex-grow: 1;\n position: absolute;\n width: 100%;\n height: 100%;\n\n .about-header {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n align-items: center;\n height: $x-large-space;\n margin-bottom: $small-space;\n\n h2 {\n color: var(--theme-nav-overlay-header--color);\n margin-bottom: 1rem;\n }\n }\n\n ix-tabs {\n margin-bottom: 1.5rem;\n }\n\n ix-menu-about-item {\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 {\n Component,\n Element,\n Event,\n EventEmitter,\n forceUpdate,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { MenuTabs } from '../utils/menu-tabs/menu-tabs-fc';\nimport {\n CustomCloseEvent,\n initialize,\n setTab,\n} from '../utils/menu-tabs/menu-tabs-utils';\n\n@Component({\n tag: 'ix-menu-about',\n styleUrl: 'menu-about.scss',\n shadow: true,\n})\nexport class MenuAbout {\n @Element() el!: HTMLIxMenuAboutElement;\n\n /\n Active tab\n /\n // eslint-disable-next-line @stencil-community/strict-mutable\n @Prop({ mutable: true }) activeTabLabel: string;\n\n /\n Content of the header\n /\n @Prop() label = 'About & legal information';\n\n /\n Internal\n /\n @Prop() show = false;\n\n /\n About and Legal closed\n */\n @Event() close: EventEmitter<CustomCloseEvent>;\n\n @State() items: HTMLIxMenuAboutItemElement[];\n\n @Watch('activeTabLabel')\n updateTab(label: string) {\n setTab(this, label);\n }\n\n componentWillLoad() {\n initialize(this);\n }\n\n componentDidLoad() {\n forceUpdate(this.el);\n }\n\n render() {\n return <MenuTabs context={this} />;\n }\n}\n"],"version":3}
1	+ {"file":"ix-menu-about.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,YAAY,GAAG,ozGAAozG,CAAC;AAC10G,0BAAe,YAAY;;MC+Bd,SAAS;;;;;qBAYJ,2BAA2B;oBAK5B,KAAK;;;IAUpB,SAAS,CAAC,KAAa;QACrBA,iBAAM,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;KACrB;IAED,iBAAiB;QACfC,qBAAU,CAAC,IAAI,CAAC,CAAC;KAClB;IAED,gBAAgB;QACdC,iBAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;KACtB;IAED,MAAM;QACJ,OAAOC,QAACC,mBAAQ,qDAAC,OAAO,EAAE,IAAI,GAAI,CAAC;KACpC;;;;;;;;;;","names":["setTab","initialize","forceUpdate","h","MenuTabs"],"sources":["src/components/menu-about/menu-about.scss?tag=ix-menu-about&encapsulation=shadow","src/components/menu-about/menu-about.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 'legacy/fonts';\n\n:host {\n display: block;\n background-color: var(--theme-nav-overlay--background);\n padding: $medium-space $default-space $default-space $x-large-space;\n flex-grow: 1;\n position: absolute;\n width: 100%;\n height: 100%;\n\n .about-header {\n display: flex;\n justify-content: space-between;\n flex-direction: row;\n align-items: center;\n height: $x-large-space;\n margin-bottom: $small-space;\n\n h2 {\n color: var(--theme-nav-overlay-header--color);\n margin-bottom: 1rem;\n }\n }\n\n ix-tabs {\n margin-bottom: 1.5rem;\n }\n\n ix-menu-about-item {\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 {\n Component,\n Element,\n Event,\n EventEmitter,\n forceUpdate,\n h,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { MenuTabs } from '../utils/menu-tabs/menu-tabs-fc';\nimport {\n CustomCloseEvent,\n initialize,\n setTab,\n} from '../utils/menu-tabs/menu-tabs-utils';\n\n@Component({\n tag: 'ix-menu-about',\n styleUrl: 'menu-about.scss',\n shadow: true,\n})\nexport class MenuAbout {\n @Element() el!: HTMLIxMenuAboutElement;\n\n /\n Active tab\n /\n // eslint-disable-next-line @stencil-community/strict-mutable\n @Prop({ mutable: true }) activeTabLabel?: string;\n\n /\n Content of the header\n /\n @Prop() label = 'About & legal information';\n\n /\n Internal\n /\n @Prop() show = false;\n\n /\n About and Legal closed\n */\n @Event() close!: EventEmitter<CustomCloseEvent>;\n\n @State() items!: HTMLIxMenuAboutItemElement[];\n\n @Watch('activeTabLabel')\n updateTab(label: string) {\n setTab(this, label);\n }\n\n componentWillLoad() {\n initialize(this);\n }\n\n componentDidLoad() {\n forceUpdate(this.el);\n }\n\n render() {\n return <MenuTabs context={this} />;\n }\n}\n"],"version":3}

package/dist/cjs/ix-menu-avatar.cjs.entry.js CHANGED Viewed

@@ -30,9 +30,9 @@ const MenuAvatar = class {
         this.showContextMenu = elements.length !== 0;
     }
     render() {
-        return (index.h(index.Host, { key: 'c1fa0cee8afddf06bb3d3920d395305a9b911b3c', slot: "ix-menu-avatar" }, index.h("button", { key: '5012c1e35df4627a9fddb131f545f6e35042250c', class: "nav-item top-item avatar no-hover", title: this.top, id: this.avatarElementId, tabIndex: 0 }, index.h("ix-avatar", { key: '2a1d4585720d023caeb9a008ee779537fca91715', image: this.image, initials: this.initials }), index.h("div", { key: 'de59499988b75887263c47c4d9612e8ec7ad3e9d', class: "avatar-name" }, index.h("span", { key: '7f824012aacf351597139c302ffccaf45df95d22', class: "text-default-single", title: this.top }, this.top), index.h("span", { key: '8f5d667ac1a6c82c1fd3a30994202457ee007c5a', class: "text-default-single", title: this.bottom }, this.bottom))), index.h("ix-dropdown", { key: '5345172d53852effd5bd360122079476c3894e24', trigger: this.hostElement, placement: 'right-start', hidden: !this.showContextMenu && !this.showLogoutButton, offset: {
+        return (index.h(index.Host, { key: 'f3761a16d1ebc179e8c7a604182efeebc3ae5dbe', slot: "ix-menu-avatar" }, index.h("button", { key: '706ec6cdd7eb3f45cb6c8cd901511f3bb133d7e7', class: "nav-item top-item avatar no-hover", title: this.top, id: this.avatarElementId, tabIndex: 0 }, index.h("ix-avatar", { key: 'b1ace48f1f21901639d89445ae1e5260772a47e1', image: this.image, initials: this.initials }), index.h("div", { key: 'e6f0edea42cf5c6de4eefa716c1573b1f42133c6', class: "avatar-name" }, index.h("span", { key: '99532083258dbe7a1a4f6bf304c314c25b4f3339', class: "text-default-single", title: this.top }, this.top), index.h("span", { key: '7ba1b282e56f2e6767da4347ec42e501ec0347cd', class: "text-default-single", title: this.bottom }, this.bottom))), index.h("ix-dropdown", { key: 'a38543969a094859633a7c3979f5262a0bbc8611', trigger: this.hostElement, placement: 'right-start', hidden: !this.showContextMenu && !this.showLogoutButton, offset: {
                 mainAxis: 16,
-            } }, index.h("slot", { key: '5ded6f40210ba408b6dd2313568c700f5cb56797', onSlotchange: () => this.onSlotChange() }), this.showLogoutButton ? (index.h("ix-menu-avatar-item", { label: this.i18nLogout, icon: 'log-out', onClick: (e) => {
+            } }, index.h("slot", { key: 'a6c20075e5beaa33e197889ea41f585e7f079719', onSlotchange: () => this.onSlotChange() }), this.showLogoutButton ? (index.h("ix-menu-avatar-item", { label: this.i18nLogout, icon: 'log-out', onClick: (e) => {
                 this.logoutClick.emit(e);
             } })) : null)));
     }

package/dist/cjs/ix-menu-avatar.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-menu-avatar.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,aAAa,GAAG,+3DAA+3D,CAAC;AACt5D,2BAAe,aAAa;;MCwBf,UAAU;;;;QAiDb,oBAAe,GAAG,mBAAmB,CAAC;;;;;0BAnBjB,QAAQ;gCAMD,IAAI;+BAMJ,KAAK;;IASzC,YAAY;QACV,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,~~UAAU~~,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;~~QAC/D~~,IAAI,CAAC,IAAI,EAAE;YACT,OAAO;SACR;QACD,MAAM,QAAQ,GAAGA,4BAAkB,CAAC,IAAI,CAAC,CAAC;QAC1C,IAAI,CAAC,eAAe,GAAG,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC;KAC9C;IAED,MAAM;QACJ,QACEC,QAACC,UAAI,qDAAC,IAAI,EAAC,gBAAgB,IACzBD,qEACE,KAAK,EAAC,mCAAmC,EACzC,KAAK,EAAE,IAAI,CAAC,GAAG,EACf,EAAE,EAAE,IAAI,CAAC,eAAe,EACxB,QAAQ,EAAE,CAAC,IAEXA,wEAAW,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAc,EAEnEA,kEAAK,KAAK,EAAC,aAAa,IACtBA,mEAAM,KAAK,EAAC,qBAAqB,EAAC,KAAK,EAAE,IAAI,CAAC,GAAG,IAC9C,IAAI,CAAC,GAAG,CACJ,EACPA,mEAAM,KAAK,EAAC,qBAAqB,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM,IACjD,IAAI,CAAC,MAAM,CACP,CACH,CACC,EACTA,0EACE,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,SAAS,EAAE,aAAa,EACxB,MAAM,EAAE,CAAC,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,CAAC,gBAAgB,EACvD,MAAM,EAAE;gBACN,QAAQ,EAAE,EAAE;aACb,IAEDA,mEAAM,YAAY,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,GAAS,EACrD,IAAI,CAAC,gBAAgB,IACpBA,iCACE,KAAK,EAAE,IAAI,CAAC,UAAU,EACtB,IAAI,EAAE,SAAS,EACf,OAAO,EAAE,CAAC,CAAC;gBACT,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;aAC1B,GACoB,IACrB,IAAI,CACI,CACT,EACP;KACH;;;;;;;","names":["getSlottedElements","h","Host"],"sources":["src/components/menu-avatar/menu-avatar.scss?tag=ix-menu-avatar&encapsulation=shadow","src/components/menu-avatar/menu-avatar.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/text-truncation';\n@import 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n display: block;\n position: relative;\n margin-bottom: 0.5rem;\n margin-right: 0.75rem;\n\n .avatar {\n all: unset;\n box-sizing: border-box;\n\n display: flex;\n align-items: center;\n height: 2.5rem;\n width: 100%;\n max-height: 2.5rem;\n padding-left: 0.25rem;\n margin-left: 0.41rem;\n margin-right: 0.35rem;\n transition: var(--theme-default-time);\n\n .avatar-name {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n white-space: nowrap;\n margin-left: $default-space;\n line-height: 1.14;\n\n .text-default-single {\n color: var(--theme-nav-item-primary--color);\n @include ellipsis;\n }\n }\n\n border-radius: 1.25rem;\n\n @include hover {\n background-color: var(--theme-avatar-btn--background--hover);\n color: var(--theme-avatar-btn--color--hover);\n }\n\n @include active {\n background-color: var(--theme-avatar-btn--background--active);\n color: var(--theme-avatar-btn--color--active);\n }\n }\n\n .avatar:focus-visible {\n outline: 1px solid var(--theme-color-focus-bdr);\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 Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n State,\n} from '@stencil/core';\nimport { getSlottedElements } from '../utils/shadow-dom';\n\n@Component({\n tag: 'ix-menu-avatar',\n styleUrl: 'menu-avatar.scss',\n shadow: true,\n})\nexport class MenuAvatar {\n @Element() hostElement!: HTMLIxMenuAvatarElement;\n\n /\n First line of text\n /\n @Prop() top: string;\n\n /\n Second line of text\n /\n @Prop() bottom: string;\n\n /\n Display a avatar image\n \n @since 1.4.0\n /\n @Prop() image: string;\n\n /\n Display the initials of the user. Will be overwritten by image\n \n @since 1.4.0\n /\n @Prop() initials: string;\n\n /\n Use for translation\n /\n @Prop() i18nLogout: string = 'Logout';\n\n /\n Control the visibility of the logout button\n * @since 2.1.0\n /\n @Prop() showLogoutButton: boolean = true;\n\n /\n Control the visibility of the dropdown menu\n * @since 2.1.0\n /\n @State() showContextMenu: boolean = false;\n\n /\n Logout click\n */\n @Event() logoutClick: EventEmitter;\n\n private avatarElementId = 'ix-menu-avatar-id';\n\n onSlotChange() {\n const slot = this.hostElement.shadowRoot.querySelector('slot');\n if (!slot) {\n return;\n }\n const elements = getSlottedElements(slot);\n this.showContextMenu = elements.length !== 0;\n }\n\n render() {\n return (\n <Host slot=\"ix-menu-avatar\">\n <button\n class=\"nav-item top-item avatar no-hover\"\n title={this.top}\n id={this.avatarElementId}\n tabIndex={0}\n >\n <ix-avatar image={this.image} initials={this.initials}></ix-avatar>\n\n <div class=\"avatar-name\">\n <span class=\"text-default-single\" title={this.top}>\n {this.top}\n </span>\n <span class=\"text-default-single\" title={this.bottom}>\n {this.bottom}\n </span>\n </div>\n </button>\n <ix-dropdown\n trigger={this.hostElement}\n placement={'right-start'}\n hidden={!this.showContextMenu && !this.showLogoutButton}\n offset={{\n mainAxis: 16,\n }}\n >\n <slot onSlotchange={() => this.onSlotChange()}></slot>\n {this.showLogoutButton ? (\n <ix-menu-avatar-item\n label={this.i18nLogout}\n icon={'log-out'}\n onClick={(e) => {\n this.logoutClick.emit(e);\n }}\n ></ix-menu-avatar-item>\n ) : null}\n </ix-dropdown>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-menu-avatar.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,aAAa,GAAG,+3DAA+3D,CAAC;AACt5D,2BAAe,aAAa;;MCwBf,UAAU;;;;QAiDb,oBAAe,GAAG,mBAAmB,CAAC;;;;;0BAnBjB,QAAQ;gCAMD,IAAI;+BAMJ,KAAK;;IASzC,YAAY;QACV,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,UAAW,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;QAChE,IAAI,CAAC,IAAI,EAAE;YACT,OAAO;SACR;QACD,MAAM,QAAQ,GAAGA,4BAAkB,CAAC,IAAI,CAAC,CAAC;QAC1C,IAAI,CAAC,eAAe,GAAG,QAAQ,CAAC,MAAM,KAAK,CAAC,CAAC;KAC9C;IAED,MAAM;QACJ,QACEC,QAACC,UAAI,qDAAC,IAAI,EAAC,gBAAgB,IACzBD,qEACE,KAAK,EAAC,mCAAmC,EACzC,KAAK,EAAE,IAAI,CAAC,GAAG,EACf,EAAE,EAAE,IAAI,CAAC,eAAe,EACxB,QAAQ,EAAE,CAAC,IAEXA,wEAAW,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,GAAc,EAEnEA,kEAAK,KAAK,EAAC,aAAa,IACtBA,mEAAM,KAAK,EAAC,qBAAqB,EAAC,KAAK,EAAE,IAAI,CAAC,GAAG,IAC9C,IAAI,CAAC,GAAG,CACJ,EACPA,mEAAM,KAAK,EAAC,qBAAqB,EAAC,KAAK,EAAE,IAAI,CAAC,MAAM,IACjD,IAAI,CAAC,MAAM,CACP,CACH,CACC,EACTA,0EACE,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,SAAS,EAAE,aAAa,EACxB,MAAM,EAAE,CAAC,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,CAAC,gBAAgB,EACvD,MAAM,EAAE;gBACN,QAAQ,EAAE,EAAE;aACb,IAEDA,mEAAM,YAAY,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,GAAS,EACrD,IAAI,CAAC,gBAAgB,IACpBA,iCACE,KAAK,EAAE,IAAI,CAAC,UAAU,EACtB,IAAI,EAAE,SAAS,EACf,OAAO,EAAE,CAAC,CAAC;gBACT,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;aAC1B,GACoB,IACrB,IAAI,CACI,CACT,EACP;KACH;;;;;;;","names":["getSlottedElements","h","Host"],"sources":["src/components/menu-avatar/menu-avatar.scss?tag=ix-menu-avatar&encapsulation=shadow","src/components/menu-avatar/menu-avatar.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/text-truncation';\n@import 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n\n:host {\n @include ix-component;\n display: block;\n position: relative;\n margin-bottom: 0.5rem;\n margin-right: 0.75rem;\n\n .avatar {\n all: unset;\n box-sizing: border-box;\n\n display: flex;\n align-items: center;\n height: 2.5rem;\n width: 100%;\n max-height: 2.5rem;\n padding-left: 0.25rem;\n margin-left: 0.41rem;\n margin-right: 0.35rem;\n transition: var(--theme-default-time);\n\n .avatar-name {\n display: flex;\n flex-direction: column;\n overflow: hidden;\n white-space: nowrap;\n margin-left: $default-space;\n line-height: 1.14;\n\n .text-default-single {\n color: var(--theme-nav-item-primary--color);\n @include ellipsis;\n }\n }\n\n border-radius: 1.25rem;\n\n @include hover {\n background-color: var(--theme-avatar-btn--background--hover);\n color: var(--theme-avatar-btn--color--hover);\n }\n\n @include active {\n background-color: var(--theme-avatar-btn--background--active);\n color: var(--theme-avatar-btn--color--active);\n }\n }\n\n .avatar:focus-visible {\n outline: 1px solid var(--theme-color-focus-bdr);\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 Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n State,\n} from '@stencil/core';\nimport { getSlottedElements } from '../utils/shadow-dom';\n\n@Component({\n tag: 'ix-menu-avatar',\n styleUrl: 'menu-avatar.scss',\n shadow: true,\n})\nexport class MenuAvatar {\n @Element() hostElement!: HTMLIxMenuAvatarElement;\n\n /\n First line of text\n /\n @Prop() top?: string;\n\n /\n Second line of text\n /\n @Prop() bottom?: string;\n\n /\n Display a avatar image\n \n @since 1.4.0\n /\n @Prop() image?: string;\n\n /\n Display the initials of the user. Will be overwritten by image\n \n @since 1.4.0\n /\n @Prop() initials?: string;\n\n /\n Use for translation\n /\n @Prop() i18nLogout: string = 'Logout';\n\n /\n Control the visibility of the logout button\n * @since 2.1.0\n /\n @Prop() showLogoutButton: boolean = true;\n\n /\n Control the visibility of the dropdown menu\n * @since 2.1.0\n /\n @State() showContextMenu: boolean = false;\n\n /\n Logout click\n */\n @Event() logoutClick!: EventEmitter;\n\n private avatarElementId = 'ix-menu-avatar-id';\n\n onSlotChange() {\n const slot = this.hostElement.shadowRoot!.querySelector('slot');\n if (!slot) {\n return;\n }\n const elements = getSlottedElements(slot);\n this.showContextMenu = elements.length !== 0;\n }\n\n render() {\n return (\n <Host slot=\"ix-menu-avatar\">\n <button\n class=\"nav-item top-item avatar no-hover\"\n title={this.top}\n id={this.avatarElementId}\n tabIndex={0}\n >\n <ix-avatar image={this.image} initials={this.initials}></ix-avatar>\n\n <div class=\"avatar-name\">\n <span class=\"text-default-single\" title={this.top}>\n {this.top}\n </span>\n <span class=\"text-default-single\" title={this.bottom}>\n {this.bottom}\n </span>\n </div>\n </button>\n <ix-dropdown\n trigger={this.hostElement}\n placement={'right-start'}\n hidden={!this.showContextMenu && !this.showLogoutButton}\n offset={{\n mainAxis: 16,\n }}\n >\n <slot onSlotchange={() => this.onSlotChange()}></slot>\n {this.showLogoutButton ? (\n <ix-menu-avatar-item\n label={this.i18nLogout}\n icon={'log-out'}\n onClick={(e) => {\n this.logoutClick.emit(e);\n }}\n ></ix-menu-avatar-item>\n ) : null}\n </ix-dropdown>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ix-menu-category.cjs.entry.js CHANGED Viewed

@@ -108,7 +108,8 @@ const MenuCategory = class {
         });
     }
     onPointerEnter() {
-        if (this.ixMenu.expand) {
+        var _a;
+        if ((_a = this.ixMenu) === null || _a === void 0 ? void 0 : _a.expand) {
             return;
         }
         this.closeOtherCategories.emit();
@@ -118,15 +119,27 @@ const MenuCategory = class {
         this.showDropdown = false;
     }
     onCategoryClick(e) {
+        var _a;
         e.stopPropagation();
-        if (this.ixMenu.expand) {
-            e === null || e === void 0 ? void 0 : e.stopPropagation();
+        if ((_a = this.ixMenu) === null || _a === void 0 ? void 0 : _a.expand) {
             this.onExpandCategory(!this.showItems);
             return;
         }
     }
-    onNestedItemsChanged() {
+    onNestedItemsChanged(mutations) {
         this.nestedItems = this.getNestedItems();
+        if (!this.menuExpand || this.showItems || !mutations) {
+            return;
+        }
+        for (const mutation of mutations !== null && mutations !== void 0 ? mutations : []) {
+            if (mutation.attributeName === 'class' &&
+                mutation.target instanceof HTMLElement &&
+                mutation.target.classList.contains('active')) {
+                this.showItems = true;
+                this.onExpandCategory(true);
+                return;
+            }
+        }
     }
     isCategoryItemListVisible() {
         return this.menuExpand && (this.showItems || this.isNestedItemActive());
@@ -141,7 +154,8 @@ const MenuCategory = class {
         this.showItems = this.isCategoryItemListVisible();
     }
     componentDidLoad() {
-        this.observer = mutationObserver.createMutationObserver(() => this.onNestedItemsChanged());
+        var _a;
+        this.observer = mutationObserver.createMutationObserver((mutations) => this.onNestedItemsChanged(mutations));
         this.observer.observe(this.hostElement, {
             attributes: true,
             childList: true,
@@ -150,7 +164,7 @@ const MenuCategory = class {
         requestAnimationFrame(() => {
             this.onNestedItemsChanged();
         });
-        this.ixMenu.addEventListener('expandChange', ({ detail: menuExpand }) => {
+        (_a = this.ixMenu) === null || _a === void 0 ? void 0 : _a.addEventListener('expandChange', ({ detail: menuExpand }) => {
             this.menuExpand = menuExpand;
             if (!menuExpand) {
                 this.clearMenuItemStyles();
@@ -159,8 +173,9 @@ const MenuCategory = class {
         });
     }
     clearMenuItemStyles() {
-        this.menuItemsContainer.style.removeProperty('max-height');
-        this.menuItemsContainer.style.removeProperty('opacity');
+        var _a, _b;
+        (_a = this.menuItemsContainer) === null || _a === void 0 ? void 0 : _a.style.removeProperty('max-height');
+        (_b = this.menuItemsContainer) === null || _b === void 0 ? void 0 : _b.style.removeProperty('opacity');
     }
     disconnectedCallback() {
         if (this.observer) {
@@ -168,7 +183,7 @@ const MenuCategory = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'f9f4730936ba8f8ee2a46e0ce306117f947de177', class: {
+        return (index.h(index.Host, { key: 'e71d240316eb6b94bb380ef38095a980c414e3da', class: {
                 expanded: this.showItems,
             }, onPointerEnter: () => {
                 this.enterLeaveDebounce.onEnter();
@@ -177,14 +192,14 @@ const MenuCategory = class {
                     return;
                 }
                 this.enterLeaveDebounce.onLeave();
-            } }, index.h("ix-menu-item", { key: 'c8c152e9c345945b50803bd72998a09b72a70d74', class: 'category-parent', active: this.isNestedItemActive(), notifications: this.notifications, icon: this.icon, onClick: (e) => this.onCategoryClick(e), onFocus: () => this.onPointerEnter(), isCategory: true }, index.h("div", { key: '3b584077fbdbf1ce09421f33fddc52ba4da5d168', class: "category" }, index.h("div", { key: '73388008e380b2d6f341eef162727fd59aec88ee', class: "category-text" }, this.label), index.h("ix-icon", { key: 'ab5cf9fd56692b29bcc7501cb096411416a661a5', name: 'chevron-down-small', class: {
+            } }, index.h("ix-menu-item", { key: 'a944c473517dc6bdfbe17557de92ea23e33a636b', class: 'category-parent', active: this.isNestedItemActive(), notifications: this.notifications, icon: this.icon, onClick: (e) => this.onCategoryClick(e), onFocus: () => this.onPointerEnter(), isCategory: true }, index.h("div", { key: '92d971d7fb4b9e93c17e5f6dce66a4c71d15df40', class: "category" }, index.h("div", { key: '60f7d2d47cd58a9f52d5061d8758ce7e293265d7', class: "category-text" }, this.label), index.h("ix-icon", { key: '5e5acccf3735496059acd2c96b604d2d2a911ab9', name: 'chevron-down-small', class: {
                 'category-chevron': true,
                 'category-chevron--open': this.showItems,
-            } }))), index.h("div", { key: 'faa34c42bcf4250389ca2f46566b3992b235db27', ref: (ref) => (this.menuItemsContainer = ref), class: {
+            } }))), index.h("div", { key: '6cd4983793650c000968615488bf5432ebff8ae5', ref: (ref) => (this.menuItemsContainer = ref), class: {
                 'menu-items': true,
                 'menu-items--expanded': this.showItems,
                 'menu-items--collapsed': !this.showItems,
-            } }, this.showItems ? index.h("slot", null) : null), index.h("ix-dropdown", { key: 'd366bdd594350a8f67ee80b0d7d7b98d8d57cb28', closeBehavior: 'both', show: this.showDropdown, onShowChanged: ({ detail: dropdownShown }) => {
+            } }, this.showItems ? index.h("slot", null) : null), index.h("ix-dropdown", { key: '865f01f86e242c671c98bbb0c69a34fd13d57191', closeBehavior: 'both', show: this.showDropdown, onShowChanged: ({ detail: dropdownShown }) => {
                 this.showDropdown = dropdownShown;
             }, class: 'category-dropdown', anchor: this.hostElement, placement: "right-start", offset: {
                 mainAxis: 3,
@@ -197,7 +212,7 @@ const MenuCategory = class {
                         e.preventDefault();
                     }
                 }
-            } }, index.h("ix-dropdown-item", { key: '66918af3f1d25eaa574e47eda975b1ce23e954d4', class: 'category-dropdown-header' }, index.h("ix-typography", { key: '7479a92697b5e704aa75a9281d75aad54384328e', format: "label", bold: true, color: "std" }, this.label)), index.h("ix-divider", { key: 'ac0f5ce34503cfe9e77071185b46789eed2c3eef' }), index.h("slot", { key: '78dc27c30debcc86f4040e359a8659b55d8259b1' }))));
+            } }, index.h("ix-dropdown-item", { key: '479772ea8b9b93dc9891b9055a49fcfdd8c29b24', class: 'category-dropdown-header' }, index.h("ix-typography", { key: '700e4fb48634c9c6ab5a626dc3fabdc9212b6aa3', format: "label", bold: true, color: "std" }, this.label)), index.h("ix-divider", { key: 'ffc1422f9d4db6f6b1d32767935678d55ef8231a' }), index.h("slot", { key: 'a56cd8de6fb1829795ac0866bd2d4d31b672b24a' }))));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/ix-menu-category.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-menu-category.entry.cjs.js","mappings":"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","names":["anime","closestIxMenu","createMutationObserver","h","Host"],"sources":["src/components/menu-category/enter-leave.ts","src/components/menu-category/menu-category.scss?tag=ix-menu-category&encapsulation=shadow","src/components/menu-category/menu-category.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\nexport function createEnterLeaveDebounce(\n enterCallback: Function,\n leaveCallback: Function,\n {\n debounceTimeEnter,\n debounceTimeLeave,\n }: {\n debounceTimeEnter: number;\n debounceTimeLeave: number;\n } = {\n debounceTimeEnter: 0,\n debounceTimeLeave: 500,\n }\n) {\n let enterTimeout: NodeJS.Timeout;\n let leaveTimeout: NodeJS.Timeout;\n\n return {\n onEnter: () => {\n clearTimeout(leaveTimeout);\n enterTimeout = setTimeout(() => {\n enterCallback();\n }, debounceTimeEnter);\n },\n onLeave: () => {\n clearTimeout(enterTimeout);\n leaveTimeout = setTimeout(() => {\n leaveCallback();\n }, debounceTimeLeave);\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\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n\n:host {\n @include ix-component;\n display: flex;\n flex-direction: column;\n position: relative;\n\n .category {\n display: flex;\n position: relative;\n align-items: center;\n width: 100%;\n height: 100%;\n }\n\n .category-text {\n width: 100%;\n padding-right: 0.25rem;\n @include ellipsis;\n }\n\n .category-chevron {\n margin-left: auto;\n margin-right: 0;\n transition: var(--theme-default-time) transform ease-in-out;\n }\n\n .category-chevron--open {\n transform: rotate(-180deg);\n }\n\n .menu-items {\n overflow: hidden;\n max-height: 0;\n transition: var(--theme-default-time) max-height ease-in-out;\n }\n\n .menu-items--expanded {\n max-height: 999999999px;\n padding: 0.25rem 0 0.25rem 1.625rem;\n }\n\n .menu-items--collapsed {\n display: none;\n }\n\n .category-dropdown {\n ::slotted(ix-menu-item) {\n --ix-menu-item-height: 2.5rem;\n }\n }\n\n .category-dropdown-header {\n pointer-events: none;\n padding-left: 0.125rem;\n min-width: 256px;\n }\n\n ::slotted(ix-menu-item) {\n --ix-menu-item-height: 2.5rem;\n }\n}\n\n:host(.expanded) {\n background-color: var(--theme-color-ghost--active);\n}\n\n:host {\n ::slotted(a[href]) {\n text-decoration: none !important;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\nimport {\n Component,\n Element,\n h,\n Host,\n Prop,\n State,\n Event,\n EventEmitter,\n Listen,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { closestIxMenu } from '../utils/application-layout/context';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { createEnterLeaveDebounce } from './enter-leave';\n\nconst DefaultIxMenuItemHeight = 40;\nconst DefaultAnimationTimeout = 150;\n\n/\n @since 2.0.0\n /\n@Component({\n tag: 'ix-menu-category',\n styleUrl: 'menu-category.scss',\n shadow: true,\n})\nexport class MenuCategory {\n @Element() hostElement: HTMLIxMenuCategoryElement;\n\n /\n Display name of the category\n /\n @Prop() label: string;\n\n /\n Icon of the category\n /\n @Prop() icon: string;\n\n /\n Show notification count on the category\n /\n @Prop() notifications: number;\n\n /* @internal /\n // eslint-disable-next-line @stencil-community/decorators-style\n @Event({ bubbles: true, cancelable: true })\n closeOtherCategories: EventEmitter;\n\n @State() menuExpand = false;\n @State() showItems = false;\n @State() showDropdown = false;\n @State() nestedItems: HTMLIxMenuItemElement[] = [];\n\n private observer: MutationObserver;\n private menuItemsContainer: HTMLDivElement;\n private ixMenu: HTMLIxMenuElement;\n\n private enterLeaveDebounce = createEnterLeaveDebounce(\n () => {\n this.onPointerEnter();\n },\n () => {\n this.onPointerLeave();\n }\n );\n\n private isNestedItemActive() {\n return this.getNestedItems().some((item) => item.active);\n }\n\n private getNestedItems() {\n return Array.from(\n this.hostElement.querySelectorAll(':scope ix-menu-item')\n ) as HTMLIxMenuItemElement[];\n }\n\n private getNestedItemsHeight() {\n const items = this.getNestedItems();\n\n return items.length DefaultIxMenuItemHeight;\n }\n\n private onExpandCategory(showItems: boolean) {\n if (showItems) {\n this.animateFadeIn();\n } else {\n this.animateFadeOut();\n }\n }\n\n private animateFadeOut() {\n const slotHideThresholdMs = 25;\n anime({\n targets: this.menuItemsContainer,\n duration: DefaultAnimationTimeout,\n easing: 'easeInSine',\n opacity: [1, 0],\n maxHeight: [this.getNestedItemsHeight() + DefaultIxMenuItemHeight, 0],\n complete: () => {\n setTimeout(() => {\n this.showItems = false;\n this.showDropdown = false;\n }, DefaultAnimationTimeout + slotHideThresholdMs);\n },\n });\n }\n\n private animateFadeIn() {\n anime({\n targets: this.menuItemsContainer,\n duration: DefaultAnimationTimeout,\n easing: 'easeInSine',\n opacity: [0, 1],\n maxHeight: [0, this.getNestedItemsHeight() + DefaultIxMenuItemHeight],\n begin: () => {\n this.showItems = true;\n this.showDropdown = false;\n },\n });\n }\n\n private onPointerEnter() {\n if (this.ixMenu.expand) {\n return;\n }\n this.closeOtherCategories.emit();\n this.showDropdown = true;\n }\n\n @Listen('closeOtherCategories', { target: 'window' })\n private onPointerLeave() {\n this.showDropdown = false;\n }\n\n private onCategoryClick(e: MouseEvent) {\n e.stopPropagation();\n if (this.ixMenu.expand) {\n e?.stopPropagation();\n this.onExpandCategory(!this.showItems);\n return;\n }\n }\n\n private onNestedItemsChanged() {\n this.nestedItems = this.getNestedItems();\n }\n\n private isCategoryItemListVisible() {\n return this.menuExpand && (this.showItems \|\| this.isNestedItemActive());\n }\n\n componentWillLoad() {\n const closestMenu = closestIxMenu(this.hostElement);\n if (!closestMenu) {\n throw Error('ix-menu-category can only be used as a child of ix-menu');\n }\n this.ixMenu = closestMenu;\n\n this.menuExpand = this.ixMenu.expand;\n this.showItems = this.isCategoryItemListVisible();\n }\n\n componentDidLoad() {\n this.observer = createMutationObserver(() => this.onNestedItemsChanged());\n this.observer.observe(this.hostElement, {\n attributes: true,\n childList: true,\n subtree: true,\n });\n\n requestAnimationFrame(() => {\n this.onNestedItemsChanged();\n });\n\n this.ixMenu.addEventListener(\n 'expandChange',\n ({ detail: menuExpand }: CustomEvent<boolean>) => {\n this.menuExpand = menuExpand;\n if (!menuExpand) {\n this.clearMenuItemStyles();\n }\n this.showItems = this.isCategoryItemListVisible();\n }\n );\n }\n\n clearMenuItemStyles() {\n this.menuItemsContainer.style.removeProperty('max-height');\n this.menuItemsContainer.style.removeProperty('opacity');\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n return (\n <Host\n class={{\n expanded: this.showItems,\n }}\n onPointerEnter={() => {\n this.enterLeaveDebounce.onEnter();\n }}\n onPointerLeave={(event: PointerEvent) => {\n if (event.pointerType === 'touch') {\n return;\n }\n this.enterLeaveDebounce.onLeave();\n }}\n >\n <ix-menu-item\n class={'category-parent'}\n active={this.isNestedItemActive()}\n notifications={this.notifications}\n icon={this.icon}\n onClick={(e) => this.onCategoryClick(e)}\n onFocus={() => this.onPointerEnter()}\n isCategory\n >\n <div class=\"category\">\n <div class=\"category-text\">{this.label}</div>\n <ix-icon\n name={'chevron-down-small'}\n class={{\n 'category-chevron': true,\n 'category-chevron--open': this.showItems,\n }}\n ></ix-icon>\n </div>\n </ix-menu-item>\n <div\n ref={(ref) => (this.menuItemsContainer = ref!)}\n class={{\n 'menu-items': true,\n 'menu-items--expanded': this.showItems,\n 'menu-items--collapsed': !this.showItems,\n }}\n >\n {this.showItems ? <slot></slot> : null}\n </div>\n <ix-dropdown\n closeBehavior={'both'}\n show={this.showDropdown}\n onShowChanged={({ detail: dropdownShown }: CustomEvent<boolean>) => {\n this.showDropdown = dropdownShown;\n }}\n class={'category-dropdown'}\n anchor={this.hostElement}\n placement=\"right-start\"\n offset={{\n mainAxis: 3,\n }}\n onClick={(e) => {\n if (e.target instanceof HTMLElement) {\n if (e.target.tagName === 'IX-MENU-ITEM') {\n this.showDropdown = false;\n } else {\n e.preventDefault();\n }\n }\n }}\n >\n <ix-dropdown-item class={'category-dropdown-header'}>\n <ix-typography format=\"label\" bold color=\"std\">\n {this.label}\n </ix-typography>\n </ix-dropdown-item>\n <ix-divider></ix-divider>\n <slot></slot>\n </ix-dropdown>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-menu-category.entry.cjs.js","mappings":"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","names":["anime","closestIxMenu","createMutationObserver","h","Host"],"sources":["src/components/menu-category/enter-leave.ts","src/components/menu-category/menu-category.scss?tag=ix-menu-category&encapsulation=shadow","src/components/menu-category/menu-category.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\nexport function createEnterLeaveDebounce(\n enterCallback: Function,\n leaveCallback: Function,\n {\n debounceTimeEnter,\n debounceTimeLeave,\n }: {\n debounceTimeEnter: number;\n debounceTimeLeave: number;\n } = {\n debounceTimeEnter: 0,\n debounceTimeLeave: 500,\n }\n) {\n let enterTimeout: NodeJS.Timeout;\n let leaveTimeout: NodeJS.Timeout;\n\n return {\n onEnter: () => {\n clearTimeout(leaveTimeout);\n enterTimeout = setTimeout(() => {\n enterCallback();\n }, debounceTimeEnter);\n },\n onLeave: () => {\n clearTimeout(enterTimeout);\n leaveTimeout = setTimeout(() => {\n leaveCallback();\n }, debounceTimeLeave);\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\n@import 'mixins/shadow-dom/component';\n@import 'mixins/text-truncation';\n\n:host {\n @include ix-component;\n display: flex;\n flex-direction: column;\n position: relative;\n\n .category {\n display: flex;\n position: relative;\n align-items: center;\n width: 100%;\n height: 100%;\n }\n\n .category-text {\n width: 100%;\n padding-right: 0.25rem;\n @include ellipsis;\n }\n\n .category-chevron {\n margin-left: auto;\n margin-right: 0;\n transition: var(--theme-default-time) transform ease-in-out;\n }\n\n .category-chevron--open {\n transform: rotate(-180deg);\n }\n\n .menu-items {\n overflow: hidden;\n max-height: 0;\n transition: var(--theme-default-time) max-height ease-in-out;\n }\n\n .menu-items--expanded {\n max-height: 999999999px;\n padding: 0.25rem 0 0.25rem 1.625rem;\n }\n\n .menu-items--collapsed {\n display: none;\n }\n\n .category-dropdown {\n ::slotted(ix-menu-item) {\n --ix-menu-item-height: 2.5rem;\n }\n }\n\n .category-dropdown-header {\n pointer-events: none;\n padding-left: 0.125rem;\n min-width: 256px;\n }\n\n ::slotted(ix-menu-item) {\n --ix-menu-item-height: 2.5rem;\n }\n}\n\n:host(.expanded) {\n background-color: var(--theme-color-ghost--active);\n}\n\n:host {\n ::slotted(a[href]) {\n text-decoration: none !important;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\nimport {\n Component,\n Element,\n h,\n Host,\n Prop,\n State,\n Event,\n EventEmitter,\n Listen,\n} from '@stencil/core';\nimport anime from 'animejs';\nimport { closestIxMenu } from '../utils/application-layout/context';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { createEnterLeaveDebounce } from './enter-leave';\n\nconst DefaultIxMenuItemHeight = 40;\nconst DefaultAnimationTimeout = 150;\n\n/\n @since 2.0.0\n /\n@Component({\n tag: 'ix-menu-category',\n styleUrl: 'menu-category.scss',\n shadow: true,\n})\nexport class MenuCategory {\n @Element() hostElement!: HTMLIxMenuCategoryElement;\n\n /\n Display name of the category\n /\n @Prop() label?: string;\n\n /\n Icon of the category\n /\n @Prop() icon?: string;\n\n /\n Show notification count on the category\n /\n @Prop() notifications?: number;\n\n /* @internal /\n // eslint-disable-next-line @stencil-community/decorators-style\n @Event({ bubbles: true, cancelable: true })\n closeOtherCategories!: EventEmitter;\n\n @State() menuExpand = false;\n @State() showItems = false;\n @State() showDropdown = false;\n @State() nestedItems: HTMLIxMenuItemElement[] = [];\n\n private observer?: MutationObserver;\n private menuItemsContainer?: HTMLDivElement;\n private ixMenu?: HTMLIxMenuElement;\n\n private enterLeaveDebounce = createEnterLeaveDebounce(\n () => {\n this.onPointerEnter();\n },\n () => {\n this.onPointerLeave();\n }\n );\n\n private isNestedItemActive() {\n return this.getNestedItems().some((item) => item.active);\n }\n\n private getNestedItems() {\n return Array.from(\n this.hostElement.querySelectorAll(':scope ix-menu-item')\n ) as HTMLIxMenuItemElement[];\n }\n\n private getNestedItemsHeight() {\n const items = this.getNestedItems();\n\n return items.length DefaultIxMenuItemHeight;\n }\n\n private onExpandCategory(showItems: boolean) {\n if (showItems) {\n this.animateFadeIn();\n } else {\n this.animateFadeOut();\n }\n }\n\n private animateFadeOut() {\n const slotHideThresholdMs = 25;\n anime({\n targets: this.menuItemsContainer,\n duration: DefaultAnimationTimeout,\n easing: 'easeInSine',\n opacity: [1, 0],\n maxHeight: [this.getNestedItemsHeight() + DefaultIxMenuItemHeight, 0],\n complete: () => {\n setTimeout(() => {\n this.showItems = false;\n this.showDropdown = false;\n }, DefaultAnimationTimeout + slotHideThresholdMs);\n },\n });\n }\n\n private animateFadeIn() {\n anime({\n targets: this.menuItemsContainer,\n duration: DefaultAnimationTimeout,\n easing: 'easeInSine',\n opacity: [0, 1],\n maxHeight: [0, this.getNestedItemsHeight() + DefaultIxMenuItemHeight],\n begin: () => {\n this.showItems = true;\n this.showDropdown = false;\n },\n });\n }\n\n private onPointerEnter() {\n if (this.ixMenu?.expand) {\n return;\n }\n this.closeOtherCategories.emit();\n this.showDropdown = true;\n }\n\n @Listen('closeOtherCategories', { target: 'window' })\n private onPointerLeave() {\n this.showDropdown = false;\n }\n\n private onCategoryClick(e: MouseEvent) {\n e.stopPropagation();\n if (this.ixMenu?.expand) {\n this.onExpandCategory(!this.showItems);\n return;\n }\n }\n\n private onNestedItemsChanged(mutations?: MutationRecord[]) {\n this.nestedItems = this.getNestedItems();\n\n if (!this.menuExpand \|\| this.showItems \|\| !mutations) {\n return;\n }\n\n for (const mutation of mutations ?? []) {\n if (\n mutation.attributeName === 'class' &&\n mutation.target instanceof HTMLElement &&\n mutation.target.classList.contains('active')\n ) {\n this.showItems = true;\n this.onExpandCategory(true);\n return;\n }\n }\n }\n\n private isCategoryItemListVisible() {\n return this.menuExpand && (this.showItems \|\| this.isNestedItemActive());\n }\n\n componentWillLoad() {\n const closestMenu = closestIxMenu(this.hostElement);\n if (!closestMenu) {\n throw Error('ix-menu-category can only be used as a child of ix-menu');\n }\n this.ixMenu = closestMenu;\n\n this.menuExpand = this.ixMenu.expand;\n this.showItems = this.isCategoryItemListVisible();\n }\n\n componentDidLoad() {\n this.observer = createMutationObserver((mutations: MutationRecord[]) =>\n this.onNestedItemsChanged(mutations)\n );\n\n this.observer.observe(this.hostElement, {\n attributes: true,\n childList: true,\n subtree: true,\n });\n\n requestAnimationFrame(() => {\n this.onNestedItemsChanged();\n });\n\n this.ixMenu?.addEventListener(\n 'expandChange',\n ({ detail: menuExpand }: CustomEvent<boolean>) => {\n this.menuExpand = menuExpand;\n if (!menuExpand) {\n this.clearMenuItemStyles();\n }\n this.showItems = this.isCategoryItemListVisible();\n }\n );\n }\n\n clearMenuItemStyles() {\n this.menuItemsContainer?.style.removeProperty('max-height');\n this.menuItemsContainer?.style.removeProperty('opacity');\n }\n\n disconnectedCallback() {\n if (this.observer) {\n this.observer.disconnect();\n }\n }\n\n render() {\n return (\n <Host\n class={{\n expanded: this.showItems,\n }}\n onPointerEnter={() => {\n this.enterLeaveDebounce.onEnter();\n }}\n onPointerLeave={(event: PointerEvent) => {\n if (event.pointerType === 'touch') {\n return;\n }\n this.enterLeaveDebounce.onLeave();\n }}\n >\n <ix-menu-item\n class={'category-parent'}\n active={this.isNestedItemActive()}\n notifications={this.notifications}\n icon={this.icon}\n onClick={(e) => this.onCategoryClick(e)}\n onFocus={() => this.onPointerEnter()}\n isCategory\n >\n <div class=\"category\">\n <div class=\"category-text\">{this.label}</div>\n <ix-icon\n name={'chevron-down-small'}\n class={{\n 'category-chevron': true,\n 'category-chevron--open': this.showItems,\n }}\n ></ix-icon>\n </div>\n </ix-menu-item>\n <div\n ref={(ref) => (this.menuItemsContainer = ref!)}\n class={{\n 'menu-items': true,\n 'menu-items--expanded': this.showItems,\n 'menu-items--collapsed': !this.showItems,\n }}\n >\n {this.showItems ? <slot></slot> : null}\n </div>\n <ix-dropdown\n closeBehavior={'both'}\n show={this.showDropdown}\n onShowChanged={({ detail: dropdownShown }: CustomEvent<boolean>) => {\n this.showDropdown = dropdownShown;\n }}\n class={'category-dropdown'}\n anchor={this.hostElement}\n placement=\"right-start\"\n offset={{\n mainAxis: 3,\n }}\n onClick={(e) => {\n if (e.target instanceof HTMLElement) {\n if (e.target.tagName === 'IX-MENU-ITEM') {\n this.showDropdown = false;\n } else {\n e.preventDefault();\n }\n }\n }}\n >\n <ix-dropdown-item class={'category-dropdown-header'}>\n <ix-typography format=\"label\" bold color=\"std\">\n {this.label}\n </ix-typography>\n </ix-dropdown-item>\n <ix-divider></ix-divider>\n <slot></slot>\n </ix-dropdown>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ix-menu-expand-icon.cjs.entry.js CHANGED Viewed

@@ -36,7 +36,7 @@ const MenuExpandIcon = class {
         return this.getSmallScreenIcon();
     }
     render() {
-        return (index.h(index.Host, { key: '47eabfc90f05f809a8df541e3ae79f3f7d32bb5f', class: {
+        return (index.h(index.Host, { key: '061d1dfbca0bcad9c84f5d45e58973ffd6ca271b', class: {
                 expanded: this.expanded,
             } }, this.getMenuIcon()));
     }

package/dist/cjs/ix-menu-expand-icon.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ix-menu-expand-icon.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,iBAAiB,GAAG,qvcAAqvc,CAAC;AAChxc,+BAAe,iBAAiB;;MC6BnB,cAAc;;;2BAEK,QAAQ;wBAGF,KAAK;;sBAMxB,KAAK;;IAEtB,kBAAkB;QAChB,QACEA,oBACE,KAAK,kCACAC,2BAAgB,CACjB,WAAW,EACX,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,KAAK,EACL,KAAK,CACN,KACD,oBAAoB,EAAE,IAAI,KAE5B,IAAI,EAAC,QAAQ,gBACD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,kBACxCC,gBAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,IAExCF,iBACE,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,IAEXA,kBAAM,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,GAAQ,EACnEA,kBAAM,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,GAAQ,EACpEA,kBAAM,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,GAAQ,CAChE,CACC,EACT;KACH;IAED,kBAAkB;QAChB,QACEA,4BACE,IAAI,EAAE,kBAAkB,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,OAAO,EAAE,EAC1D,KAAK,SACW,EAClB;KACH;IAED,WAAW;QACT,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC;SAClC;QAED,IAAI,IAAI,CAAC,UAAU,KAAK,IAAI,EAAE;YAC5B,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC;SAClC;QAED,IAAI,IAAI,CAAC,UAAU,KAAK,IAAI,EAAE;YAC5B,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC;SAClC;QAED,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC;KAClC;IAED,MAAM;QACJ,QACEA,QAACG,UAAI,qDACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,IAEA,IAAI,CAAC,WAAW,EAAE,CACd,EACP;KACH;;;;;;","names":["h","getButtonClasses","a11yBoolean","Host"],"sources":["src/components/menu/menu-expand-icon.scss?tag=ix-menu-expand-icon&encapsulation=shadow","src/components/menu/menu-expand-icon.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n@import 'common-variables';\n@import 'legacy/components/buttons';\n@import 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n\n$focus-bdr-width: 0.0625rem;\n\n:host {\n @include ix-component;\n\n display: flex;\n justify-content: center;\n align-items: center;\n height: 2rem;\n width: 2rem;\n border-radius: var(--theme-btn--border-radius);\n pointer-events: all;\n\n svg {\n display: inline-block;\n vertical-align: middle;\n }\n\n .line {\n fill: var(--theme-menu-btn--color);\n opacity: 1;\n x: 2px;\n transition: x 0.075s ease-in var(--theme-default-time), transform 0.075s ease-in-out 0.075s,\n y 0.075s ease-in-out, opacity 0.075s linear 0.075s;\n transform-origin: center;\n }\n}\n\n@include host-hover {\n .menu-expand-button {\n background-color: var(--theme-menu-btn--background--hover);\n }\n}\n\n.menu-expand-button {\n width: 2rem;\n padding: 0;\n cursor: pointer;\n}\n\n@include host-active {\n .menu-expand-button {\n background-color: var(--theme-menu-btn--background--active);\n }\n}\n\n:host(.expanded) {\n svg .line-1 {\n opacity: 1;\n transform: rotate(-45deg);\n y: 11px;\n }\n\n svg .line-2 {\n opacity: 0;\n x: 9;\n }\n\n svg .line-3 {\n opacity: 1;\n transform: rotate(45deg);\n y: 11px;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n/\n * SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { Component, h, Host, Prop } from '@stencil/core';\nimport { getButtonClasses } from '../button/base-button';\nimport { a11yBoolean } from '../utils/a11y';\nimport { Breakpoint } from '../utils/breakpoints';\n\n/\n @internal\n /\n@Component({\n tag: 'ix-menu-expand-icon',\n styleUrl: './menu-expand-icon.scss',\n shadow: true,\n})\nexport class MenuExpandIcon {\n /* Accessibility label for the menu expand icon (MANDATORY) /\n @Prop() ixAriaLabel: string = 'Expand';\n\n /* Whether the menu expand icon displays the expanded state or not /\n @Prop({ reflect: true }) expanded = false;\n\n /* Controls which icon is displayed /\n @Prop({ reflect: true }) breakpoint: Breakpoint;\n\n /* Display as pinned */\n @Prop() pinned = false;\n\n getSmallScreenIcon() {\n return (\n <button\n class={{\n ...getButtonClasses(\n 'secondary',\n false,\n true,\n true,\n false,\n false,\n false\n ),\n 'menu-expand-button': true,\n }}\n type=\"button\"\n aria-label={this.ixAriaLabel ? this.ixAriaLabel : null}\n aria-pressed={a11yBoolean(this.expanded)}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n width=\"24\"\n height=\"24\"\n >\n <rect class=\"line line-1\" x=\"2\" y=\"5\" width=\"20\" height=\"2\"></rect>\n <rect class=\"line line-2\" x=\"2\" y=\"11\" width=\"13\" height=\"2\"></rect>\n <rect class=\"line line-3\" x=\"2\" y=\"17\" width=\"20\" height=\"2\"></rect>\n </svg>\n </button>\n );\n }\n\n getLargeScreenIcon() {\n return (\n <ix-icon-button\n icon={`double-chevron-${this.expanded ? 'left' : 'right'}`}\n ghost\n ></ix-icon-button>\n );\n }\n\n getMenuIcon() {\n if (this.pinned) {\n return this.getLargeScreenIcon();\n }\n\n if (this.breakpoint === 'md') {\n return this.getLargeScreenIcon();\n }\n\n if (this.breakpoint === 'lg') {\n return this.getLargeScreenIcon();\n }\n\n return this.getSmallScreenIcon();\n }\n\n render() {\n return (\n <Host\n class={{\n expanded: this.expanded,\n }}\n >\n {this.getMenuIcon()}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ix-menu-expand-icon.entry.cjs.js","mappings":";;;;;;;;AAAA,MAAM,iBAAiB,GAAG,qvcAAqvc,CAAC;AAChxc,+BAAe,iBAAiB;;MC6BnB,cAAc;;;2BAEK,QAAQ;wBAGF,KAAK;;sBAMxB,KAAK;;IAEtB,kBAAkB;QAChB,QACEA,oBACE,KAAK,kCACAC,2BAAgB,CACjB,WAAW,EACX,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,KAAK,EACL,KAAK,CACN,KACD,oBAAoB,EAAE,IAAI,KAE5B,IAAI,EAAC,QAAQ,gBACD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,kBACxCC,gBAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,IAExCF,iBACE,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,IAEXA,kBAAM,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,GAAQ,EACnEA,kBAAM,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,GAAQ,EACpEA,kBAAM,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,GAAQ,CAChE,CACC,EACT;KACH;IAED,kBAAkB;QAChB,QACEA,4BACE,IAAI,EAAE,kBAAkB,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,OAAO,EAAE,EAC1D,KAAK,SACW,EAClB;KACH;IAED,WAAW;QACT,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC;SAClC;QAED,IAAI,IAAI,CAAC,UAAU,KAAK,IAAI,EAAE;YAC5B,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC;SAClC;QAED,IAAI,IAAI,CAAC,UAAU,KAAK,IAAI,EAAE;YAC5B,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC;SAClC;QAED,OAAO,IAAI,CAAC,kBAAkB,EAAE,CAAC;KAClC;IAED,MAAM;QACJ,QACEA,QAACG,UAAI,qDACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,IAEA,IAAI,CAAC,WAAW,EAAE,CACd,EACP;KACH;;;;;;","names":["h","getButtonClasses","a11yBoolean","Host"],"sources":["src/components/menu/menu-expand-icon.scss?tag=ix-menu-expand-icon&encapsulation=shadow","src/components/menu/menu-expand-icon.tsx"],"sourcesContent":["/\n SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n@import 'common-variables';\n@import 'legacy/components/buttons';\n@import 'mixins/hover';\n@import 'mixins/shadow-dom/component';\n\n$focus-bdr-width: 0.0625rem;\n\n:host {\n @include ix-component;\n\n display: flex;\n justify-content: center;\n align-items: center;\n height: 2rem;\n width: 2rem;\n border-radius: var(--theme-btn--border-radius);\n pointer-events: all;\n\n svg {\n display: inline-block;\n vertical-align: middle;\n }\n\n .line {\n fill: var(--theme-menu-btn--color);\n opacity: 1;\n x: 2px;\n transition: x 0.075s ease-in var(--theme-default-time), transform 0.075s ease-in-out 0.075s,\n y 0.075s ease-in-out, opacity 0.075s linear 0.075s;\n transform-origin: center;\n }\n}\n\n@include host-hover {\n .menu-expand-button {\n background-color: var(--theme-menu-btn--background--hover);\n }\n}\n\n.menu-expand-button {\n width: 2rem;\n padding: 0;\n cursor: pointer;\n}\n\n@include host-active {\n .menu-expand-button {\n background-color: var(--theme-menu-btn--background--active);\n }\n}\n\n:host(.expanded) {\n svg .line-1 {\n opacity: 1;\n transform: rotate(-45deg);\n y: 11px;\n }\n\n svg .line-2 {\n opacity: 0;\n x: 9;\n }\n\n svg .line-3 {\n opacity: 1;\n transform: rotate(45deg);\n y: 11px;\n }\n}\n","/\n * SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n/\n * SPDX-FileCopyrightText: 2024 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { Component, h, Host, Prop } from '@stencil/core';\nimport { getButtonClasses } from '../button/base-button';\nimport { a11yBoolean } from '../utils/a11y';\nimport { Breakpoint } from '../utils/breakpoints';\n\n/\n @internal\n /\n@Component({\n tag: 'ix-menu-expand-icon',\n styleUrl: './menu-expand-icon.scss',\n shadow: true,\n})\nexport class MenuExpandIcon {\n /* Accessibility label for the menu expand icon (MANDATORY) /\n @Prop() ixAriaLabel: string = 'Expand';\n\n /* Whether the menu expand icon displays the expanded state or not /\n @Prop({ reflect: true }) expanded = false;\n\n /* Controls which icon is displayed /\n @Prop({ reflect: true }) breakpoint?: Breakpoint;\n\n /* Display as pinned */\n @Prop() pinned = false;\n\n getSmallScreenIcon() {\n return (\n <button\n class={{\n ...getButtonClasses(\n 'secondary',\n false,\n true,\n true,\n false,\n false,\n false\n ),\n 'menu-expand-button': true,\n }}\n type=\"button\"\n aria-label={this.ixAriaLabel ? this.ixAriaLabel : null}\n aria-pressed={a11yBoolean(this.expanded)}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n width=\"24\"\n height=\"24\"\n >\n <rect class=\"line line-1\" x=\"2\" y=\"5\" width=\"20\" height=\"2\"></rect>\n <rect class=\"line line-2\" x=\"2\" y=\"11\" width=\"13\" height=\"2\"></rect>\n <rect class=\"line line-3\" x=\"2\" y=\"17\" width=\"20\" height=\"2\"></rect>\n </svg>\n </button>\n );\n }\n\n getLargeScreenIcon() {\n return (\n <ix-icon-button\n icon={`double-chevron-${this.expanded ? 'left' : 'right'}`}\n ghost\n ></ix-icon-button>\n );\n }\n\n getMenuIcon() {\n if (this.pinned) {\n return this.getLargeScreenIcon();\n }\n\n if (this.breakpoint === 'md') {\n return this.getLargeScreenIcon();\n }\n\n if (this.breakpoint === 'lg') {\n return this.getLargeScreenIcon();\n }\n\n return this.getSmallScreenIcon();\n }\n\n render() {\n return (\n <Host\n class={{\n expanded: this.expanded,\n }}\n >\n {this.getMenuIcon()}\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ix-menu-item.cjs.entry.js CHANGED Viewed

@@ -89,15 +89,15 @@ const MenuItem = class {
                 slot: 'bottom',
             };
         }
-        return (index.h(index.Host, Object.assign({ key: '88e8f15c522e435f3d0cf1873cc583d241145264', class: {
+        return (index.h(index.Host, Object.assign({ key: '2354afb58f352da2049c890dbc5e3e50f09dba0b', class: {
                 disabled: this.disabled,
                 'home-tab': this.home,
                 'bottom-tab': this.bottom,
                 active: this.active,
                 'tab-nested': this.isHostedInsideCategory,
-            } }, extendedAttributes), index.h("button", { key: '581d840e9f95e029300a3f14bc63841b919d7639', class: "tab", tabIndex: this.disabled ? -1 : 0, ref: this.buttonRef }, (this.icon || this.tabIcon) && (index.h("ix-icon", { key: 'b31f3ea13d00770520b0c3a1867fb7f9a9e42a21', class: 'tab-icon', name: (_a = this.icon) !== null && _a !== void 0 ? _a : this.tabIcon })), this.notifications ? (index.h("div", { class: "notification" }, index.h("div", { class: "pill" }, this.notifications))) : null, index.h("span", { key: '977480b74cf07ffd13a9502d679fd3be4103fb17', class: "tab-text text-default" }, this.label, index.h("slot", { key: '19f5dfc4e6e8909391dc71c8593470dd8f408fd4' }))), !this.isCategory &&
+            } }, extendedAttributes), index.h("button", { key: '8018df4a7addace8a43ecfacbb62bc0441cb1454', class: "tab", tabIndex: this.disabled ? -1 : 0, ref: this.buttonRef }, (this.icon || this.tabIcon) && (index.h("ix-icon", { key: 'ae5b887f0dce48499d40173ececb78de88a4dc49', class: 'tab-icon', name: (_a = this.icon) !== null && _a !== void 0 ? _a : this.tabIcon })), this.notifications ? (index.h("div", { class: "notification" }, index.h("div", { class: "pill" }, this.notifications))) : null, index.h("span", { key: '82ffbcea81d54f721940ff582edb456a29ada0df', class: "tab-text text-default" }, this.label, index.h("slot", { key: '96994438e88c498851d36ff8ab209a15347bd228' }))), !this.isCategory &&
             !this.isHostedInsideCategory &&
-            !this.menuExpanded && (index.h("ix-tooltip", { key: 'e742d5f121663b823cc9a748c2fc8abafbe4d47e', for: this.buttonRef.waitForCurrent(), placement: 'right', showDelay: 1000 }, this.tooltip))));
+            !this.menuExpanded && (index.h("ix-tooltip", { key: 'c6c3f4431e58275cbab1c0f8573e5387732ea4e4', for: this.buttonRef.waitForCurrent(), placement: 'right', showDelay: 1000 }, this.tooltip))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {