wj-elements 0.6.0 → 0.7.0

package/dist/wje-sliding-container.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-sliding-container.js","sources":["../packages/wje-sliding-container/sliding-container.element.js","../packages/wje-sliding-container/sliding-container.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary SlidingContainer is a custom web component that extends WJElement.\n * @documentation https://elements.webjet.sk/components/SlidingContainer\n * @status stable\n * @augments WJElement\n * @csspart - Styles the element.\n * @slot - The default slot for the SlidingContainer.\n * @property {string} maxWidth - The maximum width of the SlidingContainer.\n * @property {string} maxHeight - The maximum height of the SlidingContainer.\n * @property {string} trigger - The trigger for the SlidingContainer.\n * @property {string} direction - Specifies the sliding direction of the container (e.g., 'left' or 'right').\n * @property {string} variant - Determines how the SlidingContainer behaves, such as 'over' or 'in-place'.\n * @property {string} screenBreakPoint - The width (in pixels) at which the SlidingContainer switches to the \"over\" variant for smaller screens.\n * @property {boolean} removeChildAfterClose - Removes the child after the SlidingContainer is closed.\n * @property {string} animationDuration - Specifies the duration (in milliseconds) of the sliding animation.\n * @property {string} animationEasing - Specifies the easing function used for the sliding animation (e.g., 'linear', 'ease-in', 'ease-out').\n * @property {boolean} hasOpacity - Sets the opacity of the SlidingContainer.\n * @tag wje-sliding-container\n * @example\n * <wje-sliding-container trigger=\"test-resize-container-event-right\" id=\"left-in-place\" direction=\"left\" max-width=\"100px\" max-height=\"100%\">\n *    <wje-card>\n *       <wje-card-header>\n *        <wje-card-subtitle>CONTENT Subtitle</wje-card-subtitle>\n *       <wje-card-title>CONTENT Title</wje-card-title>\n *      </wje-card-header>\n *     <wje-card-content>\n *        CONTENT Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n *    </wje-card-content>\n * </wje-card>\n * </wje-sliding-container>\n */\nexport default class SlidingContainer extends WJElement {\n    /**\n     * Creates an instance of SlidingContainer.\n     * @class\n     */\n    constructor() {\n        super();\n\n        this._isOpen = false;\n        this._lastCaller = null;\n\n        this._resizeObserver = new ResizeObserver((entries) => {\n            for (let entry of entries) {\n                if (entry.contentBoxSize) {\n                    if (this.drawingStatus < 3) return;\n\n                    if (this.screenBreakPoint && window.innerWidth <= this.screenBreakPoint) {\n                        if (this.variant !== 'over') {\n                            this.variant = 'over';\n                        } else {\n                            this.checkForVariant(this.variant);\n                        }\n                    } else {\n                        if (this.variant !== 'in-place') {\n                            this.variant = 'in-place';\n                        } else {\n                            this.checkForVariant(this.variant);\n                        }\n                    }\n                }\n            }\n        });\n\n        this._resizeObserver.observe(document.documentElement);\n    }\n\n    /**\n     * Sets the maximum width of an element by updating the 'max-width' attribute.\n     * @param {string} value The maximum width value to be set (e.g., '100px', '50%', etc.).\n     */\n    set maxWidth(value) {\n        this.setAttribute('max-width', value);\n    }\n\n    /**\n     * Gets the maximum width value of the element.\n     * Retrieves the value of the 'max-width' attribute. If the attribute is not set, it defaults to 'auto'.\n     * @returns {string} The maximum width value of the element or 'auto' if the attribute is not defined.\n     */\n    get maxWidth() {\n        return this.getAttribute('max-width') ?? 'auto';\n    }\n\n    /**\n     * Sets the maximum height for the element.\n     * @param {string} value The maximum height value to be applied to the element. This can include units such as \"px\", \"em\", \"%\", etc.\n     */\n    set maxHeight(value) {\n        this.setAttribute('max-height', value);\n    }\n\n    /**\n     * Retrieves the maximum height value of the element, or returns 'auto' if not set.\n     * @returns {string} The maximum height value or 'auto' if the attribute is not specified.\n     */\n    get maxHeight() {\n        return this.getAttribute('max-height') ?? 'auto';\n    }\n\n    /**\n     * Sets the 'trigger' attribute for the element.\n     * @param {string} value The value to set for the 'trigger' attribute.\n     */\n    set trigger(value) {\n        this.setAttribute('trigger', value);\n    }\n\n    /**\n     * Retrieves the value of the 'trigger' attribute. If the attribute is not set, it defaults to 'sliding-container'.\n     * @returns {string} The value of the 'trigger' attribute or the default value 'sliding-container' if not defined.\n     */\n    get trigger() {\n        return this.getAttribute('trigger') ?? 'sliding-container';\n    }\n\n    /**\n     * Sets the direction attribute for the element.\n     * @param {string} value The direction value to be assigned. Possible values are typically 'ltr' (left-to-right), 'rtl' (right-to-left), or 'auto'.\n     */\n    set direction(value) {\n        this.setAttribute('direction', value);\n    }\n\n    /**\n     * Retrieves the direction attribute of the instance.\n     * If the direction attribute is not set, it defaults to 'right'.\n     * @returns {string} The value of the direction attribute or 'right' if not set.\n     */\n    get direction() {\n        return this.getAttribute('direction') ?? 'right';\n    }\n\n    /**\n     * Sets the value of the `remove-child-after-close` attribute.\n     * This attribute determines if a child element should be removed after a close operation.\n     * @param {boolean|string} value The value to set for the `remove-child-after-close` attribute. The value can be a boolean or a string representation of a boolean.\n     */\n    set removeChildAfterClose(value) {\n        this.setAttribute('remove-child-after-close', value);\n    }\n\n    /**\n     * Gets the value indicating whether the child element should be removed after closing.\n     *\n     * This property checks the presence of the 'remove-child-after-close' attribute on the element.\n     * Returns `false` if the attribute does not exist.\n     * @returns {boolean} True if the 'remove-child-after-close' attribute is present, otherwise false.\n     */\n    get removeChildAfterClose() {\n        return this.hasAttribute('remove-child-after-close') ?? false;\n    }\n\n    /**\n     * Sets the 'variant' attribute to the specified value.\n     * @param {string} value The value to set for the 'variant' attribute.\n     */\n    set variant(value) {\n        this.setAttribute('variant', value);\n    }\n\n    /**\n     * Retrieves the value of the \"variant\" attribute. If the attribute is not set,\n     * it returns the default value 'in-place'.\n     * @returns {string} The variant value or the default value 'in-place'.\n     */\n    get variant() {\n        return this.getAttribute('variant') ?? 'in-place';\n    }\n\n    /**\n     * Retrieves the value of the 'screen-break-point' attribute.\n     * @returns {string} The value of the 'screen-break-point' attribute.\n     */\n    get screenBreakPoint() {\n        return this.getAttribute('screen-break-point');\n    }\n\n    /**\n     * Sets the screen break point value to determine responsive behavior.\n     * @param {string} value The value to set as the screen break point.\n     */\n    set screenBreakPoint(value) {\n        this.setAttribute('screen-break-point', value);\n    }\n\n    /**\n     * Sets the duration of the animation by updating the `animation-duration` attribute.\n     * @param {string} value The duration value for the animation, specified in a format\n     * such as seconds (e.g., \"2s\") or milliseconds (e.g., \"200ms\").\n     */\n    set animationDuration(value) {\n        this.setAttribute('animation-duration', value);\n    }\n\n    /**\n     * Gets the animation duration for an element.\n     * It retrieves the value of the 'animation-duration' attribute if present; otherwise, it defaults to '500'.\n     * @returns {string} The value of the animation duration, either from the attribute or the default '500'.\n     */\n    get animationDuration() {\n        return this.getAttribute('animation-duration') ?? '500';\n    }\n\n    /**\n     * Sets the easing function for the animation.\n     * @param {string} value The easing function to use for the animation. This can be any valid CSS timing function such as \"ease\", \"linear\", \"ease-in\", \"ease-out\", etc.\n     */\n    set animationEasing(value) {\n        this.setAttribute('animation-easing', value);\n    }\n\n    /**\n     * Retrieves the easing function for the animation.\n     * @returns {string} The value of the 'animation-easing' attribute if set, otherwise defaults to 'linear'.\n     */\n    get animationEasing() {\n        return this.getAttribute('animation-easing') ?? 'linear';\n    }\n\n    /**\n     * Determines if the element has an 'has-opacity' attribute.\n     * @returns {boolean} True if the element has the 'has-opacity' attribute, otherwise false.\n     */\n    get hasOpacity() {\n        return this.hasAttribute('has-opacity') ?? false;\n    }\n\n    /**\n     * Sets the value of the 'add-to-height' attribute.\n     * This attribute is used to modify or adjust the height dynamically.\n     * @param {string} value The value to be assigned to the 'add-to-height' attribute.\n     */\n    set addToHeight(value) {\n        this.setAttribute('add-to-height', value);\n    }\n\n    /**\n     * Retrieves the value of the 'add-to-height' attribute from the element.\n     * If the attribute is not set, it defaults to '0'.\n     * @returns {string} The value of the 'add-to-height' attribute or '0' if the attribute is not present.\n     */\n    get addToHeight() {\n        return this.getAttribute('add-to-height') ?? '0';\n    }\n\n    /**\n     * Determines whether the current state is open.\n     * @returns {boolean} True if the state is open, otherwise false.\n     */\n    get isOpen() {\n        return this._isOpen;\n    }\n\n    className = 'SlidingContainer';\n\n    /**\n     * Returns the observed attributes for the component.\n     * @returns {string[]}\n     */\n    static get observedAttributes() {\n        return ['max-width', 'max-height', 'trigger', 'direction', 'variant', 'screen-break-point', 'remove-child-after-close', 'animation-duration', 'animation-easing', 'has-opacity'];\n    }\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        this.syncAria();\n    }\n\n    /**\n     * Executes before drawing the element.\n     */\n    beforeDraw() {\n        this.animation?.cancel();\n        this.nativeAnimation?.cancel();\n\n        document.removeEventListener(this.trigger, this.triggerEvent);\n    }\n\n    /**\n     * Draws the component.\n     * @param {object} context The context for drawing.\n     * @param {object} store The store for drawing.\n     * @param {object} params The parameters for drawing.\n     * @returns {DocumentFragment}\n     */\n    draw(context, store, params) {\n        let fragment = document.createDocumentFragment();\n\n        let wrapperDiv = document.createElement('div');\n        wrapperDiv.classList.add('sliding-container-wrapper');\n\n        let transparentDiv = document.createElement('div');\n        transparentDiv.classList.add('sliding-container-transparent');\n\n        if (this._isOpen) {\n            transparentDiv.style.width = this.maxWidth;\n        }\n\n        let native = document.createElement('div');\n        native.setAttribute('part', 'sliding-container');\n        native.classList.add('native-sliding-container');\n        native.style.width = 0;\n        if (this.hasOpacity) {\n            native.style.opacity = 0;\n        }\n\n        if (this._isOpen) {\n            native.style.width = this.maxWidth;\n            if (this.hasOpacity) {\n                native.style.opacity = 1;\n            }\n        }\n\n        if (this.direction === 'right') {\n            native.style.right = 0;\n        } else {\n            native.style.left = 0;\n        }\n\n        let slot = document.createElement('slot');\n\n        const nativeInner = document.createElement('div');\n        nativeInner.classList.add('native-sliding-container-inner');\n        nativeInner.style.width = this.maxWidth;\n\n        // APPEND\n        nativeInner.append(slot);\n        nativeInner.append(this.htmlCloseButton());\n\n        native.append(nativeInner);\n\n        wrapperDiv.append(transparentDiv);\n        wrapperDiv.append(native);\n\n        fragment.append(wrapperDiv);\n\n        this.transparentDiv = transparentDiv;\n        this.wrapperDiv = wrapperDiv\n        this.nativeElement = native;\n\n        return fragment;\n    }\n\n    /**\n     * Performs actions after the element is drawn on the screen.\n     * Attaches an event listener to the document based on the specified trigger.\n     * Sets the variant to \"over\" if the document width is smaller than the screen break point.\n     * Calls the checkForVariant method with the current variant.\n     */\n    afterDraw() {\n        this.syncAria();\n        document.addEventListener(this.trigger, this.triggerEvent);\n\n        // if document width is on small screen set variant to over\n        if (this.screenBreakPoint && window.innerWidth <= this.screenBreakPoint) {\n            this.variant = 'over';\n        }\n\n        this.checkForVariant(this.variant);\n    }\n\n    /**\n     * Sync ARIA attributes on host.\n     */\n    syncAria() {\n        if (!this.hasAttribute('role')) {\n            this.setAriaState({ role: 'region' });\n        }\n\n        this.setAriaState({ hidden: !this.isOpen });\n\n        const ariaLabel = this.getAttribute('aria-label');\n        const label = this.getAttribute('label');\n        if (!ariaLabel && label) {\n            this.setAriaState({ label });\n        }\n    }\n\n    /**\n     * Creates and returns a styled close button element with an icon,\n     * including an event listener to trigger the close method.\n     * @returns {HTMLElement} The close button element configured with styles, an icon, and event listener.\n     */\n    htmlCloseButton() {\n        let closeButton = document.createElement('wje-button');\n        closeButton.setAttribute('part', 'close-button');\n        closeButton.classList.add('close-button');\n\n        let icon = document.createElement('wje-icon');\n        icon.setAttribute('slot', 'icon-only');\n        icon.setAttribute('name', 'x');\n\n        closeButton.append(icon);\n\n        event.addListener(closeButton, 'wje-button:click', null,(e) => {\n            this.close();\n        });\n\n        return closeButton;\n    }\n\n    /**\n     * Retrieves the parent element of the current element.\n     * If the parent element is not found, it attempts to find the root host element.\n     * @returns {Element|null} The parent element or the root host element if no parent exists. Returns null if neither is found.\n     */\n    getParentElement() {\n        let parentElement = this.parentElement;\n\n        if (!parentElement) {\n            parentElement = this.getRootNode().host;\n        }\n\n        return parentElement;\n    }\n\n    /**\n     * Adjusts the position and dimensions of the current element based on the specified variant.\n     *\n     * The method handles modifications to the element's positioning style, aligns it relative to its parent,\n     * and manages alignment to its siblings based on the specified direction.\n     * @param {string} variant The variant to determine how the element should be updated. For example, when set to 'over', specific adjustments to the position and size are performed.\n     * @returns {void} No value is returned, the method modifies the element's style properties directly.\n     */\n    checkForVariant(variant) {\n        if (variant === 'over') {\n            this.style.position = 'fixed';\n            let computentStyleOfParent = window.getComputedStyle(this.getParentElement());\n            let parentElementBoundingbox = this.getParentElement().getBoundingClientRect();\n            let heightOfParrentElement = parseFloat(computentStyleOfParent.height);\n\n            let topOfParrentElement = parseFloat(computentStyleOfParent.top);\n\n            this.style.height = heightOfParrentElement + +this.addToHeight + 'px';\n            this.wrapperDiv.style.height = heightOfParrentElement + +this.addToHeight + 'px';\n            this.style.top = topOfParrentElement + 'px';\n\n            const leftSibling = this.previousElementSibling;\n            const rightSibling = this.nextElementSibling;\n            const leftSiblingBoundingbox = leftSibling?.getBoundingClientRect();\n            const rightSiblingBoundingbox = rightSibling?.getBoundingClientRect();\n\n            if (this.direction === 'right') {\n                // attach to left sibling\n                if (leftSiblingBoundingbox) {\n                    this.style.left = leftSiblingBoundingbox.left + leftSiblingBoundingbox.width + 'px';\n                } else {\n                    this.style.left = parentElementBoundingbox.left + 'px';\n                }\n            } else {\n                // attach to right sibling\n                if (rightSiblingBoundingbox) {\n                    this.style.right = window.innerWidth - rightSiblingBoundingbox.left + 'px';\n                } else {\n                    this.style.right =\n                        window.innerWidth - (parentElementBoundingbox.left + parentElementBoundingbox.width) + 'px';\n                }\n            }\n        }\n    }\n\n    /**\n     * Triggers the event based on the target element.\n     * If the target element is different from the last caller, it refreshes the children by calling the `open` method.\n     * If the target element is the same as the last caller, it toggles the state by calling the `toggle` method.\n     * @param {Event} e The event object.\n     */\n    triggerEvent = async (e) => {\n        if (this._lastCaller && this._lastCaller !== e.composedPath()[0]) {\n            // same oppener event but different caller so just refresh inner content\n            await this.open(e);\n        } else {\n            // came caller so toggle\n            await this.toggle(e);\n        }\n\n        this._lastCaller = e.composedPath()[0];\n    };\n\n    /**\n     * Executes before the element is opened.\n     */\n    beforeOpen(e) {\n        // Hook for extending behavior before the dialog opens\n    }\n\n    /**\n     * Callback function called after the element is opened.\n     */\n    afterOpen(e) {\n        // Hook for extending behavior before the dialog opens\n    }\n\n    /**\n     * Executes before closing the element.\n     */\n    beforeClose(e) {\n        // Hook for extending behavior before the dialog opens\n    }\n\n    /**\n     * Callback function that is called after the container is closed.\n     */\n    afterClose(e) {\n        // Hook for extending behavior before the dialog opens\n    }\n\n    /**\n     * Animates the transition of elements with specified options, toggling the visibility and/or dimensions\n     * of the associated elements based on their current state.\n     *\n     * This method handles both forward and reverse animations for two elements (`transparentDiv` and `nativeElement`)\n     * with optional opacity changes. It ensures smooth transitioning by canceling any previous animations on the provided\n     * elements before initiating a new animation sequence.\n     * @returns {Promise<void>} A promise that resolves when the transition animation is completed.\n     */\n    doAnimateTransition() {\n        const options = {\n            delay: 0,\n            endDelay: 0,\n            fill: 'forwards',\n            duration: +this.animationDuration,\n            iterationStart: 0,\n            iterations: 1,\n            direction: 'normal',\n            easing: this.animationEasing,\n        };\n\n        if (this.animation && this.animation?.effect?.target !== this.transparentDiv) {\n            this.animation.cancel();\n            this.animation = null;\n        }\n\n        if (this.nativeAnimation && this.nativeAnimation?.effect?.target !== this.nativeElement) {\n            this.nativeAnimation.cancel();\n            this.nativeAnimation = null;\n        }\n\n        if (!this._isOpen) {\n            if (this.animation && this.nativeAnimation) {\n                this.animation.reverse();\n                this.nativeAnimation.reverse();\n            } else {\n                this.animation = this.transparentDiv.animate(\n                    [\n                        {\n                            width: 0,\n                        },\n                        {\n                            width: this.maxWidth,\n                        },\n                    ],\n                    options\n                );\n\n                this.nativeAnimation = this.nativeElement.animate(\n                    [\n                        {\n                            ...(this.hasOpacity ? { opacity: 0 } : {}),\n                            width: 0,\n                        },\n                        {\n                            ...(this.hasOpacity ? { opacity: 1 } : {}),\n                            width: this.maxWidth,\n                        },\n                    ],\n                    options\n                );\n            }\n        } else {\n            if (this.animation && this.nativeAnimation) {\n                this.animation.reverse();\n                this.nativeAnimation.reverse();\n            } else {\n                this.animation = this.transparentDiv.animate(\n                    [\n                        {\n                            width: this.maxWidth,\n                        },\n                        {\n                            width: 0,\n                        },\n                    ],\n                    options\n                );\n\n                this.nativeAnimation = this.nativeElement.animate(\n                    [\n                        {\n                            ...(this.hasOpacity ? { opacity: 1 } : {}),\n                            width: this.maxWidth,\n                        },\n                        {\n                            ...(this.hasOpacity ? { opacity: 0 } : {}),\n                            width: 0,\n                        },\n                    ],\n                    options\n                );\n            }\n        }\n\n        return new Promise((resolve, reject) => {\n            this.animation.onfinish = () => {\n                this._isOpen = !this._isOpen;\n                resolve();\n            };\n        });\n    }\n\n    /**\n     * Opens the sliding container by performing necessary preparatory and transitional operations.\n     * @param {Event} e The event that triggered the open operation.\n     * @returns {Promise<void>} A promise that resolves when the open operation, including animations and subsequent handlers, is complete.\n     */\n    async open(e) {\n        await Promise.resolve(this.beforeOpen(e)).then(async () => {\n            if (!this._isOpen) {\n                this.classList.add('open');\n\n                event.dispatchCustomEvent(this, 'wje-sliding-container:beforeOpen')\n\n                this.checkForVariant(this.variant);\n\n                await this.doAnimateTransition();\n                this.syncAria();\n\n                await Promise.resolve(this.afterOpen(e)).then(() => {\n                    event.dispatchCustomEvent(this, 'wje-sliding-container:open')\n                });\n            }\n        });\n    }\n\n    /**\n     * Closes the sliding container and performs associated operations such as animations and event dispatches.\n     * @param {Event} e The event object associated with the close action.\n     * @returns {Promise<void>} A promise that resolves when the closing operation, including animations and child element removal, is completed.\n     */\n    async close(e) {\n        await Promise.resolve(this.beforeClose(e)).then(async () => {\n            if (this._isOpen) {\n                this.classList.remove('open');\n\n                event.dispatchCustomEvent(this, 'wje-sliding-container:beforeClose');\n\n                await this.doAnimateTransition();\n                this.syncAria();\n\n                await Promise.resolve(this.afterClose(e)).then(() => {\n                    if (this.removeChildAfterClose) {\n                        this.childNodes.forEach((child) => {\n                            child.remove();\n                        });\n                    }\n\n                    event.dispatchCustomEvent(this, 'wje-sliding-container:afterClose');\n                });\n            }\n        });\n    }\n\n    /**\n     * Toggles the state between open and closed.\n     * @param {Event} e The event object triggering the toggle.\n     * @returns {Promise<void>} A promise that resolves once the toggle operation (open or close) is complete.\n     */\n    async toggle(e) {\n        if (this._isOpen) {\n            await this.close(event);\n        } else {\n            await this.open(event);\n        }\n    }\n\n    /**\n     * Cleans up resources associated with the component by disconnecting\n     * the resize observer and setting it to null.\n     * @returns {void} Does not return a value.\n     */\n    componentCleanup() {\n        this._resizeObserver?.disconnect();\n        this._resizeObserver = null;\n    }\n}\n","import SlidingContainer from './sliding-container.element.js';\n\nexport default SlidingContainer;\n\nSlidingContainer.define('wje-sliding-container', SlidingContainer);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"wje-sliding-container.js","sources":["../packages/wje-sliding-container/sliding-container.element.js","../packages/wje-sliding-container/sliding-container.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\nlet documentScrollLocks = 0;\nlet documentScrollState = null;\n\n/**\n * @summary SlidingContainer is a custom web component that extends WJElement.\n * @documentation https://elements.webjet.sk/components/SlidingContainer\n * @status stable\n * @augments WJElement\n * @csspart backdrop - Styles the mobile bottom sheet backdrop.\n * @csspart sliding-container - Styles the native sliding panel.\n * @csspart close-button - Styles the generated close button.\n * @csspart sheet-handle-area - Styles the draggable resize handle hit area.\n * @csspart sheet-handle - Styles the visible draggable resize handle.\n * @slot - The default slot for the SlidingContainer.\n * @property {string} maxWidth - The maximum width of the SlidingContainer.\n * @property {string} maxHeight - The maximum height of the SlidingContainer.\n * @property {string} trigger - The trigger for the SlidingContainer.\n * @property {string} direction - Specifies the sliding direction of the container (e.g., 'left' or 'right').\n * @property {string} variant - Determines how the SlidingContainer behaves, such as 'over' or 'in-place'.\n * @property {string} screenBreakPoint - The width (in pixels) at which the SlidingContainer switches to the \"over\" variant for smaller screens.\n * @property {boolean} removeChildAfterClose - Removes the child after the SlidingContainer is closed.\n * @property {string} animationDuration - Specifies the duration (in milliseconds) of the sliding animation.\n * @property {string} animationEasing - Specifies the easing function used for the sliding animation (e.g., 'linear', 'ease-in', 'ease-out').\n * @property {boolean} hasOpacity - Sets the opacity of the SlidingContainer.\n * @property {string} mobilePresentation - Enables mobile presentation, for example 'bottom-sheet'.\n * @property {string} mobileBreakPoint - The viewport width where mobile presentation becomes active.\n * @property {boolean} backdropDismiss - Closes the mobile bottom sheet when the backdrop is clicked.\n * @property {boolean} sheetResizable - Enables mobile bottom sheet resizing.\n * @property {string} sheetScope - Defines whether the mobile bottom sheet is scoped to the container or viewport.\n * @property {string} sheetBoundary - CSS selector for the composed ancestor that bounds the mobile bottom sheet.\n * @property {string} sheetHeight - The mobile bottom sheet height after opening.\n * @property {string} sheetMinHeight - The minimum mobile bottom sheet height while resizing.\n * @property {string} sheetMaxHeight - The maximum mobile bottom sheet height while resizing.\n * @attribute {string} mobile-presentation - Enables responsive mobile presentation. Use \"bottom-sheet\".\n * @attribute {string} mobile-break-point - Viewport width where mobile presentation becomes active. Defaults to \"768\".\n * @attribute {boolean} backdrop-dismiss - Closes the mobile bottom sheet when the backdrop is clicked.\n * @attribute {boolean} sheet-resizable - Enables resizing the mobile bottom sheet with a handle.\n * @attribute {string} sheet-scope - Defines whether the sheet is scoped to \"viewport\", \"parent\", or a bounded container.\n * @attribute {string} sheet-boundary - CSS selector for the composed ancestor that bounds the mobile bottom sheet.\n * @attribute {string} sheet-height - The mobile bottom sheet height after opening.\n * @attribute {string} sheet-min-height - The minimum mobile bottom sheet height while resizing.\n * @attribute {string} sheet-max-height - The maximum mobile bottom sheet height while resizing.\n * @cssproperty [--wje-sliding-container-background=var(--wje-background)] - Background of the sliding panel.\n * @cssproperty [--wje-sliding-container-backdrop-background=var(--wje-backdrop)] - Background of the mobile bottom sheet backdrop.\n * @cssproperty [--wje-sliding-container-backdrop-opacity=1] - Backdrop opacity while the mobile bottom sheet is open.\n * @cssproperty [--wje-sliding-container-box-shadow=var(--wje-sliding-container-shadow)] - Shadow of the mobile bottom sheet panel.\n * @cssproperty [--wje-sliding-container-sheet-border-radius=var(--wje-sliding-container-border-radius) var(--wje-sliding-container-border-radius) 0 0] - Border radius of the mobile bottom sheet panel.\n * @cssproperty [--wje-sliding-container-sheet-handle-area-height=24px] - Height of the resize handle hit area.\n * @cssproperty [--wje-sliding-container-sheet-handle-width=36px] - Width of the visible resize handle.\n * @cssproperty [--wje-sliding-container-sheet-handle-height=2px] - Height of the visible resize handle.\n * @cssproperty [--wje-sliding-container-sheet-handle-background=var(--wje-border-color)] - Background of the visible resize handle.\n * @cssproperty [--wje-sliding-container-sheet-handle-radius=999px] - Border radius of the visible resize handle.\n * @tag wje-sliding-container\n * @example\n * <wje-sliding-container trigger=\"test-resize-container-event-right\" id=\"left-in-place\" direction=\"left\" max-width=\"100px\" max-height=\"100%\">\n *    <wje-card>\n *       <wje-card-header>\n *        <wje-card-subtitle>CONTENT Subtitle</wje-card-subtitle>\n *       <wje-card-title>CONTENT Title</wje-card-title>\n *      </wje-card-header>\n *     <wje-card-content>\n *        CONTENT Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n *    </wje-card-content>\n * </wje-card>\n * </wje-sliding-container>\n */\nexport default class SlidingContainer extends WJElement {\n    /**\n     * Creates an instance of SlidingContainer.\n     * @class\n     */\n    constructor() {\n        super();\n\n        this._isOpen = false;\n        this._lastCaller = null;\n        this._sheetDrag = null;\n        this._sheetIgnoreDismissUntil = 0;\n        this._sheetBackdropGesture = null;\n        this._sheetBackdropHandledUntil = 0;\n        this._hasLockedDocumentScroll = false;\n        this._bottomSheetScopeFrame = null;\n\n        this._resizeObserver = new ResizeObserver((entries) => {\n            for (let entry of entries) {\n                if (entry.contentBoxSize) {\n                    if (this.drawingStatus < 3) return;\n\n                    if (this.isBottomSheet()) {\n                        this.checkForVariant(this.variant);\n                    } else if (this.screenBreakPoint && window.innerWidth <= this.screenBreakPoint) {\n                        if (this.variant !== 'over') {\n                            this.variant = 'over';\n                        } else {\n                            this.checkForVariant(this.variant);\n                        }\n                    } else {\n                        if (this.variant !== 'in-place') {\n                            this.variant = 'in-place';\n                        } else {\n                            this.checkForVariant(this.variant);\n                        }\n                    }\n                }\n            }\n        });\n\n        this._resizeObserver.observe(document.documentElement);\n    }\n\n    /**\n     * Sets the maximum width of an element by updating the 'max-width' attribute.\n     * @param {string} value The maximum width value to be set (e.g., '100px', '50%', etc.).\n     */\n    set maxWidth(value) {\n        this.setAttribute('max-width', value);\n    }\n\n    /**\n     * Gets the maximum width value of the element.\n     * Retrieves the value of the 'max-width' attribute. If the attribute is not set, it defaults to 'auto'.\n     * @returns {string} The maximum width value of the element or 'auto' if the attribute is not defined.\n     */\n    get maxWidth() {\n        return this.getAttribute('max-width') ?? 'auto';\n    }\n\n    /**\n     * Sets the maximum height for the element.\n     * @param {string} value The maximum height value to be applied to the element. This can include units such as \"px\", \"em\", \"%\", etc.\n     */\n    set maxHeight(value) {\n        this.setAttribute('max-height', value);\n    }\n\n    /**\n     * Retrieves the maximum height value of the element, or returns 'auto' if not set.\n     * @returns {string} The maximum height value or 'auto' if the attribute is not specified.\n     */\n    get maxHeight() {\n        return this.getAttribute('max-height') ?? 'auto';\n    }\n\n    /**\n     * Sets the 'trigger' attribute for the element.\n     * @param {string} value The value to set for the 'trigger' attribute.\n     */\n    set trigger(value) {\n        this.setAttribute('trigger', value);\n    }\n\n    /**\n     * Retrieves the value of the 'trigger' attribute. If the attribute is not set, it defaults to 'sliding-container'.\n     * @returns {string} The value of the 'trigger' attribute or the default value 'sliding-container' if not defined.\n     */\n    get trigger() {\n        return this.getAttribute('trigger') ?? 'sliding-container';\n    }\n\n    /**\n     * Sets the direction attribute for the element.\n     * @param {string} value The direction value to be assigned. Possible values are typically 'ltr' (left-to-right), 'rtl' (right-to-left), or 'auto'.\n     */\n    set direction(value) {\n        this.setAttribute('direction', value);\n    }\n\n    /**\n     * Retrieves the direction attribute of the instance.\n     * If the direction attribute is not set, it defaults to 'right'.\n     * @returns {string} The value of the direction attribute or 'right' if not set.\n     */\n    get direction() {\n        return this.getAttribute('direction') ?? 'right';\n    }\n\n    /**\n     * Sets the value of the `remove-child-after-close` attribute.\n     * This attribute determines if a child element should be removed after a close operation.\n     * @param {boolean|string} value The value to set for the `remove-child-after-close` attribute. The value can be a boolean or a string representation of a boolean.\n     */\n    set removeChildAfterClose(value) {\n        this.setAttribute('remove-child-after-close', value);\n    }\n\n    /**\n     * Gets the value indicating whether the child element should be removed after closing.\n     *\n     * This property checks the presence of the 'remove-child-after-close' attribute on the element.\n     * Returns `false` if the attribute does not exist.\n     * @returns {boolean} True if the 'remove-child-after-close' attribute is present, otherwise false.\n     */\n    get removeChildAfterClose() {\n        return this.hasAttribute('remove-child-after-close') ?? false;\n    }\n\n    /**\n     * Sets the 'variant' attribute to the specified value.\n     * @param {string} value The value to set for the 'variant' attribute.\n     */\n    set variant(value) {\n        this.setAttribute('variant', value);\n    }\n\n    /**\n     * Retrieves the value of the \"variant\" attribute. If the attribute is not set,\n     * it returns the default value 'in-place'.\n     * @returns {string} The variant value or the default value 'in-place'.\n     */\n    get variant() {\n        return this.getAttribute('variant') ?? 'in-place';\n    }\n\n    /**\n     * Retrieves the value of the 'screen-break-point' attribute.\n     * @returns {string} The value of the 'screen-break-point' attribute.\n     */\n    get screenBreakPoint() {\n        return this.getAttribute('screen-break-point');\n    }\n\n    /**\n     * Sets the screen break point value to determine responsive behavior.\n     * @param {string} value The value to set as the screen break point.\n     */\n    set screenBreakPoint(value) {\n        this.setAttribute('screen-break-point', value);\n    }\n\n    /**\n     * Sets mobile presentation mode.\n     * @param {string} value The mobile presentation mode.\n     */\n    set mobilePresentation(value) {\n        this.setAttribute('mobile-presentation', value);\n    }\n\n    /**\n     * Gets mobile presentation mode.\n     * @returns {string|null} The mobile presentation mode.\n     */\n    get mobilePresentation() {\n        return this.getAttribute('mobile-presentation');\n    }\n\n    /**\n     * Sets the breakpoint for mobile presentation.\n     * @param {string} value The mobile breakpoint.\n     */\n    set mobileBreakPoint(value) {\n        this.setAttribute('mobile-break-point', value);\n    }\n\n    /**\n     * Gets the breakpoint for mobile presentation.\n     * @returns {string} The mobile breakpoint.\n     */\n    get mobileBreakPoint() {\n        return this.getAttribute('mobile-break-point') || '768';\n    }\n\n    /**\n     * Sets the duration of the animation by updating the `animation-duration` attribute.\n     * @param {string} value The duration value for the animation, specified in a format\n     * such as seconds (e.g., \"2s\") or milliseconds (e.g., \"200ms\").\n     */\n    set animationDuration(value) {\n        this.setAttribute('animation-duration', value);\n    }\n\n    /**\n     * Gets the animation duration for an element.\n     * It retrieves the value of the 'animation-duration' attribute if present; otherwise, it defaults to '500'.\n     * @returns {string} The value of the animation duration, either from the attribute or the default '500'.\n     */\n    get animationDuration() {\n        return this.getAttribute('animation-duration') ?? '500';\n    }\n\n    /**\n     * Sets the easing function for the animation.\n     * @param {string} value The easing function to use for the animation. This can be any valid CSS timing function such as \"ease\", \"linear\", \"ease-in\", \"ease-out\", etc.\n     */\n    set animationEasing(value) {\n        this.setAttribute('animation-easing', value);\n    }\n\n    /**\n     * Retrieves the easing function for the animation.\n     * @returns {string} The value of the 'animation-easing' attribute if set, otherwise defaults to 'linear'.\n     */\n    get animationEasing() {\n        return this.getAttribute('animation-easing') ?? 'linear';\n    }\n\n    /**\n     * Determines if the element has an 'has-opacity' attribute.\n     * @returns {boolean} True if the element has the 'has-opacity' attribute, otherwise false.\n     */\n    get hasOpacity() {\n        return this.hasAttribute('has-opacity') ?? false;\n    }\n\n    /**\n     * Determines if the bottom sheet should close when the backdrop is clicked.\n     * @returns {boolean} True if backdrop dismiss is enabled.\n     */\n    get backdropDismiss() {\n        return this.hasAttribute('backdrop-dismiss') ?? false;\n    }\n\n    /**\n     * Enables resizing for the mobile bottom sheet.\n     * @returns {boolean} True if the sheet can be resized.\n     */\n    get sheetResizable() {\n        return this.hasAttribute('sheet-resizable') ?? false;\n    }\n\n    /**\n     * Sets resizing for the mobile bottom sheet.\n     * @param {boolean|string} value The value to set.\n     */\n    set sheetResizable(value) {\n        this.setAttribute('sheet-resizable', value);\n    }\n\n    /**\n     * Gets the mobile bottom sheet scope.\n     * @returns {string} Either 'viewport', 'container', or 'parent'.\n     */\n    get sheetScope() {\n        return this.getAttribute('sheet-scope') || 'viewport';\n    }\n\n    /**\n     * Sets the mobile bottom sheet scope.\n     * @param {string} value The new boundary mode for the mobile sheet.\n     */\n    set sheetScope(value) {\n        this.setAttribute('sheet-scope', value);\n    }\n\n    /**\n     * Gets the selector used for container-scoped mobile bottom sheets.\n     * @returns {string|null} A CSS selector used to find the composed boundary ancestor.\n     */\n    get sheetBoundary() {\n        return this.getAttribute('sheet-boundary');\n    }\n\n    /**\n     * Sets the selector used for container-scoped mobile bottom sheets.\n     * @param {string} value Selector for the boundary element.\n     */\n    set sheetBoundary(value) {\n        this.setAttribute('sheet-boundary', value);\n    }\n\n    /**\n     * Gets the mobile bottom sheet opening height.\n     * @returns {string|null} The opening height.\n     */\n    get sheetHeight() {\n        return this.getAttribute('sheet-height');\n    }\n\n    /**\n     * Sets the mobile bottom sheet opening height.\n     * @param {string} value The opening height.\n     */\n    set sheetHeight(value) {\n        this.setAttribute('sheet-height', value);\n    }\n\n    /**\n     * Gets the minimum mobile bottom sheet height while resizing.\n     * @returns {string|null} The minimum height.\n     */\n    get sheetMinHeight() {\n        return this.getAttribute('sheet-min-height');\n    }\n\n    /**\n     * Sets the minimum mobile bottom sheet height while resizing.\n     * @param {string} value The minimum height.\n     */\n    set sheetMinHeight(value) {\n        this.setAttribute('sheet-min-height', value);\n    }\n\n    /**\n     * Gets the maximum mobile bottom sheet height while resizing.\n     * @returns {string|null} The maximum height.\n     */\n    get sheetMaxHeight() {\n        return this.getAttribute('sheet-max-height');\n    }\n\n    /**\n     * Sets the maximum mobile bottom sheet height while resizing.\n     * @param {string} value The maximum height.\n     */\n    set sheetMaxHeight(value) {\n        this.setAttribute('sheet-max-height', value);\n    }\n\n    /**\n     * Sets the value of the 'add-to-height' attribute.\n     * This attribute is used to modify or adjust the height dynamically.\n     * @param {string} value The value to be assigned to the 'add-to-height' attribute.\n     */\n    set addToHeight(value) {\n        this.setAttribute('add-to-height', value);\n    }\n\n    /**\n     * Retrieves the value of the 'add-to-height' attribute from the element.\n     * If the attribute is not set, it defaults to '0'.\n     * @returns {string} The value of the 'add-to-height' attribute or '0' if the attribute is not present.\n     */\n    get addToHeight() {\n        return this.getAttribute('add-to-height') ?? '0';\n    }\n\n    /**\n     * Determines whether the current state is open.\n     * @returns {boolean} True if the state is open, otherwise false.\n     */\n    get isOpen() {\n        return this._isOpen;\n    }\n\n    className = 'SlidingContainer';\n\n    /**\n     * Returns the observed attributes for the component.\n     * @returns {string[]}\n     */\n    static get observedAttributes() {\n        return ['max-width', 'max-height', 'trigger', 'direction', 'variant', 'screen-break-point', 'remove-child-after-close', 'animation-duration', 'animation-easing', 'has-opacity', 'mobile-presentation', 'mobile-break-point', 'backdrop-dismiss', 'sheet-resizable', 'sheet-scope', 'sheet-boundary', 'sheet-height', 'sheet-min-height', 'sheet-max-height'];\n    }\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        this.syncAria();\n    }\n\n    /**\n     * Executes before drawing the element.\n     */\n    beforeDraw() {\n        this.animation?.cancel();\n        this.nativeAnimation?.cancel();\n        this.endSheetDrag();\n\n        document.removeEventListener(this.trigger, this.triggerEvent);\n    }\n\n    /**\n     * Draws the component.\n     * @param {object} context The context for drawing.\n     * @param {object} store The store for drawing.\n     * @param {object} params The parameters for drawing.\n     * @returns {DocumentFragment}\n     */\n    draw(context, store, params) {\n        let fragment = document.createDocumentFragment();\n        const isBottomSheet = this.isBottomSheet();\n\n        let backdrop = document.createElement('div');\n        backdrop.setAttribute('part', 'backdrop');\n        backdrop.classList.add('sliding-container-backdrop');\n        if (this._isOpen && isBottomSheet) {\n            backdrop.style.opacity = 'var(--wje-sliding-container-backdrop-opacity, 1)';\n        }\n        backdrop.addEventListener('wheel', this.preventBottomSheetScroll, { passive: false });\n        backdrop.addEventListener('touchmove', this.preventBottomSheetScroll, { passive: false });\n\n        if (this.backdropDismiss) {\n            backdrop.addEventListener('pointerdown', this.handleBackdropPointerStart);\n            backdrop.addEventListener('pointermove', this.handleBackdropPointerMove);\n            backdrop.addEventListener('pointerup', this.handleBackdropPointerEnd);\n            backdrop.addEventListener('pointercancel', this.handleBackdropPointerCancel);\n            backdrop.addEventListener('click', (e) => {\n                if (this.isEventInsideSheet(e) || Date.now() < this._sheetIgnoreDismissUntil || Date.now() < this._sheetBackdropHandledUntil) {\n                    e.preventDefault();\n                    e.stopPropagation();\n                    return;\n                }\n\n                if (e.target === backdrop) {\n                    this.close(e);\n                }\n            });\n        }\n\n        let wrapperDiv = document.createElement('div');\n        wrapperDiv.classList.add('sliding-container-wrapper');\n\n        let transparentDiv = document.createElement('div');\n        transparentDiv.classList.add('sliding-container-transparent');\n\n        if (this._isOpen && !isBottomSheet) {\n            transparentDiv.style.width = this.maxWidth;\n        }\n\n        let native = document.createElement('div');\n        native.setAttribute('part', 'sliding-container');\n        native.classList.add('native-sliding-container');\n        native.style.width = isBottomSheet ? '100%' : 0;\n        if (this.hasOpacity) {\n            native.style.opacity = 0;\n        }\n\n        if (this._isOpen) {\n            native.style.width = isBottomSheet ? '100%' : this.maxWidth;\n            if (isBottomSheet) {\n                native.style.transform = 'translateY(0)';\n            }\n            if (this.hasOpacity) {\n                native.style.opacity = 1;\n            }\n        } else if (isBottomSheet) {\n            native.style.transform = 'translateY(100%)';\n        }\n\n        if (isBottomSheet) {\n            native.style.left = 0;\n            native.style.right = 0;\n            native.style.bottom = 0;\n            native.style.maxHeight = this.maxHeight;\n        } else if (this.direction === 'right') {\n            native.style.right = 0;\n        } else {\n            native.style.left = 0;\n        }\n\n        const nativeInner = document.createElement('div');\n        nativeInner.classList.add('native-sliding-container-inner');\n        nativeInner.style.width = isBottomSheet ? '100%' : this.maxWidth;\n        if (isBottomSheet) {\n            nativeInner.style.maxHeight = this.maxHeight;\n        }\n\n        let slot = document.createElement('slot');\n        this.sheetHandleArea = null;\n\n        // APPEND\n        nativeInner.append(slot);\n        nativeInner.append(this.htmlCloseButton());\n\n        if (this.sheetResizable) {\n            native.append(this.htmlSheetHandle());\n        }\n        native.append(nativeInner);\n\n        wrapperDiv.append(transparentDiv);\n        wrapperDiv.append(native);\n\n        fragment.append(backdrop);\n        fragment.append(wrapperDiv);\n\n        this.backdropElement = backdrop;\n        this.transparentDiv = transparentDiv;\n        this.wrapperDiv = wrapperDiv;\n        this.nativeElement = native;\n        this.nativeInner = nativeInner;\n\n        return fragment;\n    }\n\n    /**\n     * Performs actions after the element is drawn on the screen.\n     * Attaches an event listener to the document based on the specified trigger.\n     * Sets the variant to \"over\" if the document width is smaller than the screen break point.\n     * Calls the checkForVariant method with the current variant.\n     */\n    afterDraw() {\n        this.syncAria();\n        document.addEventListener(this.trigger, this.triggerEvent);\n\n        // if document width is on small screen set variant to over\n        if (!this.isBottomSheet() && this.screenBreakPoint && window.innerWidth <= this.screenBreakPoint) {\n            this.variant = 'over';\n        }\n\n        this.checkForVariant(this.variant);\n    }\n\n    /**\n     * Returns whether the mobile bottom sheet presentation is active.\n     * @returns {boolean}\n     */\n    isBottomSheet() {\n        return this.mobilePresentation === 'bottom-sheet' && window.innerWidth <= +this.mobileBreakPoint;\n    }\n\n    /**\n     * Sync ARIA attributes on host.\n     */\n    syncAria() {\n        if (!this.hasAttribute('role')) {\n            this.setAriaState({ role: 'region' });\n        }\n\n        this.setAriaState({ hidden: !this.isOpen });\n\n        const ariaLabel = this.getAttribute('aria-label');\n        const label = this.getAttribute('label');\n        if (!ariaLabel && label) {\n            this.setAriaState({ label });\n        }\n    }\n\n    /**\n     * Creates and returns a styled close button element with an icon,\n     * including an event listener to trigger the close method.\n     * @returns {HTMLElement} The close button element configured with styles, an icon, and event listener.\n     */\n    htmlCloseButton() {\n        let closeButton = document.createElement('wje-button');\n        closeButton.setAttribute('part', 'close-button');\n        closeButton.classList.add('close-button');\n\n        let icon = document.createElement('wje-icon');\n        icon.setAttribute('slot', 'icon-only');\n        icon.setAttribute('name', 'x');\n\n        closeButton.append(icon);\n\n        event.addListener(closeButton, 'wje-button:click', null,(e) => {\n            this.close();\n        });\n\n        return closeButton;\n    }\n\n    /**\n     * Creates the mobile bottom sheet resize handle.\n     * @returns {HTMLElement} The resize handle element.\n     */\n    htmlSheetHandle() {\n        const handleArea = document.createElement('div');\n        handleArea.setAttribute('part', 'sheet-handle-area');\n        handleArea.setAttribute('role', 'separator');\n        handleArea.setAttribute('aria-orientation', 'horizontal');\n        handleArea.classList.add('sliding-container-sheet-handle-area');\n\n        const handle = document.createElement('div');\n        handle.setAttribute('part', 'sheet-handle');\n        handle.classList.add('sliding-container-sheet-handle');\n\n        handleArea.append(handle);\n        handleArea.addEventListener('pointerdown', this.handleSheetDragStart, { capture: true });\n        handleArea.addEventListener('touchstart', this.handleSheetTouchStart, { capture: true, passive: false });\n        handleArea.addEventListener('click', this.stopSheetHandleEvent, { capture: true });\n        handleArea.addEventListener('mousedown', this.stopSheetHandleEvent, { capture: true });\n        handleArea.addEventListener('mouseup', this.stopSheetHandleEvent, { capture: true });\n\n        this.sheetHandleArea = handleArea;\n\n        return handleArea;\n    }\n\n    /**\n     * Retrieves the parent element of the current element.\n     * If the parent element is not found, it attempts to find the root host element.\n     * @returns {Element|null} The parent element or the root host element if no parent exists. Returns null if neither is found.\n     */\n    getParentElement() {\n        let parentElement = this.parentElement;\n\n        if (!parentElement) {\n            parentElement = this.getRootNode().host;\n        }\n\n        return parentElement;\n    }\n\n    /**\n     * Finds the closest element across shadow DOM boundaries.\n     * @param {string} selector The selector to match.\n     * @returns {Element|null} The matched composed ancestor.\n     */\n    getClosestComposedElement(selector) {\n        let currentElement = this;\n\n        while (currentElement) {\n            let matches = false;\n\n            try {\n                matches = currentElement instanceof Element && currentElement.matches(selector);\n            } catch {\n                return null;\n            }\n\n            if (matches) {\n                return currentElement;\n            }\n\n            if (currentElement.parentElement) {\n                currentElement = currentElement.parentElement;\n                continue;\n            }\n\n            const root = currentElement.getRootNode?.();\n            currentElement = root instanceof ShadowRoot ? root.host : null;\n        }\n\n        return null;\n    }\n\n    /**\n     * Returns the viewport frame.\n     * @returns {{top: number, left: number, right: number, bottom: number, width: number, height: number}}\n     */\n    getViewportFrame() {\n        return {\n            top: 0,\n            left: 0,\n            right: window.innerWidth,\n            bottom: window.innerHeight,\n            width: window.innerWidth,\n            height: window.innerHeight,\n        };\n    }\n\n    /**\n     * Returns the element that bounds the mobile bottom sheet.\n     * @returns {Element|null} The scope element, or null for viewport scope.\n     */\n    getBottomSheetScopeElement() {\n        if (this.sheetScope === 'viewport') return null;\n        if (this.sheetScope === 'parent') return this.getParentElement();\n        if (this.sheetBoundary) return this.getClosestComposedElement(this.sheetBoundary);\n\n        return this.getParentElement();\n    }\n\n    /**\n     * Returns the frame used by the mobile bottom sheet.\n     * @returns {{top: number, left: number, right: number, bottom: number, width: number, height: number}}\n     */\n    getBottomSheetScopeFrame() {\n        const scopeElement = this.getBottomSheetScopeElement();\n        if (!scopeElement) return this.getViewportFrame();\n\n        const rect = scopeElement.getBoundingClientRect();\n        const top = Math.max(rect.top, 0);\n        const left = Math.max(rect.left, 0);\n        const right = Math.min(rect.right, window.innerWidth);\n        const bottom = Math.min(rect.bottom, window.innerHeight);\n        const width = right - left;\n        const height = bottom - top;\n\n        if (width <= 0 || height <= 0) {\n            return this.getViewportFrame();\n        }\n\n        return {\n            top,\n            left,\n            right,\n            bottom,\n            width,\n            height,\n        };\n    }\n\n    /**\n     * Applies a fixed frame to a bottom sheet layer.\n     * @param {HTMLElement|SlidingContainer} element The element to update.\n     * @param {object} frame The frame to apply.\n     */\n    setBottomSheetLayerFrame(element, frame) {\n        element.style.top = frame.top + 'px';\n        element.style.left = frame.left + 'px';\n        element.style.right = 'auto';\n        element.style.bottom = 'auto';\n        element.style.width = frame.width + 'px';\n        element.style.height = frame.height + 'px';\n    }\n\n    /**\n     * Removes fixed frame styles from a bottom sheet layer.\n     * @param {HTMLElement|SlidingContainer} element The element to reset.\n     */\n    resetBottomSheetLayerFrame(element) {\n        element?.style.removeProperty('top');\n        element?.style.removeProperty('left');\n        element?.style.removeProperty('right');\n        element?.style.removeProperty('bottom');\n        element?.style.removeProperty('width');\n        element?.style.removeProperty('height');\n    }\n\n    /**\n     * Adjusts the position and dimensions of the current element based on the specified variant.\n     *\n     * The method handles modifications to the element's positioning style, aligns it relative to its parent,\n     * and manages alignment to its siblings based on the specified direction.\n     * @param {string} variant The variant to determine how the element should be updated. For example, when set to 'over', specific adjustments to the position and size are performed.\n     * @returns {void} No value is returned, the method modifies the element's style properties directly.\n     */\n    checkForVariant(variant) {\n        if (this.isBottomSheet()) {\n            this.setBottomSheetVariant();\n            return;\n        }\n\n        this.resetBottomSheetVariant();\n\n        if (variant === 'over') {\n            this.style.position = 'fixed';\n            let computentStyleOfParent = window.getComputedStyle(this.getParentElement());\n            let parentElementBoundingbox = this.getParentElement().getBoundingClientRect();\n            let heightOfParrentElement = parseFloat(computentStyleOfParent.height);\n\n            let topOfParrentElement = parseFloat(computentStyleOfParent.top);\n\n            this.style.height = heightOfParrentElement + +this.addToHeight + 'px';\n            this.wrapperDiv.style.height = heightOfParrentElement + +this.addToHeight + 'px';\n            this.style.top = topOfParrentElement + 'px';\n\n            const leftSibling = this.previousElementSibling;\n            const rightSibling = this.nextElementSibling;\n            const leftSiblingBoundingbox = leftSibling?.getBoundingClientRect();\n            const rightSiblingBoundingbox = rightSibling?.getBoundingClientRect();\n\n            if (this.direction === 'right') {\n                // attach to left sibling\n                if (leftSiblingBoundingbox) {\n                    this.style.left = leftSiblingBoundingbox.left + leftSiblingBoundingbox.width + 'px';\n                } else {\n                    this.style.left = parentElementBoundingbox.left + 'px';\n                }\n            } else {\n                // attach to right sibling\n                if (rightSiblingBoundingbox) {\n                    this.style.right = window.innerWidth - rightSiblingBoundingbox.left + 'px';\n                } else {\n                    this.style.right =\n                        window.innerWidth - (parentElementBoundingbox.left + parentElementBoundingbox.width) + 'px';\n                }\n            }\n        }\n    }\n\n    /**\n     * Applies the mobile bottom sheet layout.\n     */\n    setBottomSheetVariant() {\n        const scopeFrame = this.getBottomSheetScopeFrame();\n        this._bottomSheetScopeFrame = scopeFrame;\n\n        this.classList.add('bottom-sheet');\n        this.style.position = 'fixed';\n        this.setBottomSheetLayerFrame(this, scopeFrame);\n        this.setBottomSheetLayerFrame(this.backdropElement, scopeFrame);\n        this.setBottomSheetLayerFrame(this.wrapperDiv, scopeFrame);\n\n        this.wrapperDiv.style.height = '100%';\n        this.transparentDiv.style.width = 0;\n\n        this.nativeElement.style.left = scopeFrame.left + 'px';\n        this.nativeElement.style.right = 'auto';\n        this.nativeElement.style.bottom = window.innerHeight - scopeFrame.bottom + 'px';\n        this.nativeElement.style.top = 'auto';\n        this.nativeElement.style.width = scopeFrame.width + 'px';\n        if (this._sheetDrag) {\n            this.nativeElement.style.maxHeight = this.getSheetMaxHeightInPixels() + 'px';\n        } else {\n            this.setSheetHeight();\n        }\n        this.setBottomSheetVisualState(this.classList.contains('open'));\n\n        this.nativeInner.style.width = '100%';\n        this.nativeInner.style.maxHeight = this.nativeElement.style.maxHeight;\n    }\n\n    /**\n     * Removes layout styles managed by the mobile bottom sheet mode.\n     */\n    resetBottomSheetVariant() {\n        if (!this.classList.contains('bottom-sheet')) return;\n\n        this.classList.remove('bottom-sheet');\n        this.style.removeProperty('position');\n        this.resetBottomSheetLayerFrame(this);\n\n        this.resetBottomSheetLayerFrame(this.backdropElement);\n        this.resetBottomSheetLayerFrame(this.wrapperDiv);\n        if (this.transparentDiv) {\n            this.transparentDiv.style.width = this._isOpen ? this.maxWidth : 0;\n        }\n        this.nativeElement?.style.removeProperty('left');\n        this.nativeElement?.style.removeProperty('right');\n        this.nativeElement?.style.removeProperty('bottom');\n        this.nativeElement?.style.removeProperty('top');\n        this.nativeElement?.style.removeProperty('height');\n        this.nativeElement?.style.removeProperty('max-height');\n        this.nativeElement?.style.removeProperty('transform');\n        if (this.nativeElement) {\n            if (this.direction === 'right') {\n                this.nativeElement.style.right = 0;\n            } else {\n                this.nativeElement.style.left = 0;\n            }\n            this.nativeElement.style.width = this._isOpen ? this.maxWidth : 0;\n        }\n        this.nativeInner?.style.removeProperty('max-height');\n        if (this.nativeInner) {\n            this.nativeInner.style.width = this.maxWidth;\n        }\n        this.backdropElement?.style.removeProperty('opacity');\n        this._bottomSheetScopeFrame = null;\n        this.endSheetDrag();\n        this.unlockDocumentScroll();\n    }\n\n    /**\n     * Applies the current visual open or closed state to the mobile bottom sheet.\n     * @param {boolean} isOpen True when the sheet should be visible.\n     */\n    setBottomSheetVisualState(isOpen) {\n        this.nativeElement.style.transform = isOpen ? 'translateY(0)' : 'translateY(100%)';\n\n        if (this.hasOpacity) {\n            this.nativeElement.style.opacity = isOpen ? 1 : 0;\n        }\n\n        this.backdropElement.style.opacity = isOpen ? 'var(--wje-sliding-container-backdrop-opacity, 1)' : 0;\n    }\n\n    /**\n     * Gets the CSS height limit used for the mobile bottom sheet.\n     * @returns {string} The CSS max height.\n     */\n    getSheetMaxHeight() {\n        return this.sheetMaxHeight || this.maxHeight;\n    }\n\n    /**\n     * Applies the configured bottom sheet opening height.\n     */\n    setSheetHeight() {\n        const maxHeightInPixels = this.getSheetMaxHeightInPixels();\n\n        this.nativeElement.style.maxHeight = maxHeightInPixels + 'px';\n\n        if (!this.sheetHeight) {\n            this.nativeElement.style.removeProperty('height');\n            return;\n        }\n\n        const minHeight = Math.min(this.getSheetMinHeightInPixels(), maxHeightInPixels);\n        const height = this.resolveCssHeight(this.sheetHeight, maxHeightInPixels);\n        const clampedHeight = this.clamp(height, minHeight, maxHeightInPixels);\n\n        this.nativeElement.style.height = clampedHeight + 'px';\n    }\n\n    /**\n     * Resolves the sheet minimum height in pixels.\n     * @returns {number} The minimum height.\n     */\n    getSheetMinHeightInPixels() {\n        const availableHeight = this.getBottomSheetAvailableHeight();\n\n        return Math.min(\n            this.resolveCssHeight(this.sheetMinHeight || '30vh', availableHeight * 0.3),\n            availableHeight\n        );\n    }\n\n    /**\n     * Resolves the sheet maximum height in pixels.\n     * @returns {number} The maximum height.\n     */\n    getSheetMaxHeightInPixels() {\n        const availableHeight = this.getBottomSheetAvailableHeight();\n\n        return Math.min(\n            this.resolveCssHeight(this.getSheetMaxHeight(), availableHeight * 0.9),\n            availableHeight\n        );\n    }\n\n    /**\n     * Returns available height for the bottom sheet scope.\n     * @returns {number} Pixel height that can be used inside the current sheet frame.\n     */\n    getBottomSheetAvailableHeight() {\n        return this._bottomSheetScopeFrame?.height || this.getBottomSheetScopeFrame().height || window.innerHeight;\n    }\n\n    /**\n     * Resolves a CSS height value against the viewport.\n     * @param {string} value The configured sheet height.\n     * @param {number} fallback The fallback height in pixels.\n     * @returns {number} The resolved height.\n     */\n    resolveCssHeight(value, fallback) {\n        if (!value || value === 'auto') return fallback;\n\n        const normalizedValue = `${value}`.trim();\n        const parsedValue = Number.parseFloat(normalizedValue);\n\n        if (Number.isNaN(parsedValue)) return fallback;\n        if (normalizedValue.endsWith('px')) return parsedValue;\n        if (normalizedValue.endsWith('vh')) return window.innerHeight * parsedValue / 100;\n        if (normalizedValue.endsWith('vw')) return window.innerWidth * parsedValue / 100;\n        if (normalizedValue.endsWith('%')) return window.innerHeight * parsedValue / 100;\n        if (/^-?\\d+(\\.\\d+)?$/.test(normalizedValue)) return parsedValue;\n\n        return fallback;\n    }\n\n    /**\n     * Clamps a number between min and max.\n     * @param {number} value The measured height.\n     * @param {number} min The minimum.\n     * @param {number} max The maximum.\n     * @returns {number} The clamped value.\n     */\n    clamp(value, min, max) {\n        return Math.min(Math.max(value, min), max);\n    }\n\n    /**\n     * Stops a handle interaction from dismissing the bottom sheet.\n     * @param {Event} e The interaction emitted by the resize handle.\n     */\n    stopSheetHandleEvent = (e) => {\n        if (!this.isBottomSheet()) return;\n\n        this._sheetIgnoreDismissUntil = Date.now() + 500;\n        e.preventDefault();\n        e.stopPropagation();\n        e.stopImmediatePropagation?.();\n    };\n\n    /**\n     * Checks whether an event came from the resize handle.\n     * @param {Event} e The event to check.\n     * @returns {boolean} True when the event belongs to the resize handle.\n     */\n    isSheetHandleEvent(e) {\n        if (!e?.composedPath) return false;\n\n        return e.composedPath().includes(this.sheetHandleArea);\n    }\n\n    /**\n     * Checks whether an event happened inside the visible bottom sheet.\n     * @param {Event} e The event to check.\n     * @returns {boolean} True when the event coordinates are inside the sheet.\n     */\n    isEventInsideSheet(e) {\n        if (!this.nativeElement || typeof e?.clientX !== 'number' || typeof e?.clientY !== 'number') return false;\n\n        const rect = this.nativeElement.getBoundingClientRect();\n\n        return e.clientX >= rect.left\n            && e.clientX <= rect.right\n            && e.clientY >= rect.top\n            && e.clientY <= rect.bottom;\n    }\n\n    /**\n     * Prevents scroll events from reaching the page behind the bottom sheet.\n     * @param {Event} e The scroll event.\n     */\n    preventBottomSheetScroll = (e) => {\n        if (!this.isBottomSheet() || !this.classList.contains('open')) return;\n\n        e.preventDefault();\n        e.stopPropagation();\n    };\n\n    /**\n     * Prevents the page behind the mobile bottom sheet from scrolling.\n     */\n    lockDocumentScroll() {\n        if (!this.isBottomSheet() || this.sheetScope !== 'viewport' || this._hasLockedDocumentScroll) return;\n\n        if (documentScrollLocks === 0) {\n            documentScrollState = {\n                bodyOverflow: document.body.style.overflow,\n                documentOverflow: document.documentElement.style.overflow,\n                bodyOverscrollBehavior: document.body.style.overscrollBehavior,\n                documentOverscrollBehavior: document.documentElement.style.overscrollBehavior,\n                bodyPosition: document.body.style.position,\n                bodyTop: document.body.style.top,\n                bodyLeft: document.body.style.left,\n                bodyRight: document.body.style.right,\n                bodyWidth: document.body.style.width,\n                scrollX: window.scrollX,\n                scrollY: window.scrollY,\n            };\n\n            document.body.style.overflow = 'hidden';\n            document.documentElement.style.overflow = 'hidden';\n            document.body.style.overscrollBehavior = 'none';\n            document.documentElement.style.overscrollBehavior = 'none';\n            document.body.style.position = 'fixed';\n            document.body.style.top = `-${documentScrollState.scrollY}px`;\n            document.body.style.left = `-${documentScrollState.scrollX}px`;\n            document.body.style.right = '0';\n            document.body.style.width = '100%';\n        }\n\n        documentScrollLocks++;\n        this._hasLockedDocumentScroll = true;\n    }\n\n    /**\n     * Restores page scrolling after the mobile bottom sheet is closed.\n     */\n    unlockDocumentScroll() {\n        if (!this._hasLockedDocumentScroll) return;\n\n        documentScrollLocks = Math.max(documentScrollLocks - 1, 0);\n        this._hasLockedDocumentScroll = false;\n\n        if (documentScrollLocks > 0 || !documentScrollState) return;\n\n        document.body.style.overflow = documentScrollState.bodyOverflow;\n        document.documentElement.style.overflow = documentScrollState.documentOverflow;\n        document.body.style.overscrollBehavior = documentScrollState.bodyOverscrollBehavior;\n        document.documentElement.style.overscrollBehavior = documentScrollState.documentOverscrollBehavior;\n        document.body.style.position = documentScrollState.bodyPosition;\n        document.body.style.top = documentScrollState.bodyTop;\n        document.body.style.left = documentScrollState.bodyLeft;\n        document.body.style.right = documentScrollState.bodyRight;\n        document.body.style.width = documentScrollState.bodyWidth;\n        window.scrollTo(documentScrollState.scrollX, documentScrollState.scrollY);\n        documentScrollState = null;\n    }\n\n    /**\n     * Stores the initial drag state for the mobile bottom sheet.\n     * @param {number|string} pointerId The pointer identifier.\n     * @param {number} startY The starting Y coordinate.\n     */\n    startSheetDrag(pointerId, startY) {\n        if (this.classList.contains('open')) {\n            this.setBottomSheetVisualState(true);\n        }\n\n        this.animation?.cancel();\n        this.nativeAnimation?.cancel();\n        this.animation = null;\n        this.nativeAnimation = null;\n\n        const fallbackHeight = this.resolveCssHeight(this.sheetHeight, window.innerHeight * 0.5);\n        const currentHeight = this.nativeElement.getBoundingClientRect().height || fallbackHeight;\n\n        this._sheetDrag = {\n            pointerId,\n            startY,\n            startHeight: currentHeight,\n            minHeight: this.getSheetMinHeightInPixels(),\n            maxHeight: this.getSheetMaxHeightInPixels(),\n            hasMoved: false,\n        };\n    }\n\n    /**\n     * Applies a new height while the bottom sheet is being dragged.\n     * @param {number} clientY The current Y coordinate.\n     */\n    updateSheetDrag(clientY) {\n        const distance = this._sheetDrag.startY - clientY;\n        if (Math.abs(distance) > 3) {\n            this._sheetDrag.hasMoved = true;\n        }\n\n        const height = this.clamp(\n            this._sheetDrag.startHeight + distance,\n            this._sheetDrag.minHeight,\n            this._sheetDrag.maxHeight\n        );\n\n        this.nativeElement.style.height = height + 'px';\n    }\n\n    /**\n     * Starts mobile bottom sheet resizing.\n     * @param {PointerEvent} e The pointer event.\n     */\n    handleSheetDragStart = (e) => {\n        if (!this.sheetResizable || !this.isBottomSheet()) return;\n\n        e.preventDefault();\n        e.stopPropagation();\n        e.stopImmediatePropagation?.();\n\n        this._sheetIgnoreDismissUntil = Date.now() + 500;\n\n        if (this._sheetDrag) return;\n\n        this.startSheetDrag(e.pointerId, e.clientY);\n\n        try {\n            this.sheetHandleArea?.setPointerCapture(e.pointerId);\n        } catch {\n            // Synthetic pointer events in tests may not own a pointer capture.\n        }\n\n        window.addEventListener('pointermove', this.handleSheetDragMove);\n        window.addEventListener('pointerup', this.handleSheetDragEnd);\n        window.addEventListener('pointercancel', this.handleSheetDragEnd);\n    };\n\n    /**\n     * Starts mobile bottom sheet resizing from a touch event.\n     * @param {TouchEvent} e The touch event.\n     */\n    handleSheetTouchStart = (e) => {\n        if (!this.sheetResizable || !this.isBottomSheet() || this._sheetDrag) return;\n\n        const touch = e.touches?.[0];\n        if (!touch) return;\n\n        e.preventDefault();\n        e.stopPropagation();\n        e.stopImmediatePropagation?.();\n\n        this._sheetIgnoreDismissUntil = Date.now() + 500;\n        this.startSheetDrag('touch', touch.clientY);\n\n        window.addEventListener('touchmove', this.handleSheetTouchMove, { passive: false });\n        window.addEventListener('touchend', this.handleSheetTouchEnd, { passive: false });\n        window.addEventListener('touchcancel', this.handleSheetTouchEnd, { passive: false });\n    };\n\n    /**\n     * Starts tracking a possible backdrop dismiss tap.\n     * @param {PointerEvent} e The pointer event.\n     */\n    handleBackdropPointerStart = (e) => {\n        if (!this.isBottomSheet()\n            || e.target !== this.backdropElement\n            || this.isEventInsideSheet(e)\n            || Date.now() < this._sheetIgnoreDismissUntil) {\n            this._sheetBackdropGesture = null;\n            return;\n        }\n\n        this._sheetBackdropGesture = {\n            pointerId: e.pointerId,\n            startX: e.clientX,\n            startY: e.clientY,\n            hasMoved: false,\n        };\n    };\n\n    /**\n     * Tracks movement during a possible backdrop dismiss tap.\n     * @param {PointerEvent} e The pointer event.\n     */\n    handleBackdropPointerMove = (e) => {\n        if (!this._sheetBackdropGesture || e.pointerId !== this._sheetBackdropGesture.pointerId) return;\n\n        const distanceX = Math.abs(e.clientX - this._sheetBackdropGesture.startX);\n        const distanceY = Math.abs(e.clientY - this._sheetBackdropGesture.startY);\n\n        if (distanceX > 8 || distanceY > 8) {\n            this._sheetBackdropGesture.hasMoved = true;\n        }\n    };\n\n    /**\n     * Finishes a possible backdrop dismiss tap.\n     * @param {PointerEvent} e The pointer event.\n     */\n    handleBackdropPointerEnd = (e) => {\n        if (!this._sheetBackdropGesture || e.pointerId !== this._sheetBackdropGesture.pointerId) return;\n\n        const shouldClose = !this._sheetBackdropGesture.hasMoved\n            && e.target === this.backdropElement\n            && !this.isEventInsideSheet(e)\n            && Date.now() >= this._sheetIgnoreDismissUntil;\n\n        this._sheetBackdropGesture = null;\n        this._sheetBackdropHandledUntil = Date.now() + 350;\n\n        if (shouldClose) {\n            e.preventDefault();\n            e.stopPropagation();\n            this.close(e);\n        }\n    };\n\n    /**\n     * Cancels a possible backdrop dismiss tap.\n     */\n    handleBackdropPointerCancel = () => {\n        this._sheetBackdropGesture = null;\n        this._sheetBackdropHandledUntil = Date.now() + 350;\n    };\n\n    /**\n     * Resizes the mobile bottom sheet during dragging.\n     * @param {PointerEvent} e The pointer event.\n     */\n    handleSheetDragMove = (e) => {\n        if (!this._sheetDrag || e.pointerId !== this._sheetDrag.pointerId) return;\n\n        e.preventDefault();\n        e.stopPropagation();\n        e.stopImmediatePropagation?.();\n\n        this.updateSheetDrag(e.clientY);\n    };\n\n    /**\n     * Resizes the mobile bottom sheet during touch dragging.\n     * @param {TouchEvent} e The touch event.\n     */\n    handleSheetTouchMove = (e) => {\n        if (!this._sheetDrag || this._sheetDrag.pointerId !== 'touch') return;\n\n        const touch = e.touches?.[0];\n        if (!touch) return;\n\n        e.preventDefault();\n        e.stopPropagation();\n        e.stopImmediatePropagation?.();\n\n        this.updateSheetDrag(touch.clientY);\n    };\n\n    /**\n     * Ends mobile bottom sheet resizing.\n     * @param {PointerEvent} e The pointer event.\n     */\n    handleSheetDragEnd = (e) => {\n        const hasMoved = this._sheetDrag?.hasMoved;\n\n        if (this._sheetDrag && e?.pointerId === this._sheetDrag.pointerId) {\n            e.preventDefault();\n            e.stopPropagation();\n            e.stopImmediatePropagation?.();\n\n            try {\n                this.sheetHandleArea?.releasePointerCapture(e.pointerId);\n            } catch {\n                // Synthetic pointer events in tests may not own a pointer capture.\n            }\n        }\n\n        if (hasMoved) {\n            this._sheetIgnoreDismissUntil = Date.now() + 350;\n        } else {\n            this._sheetIgnoreDismissUntil = Date.now() + 500;\n        }\n\n        this.endSheetDrag();\n    };\n\n    /**\n     * Ends mobile bottom sheet resizing from a touch event.\n     * @param {TouchEvent} e The touch event.\n     */\n    handleSheetTouchEnd = (e) => {\n        if (!this._sheetDrag || this._sheetDrag.pointerId !== 'touch') return;\n\n        const hasMoved = this._sheetDrag.hasMoved;\n\n        if (e.type !== 'touchcancel') {\n            e.preventDefault();\n        }\n        e.stopPropagation();\n        if (e.type !== 'touchcancel') {\n            e.stopImmediatePropagation?.();\n        }\n\n        this._sheetIgnoreDismissUntil = Date.now() + (hasMoved ? 350 : 700);\n        this.endSheetDrag();\n    };\n\n    /**\n     * Cleans up mobile bottom sheet resizing listeners.\n     */\n    endSheetDrag() {\n        window.removeEventListener('pointermove', this.handleSheetDragMove);\n        window.removeEventListener('pointerup', this.handleSheetDragEnd);\n        window.removeEventListener('pointercancel', this.handleSheetDragEnd);\n        window.removeEventListener('touchmove', this.handleSheetTouchMove);\n        window.removeEventListener('touchend', this.handleSheetTouchEnd);\n        window.removeEventListener('touchcancel', this.handleSheetTouchEnd);\n        this._sheetDrag = null;\n    }\n\n    /**\n     * Triggers the event based on the target element.\n     * If the target element is different from the last caller, it refreshes the children by calling the `open` method.\n     * If the target element is the same as the last caller, it toggles the state by calling the `toggle` method.\n     * @param {Event} e The event object.\n     */\n    triggerEvent = async (e) => {\n        if (this._lastCaller && this._lastCaller !== e.composedPath()[0]) {\n            // same oppener event but different caller so just refresh inner content\n            await this.open(e);\n        } else {\n            // came caller so toggle\n            await this.toggle(e);\n        }\n\n        this._lastCaller = e.composedPath()[0];\n    };\n\n    /**\n     * Executes before the element is opened.\n     */\n    beforeOpen(e) {\n        // Hook for extending behavior before the dialog opens\n    }\n\n    /**\n     * Callback function called after the element is opened.\n     */\n    afterOpen(e) {\n        // Hook for extending behavior after the dialog opens\n    }\n\n    /**\n     * Executes before closing the element.\n     */\n    beforeClose(e) {\n        // Hook for extending behavior before the dialog closes\n    }\n\n    /**\n     * Callback function that is called after the container is closed.\n     */\n    afterClose(e) {\n        // Hook for extending behavior after the dialog closes\n    }\n\n    /**\n     * Animates the transition of elements with specified options, toggling the visibility and/or dimensions\n     * of the associated elements based on their current state.\n     *\n     * This method handles both forward and reverse animations for two elements (`transparentDiv` and `nativeElement`)\n     * with optional opacity changes. It ensures smooth transitioning by canceling any previous animations on the provided\n     * elements before initiating a new animation sequence.\n     * @returns {Promise<void>} A promise that resolves when the transition animation is completed.\n     */\n    doAnimateTransition() {\n        const options = {\n            delay: 0,\n            endDelay: 0,\n            fill: 'forwards',\n            duration: +this.animationDuration,\n            iterationStart: 0,\n            iterations: 1,\n            direction: 'normal',\n            easing: this.animationEasing,\n        };\n\n        if (this.isBottomSheet()) {\n            return this.doAnimateBottomSheetTransition(options);\n        }\n\n        if (this.animation && this.animation?.effect?.target !== this.transparentDiv) {\n            this.animation.cancel();\n            this.animation = null;\n        }\n\n        if (this.nativeAnimation && this.nativeAnimation?.effect?.target !== this.nativeElement) {\n            this.nativeAnimation.cancel();\n            this.nativeAnimation = null;\n        }\n\n        if (!this._isOpen) {\n            if (this.animation && this.nativeAnimation) {\n                this.animation.reverse();\n                this.nativeAnimation.reverse();\n            } else {\n                this.animation = this.transparentDiv.animate(\n                    [\n                        {\n                            width: 0,\n                        },\n                        {\n                            width: this.maxWidth,\n                        },\n                    ],\n                    options\n                );\n\n                this.nativeAnimation = this.nativeElement.animate(\n                    [\n                        {\n                            ...(this.hasOpacity ? { opacity: 0 } : {}),\n                            width: 0,\n                        },\n                        {\n                            ...(this.hasOpacity ? { opacity: 1 } : {}),\n                            width: this.maxWidth,\n                        },\n                    ],\n                    options\n                );\n            }\n        } else {\n            if (this.animation && this.nativeAnimation) {\n                this.animation.reverse();\n                this.nativeAnimation.reverse();\n            } else {\n                this.animation = this.transparentDiv.animate(\n                    [\n                        {\n                            width: this.maxWidth,\n                        },\n                        {\n                            width: 0,\n                        },\n                    ],\n                    options\n                );\n\n                this.nativeAnimation = this.nativeElement.animate(\n                    [\n                        {\n                            ...(this.hasOpacity ? { opacity: 1 } : {}),\n                            width: this.maxWidth,\n                        },\n                        {\n                            ...(this.hasOpacity ? { opacity: 0 } : {}),\n                            width: 0,\n                        },\n                    ],\n                    options\n                );\n            }\n        }\n\n        return new Promise((resolve) => {\n            this.animation.onfinish = () => {\n                this._isOpen = !this._isOpen;\n                resolve();\n            };\n        });\n    }\n\n    /**\n     * Animates the mobile bottom sheet and its backdrop.\n     * @param {object} options Web Animation options.\n     * @returns {Promise<void>}\n     */\n    doAnimateBottomSheetTransition(options) {\n        const shouldOpen = !this._isOpen;\n        const closedBackdrop = {\n            opacity: 0,\n        };\n        const openBackdrop = {\n            opacity: 'var(--wje-sliding-container-backdrop-opacity, 1)',\n        };\n        const closedSheet = {\n            ...(this.hasOpacity ? { opacity: 0 } : {}),\n            transform: 'translateY(100%)',\n        };\n        const openSheet = {\n            ...(this.hasOpacity ? { opacity: 1 } : {}),\n            transform: 'translateY(0)',\n        };\n\n        if (this.animation && this.animation?.effect?.target !== this.backdropElement) {\n            this.animation.cancel();\n            this.animation = null;\n        }\n\n        if (this.nativeAnimation && this.nativeAnimation?.effect?.target !== this.nativeElement) {\n            this.nativeAnimation.cancel();\n            this.nativeAnimation = null;\n        }\n\n        if (shouldOpen) {\n            if (this.animation && this.nativeAnimation) {\n                this.animation.reverse();\n                this.nativeAnimation.reverse();\n            } else {\n                this.animation = this.backdropElement.animate([closedBackdrop, openBackdrop], options);\n                this.nativeAnimation = this.nativeElement.animate([closedSheet, openSheet], options);\n            }\n        } else {\n            if (this.animation && this.nativeAnimation) {\n                this.animation.reverse();\n                this.nativeAnimation.reverse();\n            } else {\n                this.animation = this.backdropElement.animate([openBackdrop, closedBackdrop], options);\n                this.nativeAnimation = this.nativeElement.animate([openSheet, closedSheet], options);\n            }\n        }\n\n        return new Promise((resolve) => {\n            let isFinished = false;\n            const finish = () => {\n                if (isFinished) return;\n\n                isFinished = true;\n                this._isOpen = shouldOpen;\n                this.classList.toggle('open', shouldOpen);\n                this.setBottomSheetVisualState(shouldOpen);\n                resolve();\n            };\n\n            this.nativeAnimation.onfinish = finish;\n            this.nativeAnimation.oncancel = finish;\n        });\n    }\n\n    /**\n     * Opens the sliding container by performing necessary preparatory and transitional operations.\n     * @param {Event} e The event that triggered the open operation.\n     * @returns {Promise<void>} A promise that resolves when the open operation, including animations and subsequent handlers, is complete.\n     */\n    async open(e) {\n        await Promise.resolve(this.beforeOpen(e)).then(async () => {\n            if (!this._isOpen) {\n                this.classList.add('open');\n\n                event.dispatchCustomEvent(this, 'wje-sliding-container:beforeOpen');\n\n                this.checkForVariant(this.variant);\n                this.lockDocumentScroll();\n\n                await this.doAnimateTransition();\n                this.syncAria();\n\n                await Promise.resolve(this.afterOpen(e)).then(() => {\n                    event.dispatchCustomEvent(this, 'wje-sliding-container:open');\n                });\n            }\n        });\n    }\n\n    /**\n     * Closes the sliding container and performs associated operations such as animations and event dispatches.\n     * @param {Event} e The event object associated with the close action.\n     * @returns {Promise<void>} A promise that resolves when the closing operation, including animations and child element removal, is completed.\n     */\n    async close(e) {\n        if (this.isBottomSheet()\n            && e instanceof Event\n            && (this.isSheetHandleEvent(e) || (e.target === this.backdropElement && Date.now() < this._sheetIgnoreDismissUntil))) {\n            return;\n        }\n\n        await Promise.resolve(this.beforeClose(e)).then(async () => {\n            if (this._isOpen) {\n                this.classList.remove('open');\n\n                event.dispatchCustomEvent(this, 'wje-sliding-container:beforeClose');\n\n                await this.doAnimateTransition().catch(() => {\n                    if (this.isBottomSheet()) {\n                        this.setBottomSheetClosedState();\n                    }\n                });\n                this.syncAria();\n                this.unlockDocumentScroll();\n\n                await Promise.resolve(this.afterClose(e)).then(() => {\n                    if (this.removeChildAfterClose) {\n                        this.childNodes.forEach((child) => {\n                            child.remove();\n                        });\n                    }\n\n                    event.dispatchCustomEvent(this, 'wje-sliding-container:afterClose');\n                });\n            }\n        });\n    }\n\n    /**\n     * Forces the closed visual state for the mobile bottom sheet.\n     */\n    setBottomSheetClosedState() {\n        this._isOpen = false;\n        this.classList.remove('open');\n        this.setBottomSheetVisualState(false);\n    }\n\n    /**\n     * Toggles the state between open and closed.\n     * @param {Event} e The event object triggering the toggle.\n     * @returns {Promise<void>} A promise that resolves once the toggle operation (open or close) is complete.\n     */\n    async toggle(e) {\n        if (this._isOpen) {\n            await this.close(e);\n        } else {\n            await this.open(e);\n        }\n    }\n\n    /**\n     * Cleans up resources associated with the component by disconnecting\n     * the resize observer and setting it to null.\n     * @returns {void} Does not return a value.\n     */\n    componentCleanup() {\n        this.endSheetDrag();\n        this.unlockDocumentScroll();\n        this._resizeObserver?.disconnect();\n        this._resizeObserver = null;\n    }\n}\n","import SlidingContainer from './sliding-container.element.js';\n\nexport default SlidingContainer;\n\nSlidingContainer.define('wje-sliding-container', SlidingContainer);\n"],"names":[],"mappings":"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"}

package/dist/wje-toolbar-action.js

@@ -389,7 +389,7 @@ const _ToolbarAction = class _ToolbarAction extends WJElement {
    */
   createMenuItem(action) {
     let menuItem = document.createElement("wje-menu-item");
-    menuItem.replaceChildren(...Array.from(action.childNodes).map((node) => node.cloneNode(true)));
+    menuItem.replaceChildren(...Array.from(action.childNodes).map((node) => this.cloneActionMenuNode(node)));
     const label = this.getActionLabel(action);
     if (!menuItem.textContent.trim() && label) {
       menuItem.append(document.createTextNode(label));
@@ -405,6 +405,30 @@ const _ToolbarAction = class _ToolbarAction extends WJElement {
     this._managedOverflowNodes.add(menuItem);
     return menuItem;
   }
+  /**
+   * Clones action content for menu usage and normalizes button icon slots.
+   * @param {Node} node The source action child node.
+   * @returns {Node}
+   */
+  cloneActionMenuNode(node) {
+    const clone = node.cloneNode(true);
+    if (clone.nodeType === Node.ELEMENT_NODE) {
+      this.normalizeActionMenuIconSlot(clone);
+    }
+    return clone;
+  }
+  /**
+   * Moves button-only icon slots to the menu item start slot.
+   * @param {Element} element The cloned action content node.
+   */
+  normalizeActionMenuIconSlot(element) {
+    var _a;
+    if (((_a = element.tagName) == null ? void 0 : _a.toLowerCase()) !== "wje-icon") return;
+    const slot = element.getAttribute("slot");
+    if (!slot || slot === "icon-only") {
+      element.setAttribute("slot", "start");
+    }
+  }
   /**
    * Resolves readable text for a toolbar action copied into an overflow menu.
    * @param {HTMLElement} action The original action element.

package/dist/wje-toolbar-action.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-toolbar-action.js","sources":["../packages/wje-toolbar-action/toolbar-action.element.js","../packages/wje-toolbar-action/toolbar-action.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `ToolbarAction` is a custom web component that represents a toolbar action.\n * @summary This element represents a toolbar action.\n * @documentation https://elements.webjet.sk/components/toolbar-action\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native toolbar action wrapper.\n * @slot - The default slot for the toolbar action.\n * @tag wje-toolbar-action\n */\nexport default class ToolbarAction extends WJElement {\n    static BREAKPOINTS = {\n        sm: 576,\n        md: 768,\n        lg: 992,\n        xl: 1200,\n        '2xl': 1450,\n        xxl: 1450,\n    };\n\n    /**\n     * Creates an instance of ToolbarAction.\n     */\n    constructor() {\n        super();\n        this._managedHiddenActions = new WeakSet();\n        this._isCollapsedByBreakpoint = null;\n        this._managedOverflowNodes = new WeakSet();\n        this._overflowRetryFrame = null;\n        this._applyOverflowFrame = null;\n        this._observedDropdown = null;\n    }\n\n    /**\n     * The class name for the component.\n     * @type {string}\n     */\n    className = 'ToolbarAction';\n\n    /**\n     * Returns the CSS stylesheet for the component.\n     * @static\n     * @returns {CSSStyleSheet} The CSS stylesheet\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of observed attributes.\n     * @static\n     * @returns {Array} An empty array\n     */\n    static get observedAttributes() {\n        return ['breakpoint', 'max-items', 'visible-items'];\n    }\n\n    /**\n     * Sets the collapse breakpoint token or value.\n     * @param {string} value Breakpoint token or CSS size.\n     */\n    set breakpoint(value) {\n        if (value) this.setAttribute('breakpoint', value);\n        else this.removeAttribute('breakpoint');\n    }\n\n    /**\n     * Gets the collapse breakpoint token or value.\n     * @returns {string}\n     */\n    get breakpoint() {\n        return this.getAttribute('breakpoint') || '';\n    }\n\n    /**\n     * Sets the maximum number of visible actions.\n     * @param {number|string} value The maximum number of visible actions.\n     */\n    set maxItems(value) {\n        this.setAttribute('max-items', value || 0);\n    }\n\n    /**\n     * Gets the maximum number of visible actions.\n     * @returns {number}\n     */\n    get maxItems() {\n        return +this.getAttribute('max-items') || 0;\n    }\n\n    /**\n     * Sets the responsive visible action count.\n     * @param {number|string} value The visible action count.\n     */\n    set visibleItems(value) {\n        if (value === null || value === undefined || value === '') {\n            this.removeAttribute('visible-items');\n            return;\n        }\n\n        this.setAttribute('visible-items', value);\n    }\n\n    /**\n     * Gets the responsive visible action count.\n     * @returns {number|null}\n     */\n    get visibleItems() {\n        if (!this.hasAttribute('visible-items')) return null;\n        const value = +this.getAttribute('visible-items');\n        return Number.isFinite(value) ? value : null;\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the component for the toolbar action.\n     * @returns {object} Document fragment\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let slot = document.createElement('slot');\n\n        let element = document.createElement('div');\n        element.setAttribute('part', 'native');\n        element.classList.add('native-toolbar-action');\n\n        let dropdown = document.createElement('wje-dropdown');\n        dropdown.setAttribute('placement', 'bottom-end');\n        dropdown.setAttribute('collapsible', '');\n        dropdown.classList.add('toolbar-action-more');\n        dropdown.hidden = true;\n\n        let trigger = document.createElement('wje-button');\n        trigger.setAttribute('slot', 'trigger');\n        trigger.setAttribute('fill', 'link');\n        trigger.setAttribute('aria-label', 'Show more actions');\n        trigger.innerHTML = '<wje-icon name=\"dots\"></wje-icon>';\n\n        let menu = document.createElement('wje-menu');\n        menu.setAttribute('variant', 'context');\n\n        dropdown.append(trigger, menu);\n\n        element.appendChild(slot);\n        element.appendChild(dropdown);\n\n        fragment.appendChild(element);\n\n        this.defaultSlot = slot;\n        this.native = element;\n        this.moreDropdown = dropdown;\n        this.moreMenu = menu;\n\n        return fragment;\n    }\n\n    /**\n     * Applies the current visible action limit after the component is drawn.\n     */\n    afterDraw() {\n        this.onSlotChange = () => {\n            this.observeExistingDropdown();\n            this.scheduleOverflow();\n        };\n        this.defaultSlot?.addEventListener('slotchange', this.onSlotChange);\n        this.handleResize = () => this.handleBreakpointResize();\n\n        if (this.getBreakpointWidth()) {\n            window.addEventListener('resize', this.handleResize);\n        }\n\n        this.observeExistingDropdown();\n        this.scheduleOverflow(true);\n    }\n\n    /**\n     * Removes listeners after disconnect.\n     */\n    afterDisconnect() {\n        this.defaultSlot?.removeEventListener('slotchange', this.onSlotChange);\n        window.removeEventListener('resize', this.handleResize);\n        this._isCollapsedByBreakpoint = null;\n\n        if (this._overflowRetryFrame) {\n            cancelAnimationFrame(this._overflowRetryFrame);\n            this._overflowRetryFrame = null;\n        }\n\n        if (this._applyOverflowFrame) {\n            cancelAnimationFrame(this._applyOverflowFrame);\n            this._applyOverflowFrame = null;\n        }\n\n        this._dropdownObserver?.disconnect();\n        this._dropdownObserver = null;\n        this._observedDropdown = null;\n    }\n\n    /**\n     * Schedules overflow application after layout settles.\n     * @param {boolean} [doubleFrame] Wait an extra frame for initial render/hydration.\n     */\n    scheduleOverflow(doubleFrame = false) {\n        if (this._applyOverflowFrame) return;\n\n        this._applyOverflowFrame = requestAnimationFrame(() => {\n            this._applyOverflowFrame = null;\n\n            if (doubleFrame) {\n                this.scheduleOverflow(false);\n                return;\n            }\n\n            this.applyOverflow();\n        });\n    }\n\n    /**\n     * Returns the actions for the toolbar action.\n     * @returns {Array<HTMLElement>} Managed toolbar actions.\n     */\n    getActions() {\n        return this.getAssignedElements().filter(\n            (element) =>\n                element.getAttribute('slot') !== 'trigger' &&\n                (element.tagName?.toLowerCase() === 'wje-button' || element.hasAttribute('data-toolbar-action'))\n        );\n    }\n\n    /**\n     * Returns direct children assigned to the default slot.\n     * @returns {Array<HTMLElement>}\n     */\n    getAssignedElements() {\n        return this.defaultSlot?.assignedElements?.() || Array.from(this.children);\n    }\n\n    /**\n     * Returns an existing top-level dropdown if present.\n     * @returns {HTMLElement|null}\n     */\n    getExistingDropdown() {\n        return this.getAssignedElements().find((element) => element.tagName?.toLowerCase() === 'wje-dropdown') || null;\n    }\n\n    /**\n     * Observes the external dropdown for late menu/content changes.\n     */\n    observeExistingDropdown() {\n        const dropdown = this.getExistingDropdown();\n\n        if (dropdown === this._observedDropdown) return;\n\n        this._dropdownObserver?.disconnect();\n        this._dropdownObserver = null;\n        this._observedDropdown = dropdown;\n\n        if (!dropdown || typeof MutationObserver !== 'function') return;\n\n        this._dropdownObserver = new MutationObserver(() => this.scheduleOverflow());\n        this._dropdownObserver.observe(dropdown, {\n            childList: true,\n            subtree: false,\n        });\n    }\n\n    /**\n     * Returns the dropdown that should receive overflow items.\n     * @returns {HTMLElement}\n     */\n    getOverflowDropdown() {\n        return this.getExistingDropdown() || this.moreDropdown;\n    }\n\n    /**\n     * Returns the menu used for overflow items.\n     * @returns {HTMLElement|null}\n     */\n    getOverflowMenu() {\n        const existingDropdown = this.getExistingDropdown();\n\n        if (existingDropdown) {\n            return (\n                Array.from(existingDropdown.children).find((element) => element.tagName?.toLowerCase() === 'wje-menu') ||\n                null\n            );\n        }\n\n        return this.moreMenu;\n    }\n\n    /**\n     * Gets the number of actions that should stay visible.\n     * @returns {number}\n     */\n    getVisibleLimit() {\n        const actions = this.getActions();\n\n        if (this.isCollapsedByBreakpoint()) {\n            return 0;\n        }\n\n        const maxItems = this.maxItems > 0 ? this.maxItems : actions.length;\n        const visibleItems = this.visibleItems;\n        const limit = visibleItems === null ? maxItems : Math.min(visibleItems, maxItems);\n\n        return Math.max(0, Math.min(limit, actions.length));\n    }\n\n    /**\n     * Returns whether the toolbar action should collapse based on the configured breakpoint.\n     * @returns {boolean}\n     */\n    shouldCollapseByBreakpoint() {\n        const breakpointWidth = this.getBreakpointWidth();\n\n        if (!breakpointWidth) return false;\n\n        return window.innerWidth < breakpointWidth;\n    }\n\n    /**\n     * Returns the cached breakpoint collapse state.\n     * @returns {boolean}\n     */\n    isCollapsedByBreakpoint() {\n        if (!this.getBreakpointWidth()) {\n            this._isCollapsedByBreakpoint = false;\n            return false;\n        }\n\n        const nextState = this.shouldCollapseByBreakpoint();\n        this._isCollapsedByBreakpoint = nextState;\n\n        return nextState;\n    }\n\n    /**\n     * Reacts to viewport resize only when the breakpoint mode actually changes.\n     * @returns {void}\n     */\n    handleBreakpointResize() {\n        if (!this.getBreakpointWidth()) return;\n\n        const nextState = this.shouldCollapseByBreakpoint();\n\n        if (this._isCollapsedByBreakpoint === nextState) return;\n\n        this._isCollapsedByBreakpoint = nextState;\n        this.scheduleOverflow();\n    }\n\n    /**\n     * Resolves the configured breakpoint to a pixel width.\n     * @returns {number|null}\n     */\n    getBreakpointWidth() {\n        if (!this.breakpoint) return null;\n\n        const token = this.breakpoint.trim().toLowerCase();\n        const cssValue = getComputedStyle(this).getPropertyValue(`--wje-toolbar-action-breakpoint-${token}`).trim();\n        const namedBreakpoint = ToolbarAction.BREAKPOINTS[token];\n\n        if (cssValue) {\n            const cssNumber = parseFloat(cssValue);\n            if (Number.isFinite(cssNumber)) return cssNumber;\n        }\n\n        if (Number.isFinite(namedBreakpoint)) {\n            return namedBreakpoint;\n        }\n\n        const directNumber = parseFloat(token);\n        return Number.isFinite(directNumber) ? directNumber : null;\n    }\n\n    /**\n     * Updates visible actions and the overflow dropdown.\n     * @returns {void}\n     */\n    applyOverflow() {\n        const actions = this.getActions();\n        const visibleLimit = this.getVisibleLimit();\n        const overflowActions = actions.slice(visibleLimit);\n        const existingDropdown = this.getExistingDropdown();\n        const overflowMenu = this.getOverflowMenu();\n\n        if (this._overflowRetryFrame) {\n            cancelAnimationFrame(this._overflowRetryFrame);\n            this._overflowRetryFrame = null;\n        }\n\n        this.restoreManagedActions(actions);\n        this.restoreManagedOverflowContent();\n\n        if (existingDropdown && overflowActions.length > 0 && !overflowMenu) {\n            this._overflowRetryFrame = requestAnimationFrame(() => {\n                this._overflowRetryFrame = null;\n                this.scheduleOverflow();\n            });\n\n            return;\n        }\n\n        if (!existingDropdown) {\n            this.moreMenu?.replaceChildren();\n        }\n\n        overflowActions.forEach((action) => {\n            action.hidden = true;\n            action.style.display = 'none';\n            this._managedHiddenActions.add(action);\n        });\n\n        if (overflowMenu && existingDropdown && overflowActions.length > 0 && overflowMenu.children.length > 0) {\n            overflowMenu.append(this.createOverflowDivider());\n        }\n\n        overflowActions.forEach((action) => {\n            overflowMenu?.append(this.createMenuItem(action));\n        });\n\n        if (!existingDropdown && this.moreDropdown) {\n            this.moreDropdown.hidden = overflowActions.length === 0;\n        } else if (existingDropdown && this.moreDropdown) {\n            this.moreDropdown.hidden = true;\n        }\n    }\n\n    /**\n     * Restores buttons hidden by this component.\n     * @param {Array<HTMLElement>} actions Toolbar buttons.\n     */\n    restoreManagedActions(actions = this.getActions()) {\n        actions.forEach((action) => {\n            if (this._managedHiddenActions.has(action)) {\n                action.hidden = false;\n                action.style.removeProperty('display');\n                this._managedHiddenActions.delete(action);\n            }\n        });\n    }\n\n    /**\n     * Removes overflow menu nodes that were previously injected by this component.\n     */\n    restoreManagedOverflowContent() {\n        const dropdown = this.getExistingDropdown();\n\n        if (!dropdown) return;\n\n        const menu = this.getOverflowMenu();\n        if (!menu) return;\n\n        Array.from(menu.children).forEach((child) => {\n            if (this._managedOverflowNodes.has(child)) {\n                child.remove();\n                this._managedOverflowNodes.delete(child);\n            }\n        });\n    }\n\n    /**\n     * Creates a dropdown menu proxy for an overflowed button.\n     * @param {HTMLElement} action The original action button.\n     * @returns {HTMLElement}\n     */\n    createMenuItem(action) {\n        let menuItem = document.createElement('wje-menu-item');\n        menuItem.replaceChildren(...Array.from(action.childNodes).map((node) => node.cloneNode(true)));\n\n        const label = this.getActionLabel(action);\n        if (!menuItem.textContent.trim() && label) {\n            menuItem.append(document.createTextNode(label));\n        }\n\n        if (label) {\n            menuItem.setAttribute('aria-label', label);\n        }\n\n        if (action.hasAttribute('disabled') || action.getAttribute('aria-disabled') === 'true') {\n            menuItem.setAttribute('disabled', '');\n        }\n\n        menuItem.addEventListener('wje-menu-item:click', (e) => this.handleMenuItemClick(e, action));\n        menuItem.addEventListener('click', (e) => this.handleMenuItemClick(e, action));\n        this._managedOverflowNodes.add(menuItem);\n\n        return menuItem;\n    }\n\n    /**\n     * Resolves readable text for a toolbar action copied into an overflow menu.\n     * @param {HTMLElement} action The original action element.\n     * @returns {string}\n     */\n    getActionLabel(action) {\n        if (!action) return '';\n\n        const explicitLabel = ['aria-label', 'title', 'label', 'data-label', 'tooltip']\n            .map((attr) => action.getAttribute(attr)?.trim())\n            .find((value) => value && value !== 'true');\n\n        if (explicitLabel) return explicitLabel;\n\n        return action.textContent.trim();\n    }\n\n    /**\n     * Creates a divider separating existing dropdown actions from responsive overflow actions.\n     * @returns {HTMLElement}\n     */\n    createOverflowDivider() {\n        const divider = document.createElement('wje-divider');\n        this._managedOverflowNodes.add(divider);\n        return divider;\n    }\n\n    /**\n     * Forwards menu item activation to the original button.\n     * @param {Event} e The menu event.\n     * @param {HTMLElement} action The original action button.\n     */\n    handleMenuItemClick(e, action) {\n        e.preventDefault?.();\n        e.stopPropagation();\n\n        if (!action || action.hasAttribute('disabled') || action.getAttribute('aria-disabled') === 'true') return;\n\n        action.click();\n    }\n\n    /**\n     * Measures action widths while preserving current overflow state.\n     * @returns {{count: number, widths: number[], gap: number, moreWidth: number, getWidthForCount: Function}}\n     */\n    measureActionMetrics() {\n        const actions = this.getActions();\n        const hasExistingDropdown = !!this.getExistingDropdown();\n\n        this.restoreManagedActions(actions);\n\n        const widths = actions.map((action) => action.getBoundingClientRect().width);\n        const style = this.native ? getComputedStyle(this.native) : null;\n        const gap = style ? parseFloat(style.columnGap || style.gap || '0') || 0 : 0;\n        const moreWidth = this.measureMoreWidth();\n\n        this.applyOverflow();\n\n        return {\n            count: actions.length,\n            widths,\n            gap,\n            moreWidth,\n            getWidthForCount: (visibleCount) => {\n                const count = Math.max(0, Math.min(visibleCount, actions.length));\n                const overflowCount = actions.length - count;\n                const visibleWidth = widths.slice(0, count).reduce((sum, width) => sum + width, 0);\n                const visibleGaps = Math.max(count - 1, 0) * gap;\n                const usesDropdown = hasExistingDropdown || overflowCount > 0;\n                const moreGap = count > 0 && usesDropdown ? gap : 0;\n\n                return visibleWidth + visibleGaps + (usesDropdown ? moreWidth + moreGap : 0);\n            },\n        };\n    }\n\n    /**\n     * Measures the overflow dropdown trigger.\n     * @returns {number}\n     */\n    measureMoreWidth() {\n        const dropdown = this.getOverflowDropdown();\n        if (!dropdown) return 48;\n\n        const isInternalDropdown = dropdown === this.moreDropdown;\n        const wasHidden = dropdown.hidden;\n        const previousVisibility = dropdown.style.visibility;\n\n        if (isInternalDropdown && wasHidden) {\n            dropdown.hidden = false;\n            dropdown.style.visibility = 'hidden';\n        }\n\n        const width = dropdown.getBoundingClientRect().width || 48;\n\n        if (isInternalDropdown && wasHidden) {\n            dropdown.hidden = true;\n            dropdown.style.visibility = previousVisibility;\n        }\n\n        if (dropdown === this.moreDropdown && this.getExistingDropdown()) {\n            this.moreDropdown.hidden = true;\n        }\n\n        return width;\n    }\n}\n","import ToolbarAction from './toolbar-action.element.js';\n\nexport default ToolbarAction;\n\nToolbarAction.define('wje-toolbar-action', ToolbarAction);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"wje-toolbar-action.js","sources":["../packages/wje-toolbar-action/toolbar-action.element.js","../packages/wje-toolbar-action/toolbar-action.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `ToolbarAction` is a custom web component that represents a toolbar action.\n * @summary This element represents a toolbar action.\n * @documentation https://elements.webjet.sk/components/toolbar-action\n * @status stable\n * @augments {WJElement}\n * @csspart native - The native toolbar action wrapper.\n * @slot - The default slot for the toolbar action.\n * @tag wje-toolbar-action\n */\nexport default class ToolbarAction extends WJElement {\n    static BREAKPOINTS = {\n        sm: 576,\n        md: 768,\n        lg: 992,\n        xl: 1200,\n        '2xl': 1450,\n        xxl: 1450,\n    };\n\n    /**\n     * Creates an instance of ToolbarAction.\n     */\n    constructor() {\n        super();\n        this._managedHiddenActions = new WeakSet();\n        this._isCollapsedByBreakpoint = null;\n        this._managedOverflowNodes = new WeakSet();\n        this._overflowRetryFrame = null;\n        this._applyOverflowFrame = null;\n        this._observedDropdown = null;\n    }\n\n    /**\n     * The class name for the component.\n     * @type {string}\n     */\n    className = 'ToolbarAction';\n\n    /**\n     * Returns the CSS stylesheet for the component.\n     * @static\n     * @returns {CSSStyleSheet} The CSS stylesheet\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of observed attributes.\n     * @static\n     * @returns {Array} An empty array\n     */\n    static get observedAttributes() {\n        return ['breakpoint', 'max-items', 'visible-items'];\n    }\n\n    /**\n     * Sets the collapse breakpoint token or value.\n     * @param {string} value Breakpoint token or CSS size.\n     */\n    set breakpoint(value) {\n        if (value) this.setAttribute('breakpoint', value);\n        else this.removeAttribute('breakpoint');\n    }\n\n    /**\n     * Gets the collapse breakpoint token or value.\n     * @returns {string}\n     */\n    get breakpoint() {\n        return this.getAttribute('breakpoint') || '';\n    }\n\n    /**\n     * Sets the maximum number of visible actions.\n     * @param {number|string} value The maximum number of visible actions.\n     */\n    set maxItems(value) {\n        this.setAttribute('max-items', value || 0);\n    }\n\n    /**\n     * Gets the maximum number of visible actions.\n     * @returns {number}\n     */\n    get maxItems() {\n        return +this.getAttribute('max-items') || 0;\n    }\n\n    /**\n     * Sets the responsive visible action count.\n     * @param {number|string} value The visible action count.\n     */\n    set visibleItems(value) {\n        if (value === null || value === undefined || value === '') {\n            this.removeAttribute('visible-items');\n            return;\n        }\n\n        this.setAttribute('visible-items', value);\n    }\n\n    /**\n     * Gets the responsive visible action count.\n     * @returns {number|null}\n     */\n    get visibleItems() {\n        if (!this.hasAttribute('visible-items')) return null;\n        const value = +this.getAttribute('visible-items');\n        return Number.isFinite(value) ? value : null;\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the component for the toolbar action.\n     * @returns {object} Document fragment\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let slot = document.createElement('slot');\n\n        let element = document.createElement('div');\n        element.setAttribute('part', 'native');\n        element.classList.add('native-toolbar-action');\n\n        let dropdown = document.createElement('wje-dropdown');\n        dropdown.setAttribute('placement', 'bottom-end');\n        dropdown.setAttribute('collapsible', '');\n        dropdown.classList.add('toolbar-action-more');\n        dropdown.hidden = true;\n\n        let trigger = document.createElement('wje-button');\n        trigger.setAttribute('slot', 'trigger');\n        trigger.setAttribute('fill', 'link');\n        trigger.setAttribute('aria-label', 'Show more actions');\n        trigger.innerHTML = '<wje-icon name=\"dots\"></wje-icon>';\n\n        let menu = document.createElement('wje-menu');\n        menu.setAttribute('variant', 'context');\n\n        dropdown.append(trigger, menu);\n\n        element.appendChild(slot);\n        element.appendChild(dropdown);\n\n        fragment.appendChild(element);\n\n        this.defaultSlot = slot;\n        this.native = element;\n        this.moreDropdown = dropdown;\n        this.moreMenu = menu;\n\n        return fragment;\n    }\n\n    /**\n     * Applies the current visible action limit after the component is drawn.\n     */\n    afterDraw() {\n        this.onSlotChange = () => {\n            this.observeExistingDropdown();\n            this.scheduleOverflow();\n        };\n        this.defaultSlot?.addEventListener('slotchange', this.onSlotChange);\n        this.handleResize = () => this.handleBreakpointResize();\n\n        if (this.getBreakpointWidth()) {\n            window.addEventListener('resize', this.handleResize);\n        }\n\n        this.observeExistingDropdown();\n        this.scheduleOverflow(true);\n    }\n\n    /**\n     * Removes listeners after disconnect.\n     */\n    afterDisconnect() {\n        this.defaultSlot?.removeEventListener('slotchange', this.onSlotChange);\n        window.removeEventListener('resize', this.handleResize);\n        this._isCollapsedByBreakpoint = null;\n\n        if (this._overflowRetryFrame) {\n            cancelAnimationFrame(this._overflowRetryFrame);\n            this._overflowRetryFrame = null;\n        }\n\n        if (this._applyOverflowFrame) {\n            cancelAnimationFrame(this._applyOverflowFrame);\n            this._applyOverflowFrame = null;\n        }\n\n        this._dropdownObserver?.disconnect();\n        this._dropdownObserver = null;\n        this._observedDropdown = null;\n    }\n\n    /**\n     * Schedules overflow application after layout settles.\n     * @param {boolean} [doubleFrame] Wait an extra frame for initial render/hydration.\n     */\n    scheduleOverflow(doubleFrame = false) {\n        if (this._applyOverflowFrame) return;\n\n        this._applyOverflowFrame = requestAnimationFrame(() => {\n            this._applyOverflowFrame = null;\n\n            if (doubleFrame) {\n                this.scheduleOverflow(false);\n                return;\n            }\n\n            this.applyOverflow();\n        });\n    }\n\n    /**\n     * Returns the actions for the toolbar action.\n     * @returns {Array<HTMLElement>} Managed toolbar actions.\n     */\n    getActions() {\n        return this.getAssignedElements().filter(\n            (element) =>\n                element.getAttribute('slot') !== 'trigger' &&\n                (element.tagName?.toLowerCase() === 'wje-button' || element.hasAttribute('data-toolbar-action'))\n        );\n    }\n\n    /**\n     * Returns direct children assigned to the default slot.\n     * @returns {Array<HTMLElement>}\n     */\n    getAssignedElements() {\n        return this.defaultSlot?.assignedElements?.() || Array.from(this.children);\n    }\n\n    /**\n     * Returns an existing top-level dropdown if present.\n     * @returns {HTMLElement|null}\n     */\n    getExistingDropdown() {\n        return this.getAssignedElements().find((element) => element.tagName?.toLowerCase() === 'wje-dropdown') || null;\n    }\n\n    /**\n     * Observes the external dropdown for late menu/content changes.\n     */\n    observeExistingDropdown() {\n        const dropdown = this.getExistingDropdown();\n\n        if (dropdown === this._observedDropdown) return;\n\n        this._dropdownObserver?.disconnect();\n        this._dropdownObserver = null;\n        this._observedDropdown = dropdown;\n\n        if (!dropdown || typeof MutationObserver !== 'function') return;\n\n        this._dropdownObserver = new MutationObserver(() => this.scheduleOverflow());\n        this._dropdownObserver.observe(dropdown, {\n            childList: true,\n            subtree: false,\n        });\n    }\n\n    /**\n     * Returns the dropdown that should receive overflow items.\n     * @returns {HTMLElement}\n     */\n    getOverflowDropdown() {\n        return this.getExistingDropdown() || this.moreDropdown;\n    }\n\n    /**\n     * Returns the menu used for overflow items.\n     * @returns {HTMLElement|null}\n     */\n    getOverflowMenu() {\n        const existingDropdown = this.getExistingDropdown();\n\n        if (existingDropdown) {\n            return (\n                Array.from(existingDropdown.children).find((element) => element.tagName?.toLowerCase() === 'wje-menu') ||\n                null\n            );\n        }\n\n        return this.moreMenu;\n    }\n\n    /**\n     * Gets the number of actions that should stay visible.\n     * @returns {number}\n     */\n    getVisibleLimit() {\n        const actions = this.getActions();\n\n        if (this.isCollapsedByBreakpoint()) {\n            return 0;\n        }\n\n        const maxItems = this.maxItems > 0 ? this.maxItems : actions.length;\n        const visibleItems = this.visibleItems;\n        const limit = visibleItems === null ? maxItems : Math.min(visibleItems, maxItems);\n\n        return Math.max(0, Math.min(limit, actions.length));\n    }\n\n    /**\n     * Returns whether the toolbar action should collapse based on the configured breakpoint.\n     * @returns {boolean}\n     */\n    shouldCollapseByBreakpoint() {\n        const breakpointWidth = this.getBreakpointWidth();\n\n        if (!breakpointWidth) return false;\n\n        return window.innerWidth < breakpointWidth;\n    }\n\n    /**\n     * Returns the cached breakpoint collapse state.\n     * @returns {boolean}\n     */\n    isCollapsedByBreakpoint() {\n        if (!this.getBreakpointWidth()) {\n            this._isCollapsedByBreakpoint = false;\n            return false;\n        }\n\n        const nextState = this.shouldCollapseByBreakpoint();\n        this._isCollapsedByBreakpoint = nextState;\n\n        return nextState;\n    }\n\n    /**\n     * Reacts to viewport resize only when the breakpoint mode actually changes.\n     * @returns {void}\n     */\n    handleBreakpointResize() {\n        if (!this.getBreakpointWidth()) return;\n\n        const nextState = this.shouldCollapseByBreakpoint();\n\n        if (this._isCollapsedByBreakpoint === nextState) return;\n\n        this._isCollapsedByBreakpoint = nextState;\n        this.scheduleOverflow();\n    }\n\n    /**\n     * Resolves the configured breakpoint to a pixel width.\n     * @returns {number|null}\n     */\n    getBreakpointWidth() {\n        if (!this.breakpoint) return null;\n\n        const token = this.breakpoint.trim().toLowerCase();\n        const cssValue = getComputedStyle(this).getPropertyValue(`--wje-toolbar-action-breakpoint-${token}`).trim();\n        const namedBreakpoint = ToolbarAction.BREAKPOINTS[token];\n\n        if (cssValue) {\n            const cssNumber = parseFloat(cssValue);\n            if (Number.isFinite(cssNumber)) return cssNumber;\n        }\n\n        if (Number.isFinite(namedBreakpoint)) {\n            return namedBreakpoint;\n        }\n\n        const directNumber = parseFloat(token);\n        return Number.isFinite(directNumber) ? directNumber : null;\n    }\n\n    /**\n     * Updates visible actions and the overflow dropdown.\n     * @returns {void}\n     */\n    applyOverflow() {\n        const actions = this.getActions();\n        const visibleLimit = this.getVisibleLimit();\n        const overflowActions = actions.slice(visibleLimit);\n        const existingDropdown = this.getExistingDropdown();\n        const overflowMenu = this.getOverflowMenu();\n\n        if (this._overflowRetryFrame) {\n            cancelAnimationFrame(this._overflowRetryFrame);\n            this._overflowRetryFrame = null;\n        }\n\n        this.restoreManagedActions(actions);\n        this.restoreManagedOverflowContent();\n\n        if (existingDropdown && overflowActions.length > 0 && !overflowMenu) {\n            this._overflowRetryFrame = requestAnimationFrame(() => {\n                this._overflowRetryFrame = null;\n                this.scheduleOverflow();\n            });\n\n            return;\n        }\n\n        if (!existingDropdown) {\n            this.moreMenu?.replaceChildren();\n        }\n\n        overflowActions.forEach((action) => {\n            action.hidden = true;\n            action.style.display = 'none';\n            this._managedHiddenActions.add(action);\n        });\n\n        if (overflowMenu && existingDropdown && overflowActions.length > 0 && overflowMenu.children.length > 0) {\n            overflowMenu.append(this.createOverflowDivider());\n        }\n\n        overflowActions.forEach((action) => {\n            overflowMenu?.append(this.createMenuItem(action));\n        });\n\n        if (!existingDropdown && this.moreDropdown) {\n            this.moreDropdown.hidden = overflowActions.length === 0;\n        } else if (existingDropdown && this.moreDropdown) {\n            this.moreDropdown.hidden = true;\n        }\n    }\n\n    /**\n     * Restores buttons hidden by this component.\n     * @param {Array<HTMLElement>} actions Toolbar buttons.\n     */\n    restoreManagedActions(actions = this.getActions()) {\n        actions.forEach((action) => {\n            if (this._managedHiddenActions.has(action)) {\n                action.hidden = false;\n                action.style.removeProperty('display');\n                this._managedHiddenActions.delete(action);\n            }\n        });\n    }\n\n    /**\n     * Removes overflow menu nodes that were previously injected by this component.\n     */\n    restoreManagedOverflowContent() {\n        const dropdown = this.getExistingDropdown();\n\n        if (!dropdown) return;\n\n        const menu = this.getOverflowMenu();\n        if (!menu) return;\n\n        Array.from(menu.children).forEach((child) => {\n            if (this._managedOverflowNodes.has(child)) {\n                child.remove();\n                this._managedOverflowNodes.delete(child);\n            }\n        });\n    }\n\n    /**\n     * Creates a dropdown menu proxy for an overflowed button.\n     * @param {HTMLElement} action The original action button.\n     * @returns {HTMLElement}\n     */\n    createMenuItem(action) {\n        let menuItem = document.createElement('wje-menu-item');\n        menuItem.replaceChildren(...Array.from(action.childNodes).map((node) => this.cloneActionMenuNode(node)));\n\n        const label = this.getActionLabel(action);\n        if (!menuItem.textContent.trim() && label) {\n            menuItem.append(document.createTextNode(label));\n        }\n\n        if (label) {\n            menuItem.setAttribute('aria-label', label);\n        }\n\n        if (action.hasAttribute('disabled') || action.getAttribute('aria-disabled') === 'true') {\n            menuItem.setAttribute('disabled', '');\n        }\n\n        menuItem.addEventListener('wje-menu-item:click', (e) => this.handleMenuItemClick(e, action));\n        menuItem.addEventListener('click', (e) => this.handleMenuItemClick(e, action));\n        this._managedOverflowNodes.add(menuItem);\n\n        return menuItem;\n    }\n\n    /**\n     * Clones action content for menu usage and normalizes button icon slots.\n     * @param {Node} node The source action child node.\n     * @returns {Node}\n     */\n    cloneActionMenuNode(node) {\n        const clone = node.cloneNode(true);\n\n        if (clone.nodeType === Node.ELEMENT_NODE) {\n            this.normalizeActionMenuIconSlot(clone);\n        }\n\n        return clone;\n    }\n\n    /**\n     * Moves button-only icon slots to the menu item start slot.\n     * @param {Element} element The cloned action content node.\n     */\n    normalizeActionMenuIconSlot(element) {\n        if (element.tagName?.toLowerCase() !== 'wje-icon') return;\n\n        const slot = element.getAttribute('slot');\n        if (!slot || slot === 'icon-only') {\n            element.setAttribute('slot', 'start');\n        }\n    }\n\n    /**\n     * Resolves readable text for a toolbar action copied into an overflow menu.\n     * @param {HTMLElement} action The original action element.\n     * @returns {string}\n     */\n    getActionLabel(action) {\n        if (!action) return '';\n\n        const explicitLabel = ['aria-label', 'title', 'label', 'data-label', 'tooltip']\n            .map((attr) => action.getAttribute(attr)?.trim())\n            .find((value) => value && value !== 'true');\n\n        if (explicitLabel) return explicitLabel;\n\n        return action.textContent.trim();\n    }\n\n    /**\n     * Creates a divider separating existing dropdown actions from responsive overflow actions.\n     * @returns {HTMLElement}\n     */\n    createOverflowDivider() {\n        const divider = document.createElement('wje-divider');\n        this._managedOverflowNodes.add(divider);\n        return divider;\n    }\n\n    /**\n     * Forwards menu item activation to the original button.\n     * @param {Event} e The menu event.\n     * @param {HTMLElement} action The original action button.\n     */\n    handleMenuItemClick(e, action) {\n        e.preventDefault?.();\n        e.stopPropagation();\n\n        if (!action || action.hasAttribute('disabled') || action.getAttribute('aria-disabled') === 'true') return;\n\n        action.click();\n    }\n\n    /**\n     * Measures action widths while preserving current overflow state.\n     * @returns {{count: number, widths: number[], gap: number, moreWidth: number, getWidthForCount: Function}}\n     */\n    measureActionMetrics() {\n        const actions = this.getActions();\n        const hasExistingDropdown = !!this.getExistingDropdown();\n\n        this.restoreManagedActions(actions);\n\n        const widths = actions.map((action) => action.getBoundingClientRect().width);\n        const style = this.native ? getComputedStyle(this.native) : null;\n        const gap = style ? parseFloat(style.columnGap || style.gap || '0') || 0 : 0;\n        const moreWidth = this.measureMoreWidth();\n\n        this.applyOverflow();\n\n        return {\n            count: actions.length,\n            widths,\n            gap,\n            moreWidth,\n            getWidthForCount: (visibleCount) => {\n                const count = Math.max(0, Math.min(visibleCount, actions.length));\n                const overflowCount = actions.length - count;\n                const visibleWidth = widths.slice(0, count).reduce((sum, width) => sum + width, 0);\n                const visibleGaps = Math.max(count - 1, 0) * gap;\n                const usesDropdown = hasExistingDropdown || overflowCount > 0;\n                const moreGap = count > 0 && usesDropdown ? gap : 0;\n\n                return visibleWidth + visibleGaps + (usesDropdown ? moreWidth + moreGap : 0);\n            },\n        };\n    }\n\n    /**\n     * Measures the overflow dropdown trigger.\n     * @returns {number}\n     */\n    measureMoreWidth() {\n        const dropdown = this.getOverflowDropdown();\n        if (!dropdown) return 48;\n\n        const isInternalDropdown = dropdown === this.moreDropdown;\n        const wasHidden = dropdown.hidden;\n        const previousVisibility = dropdown.style.visibility;\n\n        if (isInternalDropdown && wasHidden) {\n            dropdown.hidden = false;\n            dropdown.style.visibility = 'hidden';\n        }\n\n        const width = dropdown.getBoundingClientRect().width || 48;\n\n        if (isInternalDropdown && wasHidden) {\n            dropdown.hidden = true;\n            dropdown.style.visibility = previousVisibility;\n        }\n\n        if (dropdown === this.moreDropdown && this.getExistingDropdown()) {\n            this.moreDropdown.hidden = true;\n        }\n\n        return width;\n    }\n}\n","import ToolbarAction from './toolbar-action.element.js';\n\nexport default ToolbarAction;\n\nToolbarAction.define('wje-toolbar-action', ToolbarAction);\n"],"names":[],"mappings":"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"}

package/dist/wje-toolbar.js

@@ -2,7 +2,7 @@ var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 import WJElement from "./wje-element.js";
-const styles = "/*\n[ WJ Toolbar ]\n*/\n\n:host {\n    width: 100%;\n    height: var(--wje-toolbar-height);\n}\n\n.native-toolbar {\n    background-color: var(--wje-toolbar-background);\n    display: flex;\n    align-items: center;\n    flex-wrap: nowrap;\n    justify-content: flex-start;\n    border-bottom: 1px solid var(--wje-toolbar-border-color);\n    padding-inline: var(--wje-toolbar-padding-inline);\n    padding-block: var(--wje-toolbar-padding-block);\n    margin-inline: var(--wje-toolbar-margin-inline);\n    margin-block: var(--wje-toolbar-margin-block);\n    box-shadow: var(--wje-toolbar-shadow);\n    gap: var(--wje-toolbar-action-gap);\n    overflow: hidden;\n}\n\n::slotted {\n    grid-column: span 4;\n}\n\n::slotted([slot='start']) {\n    min-width: 0;\n    margin-right: auto;\n}\n\n::slotted([slot='end']) {\n    flex: 0 0 auto;\n}\n\n:host([sticky]) {\n    position: sticky;\n    top: var(--wje-toolbar-top);\n    z-index: 99;\n}\n";
+const styles = "/*\n[ WJ Toolbar ]\n*/\n\n:host {\n    width: 100%;\n    height: var(--wje-toolbar-height);\n}\n\n.native-toolbar {\n    background-color: var(--wje-toolbar-background);\n    display: flex;\n    align-items: center;\n    flex-wrap: nowrap;\n    justify-content: flex-start;\n    border-bottom: 1px solid var(--wje-toolbar-border-color);\n    padding-inline: var(--wje-toolbar-padding-inline);\n    padding-block: var(--wje-toolbar-padding-block);\n    margin-inline: var(--wje-toolbar-margin-inline);\n    margin-block: var(--wje-toolbar-margin-block);\n    box-shadow: var(--wje-toolbar-shadow);\n    gap: var(--wje-toolbar-action-gap);\n    overflow: hidden;\n}\n\nslot[name='start'],\nslot[name='end'] {\n    display: flex;\n    align-items: center;\n    gap: var(--wje-toolbar-action-gap);\n}\n\nslot[name='start'] {\n    flex: 1 1 auto;\n    min-width: 0;\n}\n\nslot[name='end'] {\n    flex: 0 0 auto;\n    justify-content: flex-end;\n}\n\n::slotted {\n    grid-column: span 4;\n}\n\n::slotted([slot='start']) {\n    min-width: 0;\n}\n\n::slotted([slot='end']) {\n    flex: 0 0 auto;\n}\n\n:host([sticky]) {\n    position: sticky;\n    top: var(--wje-toolbar-top);\n    z-index: 99;\n}\n";
 class Toolbar extends WJElement {
   /**
    * Creates an instance of Toolbar.

package/dist/wje-tooltip.js

@@ -3,7 +3,7 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 import WJElement from "./wje-element.js";
 import "./wje-popup.js";
-import { P as Popup } from "./popup.element-C8-g3WLs.js";
+import { P as Popup } from "./popup.element-CwXvVFK7.js";
 import { event } from "./event.js";
 const styles = "/*\n[ WJ Tooltip ]\n*/\n\n.native-tooltip {\n    display: flex;\n    align-items: center;\n    padding: var(--wje-tooltip-spacing);\n    color: var(--wje-tooltip-color);\n    background-color: var(--wje-tooltip-background);\n    font-weight: var(--wje-tooltip-font-weight);\n    font-size: var(--wje-tooltip-font-size);\n    border-radius: var(--wje-tooltip-border-radius);\n    line-height: var(--wje-tooltip-line-height);\n    box-sizing: border-box;\n    box-shadow: var(--wje-tooltip-shadow);\n}\n\n::slotted([slot='start']) {\n    margin: 0 0.3rem 0 0;\n}\n\n::slotted([slot='end']) {\n    margin: 0 0 0 0.3rem;\n}\n\n.arrow {\n    position: absolute;\n    width: 10px;\n    height: 10px;\n    background: var(--wje-tooltip-arrow-color);\n    transform: rotate(45deg);\n}\n";
 const _Tooltip = class _Tooltip extends WJElement {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "wj-elements",
   "description": "WebJET Elements is a modern set of user interface tools harnessing the power of web components designed to simplify web application development.",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "homepage": "https://github.com/lencys/wj-elements",
   "author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
   "license": "MIT",
@@ -73,6 +73,7 @@
     "test:relative-time": "web-test-runner --files packages/wje-relative-time/relative-time.test.js",
     "test:select": "web-test-runner --files packages/wje-select/select.test.js",
     "test:slider": "web-test-runner --files packages/wje-slider/slider.test.js",
+    "test:sliding-container": "web-test-runner --files packages/wje-sliding-container/sliding-container.test.js",
     "test:status": "web-test-runner --files packages/wje-status/status.test.js",
     "test:tab-group": "web-test-runner --files packages/wje-tab-group/tab-group.test.js",
     "test:textarea": "web-test-runner --files packages/wje-textarea/textarea.test.js",