wj-elements 0.7.6 → 0.8.0

package/dist/wje-dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-dialog.js","sources":["../packages/wje-dialog/dialog.element.js","../packages/wje-dialog/dialog.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport '../wje-button/button.element.js';\nimport '../wje-icon/icon.element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Dialog` is a custom web component that represents a dialog.\n * @summary This element represents a dialog.\n * @documentation https://elements.webjet.sk/components/dialog\n * @status stable\n * @augments {WJElement}\n * @slot header - Slot for the header content.\n * @slot body - Slot for the body content.\n * @slot footer - Slot for the footer content.\n * @csspart dialog - The dialog wrapper.\n * @csspart header - The header of the dialog.\n * @csspart body - The body of the dialog.\n * @csspart footer - The footer of the dialog.\n * @csspart close - The close button of the dialog.\n * @cssproperty [--wje-dialog-background=var(--wje-background-color)] - Specifies the background color of the dialog.\n * @cssproperty [--wje-dialog-color=var(--wje-text-color)] - Defines the text color within the dialog.\n * @cssproperty [--wje-dialog-padding=1rem] - Controls the padding inside the dialog.\n * @cssproperty [--wje-dialog-border-radius=0.5rem] - Sets the border radius for the dialog's corners.\n * @cssproperty [--wje-dialog-box-shadow=0 2px 10px rgba(0, 0, 0, 0.1)] - Applies a shadow effect to the dialog.\n * @tag wje-dialog\n */\n\nexport default class Dialog extends WJElement {\n    static _instanceId = 0;\n    /**\n     * @class\n     */\n    constructor() {\n        super();\n        this._instanceId = ++Dialog._instanceId;\n        this._opening = false;\n    }\n\n    /**\n     * Sets the value of the 'headline' attribute.\n     * @param {string} value The new value for the 'headline' attribute.\n     */\n    set headline(value) {\n        this.setAttribute('headline', value);\n    }\n\n    /**\n     * Retrieves the value of the \"headline\" attribute from the element.\n     * If the \"headline\" attribute is not present, returns an empty string.\n     * @returns {string} The headline attribute value or an empty string if not set.\n     */\n    get headline() {\n        return this.getAttribute('headline') || '';\n    }\n\n    /**\n     * Sets the headline of the dialog.\n     * @param value\n     */\n    set placement(value) {\n        this.setAttribute('placement', value);\n    }\n\n    /**\n     * Gets the headline of the dialog.\n     * @returns {string|string}\n     */\n    get placement() {\n        return this.getAttribute('placement') || 'slide-up';\n    }\n\n    /**\n     * Sets the headline of the dialog.\n     * @param value\n     */\n    set async(value) {\n        this.setAttribute('async', '');\n    }\n\n    /**\n     * Gets the headline of the dialog.\n     * @returns {boolean}\n     */\n    get async() {\n        return this.hasAttribute('async');\n    }\n\n    /**\n     * Sets the headline of the dialog.\n     * @param value\n     */\n    set closeHidden(value) {\n        if (value) this.setAttribute('close-hidden', '');\n    }\n\n    /**\n     * Gets the headline of the dialog.\n     * @returns {boolean}\n     */\n    get closeHidden() {\n        return !!this.hasAttribute('close-hidden');\n    }\n\n    set hiddenHeader(value) {\n        if (value) this.setAttribute('hidden-header', '');\n    }\n\n    get hiddenHeader() {\n        return !!this.hasAttribute('hidden-header');\n    }\n\n    set hiddenFooter(value) {\n        if (value) this.setAttribute('hidden-footer', '');\n    }\n\n    get hiddenFooter() {\n        return !!this.hasAttribute('hidden-footer');\n    }\n\n    /**\n     * Sets the headline of the dialog.\n     * @type {string}\n     */\n    className = 'Dialog';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @returns {*}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @returns {*[]}\n     */\n    static get observedAttributes() {\n        return [];\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.\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        this.classList.add('fade', this.placement, params.size);\n\n        let dialog = document.createElement('dialog');\n        dialog.setAttribute('part', 'dialog');\n        dialog.classList.add('modal-dialog');\n        dialog.addEventListener('close', this.onNativeDialogClose);\n\n        fragment.appendChild(dialog);\n\n        this.dialog = dialog;\n        this.syncHostOpenState();\n\n        return fragment;\n    }\n\n    /**\n     * Draws the component after it has been drawn.\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     */\n    afterDraw(context, store, params) {\n        if (params.trigger) {\n            event.addListener(document, params.trigger, null, this.onOpen);\n        }\n    }\n\n    /**\n     * Creates the dialog body.\n     * @param dialog\n     */\n    htmlDialogBody(dialog) {\n        const dialogId = this.id || `wje-dialog-${this._instanceId}`;\n        dialog.replaceChildren();\n\n        let icon = document.createElement('wje-icon');\n        icon.setAttribute('name', 'x');\n        icon.setAttribute('slot', 'icon-only');\n\n        let close = document.createElement('wje-button');\n        close.setAttribute('fill', 'link');\n        close.setAttribute('size', 'small');\n        close.setAttribute('part', 'close');\n        close.setAttribute('aria-label', 'Close dialog');\n        close.addEventListener('click', (e) => {\n            this.close(e);\n        });\n\n        let header = document.createElement('div');\n        header.setAttribute('part', 'header');\n        header.classList.add('dialog-header');\n        header.id = `${dialogId}-header`;\n        if (this.hasAttribute('headline'))\n            header.innerHTML = `<span part=\"headline\">${this.headline}</span>`;\n\n        let slotHeader = document.createElement('slot');\n        slotHeader.setAttribute('name', 'header');\n\n        const headerActions = document.createElement('div');\n        headerActions.classList.add('header-actions');\n        headerActions.setAttribute('part', 'header-actions');\n        headerActions.appendChild(slotHeader);\n\n        let contentSlot = document.createElement('slot');\n\n        let body = document.createElement('div');\n        body.setAttribute('part', 'body');\n        body.classList.add('dialog-content');\n        body.id = `${dialogId}-body`;\n\n        let footer = document.createElement('div');\n        footer.setAttribute('part', 'footer');\n        footer.classList.add('dialog-footer');\n        footer.innerHTML = '';\n\n        let slotFooter = document.createElement('slot');\n        slotFooter.setAttribute('name', 'footer');\n        slotFooter.id = 'footerSlot';\n        slotFooter.addEventListener('slotchange', () => this.updateHasFooter());\n\n        close.appendChild(icon);\n\n        if (!this.closeHidden) header.appendChild(close);\n\n        header.appendChild(headerActions);\n        body.appendChild(contentSlot);\n        footer.appendChild(slotFooter);\n\n        if (!this.hiddenHeader) dialog.appendChild(header);\n        dialog.appendChild(body);\n        if (!this.hiddenFooter) dialog.appendChild(footer);\n\n        dialog.setAttribute('role', 'dialog');\n        dialog.setAttribute('aria-describedby', body.id);\n        if (!this.hiddenHeader) {\n            dialog.setAttribute('aria-labelledby', header.id);\n            dialog.removeAttribute('aria-label');\n        } else {\n            dialog.removeAttribute('aria-labelledby');\n            if (this.headline) {\n                dialog.setAttribute('aria-label', this.headline);\n            } else {\n                dialog.removeAttribute('aria-label');\n            }\n        }\n\n        Promise.resolve().then(() => this.updateHasFooter());\n    }\n\n    /**\n     * Closes the dialog.\n     * @param e\n     */\n    close(e) {\n        this.onClose(e);\n    }\n\n    /**\n     * Before the component is disconnected.\n     */\n    beforeDisconnect() {\n        if (this.params?.trigger) {\n            event.removeListener(document, this.params?.trigger, null, this.onOpen);\n        }\n\n        this.dialog?.removeEventListener('close', this.onNativeDialogClose);\n    }\n\n    /**\n     * Before the dialog opens.\n     */\n    beforeOpen(dialog, trigger) {\n        // Hook for extending behavior before the dialog opens\n    }\n\n    /**\n     * After the dialog opens.\n     */\n    afterOpen(dialog, trigger) {\n        // Hook for extending behavior after the dialog opens\n    }\n\n    /**\n     * Before the dialog closes.\n     */\n    beforeClose(dialog, trigger) {\n        // Hook for extending behavior before the dialog closes\n    }\n\n    /**\n     * After the dialog closes.\n     */\n    afterClose(dialog, trigger) {\n        // Hook for extending behavior after the dialog closes\n    }\n\n    /**\n     * Opens the dialog.\n     * @param e\n     */\n    onOpen = (e) => {\n        if (!this.dialog || this.dialog.open || this._opening) return;\n        this._opening = true;\n\n        setTimeout(() => {\n            Promise.resolve().then(() => this.beforeOpen(this, e)).then(() => {\n                if (!this.dialog || this.dialog.open) return;\n                this.dialog.replaceChildren();\n                this.htmlDialogBody(this.dialog);\n\n                this.dialog.showModal(); // Now open the dialog\n                this.syncHostOpenState();\n                this.dialog.setAttribute('aria-modal', 'true');\n\n                if (this.dialog.open) {\n                    Promise.resolve(this.afterOpen(this, e));\n                }\n            }).catch((err) => {\n                console.error(err);\n            }).finally(() => {\n                this._opening = false;\n            });\n        }, 0);\n    }\n\n    /**\n     * Closes the dialog.\n     * @param {object} e\n     */\n    onClose = (e) => {\n        Promise.resolve(this.beforeClose(this, e)).then((res) => {\n            if (!this.dialog || typeof this.dialog.close !== 'function') return;\n\n            if (this.dialog.open) {\n                this.dialog.close(); // Now close the dialog\n            }\n            this.dialog.removeAttribute('aria-modal');\n            this.syncHostOpenState();\n\n            if (!this.dialog.open) {\n                Promise.resolve(this.afterClose(this, e));\n            }\n        });\n    };\n\n    onNativeDialogClose = () => {\n        this.dialog?.removeAttribute('aria-modal');\n        this.removeAttribute('open');\n    };\n\n    syncHostOpenState = () => {\n        this.toggleAttribute('open', !!this.dialog?.open);\n    };\n\n    /**\n     * Registers an event listener on the provided button that triggers a blocking UI element\n     * and executes a given promise when the button is clicked.\n     * @param {HTMLElement} button The button element to attach the event listener to.\n     * @param {Function} promise A function that returns a promise to be executed when the button is clicked.\n     */\n    registerBlockingEvent(button, promise) {\n        button.addEventListener('wje-button:click', async (e) => {\n            let blockingElement = document.createElement('div');\n            blockingElement.classList.add('blocking-element');\n\n            let icon = document.createElement('wje-icon');\n            icon.setAttribute('name', 'loader-2');\n            icon.setAttribute('size', '2x-large');\n\n            blockingElement.appendChild(icon);\n\n            let scrollOffset = this.dialog.scrollTop;\n            blockingElement.style.top = `${scrollOffset}px`;\n            blockingElement.style.bottom = `-${scrollOffset}px`;\n\n            this.dialog.appendChild(blockingElement);\n\n            await promise()\n                .then((res) => {\n                    this.close();\n                    blockingElement.remove();\n                })\n                .catch((err) => {\n                    console.error(err);\n                    blockingElement.remove();\n                });\n        });\n    }\n\n    updateHasFooter() {\n        // If footer is intentionally hidden, ensure it doesn't reserve space\n        if (this.hiddenFooter) {\n            const footerEl = this.shadowRoot?.querySelector('.dialog-footer');\n            if (footerEl) footerEl.setAttribute('hidden', '');\n            this.removeAttribute('has-footer');\n            return;\n        }\n        const slot = this.shadowRoot?.getElementById('footerSlot');\n        if (!slot) {\n            this.removeAttribute('has-footer');\n            return;\n        }\n\n        const assigned = slot.assignedNodes({ flatten: true });\n        const hasContent = assigned.some((n) => {\n            if (n.nodeType === Node.ELEMENT_NODE) return true;\n            if (n.nodeType === Node.TEXT_NODE) return n.textContent.trim().length > 0;\n            return false;\n        });\n\n        // Prefer toggling the actual footer element so CSS/spacing is always correct\n        const footerEl = this.shadowRoot?.querySelector('.dialog-footer');\n        if (footerEl) footerEl.toggleAttribute('hidden', !hasContent);\n\n        // Keep host attribute too (harmless, may be used elsewhere)\n        this.toggleAttribute('has-footer', hasContent);\n    }\n}\n","import Dialog from './dialog.element.js';\n\nexport default Dialog;\n\nDialog.define('wje-dialog', Dialog);\n"],"names":["footerEl"],"mappings":"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"}
+{"version":3,"file":"wje-dialog.js","sources":["../packages/wje-dialog/dialog.element.js","../packages/wje-dialog/dialog.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport '../wje-button/button.element.js';\nimport '../wje-icon/icon.element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `Dialog` is a custom web component that represents a dialog.\n * @summary This element represents a dialog.\n * @documentation https://elements.webjet.sk/components/dialog\n * @status stable\n * @augments {WJElement}\n * @slot header - Slot for the header content.\n * @slot body - Slot for the body content.\n * @slot footer - Slot for the footer content.\n * @csspart dialog - The dialog wrapper.\n * @csspart header - The header of the dialog.\n * @csspart body - The body of the dialog.\n * @csspart footer - The footer of the dialog.\n * @csspart close - The close button of the dialog.\n * @cssproperty [--wje-dialog-background=var(--wje-background-color)] - Specifies the background color of the dialog.\n * @cssproperty [--wje-dialog-color=var(--wje-text-color)] - Defines the text color within the dialog.\n * @cssproperty [--wje-dialog-padding=1rem] - Controls the padding inside the dialog.\n * @cssproperty [--wje-dialog-border-radius=0.5rem] - Sets the border radius for the dialog's corners.\n * @cssproperty [--wje-dialog-box-shadow=0 2px 10px rgba(0, 0, 0, 0.1)] - Applies a shadow effect to the dialog.\n * @tag wje-dialog\n */\n\nexport default class Dialog extends WJElement {\n    static _instanceId = 0;\n    /**\n     * @class\n     */\n    constructor() {\n        super();\n        this._instanceId = ++Dialog._instanceId;\n        this._opening = false;\n    }\n\n    /**\n     * Sets the value of the 'headline' attribute.\n     * @param {string} value The new value for the 'headline' attribute.\n     */\n    set headline(value) {\n        this.setAttribute('headline', value);\n    }\n\n    /**\n     * Retrieves the value of the \"headline\" attribute from the element.\n     * If the \"headline\" attribute is not present, returns an empty string.\n     * @returns {string} The headline attribute value or an empty string if not set.\n     */\n    get headline() {\n        return this.getAttribute('headline') || '';\n    }\n\n    /**\n     * Sets the headline of the dialog.\n     * @param value\n     */\n    set placement(value) {\n        this.setAttribute('placement', value);\n    }\n\n    /**\n     * Gets the headline of the dialog.\n     * @returns {string|string}\n     */\n    get placement() {\n        return this.getAttribute('placement') || 'slide-up';\n    }\n\n    /**\n     * Sets the headline of the dialog.\n     * @param value\n     */\n    set async(value) {\n        this.setAttribute('async', '');\n    }\n\n    /**\n     * Gets the headline of the dialog.\n     * @returns {boolean}\n     */\n    get async() {\n        return this.hasAttribute('async');\n    }\n\n    /**\n     * Sets the headline of the dialog.\n     * @param value\n     */\n    set closeHidden(value) {\n        if (value) this.setAttribute('close-hidden', '');\n    }\n\n    /**\n     * Gets the headline of the dialog.\n     * @returns {boolean}\n     */\n    get closeHidden() {\n        return !!this.hasAttribute('close-hidden');\n    }\n\n    set hiddenHeader(value) {\n        if (value) this.setAttribute('hidden-header', '');\n    }\n\n    get hiddenHeader() {\n        return !!this.hasAttribute('hidden-header');\n    }\n\n    set hiddenFooter(value) {\n        if (value) this.setAttribute('hidden-footer', '');\n    }\n\n    get hiddenFooter() {\n        return !!this.hasAttribute('hidden-footer');\n    }\n\n    /**\n     * Sets the headline of the dialog.\n     * @type {string}\n     */\n    className = 'Dialog';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @returns {*}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @returns {*[]}\n     */\n    static get observedAttributes() {\n        return [];\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.\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        this.classList.add('fade', this.placement, params.size);\n\n        let dialog = document.createElement('dialog');\n        dialog.setAttribute('part', 'dialog');\n        dialog.classList.add('modal-dialog');\n        dialog.addEventListener('close', this.onNativeDialogClose);\n\n        fragment.appendChild(dialog);\n\n        this.dialog = dialog;\n        this.syncHostOpenState();\n\n        return fragment;\n    }\n\n    /**\n     * Draws the component after it has been drawn.\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     */\n    afterDraw(context, store, params) {\n        if (params.trigger) {\n            event.addListener(document, params.trigger, null, this.onOpen);\n        }\n    }\n\n    /**\n     * Creates the dialog body.\n     * @param dialog\n     */\n    htmlDialogBody(dialog) {\n        const dialogId = this.id || `wje-dialog-${this._instanceId}`;\n        dialog.replaceChildren();\n\n        let icon = document.createElement('wje-icon');\n        icon.setAttribute('name', 'x');\n        icon.setAttribute('slot', 'icon-only');\n\n        let close = document.createElement('wje-button');\n        close.setAttribute('fill', 'link');\n        close.setAttribute('size', 'small');\n        close.setAttribute('part', 'close');\n        close.setAttribute('label', 'Close dialog');\n        close.addEventListener('click', (e) => {\n            this.close(e);\n        });\n\n        let header = document.createElement('div');\n        header.setAttribute('part', 'header');\n        header.classList.add('dialog-header');\n        header.id = `${dialogId}-header`;\n        if (this.hasAttribute('headline'))\n            header.innerHTML = `<span part=\"headline\">${this.headline}</span>`;\n\n        let slotHeader = document.createElement('slot');\n        slotHeader.setAttribute('name', 'header');\n\n        const headerActions = document.createElement('div');\n        headerActions.classList.add('header-actions');\n        headerActions.setAttribute('part', 'header-actions');\n        headerActions.appendChild(slotHeader);\n\n        let contentSlot = document.createElement('slot');\n\n        let body = document.createElement('div');\n        body.setAttribute('part', 'body');\n        body.classList.add('dialog-content');\n        body.id = `${dialogId}-body`;\n\n        let footer = document.createElement('div');\n        footer.setAttribute('part', 'footer');\n        footer.classList.add('dialog-footer');\n        footer.innerHTML = '';\n\n        let slotFooter = document.createElement('slot');\n        slotFooter.setAttribute('name', 'footer');\n        slotFooter.id = 'footerSlot';\n        slotFooter.addEventListener('slotchange', () => this.updateHasFooter());\n\n        close.appendChild(icon);\n\n        if (!this.closeHidden) header.appendChild(close);\n\n        header.appendChild(headerActions);\n        body.appendChild(contentSlot);\n        footer.appendChild(slotFooter);\n\n        if (!this.hiddenHeader) dialog.appendChild(header);\n        dialog.appendChild(body);\n        if (!this.hiddenFooter) dialog.appendChild(footer);\n\n        dialog.setAttribute('role', 'dialog');\n        dialog.setAttribute('aria-describedby', body.id);\n        if (!this.hiddenHeader) {\n            dialog.setAttribute('aria-labelledby', header.id);\n            dialog.removeAttribute('aria-label');\n        } else {\n            dialog.removeAttribute('aria-labelledby');\n            if (this.headline) {\n                dialog.setAttribute('aria-label', this.headline);\n            } else {\n                dialog.removeAttribute('aria-label');\n            }\n        }\n\n        Promise.resolve().then(() => this.updateHasFooter());\n    }\n\n    /**\n     * Closes the dialog.\n     * @param e\n     */\n    close(e) {\n        this.onClose(e);\n    }\n\n    /**\n     * Before the component is disconnected.\n     */\n    beforeDisconnect() {\n        if (this.params?.trigger) {\n            event.removeListener(document, this.params?.trigger, null, this.onOpen);\n        }\n\n        this.dialog?.removeEventListener('close', this.onNativeDialogClose);\n    }\n\n    /**\n     * Before the dialog opens.\n     */\n    beforeOpen(dialog, trigger) {\n        // Hook for extending behavior before the dialog opens\n    }\n\n    /**\n     * After the dialog opens.\n     */\n    afterOpen(dialog, trigger) {\n        // Hook for extending behavior after the dialog opens\n    }\n\n    /**\n     * Before the dialog closes.\n     */\n    beforeClose(dialog, trigger) {\n        // Hook for extending behavior before the dialog closes\n    }\n\n    /**\n     * After the dialog closes.\n     */\n    afterClose(dialog, trigger) {\n        // Hook for extending behavior after the dialog closes\n    }\n\n    /**\n     * Opens the dialog.\n     * @param e\n     */\n    onOpen = (e) => {\n        if (!this.dialog || this.dialog.open || this._opening) return;\n        this._opening = true;\n\n        setTimeout(() => {\n            Promise.resolve().then(() => this.beforeOpen(this, e)).then(() => {\n                if (!this.dialog || this.dialog.open) return;\n                this.dialog.replaceChildren();\n                this.htmlDialogBody(this.dialog);\n\n                this.dialog.showModal(); // Now open the dialog\n                this.syncHostOpenState();\n                this.dialog.setAttribute('aria-modal', 'true');\n\n                if (this.dialog.open) {\n                    Promise.resolve(this.afterOpen(this, e));\n                }\n            }).catch((err) => {\n                console.error(err);\n            }).finally(() => {\n                this._opening = false;\n            });\n        }, 0);\n    }\n\n    /**\n     * Closes the dialog.\n     * @param {object} e\n     */\n    onClose = (e) => {\n        Promise.resolve(this.beforeClose(this, e)).then((res) => {\n            if (!this.dialog || typeof this.dialog.close !== 'function') return;\n\n            if (this.dialog.open) {\n                this.dialog.close(); // Now close the dialog\n            }\n            this.dialog.removeAttribute('aria-modal');\n            this.syncHostOpenState();\n\n            if (!this.dialog.open) {\n                Promise.resolve(this.afterClose(this, e));\n            }\n        });\n    };\n\n    onNativeDialogClose = () => {\n        this.dialog?.removeAttribute('aria-modal');\n        this.removeAttribute('open');\n    };\n\n    syncHostOpenState = () => {\n        this.toggleAttribute('open', !!this.dialog?.open);\n    };\n\n    /**\n     * Registers an event listener on the provided button that triggers a blocking UI element\n     * and executes a given promise when the button is clicked.\n     * @param {HTMLElement} button The button element to attach the event listener to.\n     * @param {Function} promise A function that returns a promise to be executed when the button is clicked.\n     */\n    registerBlockingEvent(button, promise) {\n        button.addEventListener('wje-button:click', async (e) => {\n            let blockingElement = document.createElement('div');\n            blockingElement.classList.add('blocking-element');\n\n            let icon = document.createElement('wje-icon');\n            icon.setAttribute('name', 'loader-2');\n            icon.setAttribute('size', '2x-large');\n\n            blockingElement.appendChild(icon);\n\n            let scrollOffset = this.dialog.scrollTop;\n            blockingElement.style.top = `${scrollOffset}px`;\n            blockingElement.style.bottom = `-${scrollOffset}px`;\n\n            this.dialog.appendChild(blockingElement);\n\n            await promise()\n                .then((res) => {\n                    this.close();\n                    blockingElement.remove();\n                })\n                .catch((err) => {\n                    console.error(err);\n                    blockingElement.remove();\n                });\n        });\n    }\n\n    updateHasFooter() {\n        // If footer is intentionally hidden, ensure it doesn't reserve space\n        if (this.hiddenFooter) {\n            const footerEl = this.shadowRoot?.querySelector('.dialog-footer');\n            if (footerEl) footerEl.setAttribute('hidden', '');\n            this.removeAttribute('has-footer');\n            return;\n        }\n        const slot = this.shadowRoot?.getElementById('footerSlot');\n        if (!slot) {\n            this.removeAttribute('has-footer');\n            return;\n        }\n\n        const assigned = slot.assignedNodes({ flatten: true });\n        const hasContent = assigned.some((n) => {\n            if (n.nodeType === Node.ELEMENT_NODE) return true;\n            if (n.nodeType === Node.TEXT_NODE) return n.textContent.trim().length > 0;\n            return false;\n        });\n\n        // Prefer toggling the actual footer element so CSS/spacing is always correct\n        const footerEl = this.shadowRoot?.querySelector('.dialog-footer');\n        if (footerEl) footerEl.toggleAttribute('hidden', !hasContent);\n\n        // Keep host attribute too (harmless, may be used elsewhere)\n        this.toggleAttribute('has-footer', hasContent);\n    }\n}\n","import Dialog from './dialog.element.js';\n\nexport default Dialog;\n\nDialog.define('wje-dialog', Dialog);\n"],"names":["Dialog","WJElement","constructor","super","className","onOpen","e","this","dialog","open","_opening","setTimeout","Promise","resolve","then","beforeOpen","replaceChildren","htmlDialogBody","showModal","syncHostOpenState","setAttribute","afterOpen","catch","err","console","error","finally","onClose","beforeClose","res","close","removeAttribute","afterClose","onNativeDialogClose","toggleAttribute","_instanceId","value","getAttribute","placement","hasAttribute","closeHidden","hiddenHeader","hiddenFooter","observedAttributes","setupAttributes","isShadowRoot","context","store","params","fragment","document","createDocumentFragment","classList","add","size","createElement","addEventListener","appendChild","trigger","event","addListener","dialogId","id","icon","header","innerHTML","headline","slotHeader","headerActions","contentSlot","body","footer","slotFooter","updateHasFooter","beforeDisconnect","removeListener","removeEventListener","button","promise","async","blockingElement","scrollOffset","scrollTop","style","top","bottom","remove","footerEl","shadowRoot","querySelector","slot","getElementById","hasContent","assignedNodes","flatten","some","n","nodeType","Node","ELEMENT_NODE","TEXT_NODE","textContent","trim","length","static","define"],"mappings":"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"}

package/dist/wje-divider.js

@@ -1,55 +1,28 @@
 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 Divider ]\n*/\n\n:host(:not([vertical])) {\n    display: block;\n    border-top: var(--wje-divider-border-width) var(--wje-divider-border-style) var(--wje-divider-border-color);\n    margin: var(--wje-divider-spacing) 0;\n}\n\n:host([vertical]) {\n    display: inline-block;\n    height: 100%;\n    border-left: var(--wje-divider-border-width) var(--wje-divider-border-style) var(--wje-divider-border-color);\n    margin: 0 var(--wje-divider-spacing);\n}\n";
-class Divider extends WJElement {
-  /**
-   * Constructor for the Divider class.
-   */
+import e from "./wje-element.js";
+class r extends e {
   constructor() {
     super();
-    /**
-     * The class name for the Divider class.
-     * @type {string}
-     */
     __publicField(this, "className", "Divider");
   }
-  /**
-   * Getter for the CSS stylesheet.
-   * @returns {string} The CSS stylesheet.
-   */
   static get cssStyleSheet() {
-    return styles;
+    return ":host(:not([vertical])){display:block;border-top:var(--wje-divider-border-width) var(--wje-divider-border-style) var(--wje-divider-border-color);margin:var(--wje-divider-spacing) 0}:host([vertical]){display:inline-block;height:100%;border-left:var(--wje-divider-border-width) var(--wje-divider-border-style) var(--wje-divider-border-color);margin:0 var(--wje-divider-spacing)}";
   }
-  /**
-   * Getter for the observed attributes.
-   * @returns {Array} An empty array as there are no observed attributes.
-   */
   static get observedAttributes() {
     return [];
   }
-  /**
-   * Sets up the attributes for the Divider.
-   */
   setupAttributes() {
     this.isShadowRoot = "open";
   }
-  /**
-   * Draws the Divider.
-   * @returns {DocumentFragment} The created document fragment.
-   */
   draw() {
-    let fragment = document.createDocumentFragment();
-    let native = document.createElement("div");
-    let slot = document.createElement("slot");
-    native.appendChild(slot);
-    fragment.appendChild(native);
-    return fragment;
+    let e2 = document.createDocumentFragment(), r2 = document.createElement("div"), t = document.createElement("slot");
+    return r2.appendChild(t), e2.appendChild(r2), e2;
   }
 }
-Divider.define("wje-divider", Divider);
+r.define("wje-divider", r);
 export {
-  Divider as default
+  r as default
 };
 //# sourceMappingURL=wje-divider.js.map

package/dist/wje-divider.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-divider.js","sources":["../packages/wje-divider/divider.element.js","../packages/wje-divider/divider.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary Divider is a custom web component that extends WJElement.\n * It provides a simple divider line that can be used to separate content.\n * @documentation https://elements.webjet.sk/components/divider\n * @status stable\n * @augments WJElement\n * @slot - This is a default/unnamed slot.\n * @cssproperty [--wje-border-width=1px] - The size of the border.\n * @cssproperty [--wje-divider-border-color=var(--wje-border-color)] - The color of the divider borderline.\n * @cssproperty [--wje-divider-border-width=var(--wje-border-width, 1px)] - The width of the divider borderline.\n * @cssproperty [--wje-divider-spacing=0] - The spacing for the divider.\n * @tag wje-divider\n * @tag wje-divider\n */\nexport default class Divider extends WJElement {\n    /**\n     * Constructor for the Divider class.\n     */\n    constructor() {\n        super();\n    }\n\n    /**\n     * The class name for the Divider class.\n     * @type {string}\n     */\n    className = 'Divider';\n\n    /**\n     * Getter for the CSS stylesheet.\n     * @returns {string} The CSS stylesheet.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for the observed attributes.\n     * @returns {Array} An empty array as there are no observed attributes.\n     */\n    static get observedAttributes() {\n        return [];\n    }\n\n    /**\n     * Sets up the attributes for the Divider.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the Divider.\n     * @returns {DocumentFragment} The created document fragment.\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        let slot = document.createElement('slot');\n\n        native.appendChild(slot);\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n}\n","import Divider from './divider.element.js';\n\nexport default Divider;\n\nDivider.define('wje-divider', Divider);\n"],"names":[],"mappings":";;;;;AAiBe,MAAM,gBAAgB,UAAU;AAAA;AAAA;AAAA;AAAA,EAI3C,cAAc;AACV,UAAK;AAOT;AAAA;AAAA;AAAA;AAAA,qCAAY;AAAA,EANZ;AAAA;AAAA;AAAA;AAAA;AAAA,EAYA,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACX;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,WAAW,qBAAqB;AAC5B,WAAO,CAAA;AAAA,EACX;AAAA;AAAA;AAAA;AAAA,EAKA,kBAAkB;AACd,SAAK,eAAe;AAAA,EACxB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,OAAO;AACH,QAAI,WAAW,SAAS,uBAAsB;AAE9C,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,QAAI,OAAO,SAAS,cAAc,MAAM;AAExC,WAAO,YAAY,IAAI;AACvB,aAAS,YAAY,MAAM;AAE3B,WAAO;AAAA,EACX;AACJ;ACjEA,QAAQ,OAAO,eAAe,OAAO;"}
+{"version":3,"file":"wje-divider.js","sources":["../packages/wje-divider/divider.element.js","../packages/wje-divider/divider.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary Divider is a custom web component that extends WJElement.\n * It provides a simple divider line that can be used to separate content.\n * @documentation https://elements.webjet.sk/components/divider\n * @status stable\n * @augments WJElement\n * @slot - This is a default/unnamed slot.\n * @cssproperty [--wje-border-width=1px] - The size of the border.\n * @cssproperty [--wje-divider-border-color=var(--wje-border-color)] - The color of the divider borderline.\n * @cssproperty [--wje-divider-border-width=var(--wje-border-width, 1px)] - The width of the divider borderline.\n * @cssproperty [--wje-divider-spacing=0] - The spacing for the divider.\n * @tag wje-divider\n * @tag wje-divider\n */\nexport default class Divider extends WJElement {\n    /**\n     * Constructor for the Divider class.\n     */\n    constructor() {\n        super();\n    }\n\n    /**\n     * The class name for the Divider class.\n     * @type {string}\n     */\n    className = 'Divider';\n\n    /**\n     * Getter for the CSS stylesheet.\n     * @returns {string} The CSS stylesheet.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for the observed attributes.\n     * @returns {Array} An empty array as there are no observed attributes.\n     */\n    static get observedAttributes() {\n        return [];\n    }\n\n    /**\n     * Sets up the attributes for the Divider.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Draws the Divider.\n     * @returns {DocumentFragment} The created document fragment.\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        let slot = document.createElement('slot');\n\n        native.appendChild(slot);\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n}\n","import Divider from './divider.element.js';\n\nexport default Divider;\n\nDivider.define('wje-divider', Divider);\n"],"names":["Divider","WJElement","super","className","cssStyleSheet","observedAttributes","setupAttributes","this","isShadowRoot","draw","fragment","document","createDocumentFragment","native","createElement","slot","appendChild","define"],"mappings":";;;;AAiBe,MAAMA,UAAgBC,EAAAA;AAAAA,EAIjC;AACIC,UAAAA;AAOJC,qCAAY;AAAA,EANZ;AAAA,EAYA,WAAA,gBAAWC;AACP;EACJ;AAAA,EAMA,WAAA,qBAAWC;AACP,WAAO,CAAA;AAAA,EACX;AAAA,EAKA,kBAAAC;AACIC,SAAKC,eAAe;AAAA,EACxB;AAAA,EAMA,OAAAC;AACI,QAAIC,KAAWC,SAASC,uBAAAA,GAEpBC,KAASF,SAASG,cAAc,KAAA,GAChCC,IAAOJ,SAASG,cAAc,MAAA;AAKlC,WAHAD,GAAOG,YAAYD,CAAAA,GACnBL,GAASM,YAAYH,EAAAA,GAEdH;AAAAA,EACX;AAAA;AChEJV,EAAQiB,OAAO,eAAejB,CAAAA;"}