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/collection/components/dropdown/dropdown.js CHANGED Viewed

@@ -8,10 +8,12 @@
  */
 import { autoUpdate, computePosition, flip, inline, offset, shift, } from "@floating-ui/dom";
 import { h, Host, } from "@stencil/core";
+import { addDisposableEventListener, } from "../utils/disposable-event-listener";
+import { findElement } from "../utils/find-element";
 import { ArrowFocusController } from "../utils/focus";
+import { makeRef } from "../utils/make-ref";
+import { requestAnimationFrameNoNgZone } from "../utils/requestAnimationFrame";
 import { dropdownController, hasDropdownItemWrapperImplemented, } from "./dropdown-controller";
-import { findElement } from "../utils/find-element";
-import { addDisposableEventListener, } from "../utils/disposable-event-listener";
 let sequenceId = 0;
 export class Dropdown {
     constructor() {
@@ -46,6 +48,13 @@ export class Dropdown {
         this.ignoreRelatedSubmenu = false;
         /** @internal */
         this.suppressOverflowBehavior = false;
+        /**
+         * Enable Popover API rendering for top-layer positioning.
+         *
+         * @default false in v4.x, will default to true in v5.0.0
+         */
+        this.enableTopLayer = false;
+        this.dialogRef = makeRef();
         this.localUId = `dropdown-${sequenceId++}`;
         this.assignedSubmenu = [];
         this.itemObserver = new MutationObserver(() => {
@@ -207,24 +216,27 @@ export class Dropdown {
         }
     }
     async changedShow(newShow) {
-        var _a, _b, _c, _d;
-        if (newShow) {
-            await this.resolveAnchorElement();
-            if (this.anchorElement) {
-                this.applyDropdownPosition();
+        var _a;
+        if (!newShow) {
+            this.cleanupOnHide();
+            if (this.enableTopLayer) {
+                await this.hideDropdownAsync();
             }
-            this.arrowFocusController = new ArrowFocusController(this.dropdownItems, this.hostElement, (index) => this.focusDropdownItem(index));
-            (_a = this.itemObserver) === null || _a === void 0 ? void 0 : _a.observe(this.hostElement, {
-                childList: true,
-                subtree: true,
-            });
-            this.registerKeyListener();
+            return;
         }
-        else {
-            this.destroyAutoUpdate();
-            (_b = this.arrowFocusController) === null || _b === void 0 ? void 0 : _b.disconnect();
-            (_c = this.itemObserver) === null || _c === void 0 ? void 0 : _c.disconnect();
-            (_d = this.disposeKeyListener) === null || _d === void 0 ? void 0 : _d.call(this);
+        this.arrowFocusController = new ArrowFocusController(this.dropdownItems, this.hostElement, (index) => this.focusDropdownItem(index));
+        (_a = this.itemObserver) === null || _a === void 0 ? void 0 : _a.observe(this.hostElement, {
+            childList: true,
+            subtree: true,
+        });
+        this.registerKeyListener();
+        if (this.enableTopLayer) {
+            await this.showDropdownAsync();
+            return;
+        }
+        await this.resolveAnchorElement();
+        if (this.anchorElement) {
+            this.applyDropdownPosition();
         }
     }
     changedTrigger(newTriggerValue) {
@@ -245,6 +257,42 @@ export class Dropdown {
         }
         return true;
     }
+    async showDropdownAsync() {
+        const popover = await this.dialogRef.waitForCurrent();
+        if (!popover) {
+            return;
+        }
+        popover.showPopover();
+        await this.resolveAnchorElement();
+        if (this.anchorElement) {
+            this.applyDropdownPosition();
+        }
+        else {
+            requestAnimationFrameNoNgZone(() => {
+                const referenceElement = this.hostElement.parentElement || this.hostElement;
+                const refRect = referenceElement.getBoundingClientRect();
+                const transform = `translate(${Math.round(refRect.left)}px, ${Math.round(refRect.top)}px)`;
+                Object.assign(popover.style, {
+                    top: '0',
+                    left: '0',
+                    transform,
+                });
+            });
+        }
+    }
+    async hideDropdownAsync() {
+        const popover = await this.dialogRef.waitForCurrent();
+        if (popover === null || popover === void 0 ? void 0 : popover.matches(':popover-open')) {
+            popover.hidePopover();
+        }
+    }
+    cleanupOnHide() {
+        var _a, _b, _c;
+        this.destroyAutoUpdate();
+        (_a = this.arrowFocusController) === null || _a === void 0 ? void 0 : _a.disconnect();
+        (_b = this.itemObserver) === null || _b === void 0 ? void 0 : _b.disconnect();
+        (_c = this.disposeKeyListener) === null || _c === void 0 ? void 0 : _c.call(this);
+    }
     async applyDropdownPosition() {
         var _a, _b;
         if (!this.show) {
@@ -253,9 +301,20 @@ export class Dropdown {
         if (!this.anchorElement) {
             return;
         }
+        const referenceElement = this.anchorElement;
         const isSubmenu = this.isAnchorSubmenu();
+        let targetElement = this.hostElement;
+        let strategy = this.positioningStrategy;
+        if (this.enableTopLayer) {
+            const dialog = await this.dialogRef.waitForCurrent();
+            if (!dialog) {
+                return;
+            }
+            targetElement = dialog;
+            strategy = 'fixed';
+        }
         let positionConfig = {
-            strategy: this.positioningStrategy,
+            strategy,
             middleware: [],
         };
         if (!this.suppressAutomaticPlacement) {
@@ -271,24 +330,19 @@ export class Dropdown {
             positionConfig.middleware.push(offset(this.offset));
         }
         this.destroyAutoUpdate();
-        if (!this.anchorElement) {
-            return;
-        }
-        this.autoUpdateCleanup = autoUpdate(this.anchorElement, this.hostElement, async () => {
-            if (this.anchorElement) {
-                const computeResponse = await computePosition(this.anchorElement, this.hostElement, positionConfig);
-                Object.assign(this.hostElement.style, {
-                    top: '0',
-                    left: '0',
-                    transform: `translate(${Math.round(computeResponse.x)}px,${Math.round(computeResponse.y)}px)`,
-                });
-            }
+        this.autoUpdateCleanup = autoUpdate(referenceElement, targetElement, async () => {
+            const computeResponse = await computePosition(referenceElement, targetElement, positionConfig);
+            Object.assign(targetElement.style, {
+                top: '0',
+                left: '0',
+                transform: `translate(${Math.round(computeResponse.x)}px,${Math.round(computeResponse.y)}px)`,
+            });
             if (this.overwriteDropdownStyle) {
                 const overwriteStyle = await this.overwriteDropdownStyle({
-                    dropdownRef: this.hostElement,
+                    dropdownRef: targetElement,
                     triggerRef: this.triggerElement,
                 });
-                Object.assign(this.hostElement.style, overwriteStyle);
+                Object.assign(targetElement.style, overwriteStyle);
             }
         }, {
             ancestorResize: true,
@@ -297,7 +351,7 @@ export class Dropdown {
         });
     }
     focusDropdownItem(index) {
-        requestAnimationFrame(() => {
+        requestAnimationFrameNoNgZone(() => {
             var _a, _b;
             const button = (_b = (_a = this.dropdownItems[index]) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('button');
             if (button) {
@@ -306,6 +360,9 @@ export class Dropdown {
         });
     }
     async componentDidLoad() {
+        if (this.show) {
+            this.changedShow(true);
+        }
         if (!this.trigger) {
             return;
         }
@@ -346,7 +403,16 @@ export class Dropdown {
         this.applyDropdownPosition();
     }
     render() {
-        return (h(Host, { key: '04a27e5950bf94cc355c91e0339f9450d46ff103', "data-ix-dropdown": this.localUId, class: {
+        if (this.enableTopLayer) {
+            return (h(Host, { "data-ix-dropdown": this.localUId, class: {
+                    'dropdown-menu': true,
+                    show: this.show,
+                } }, h("dialog", { ref: this.dialogRef, class: {
+                    dialog: true,
+                    overflow: !this.suppressOverflowBehavior,
+                }, popover: "manual", "aria-modal": "true", "aria-label": this.header, tabindex: -1, onClick: (event) => this.onDropdownClick(event) }, h("div", { class: "dropdown-container" }, this.header && h("div", { class: "dropdown-header" }, this.header), this.show && h("slot", null)))));
+        }
+        return (h(Host, { "data-ix-dropdown": this.localUId, class: {
                 'dropdown-menu': true,
                 show: this.show,
                 overflow: !this.suppressOverflowBehavior,
@@ -354,7 +420,7 @@ export class Dropdown {
                 margin: '0',
                 minWidth: '0px',
                 position: this.positioningStrategy,
-            }, role: "list", onClick: (event) => this.onDropdownClick(event) }, h("div", { key: 'a5a82065838d09c0b0e8aa24887485664d0631b7', style: { display: 'contents' } }, this.header && h("div", { key: '08e34e9d67769670fed4328d59d23de0d0bc1ccb', class: "dropdown-header" }, this.header), this.show && h("slot", { key: 'ecf81415481bb26881fd6976b5e069ac444bb821' }))));
+            }, role: "list", onClick: (event) => this.onDropdownClick(event) }, h("div", { style: { display: 'contents' } }, this.header && h("div", { class: "dropdown-header" }, this.header), this.show && h("slot", null))));
     }
     static get is() { return "ix-dropdown"; }
     static get encapsulation() { return "shadow"; }
@@ -678,6 +744,29 @@ export class Dropdown {
                 "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
+            },
+            "enableTopLayer": {
+                "type": "boolean",
+                "attribute": "enable-top-layer",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "false in v4.x, will default to true in v5.0.0"
+                        }],
+                    "text": "Enable Popover API rendering for top-layer positioning."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "false"
             }
         };
     }

package/dist/collection/components/dropdown/dropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n autoUpdate,\n computePosition,\n ComputePositionConfig,\n flip,\n inline,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { ComponentInterface } from '@stencil/core/internal';\nimport { ArrowFocusController } from '../utils/focus';\nimport {\n CloseBehavior,\n dropdownController,\n DropdownInterface,\n hasDropdownItemWrapperImplemented,\n} from './dropdown-controller';\nimport { AlignedPlacement } from './placement';\nimport { findElement } from '../utils/find-element';\nimport {\n addDisposableEventListener,\n DisposableEventListener,\n} from '../utils/disposable-event-listener';\nimport { ElementReference } from '../utils/element-reference';\n\nlet sequenceId = 0;\n\n@Component({\n tag: 'ix-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface, DropdownInterface {\n @Element() hostElement!: HTMLIxDropdownElement;\n\n /\n Suppress the automatic placement of the dropdown.\n /\n @Prop() suppressAutomaticPlacement = false;\n\n /\n Show dropdown\n /\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /\n Define an element that triggers the dropdown.\n * A trigger can either be a string that will be interpreted as id attribute or a DOM element.\n /\n @Prop() trigger?: ElementReference;\n\n /\n Define an anchor element\n /\n @Prop() anchor?: ElementReference;\n\n /\n Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n * If the dropdown is a child of another one, it will be closed with the parent, regardless of its own close behavior.\n /\n @Prop() closeBehavior: CloseBehavior = 'both';\n\n /\n Placement of the dropdown\n /\n @Prop() placement: AlignedPlacement = 'bottom-start';\n\n /\n Position strategy\n /\n @Prop() positioningStrategy: 'absolute' \| 'fixed' = 'fixed';\n\n /\n An optional header shown at the top of the dropdown\n /\n @Prop() header?: string;\n\n /\n Move dropdown along main axis of alignment\n \n @internal\n /\n @Prop() offset?: {\n mainAxis?: number;\n crossAxis?: number;\n alignmentAxis?: number;\n };\n\n /\n @internal\n /\n @Prop() overwriteDropdownStyle?: (delegate: {\n dropdownRef: HTMLElement;\n triggerRef?: HTMLElement;\n }) => Promise<Partial<CSSStyleDeclaration>>;\n\n /\n @internal\n * If initialization of this dropdown is expected to be deferred submenu discovery will have to be re-run globally by the controller.\n * This property indicates the need for that to the controller.\n /\n @Prop() discoverAllSubmenus = false;\n\n /* @internal /\n @Prop() ignoreRelatedSubmenu = false;\n\n /* @internal /\n @Prop() suppressOverflowBehavior = false;\n\n /\n Fire event after visibility of dropdown has changed\n /\n @Event() showChanged!: EventEmitter<boolean>;\n\n private autoUpdateCleanup?: () => void;\n\n private triggerElement?: Element;\n private anchorElement?: Element;\n private arrowFocusController?: ArrowFocusController;\n\n private localUId = `dropdown-${sequenceId++}`;\n private assignedSubmenu: string[] = [];\n\n private itemObserver? = new MutationObserver(() => {\n if (this.arrowFocusController) {\n this.arrowFocusController.items = this.dropdownItems;\n }\n });\n\n connectedCallback(): void {\n dropdownController.connected(this);\n\n if (this.trigger != undefined) {\n this.registerListener(this.trigger);\n }\n }\n\n @Listen('ix-assign-sub-menu')\n cacheSubmenuId(event: CustomEvent<string>) {\n event.stopImmediatePropagation();\n event.preventDefault();\n\n const { detail } = event;\n\n if (this.assignedSubmenu.indexOf(detail) === -1) {\n this.assignedSubmenu.push(detail);\n }\n }\n\n disconnectedCallback() {\n dropdownController.dismiss(this);\n dropdownController.disconnected(this);\n\n if (this.arrowFocusController) {\n this.arrowFocusController?.disconnect();\n this.arrowFocusController = undefined;\n }\n\n if (this.itemObserver) {\n this.itemObserver.disconnect();\n this.itemObserver = undefined;\n }\n\n if (this.disposeClickListener) {\n this.disposeClickListener();\n this.disposeClickListener = undefined;\n }\n\n if (this.disposeKeyListener) {\n this.disposeKeyListener();\n this.disposeKeyListener = undefined;\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = undefined;\n }\n }\n\n getAssignedSubmenuIds() {\n return this.assignedSubmenu;\n }\n\n isPresent() {\n return this.show;\n }\n\n present() {\n this.show = true;\n }\n\n dismiss() {\n this.show = false;\n }\n\n getId() {\n return this.localUId;\n }\n\n willDismiss() {\n const { defaultPrevented } = this.showChanged.emit(false);\n return !defaultPrevented;\n }\n\n willPresent() {\n const { defaultPrevented } = this.showChanged.emit(true);\n return !defaultPrevented;\n }\n\n get dropdownItems() {\n return Array.from(this.hostElement.querySelectorAll('ix-dropdown-item'));\n }\n\n get slotElement() {\n return this.hostElement.shadowRoot!.querySelector('slot');\n }\n\n private disposeClickListener?: DisposableEventListener;\n private disposeKeyListener?: DisposableEventListener;\n\n private addEventListenersFor() {\n this.disposeClickListener?.();\n this.disposeKeyListener?.();\n\n const toggleController = () => {\n if (!this.isPresent()) {\n dropdownController.present(this);\n } else {\n dropdownController.dismiss(this);\n }\n\n dropdownController.dismissOthers(this.getId());\n };\n\n if (!this.triggerElement) {\n return;\n }\n\n this.disposeClickListener = addDisposableEventListener(\n this.triggerElement,\n 'click',\n (event: Event) => {\n if (!event.defaultPrevented) {\n toggleController();\n }\n }\n );\n\n this.triggerElement?.setAttribute(\n 'data-ix-dropdown-trigger',\n this.localUId\n );\n }\n\n /* @internal /\n @Method()\n async discoverSubmenu() {\n this.triggerElement?.dispatchEvent(\n new CustomEvent('ix-assign-sub-menu', {\n bubbles: true,\n composed: true,\n cancelable: true,\n detail: this.localUId,\n })\n );\n }\n\n private registerKeyListener() {\n if (!this.triggerElement) {\n return;\n }\n\n this.disposeKeyListener = addDisposableEventListener(\n this.triggerElement,\n 'keydown',\n ((event: KeyboardEvent) => {\n if (event.key !== 'ArrowDown') {\n return;\n }\n\n if (document.activeElement !== this.triggerElement) {\n return;\n }\n\n dropdownController.present(this);\n\n setTimeout(() => {\n this.focusDropdownItem(0);\n });\n }) as EventListener\n );\n }\n\n private async registerListener(element: ElementReference) {\n this.triggerElement = await this.resolveElement(element);\n if (this.triggerElement) {\n this.addEventListenersFor();\n this.discoverSubmenu();\n }\n }\n\n private async resolveElement(element: ElementReference) {\n const el = await findElement(element);\n\n return this.checkForSubmenuAnchor(el);\n }\n\n private async checkForSubmenuAnchor(element?: Element) {\n if (!element) {\n return undefined;\n }\n\n if (hasDropdownItemWrapperImplemented(element)) {\n const dropdownItem = await element.getDropdownItemElement();\n dropdownItem.isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n if (element.tagName === 'IX-DROPDOWN-ITEM') {\n (element as HTMLIxDropdownItemElement).isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n return element;\n }\n\n private async resolveAnchorElement() {\n if (this.anchor) {\n this.anchorElement = await this.resolveElement(this.anchor);\n } else if (this.trigger) {\n this.anchorElement = await this.resolveElement(this.trigger);\n }\n }\n\n @Watch('show')\n async changedShow(newShow: boolean) {\n if (newShow) {\n await this.resolveAnchorElement();\n\n if (this.anchorElement) {\n this.applyDropdownPosition();\n }\n\n this.arrowFocusController = new ArrowFocusController(\n this.dropdownItems,\n this.hostElement,\n (index) => this.focusDropdownItem(index)\n );\n\n this.itemObserver?.observe(this.hostElement, {\n childList: true,\n subtree: true,\n });\n\n this.registerKeyListener();\n } else {\n this.destroyAutoUpdate();\n this.arrowFocusController?.disconnect();\n this.itemObserver?.disconnect();\n this.disposeKeyListener?.();\n }\n }\n\n @Watch('trigger')\n changedTrigger(newTriggerValue: ElementReference) {\n this.registerListener(newTriggerValue);\n }\n\n private destroyAutoUpdate() {\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = undefined;\n }\n }\n\n private isAnchorSubmenu(): boolean {\n if (!hasDropdownItemWrapperImplemented(this.anchorElement)) {\n // Is no official dropdown-item, but check if any dropdown-item\n // is placed somewhere up the DOM\n return !!this.anchorElement?.closest('ix-dropdown-item');\n }\n\n return true;\n }\n\n private async applyDropdownPosition() {\n if (!this.show) {\n return;\n }\n if (!this.anchorElement) {\n return;\n }\n const isSubmenu = this.isAnchorSubmenu();\n\n let positionConfig: Partial<ComputePositionConfig> = {\n strategy: this.positioningStrategy,\n middleware: [],\n };\n\n if (!this.suppressAutomaticPlacement) {\n positionConfig.middleware?.push(\n flip({ fallbackStrategy: 'initialPlacement' })\n );\n }\n\n positionConfig.placement = isSubmenu ? 'right-start' : this.placement;\n\n positionConfig.middleware = [\n ...(positionConfig.middleware?.filter(Boolean) \|\| []),\n inline(),\n shift(),\n ];\n\n if (this.offset) {\n positionConfig.middleware.push(offset(this.offset));\n }\n\n this.destroyAutoUpdate();\n\n if (!this.anchorElement) {\n return;\n }\n\n this.autoUpdateCleanup = autoUpdate(\n this.anchorElement,\n this.hostElement,\n async () => {\n if (this.anchorElement) {\n const computeResponse = await computePosition(\n this.anchorElement,\n this.hostElement,\n positionConfig\n );\n Object.assign(this.hostElement.style, {\n top: '0',\n left: '0',\n transform: `translate(${Math.round(\n computeResponse.x\n )}px,${Math.round(computeResponse.y)}px)`,\n });\n }\n if (this.overwriteDropdownStyle) {\n const overwriteStyle = await this.overwriteDropdownStyle({\n dropdownRef: this.hostElement,\n triggerRef: this.triggerElement as HTMLElement,\n });\n\n Object.assign(this.hostElement.style, overwriteStyle);\n }\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n }\n );\n }\n\n private focusDropdownItem(index: number) {\n requestAnimationFrame(() => {\n const button =\n this.dropdownItems[index]?.shadowRoot?.querySelector('button');\n\n if (button) {\n button.focus();\n }\n });\n }\n\n async componentDidLoad() {\n if (!this.trigger) {\n return;\n }\n\n this.changedTrigger(this.trigger);\n }\n\n async componentDidRender() {\n await this.applyDropdownPosition();\n await this.resolveAnchorElement();\n }\n\n private isTriggerElement(element: HTMLElement) {\n const trigger = !!element.hasAttribute('data-ix-dropdown-trigger');\n\n return trigger;\n }\n\n private onDropdownClick(event: PointerEvent) {\n const target = dropdownController.pathIncludesTrigger(event.composedPath());\n if (target) {\n if (target !== this.triggerElement) {\n event.preventDefault();\n }\n\n if (this.isTriggerElement(target)) {\n if (this.closeBehavior === 'outside') {\n event.preventDefault();\n }\n return;\n }\n }\n\n if (\n !event.defaultPrevented &&\n (this.closeBehavior === 'inside' \|\| this.closeBehavior === 'both')\n ) {\n dropdownController.dismissAll([this.getId()], this.ignoreRelatedSubmenu);\n return;\n }\n\n dropdownController.dismissOthers(this.getId());\n }\n\n /\n Update position of dropdown\n */\n @Method()\n async updatePosition() {\n this.applyDropdownPosition();\n }\n\n render() {\n return (\n <Host\n data-ix-dropdown={this.localUId}\n class={{\n 'dropdown-menu': true,\n show: this.show,\n overflow: !this.suppressOverflowBehavior,\n }}\n style={{\n margin: '0',\n minWidth: '0px',\n position: this.positioningStrategy,\n }}\n role=\"list\"\n onClick={(event: PointerEvent) => this.onDropdownClick(event)}\n >\n <div style={{ display: 'contents' }}>\n {this.header && <div class=\"dropdown-header\">{this.header}</div>}\n {this.show && <slot></slot>}\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../src/components/dropdown/dropdown.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EACL,UAAU,EACV,eAAe,EAEf,IAAI,EACJ,MAAM,EACN,MAAM,EACN,KAAK,GACN,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EACL,SAAS,EACT,OAAO,EACP,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,MAAM,EACN,MAAM,EACN,IAAI,EACJ,KAAK,GACN,MAAM,eAAe,CAAC;AAEvB,OAAO,EACL,0BAA0B,GAE3B,MAAM,oCAAoC,CAAC;AAE5C,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EAAE,6BAA6B,EAAE,MAAM,gCAAgC,CAAC;AAC/E,OAAO,EAEL,kBAAkB,EAElB,iCAAiC,GAClC,MAAM,uBAAuB,CAAC;AAG/B,IAAI,UAAU,GAAG,CAAC,CAAC;AAOnB,MAAM,OAAO,QAAQ;IALrB;QAQE;;WAEG;QACK,+BAA0B,GAAG,KAAK,CAAC;QAE3C;;WAEG;QACqC,SAAI,GAAG,KAAK,CAAC;QAarD;;;WAGG;QACK,kBAAa,GAAkB,MAAM,CAAC;QAE9C;;WAEG;QACK,cAAS,GAAqB,cAAc,CAAC;QAErD;;WAEG;QACK,wBAAmB,GAAyB,OAAO,CAAC;QA0B5D;;;;WAIG;QACK,wBAAmB,GAAG,KAAK,CAAC;QAEpC,gBAAgB;QACR,yBAAoB,GAAG,KAAK,CAAC;QAErC,gBAAgB;QACR,6BAAwB,GAAG,KAAK,CAAC;QAEzC;;;;WAIG;QACK,mBAAc,GAAY,KAAK,CAAC;QAQvB,cAAS,GAAG,OAAO,EAAqB,CAAC;QAMlD,aAAQ,GAAG,YAAY,UAAU,EAAE,EAAE,CAAC;QACtC,oBAAe,GAAa,EAAE,CAAC;QAE/B,iBAAY,GAAI,IAAI,gBAAgB,CAAC,GAAG,EAAE;YAChD,IAAI,IAAI,CAAC,oBAAoB,EAAE,CAAC;gBAC9B,IAAI,CAAC,oBAAoB,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC;YACvD,CAAC;QACH,CAAC,CAAC,CAAC;KAkgBJ;IAhgBC,iBAAiB;QACf,kBAAkB,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;QAEnC,IAAI,IAAI,CAAC,OAAO,IAAI,SAAS,EAAE,CAAC;YAC9B,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACtC,CAAC;IACH,CAAC;IAGD,cAAc,CAAC,KAA0B;QACvC,KAAK,CAAC,wBAAwB,EAAE,CAAC;QACjC,KAAK,CAAC,cAAc,EAAE,CAAC;QAEvB,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;QAEzB,IAAI,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC;YAChD,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QACpC,CAAC;IACH,CAAC;IAED,oBAAoB;;QAClB,kBAAkB,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;QACjC,kBAAkB,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;QAEtC,IAAI,IAAI,CAAC,oBAAoB,EAAE,CAAC;YAC9B,MAAA,IAAI,CAAC,oBAAoB,0CAAE,UAAU,EAAE,CAAC;YACxC,IAAI,CAAC,oBAAoB,GAAG,SAAS,CAAC;QACxC,CAAC;QAED,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,CAAC;YAC/B,IAAI,CAAC,YAAY,GAAG,SAAS,CAAC;QAChC,CAAC;QAED,IAAI,IAAI,CAAC,oBAAoB,EAAE,CAAC;YAC9B,IAAI,CAAC,oBAAoB,EAAE,CAAC;YAC5B,IAAI,CAAC,oBAAoB,GAAG,SAAS,CAAC;QACxC,CAAC;QAED,IAAI,IAAI,CAAC,kBAAkB,EAAE,CAAC;YAC5B,IAAI,CAAC,kBAAkB,EAAE,CAAC;YAC1B,IAAI,CAAC,kBAAkB,GAAG,SAAS,CAAC;QACtC,CAAC;QAED,IAAI,IAAI,CAAC,iBAAiB,EAAE,CAAC;YAC3B,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACzB,IAAI,CAAC,iBAAiB,GAAG,SAAS,CAAC;QACrC,CAAC;IACH,CAAC;IAED,qBAAqB;QACnB,OAAO,IAAI,CAAC,eAAe,CAAC;IAC9B,CAAC;IAED,SAAS;QACP,OAAO,IAAI,CAAC,IAAI,CAAC;IACnB,CAAC;IAED,OAAO;QACL,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;IACnB,CAAC;IAED,OAAO;QACL,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;IACpB,CAAC;IAED,KAAK;QACH,OAAO,IAAI,CAAC,QAAQ,CAAC;IACvB,CAAC;IAED,WAAW;QACT,MAAM,EAAE,gBAAgB,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1D,OAAO,CAAC,gBAAgB,CAAC;IAC3B,CAAC;IAED,WAAW;QACT,MAAM,EAAE,gBAAgB,EAAE,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzD,OAAO,CAAC,gBAAgB,CAAC;IAC3B,CAAC;IAED,IAAI,aAAa;QACf,OAAO,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAC3E,CAAC;IAED,IAAI,WAAW;QACb,OAAO,IAAI,CAAC,WAAW,CAAC,UAAW,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;IAC5D,CAAC;IAKO,oBAAoB;;QAC1B,MAAA,IAAI,CAAC,oBAAoB,oDAAI,CAAC;QAC9B,MAAA,IAAI,CAAC,kBAAkB,oDAAI,CAAC;QAE5B,MAAM,gBAAgB,GAAG,GAAG,EAAE;YAC5B,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,EAAE,CAAC;gBACtB,kBAAkB,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;YACnC,CAAC;iBAAM,CAAC;gBACN,kBAAkB,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;YACnC,CAAC;YAED,kBAAkB,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;QACjD,CAAC,CAAC;QAEF,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YACzB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,oBAAoB,GAAG,0BAA0B,CACpD,IAAI,CAAC,cAAc,EACnB,OAAO,EACP,CAAC,KAAY,EAAE,EAAE;YACf,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAAE,CAAC;gBAC5B,gBAAgB,EAAE,CAAC;YACrB,CAAC;QACH,CAAC,CACF,CAAC;QAEF,MAAA,IAAI,CAAC,cAAc,0CAAE,YAAY,CAC/B,0BAA0B,EAC1B,IAAI,CAAC,QAAQ,CACd,CAAC;IACJ,CAAC;IAED,gBAAgB;IAEhB,KAAK,CAAC,eAAe;;QACnB,MAAA,IAAI,CAAC,cAAc,0CAAE,aAAa,CAChC,IAAI,WAAW,CAAC,oBAAoB,EAAE;YACpC,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,UAAU,EAAE,IAAI;YAChB,MAAM,EAAE,IAAI,CAAC,QAAQ;SACtB,CAAC,CACH,CAAC;IACJ,CAAC;IAEO,mBAAmB;QACzB,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YACzB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,kBAAkB,GAAG,0BAA0B,CAClD,IAAI,CAAC,cAAc,EACnB,SAAS,EACT,CAAC,CAAC,KAAoB,EAAE,EAAE;YACxB,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE,CAAC;gBAC9B,OAAO;YACT,CAAC;YAED,IAAI,QAAQ,CAAC,aAAa,KAAK,IAAI,CAAC,cAAc,EAAE,CAAC;gBACnD,OAAO;YACT,CAAC;YAED,kBAAkB,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;YAEjC,UAAU,CAAC,GAAG,EAAE;gBACd,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;YAC5B,CAAC,CAAC,CAAC;QACL,CAAC,CAAkB,CACpB,CAAC;IACJ,CAAC;IAEO,KAAK,CAAC,gBAAgB,CAAC,OAAyB;QACtD,IAAI,CAAC,cAAc,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC;QACzD,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,IAAI,CAAC,oBAAoB,EAAE,CAAC;YAC5B,IAAI,CAAC,eAAe,EAAE,CAAC;QACzB,CAAC;IACH,CAAC;IAEO,KAAK,CAAC,cAAc,CAAC,OAAyB;QACpD,MAAM,EAAE,GAAG,MAAM,WAAW,CAAC,OAAO,CAAC,CAAC;QAEtC,OAAO,IAAI,CAAC,qBAAqB,CAAC,EAAE,CAAC,CAAC;IACxC,CAAC;IAEO,KAAK,CAAC,qBAAqB,CAAC,OAAiB;QACnD,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,OAAO,SAAS,CAAC;QACnB,CAAC;QAED,IAAI,iCAAiC,CAAC,OAAO,CAAC,EAAE,CAAC;YAC/C,MAAM,YAAY,GAAG,MAAM,OAAO,CAAC,sBAAsB,EAAE,CAAC;YAC5D,YAAY,CAAC,SAAS,GAAG,IAAI,CAAC;YAC9B,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,MAAM,GAAG,+BAA+B,CAAC;QAClE,CAAC;QAED,IAAI,OAAO,CAAC,OAAO,KAAK,kBAAkB,EAAE,CAAC;YAC1C,OAAqC,CAAC,SAAS,GAAG,IAAI,CAAC;YACxD,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,MAAM,GAAG,+BAA+B,CAAC;QAClE,CAAC;QAED,OAAO,OAAO,CAAC;IACjB,CAAC;IAEO,KAAK,CAAC,oBAAoB;QAChC,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,IAAI,CAAC,aAAa,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAC9D,CAAC;aAAM,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACxB,IAAI,CAAC,aAAa,GAAG,MAAM,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAC/D,CAAC;IACH,CAAC;IAGD,KAAK,CAAC,WAAW,CAAC,OAAgB;;QAChC,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,IAAI,CAAC,aAAa,EAAE,CAAC;YAErB,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;gBACxB,MAAM,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACjC,CAAC;YACD,OAAO;QACT,CAAC;QAED,IAAI,CAAC,oBAAoB,GAAG,IAAI,oBAAoB,CAClD,IAAI,CAAC,aAAa,EAClB,IAAI,CAAC,WAAW,EAChB,CAAC,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,CACzC,CAAC;QAEF,MAAA,IAAI,CAAC,YAAY,0CAAE,OAAO,CAAC,IAAI,CAAC,WAAW,EAAE;YAC3C,SAAS,EAAE,IAAI;YACf,OAAO,EAAE,IAAI;SACd,CAAC,CAAC;QAEH,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAE3B,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,MAAM,IAAI,CAAC,iBAAiB,EAAE,CAAC;YAC/B,OAAO;QACT,CAAC;QAED,MAAM,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAElC,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YACvB,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC/B,CAAC;IACH,CAAC;IAGD,cAAc,CAAC,eAAiC;QAC9C,IAAI,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC;IACzC,CAAC;IAEO,iBAAiB;QACvB,IAAI,IAAI,CAAC,iBAAiB,EAAE,CAAC;YAC3B,IAAI,CAAC,iBAAiB,EAAE,CAAC;YACzB,IAAI,CAAC,iBAAiB,GAAG,SAAS,CAAC;QACrC,CAAC;IACH,CAAC;IAEO,eAAe;;QACrB,IAAI,CAAC,iCAAiC,CAAC,IAAI,CAAC,aAAa,CAAC,EAAE,CAAC;YAC3D,+DAA+D;YAC/D,iCAAiC;YACjC,OAAO,CAAC,CAAC,CAAA,MAAA,IAAI,CAAC,aAAa,0CAAE,OAAO,CAAC,kBAAkB,CAAC,CAAA,CAAC;QAC3D,CAAC;QAED,OAAO,IAAI,CAAC;IACd,CAAC;IAEO,KAAK,CAAC,iBAAiB;QAC7B,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE,CAAC;QACtD,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,OAAO;QACT,CAAC;QAED,OAAO,CAAC,WAAW,EAAE,CAAC;QAEtB,MAAM,IAAI,CAAC,oBAAoB,EAAE,CAAC;QAElC,IAAI,IAAI,CAAC,aAAa,EAAE,CAAC;YACvB,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC/B,CAAC;aAAM,CAAC;YACN,6BAA6B,CAAC,GAAG,EAAE;gBACjC,MAAM,gBAAgB,GACpB,IAAI,CAAC,WAAW,CAAC,aAAa,IAAI,IAAI,CAAC,WAAW,CAAC;gBACrD,MAAM,OAAO,GAAG,gBAAgB,CAAC,qBAAqB,EAAE,CAAC;gBAEzD,MAAM,SAAS,GAAG,aAAa,IAAI,CAAC,KAAK,CACvC,OAAO,CAAC,IAAI,CACb,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;gBAErC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,EAAE;oBAC3B,GAAG,EAAE,GAAG;oBACR,IAAI,EAAE,GAAG;oBACT,SAAS;iBACV,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAEO,KAAK,CAAC,iBAAiB;QAC7B,MAAM,OAAO,GAAG,MAAM,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE,CAAC;QACtD,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,CAAC,eAAe,CAAC,EAAE,CAAC;YACtC,OAAO,CAAC,WAAW,EAAE,CAAC;QACxB,CAAC;IACH,CAAC;IAEO,aAAa;;QACnB,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACzB,MAAA,IAAI,CAAC,oBAAoB,0CAAE,UAAU,EAAE,CAAC;QACxC,MAAA,IAAI,CAAC,YAAY,0CAAE,UAAU,EAAE,CAAC;QAChC,MAAA,IAAI,CAAC,kBAAkB,oDAAI,CAAC;IAC9B,CAAC;IAEO,KAAK,CAAC,qBAAqB;;QACjC,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;YACf,OAAO;QACT,CAAC;QACD,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;YACxB,OAAO;QACT,CAAC;QAED,MAAM,gBAAgB,GAAG,IAAI,CAAC,aAAa,CAAC;QAC5C,MAAM,SAAS,GAAG,IAAI,CAAC,eAAe,EAAE,CAAC;QAEzC,IAAI,aAAa,GAAgB,IAAI,CAAC,WAAW,CAAC;QAClD,IAAI,QAAQ,GAAyB,IAAI,CAAC,mBAAmB,CAAC;QAE9D,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,MAAM,MAAM,GAAG,MAAM,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE,CAAC;YACrD,IAAI,CAAC,MAAM,EAAE,CAAC;gBACZ,OAAO;YACT,CAAC;YACD,aAAa,GAAG,MAAM,CAAC;YACvB,QAAQ,GAAG,OAAO,CAAC;QACrB,CAAC;QAED,IAAI,cAAc,GAAmC;YACnD,QAAQ;YACR,UAAU,EAAE,EAAE;SACf,CAAC;QAEF,IAAI,CAAC,IAAI,CAAC,0BAA0B,EAAE,CAAC;YACrC,MAAA,cAAc,CAAC,UAAU,0CAAE,IAAI,CAC7B,IAAI,CAAC,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,CAAC,CAC/C,CAAC;QACJ,CAAC;QAED,cAAc,CAAC,SAAS,GAAG,SAAS,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC;QAEtE,cAAc,CAAC,UAAU,GAAG;YAC1B,GAAG,CAAC,CAAA,MAAA,cAAc,CAAC,UAAU,0CAAE,MAAM,CAAC,OAAO,CAAC,KAAI,EAAE,CAAC;YACrD,MAAM,EAAE;YACR,KAAK,EAAE;SACR,CAAC;QAEF,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,cAAc,CAAC,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;QACtD,CAAC;QAED,IAAI,CAAC,iBAAiB,EAAE,CAAC;QAEzB,IAAI,CAAC,iBAAiB,GAAG,UAAU,CACjC,gBAAgB,EAChB,aAAa,EACb,KAAK,IAAI,EAAE;YACT,MAAM,eAAe,GAAG,MAAM,eAAe,CAC3C,gBAAgB,EAChB,aAAa,EACb,cAAc,CACf,CAAC;YACF,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE;gBACjC,GAAG,EAAE,GAAG;gBACR,IAAI,EAAE,GAAG;gBACT,SAAS,EAAE,aAAa,IAAI,CAAC,KAAK,CAAC,eAAe,CAAC,CAAC,CAAC,MAAM,IAAI,CAAC,KAAK,CACnE,eAAe,CAAC,CAAC,CAClB,KAAK;aACP,CAAC,CAAC;YAEH,IAAI,IAAI,CAAC,sBAAsB,EAAE,CAAC;gBAChC,MAAM,cAAc,GAAG,MAAM,IAAI,CAAC,sBAAsB,CAAC;oBACvD,WAAW,EAAE,aAAa;oBAC1B,UAAU,EAAE,IAAI,CAAC,cAA6B;iBAC/C,CAAC,CAAC;gBAEH,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,KAAK,EAAE,cAAc,CAAC,CAAC;YACrD,CAAC;QACH,CAAC,EACD;YACE,cAAc,EAAE,IAAI;YACpB,cAAc,EAAE,IAAI;YACpB,aAAa,EAAE,IAAI;SACpB,CACF,CAAC;IACJ,CAAC;IAEO,iBAAiB,CAAC,KAAa;QACrC,6BAA6B,CAAC,GAAG,EAAE;;YACjC,MAAM,MAAM,GACV,MAAA,MAAA,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,0CAAE,UAAU,0CAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;YAEjE,IAAI,MAAM,EAAE,CAAC;gBACX,MAAM,CAAC,KAAK,EAAE,CAAC;YACjB,CAAC;QACH,CAAC,CAAC,CAAC;IACL,CAAC;IAED,KAAK,CAAC,gBAAgB;QACpB,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC;QACzB,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC;YAClB,OAAO;QACT,CAAC;QAED,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IACpC,CAAC;IAED,KAAK,CAAC,kBAAkB;QACtB,MAAM,IAAI,CAAC,qBAAqB,EAAE,CAAC;QACnC,MAAM,IAAI,CAAC,oBAAoB,EAAE,CAAC;IACpC,CAAC;IAEO,gBAAgB,CAAC,OAAoB;QAC3C,MAAM,OAAO,GAAG,CAAC,CAAC,OAAO,CAAC,YAAY,CAAC,0BAA0B,CAAC,CAAC;QAEnE,OAAO,OAAO,CAAC;IACjB,CAAC;IAEO,eAAe,CAAC,KAAmB;QACzC,MAAM,MAAM,GAAG,kBAAkB,CAAC,mBAAmB,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,CAAC;QAC5E,IAAI,MAAM,EAAE,CAAC;YACX,IAAI,MAAM,KAAK,IAAI,CAAC,cAAc,EAAE,CAAC;gBACnC,KAAK,CAAC,cAAc,EAAE,CAAC;YACzB,CAAC;YAED,IAAI,IAAI,CAAC,gBAAgB,CAAC,MAAM,CAAC,EAAE,CAAC;gBAClC,IAAI,IAAI,CAAC,aAAa,KAAK,SAAS,EAAE,CAAC;oBACrC,KAAK,CAAC,cAAc,EAAE,CAAC;gBACzB,CAAC;gBACD,OAAO;YACT,CAAC;QACH,CAAC;QAED,IACE,CAAC,KAAK,CAAC,gBAAgB;YACvB,CAAC,IAAI,CAAC,aAAa,KAAK,QAAQ,IAAI,IAAI,CAAC,aAAa,KAAK,MAAM,CAAC,EAClE,CAAC;YACD,kBAAkB,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI,CAAC,oBAAoB,CAAC,CAAC;YACzE,OAAO;QACT,CAAC;QAED,kBAAkB,CAAC,aAAa,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC,CAAC;IACjD,CAAC;IAED;;OAEG;IAEH,KAAK,CAAC,cAAc;QAClB,IAAI,CAAC,qBAAqB,EAAE,CAAC;IAC/B,CAAC;IAED,MAAM;QACJ,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,OAAO,CACL,EAAC,IAAI,wBACe,IAAI,CAAC,QAAQ,EAC/B,KAAK,EAAE;oBACL,eAAe,EAAE,IAAI;oBACrB,IAAI,EAAE,IAAI,CAAC,IAAI;iBAChB;gBAED,cACE,GAAG,EAAE,IAAI,CAAC,SAAS,EACnB,KAAK,EAAE;wBACL,MAAM,EAAE,IAAI;wBACZ,QAAQ,EAAE,CAAC,IAAI,CAAC,wBAAwB;qBACzC,EACD,OAAO,EAAC,QAAQ,gBACL,MAAM,gBACL,IAAI,CAAC,MAAM,EACvB,QAAQ,EAAE,CAAC,CAAC,EACZ,OAAO,EAAE,CAAC,KAAmB,EAAE,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;oBAE7D,WAAK,KAAK,EAAC,oBAAoB;wBAC5B,IAAI,CAAC,MAAM,IAAI,WAAK,KAAK,EAAC,iBAAiB,IAAE,IAAI,CAAC,MAAM,CAAO;wBAC/D,IAAI,CAAC,IAAI,IAAI,eAAa,CACvB,CACC,CACJ,CACR,CAAC;QACJ,CAAC;QAED,OAAO,CACL,EAAC,IAAI,wBACe,IAAI,CAAC,QAAQ,EAC/B,KAAK,EAAE;gBACL,eAAe,EAAE,IAAI;gBACrB,IAAI,EAAE,IAAI,CAAC,IAAI;gBACf,QAAQ,EAAE,CAAC,IAAI,CAAC,wBAAwB;aACzC,EACD,KAAK,EAAE;gBACL,MAAM,EAAE,GAAG;gBACX,QAAQ,EAAE,KAAK;gBACf,QAAQ,EAAE,IAAI,CAAC,mBAAmB;aACnC,EACD,IAAI,EAAC,MAAM,EACX,OAAO,EAAE,CAAC,KAAmB,EAAE,EAAE,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;YAE7D,WAAK,KAAK,EAAE,EAAE,OAAO,EAAE,UAAU,EAAE;gBAChC,IAAI,CAAC,MAAM,IAAI,WAAK,KAAK,EAAC,iBAAiB,IAAE,IAAI,CAAC,MAAM,CAAO;gBAC/D,IAAI,CAAC,IAAI,IAAI,eAAa,CACvB,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n autoUpdate,\n computePosition,\n ComputePositionConfig,\n flip,\n inline,\n offset,\n shift,\n} from '@floating-ui/dom';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Method,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { ComponentInterface } from '@stencil/core/internal';\nimport {\n addDisposableEventListener,\n DisposableEventListener,\n} from '../utils/disposable-event-listener';\nimport { ElementReference } from '../utils/element-reference';\nimport { findElement } from '../utils/find-element';\nimport { ArrowFocusController } from '../utils/focus';\nimport { makeRef } from '../utils/make-ref';\nimport { requestAnimationFrameNoNgZone } from '../utils/requestAnimationFrame';\nimport {\n CloseBehavior,\n dropdownController,\n DropdownInterface,\n hasDropdownItemWrapperImplemented,\n} from './dropdown-controller';\nimport { AlignedPlacement } from './placement';\n\nlet sequenceId = 0;\n\n@Component({\n tag: 'ix-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n})\nexport class Dropdown implements ComponentInterface, DropdownInterface {\n @Element() hostElement!: HTMLIxDropdownElement;\n\n /\n Suppress the automatic placement of the dropdown.\n /\n @Prop() suppressAutomaticPlacement = false;\n\n /\n Show dropdown\n /\n @Prop({ mutable: true, reflect: true }) show = false;\n\n /\n Define an element that triggers the dropdown.\n * A trigger can either be a string that will be interpreted as id attribute or a DOM element.\n /\n @Prop() trigger?: ElementReference;\n\n /\n Define an anchor element\n /\n @Prop() anchor?: ElementReference;\n\n /\n Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n * If the dropdown is a child of another one, it will be closed with the parent, regardless of its own close behavior.\n /\n @Prop() closeBehavior: CloseBehavior = 'both';\n\n /\n Placement of the dropdown\n /\n @Prop() placement: AlignedPlacement = 'bottom-start';\n\n /\n Position strategy\n /\n @Prop() positioningStrategy: 'absolute' \| 'fixed' = 'fixed';\n\n /\n An optional header shown at the top of the dropdown\n /\n @Prop() header?: string;\n\n /\n Move dropdown along main axis of alignment\n \n @internal\n /\n @Prop() offset?: {\n mainAxis?: number;\n crossAxis?: number;\n alignmentAxis?: number;\n };\n\n /\n @internal\n /\n @Prop() overwriteDropdownStyle?: (delegate: {\n dropdownRef: HTMLElement;\n triggerRef?: HTMLElement;\n }) => Promise<Partial<CSSStyleDeclaration>>;\n\n /\n @internal\n * If initialization of this dropdown is expected to be deferred submenu discovery will have to be re-run globally by the controller.\n * This property indicates the need for that to the controller.\n /\n @Prop() discoverAllSubmenus = false;\n\n /* @internal /\n @Prop() ignoreRelatedSubmenu = false;\n\n /* @internal /\n @Prop() suppressOverflowBehavior = false;\n\n /\n Enable Popover API rendering for top-layer positioning.\n \n @default false in v4.x, will default to true in v5.0.0\n /\n @Prop() enableTopLayer: boolean = false;\n\n /\n Fire event after visibility of dropdown has changed\n /\n @Event() showChanged!: EventEmitter<boolean>;\n\n private autoUpdateCleanup?: () => void;\n private readonly dialogRef = makeRef<HTMLDialogElement>();\n\n private triggerElement?: Element;\n private anchorElement?: Element;\n private arrowFocusController?: ArrowFocusController;\n\n private localUId = `dropdown-${sequenceId++}`;\n private assignedSubmenu: string[] = [];\n\n private itemObserver? = new MutationObserver(() => {\n if (this.arrowFocusController) {\n this.arrowFocusController.items = this.dropdownItems;\n }\n });\n\n connectedCallback(): void {\n dropdownController.connected(this);\n\n if (this.trigger != undefined) {\n this.registerListener(this.trigger);\n }\n }\n\n @Listen('ix-assign-sub-menu')\n cacheSubmenuId(event: CustomEvent<string>) {\n event.stopImmediatePropagation();\n event.preventDefault();\n\n const { detail } = event;\n\n if (this.assignedSubmenu.indexOf(detail) === -1) {\n this.assignedSubmenu.push(detail);\n }\n }\n\n disconnectedCallback() {\n dropdownController.dismiss(this);\n dropdownController.disconnected(this);\n\n if (this.arrowFocusController) {\n this.arrowFocusController?.disconnect();\n this.arrowFocusController = undefined;\n }\n\n if (this.itemObserver) {\n this.itemObserver.disconnect();\n this.itemObserver = undefined;\n }\n\n if (this.disposeClickListener) {\n this.disposeClickListener();\n this.disposeClickListener = undefined;\n }\n\n if (this.disposeKeyListener) {\n this.disposeKeyListener();\n this.disposeKeyListener = undefined;\n }\n\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = undefined;\n }\n }\n\n getAssignedSubmenuIds() {\n return this.assignedSubmenu;\n }\n\n isPresent() {\n return this.show;\n }\n\n present() {\n this.show = true;\n }\n\n dismiss() {\n this.show = false;\n }\n\n getId() {\n return this.localUId;\n }\n\n willDismiss() {\n const { defaultPrevented } = this.showChanged.emit(false);\n return !defaultPrevented;\n }\n\n willPresent() {\n const { defaultPrevented } = this.showChanged.emit(true);\n return !defaultPrevented;\n }\n\n get dropdownItems() {\n return Array.from(this.hostElement.querySelectorAll('ix-dropdown-item'));\n }\n\n get slotElement() {\n return this.hostElement.shadowRoot!.querySelector('slot');\n }\n\n private disposeClickListener?: DisposableEventListener;\n private disposeKeyListener?: DisposableEventListener;\n\n private addEventListenersFor() {\n this.disposeClickListener?.();\n this.disposeKeyListener?.();\n\n const toggleController = () => {\n if (!this.isPresent()) {\n dropdownController.present(this);\n } else {\n dropdownController.dismiss(this);\n }\n\n dropdownController.dismissOthers(this.getId());\n };\n\n if (!this.triggerElement) {\n return;\n }\n\n this.disposeClickListener = addDisposableEventListener(\n this.triggerElement,\n 'click',\n (event: Event) => {\n if (!event.defaultPrevented) {\n toggleController();\n }\n }\n );\n\n this.triggerElement?.setAttribute(\n 'data-ix-dropdown-trigger',\n this.localUId\n );\n }\n\n /* @internal /\n @Method()\n async discoverSubmenu() {\n this.triggerElement?.dispatchEvent(\n new CustomEvent('ix-assign-sub-menu', {\n bubbles: true,\n composed: true,\n cancelable: true,\n detail: this.localUId,\n })\n );\n }\n\n private registerKeyListener() {\n if (!this.triggerElement) {\n return;\n }\n\n this.disposeKeyListener = addDisposableEventListener(\n this.triggerElement,\n 'keydown',\n ((event: KeyboardEvent) => {\n if (event.key !== 'ArrowDown') {\n return;\n }\n\n if (document.activeElement !== this.triggerElement) {\n return;\n }\n\n dropdownController.present(this);\n\n setTimeout(() => {\n this.focusDropdownItem(0);\n });\n }) as EventListener\n );\n }\n\n private async registerListener(element: ElementReference) {\n this.triggerElement = await this.resolveElement(element);\n if (this.triggerElement) {\n this.addEventListenersFor();\n this.discoverSubmenu();\n }\n }\n\n private async resolveElement(element: ElementReference) {\n const el = await findElement(element);\n\n return this.checkForSubmenuAnchor(el);\n }\n\n private async checkForSubmenuAnchor(element?: Element) {\n if (!element) {\n return undefined;\n }\n\n if (hasDropdownItemWrapperImplemented(element)) {\n const dropdownItem = await element.getDropdownItemElement();\n dropdownItem.isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n if (element.tagName === 'IX-DROPDOWN-ITEM') {\n (element as HTMLIxDropdownItemElement).isSubMenu = true;\n this.hostElement.style.zIndex = `var(--theme-z-index-dropdown)`;\n }\n\n return element;\n }\n\n private async resolveAnchorElement() {\n if (this.anchor) {\n this.anchorElement = await this.resolveElement(this.anchor);\n } else if (this.trigger) {\n this.anchorElement = await this.resolveElement(this.trigger);\n }\n }\n\n @Watch('show')\n async changedShow(newShow: boolean) {\n if (!newShow) {\n this.cleanupOnHide();\n\n if (this.enableTopLayer) {\n await this.hideDropdownAsync();\n }\n return;\n }\n\n this.arrowFocusController = new ArrowFocusController(\n this.dropdownItems,\n this.hostElement,\n (index) => this.focusDropdownItem(index)\n );\n\n this.itemObserver?.observe(this.hostElement, {\n childList: true,\n subtree: true,\n });\n\n this.registerKeyListener();\n\n if (this.enableTopLayer) {\n await this.showDropdownAsync();\n return;\n }\n\n await this.resolveAnchorElement();\n\n if (this.anchorElement) {\n this.applyDropdownPosition();\n }\n }\n\n @Watch('trigger')\n changedTrigger(newTriggerValue: ElementReference) {\n this.registerListener(newTriggerValue);\n }\n\n private destroyAutoUpdate() {\n if (this.autoUpdateCleanup) {\n this.autoUpdateCleanup();\n this.autoUpdateCleanup = undefined;\n }\n }\n\n private isAnchorSubmenu(): boolean {\n if (!hasDropdownItemWrapperImplemented(this.anchorElement)) {\n // Is no official dropdown-item, but check if any dropdown-item\n // is placed somewhere up the DOM\n return !!this.anchorElement?.closest('ix-dropdown-item');\n }\n\n return true;\n }\n\n private async showDropdownAsync() {\n const popover = await this.dialogRef.waitForCurrent();\n if (!popover) {\n return;\n }\n\n popover.showPopover();\n\n await this.resolveAnchorElement();\n\n if (this.anchorElement) {\n this.applyDropdownPosition();\n } else {\n requestAnimationFrameNoNgZone(() => {\n const referenceElement =\n this.hostElement.parentElement \|\| this.hostElement;\n const refRect = referenceElement.getBoundingClientRect();\n\n const transform = `translate(${Math.round(\n refRect.left\n )}px, ${Math.round(refRect.top)}px)`;\n\n Object.assign(popover.style, {\n top: '0',\n left: '0',\n transform,\n });\n });\n }\n }\n\n private async hideDropdownAsync() {\n const popover = await this.dialogRef.waitForCurrent();\n if (popover?.matches(':popover-open')) {\n popover.hidePopover();\n }\n }\n\n private cleanupOnHide() {\n this.destroyAutoUpdate();\n this.arrowFocusController?.disconnect();\n this.itemObserver?.disconnect();\n this.disposeKeyListener?.();\n }\n\n private async applyDropdownPosition() {\n if (!this.show) {\n return;\n }\n if (!this.anchorElement) {\n return;\n }\n\n const referenceElement = this.anchorElement;\n const isSubmenu = this.isAnchorSubmenu();\n\n let targetElement: HTMLElement = this.hostElement;\n let strategy: 'fixed' \| 'absolute' = this.positioningStrategy;\n\n if (this.enableTopLayer) {\n const dialog = await this.dialogRef.waitForCurrent();\n if (!dialog) {\n return;\n }\n targetElement = dialog;\n strategy = 'fixed';\n }\n\n let positionConfig: Partial<ComputePositionConfig> = {\n strategy,\n middleware: [],\n };\n\n if (!this.suppressAutomaticPlacement) {\n positionConfig.middleware?.push(\n flip({ fallbackStrategy: 'initialPlacement' })\n );\n }\n\n positionConfig.placement = isSubmenu ? 'right-start' : this.placement;\n\n positionConfig.middleware = [\n ...(positionConfig.middleware?.filter(Boolean) \|\| []),\n inline(),\n shift(),\n ];\n\n if (this.offset) {\n positionConfig.middleware.push(offset(this.offset));\n }\n\n this.destroyAutoUpdate();\n\n this.autoUpdateCleanup = autoUpdate(\n referenceElement,\n targetElement,\n async () => {\n const computeResponse = await computePosition(\n referenceElement,\n targetElement,\n positionConfig\n );\n Object.assign(targetElement.style, {\n top: '0',\n left: '0',\n transform: `translate(${Math.round(computeResponse.x)}px,${Math.round(\n computeResponse.y\n )}px)`,\n });\n\n if (this.overwriteDropdownStyle) {\n const overwriteStyle = await this.overwriteDropdownStyle({\n dropdownRef: targetElement,\n triggerRef: this.triggerElement as HTMLElement,\n });\n\n Object.assign(targetElement.style, overwriteStyle);\n }\n },\n {\n ancestorResize: true,\n ancestorScroll: true,\n elementResize: true,\n }\n );\n }\n\n private focusDropdownItem(index: number) {\n requestAnimationFrameNoNgZone(() => {\n const button =\n this.dropdownItems[index]?.shadowRoot?.querySelector('button');\n\n if (button) {\n button.focus();\n }\n });\n }\n\n async componentDidLoad() {\n if (this.show) {\n this.changedShow(true);\n }\n\n if (!this.trigger) {\n return;\n }\n\n this.changedTrigger(this.trigger);\n }\n\n async componentDidRender() {\n await this.applyDropdownPosition();\n await this.resolveAnchorElement();\n }\n\n private isTriggerElement(element: HTMLElement) {\n const trigger = !!element.hasAttribute('data-ix-dropdown-trigger');\n\n return trigger;\n }\n\n private onDropdownClick(event: PointerEvent) {\n const target = dropdownController.pathIncludesTrigger(event.composedPath());\n if (target) {\n if (target !== this.triggerElement) {\n event.preventDefault();\n }\n\n if (this.isTriggerElement(target)) {\n if (this.closeBehavior === 'outside') {\n event.preventDefault();\n }\n return;\n }\n }\n\n if (\n !event.defaultPrevented &&\n (this.closeBehavior === 'inside' \|\| this.closeBehavior === 'both')\n ) {\n dropdownController.dismissAll([this.getId()], this.ignoreRelatedSubmenu);\n return;\n }\n\n dropdownController.dismissOthers(this.getId());\n }\n\n /\n Update position of dropdown\n */\n @Method()\n async updatePosition() {\n this.applyDropdownPosition();\n }\n\n render() {\n if (this.enableTopLayer) {\n return (\n <Host\n data-ix-dropdown={this.localUId}\n class={{\n 'dropdown-menu': true,\n show: this.show,\n }}\n >\n <dialog\n ref={this.dialogRef}\n class={{\n dialog: true,\n overflow: !this.suppressOverflowBehavior,\n }}\n popover=\"manual\"\n aria-modal=\"true\"\n aria-label={this.header}\n tabindex={-1}\n onClick={(event: PointerEvent) => this.onDropdownClick(event)}\n >\n <div class=\"dropdown-container\">\n {this.header && <div class=\"dropdown-header\">{this.header}</div>}\n {this.show && <slot></slot>}\n </div>\n </dialog>\n </Host>\n );\n }\n\n return (\n <Host\n data-ix-dropdown={this.localUId}\n class={{\n 'dropdown-menu': true,\n show: this.show,\n overflow: !this.suppressOverflowBehavior,\n }}\n style={{\n margin: '0',\n minWidth: '0px',\n position: this.positioningStrategy,\n }}\n role=\"list\"\n onClick={(event: PointerEvent) => this.onDropdownClick(event)}\n >\n <div style={{ display: 'contents' }}>\n {this.header && <div class=\"dropdown-header\">{this.header}</div>}\n {this.show && <slot></slot>}\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/dropdown-button/dropdown-button.js CHANGED Viewed

@@ -6,8 +6,9 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import { h, Host } from "@stencil/core";
 import { iconChevronDownSmall, iconChevronUpSmall, } from "@siemens/ix-icons/icons";
+import { h, Host } from "@stencil/core";
+import { a11yBoolean } from "../utils/a11y";
 import { makeRef } from "../utils/make-ref";
 export class DropdownButton {
     constructor() {
@@ -23,9 +24,19 @@ export class DropdownButton {
          * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.
          */
         this.closeBehavior = 'both';
+        /**
+         * Enable Popover API rendering for dropdown.
+         *
+         * @default false
+         * @since 4.3.0
+         */
+        this.enableTopLayer = false;
         this.dropdownShow = false;
         this.dropdownAnchor = makeRef();
         this.onDropdownShowChanged = (event) => {
+            if (this.disabled && event.detail) {
+                return;
+            }
             this.dropdownShow = event.detail;
         };
     }
@@ -38,11 +49,11 @@ export class DropdownButton {
             } }));
     }
     render() {
-        return (h(Host, { key: '4e4aca39eff13b8f665682b3f2dc9ace533c7ca0', class: {
+        return (h(Host, { key: '2232add1b732f43028df1725baa05a08ce025b69', "aria-disabled": a11yBoolean(this.disabled), class: {
                 disabled: this.disabled,
-            }, ref: this.dropdownAnchor }, h("div", { key: '9583ed2274621e67d779e9668fead87f663b7558', class: "dropdown-button" }, this.label ? (h("ix-button", { variant: this.variant, disabled: this.disabled, alignment: "start", ariaLabel: this.ariaLabelDropdownButton }, h("div", { class: 'content' }, this.icon ? (h("ix-icon", { name: this.icon, size: "24", class: 'dropdown-icon' })) : null, h("div", { class: 'button-label' }, this.label), h("ix-icon", { name: this.dropdownShow
+            }, ref: this.dropdownAnchor }, h("div", { key: '0bbbbef21fd826b770c8231e449dd5beb9d799e1', class: "dropdown-button" }, this.label ? (h("ix-button", { variant: this.variant, disabled: this.disabled, alignment: "start", ariaLabel: this.ariaLabelDropdownButton, tabIndex: this.disabled ? -1 : 0 }, h("div", { class: 'content' }, this.icon ? (h("ix-icon", { name: this.icon, size: "24", class: 'dropdown-icon' })) : null, h("div", { class: 'button-label' }, this.label), h("ix-icon", { name: this.dropdownShow
                 ? iconChevronUpSmall
-                : iconChevronDownSmall, size: "24" })))) : (h("div", null, h("ix-icon-button", { icon: this.icon, variant: this.variant, disabled: this.disabled }), this.getTriangle()))), h("ix-dropdown", { key: 'e4fd6fb8451d8883fac84764758a90ce6dc4d433', class: "dropdown", trigger: this.dropdownAnchor.waitForCurrent(), placement: this.placement, closeBehavior: this.closeBehavior, onShowChanged: this.onDropdownShowChanged }, h("slot", { key: 'be8d3427e80c326bc7a6993f53190e290b824967' }))));
+                : iconChevronDownSmall, size: "24" })))) : (h("div", null, h("ix-icon-button", { icon: this.icon, variant: this.variant, disabled: this.disabled, tabIndex: this.disabled ? -1 : 0 }), this.getTriangle()))), h("ix-dropdown", { key: 'd5d252fbef9edbf613eab9d1275e4a276582842c', class: "dropdown", trigger: this.dropdownAnchor.waitForCurrent(), placement: this.placement, closeBehavior: this.closeBehavior, enableTopLayer: this.enableTopLayer, onShowChanged: this.onDropdownShowChanged }, h("slot", { key: '648209786997a3ca47955ea921a42dd80ae5a6bc' }))));
     }
     static get is() { return "ix-dropdown-button"; }
     static get encapsulation() { return "shadow"; }
@@ -101,7 +112,7 @@ export class DropdownButton {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "false"
             },
             "label": {
@@ -208,6 +219,32 @@ export class DropdownButton {
                 "getter": false,
                 "setter": false,
                 "reflect": false
+            },
+            "enableTopLayer": {
+                "type": "boolean",
+                "attribute": "enable-top-layer",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "default",
+                            "text": "false"
+                        }, {
+                            "name": "since",
+                            "text": "4.3.0"
+                        }],
+                    "text": "Enable Popover API rendering for dropdown."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "false"
             }
         };
     }

package/dist/collection/components/dropdown-button/dropdown-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dropdown-button.js","sourceRoot":"","sources":["../../../src/components/dropdown-button/dropdown-button.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEzE,OAAO,~~EACL~~,~~oBAAoB~~,~~EACpB~~,~~kBAAkB,GACnB,~~MAAM,~~yBAAyB~~,CAAC;~~AACjC~~,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAC;AAQ5C,MAAM,OAAO,cAAc;IAL3B;QAQE;;WAEG;QACK,YAAO,GAA0B,SAAS,CAAC;QAEnD;;WAEG;~~QACK~~,aAAQ,GAAG,KAAK,CAAC;~~QAYzB~~;;WAEG;QACK,kBAAa,GAA4C,MAAM,CAAC;~~QAe~~/D,iBAAY,GAAG,KAAK,CAAC;QAEb,mBAAc,GAAG,OAAO,EAAe,CAAC;QAexC,0BAAqB,GAAG,CAAC,KAA2B,EAAE,EAAE;YACvE,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC;QACnC,CAAC,CAAC;~~KA6DH~~;~~IA5ES~~,WAAW;QACjB,OAAO,CACL,WACE,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI;gBACd,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,IAAI;gBACpB,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK;gBAClB,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,GACI,CACR,CAAC;IACJ,CAAC;~~IAMD~~,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,~~qDACH~~,KAAK,EAAE;gBACL,QAAQ,EAAE,IAAI,CAAC,QAAQ;aACxB,EACD,GAAG,EAAE,IAAI,CAAC,cAAc;YAExB,4DAAK,KAAK,EAAC,iBAAiB,IACzB,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CACZ,iBACE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAC,OAAO,EACjB,SAAS,EAAE,IAAI,CAAC,uBAAuB;~~gBAEvC~~,WAAK,KAAK,EAAE,SAAS;oBAClB,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACX,eACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAC,IAAI,EACT,KAAK,EAAE,eAAe,GACb,CACZ,CAAC,CAAC,CAAC,IAAI;oBACR,WAAK,KAAK,EAAE,cAAc,IAAG,IAAI,CAAC,KAAK,CAAO;oBAC9C,eACE,IAAI,EACF,IAAI,CAAC,YAAY;4BACf,CAAC,CAAC,kBAAkB;4BACpB,CAAC,CAAC,oBAAoB,EAE1B,IAAI,EAAC,IAAI,GACA,CACP,CACI,CACb,CAAC,CAAC,CAAC,CACF;gBACE,sBACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,QAAQ,~~GACP~~;gBACjB,IAAI,CAAC,WAAW,EAAE,CACf,CACP,CACG;YAEN,oEACE,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,cAAc,EAAE,EAC7C,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,aAAa,EAAE,IAAI,CAAC,aAAa,EACjC,aAAa,EAAE,IAAI,CAAC,qBAAqB;gBAEzC,8DAAa,CACD,CACT,CACR,CAAC;IACJ,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~CACF","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\nimport { AlignedPlacement } from '../dropdown/placement';\nimport {~~\n iconChevronDownSmall,\n iconChevronUpSmall,\n~~} from '~~@siemens~~/~~ix-icons/icons~~';\nimport { makeRef } from '../utils/make-ref';\nimport type { DropdownButtonVariant } from './dropdown-button.types';\n\n@Component({\n tag: 'ix-dropdown-button',\n styleUrl: 'dropdown-button.scss',\n shadow: true,\n})\nexport class DropdownButton {\n @Element() hostElement!: HTMLIxDropdownButtonElement;\n\n /\n Button variant\n /\n @Prop() variant: DropdownButtonVariant = 'primary';\n\n /\n Disable button\n /\n @Prop() disabled = false;\n\n /\n Set label\n /\n @Prop() label?: string;\n\n /\n Button icon\n /\n @Prop() icon?: string;\n\n /\n Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n /\n @Prop() closeBehavior: 'inside' \| 'outside' \| 'both' \| boolean = 'both';\n\n /\n Placement of the dropdown\n /\n @Prop() placement?: AlignedPlacement;\n\n /\n ARIA label for the dropdown button\n * Will be set as aria-label on the nested HTML button element\n \n @since 3.2.0\n */\n @Prop() ariaLabelDropdownButton?: string;\n\n @State() dropdownShow = false;\n\n private readonly dropdownAnchor = makeRef<HTMLElement>();\n\n private getTriangle() {\n return (\n <div\n class={{\n triangle: true,\n [this.variant]: true,\n hide: !!this.label,\n disabled: this.disabled,\n }}\n ></div>\n );\n }\n\n private readonly onDropdownShowChanged = (event: CustomEvent<boolean>) => {\n this.dropdownShow = event.detail;\n };\n\n render() {\n return (\n <Host\n class={{\n disabled: this.disabled,\n }}\n ref={this.dropdownAnchor}\n >\n <div class=\"dropdown-button\">\n {this.label ? (\n <ix-button\n variant={this.variant}\n disabled={this.disabled}\n alignment=\"start\"\n ariaLabel={this.ariaLabelDropdownButton}\n >\n <div class={'content'}>\n {this.icon ? (\n <ix-icon\n name={this.icon}\n size=\"24\"\n class={'dropdown-icon'}\n ></ix-icon>\n ) : null}\n <div class={'button-label'}>{this.label}</div>\n <ix-icon\n name={\n this.dropdownShow\n ? iconChevronUpSmall\n : iconChevronDownSmall\n }\n size=\"24\"\n ></ix-icon>\n </div>\n </ix-button>\n ) : (\n <div>\n <ix-icon-button\n icon={this.icon}\n variant={this.variant}\n disabled={this.disabled}\n ></ix-icon-button>\n {this.getTriangle()}\n </div>\n )}\n </div>\n\n <ix-dropdown\n class=\"dropdown\"\n trigger={this.dropdownAnchor.waitForCurrent()}\n placement={this.placement}\n closeBehavior={this.closeBehavior}\n onShowChanged={this.onDropdownShowChanged}\n >\n <slot></slot>\n </ix-dropdown>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"dropdown-button.js","sourceRoot":"","sources":["../../../src/components/dropdown-button/dropdown-button.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n iconChevronDownSmall,\n iconChevronUpSmall,\n} from '@siemens/ix-icons/icons';\nimport { Component, Element, h, Host, Prop, State } from '@stencil/core';\nimport { AlignedPlacement } from '../dropdown/placement';\nimport { a11yBoolean } from '../utils/a11y';\nimport { makeRef } from '../utils/make-ref';\nimport type { DropdownButtonVariant } from './dropdown-button.types';\n\n@Component({\n tag: 'ix-dropdown-button',\n styleUrl: 'dropdown-button.scss',\n shadow: true,\n})\nexport class DropdownButton {\n @Element() hostElement!: HTMLIxDropdownButtonElement;\n\n /\n Button variant\n /\n @Prop() variant: DropdownButtonVariant = 'primary';\n\n /\n Disable button\n /\n @Prop({ reflect: true }) disabled = false;\n\n /\n Set label\n /\n @Prop() label?: string;\n\n /\n Button icon\n /\n @Prop() icon?: string;\n\n /\n Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.\n /\n @Prop() closeBehavior: 'inside' \| 'outside' \| 'both' \| boolean = 'both';\n\n /\n Placement of the dropdown\n /\n @Prop() placement?: AlignedPlacement;\n\n /\n ARIA label for the dropdown button\n * Will be set as aria-label on the nested HTML button element\n \n @since 3.2.0\n /\n @Prop() ariaLabelDropdownButton?: string;\n\n /\n Enable Popover API rendering for dropdown.\n \n @default false\n * @since 4.3.0\n */\n @Prop() enableTopLayer: boolean = false;\n\n @State() dropdownShow = false;\n\n private readonly dropdownAnchor = makeRef<HTMLElement>();\n\n private getTriangle() {\n return (\n <div\n class={{\n triangle: true,\n [this.variant]: true,\n hide: !!this.label,\n disabled: this.disabled,\n }}\n ></div>\n );\n }\n\n private readonly onDropdownShowChanged = (event: CustomEvent<boolean>) => {\n if (this.disabled && event.detail) {\n return;\n }\n this.dropdownShow = event.detail;\n };\n\n render() {\n return (\n <Host\n aria-disabled={a11yBoolean(this.disabled)}\n class={{\n disabled: this.disabled,\n }}\n ref={this.dropdownAnchor}\n >\n <div class=\"dropdown-button\">\n {this.label ? (\n <ix-button\n variant={this.variant}\n disabled={this.disabled}\n alignment=\"start\"\n ariaLabel={this.ariaLabelDropdownButton}\n tabIndex={this.disabled ? -1 : 0}\n >\n <div class={'content'}>\n {this.icon ? (\n <ix-icon\n name={this.icon}\n size=\"24\"\n class={'dropdown-icon'}\n ></ix-icon>\n ) : null}\n <div class={'button-label'}>{this.label}</div>\n <ix-icon\n name={\n this.dropdownShow\n ? iconChevronUpSmall\n : iconChevronDownSmall\n }\n size=\"24\"\n ></ix-icon>\n </div>\n </ix-button>\n ) : (\n <div>\n <ix-icon-button\n icon={this.icon}\n variant={this.variant}\n disabled={this.disabled}\n tabIndex={this.disabled ? -1 : 0}\n ></ix-icon-button>\n {this.getTriangle()}\n </div>\n )}\n </div>\n\n <ix-dropdown\n class=\"dropdown\"\n trigger={this.dropdownAnchor.waitForCurrent()}\n placement={this.placement}\n closeBehavior={this.closeBehavior}\n enableTopLayer={this.enableTopLayer}\n onShowChanged={this.onDropdownShowChanged}\n >\n <slot></slot>\n </ix-dropdown>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/dropdown-header/dropdown-header.js CHANGED Viewed

@@ -9,7 +9,7 @@
 import { h, Host } from "@stencil/core";
 export class DropdownHeader {
     render() {
-        return (h(Host, { key: '8c2634f5c46a222e4803fa7ae426fcdf9d8edaf4' }, h("ix-typography", { key: '0951a5b06d746db809529a9149e021696507ade2', class: 'category-text', format: 'h5' }, this.label)));
+        return (h(Host, { key: '6ec911ed6360d3e523a5a871007d874d67cf1334' }, h("ix-typography", { key: 'f1a8142ff1d8212a389649a6b7cc31495ccb9fa0', class: 'category-text', format: 'h5' }, this.label)));
     }
     static get is() { return "ix-dropdown-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/dropdown-item/dropdown-item.js CHANGED Viewed

@@ -8,6 +8,7 @@
  */
 import { h, Host, } from "@stencil/core";
 import { iconChevronRightSmall, iconSingleCheck, } from "@siemens/ix-icons/icons";
+import { a11yBoolean } from "../utils/a11y";
 export class DropdownItem {
     constructor() {
         /**
@@ -41,15 +42,20 @@ export class DropdownItem {
             this.icon !== undefined);
     }
     render() {
-        return (h(Host, { key: '4683b34a35d26f4cdce448ed24cdc5115f838fed', class: {
+        return (h(Host, { key: '6792db1dd356481085735838df4cfcdf11cee1ba', class: {
                 hover: this.hover,
                 'icon-only': this.isIconOnly(),
                 disabled: this.disabled,
                 submenu: this.isSubMenu,
-            }, role: "listitem" }, h("button", { key: 'a655623c265f18e805a0f60a093dd4ac565ab35c', type: "button", tabIndex: 0, class: {
+            }, role: "listitem" }, h("button", { key: '878eed19e5127942f10f561db2205930a7bb01ef', type: "button", tabIndex: this.disabled ? -1 : 0, class: {
                 'dropdown-item': true,
                 'no-checked-field': this.suppressChecked,
-            }, onClick: () => this.emitItemClick(), "aria-label": this.ariaLabelButton }, !this.suppressChecked ? (h("div", { class: "dropdown-item-checked" }, this.checked ? (h("ix-icon", { class: "checkmark", name: iconSingleCheck, size: "16" })) : null)) : null, this.icon ? (h("ix-icon", { class: "dropdown-item-icon", name: this.icon, "aria-label": this.ariaLabelIcon })) : null, h("div", { key: 'd88e90650387ce4dd0d440fe03bf21c19c785709', class: "dropdown-item-text" }, this.label, h("slot", { key: 'd892aabbb2e268d36c348b800c043d08f2ceef83' })), this.isSubMenu ? (h("ix-icon", { name: iconChevronRightSmall, class: 'submenu-icon' })) : null)));
+                disabled: this.disabled,
+            }, onClick: () => {
+                if (!this.disabled) {
+                    this.emitItemClick();
+                }
+            }, "aria-label": this.ariaLabelButton, "aria-disabled": a11yBoolean(this.disabled), disabled: this.disabled }, !this.suppressChecked ? (h("div", { class: "dropdown-item-checked" }, this.checked ? (h("ix-icon", { class: "checkmark", name: iconSingleCheck, size: "16" })) : null)) : null, this.icon ? (h("ix-icon", { class: "dropdown-item-icon", name: this.icon, "aria-label": this.ariaLabelIcon })) : null, h("div", { key: 'faf59089cf0887b1fc1907b6e98b1f1cd2aa62ab', class: "dropdown-item-text" }, this.label, h("slot", { key: '112c5601bae07f6ab8807b42014a268f7e402d59' })), this.isSubMenu ? (h("ix-icon", { name: iconChevronRightSmall, class: 'submenu-icon' })) : null)));
     }
     static get is() { return "ix-dropdown-item"; }
     static get encapsulation() { return "shadow"; }
@@ -181,7 +187,7 @@ export class DropdownItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
+                "reflect": true,
                 "defaultValue": "false"
             },
             "checked": {

package/dist/collection/components/dropdown-item/dropdown-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dropdown-item.js","sourceRoot":"","sources":["../../../src/components/dropdown-item/dropdown-item.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,OAAO,EACL,SAAS,EACT,OAAO,EACP,KAAK,EAEL,CAAC,EACD,IAAI,EACJ,MAAM,EACN,IAAI,GACL,MAAM,eAAe,CAAC;AAEvB,OAAO,EACL,qBAAqB,EACrB,eAAe,GAChB,MAAM,yBAAyB,CAAC;~~AAOjC~~,MAAM,OAAO,YAAY;IALzB;QA+BE;;WAEG;QACK,UAAK,GAAG,KAAK,CAAC;QAEtB;;WAEG;~~QACK~~,aAAQ,GAAG,KAAK,CAAC;~~QAEzB~~;;WAEG;QACK,YAAO,GAAG,KAAK,CAAC;QAExB,gBAAgB;QACR,cAAS,GAAG,KAAK,CAAC;QAE1B,gBAAgB;QACR,oBAAe,GAAG,KAAK,CAAC;~~KA8EjC~~;~~IAzEC~~,gBAAgB;IAEhB,KAAK,CAAC,aAAa;QACjB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;IACxC,CAAC;IAED,gBAAgB;IAEhB,KAAK,CAAC,sBAAsB;QAC1B,OAAO,IAAI,CAAC,WAAW,CAAC;IAC1B,CAAC;IAEO,UAAU;QAChB,OAAO,CACL,IAAI,CAAC,KAAK,KAAK,SAAS;YACxB,IAAI,CAAC,WAAW,CAAC,SAAS,KAAK,EAAE;YACjC,IAAI,CAAC,IAAI,KAAK,SAAS,CACxB,CAAC;IACJ,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE;gBACL,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,WAAW,EAAE,IAAI,CAAC,UAAU,EAAE;gBAC9B,QAAQ,EAAE,IAAI,CAAC,QAAQ;gBACvB,OAAO,EAAE,IAAI,CAAC,SAAS;aACxB,EACD,IAAI,EAAC,UAAU;YAEf,+DACE,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,~~EACX~~,KAAK,EAAE;oBACL,eAAe,EAAE,IAAI;oBACrB,kBAAkB,EAAE,IAAI,CAAC,eAAe;~~iBACzC~~,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,~~gBACvB~~,IAAI,CAAC,eAAe;~~gBAE/B~~,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CACvB,WAAK,KAAK,EAAC,uBAAuB,IAC/B,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CACd,eACE,KAAK,EAAC,WAAW,EACjB,IAAI,EAAE,eAAe,EACrB,IAAI,EAAC,IAAI,GACA,CACZ,CAAC,CAAC,CAAC,IAAI,CACJ,CACP,CAAC,CAAC,CAAC,IAAI;gBACP,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACX,eACE,KAAK,EAAC,oBAAoB,EAC1B,IAAI,EAAE,IAAI,CAAC,IAAI,gBACH,IAAI,CAAC,aAAa,GACrB,CACZ,CAAC,CAAC,CAAC,IAAI;gBACR,4DAAK,KAAK,EAAC,oBAAoB;oBAC5B,IAAI,CAAC,KAAK;oBACX,8DAAa,CACT;gBACL,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,CAChB,eACE,IAAI,EAAE,qBAAqB,EAC3B,KAAK,EAAE,cAAc,GACZ,CACZ,CAAC,CAAC,CAAC,IAAI,CACD,CACJ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n} from '@stencil/core';\nimport { DropdownItemWrapper } from '../dropdown/dropdown-controller';\nimport {\n iconChevronRightSmall,\n iconSingleCheck,\n} from '@siemens/ix-icons/icons';\n\n@Component({\n tag: 'ix-dropdown-item',\n styleUrl: 'dropdown-item.scss',\n shadow: true,\n})\nexport class DropdownItem implements DropdownItemWrapper {\n @Element() hostElement!: HTMLIxDropdownItemElement;\n\n /\n Label of dropdown item\n /\n @Prop() label?: string;\n\n /\n Icon of dropdown item\n /\n @Prop() icon?: string;\n\n /\n ARIA label for the icon\n /\n @Prop() ariaLabelIcon?: string;\n\n /\n ARIA label for the item's button\n * Will be set as aria-label for the nested HTML button element\n \n @since 3.2.0\n /\n @Prop() ariaLabelButton?: string;\n\n /\n Display hover state\n /\n @Prop() hover = false;\n\n /\n Disable item and remove event listeners\n /\n @Prop() disabled = false;\n\n /\n Whether the item is checked or not. If true a checkmark will mark the item as checked.\n /\n @Prop() checked = false;\n\n /* @internal /\n @Prop() isSubMenu = false;\n\n /* @internal /\n @Prop() suppressChecked = false;\n\n /* @internal /\n @Event() itemClick!: EventEmitter<HTMLIxDropdownItemElement>;\n\n /* @internal /\n @Method()\n async emitItemClick() {\n this.itemClick.emit(this.hostElement);\n }\n\n /* @internal */\n @Method()\n async getDropdownItemElement() {\n return this.hostElement;\n }\n\n private isIconOnly() {\n return (\n this.label === undefined &&\n this.hostElement.innerText === '' &&\n this.icon !== undefined\n );\n }\n\n render() {\n return (\n <Host\n class={{\n hover: this.hover,\n 'icon-only': this.isIconOnly(),\n disabled: this.disabled,\n submenu: this.isSubMenu,\n }}\n role=\"listitem\"\n >\n <button\n type=\"button\"\n tabIndex={0}\n class={{\n 'dropdown-item': true,\n 'no-checked-field': this.suppressChecked,\n }}\n onClick={() => this.emitItemClick()}\n aria-label={this.ariaLabelButton}\n >\n {!this.suppressChecked ? (\n <div class=\"dropdown-item-checked\">\n {this.checked ? (\n <ix-icon\n class=\"checkmark\"\n name={iconSingleCheck}\n size=\"16\"\n ></ix-icon>\n ) : null}\n </div>\n ) : null}\n {this.icon ? (\n <ix-icon\n class=\"dropdown-item-icon\"\n name={this.icon}\n aria-label={this.ariaLabelIcon}\n ></ix-icon>\n ) : null}\n <div class=\"dropdown-item-text\">\n {this.label}\n <slot></slot>\n </div>\n {this.isSubMenu ? (\n <ix-icon\n name={iconChevronRightSmall}\n class={'submenu-icon'}\n ></ix-icon>\n ) : null}\n </button>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"dropdown-item.js","sourceRoot":"","sources":["../../../src/components/dropdown-item/dropdown-item.tsx"],"names":[],"mappings":"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","sourcesContent":["/\n SPDX-FileCopyrightText: 2023 Siemens AG\n \n SPDX-License-Identifier: MIT\n \n This source code is licensed under the MIT license found in the\n * LICENSE file in the root directory of this source tree.\n /\n\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Method,\n Prop,\n} from '@stencil/core';\nimport { DropdownItemWrapper } from '../dropdown/dropdown-controller';\nimport {\n iconChevronRightSmall,\n iconSingleCheck,\n} from '@siemens/ix-icons/icons';\nimport { a11yBoolean } from '../utils/a11y';\n\n@Component({\n tag: 'ix-dropdown-item',\n styleUrl: 'dropdown-item.scss',\n shadow: true,\n})\nexport class DropdownItem implements DropdownItemWrapper {\n @Element() hostElement!: HTMLIxDropdownItemElement;\n\n /\n Label of dropdown item\n /\n @Prop() label?: string;\n\n /\n Icon of dropdown item\n /\n @Prop() icon?: string;\n\n /\n ARIA label for the icon\n /\n @Prop() ariaLabelIcon?: string;\n\n /\n ARIA label for the item's button\n * Will be set as aria-label for the nested HTML button element\n \n @since 3.2.0\n /\n @Prop() ariaLabelButton?: string;\n\n /\n Display hover state\n /\n @Prop() hover = false;\n\n /\n Disable item and remove event listeners\n /\n @Prop({ reflect: true }) disabled = false;\n\n /\n Whether the item is checked or not. If true a checkmark will mark the item as checked.\n /\n @Prop() checked = false;\n\n /* @internal /\n @Prop() isSubMenu = false;\n\n /* @internal /\n @Prop() suppressChecked = false;\n\n /* @internal /\n @Event() itemClick!: EventEmitter<HTMLIxDropdownItemElement>;\n\n /* @internal /\n @Method()\n async emitItemClick() {\n this.itemClick.emit(this.hostElement);\n }\n\n /* @internal */\n @Method()\n async getDropdownItemElement() {\n return this.hostElement;\n }\n\n private isIconOnly() {\n return (\n this.label === undefined &&\n this.hostElement.innerText === '' &&\n this.icon !== undefined\n );\n }\n\n render() {\n return (\n <Host\n class={{\n hover: this.hover,\n 'icon-only': this.isIconOnly(),\n disabled: this.disabled,\n submenu: this.isSubMenu,\n }}\n role=\"listitem\"\n >\n <button\n type=\"button\"\n tabIndex={this.disabled ? -1 : 0}\n class={{\n 'dropdown-item': true,\n 'no-checked-field': this.suppressChecked,\n disabled: this.disabled,\n }}\n onClick={() => {\n if (!this.disabled) {\n this.emitItemClick();\n }\n }}\n aria-label={this.ariaLabelButton}\n aria-disabled={a11yBoolean(this.disabled)}\n disabled={this.disabled}\n >\n {!this.suppressChecked ? (\n <div class=\"dropdown-item-checked\">\n {this.checked ? (\n <ix-icon\n class=\"checkmark\"\n name={iconSingleCheck}\n size=\"16\"\n ></ix-icon>\n ) : null}\n </div>\n ) : null}\n {this.icon ? (\n <ix-icon\n class=\"dropdown-item-icon\"\n name={this.icon}\n aria-label={this.ariaLabelIcon}\n ></ix-icon>\n ) : null}\n <div class=\"dropdown-item-text\">\n {this.label}\n <slot></slot>\n </div>\n {this.isSubMenu ? (\n <ix-icon\n name={iconChevronRightSmall}\n class={'submenu-icon'}\n ></ix-icon>\n ) : null}\n </button>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/dropdown-quick-actions/dropdown-quick-actions.js CHANGED Viewed

@@ -9,7 +9,7 @@
 import { h, Host } from "@stencil/core";
 export class DropdownQuickActions {
     render() {
-        return (h(Host, { key: '270b8dba8a8b79072beb81301d923f8f8754b70f' }, h("slot", { key: '9970e51c7af36350359311ea217e2a402a35f994' })));
+        return (h(Host, { key: '5b9938da726bfe31dffe1667ff81c1b3a5935e1e' }, h("slot", { key: 'a3f04dc61e5896ede45c0484506b3ee611b413c8' })));
     }
     static get is() { return "ix-dropdown-quick-actions"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/empty-state/empty-state.js CHANGED Viewed

@@ -15,7 +15,7 @@ export class EmptyState {
         this.layout = 'large';
     }
     render() {
-        return (h(Host, { key: '40044bc561b77f0ca121fec086c4e50959cd84b8', class: `emptyState emptyState--${this.layout}` }, this.icon && (h("div", { key: '4f7caad68b5bfdae9a3becc0d9cb86e6aa121b9a', class: "emptyState__icon" }, h("ix-icon", { key: '4f3540bc8589358f3a81136bf18e37a963ccf8c4', name: this.icon, size: this.layout === 'large' ? '32' : '32', color: "color-soft-text", "aria-label": this.ariaLabelEmptyStateIcon }))), h("div", { key: 'aa658e73609ff249ada8b4a11897bc6fd16f3e27', class: "emptyState__content" }, h("div", { key: 'f46a03dcf711bdfc3919d3f94e5b60e64f434173', class: "content__label" }, h("ix-typography", { key: 'dd56a7bc024921adedf792ed956614a13a7dd723', format: this.layout === 'large' ? 'h3' : 'body' }, this.header), this.subHeader && (h("div", { key: '7813b0fd9e490328b24566ae0abb805dbc2d1b3b', class: "label__subHeader" }, this.subHeader))), this.action && (h("div", { key: '4ffbf8f873bff95e04376dac344cd312d39a68d6', class: "content__action" }, h("ix-button", { key: '20739fd736c3176034dcc6d564c09879f745b9b3', onClick: () => this.actionClick.emit() }, this.action))))));
+        return (h(Host, { key: 'f87d35f9c8ae39f3ed46f8ebf0fe1b0487d91108', class: `emptyState emptyState--${this.layout}` }, this.icon && (h("div", { key: '41eb63bad03958baeb5f683895ea196f883b5312', class: "emptyState__icon" }, h("ix-icon", { key: '3bd1032f996cdf7c046f767ac9fec79756a7b8e5', name: this.icon, size: this.layout === 'large' ? '32' : '32', color: "color-soft-text", "aria-label": this.ariaLabelEmptyStateIcon }))), h("div", { key: '1a287d69a879f7dd52e9801e9fd0a973849fc244', class: "emptyState__content" }, h("div", { key: '8e2ff9b6f189e732dd16bf943922b09f32b9adfc', class: "content__label" }, h("ix-typography", { key: '74bc4394d9b94c2d3161091b71fbeb8ca091d6d8', format: this.layout === 'large' ? 'h3' : 'body' }, this.header), this.subHeader && (h("div", { key: '43e21aec14323f18a4df1116c7841702a945bcfe', class: "label__subHeader" }, this.subHeader))), this.action && (h("div", { key: 'd80c01f388e99df9affc47086ac2f67ef89ca8ca', class: "content__action" }, h("ix-button", { key: '0ba60803afb761fbae046546ed06f6ab07bc728c', onClick: () => this.actionClick.emit() }, this.action))))));
     }
     static get is() { return "ix-empty-state"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/event-list/event-list.js CHANGED Viewed

@@ -128,11 +128,11 @@ export class EventList {
         });
     }
     render() {
-        return (h(Host, { key: '71648df2cdbbb1951fa970739cdf1a6f4bd1c40f', class: {
+        return (h(Host, { key: 'a21a4d23666ba43d7d10bd569c7a9feb01423b1f', class: {
                 'item-size-s': this.itemHeight === 'S',
                 'item-size-l': this.itemHeight === 'L',
                 compact: this.compact,
-            } }, h("div", { key: 'ce46bd8d70b502d2dd19ffee75d2f3ae45e95d5a', role: "list" }, h("slot", { key: '016b05cd0e580af2e89232c3f4a0b5ebad8bda62' }))));
+            } }, h("div", { key: 'cbb5ffb72ce1a393c99df6624ffc3e36a3d6a4b5', role: "list" }, h("slot", { key: '50ca67f2071b058ee4e43bfcad1bf23d5fc623d3' }))));
     }
     static get is() { return "ix-event-list"; }
     static get encapsulation() { return "shadow"; }