npm - @siemens/ix - Versions diffs - 4.2.0 → 4.3.0 - Mend

@siemens/ix 4.2.0 → 4.3.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 (928) hide show

package/dist/esm/ix-key-value-list.entry.js CHANGED Viewed

@@ -11,7 +11,7 @@ const KeyValueList = class {
         this.striped = false;
     }
     render() {
-        return (h(Host, { key: 'fcc3ec3470c25cac50b88a1006b30be059f778f8', class: { keyValueList: true, 'keyValueList--striped': this.striped } }, h("slot", { key: '05645a91f92d7db584bd8235f73979249870e734' })));
+        return (h(Host, { key: '8ac8c1edacddbe11072e692c165c338bdaa6fcdf', class: { keyValueList: true, 'keyValueList--striped': this.striped } }, h("slot", { key: '844c573286e6022f4d3f53086b584425306f7f1e' })));
     }
 };
 KeyValueList.style = keyValueListCss;

package/dist/esm/ix-key-value.entry.js CHANGED Viewed

@@ -11,7 +11,7 @@ const KeyValue = class {
         this.labelPosition = 'top';
     }
     render() {
-        return (h(Host, { key: '7fb93d7b2fbcf2ce8aac64eda186d82a5a45cbe7', class: `keyValue keyValue--${this.labelPosition === 'top' ? 'column' : 'row'}` }, this.icon && (h("ix-icon", { key: '4ec1a309785fba489f0c8d9dfb2c024268c92193', name: this.icon, size: "24", class: "keyValue__icon", "aria-label": this.ariaLabelIcon })), h("div", { key: '95fb53fe545cd00bc84b6eeeba6c910eff2143cc', class: "keyValue__content" }, h("div", { key: '631b09a0969534b81538968c50c886b5337a0765', class: "content__label" }, this.label), h("div", { key: 'd45d5050124bf055a05cd71305b2b4e9d30a572d', class: {
+        return (h(Host, { key: 'ee855752985c8321f4f9608cb957acd093293a9f', class: `keyValue keyValue--${this.labelPosition === 'top' ? 'column' : 'row'}` }, this.icon && (h("ix-icon", { key: '6bfb94d5df575189c0df6e86cd65ea25a2dddecc', name: this.icon, size: "24", class: "keyValue__icon", "aria-label": this.ariaLabelIcon })), h("div", { key: '028c1ca00511298ae99c1088a2800c0b7ccd97bd', class: "keyValue__content" }, h("div", { key: '1b61165be2e1462f3d18e325236f9175b3a84a0d', class: "content__label" }, this.label), h("div", { key: 'd778bac4980281cce97bade4247b8f3b62191e1b', class: {
                 content__value: true,
                 'has-customValue': this.value === undefined,
             } }, this.value !== undefined ? (this.value) : (h("slot", { name: "custom-value" }))))));

package/dist/esm/ix-kpi.entry.js CHANGED Viewed

@@ -33,13 +33,13 @@ const Kpi = class {
         return tooltip;
     }
     render() {
-        return (h(Host, { key: '34fcbb68ba73d08619ef12fd9595c9c684aa3d10', title: this.getTooltipText(), tabindex: "1", class: {
+        return (h(Host, { key: '66e7a14d365489072d53128deddfe610ea2c0589', title: this.getTooltipText(), tabindex: "1", class: {
                 stacked: this.orientation === 'vertical',
-            } }, h("div", { key: 'cd4910a41ee179ea21166c80322e5361dd132850', class: {
+            } }, h("div", { key: '724d4ad85701d09ad46ad85d5d62150195545cb1', class: {
                 'kpi-container': true,
                 alarm: this.state === 'alarm',
                 warning: this.state === 'warning',
-            } }, h("span", { key: '33226fc8e0561e4db98181be1b6595534561bab7', class: "kpi-label" }, this.getStateIcon(), h("span", { key: '06cb693420e43f2475cfae0d8f2217a2770ac5cc', class: "kpi-label-text" }, this.label)), h("span", { key: '8a837f1466b2670d473983aaffc2742737fb8a9a', class: "kpi-value-container" }, h("span", { key: '5e66113f88a3637aaf83c3482a5625b290e25763', class: "kpi-value" }, this.value), this.unit ? h("span", { class: "kpi-unit" }, this.unit) : ''))));
+            } }, h("span", { key: '581ec9d9dac67105f5d92fc714511a1578d0833d', class: "kpi-label" }, this.getStateIcon(), h("span", { key: 'a81cb7fe8322e8d0682527c7d961a4d1fb32fd58', class: "kpi-label-text" }, this.label)), h("span", { key: 'ed7cefc54de202ccab0e9d1ec1adc42eb74f6f78', class: "kpi-value-container" }, h("span", { key: 'cade7321b2d3d1dc564480b3ad7f769f079b84d1', class: "kpi-value" }, this.value), this.unit ? h("span", { class: "kpi-unit" }, this.unit) : ''))));
     }
 };
 Kpi.style = kpiCss;

package/dist/esm/ix-layout-auto.entry.js CHANGED Viewed

@@ -76,7 +76,7 @@ const LayoutForm = class {
         });
     }
     render() {
-        return (h(Host, { key: '48511195af19191b832713a828ac0945b06a4898' }, h("div", { key: '4a51469ffe227db5c361734fc3122a98f7e0fbcc', class: "container" }, h("slot", { key: '6ab367e83612df056e40392bced22c5f80457486' }))));
+        return (h(Host, { key: 'e80a4427592546a5c5155d23108840ec2e34ecd3' }, h("div", { key: 'cf63d295988d17bf976bfddd13c13f8987b2ca1a', class: "container" }, h("slot", { key: '0eaa6a54b56fa3f43adde3620178ccd25447507e' }))));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/ix-link-button.entry.js CHANGED Viewed

@@ -18,13 +18,13 @@ const LinkButton = class {
         this.target = '_self';
     }
     render() {
-        return (h(Host, { key: '83b41ef8a3bef06a033a9a20c30a4ae1e83066e8' }, h("a", { key: '955dc6e492eec929e592947ec18009d744d1f973', title: this.url, tabindex: "0", class: {
+        return (h(Host, { key: '4d24f0a12d133ab58cb2a873536e68db17df2d5a' }, h("a", { key: '0585700d404cf2d49597085527608c6db40ea97e', title: this.url, tabindex: "0", class: {
                 'link-button': true,
                 disabled: this.disabled,
-            }, href: this.disabled ? undefined : this.url, target: this.target }, h("ix-icon", { key: 'b0589b7cedf757244950b1595916f8c838ae603d', class: "icon", name: iconChevronRightSmall, size: "16", "aria-hidden": "true" }), h("div", { key: 'c3ceb43628b0a48d60bbcd6bb54a4ad493ae3de8', class: {
+            }, href: this.disabled ? undefined : this.url, target: this.target }, h("ix-icon", { key: '68d6611903eec80a879d4bfbb90a71fcdd05d5a0', class: "icon", name: iconChevronRightSmall, size: "16", "aria-hidden": "true" }), h("div", { key: '4e4b66cb6cd469f56d9029a0ddbf5a44ea838128', class: {
                 link: true,
                 disabled: this.disabled,
-            } }, h("slot", { key: '2bd6071e8aad57fb13226d8452b0649367c6b750' })))));
+            } }, h("slot", { key: 'eb961e003cfa95ceaf0033a19d1e12ff92b7f78f' })))));
     }
 };
 LinkButton.style = linkButtonCss;

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

@@ -15,7 +15,7 @@ const MenuAboutItem = class {
         });
     }
     render() {
-        return (h(Host, { key: 'c150379d52f7dd0744ec480c35909937abef9c90' }, h("slot", { key: '37edb415a550ba73903bd6142162c42fe7be9d34' })));
+        return (h(Host, { key: '2877a9c9386fb74d8c4fcfb72d5f31d8aa9057f1' }, h("slot", { key: 'fc2e89e7a6a427dbbf3e2030949a4db31c34957e' })));
     }
     static get watchers() { return {
         "label": ["watchLabel"]

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

@@ -20,16 +20,16 @@ const MenuAboutNews = class {
         this.expanded = false;
     }
     render() {
-        return (h(Host, { key: '61a51cc04b238505c64285babebaaddf1201a9f7', class: {
+        return (h(Host, { key: '7443d209d383de9e46d8c024c1756ae814c5d764', class: {
                 expanded: this.expanded,
                 show: !this.show,
-            } }, h("div", { key: 'c63c6cab269ef75f01d0396333c5c44ee271d354', class: "banner-container" }, h("ix-icon", { key: '2a3b5ced1c9f9fce0f742a34d9862e115807f6fb', color: "color-inv-contrast-text", name: iconShout, size: "32" }), h("svg", { key: '2433dd408f46a4d0f47e5cf075980b6a2ea2ece7', viewBox: "0 0 48 56", xmlns: "http://www.w3.org/2000/svg" }, h("polygon", { key: '386186a0847a504ca07052e1a49ee0c9f6314377', points: "0 0 48 0 48 56 24 48 0 56" }))), h("div", { key: 'ec280ef23c279507e186fa0ba0743e64e49d38c8', class: "cui-popover-news-header" }, h("ix-typography", { key: '784c5718192c7641e43004439cedcdc0f6285380', format: "label", bold: true }, this.label)), h("ix-icon-button", { key: '0c5a987a93067b0641ad0d7cd99e747aaa884d40', size: "24", icon: iconClose, iconColor: "color-soft-text", variant: "tertiary", onClick: () => {
+            } }, h("div", { key: '034c93b01133fa50d28c0e4ce98becc53fe29158', class: "banner-container" }, h("ix-icon", { key: '69df7443eba7107db4d4f20d2a628159a7ed8660', color: "color-inv-contrast-text", name: iconShout, size: "32" }), h("svg", { key: '36cc1e785395307d29813cac4f13b1309ee2d257', viewBox: "0 0 48 56", xmlns: "http://www.w3.org/2000/svg" }, h("polygon", { key: '35d4a86b62c225dc03329e6e53bdd6180d1a6b8e', points: "0 0 48 0 48 56 24 48 0 56" }))), h("div", { key: 'd5f1d76a2bf661fb865fa7c4857b0f20d6f225dc', class: "cui-popover-news-header" }, h("ix-typography", { key: 'd8ef22907758393fe430cc2a4940dea8ee7372e8', format: "label", bold: true }, this.label)), h("ix-icon-button", { key: '2fb7cf52ee3bf3e475fc5fa6d0aaadec96246acc', size: "24", icon: iconClose, iconColor: "color-soft-text", variant: "tertiary", onClick: () => {
                 this.show = false;
                 this.closePopover.emit();
-            } }), h("div", { key: '780df8bab613bad3b80a3528947fdc0bab41187c', class: "slot-container" }, h("slot", { key: '1992c8d99353665ee6b88b4d21c34869284029d6' })), this.aboutItemLabel ? (h("div", { class: "cui-popover-news-footer" }, h("ix-button", { variant: "primary", onClick: (e) => {
+            } }), h("div", { key: '8875b7027424233f78ac46c52cbeccc3d4fb7560', class: "slot-container" }, h("slot", { key: 'b662f3b8c11a9c3ea639ed6b753a4b80ed038bec' })), this.aboutItemLabel ? (h("div", { class: "cui-popover-news-footer" }, h("ix-button", { variant: "primary", onClick: (e) => {
                 this.show = false;
                 this.showMore.emit(e);
-            } }, this.i18nShowMore))) : null, h("div", { key: 'b877e4087ebe56fca5c82a7acada5ba7c7ef8abb', id: "arrow" })));
+            } }, this.i18nShowMore))) : null, h("div", { key: '97cbdaf247a6f83b9361121cbac596dc86e2bb28', id: "arrow" })));
     }
 };
 MenuAboutNews.style = menuAboutNewsCss;

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

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, f as forceUpdate, h, g as getElement } from './index-CtoreFVF.js';
-import { s as syncTabDisplay, i as initialize, M as MenuTabs } from './ix-menu-settings-f9o5GGw5.js';
+import { s as syncTabDisplay, i as initialize, M as MenuTabs } from './ix-menu-settings-CG60xQKd.js';
 import './index-8HpPmDK_.js';
 const menuAboutCss = ".text-xs{font-family:Siemens Sans, sans-serif;font-size:0.625rem;font-weight:400;line-height:1.4em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-s{font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-caption{font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-caption-single{font-family:Siemens Sans, sans-serif;font-size:0.75rem;font-weight:700;line-height:1em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.429em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default-single{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:400;line-height:1.143em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default-title{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-default-title-single{font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.143em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l-single{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:400;line-height:1.25em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l-title{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.5em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-l-title-single{font-family:Siemens Sans, sans-serif;font-size:1rem;font-weight:700;line-height:1.25em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-h2{font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:700;line-height:1.455em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}.text-xl{font-family:Siemens Sans, sans-serif;font-size:1.375rem;font-weight:400;line-height:1.091em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}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}";
@@ -13,6 +13,10 @@ const MenuAbout = class {
          * Content of the header
          */
         this.label = 'About & legal information';
+        /**
+         * Aria label for close button
+         */
+        this.ariaLabelCloseButton = 'Close About';
         /** @internal */
         this.show = false;
     }
@@ -28,7 +32,7 @@ const MenuAbout = class {
         forceUpdate(this.el);
     }
     render() {
-        return h(MenuTabs, { key: 'e49c1819db2fcba5b330c776c84e905d6f1aef87', context: this });
+        return h(MenuTabs, { key: 'ca696d609e81a77afbb7210a699c89e52cf2b59f', context: this });
     }
     get el() { return getElement(this); }
     static get watchers() { return {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ix-menu-about.entry.js","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@use './common-variables' as vars;\n@use 'legacy/fonts';\n\n:host {\n display: block;\n background-color: var(--theme-nav-overlay--background);\n padding: vars.$medium-space vars.$default-space vars.$default-space\n vars.$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: vars.$x-large-space;\n margin-bottom: vars.$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 syncTabDisplay,\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 /* @internal /\n @Prop() show = false;\n\n /\n Active tab changed\n * @since 3.0.0\n /\n @Event() tabChange!: EventEmitter<string>;\n\n /\n About and Legal closed\n */\n @Event() close!: EventEmitter<CustomCloseEvent>;\n\n @State() items!: HTMLIxMenuAboutItemElement[];\n\n @Watch('activeTabLabel')\n updateTab(newLabel: string, oldLabel: string) {\n if (newLabel !== oldLabel) {\n syncTabDisplay(this, newLabel);\n }\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"],"names":[],"mappings":";;;;AAAA,MAAM,YAAY,GAAG,ozGAAozG;;MCgC5zG,SAAS,GAAA,MAAA;AALtB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAcE;;AAEG;AACK,QAAA,IAAK,CAAA,KAAA,GAAG,2BAA2B;;~~AAGnC~~,QAAA,IAAI,CAAA,IAAA,GAAG,KAAK;AAiCrB;IAjBC,SAAS,CAAC,QAAgB,EAAE,QAAgB,EAAA;AAC1C,QAAA,IAAI,QAAQ,KAAK,QAAQ,EAAE;AACzB,YAAA,cAAc,CAAC,IAAI,EAAE,QAAQ,CAAC;;;IAIlC,iBAAiB,GAAA;QACf,UAAU,CAAC,IAAI,CAAC;;IAGlB,gBAAgB,GAAA;AACd,QAAA,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC;;IAGtB,MAAM,GAAA;AACJ,QAAA,OAAO,EAAC,QAAQ,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,OAAO,EAAE,IAAI,GAAI;;;;;;;;;;;"}
1	+ {"version":3,"file":"ix-menu-about.entry.js","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@use './common-variables' as vars;\n@use 'legacy/fonts';\n\n:host {\n display: block;\n background-color: var(--theme-nav-overlay--background);\n padding: vars.$medium-space vars.$default-space vars.$default-space\n vars.$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: vars.$x-large-space;\n margin-bottom: vars.$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 syncTabDisplay,\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 Aria label for close button\n /\n @Prop() ariaLabelCloseButton = 'Close About';\n\n /* @internal /\n @Prop() show = false;\n\n /\n Active tab changed\n * @since 3.0.0\n /\n @Event() tabChange!: EventEmitter<string>;\n\n /\n About and Legal closed\n */\n @Event() close!: EventEmitter<CustomCloseEvent>;\n\n @State() items!: HTMLIxMenuAboutItemElement[];\n\n @Watch('activeTabLabel')\n updateTab(newLabel: string, oldLabel: string) {\n if (newLabel !== oldLabel) {\n syncTabDisplay(this, newLabel);\n }\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"],"names":[],"mappings":";;;;AAAA,MAAM,YAAY,GAAG,ozGAAozG;;MCgC5zG,SAAS,GAAA,MAAA;AALtB,IAAA,WAAA,CAAA,OAAA,EAAA;;;;AAcE;;AAEG;AACK,QAAA,IAAK,CAAA,KAAA,GAAG,2BAA2B;AAE3C;;AAEG;AACK,QAAA,IAAoB,CAAA,oBAAA,GAAG,aAAa;;AAGpC,QAAA,IAAI,CAAA,IAAA,GAAG,KAAK;AAiCrB;IAjBC,SAAS,CAAC,QAAgB,EAAE,QAAgB,EAAA;AAC1C,QAAA,IAAI,QAAQ,KAAK,QAAQ,EAAE;AACzB,YAAA,cAAc,CAAC,IAAI,EAAE,QAAQ,CAAC;;;IAIlC,iBAAiB,GAAA;QACf,UAAU,CAAC,IAAI,CAAC;;IAGlB,gBAAgB,GAAA;AACd,QAAA,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC;;IAGtB,MAAM,GAAA;AACJ,QAAA,OAAO,EAAC,QAAQ,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAC,OAAO,EAAE,IAAI,GAAI;;;;;;;;;;;"}

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

@@ -1,6 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CtoreFVF.js';
-import { g as getSlottedElements } from './shadow-dom-i60z1FJC.js';
 import { x as iconLogOut } from './index-8HpPmDK_.js';
+import { a as a11yBoolean } from './a11y-Bb7pDeaQ.js';
+import { m as makeRef } from './make-ref-bcj7UEIC.js';
+import { g as getSlottedElements } from './shadow-dom-i60z1FJC.js';
 const menuAvatarCss = ":host{display:block;position:relative;margin-bottom:0.5rem;margin-right:0.75rem}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host .avatar{all:unset;box-sizing:border-box;display:flex;align-items:center;height:2.5rem;width:100%;max-height:2.5rem;padding-left:0.25rem;margin-left:0.41rem;margin-right:0.35rem;transition:var(--theme-default-time)}:host .avatar .avatar-name{display:flex;flex-direction:column;overflow:hidden;white-space:nowrap;margin-left:1rem;line-height:1.14}:host .avatar .avatar-name .text-default-single{color:var(--theme-nav-item-primary--color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host .avatar{border-radius:1.25rem}:host .avatar:not(.disabled):not(:disabled){cursor:pointer}:host .avatar:not(.disabled):not(:disabled):hover,:host .avatar:not(.disabled):not(:disabled).hover{background-color:var(--theme-avatar-btn--background--hover);color:var(--theme-avatar-btn--color--hover)}:host .avatar:not(.disabled):not(:disabled){cursor:pointer}:host .avatar:not(.disabled):not(:disabled):active,:host .avatar:not(.disabled):not(:disabled).active{background-color:var(--theme-avatar-btn--background--active);color:var(--theme-avatar-btn--color--active)}:host .avatar:focus-visible{outline:1px solid var(--theme-color-focus-bdr)}";
@@ -16,11 +18,19 @@ const MenuAvatar = class {
          *  Control the visibility of the logout button
          */
         this.hideLogoutButton = false;
+        /**
+         * Enable Popover API rendering for dropdown.
+         *
+         * @default false
+         * @since 4.3.0
+         */
+        this.enableTopLayer = false;
         /**
          * Control the visibility of the dropdown menu
          */
         this.showContextMenu = false;
         this.avatarElementId = 'ix-menu-avatar-id';
+        this.tooltipRef = makeRef();
     }
     onSlotChange() {
         const slot = this.hostElement.shadowRoot.querySelector('slot');
@@ -31,9 +41,16 @@ const MenuAvatar = class {
         this.showContextMenu = elements.length !== 0;
     }
     render() {
-        return (h(Host, { key: '6cff313b74cbbd668ed30dd7c04e060867ae0095', slot: "ix-menu-avatar" }, h("button", { key: 'c387330d89a9d5740f0af21ec4e7d0f077510064', class: "nav-item top-item avatar no-hover", title: this.top, id: this.avatarElementId, tabIndex: 0 }, h("ix-avatar", { key: '82f6207b4005ad8a799d29ce52a629d805d60b36', image: this.image, initials: this.initials }), h("div", { key: 'c1a6a4e03b3dda5b36a3caa6c7595a32407b9c19', class: "avatar-name" }, h("span", { key: 'a8b413ee5ec9a9f60d26ce695df3d9359831867d', class: "text-default-single", title: this.top }, this.top), h("span", { key: 'b333a5337d49199f9545eb30361fe5166d8a8725', class: "text-default-single", title: this.bottom }, this.bottom))), h("ix-dropdown", { key: '31b4149a67636711972e1f682da62a60f833e9f3', trigger: this.hostElement, placement: 'right-start', hidden: !this.showContextMenu && this.hideLogoutButton, offset: {
+        var _a;
+        const tooltipText = (_a = this.tooltipText) !== null && _a !== void 0 ? _a : this.top;
+        const ariaHidden = tooltipText === this.top;
+        return (h(Host, { key: '63251d35fc15b945de3bae097702c3e0e7377568', slot: "ix-menu-avatar" }, h("button", { key: 'f50dd772c58b7b20e966d0a992f6e2537ebbe5bc', class: "nav-item top-item avatar no-hover", id: this.avatarElementId, tabIndex: 0 }, h("ix-avatar", { key: '1b3ea2ab31cc248e021306b9399b5b2bbad1122f', image: this.image, initials: this.initials }), h("div", { key: '1e8aee8c464ebc41e99d00b6933f6682d1c98019', class: "avatar-name" }, h("span", { key: '3bc559472005be3d21b406fd9ea85fcb9737dcb6', class: "text-default-single" }, this.top), h("span", { key: '023fb55cd5229df9aadec9daf86834e16944a66f', class: "text-default-single" }, this.bottom))), !!tooltipText && (h("ix-tooltip", { key: '8e13fc36570e1152049b636ecabb042e7288c3e8', ref: this.tooltipRef, for: `#${this.avatarElementId}`, placement: 'right', "aria-hidden": a11yBoolean(ariaHidden), "aria-label": this.ariaLabelTooltip }, tooltipText)), h("ix-dropdown", { key: '6a7e04c67894981100c3b81eb6ac9c5d9a16194a', trigger: this.hostElement, placement: 'right-start', hidden: !this.showContextMenu && this.hideLogoutButton, offset: {
                 mainAxis: 16,
-            } }, h("slot", { key: 'a17ca070258b8b892c647f4cc2429b21562072c1', onSlotchange: () => this.onSlotChange() }), !this.hideLogoutButton && (h("ix-menu-avatar-item", { key: 'cbc2544543237b2874744c0678838b701ec89d4a', label: this.i18nLogout, icon: iconLogOut, onClick: (e) => {
+            }, onShowChanged: (event) => {
+                if (event.detail && this.tooltipRef.current) {
+                    this.tooltipRef.current.hideTooltip(0);
+                }
+            }, enableTopLayer: this.enableTopLayer }, h("slot", { key: 'd7444d53d15826d0999476c55bc428a89a6b73fa', onSlotchange: () => this.onSlotChange() }), !this.hideLogoutButton && (h("ix-menu-avatar-item", { key: 'f6c1fc16b2b39ef2277ae01485f1b7014e72e568', label: this.i18nLogout, icon: iconLogOut, onClick: (e) => {
                 this.logoutClick.emit(e);
             } })))));
     }

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ix-menu-avatar.entry.js","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@use './common-variables' as vars;\n@use 'mixins/text-truncation';\n@use 'mixins/hover';\n@use 'mixins/shadow-dom/component';\n\n:host {\n display: block;\n position: relative;\n margin-bottom: 0.5rem;\n margin-right: 0.75rem;\n\n @include component.ix-component;\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: vars.$default-space;\n line-height: 1.14;\n\n .text-default-single {\n color: var(--theme-nav-item-primary--color);\n @include text-truncation.ellipsis;\n }\n }\n\n border-radius: 1.25rem;\n\n @include hover.hover {\n background-color: var(--theme-avatar-btn--background--hover);\n color: var(--theme-avatar-btn--color--hover);\n }\n\n @include hover.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~~';\nimport { ~~iconLogOut~~ } from '~~@siemens~~/ix-~~icons/icons~~';\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 @Prop() image?: string;\n\n /\n Display the initials of the user. Will be overwritten by image\n /\n @Prop() initials?: string;\n\n /\n i18n label for 'Logout' button\n /\n @Prop({ attribute: 'i18n-logout' }) i18nLogout: string = 'Logout';\n\n /\n Control the visibility of the logout button\n /\n @Prop() hideLogoutButton: boolean = false;\n\n /\n Control the visibility of the dropdown menu\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.hideLogoutButton}\n offset={{\n mainAxis: 16,\n }}\n >\n <slot onSlotchange={() => this.onSlotChange()}></slot>\n {!this.hideLogoutButton && (\n <ix-menu-avatar-item\n label={this.i18nLogout}\n icon={iconLogOut}\n onClick={(e) => {\n this.logoutClick.emit(e);\n }}\n ></ix-menu-avatar-item>\n )}\n </ix-dropdown>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"~~;;;;~~AAAA,MAAM,aAAa,GAAG,29DAA29D;;~~MC0Bp~~+D,UAAU,GAAA,MAAA;AALvB,IAAA,WAAA,CAAA,OAAA,EAAA;;;~~AA4BE~~;;AAEG;AACiC,QAAA,IAAU,CAAA,UAAA,GAAW,QAAQ;AAEjE;;AAEG;AACK,QAAA,IAAgB,CAAA,gBAAA,GAAY,KAAK;AAEzC;;AAEG;AACM,QAAA,IAAe,CAAA,eAAA,GAAY,KAAK;AAOjC,QAAA,IAAe,CAAA,eAAA,GAAG,mBAAmB;~~AAqD9C~~;~~IAnDC~~,YAAY,GAAA;AACV,QAAA,MAAM,IAAI,GAAG,IAAI,CAAC,WAAW,CAAC,UAAW,CAAC,aAAa,CAAC,MAAM,CAAC;QAC/D,IAAI,CAAC,IAAI,EAAE;YACT;;AAEF,QAAA,MAAM,QAAQ,GAAG,kBAAkB,CAAC,IAAI,CAAC;QACzC,IAAI,CAAC,eAAe,GAAG,QAAQ,CAAC,MAAM,KAAK,CAAC;;IAG9C,MAAM,GAAA;~~AACJ~~,QAAA,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,gBAAgB,EAAA,EACzB,CAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,mCAAmC,EACzC,~~KAAK,~~EAAE,~~IAAI,CAAC,GAAG,EACf,~~EAAE,~~EAAE,~~IAAI,CAAC,eAAe,EACxB,QAAQ,EAAE,CAAC,EAAA,EAEX,CAAW,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAc,CAAA,EAEnE,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,aAAa,EAAA,EACtB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,qBAAqB,~~EAAC~~,~~KAAK,EAAE,~~IAAI,CAAC,GAAG,~~EAAA~~,~~EAC9C~~,~~IAAI~~,~~CAAC,GAAG,CACJ,EACP,~~CAAA,~~CAAA,~~MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,~~EAAM~~,KAAK,EAAC,qBAAqB,~~EAAC~~,~~KAAK,~~EAAE,IAAI,CAAC,MAAM,~~IACjD~~,IAAI,CAAC,~~MAAM~~,~~CACP~~,~~CACH~~,~~CACC~~,~~EACT~~,CACE,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAE,IAAI,CAAC,WAAW,EACzB,SAAS,EAAE,aAAa,EACxB,MAAM,EAAE,CAAC,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,gBAAgB,EACtD,MAAM,EAAE;AACN,gBAAA,QAAQ,EAAE,EAAE;~~aACb~~,EAAA,~~EAED~~,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,YAAY,EAAE,MAAM,IAAI,CAAC,YAAY,EAAE,EAAS,CAAA,EACrD,CAAC,IAAI,CAAC,gBAAgB,KACrB,CACE,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,IAAI,CAAC,UAAU,EACtB,IAAI,EAAE,UAAU,EAChB,OAAO,EAAE,CAAC,CAAC,KAAI;AACb,gBAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC;AAC1B,aAAC,EACoB,CAAA,CACxB,CACW,CACT;;;;;;;;"}
1	+ {"version":3,"file":"ix-menu-avatar.entry.js","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@use './common-variables' as vars;\n@use 'mixins/text-truncation';\n@use 'mixins/hover';\n@use 'mixins/shadow-dom/component';\n\n:host {\n display: block;\n position: relative;\n margin-bottom: 0.5rem;\n margin-right: 0.75rem;\n\n @include component.ix-component;\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: vars.$default-space;\n line-height: 1.14;\n\n .text-default-single {\n color: var(--theme-nav-item-primary--color);\n @include text-truncation.ellipsis;\n }\n }\n\n border-radius: 1.25rem;\n\n @include hover.hover {\n background-color: var(--theme-avatar-btn--background--hover);\n color: var(--theme-avatar-btn--color--hover);\n }\n\n @include hover.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 { iconLogOut } from '@siemens/ix-icons/icons';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n State,\n} from '@stencil/core';\nimport { a11yBoolean } from '../utils/a11y';\nimport { makeRef } from '../utils/make-ref';\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 @Prop() image?: string;\n\n /\n Display the initials of the user. Will be overwritten by image\n /\n @Prop() initials?: string;\n\n /\n Tooltip text to display on hover. If not set, the 'top' property (user name) will be used as the default tooltip text.\n \n @since 4.3.0.\n /\n @Prop() tooltipText?: string;\n\n /\n aria-label for the tooltip\n \n @since 4.3.0.\n /\n @Prop() ariaLabelTooltip?: string;\n\n /\n i18n label for 'Logout' button\n /\n @Prop({ attribute: 'i18n-logout' }) i18nLogout: string = 'Logout';\n\n /\n Control the visibility of the logout button\n /\n @Prop() hideLogoutButton: boolean = false;\n\n /\n Enable Popover API rendering for dropdown.\n \n @default false\n * @since 4.3.0\n /\n @Prop() enableTopLayer: boolean = false;\n\n /\n Control the visibility of the dropdown menu\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 private readonly tooltipRef = makeRef<HTMLIxTooltipElement>();\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 const tooltipText = this.tooltipText ?? this.top;\n const ariaHidden = tooltipText === this.top;\n\n return (\n <Host slot=\"ix-menu-avatar\">\n <button\n class=\"nav-item top-item avatar no-hover\"\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\">{this.top}</span>\n <span class=\"text-default-single\">{this.bottom}</span>\n </div>\n </button>\n {!!tooltipText && (\n <ix-tooltip\n ref={this.tooltipRef}\n for={`#${this.avatarElementId}`}\n placement={'right'}\n aria-hidden={a11yBoolean(ariaHidden)}\n aria-label={this.ariaLabelTooltip}\n >\n {tooltipText}\n </ix-tooltip>\n )}\n <ix-dropdown\n trigger={this.hostElement}\n placement={'right-start'}\n hidden={!this.showContextMenu && this.hideLogoutButton}\n offset={{\n mainAxis: 16,\n }}\n onShowChanged={(event) => {\n if (event.detail && this.tooltipRef.current) {\n this.tooltipRef.current.hideTooltip(0);\n }\n }}\n enableTopLayer={this.enableTopLayer}\n >\n <slot onSlotchange={() => this.onSlotChange()}></slot>\n {!this.hideLogoutButton && (\n <ix-menu-avatar-item\n label={this.i18nLogout}\n icon={iconLogOut}\n onClick={(e) => {\n this.logoutClick.emit(e);\n }}\n ></ix-menu-avatar-item>\n )}\n </ix-dropdown>\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"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"}

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

@@ -1,8 +1,8 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CtoreFVF.js';
+import { g as iconChevronDownSmall } from './index-8HpPmDK_.js';
 import { a as animate } from './anime.esm-DhE1t8Qh.js';
 import { c as closestIxMenu } from './context-BniHpAE1.js';
 import { c as createMutationObserver } from './mutation-observer-CX81WQtk.js';
-import { g as iconChevronDownSmall } from './index-8HpPmDK_.js';
 import './typed-event-BdCnOrqW.js';
 /*
@@ -180,7 +180,7 @@ const MenuCategory = class {
         }
     }
     render() {
-        return (h(Host, { key: '13ac63c3321e33e4781ab642577464fde79c6bf2', class: {
+        return (h(Host, { key: 'edd1e65e5cd1cc96d1da1decfa666654d3926f6d', class: {
                 expanded: this.showItems,
             }, onPointerEnter: () => {
                 this.enterLeaveDebounce.onEnter();
@@ -189,14 +189,14 @@ const MenuCategory = class {
                     return;
                 }
                 this.enterLeaveDebounce.onLeave();
-            } }, h("ix-menu-item", { key: '25e8a0a50ea1540e346e830045275e6a0c63327d', class: 'category-parent', active: this.isNestedItemActive(), notifications: this.notifications, icon: this.icon, onClick: (e) => this.onCategoryClick(e), onFocus: () => this.onPointerEnter(), tooltipText: this.tooltipText, isCategory: true }, h("div", { key: '5b0dcefb391bada721218f4d3ba690c1a2de966e', class: "category" }, h("div", { key: 'f65e560cb7a6ab490220b814f9e66bbfd010bc44', class: "category-text" }, this.label), h("ix-icon", { key: '672a4f90f58ad0cdf023d050d4b3f75114a4ee52', name: iconChevronDownSmall, class: {
+            } }, h("ix-menu-item", { key: 'bd7b6f2c2bef925249db2b73ad14e1454a291939', class: 'category-parent', active: this.isNestedItemActive(), notifications: this.notifications, icon: this.icon, onClick: (e) => this.onCategoryClick(e), onFocus: () => this.onPointerEnter(), tooltipText: this.tooltipText, isCategory: true }, h("div", { key: '1bdd93be15ca3e24d491ce54aed4e441617bdbaf', class: "category" }, h("div", { key: '37444ebec527ba83b30675b3c01411770989f77b', class: "category-text" }, this.label), h("ix-icon", { key: '3e3967c7973058113c32f4f90a9343079bfc4d52', name: iconChevronDownSmall, class: {
                 'category-chevron': true,
                 'category-chevron--open': this.showItems,
-            } }))), h("div", { key: 'd7f0f085f33a09d7c57ca18818a90125b3c2e2bf', ref: (ref) => (this.menuItemsContainer = ref), class: {
+            }, "aria-hidden": "true" }))), h("div", { key: '270aa92509cdf90771863199a9483d5039289d94', ref: (ref) => (this.menuItemsContainer = ref), class: {
                 'menu-items': true,
                 'menu-items--expanded': this.showItems,
                 'menu-items--collapsed': !this.showItems,
-            } }, this.showItems ? h("slot", null) : null), h("ix-dropdown", { key: 'e5b6be4ba14c97ef2e85abd01833bed929b1efa4', closeBehavior: 'both', show: this.showDropdown, onShowChanged: ({ detail: dropdownShown }) => {
+            } }, this.showItems ? h("slot", null) : null), h("ix-dropdown", { key: 'f81b8c80a0bef8cec723260df27c01ed0299a4d4', closeBehavior: 'both', show: this.showDropdown, onShowChanged: ({ detail: dropdownShown }) => {
                 this.showDropdown = dropdownShown;
             }, class: 'category-dropdown', anchor: this.hostElement, placement: "right-start", offset: {
                 mainAxis: 3,
@@ -209,7 +209,7 @@ const MenuCategory = class {
                         e.preventDefault();
                     }
                 }
-            } }, h("ix-dropdown-item", { key: '90e095e2d61e5d359c29c742e4e84457ef47426f', class: 'category-dropdown-header' }, h("ix-typography", { key: '67efee1940b51e0457ccec7f0a271684ea6df881', format: "label", bold: true, textColor: "std" }, this.label)), h("ix-divider", { key: '2ec48cbab9dc6a223fcc636e59b497b1db315369' }), h("slot", { key: 'e32fb89cf4045faae851af8d1ed1c4ab394e1709' }))));
+            } }, h("ix-dropdown-item", { key: '88b93b5ac540e470b659e0fa0e2a788cf9da0b3d', class: 'category-dropdown-header' }, h("ix-typography", { key: '2664b30d7a7aa21de7dd6874a8f8471bcb5f0dee', format: "label", bold: true, textColor: "std" }, this.label)), h("ix-divider", { key: 'af94566fdd4ad843ce75332b8e511201bfad790c' }), h("slot", { key: '735e220778d5ac78309c4133d11a1b8fad67431e' }))));
     }
     get hostElement() { return getElement(this); }
 };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ix-menu-category.entry.js","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@use 'mixins/shadow-dom/component';\n@use 'mixins/text-truncation';\n\n:host {\n display: flex;\n flex-direction: column;\n position: relative;\n\n @include component.ix-component;\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\n @include text-truncation.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 { animate } from 'animejs';\nimport { closestIxMenu } from '../utils/application-layout/context';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport { createEnterLeaveDebounce } from './enter-leave';\nimport { iconChevronDownSmall } from '@siemens/ix-icons/icons';\nimport type { IxMenuItemBase } from './../menu-item/menu-item.interface';\nconst DefaultIxMenuItemHeight = 40;\nconst DefaultAnimationTimeout = 150;\n\n@Component({\n tag: 'ix-menu-category',\n styleUrl: 'menu-category.scss',\n shadow: true,\n})\nexport class MenuCategory implements IxMenuItemBase {\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 /\n Will be shown as tooltip text, if not provided menu text content will be used.\n \n @since 4.0.0\n /\n @Prop() tooltipText?: string;\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 animate(this.menuItemsContainer!, {\n duration: DefaultAnimationTimeout,\n easing: 'easeInSine',\n opacity: [1, 0],\n maxHeight: [this.getNestedItemsHeight() + DefaultIxMenuItemHeight, 0],\n onComplete: () => {\n setTimeout(() => {\n this.showItems = false;\n this.showDropdown = false;\n }, DefaultAnimationTimeout + slotHideThresholdMs);\n },\n });\n }\n\n private animateFadeIn() {\n animate(this.menuItemsContainer!, {\n duration: DefaultAnimationTimeout,\n easing: 'easeInSine',\n opacity: [0, 1],\n maxHeight: [0, this.getNestedItemsHeight() + DefaultIxMenuItemHeight],\n onBegin: () => {\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 const oldNestedItemsLength = this.nestedItems.length;\n this.nestedItems = this.getNestedItems();\n\n if (\n this.showItems &&\n this.menuItemsContainer &&\n oldNestedItemsLength !== this.nestedItems.length\n ) {\n this.menuItemsContainer.style.maxHeight = `${\n this.getNestedItemsHeight() + DefaultIxMenuItemHeight\n }px`;\n }\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 tooltipText={this.tooltipText}\n isCategory\n >\n <div class=\"category\">\n <div class=\"category-text\">{this.label}</div>\n <ix-icon\n name={iconChevronDownSmall}\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 textColor=\"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"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"ix-menu-category.entry.js","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@use 'mixins/shadow-dom/component';\n@use 'mixins/text-truncation';\n\n:host {\n display: flex;\n flex-direction: column;\n position: relative;\n\n @include component.ix-component;\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\n @include text-truncation.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 { iconChevronDownSmall } from '@siemens/ix-icons/icons';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n} from '@stencil/core';\nimport { animate } from 'animejs';\nimport { closestIxMenu } from '../utils/application-layout/context';\nimport { createMutationObserver } from '../utils/mutation-observer';\nimport type { IxMenuItemBase } from './../menu-item/menu-item.interface';\nimport { createEnterLeaveDebounce } from './enter-leave';\nconst DefaultIxMenuItemHeight = 40;\nconst DefaultAnimationTimeout = 150;\n\n@Component({\n tag: 'ix-menu-category',\n styleUrl: 'menu-category.scss',\n shadow: true,\n})\nexport class MenuCategory implements IxMenuItemBase {\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 /\n Will be shown as tooltip text, if not provided menu text content will be used.\n \n @since 4.0.0\n /\n @Prop() tooltipText?: string;\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 animate(this.menuItemsContainer!, {\n duration: DefaultAnimationTimeout,\n easing: 'easeInSine',\n opacity: [1, 0],\n maxHeight: [this.getNestedItemsHeight() + DefaultIxMenuItemHeight, 0],\n onComplete: () => {\n setTimeout(() => {\n this.showItems = false;\n this.showDropdown = false;\n }, DefaultAnimationTimeout + slotHideThresholdMs);\n },\n });\n }\n\n private animateFadeIn() {\n animate(this.menuItemsContainer!, {\n duration: DefaultAnimationTimeout,\n easing: 'easeInSine',\n opacity: [0, 1],\n maxHeight: [0, this.getNestedItemsHeight() + DefaultIxMenuItemHeight],\n onBegin: () => {\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 const oldNestedItemsLength = this.nestedItems.length;\n this.nestedItems = this.getNestedItems();\n\n if (\n this.showItems &&\n this.menuItemsContainer &&\n oldNestedItemsLength !== this.nestedItems.length\n ) {\n this.menuItemsContainer.style.maxHeight = `${\n this.getNestedItemsHeight() + DefaultIxMenuItemHeight\n }px`;\n }\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 tooltipText={this.tooltipText}\n isCategory\n >\n <div class=\"category\">\n <div class=\"category-text\">{this.label}</div>\n <ix-icon\n name={iconChevronDownSmall}\n class={{\n 'category-chevron': true,\n 'category-chevron--open': this.showItems,\n }}\n aria-hidden=\"true\"\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 textColor=\"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"],"names":[],"mappings":"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"}

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

@@ -1,25 +1,27 @@
 import { r as registerInstance, h, H as Host } from './index-CtoreFVF.js';
-import { g as getButtonClasses } from './base-button-TVpiK7pg.js';
-import { a as a11yBoolean } from './a11y-Bb7pDeaQ.js';
 import { G as iconDoubleChevronLeft, F as iconDoubleChevronRight } from './index-8HpPmDK_.js';
+import { g as getButtonClasses } from './base-button-D4FlHdn0.js';
 const menuExpandIconCss = ":host{--ix-button-border-radius-left:var(--theme-btn--border-radius);--ix-button-border-radius-right:var(--theme-btn--border-radius);display:inline-block;height:2rem;vertical-align:middle;cursor:pointer;font-family:Siemens Sans, sans-serif;font-size:0.875rem;font-weight:700;line-height:1.429em;color:var(--theme-color-std-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smooting:grayscale}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host button,:host a{all:unset;box-sizing:border-box;display:inline-flex;flex-direction:row;flex-wrap:nowrap;overflow:hidden;align-items:center;justify-content:center;width:100%;height:100%;padding:0 0.5rem}:host ix-spinner{margin-right:0.25rem}:host .content{display:inline-block;position:relative;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .content-start{width:100%}:host .icon{pointer-events:none;margin-right:0.25rem}:host .icon-right{margin-left:0.25rem}:host(.disabled){cursor:default}:host .btn-subtle-tertiary{border-top-left-radius:var(--ix-button-border-radius-left);border-bottom-left-radius:var(--ix-button-border-radius-left);border-top-right-radius:var(--ix-button-border-radius-right);border-bottom-right-radius:var(--ix-button-border-radius-right)}:host .btn-subtle-tertiary,:host .btn-subtle-tertiary.focus,:host .btn-subtle-tertiary:focus-visible{background-color:var(--theme-btn-subtle-tertiary--background);color:var(--theme-btn-subtle-tertiary--color);--ix-button-color:var(--theme-btn-subtle-tertiary--color);border-width:var(--theme-btn--border-thickness);border-color:var(--theme-btn-subtle-tertiary--border-color);border-style:solid}:host .btn-subtle-tertiary:not(.disabled):not(:disabled):focus-visible{outline:1px solid var(--theme-color-focus-bdr);outline-offset:var(--theme-btn--focus--outline-offset)}:host .btn-subtle-tertiary.selected{background-color:var(--theme-btn-subtle-tertiary--background--pressed);color:var(--theme-btn-subtle-tertiary--color--pressed)}:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled):hover,:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled).hover{background-color:var(--theme-btn-subtle-tertiary--background--pressed-hover);color:var(--theme-btn-subtle-tertiary--color--pressed-hover)}:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled){cursor:pointer}:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled):active,:host .btn-subtle-tertiary.selected:not(.disabled):not(:disabled).active{background-color:var(--theme-btn-subtle-tertiary--background--pressed-hover);color:var(--theme-btn-subtle-tertiary--color--pressed-active)}:host .btn-subtle-tertiary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-subtle-tertiary:not(.disabled):not(:disabled):hover,:host .btn-subtle-tertiary:not(.disabled):not(:disabled).hover{border-color:var(--theme-btn-subtle-tertiary--border-color--hover);background-color:var(--theme-btn-subtle-tertiary--background--hover);color:var(--theme-btn-subtle-tertiary--color--hover)}:host .btn-subtle-tertiary:not(.disabled):not(:disabled){cursor:pointer}:host .btn-subtle-tertiary:not(.disabled):not(:disabled):active,:host .btn-subtle-tertiary:not(.disabled):not(:disabled).active{border-color:var(--theme-btn-subtle-tertiary--border-color--active);background-color:var(--theme-btn-subtle-tertiary--background--active);color:var(--theme-btn-subtle-tertiary--color--active)}:host(.disabled){pointer-events:none}:host(.disabled) .btn-subtle-tertiary.disabled,:host(.disabled) .btn-subtle-tertiary:disabled{pointer-events:none;border-color:var(--theme-btn-subtle-tertiary--border-color--disabled);background-color:var(--theme-btn-subtle-tertiary--background--disabled);color:var(--theme-btn-subtle-tertiary--color--disabled);opacity:1;--ix-button-color:var(--theme-btn-subtle-tertiary--color--disabled)}:host{display:flex;justify-content:center;align-items:center;height:2rem;width:2rem;border-radius:var(--theme-btn--border-radius);pointer-events:all}:host *,:host *::after,:host *::before{box-sizing:border-box}:host ::-webkit-scrollbar-button{display:none}@-moz-document url-prefix(){:host *{scrollbar-color:var(--theme-scrollbar-thumb--background) var(--theme-scrollbar-track--background);scrollbar-width:thin}}:host{}:host ::-webkit-scrollbar{width:0.5rem;height:0.5rem}:host{}:host ::-webkit-scrollbar-track{border-radius:5px;background:var(--theme-scrollbar-track--background)}:host ::-webkit-scrollbar-track:hover{background:var(--theme-scrollbar-track--background--hover)}:host{}:host ::-webkit-scrollbar-thumb{border-radius:5px;background:var(--theme-scrollbar-thumb--background)}:host{}:host ::-webkit-scrollbar-thumb:hover{background:var(--theme-scrollbar-thumb--background--hover)}:host ::-webkit-scrollbar-corner{display:none}:host svg{display:inline-block;vertical-align:middle}:host .line{fill:var(--theme-menu-btn--color);opacity:1;x:2px;transition:x 0.075s ease-in var(--theme-default-time), transform 0.075s ease-in-out 0.075s, y 0.075s ease-in-out, opacity 0.075s linear 0.075s;transform-origin:center}:host(:not(.disabled):not(:disabled)){cursor:pointer}:host(:hover:not(.disabled):not(:disabled)) .menu-expand-button{background-color:var(--theme-menu-btn--background--hover)}.menu-expand-button{width:2rem;padding:0px !important;cursor:pointer}:host(:not(.disabled):not(:disabled)){cursor:pointer}:host(:active:not(.disabled):not(:disabled)) .menu-expand-button{background-color:var(--theme-menu-btn--background--active)}:host(.expanded) svg .line-1{opacity:1;transform:rotate(-45deg);y:11px}:host(.expanded) svg .line-2{opacity:0;x:9}:host(.expanded) svg .line-3{opacity:1;transform:rotate(45deg);y:11px}";
 const MenuExpandIcon = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        /** Accessibility label for the menu expand icon (MANDATORY) */
-        this.ixAriaLabel = 'Expand';
         /** Whether the menu expand icon displays the expanded state or not */
         this.expanded = false;
         /** Display as pinned */
         this.pinned = false;
+        /**
+         * Accessibility label for the menu expand icon
+         * @deprecated This prop is no longer used as the component is hidden from screen readers (aria-hidden="true"). Will be removed in 5.0.0
+         */
+        this.ixAriaLabel = 'Expand';
     }
     getSmallScreenIcon() {
-        return (h("button", { class: Object.assign(Object.assign({}, getButtonClasses('subtle-tertiary', true, false, false, false)), { 'menu-expand-button': true }) }, h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24" }, h("rect", { class: "line line-1", x: "2", y: "5", width: "20", height: "2" }), h("rect", { class: "line line-2", x: "2", y: "11", width: "13", height: "2" }), h("rect", { class: "line line-3", x: "2", y: "17", width: "20", height: "2" }))));
+        return (h("button", { tabindex: -1, class: Object.assign(Object.assign({}, getButtonClasses('subtle-tertiary', true, false, false, false)), { 'menu-expand-button': true }) }, h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", width: "24", height: "24" }, h("rect", { class: "line line-1", x: "2", y: "5", width: "20", height: "2" }), h("rect", { class: "line line-2", x: "2", y: "11", width: "13", height: "2" }), h("rect", { class: "line line-3", x: "2", y: "17", width: "20", height: "2" }))));
     }
     getLargeScreenIcon() {
-        return (h("ix-icon-button", { icon: this.expanded ? iconDoubleChevronLeft : iconDoubleChevronRight, variant: "subtle-tertiary" }));
+        return (h("ix-icon-button", { tabindex: -1, icon: this.expanded ? iconDoubleChevronLeft : iconDoubleChevronRight, variant: "subtle-tertiary" }));
     }
     getMenuIcon() {
         if (this.pinned) {
@@ -34,9 +36,9 @@ const MenuExpandIcon = class {
         return this.getSmallScreenIcon();
     }
     render() {
-        return (h(Host, { key: '702baa75b182df885e9488301b2747fb37f96c52', class: {
+        return (h(Host, { key: '7955f6ca27cccacf73147ea3207e5147e03ce6d5', class: {
                 expanded: this.expanded,
-            }, type: "button", "aria-label": this.ixAriaLabel, "aria-pressed": a11yBoolean(this.expanded) }, this.getMenuIcon()));
+            }, "aria-hidden": "true" }, this.getMenuIcon()));
     }
 };
 MenuExpandIcon.style = menuExpandIconCss;

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ix-menu-expand-icon.entry.js","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@use './../button/button-mixin';\n@use 'mixins/hover';\n@use 'mixins/shadow-dom/component';\n\n$focus-bdr-width: 0.0625rem;\n\n@include button-mixin.btn;\n@include button-mixin.btn-variant(subtle-tertiary);\n\n:host {\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 @include component.ix-component;\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),\n transform 0.075s ease-in-out 0.075s, y 0.075s ease-in-out,\n opacity 0.075s linear 0.075s;\n transform-origin: center;\n }\n}\n\n@include hover.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: 0px !important;\n cursor: pointer;\n}\n\n@include hover.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';\~~nimport {\~~n ~~iconDoubleChevronLeft,\n iconDoubleChevronRight,\n} from '@siemens/ix-icons/icons';\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('subtle-tertiary', true, false, false, false),\n 'menu-expand-button': true,\n }}\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={this.expanded ? iconDoubleChevronLeft : iconDoubleChevronRight}\n variant=\"subtle-tertiary\"\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 ~~type~~=\"~~button~~\"\n ~~aria-label={this.ixAriaLabel}\n aria-pressed={a11yBoolean(this.expanded)}\n~~ >\n {this.getMenuIcon()}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":"~~;;;;;~~AAAA,MAAM,iBAAiB,GAAG,4zMAA4zM;;~~MCkCz0M~~,cAAc,GAAA,MAAA;AAL3B,IAAA,WAAA,CAAA,OAAA,EAAA;;;~~AAOU~~,QAAA,~~IAAW~~,CAAA,~~WAAA~~,~~GAAW~~,~~QAAQ~~;;~~AAGb~~,QAAA,~~IAAQ~~,CAAA,~~QAAA~~,GAAG,KAAK~~;;AAMjC~~,QAAA,~~IAAM~~,CAAA,~~MAAA~~,~~GAAG~~,~~KAAK~~;AA+~~DvB~~;IA7DC,kBAAkB,GAAA;AAChB,QAAA,QACE,CACE,CAAA,QAAA,EAAA,EAAA,KAAK,~~kCACA~~,gBAAgB,CAAC,iBAAiB,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,~~CACjE~~,EAAA,~~EAAA~~,oBAAoB,EAAE,IAAI,EAAA,CAAA,EAAA,EAG5B,CAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EAAA,EAEX,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAQ,CAAA,EACnE,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAQ,CAAA,EACpE,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAQ,CAAA,CAChE,CACC;;IAIb,kBAAkB,GAAA;~~QAChB~~,QACE,~~sBACE~~,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAG,qBAAqB,GAAG,sBAAsB,EACpE,OAAO,EAAC,iBAAiB,EACT,CAAA;;IAItB,WAAW,GAAA;AACT,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE;AACf,YAAA,OAAO,IAAI,CAAC,kBAAkB,EAAE;;AAGlC,QAAA,IAAI,IAAI,CAAC,UAAU,KAAK,IAAI,EAAE;AAC5B,YAAA,OAAO,IAAI,CAAC,kBAAkB,EAAE;;AAGlC,QAAA,IAAI,IAAI,CAAC,UAAU,KAAK,IAAI,EAAE;AAC5B,YAAA,OAAO,IAAI,CAAC,kBAAkB,EAAE;;AAGlC,QAAA,OAAO,IAAI,CAAC,kBAAkB,EAAE;;IAGlC,MAAM,GAAA;QACJ,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,~~EACD~~,~~IAAI~~,~~EAAC,QAAQ,~~EAAA,~~YAAA~~,~~EACD~~,IAAI,CAAC,WAAW,~~kBACd,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,EAEvC,EAAA,IAAI,CAAC,WAAW,~~EAAE,CACd;;;;;;;"}
1	+ {"version":3,"file":"ix-menu-expand-icon.entry.js","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@use './../button/button-mixin';\n@use 'mixins/hover';\n@use 'mixins/shadow-dom/component';\n\n$focus-bdr-width: 0.0625rem;\n\n@include button-mixin.btn;\n@include button-mixin.btn-variant(subtle-tertiary);\n\n:host {\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 @include component.ix-component;\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),\n transform 0.075s ease-in-out 0.075s, y 0.075s ease-in-out,\n opacity 0.075s linear 0.075s;\n transform-origin: center;\n }\n}\n\n@include hover.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: 0px !important;\n cursor: pointer;\n}\n\n@include hover.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\nimport {\n iconDoubleChevronLeft,\n iconDoubleChevronRight,\n} from '@siemens/ix-icons/icons';\nimport { Component, h, Host, Prop } from '@stencil/core';\nimport { getButtonClasses } from '../button/base-button';\nimport { Breakpoint } from '../utils/breakpoints';\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 /* 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 /\n Accessibility label for the menu expand icon\n * @deprecated This prop is no longer used as the component is hidden from screen readers (aria-hidden=\"true\"). Will be removed in 5.0.0\n */\n @Prop() ixAriaLabel?: string = 'Expand';\n\n getSmallScreenIcon() {\n return (\n <button\n tabindex={-1}\n class={{\n ...getButtonClasses('subtle-tertiary', true, false, false, false),\n 'menu-expand-button': true,\n }}\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 tabindex={-1}\n icon={this.expanded ? iconDoubleChevronLeft : iconDoubleChevronRight}\n variant=\"subtle-tertiary\"\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 aria-hidden=\"true\"\n >\n {this.getMenuIcon()}\n </Host>\n );\n }\n}\n"],"names":[],"mappings":";;;;AAAA,MAAM,iBAAiB,GAAG,4zMAA4zM;;MCwBz0M,cAAc,GAAA,MAAA;AAL3B,IAAA,WAAA,CAAA,OAAA,EAAA;;;AAO2B,QAAA,IAAQ,CAAA,QAAA,GAAG,KAAK;;AAMjC,QAAA,IAAM,CAAA,MAAA,GAAG,KAAK;AAEtB;;;AAGG;AACK,QAAA,IAAW,CAAA,WAAA,GAAY,QAAQ;AA+DxC;IA7DC,kBAAkB,GAAA;AAChB,QAAA,QACE,CACE,CAAA,QAAA,EAAA,EAAA,QAAQ,EAAE,EAAE,EACZ,KAAK,EACA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,gBAAgB,CAAC,iBAAiB,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAAA,EAAA,EACjE,oBAAoB,EAAE,IAAI,EAAA,CAAA,EAAA,EAG5B,CAAA,CAAA,KAAA,EAAA,EACE,KAAK,EAAC,4BAA4B,EAClC,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EAAA,EAEX,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,GAAG,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAQ,CAAA,EACnE,CAAA,CAAA,MAAA,EAAA,EAAM,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAQ,CAAA,EACpE,CAAM,CAAA,MAAA,EAAA,EAAA,KAAK,EAAC,aAAa,EAAC,CAAC,EAAC,GAAG,EAAC,CAAC,EAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,GAAG,EAAQ,CAAA,CAChE,CACC;;IAIb,kBAAkB,GAAA;AAChB,QAAA,QACE,CACE,CAAA,gBAAA,EAAA,EAAA,QAAQ,EAAE,EAAE,EACZ,IAAI,EAAE,IAAI,CAAC,QAAQ,GAAG,qBAAqB,GAAG,sBAAsB,EACpE,OAAO,EAAC,iBAAiB,EACT,CAAA;;IAItB,WAAW,GAAA;AACT,QAAA,IAAI,IAAI,CAAC,MAAM,EAAE;AACf,YAAA,OAAO,IAAI,CAAC,kBAAkB,EAAE;;AAGlC,QAAA,IAAI,IAAI,CAAC,UAAU,KAAK,IAAI,EAAE;AAC5B,YAAA,OAAO,IAAI,CAAC,kBAAkB,EAAE;;AAGlC,QAAA,IAAI,IAAI,CAAC,UAAU,KAAK,IAAI,EAAE;AAC5B,YAAA,OAAO,IAAI,CAAC,kBAAkB,EAAE;;AAGlC,QAAA,OAAO,IAAI,CAAC,kBAAkB,EAAE;;IAGlC,MAAM,GAAA;QACJ,QACE,CAAA,CAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EACH,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,EACW,aAAA,EAAA,MAAM,IAEjB,IAAI,CAAC,WAAW,EAAE,CACd;;;;;;;"}

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

@@ -1,9 +1,9 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-CtoreFVF.js';
-import { c as createMutationObserver } from './mutation-observer-CX81WQtk.js';
+import { T as iconDocument } from './index-8HpPmDK_.js';
+import { b as a11yHostAttributes, a as a11yBoolean } from './a11y-Bb7pDeaQ.js';
 import { m as makeRef } from './make-ref-bcj7UEIC.js';
 import { m as menuController } from './menu-service-BMvtckRa.js';
-import { T as iconDocument } from './index-8HpPmDK_.js';
-import { a as a11yBoolean } from './a11y-Bb7pDeaQ.js';
+import { c as createMutationObserver } from './mutation-observer-CX81WQtk.js';
 import './typed-event-BdCnOrqW.js';
 /*
@@ -110,27 +110,25 @@ const MenuItem = class {
                 slot: 'bottom',
             };
         }
-        const commonAttributes = {
-            class: 'tab',
-            tabIndex: this.disabled ? -1 : 0,
-        };
+        const hostA11y = a11yHostAttributes(this.hostElement);
+        const commonAttributes = Object.assign({ class: 'tab', tabIndex: this.disabled ? -1 : 0 }, hostA11y);
         const menuContent = [
-            this.icon && h("ix-icon", { key: 'cf444eeb0b3478721a77ee1dc52436689e4c0102', class: 'tab-icon', name: this.icon }),
+            this.icon && (h("ix-icon", { key: '3235cdce2773d33e6f1a75b4df395079246fa993', class: 'tab-icon', name: this.icon, "aria-hidden": "true" })),
             this.notifications ? (h("div", { class: "notification" }, h("div", { class: "pill" }, this.notifications))) : null,
-            h("span", { key: '93ac9e24f2c8634f9bfcef42c8a167d219ff764e', id: this.internalItemId, class: "tab-text text-default" }, this.label, h("slot", { key: 'c98d81e6a16ff3304c1c2c489a71cc892fc6e287' })),
+            h("span", { key: '704284ed9ae6b83b2b2d65ebc103e5e8ff766c1b', id: this.internalItemId, class: "tab-text text-default" }, this.label, h("slot", { key: '6b79e39fb7e616088d11bd8b9c57f4406fdd94b6' })),
         ];
-        return (h(Host, Object.assign({ key: '2bed98070395e9df578f968f317a16f214bf5627', class: {
+        return (h(Host, Object.assign({ key: '331694d5c502b1ed77035e591ffa5748777d8a81', class: {
                 disabled: this.disabled,
                 'home-tab': this.home,
                 'bottom-tab': this.bottom,
                 active: this.active,
                 'tab-nested': this.isHostedInsideCategory,
-            } }, extendedAttributes), this.href ? (h("a", Object.assign({}, commonAttributes, { href: this.disabled ? undefined : this.href, target: this.target, rel: this.rel, role: "button", ref: this.buttonRef, onClick: (e) => {
+            }, "aria-disabled": this.disabled ? 'true' : null }, extendedAttributes), this.href ? (h("a", Object.assign({}, commonAttributes, { href: this.disabled ? undefined : this.href, target: this.target, rel: this.rel, role: "button", ref: this.buttonRef, onClick: (e) => {
                 if (this.disabled) {
                     e.preventDefault();
                     e.stopPropagation();
                 }
-            } }), menuContent)) : (h("button", Object.assign({}, commonAttributes, { ref: this.buttonRef }), menuContent)), h("ix-tooltip", { key: '691d40c1d8df8ab9111165be8320190a5c893de0', for: this.buttonRef.waitForCurrent(), placement: 'right', showDelay: 1000, interactive: false, "aria-hidden": a11yBoolean(this.ariaHiddenTooltip), "aria-labelledby": this.internalItemId }, this.tooltip)));
+            } }), menuContent)) : (h("button", Object.assign({}, commonAttributes, { ref: this.buttonRef }), menuContent)), h("ix-tooltip", { key: 'd282a68bce72435079cbfea5234b227c92027643', for: this.buttonRef.waitForCurrent(), placement: 'right', showDelay: 1000, interactive: false, "aria-hidden": a11yBoolean(this.ariaHiddenTooltip), "aria-labelledby": this.internalItemId }, this.tooltip)));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {