wj-elements 0.7.7 → 0.8.0

package/dist/wje-tree.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-tree.js","sources":["../packages/wje-tree/tree.element.js","../packages/wje-tree/tree.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n// @fires wje-tree:move - Dispatched when a tree item is moved.\n/**\n * `Tree` is a custom web component that represents a hierarchical tree structure.\n * It extends from `WJElement`.\n * @summary This element visually represents a tree structure, supporting single or multiple selection modes and hierarchy management.\n * @documentation https://elements.webjet.sk/components/tree\n * @status stable\n * @augments {WJElement}\n * @attribute {boolean} reorder - Enables moving tree items by dragging direct start slot content.\n * @csspart native - The native container part of the tree.\n * @slot - The default slot to place `wje-tree-item` child components.\n * @tag wje-tree\n */\n\nexport default class Tree extends WJElement {\n    /**\n     * Creates an instance of Tree.\n     */\n    constructor() {\n        super();\n\n        this.draggedItem = null;\n        this.dropTarget = null;\n        this.dropPosition = null;\n    }\n\n    /**\n     * Sets the selection attribute for the element.\n     * @param {string} value The value to set as the selection attribute.\n     */\n    set selection(value) {\n        this.setAttribute('selection', value);\n    }\n\n    /**\n     * Gets the current selection mode for the element.\n     * If no selection is explicitly set, it defaults to 'single'.\n     * @returns {string} The current selection mode, either set by the element's attribute or the default value 'single'.\n     */\n    get selection() {\n        return this.getAttribute('selection') || 'single';\n    }\n\n    /**\n     * Enables reordering tree items by dragging an element assigned to the start slot.\n     * @param {boolean} value Whether reordering is enabled.\n     */\n    set reorder(value) {\n        if (value) this.setAttribute('reorder', '');\n        else this.removeAttribute('reorder');\n    }\n\n    /**\n     * Indicates whether tree items can be reordered with the start slot handle.\n     * @returns {boolean}\n     */\n    get reorder() {\n        return this.hasAttribute('reorder');\n    }\n\n    /**\n     * The class name for the component.\n     * @type {string}\n     */\n    className = 'Tree';\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     * Setup attributes for the Button element.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        this.syncAria();\n    }\n\n    /**\n     * A method called before the drawing or rendering process of tree items.\n     * It iterates through all `wje-tree-item` elements, updating their selection state\n     * and managing their expand/collapse icons accordingly.\n     * @returns {void} This method does not return a value.\n     */\n    beforeDraw() {\n        const template = this.querySelector('template');\n        const items = this.querySelectorAll('wje-tree-item');\n        items?.forEach((item) => {\n            item.selection = this.selection;\n            item.syncNestingState?.();\n\n            this.appendTemplateSlot(item, template, 'expand');\n            this.appendTemplateSlot(item, template, 'collapse');\n            this.appendTemplateSlot(item, template, 'start');\n            this.appendTemplateSlot(item, template, 'end');\n\n            if (this.reorder) this.setupReorderHandle(item);\n        });\n    }\n\n    /**\n     * Draw method for the tree.\n     * @returns {object} Document fragment\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-tree');\n\n        let slot = document.createElement('slot');\n\n        native.appendChild(slot);\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Called after the draw process of the component is completed.\n     * Typically used to add event listeners or perform operations\n     * that are dependent on the component's drawn state.\n     * @returns {void} This method does not return a value.\n     */\n    afterDraw() {\n        this.addEventListener('click', this.handleClick);\n        this.addEventListener('dragstart', this.handleDragStart);\n        this.addEventListener('dragover', this.handleDragOver);\n        this.addEventListener('drop', this.handleDrop);\n        this.addEventListener('dragend', this.handleDragEnd);\n        this.syncAria();\n    }\n\n    /**\n     * Syncs ARIA attributes on the host element.\n     */\n    syncAria() {\n        this.setAriaState({\n            role: 'tree',\n            multiselectable: this.selection === 'multiple' ? 'true' : undefined,\n        });\n    }\n\n    beforeDisconnect() {\n        this.removeEventListener('click', this.handleClick);\n        this.removeEventListener('dragstart', this.handleDragStart);\n        this.removeEventListener('dragover', this.handleDragOver);\n        this.removeEventListener('drop', this.handleDrop);\n        this.removeEventListener('dragend', this.handleDragEnd);\n    }\n\n    /**\n     * Handles the click event triggered by the user interaction.\n     * Identifies the closest tree item element to the event target and sets it\n     * as the selected item. Ensures that only one item is selected at a time, resetting\n     * the selection state for all other items.\n     * @param {Event} e The click event object.\n     */\n    handleClick = (e) => {\n        if (e?.preventDefault) e.preventDefault();\n        if (this.reorder && this.isReorderHandleEvent(e)) return;\n\n        const selectedItem = this.getTreeItemFromEvent(e);\n        if (!selectedItem) return;\n\n        const isClickButton = (e.composedPath?.() || []).some((el) => el?.classList?.contains('toggle'));\n        if (isClickButton) return;\n\n        if (this.selection === 'single') {\n            for (let item of this.getAllItems()) {\n                item.selected = item === selectedItem;\n            }\n        } else if (this.selection === 'multiple') {\n            // let children = selectedItem.getAllChildrenFlat();\n            selectedItem.selected = !selectedItem.selected;\n\n            this.updateCheckboxState(selectedItem);\n        }\n    };\n\n    /**\n     * Starts dragging a tree item when the drag begins from the configured start slot handle.\n     * @param {DragEvent} e The drag event.\n     * @returns {void}\n     */\n    handleDragStart = (e) => {\n        if (!this.reorder || !this.isReorderHandleEvent(e)) return;\n\n        const item = this.getTreeItemFromEvent(e);\n        if (!item) return;\n\n        this.draggedItem = item;\n        item.classList.add('wje-tree-dragging');\n\n        if (e.dataTransfer) {\n            e.dataTransfer.effectAllowed = 'move';\n            e.dataTransfer.setData('text/plain', item.textContent?.trim() || '');\n        }\n    };\n\n    /**\n     * Updates the current drop target and exposes a visual drop position.\n     * @param {DragEvent} e The drag event.\n     * @returns {void}\n     */\n    handleDragOver = (e) => {\n        if (!this.reorder || !this.draggedItem) return;\n\n        const target = this.getTreeItemFromEvent(e);\n\n        if (!this.canDrop(this.draggedItem, target)) {\n            this.clearDropState();\n            return;\n        }\n\n        e.preventDefault();\n        if (e.dataTransfer) e.dataTransfer.dropEffect = 'move';\n\n        const position = this.getDropPosition(e, target);\n        this.setDropState(target, position);\n    };\n\n    /**\n     * Completes a tree item move.\n     * @param {DragEvent} e The drop event.\n     * @returns {void}\n     */\n    handleDrop = (e) => {\n        if (!this.reorder || !this.draggedItem) return;\n\n        e.preventDefault();\n\n        const target = this.dropTarget || this.getTreeItemFromEvent(e);\n        const position = this.dropPosition || this.getDropPosition(e, target);\n        const detail = this.moveItem(this.draggedItem, target, position);\n\n        if (detail) {\n            this.dispatchEvent(new CustomEvent('wje-tree:move', {\n                detail,\n                bubbles: true,\n                composed: true,\n            }));\n        }\n\n        this.clearDragState();\n    };\n\n    /**\n     * Clears drag state after the browser drag operation ends.\n     * @returns {void}\n     */\n    handleDragEnd = () => {\n        this.clearDragState();\n    };\n\n    /**\n     * Retrieves all items that match the selector 'wje-tree-item' within the current context.\n     * @returns {Array<Element>} An array of all matching DOM elements.\n     */\n    getAllItems() {\n        return [...this.querySelectorAll('wje-tree-item')];\n    }\n\n    /**\n     * Retrieves and appends a template slot to a tree item.\n     * @param {HTMLElement} item The DOM element to which the slot content will be appended.\n     * @param {HTMLTemplateElement|null} template Template that may provide reusable slot content.\n     * @param {string} slotName Name of the projected slot content to clone.\n     * @returns {void}\n     */\n    appendTemplateSlot(item, template, slotName) {\n        const slot = template?.content.querySelector(`[slot=\"${slotName}\"]`);\n        if (!slot) return;\n\n        const templateSlotClass = this.getTemplateSlotClass(slotName);\n        const existing = item.querySelector(`:scope > [slot=\"${slotName}\"].${templateSlotClass}`);\n        if (existing) return;\n\n        const slotClone = slot.cloneNode(true);\n        slotClone.classList.add('wje-tree-template-slot', templateSlotClass);\n        item.append(slotClone);\n    }\n\n    /**\n     * Returns the internal class used to identify cloned template slot content.\n     * @param {string} slotName Name of the projected slot.\n     * @returns {string}\n     */\n    getTemplateSlotClass(slotName) {\n        return `wje-tree-template-slot-${slotName}`;\n    }\n\n    /**\n     * Marks direct start slot content as the drag handle for reorderable trees.\n     * @param {HTMLElement} item Host item that receives draggable start content.\n     * @returns {void}\n     */\n    setupReorderHandle(item) {\n        const handles = item.querySelectorAll(':scope > [slot=\"start\"]');\n\n        handles.forEach((handle) => {\n            handle.setAttribute('draggable', 'true');\n            handle.classList.add('wje-tree-drag-handle');\n\n            if (!handle.hasAttribute('aria-label')) {\n                handle.setAttribute('aria-label', 'Move tree item');\n            }\n        });\n    }\n\n    /**\n     * Finds a tree item from a composed event path.\n     * @param {Event} e User interaction that may originate inside shadow DOM.\n     * @returns {HTMLElement|null}\n     */\n    getTreeItemFromEvent(e) {\n        const path = e.composedPath?.() || [];\n        const pathItem = path.find((el) => this.isTreeItem(el) && this.contains(el));\n        if (pathItem) return pathItem;\n\n        const targetItem = e.target?.closest?.('wje-tree-item');\n        return targetItem && this.contains(targetItem) ? targetItem : null;\n    }\n\n    /**\n     * Checks whether the event started from a reorder handle.\n     * @param {Event} e User interaction to inspect.\n     * @returns {boolean}\n     */\n    isReorderHandleEvent(e) {\n        return (e.composedPath?.() || []).some((el) => el?.classList?.contains('wje-tree-drag-handle'));\n    }\n\n    /**\n     * Checks whether a node is a tree item element.\n     * @param {object} node The node to inspect.\n     * @returns {boolean}\n     */\n    isTreeItem(node) {\n        return node instanceof Element && node.localName === 'wje-tree-item';\n    }\n\n    /**\n     * Returns direct tree item children for a tree or tree item parent.\n     * @param {HTMLElement} parent The parent element.\n     * @returns {HTMLElement[]}\n     */\n    getDirectTreeItems(parent) {\n        return Array.from(parent?.children || []).filter((child) => this.isTreeItem(child));\n    }\n\n    /**\n     * Gets the index of a tree item among direct tree item siblings.\n     * @param {HTMLElement} item Element whose sibling position should be resolved.\n     * @returns {number}\n     */\n    getTreeItemIndex(item) {\n        return this.getDirectTreeItems(item.parentElement).indexOf(item);\n    }\n\n    /**\n     * Determines whether the dragged item can be dropped on the target.\n     * @param {HTMLElement} draggedItem Item currently being moved.\n     * @param {HTMLElement} targetItem Candidate item under the pointer.\n     * @returns {boolean}\n     */\n    canDrop(draggedItem, targetItem) {\n        return !!draggedItem && !!targetItem && draggedItem !== targetItem && !draggedItem.contains(targetItem);\n    }\n\n    /**\n     * Resolves the drop position against the visible tree item row.\n     * @param {DragEvent} e Browser drag event carrying pointer coordinates.\n     * @param {HTMLElement|null} target Item used to calculate row boundaries.\n     * @returns {'before'|'inside'|'after'}\n     */\n    getDropPosition(e, target) {\n        const row = target?.shadowRoot?.querySelector('.item');\n        const rect = row?.getBoundingClientRect?.() || target?.getBoundingClientRect?.();\n\n        if (!rect) return 'after';\n\n        const topBoundary = rect.top + rect.height * 0.25;\n        const bottomBoundary = rect.bottom - rect.height * 0.25;\n\n        if (e.clientY < topBoundary) return 'before';\n        if (e.clientY > bottomBoundary) return 'after';\n\n        return 'inside';\n    }\n\n    /**\n     * Applies the visual drop position to the current target item.\n     * @param {HTMLElement} target Item currently showing insertion feedback.\n     * @param {string} position Resolved insertion area for the target row.\n     * @returns {void}\n     */\n    setDropState(target, position) {\n        if (this.dropTarget !== target || this.dropPosition !== position) {\n            this.clearDropState();\n            this.dropTarget = target;\n            this.dropPosition = position;\n            target.classList.add(this.getDropPositionClass(position));\n        }\n    }\n\n    /**\n     * Clears visual drop target state.\n     * @returns {void}\n     */\n    clearDropState() {\n        this.dropTarget?.classList.remove(\n            this.getDropPositionClass('before'),\n            this.getDropPositionClass('inside'),\n            this.getDropPositionClass('after')\n        );\n        this.dropTarget = null;\n        this.dropPosition = null;\n    }\n\n    /**\n     * Clears the active drag state.\n     * @returns {void}\n     */\n    clearDragState() {\n        this.draggedItem?.classList.remove('wje-tree-dragging');\n        this.clearDropState();\n        this.draggedItem = null;\n    }\n\n    /**\n     * Returns the internal class used to render a drop marker.\n     * @param {'before'|'inside'|'after'} position Drop marker position.\n     * @returns {string}\n     */\n    getDropPositionClass(position) {\n        return `wje-tree-drop-${position}`;\n    }\n\n    /**\n     * Moves a tree item relative to another tree item and syncs nesting metadata.\n     * @param {HTMLElement} draggedItem The item being moved.\n     * @param {HTMLElement} targetItem Item that receives or anchors the moved item.\n     * @param {'before'|'inside'|'after'} position The target position.\n     * @returns {object|null} Move detail, or null when the move is invalid.\n     */\n    moveItem(draggedItem, targetItem, position = 'after') {\n        if (!this.canDrop(draggedItem, targetItem)) return null;\n\n        const fromParent = draggedItem.parentElement;\n        const fromParentItem = fromParent?.closest?.('wje-tree-item');\n        const fromIndex = this.getTreeItemIndex(draggedItem);\n\n        if (position === 'inside') {\n            targetItem.appendChild(draggedItem);\n            targetItem.setChildrenExpanded?.(true);\n        } else {\n            const parent = targetItem.parentElement;\n            const reference = position === 'before' ? targetItem : targetItem.nextSibling;\n            parent.insertBefore(draggedItem, reference);\n        }\n\n        this.syncTreeItems();\n\n        const toParent = draggedItem.parentElement;\n        const toParentItem = toParent?.closest?.('wje-tree-item');\n        const toIndex = this.getTreeItemIndex(draggedItem);\n        const orderElements = this.getOrderElements(toParent);\n        const order = orderElements.map((item) => item.innerText.trim());\n\n        this.refreshMovedItems([fromParentItem, toParentItem, targetItem]);\n\n        return {\n            item: draggedItem,\n            target: targetItem,\n            position,\n            from: fromIndex,\n            to: toIndex,\n            order,\n            orderElements,\n            orderIds: this.getOrderIds(toParent),\n            itemId: this.getItemId(draggedItem),\n            targetId: this.getItemId(targetItem),\n            fromParentItem,\n            toParentItem,\n            fromParentId: this.getItemId(fromParentItem),\n            toParentId: this.getItemId(toParentItem),\n            fromParent,\n            toParent,\n            fromIndex,\n            toIndex,\n        };\n    }\n\n    /**\n     * Returns cloned direct tree item children for an event detail.\n     * @param {HTMLElement} parent Parent whose direct tree item children should be serialized.\n     * @returns {HTMLElement[]}\n     */\n    getOrderElements(parent) {\n        return this.getDirectTreeItems(parent).map((item) => {\n            const clone = item.cloneNode(true);\n            clone.querySelectorAll('.wje-tree-template-slot').forEach((slot) => slot.remove());\n            return clone;\n        });\n    }\n\n    /**\n     * Returns stable ids for direct tree item children when they are available.\n     * @param {HTMLElement} parent Parent whose direct tree item children should be serialized.\n     * @returns {Array<string|null>}\n     */\n    getOrderIds(parent) {\n        return this.getDirectTreeItems(parent).map((item) => this.getItemId(item));\n    }\n\n    /**\n     * Gets an application-facing id from a tree item.\n     * @param {HTMLElement|null} item Tree item to read.\n     * @returns {string|null}\n     */\n    getItemId(item) {\n        if (!this.isTreeItem(item)) return null;\n        return item.getAttribute('value') || item.id || null;\n    }\n\n    /**\n     * Syncs item selection mode and nesting metadata after a DOM move.\n     * @returns {void}\n     */\n    syncTreeItems() {\n        this.getAllItems().forEach((item) => {\n            item.selection = this.selection;\n            item.syncNestingState?.();\n            item.syncAria?.();\n        });\n    }\n\n    /**\n     * Redraws affected parent items so expand/collapse affordances match current children.\n     * @param {HTMLElement[]} items Items that may need refresh.\n     * @returns {void}\n     */\n    refreshMovedItems(items) {\n        [...new Set(items)].forEach((item) => {\n            if (this.isTreeItem(item)) item.refresh?.();\n        });\n    }\n\n    /**\n     * Updates the state of a checkbox, syncing the state both upwards to parent elements\n     * and downwards to child elements as necessary.\n     * @param {object} changedItem The specific item whose checkbox state has changed.\n     * @param {boolean} [isInitialSync] Indicates whether the state update is part of the initial synchronization process.\n     * @returns {void} This method does not return a value.\n     */\n    updateCheckboxState(changedItem, isInitialSync = false) {\n        this.isInitialSync = isInitialSync;\n        this.propagateStateDownwards(changedItem);\n        this.propagateStateUpwards(changedItem);\n    }\n\n    /**\n     * Updates the state of the parent item based on the state of its child items.\n     * Recursively propagates changes up to all parent items to reflect the selection\n     * or indeterminate state accurately.\n     * @param {object} item The current tree item whose parent state needs to be updated.\n     * It is expected to have properties `selected`, `indeterminate`,\n     * and a method `getChildrenItems({ includeDisabled: boolean })`.\n     * @returns {void} This method does not return a value.\n     */\n    updateParentState(item) {\n        const children = item.getChildrenItems({ includeDisabled: false });\n\n        if (children.length) {\n            const areAllChildrenChecked = children.every((child) => child.selected);\n            const areSomeChildrenChecked = children.some((child) => child.selected);\n            const areSomeChildrenIndeterminate = children.some((child) => child.indeterminate);\n\n            item.selected = areAllChildrenChecked;\n            item.indeterminate = areSomeChildrenIndeterminate || (areSomeChildrenChecked && !areAllChildrenChecked);\n        } else {\n            item.indeterminate = false;\n        }\n\n        const parent = item.parentElement?.closest('wje-tree-item');\n        if (parent) {\n            this.updateParentState(parent);\n        }\n    }\n\n    /**\n     * Propagates the state changes of an item upwards through its ancestors in the hierarchy.\n     * Calls the `updateParentState` method for each parent element until no parent exists.\n     * @param {HTMLElement} item The current item whose state to propagate to its parent.\n     * @returns {void} This method does not return a value.\n     */\n    propagateStateUpwards(item) {\n        const parent = item.parentElement?.closest('wje-tree-item');\n\n        if (parent) {\n            this.updateParentState(parent);\n            this.propagateStateUpwards(parent);\n        }\n    }\n\n    /**\n     * Propagates the selected state of an item to its children recursively. Depending on the `isInitialSync` flag,\n     * it also determines how the state should be applied to the child items and updates the parent state if needed.\n     * @param {object} item The item whose state is being propagated to its child items. The item must have properties\n     * such as `selected` and methods like `getChildrenItems` to retrieve its child elements.\n     * @returns {void} This method does not return a value.\n     */\n    propagateStateDownwards(item) {\n        const isChecked = item.selected;\n\n        item.getChildrenItems().forEach((child) => {\n            child.selected = this.isInitialSync ? isChecked || child.selected : !child.disabled && isChecked;\n            this.propagateStateDownwards(child);\n        });\n\n        if (this.isInitialSync) {\n            this.updateParentState(item);\n        }\n    }\n}\n","import Tree from './tree.element.js';\n\nexport default Tree;\n\nTree.define('wje-tree', Tree);\n"],"names":["_a"],"mappings":"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"}
+{"version":3,"file":"wje-tree.js","sources":["../packages/wje-tree/tree.element.js","../packages/wje-tree/tree.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n// @fires wje-tree:move - Dispatched when a tree item is moved.\n/**\n * `Tree` is a custom web component that represents a hierarchical tree structure.\n * It extends from `WJElement`.\n * @summary This element visually represents a tree structure, supporting single or multiple selection modes and hierarchy management.\n * @documentation https://elements.webjet.sk/components/tree\n * @status stable\n * @augments {WJElement}\n * @attribute {boolean} reorder - Enables moving tree items by dragging direct start slot content.\n * @csspart native - The native container part of the tree.\n * @slot - The default slot to place `wje-tree-item` child components.\n * @tag wje-tree\n */\n\nexport default class Tree extends WJElement {\n    /**\n     * Creates an instance of Tree.\n     */\n    constructor() {\n        super();\n\n        this.draggedItem = null;\n        this.dropTarget = null;\n        this.dropPosition = null;\n    }\n\n    /**\n     * Sets the selection attribute for the element.\n     * @param {string} value The value to set as the selection attribute.\n     */\n    set selection(value) {\n        this.setAttribute('selection', value);\n    }\n\n    /**\n     * Gets the current selection mode for the element.\n     * If no selection is explicitly set, it defaults to 'single'.\n     * @returns {string} The current selection mode, either set by the element's attribute or the default value 'single'.\n     */\n    get selection() {\n        return this.getAttribute('selection') || 'single';\n    }\n\n    /**\n     * Enables reordering tree items by dragging an element assigned to the start slot.\n     * @param {boolean} value Whether reordering is enabled.\n     */\n    set reorder(value) {\n        if (value) this.setAttribute('reorder', '');\n        else this.removeAttribute('reorder');\n    }\n\n    /**\n     * Indicates whether tree items can be reordered with the start slot handle.\n     * @returns {boolean}\n     */\n    get reorder() {\n        return this.hasAttribute('reorder');\n    }\n\n    /**\n     * The class name for the component.\n     * @type {string}\n     */\n    className = 'Tree';\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     * Setup attributes for the Button element.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        this.syncAria();\n    }\n\n    /**\n     * A method called before the drawing or rendering process of tree items.\n     * It iterates through all `wje-tree-item` elements, updating their selection state\n     * and managing their expand/collapse icons accordingly.\n     * @returns {void} This method does not return a value.\n     */\n    beforeDraw() {\n        const template = this.querySelector('template');\n        const items = this.querySelectorAll('wje-tree-item');\n        items?.forEach((item) => {\n            item.selection = this.selection;\n            item.syncNestingState?.();\n\n            this.appendTemplateSlot(item, template, 'expand');\n            this.appendTemplateSlot(item, template, 'collapse');\n            this.appendTemplateSlot(item, template, 'start');\n            this.appendTemplateSlot(item, template, 'end');\n\n            if (this.reorder) this.setupReorderHandle(item);\n        });\n    }\n\n    /**\n     * Draw method for the tree.\n     * @returns {object} Document fragment\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-tree');\n\n        let slot = document.createElement('slot');\n\n        native.appendChild(slot);\n\n        fragment.appendChild(native);\n\n        return fragment;\n    }\n\n    /**\n     * Called after the draw process of the component is completed.\n     * Typically used to add event listeners or perform operations\n     * that are dependent on the component's drawn state.\n     * @returns {void} This method does not return a value.\n     */\n    afterDraw() {\n        this.addEventListener('click', this.handleClick);\n        this.addEventListener('dragstart', this.handleDragStart);\n        this.addEventListener('dragover', this.handleDragOver);\n        this.addEventListener('drop', this.handleDrop);\n        this.addEventListener('dragend', this.handleDragEnd);\n        this.syncAria();\n    }\n\n    /**\n     * Syncs ARIA attributes on the host element.\n     */\n    syncAria() {\n        this.setAriaState({\n            role: 'tree',\n            multiselectable: this.selection === 'multiple' ? 'true' : undefined,\n        });\n    }\n\n    beforeDisconnect() {\n        this.removeEventListener('click', this.handleClick);\n        this.removeEventListener('dragstart', this.handleDragStart);\n        this.removeEventListener('dragover', this.handleDragOver);\n        this.removeEventListener('drop', this.handleDrop);\n        this.removeEventListener('dragend', this.handleDragEnd);\n    }\n\n    /**\n     * Handles the click event triggered by the user interaction.\n     * Identifies the closest tree item element to the event target and sets it\n     * as the selected item. Ensures that only one item is selected at a time, resetting\n     * the selection state for all other items.\n     * @param {Event} e The click event object.\n     */\n    handleClick = (e) => {\n        if (e?.preventDefault) e.preventDefault();\n        if (this.reorder && this.isReorderHandleEvent(e)) return;\n\n        const selectedItem = this.getTreeItemFromEvent(e);\n        if (!selectedItem) return;\n\n        const isClickButton = (e.composedPath?.() || []).some((el) => el?.classList?.contains('toggle'));\n        if (isClickButton) return;\n\n        if (this.selection === 'single') {\n            for (let item of this.getAllItems()) {\n                item.selected = item === selectedItem;\n            }\n        } else if (this.selection === 'multiple') {\n            // let children = selectedItem.getAllChildrenFlat();\n            selectedItem.selected = !selectedItem.selected;\n\n            this.updateCheckboxState(selectedItem);\n        }\n    };\n\n    /**\n     * Starts dragging a tree item when the drag begins from the configured start slot handle.\n     * @param {DragEvent} e The drag event.\n     * @returns {void}\n     */\n    handleDragStart = (e) => {\n        if (!this.reorder || !this.isReorderHandleEvent(e)) return;\n\n        const item = this.getTreeItemFromEvent(e);\n        if (!item) return;\n\n        this.draggedItem = item;\n        item.classList.add('wje-tree-dragging');\n\n        if (e.dataTransfer) {\n            e.dataTransfer.effectAllowed = 'move';\n            e.dataTransfer.setData('text/plain', item.textContent?.trim() || '');\n        }\n    };\n\n    /**\n     * Updates the current drop target and exposes a visual drop position.\n     * @param {DragEvent} e The drag event.\n     * @returns {void}\n     */\n    handleDragOver = (e) => {\n        if (!this.reorder || !this.draggedItem) return;\n\n        const target = this.getTreeItemFromEvent(e);\n\n        if (!this.canDrop(this.draggedItem, target)) {\n            this.clearDropState();\n            return;\n        }\n\n        e.preventDefault();\n        if (e.dataTransfer) e.dataTransfer.dropEffect = 'move';\n\n        const position = this.getDropPosition(e, target);\n        this.setDropState(target, position);\n    };\n\n    /**\n     * Completes a tree item move.\n     * @param {DragEvent} e The drop event.\n     * @returns {void}\n     */\n    handleDrop = (e) => {\n        if (!this.reorder || !this.draggedItem) return;\n\n        e.preventDefault();\n\n        const target = this.dropTarget || this.getTreeItemFromEvent(e);\n        const position = this.dropPosition || this.getDropPosition(e, target);\n        const detail = this.moveItem(this.draggedItem, target, position);\n\n        if (detail) {\n            this.dispatchEvent(new CustomEvent('wje-tree:move', {\n                detail,\n                bubbles: true,\n                composed: true,\n            }));\n        }\n\n        this.clearDragState();\n    };\n\n    /**\n     * Clears drag state after the browser drag operation ends.\n     * @returns {void}\n     */\n    handleDragEnd = () => {\n        this.clearDragState();\n    };\n\n    /**\n     * Retrieves all items that match the selector 'wje-tree-item' within the current context.\n     * @returns {Array<Element>} An array of all matching DOM elements.\n     */\n    getAllItems() {\n        return [...this.querySelectorAll('wje-tree-item')];\n    }\n\n    /**\n     * Retrieves and appends a template slot to a tree item.\n     * @param {HTMLElement} item The DOM element to which the slot content will be appended.\n     * @param {HTMLTemplateElement|null} template Template that may provide reusable slot content.\n     * @param {string} slotName Name of the projected slot content to clone.\n     * @returns {void}\n     */\n    appendTemplateSlot(item, template, slotName) {\n        const slot = template?.content.querySelector(`[slot=\"${slotName}\"]`);\n        if (!slot) return;\n\n        const templateSlotClass = this.getTemplateSlotClass(slotName);\n        const existing = item.querySelector(`:scope > [slot=\"${slotName}\"].${templateSlotClass}`);\n        if (existing) return;\n\n        const slotClone = slot.cloneNode(true);\n        slotClone.classList.add('wje-tree-template-slot', templateSlotClass);\n        item.append(slotClone);\n    }\n\n    /**\n     * Returns the internal class used to identify cloned template slot content.\n     * @param {string} slotName Name of the projected slot.\n     * @returns {string}\n     */\n    getTemplateSlotClass(slotName) {\n        return `wje-tree-template-slot-${slotName}`;\n    }\n\n    /**\n     * Marks direct start slot content as the drag handle for reorderable trees.\n     * @param {HTMLElement} item Host item that receives draggable start content.\n     * @returns {void}\n     */\n    setupReorderHandle(item) {\n        const handles = item.querySelectorAll(':scope > [slot=\"start\"]');\n\n        handles.forEach((handle) => {\n            handle.setAttribute('draggable', 'true');\n            handle.classList.add('wje-tree-drag-handle');\n\n            if (!handle.hasAttribute('aria-label')) {\n                handle.setAttribute('aria-label', 'Move tree item');\n            }\n        });\n    }\n\n    /**\n     * Finds a tree item from a composed event path.\n     * @param {Event} e User interaction that may originate inside shadow DOM.\n     * @returns {HTMLElement|null}\n     */\n    getTreeItemFromEvent(e) {\n        const path = e.composedPath?.() || [];\n        const pathItem = path.find((el) => this.isTreeItem(el) && this.contains(el));\n        if (pathItem) return pathItem;\n\n        const targetItem = e.target?.closest?.('wje-tree-item');\n        return targetItem && this.contains(targetItem) ? targetItem : null;\n    }\n\n    /**\n     * Checks whether the event started from a reorder handle.\n     * @param {Event} e User interaction to inspect.\n     * @returns {boolean}\n     */\n    isReorderHandleEvent(e) {\n        return (e.composedPath?.() || []).some((el) => el?.classList?.contains('wje-tree-drag-handle'));\n    }\n\n    /**\n     * Checks whether a node is a tree item element.\n     * @param {object} node The node to inspect.\n     * @returns {boolean}\n     */\n    isTreeItem(node) {\n        return node instanceof Element && node.localName === 'wje-tree-item';\n    }\n\n    /**\n     * Returns direct tree item children for a tree or tree item parent.\n     * @param {HTMLElement} parent The parent element.\n     * @returns {HTMLElement[]}\n     */\n    getDirectTreeItems(parent) {\n        return Array.from(parent?.children || []).filter((child) => this.isTreeItem(child));\n    }\n\n    /**\n     * Gets the index of a tree item among direct tree item siblings.\n     * @param {HTMLElement} item Element whose sibling position should be resolved.\n     * @returns {number}\n     */\n    getTreeItemIndex(item) {\n        return this.getDirectTreeItems(item.parentElement).indexOf(item);\n    }\n\n    /**\n     * Determines whether the dragged item can be dropped on the target.\n     * @param {HTMLElement} draggedItem Item currently being moved.\n     * @param {HTMLElement} targetItem Candidate item under the pointer.\n     * @returns {boolean}\n     */\n    canDrop(draggedItem, targetItem) {\n        return !!draggedItem && !!targetItem && draggedItem !== targetItem && !draggedItem.contains(targetItem);\n    }\n\n    /**\n     * Resolves the drop position against the visible tree item row.\n     * @param {DragEvent} e Browser drag event carrying pointer coordinates.\n     * @param {HTMLElement|null} target Item used to calculate row boundaries.\n     * @returns {'before'|'inside'|'after'}\n     */\n    getDropPosition(e, target) {\n        const row = target?.shadowRoot?.querySelector('.item');\n        const rect = row?.getBoundingClientRect?.() || target?.getBoundingClientRect?.();\n\n        if (!rect) return 'after';\n\n        const topBoundary = rect.top + rect.height * 0.25;\n        const bottomBoundary = rect.bottom - rect.height * 0.25;\n\n        if (e.clientY < topBoundary) return 'before';\n        if (e.clientY > bottomBoundary) return 'after';\n\n        return 'inside';\n    }\n\n    /**\n     * Applies the visual drop position to the current target item.\n     * @param {HTMLElement} target Item currently showing insertion feedback.\n     * @param {string} position Resolved insertion area for the target row.\n     * @returns {void}\n     */\n    setDropState(target, position) {\n        if (this.dropTarget !== target || this.dropPosition !== position) {\n            this.clearDropState();\n            this.dropTarget = target;\n            this.dropPosition = position;\n            target.classList.add(this.getDropPositionClass(position));\n        }\n    }\n\n    /**\n     * Clears visual drop target state.\n     * @returns {void}\n     */\n    clearDropState() {\n        this.dropTarget?.classList.remove(\n            this.getDropPositionClass('before'),\n            this.getDropPositionClass('inside'),\n            this.getDropPositionClass('after')\n        );\n        this.dropTarget = null;\n        this.dropPosition = null;\n    }\n\n    /**\n     * Clears the active drag state.\n     * @returns {void}\n     */\n    clearDragState() {\n        this.draggedItem?.classList.remove('wje-tree-dragging');\n        this.clearDropState();\n        this.draggedItem = null;\n    }\n\n    /**\n     * Returns the internal class used to render a drop marker.\n     * @param {'before'|'inside'|'after'} position Drop marker position.\n     * @returns {string}\n     */\n    getDropPositionClass(position) {\n        return `wje-tree-drop-${position}`;\n    }\n\n    /**\n     * Moves a tree item relative to another tree item and syncs nesting metadata.\n     * @param {HTMLElement} draggedItem The item being moved.\n     * @param {HTMLElement} targetItem Item that receives or anchors the moved item.\n     * @param {'before'|'inside'|'after'} position The target position.\n     * @returns {object|null} Move detail, or null when the move is invalid.\n     */\n    moveItem(draggedItem, targetItem, position = 'after') {\n        if (!this.canDrop(draggedItem, targetItem)) return null;\n\n        const fromParent = draggedItem.parentElement;\n        const fromParentItem = fromParent?.closest?.('wje-tree-item');\n        const fromIndex = this.getTreeItemIndex(draggedItem);\n\n        if (position === 'inside') {\n            targetItem.appendChild(draggedItem);\n            targetItem.setChildrenExpanded?.(true);\n        } else {\n            const parent = targetItem.parentElement;\n            const reference = position === 'before' ? targetItem : targetItem.nextSibling;\n            parent.insertBefore(draggedItem, reference);\n        }\n\n        this.syncTreeItems();\n\n        const toParent = draggedItem.parentElement;\n        const toParentItem = toParent?.closest?.('wje-tree-item');\n        const toIndex = this.getTreeItemIndex(draggedItem);\n        const orderElements = this.getOrderElements(toParent);\n        const order = orderElements.map((item) => item.innerText.trim());\n\n        this.refreshMovedItems([fromParentItem, toParentItem, targetItem]);\n\n        return {\n            item: draggedItem,\n            target: targetItem,\n            position,\n            from: fromIndex,\n            to: toIndex,\n            order,\n            orderElements,\n            orderIds: this.getOrderIds(toParent),\n            itemId: this.getItemId(draggedItem),\n            targetId: this.getItemId(targetItem),\n            fromParentItem,\n            toParentItem,\n            fromParentId: this.getItemId(fromParentItem),\n            toParentId: this.getItemId(toParentItem),\n            fromParent,\n            toParent,\n            fromIndex,\n            toIndex,\n        };\n    }\n\n    /**\n     * Returns cloned direct tree item children for an event detail.\n     * @param {HTMLElement} parent Parent whose direct tree item children should be serialized.\n     * @returns {HTMLElement[]}\n     */\n    getOrderElements(parent) {\n        return this.getDirectTreeItems(parent).map((item) => {\n            const clone = item.cloneNode(true);\n            clone.querySelectorAll('.wje-tree-template-slot').forEach((slot) => slot.remove());\n            return clone;\n        });\n    }\n\n    /**\n     * Returns stable ids for direct tree item children when they are available.\n     * @param {HTMLElement} parent Parent whose direct tree item children should be serialized.\n     * @returns {Array<string|null>}\n     */\n    getOrderIds(parent) {\n        return this.getDirectTreeItems(parent).map((item) => this.getItemId(item));\n    }\n\n    /**\n     * Gets an application-facing id from a tree item.\n     * @param {HTMLElement|null} item Tree item to read.\n     * @returns {string|null}\n     */\n    getItemId(item) {\n        if (!this.isTreeItem(item)) return null;\n        return item.getAttribute('value') || item.id || null;\n    }\n\n    /**\n     * Syncs item selection mode and nesting metadata after a DOM move.\n     * @returns {void}\n     */\n    syncTreeItems() {\n        this.getAllItems().forEach((item) => {\n            item.selection = this.selection;\n            item.syncNestingState?.();\n            item.syncAria?.();\n        });\n    }\n\n    /**\n     * Redraws affected parent items so expand/collapse affordances match current children.\n     * @param {HTMLElement[]} items Items that may need refresh.\n     * @returns {void}\n     */\n    refreshMovedItems(items) {\n        [...new Set(items)].forEach((item) => {\n            if (this.isTreeItem(item)) item.refresh?.();\n        });\n    }\n\n    /**\n     * Updates the state of a checkbox, syncing the state both upwards to parent elements\n     * and downwards to child elements as necessary.\n     * @param {object} changedItem The specific item whose checkbox state has changed.\n     * @param {boolean} [isInitialSync] Indicates whether the state update is part of the initial synchronization process.\n     * @returns {void} This method does not return a value.\n     */\n    updateCheckboxState(changedItem, isInitialSync = false) {\n        this.isInitialSync = isInitialSync;\n        this.propagateStateDownwards(changedItem);\n        this.propagateStateUpwards(changedItem);\n    }\n\n    /**\n     * Updates the state of the parent item based on the state of its child items.\n     * Recursively propagates changes up to all parent items to reflect the selection\n     * or indeterminate state accurately.\n     * @param {object} item The current tree item whose parent state needs to be updated.\n     * It is expected to have properties `selected`, `indeterminate`,\n     * and a method `getChildrenItems({ includeDisabled: boolean })`.\n     * @returns {void} This method does not return a value.\n     */\n    updateParentState(item) {\n        const children = item.getChildrenItems({ includeDisabled: false });\n\n        if (children.length) {\n            const areAllChildrenChecked = children.every((child) => child.selected);\n            const areSomeChildrenChecked = children.some((child) => child.selected);\n            const areSomeChildrenIndeterminate = children.some((child) => child.indeterminate);\n\n            item.selected = areAllChildrenChecked;\n            item.indeterminate = areSomeChildrenIndeterminate || (areSomeChildrenChecked && !areAllChildrenChecked);\n        } else {\n            item.indeterminate = false;\n        }\n\n        const parent = item.parentElement?.closest('wje-tree-item');\n        if (parent) {\n            this.updateParentState(parent);\n        }\n    }\n\n    /**\n     * Propagates the state changes of an item upwards through its ancestors in the hierarchy.\n     * Calls the `updateParentState` method for each parent element until no parent exists.\n     * @param {HTMLElement} item The current item whose state to propagate to its parent.\n     * @returns {void} This method does not return a value.\n     */\n    propagateStateUpwards(item) {\n        const parent = item.parentElement?.closest('wje-tree-item');\n\n        if (parent) {\n            this.updateParentState(parent);\n            this.propagateStateUpwards(parent);\n        }\n    }\n\n    /**\n     * Propagates the selected state of an item to its children recursively. Depending on the `isInitialSync` flag,\n     * it also determines how the state should be applied to the child items and updates the parent state if needed.\n     * @param {object} item The item whose state is being propagated to its child items. The item must have properties\n     * such as `selected` and methods like `getChildrenItems` to retrieve its child elements.\n     * @returns {void} This method does not return a value.\n     */\n    propagateStateDownwards(item) {\n        const isChecked = item.selected;\n\n        item.getChildrenItems().forEach((child) => {\n            child.selected = this.isInitialSync ? isChecked || child.selected : !child.disabled && isChecked;\n            this.propagateStateDownwards(child);\n        });\n\n        if (this.isInitialSync) {\n            this.updateParentState(item);\n        }\n    }\n}\n","import Tree from './tree.element.js';\n\nexport default Tree;\n\nTree.define('wje-tree', Tree);\n"],"names":["Tree","WJElement","constructor","super","className","handleClick","e","preventDefault","this","reorder","isReorderHandleEvent","selectedItem","getTreeItemFromEvent","composedPath","some","el","classList","contains","selection","item","getAllItems","selected","updateCheckboxState","handleDragStart","draggedItem","add","dataTransfer","effectAllowed","setData","textContent","trim","handleDragOver","target","canDrop","clearDropState","dropEffect","position","getDropPosition","setDropState","handleDrop","dropTarget","dropPosition","detail","moveItem","dispatchEvent","CustomEvent","bubbles","composed","clearDragState","handleDragEnd","value","setAttribute","getAttribute","removeAttribute","hasAttribute","cssStyleSheet","setupAttributes","isShadowRoot","syncAria","beforeDraw","template","querySelector","items","querySelectorAll","forEach","syncNestingState","appendTemplateSlot","setupReorderHandle","draw","fragment","document","createDocumentFragment","native","createElement","slot","appendChild","afterDraw","addEventListener","setAriaState","role","multiselectable","beforeDisconnect","removeEventListener","slotName","content","templateSlotClass","getTemplateSlotClass","slotClone","cloneNode","append","handle","pathItem","find","isTreeItem","targetItem","closest","node","Element","localName","parent","Array","from","children","filter","child","getDirectTreeItems","parentElement","indexOf","row","shadowRoot","rect","getBoundingClientRect","topBoundary","top","height","bottomBoundary","bottom","clientY","getDropPositionClass","remove","fromParent","fromParentItem","fromIndex","getTreeItemIndex","setChildrenExpanded","reference","nextSibling","insertBefore","syncTreeItems","toParent","toParentItem","toIndex","orderElements","getOrderElements","order","map","innerText","refreshMovedItems","to","orderIds","getOrderIds","itemId","getItemId","targetId","fromParentId","toParentId","clone","id","Set","refresh","changedItem","isInitialSync","propagateStateDownwards","propagateStateUpwards","getChildrenItems","includeDisabled","length","areAllChildrenChecked","every","areSomeChildrenChecked","areSomeChildrenIndeterminate","indeterminate","updateParentState","isChecked","disabled","define"],"mappings":"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"}

package/dist/wje-visually-hidden.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 Visually Hidden ]\n*/\n\n:host(:not(:focus-within)) {\n    position: absolute !important;\n    width: 1px !important;\n    height: 1px !important;\n    clip: rect(0 0 0 0) !important;\n    clip-path: inset(50%) !important;\n    border: none !important;\n    overflow: hidden !important;\n    white-space: nowrap !important;\n    padding: 0 !important;\n}\n";
-class VisuallyHidden extends WJElement {
-  /**
-   * Creates an instance of VisuallyHidden.
-   */
+import t from "./wje-element.js";
+class e extends t {
   constructor() {
     super();
-    /**
-     * The class name for the component.
-     * @type {string}
-     */
     __publicField(this, "className", "VisuallyHidden");
   }
-  /**
-   * Returns the CSS stylesheet for the component.
-   * @static
-   * @returns {CSSStyleSheet} The CSS stylesheet
-   */
   static get cssStyleSheet() {
-    return styles;
+    return ":host(:not(:focus-within)){position:absolute!important;width:1px!important;height:1px!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;border:none!important;overflow:hidden!important;white-space:nowrap!important;padding:0!important}";
   }
-  /**
-   * Returns the list of observed attributes.
-   * @static
-   * @returns {Array} An empty array
-   */
   static get observedAttributes() {
     return [];
   }
-  /**
-   * Sets up the attributes for the component.
-   */
   setupAttributes() {
     this.isShadowRoot = "open";
   }
-  /**
-   * Draws the component for the visually hidden element.
-   * @returns {object} Document fragment
-   */
   draw() {
-    let fragment = document.createDocumentFragment();
-    let slot = document.createElement("slot");
-    fragment.appendChild(slot);
-    return fragment;
+    let t2 = document.createDocumentFragment(), e2 = document.createElement("slot");
+    return t2.appendChild(e2), t2;
   }
 }
-VisuallyHidden.define("wje-visually-hidden", VisuallyHidden);
+e.define("wje-visually-hidden", e);
 export {
-  VisuallyHidden as default
+  e as default
 };
 //# sourceMappingURL=wje-visually-hidden.js.map

package/dist/wje-visually-hidden.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-visually-hidden.js","sources":["../packages/wje-visually-hidden/visually-hidden.element.js","../packages/wje-visually-hidden/visually-hidden.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `VisuallyHidden` is a custom web component that represents a visually hidden element.\n * @summary This element represents a visually hidden element.\n * @documentation https://elements.webjet.sk/components/visually-hidden\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the visually hidden element.\n * @tag wje-visually-hidden\n */\nexport default class VisuallyHidden extends WJElement {\n    /**\n     * Creates an instance of VisuallyHidden.\n     */\n    constructor() {\n        super();\n    }\n\n    /**\n     * The class name for the component.\n     * @type {string}\n     */\n    className = 'VisuallyHidden';\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 [];\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 visually hidden element.\n     * @returns {object} Document fragment\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let slot = document.createElement('slot');\n\n        fragment.appendChild(slot);\n\n        return fragment;\n    }\n}\n","import VisuallyHidden from './visually-hidden.element.js';\n\nexport default VisuallyHidden;\n\nVisuallyHidden.define('wje-visually-hidden', VisuallyHidden);\n"],"names":[],"mappings":";;;;;AAYe,MAAM,uBAAuB,UAAU;AAAA;AAAA;AAAA;AAAA,EAIlD,cAAc;AACV,UAAK;AAOT;AAAA;AAAA;AAAA;AAAA,qCAAY;AAAA,EANZ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAaA,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACX;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOA,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,OAAO,SAAS,cAAc,MAAM;AAExC,aAAS,YAAY,IAAI;AAEzB,WAAO;AAAA,EACX;AACJ;AC5DA,eAAe,OAAO,uBAAuB,cAAc;"}
+{"version":3,"file":"wje-visually-hidden.js","sources":["../packages/wje-visually-hidden/visually-hidden.element.js","../packages/wje-visually-hidden/visually-hidden.js"],"sourcesContent":["import { default as WJElement } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * `VisuallyHidden` is a custom web component that represents a visually hidden element.\n * @summary This element represents a visually hidden element.\n * @documentation https://elements.webjet.sk/components/visually-hidden\n * @status stable\n * @augments {WJElement}\n * @slot - The default slot for the visually hidden element.\n * @tag wje-visually-hidden\n */\nexport default class VisuallyHidden extends WJElement {\n    /**\n     * Creates an instance of VisuallyHidden.\n     */\n    constructor() {\n        super();\n    }\n\n    /**\n     * The class name for the component.\n     * @type {string}\n     */\n    className = 'VisuallyHidden';\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 [];\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 visually hidden element.\n     * @returns {object} Document fragment\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let slot = document.createElement('slot');\n\n        fragment.appendChild(slot);\n\n        return fragment;\n    }\n}\n","import VisuallyHidden from './visually-hidden.element.js';\n\nexport default VisuallyHidden;\n\nVisuallyHidden.define('wje-visually-hidden', VisuallyHidden);\n"],"names":["VisuallyHidden","WJElement","constructor","super","className","cssStyleSheet","setupAttributes","this","isShadowRoot","draw","fragment","document","createDocumentFragment","slot","createElement","appendChild","define"],"mappings":";;;;AAYe,MAAMA,UAAuBC,EAAAA;AAAAA,EAIxC,cAAAC;AACIC,UAAAA;AAOJC,qCAAY;AAAA,EANZ;AAAA,EAaA,2BAAWC;AACP;EACJ;AAAA,EAOA,WAAA;AACI,WAAO,CAAA;AAAA,EACX;AAAA,EAKA,kBAAAC;AACIC,SAAKC,eAAe;AAAA,EACxB;AAAA,EAMA,OAAAC;AACI,QAAIC,KAAWC,SAASC,0BAEpBC,KAAOF,SAASG,cAAc,MAAA;AAIlC,WAFAJ,GAASK,YAAYF,EAAAA,GAEdH;AAAAA,EACX;AAAA;AC3DJV,EAAegB,OAAO,uBAAuBhB,CAAAA;"}

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.7.7",
+  "version": "0.8.0",
   "homepage": "https://github.com/lencys/wj-elements",
   "author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
   "license": "MIT",
@@ -119,6 +119,7 @@
     "@faker-js/faker": "^8.0.0",
     "@open-wc/semantic-dom-diff": "^0.20.1",
     "@open-wc/testing": "^3.2.0",
+    "@rollup/plugin-terser": "^1.0.0",
     "@web/test-runner": "^0.19.0",
     "@web/test-runner-commands": "^0.9.0",
     "@web/test-runner-playwright": "^0.11.0",
@@ -140,7 +141,7 @@
     "sass": "^1.83.0",
     "sinon": "^21.0.2",
     "typescript": "^5.8.2",
-    "vite": "^6.4.1",
+    "vite": "^7.3.6",
     "vite-plugin-dts": "^4.5.0",
     "vite-plugin-javascript-obfuscator": "^3.1.0"
   }

package/dist/form-associated-element-DEQ4y-jn.js

@@ -1,245 +0,0 @@
-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";
-import { event } from "./event.js";
-class FormAssociatedElement extends WJElement {
-  constructor() {
-    super();
-  }
-  /**
-   * Sets the 'name' attribute to the given value.
-   * @param {string} value The new value for the 'name' attribute.
-   */
-  set name(value) {
-    this.setAttribute("name", value);
-  }
-  /**
-   * Getter for the name attribute.
-   * @returns {string} The name of the input.
-   */
-  get name() {
-    return this.getAttribute("name");
-  }
-  /**
-   * Getter for the type attribute.
-   * @returns {string} The type of the input.
-   */
-  get type() {
-    return this.getAttribute("type");
-  }
-  /**
-   * Sets or removes the 'required' attribute on the element.
-   * @param {boolean} value If true, adds the 'required' attribute. If false, removes the 'required' attribute.
-   */
-  set required(value) {
-    if (value) {
-      this.setAttribute("required", "");
-    } else {
-      this.removeAttribute("required");
-    }
-  }
-  /**
-   * Checks if the 'required' attribute is present on the element.
-   * @returns {boolean} `true` if the 'required' attribute is set, otherwise `false`.
-   */
-  get required() {
-    return this.hasAttribute("required");
-  }
-  /**
-   * Setter for the invalid attribute.
-   * @param {boolean} isInvalid Whether the input is invalid.
-   */
-  set invalid(isInvalid) {
-    if (isInvalid) this.setAttribute("invalid", "");
-    else this.removeAttribute("invalid");
-  }
-  /**
-   * Getter for the invalid attribute.
-   * @returns {boolean} Whether the attribute is present.
-   */
-  get invalid() {
-    return this.hasAttribute("invalid");
-  }
-  /**
-   * Set checked attribute.
-   * @param {boolean} value true if the toggle is checked, false otherwise
-   */
-  set disabled(value) {
-    if (value) {
-      this.setAttribute("disabled", "");
-    } else {
-      this.removeAttribute("disabled");
-    }
-  }
-  /**
-   * Get disabled attribute value.
-   * @returns {boolean} true if the toggle is disabled, false otherwise
-   */
-  get disabled() {
-    return this.hasAttribute("disabled");
-  }
-  /**
-   * Retrieves the form element associated with this object.
-   * @returns {HTMLFormElement|null} The associated form element, or null if there isn't one.
-   */
-  get form() {
-    return this.internals.form;
-  }
-  /**
-   * Retrieves the validity state of the element by returning the validity object from the internal element.
-   * The validity object provides information on whether the element satisfies its validation constraints.
-   * @returns {ValidityState} The validity state object representing the element's validation constraints.
-   */
-  get validity() {
-    return this.internals.validity;
-  }
-  /**
-   * Retrieves the current validation message associated with the element.
-   * @returns {string} The validation message that describes why the element's value fails validity checks.
-   */
-  get validationMessage() {
-    return this.internals.validationMessage;
-  }
-  /**
-   * Indicates whether the element is a candidate for constraint validation.
-   * @returns {boolean} Returns true if the element will be validated during constraint validation, false otherwise.
-   */
-  get willValidate() {
-    return this.internals.willValidate;
-  }
-  /**
-   * Validates the input element associated with the component and updates its validity state
-   * and error messages based on the user's input and the current validation rules.
-   * @returns {void} This method does not return a value. It modifies the validity state
-   * internally and sets appropriate validation messages.
-   */
-  validate() {
-    const validState = this.input.validity;
-    if (!validState.valid) {
-      for (let state in validState) {
-        const attr = `message-${state.toString()}`;
-        if (validState[state]) {
-          this.validationError = state.toString();
-          let errorMessage = this.message;
-          if (!this.hasAttribute("message"))
-            errorMessage = this.hasAttribute(attr) ? this.getAttribute(attr) : this.input.validationMessage;
-          this.internals.setValidity({ [this.validationError]: true }, errorMessage, this.input);
-        }
-      }
-    } else {
-      this.internals.setValidity({});
-    }
-  }
-  /**
-   * Propagates a validation event based on the validity state of the component.
-   *
-   * This method checks the validity status of the component and emits a custom
-   * event if the component is invalid. The event's name and additional details
-   * can be specified.
-   * @param {string} [eventName] The name of the event to dispatch when the component is invalid.
-   * @param {object} [detail] Additional detail to include in the dispatched event.
-   * @returns {void} This method does not return a value.
-   */
-  propagateValidation(eventName = "invalid", detail = {}) {
-    const internals = this.internals;
-    this.invalid = !this.pristine && !internals.validity.valid;
-    if (this.invalid) {
-      event.dispatchCustomEvent(this, this.tagName.toLocaleLowerCase() + ":" + eventName, detail);
-    }
-  }
-  /**
-   * Displays an invalid message for the current element.
-   * If an error message element does not exist within the designated slot,
-   * it creates one and appends it to the slot. Updates the text content
-   * of the error message element with the validation message from the
-   * element's internals.
-   * @returns {void} This method does not return any value.
-   */
-  showInvalidMessage() {
-    const internals = this.internals;
-    const slot = this.querySelector("[slot='error']");
-    let errorMessageEl = slot == null ? void 0 : slot.querySelector("[error-message]");
-    if (!errorMessageEl) {
-      const error = document.createElement("div");
-      error.setAttribute("error-message", "");
-      slot == null ? void 0 : slot.append(error);
-      errorMessageEl = error;
-    }
-    errorMessageEl.textContent = internals.validationMessage;
-  }
-  /**
-   * Checks the validity of the input by invoking custom validation logic
-   * and then verifying against internal validation rules.
-   * @returns {boolean} Returns true if the input is valid according to both custom validation and internal validation rules, otherwise false.
-   */
-  checkValidity() {
-    this.validate();
-    return this.internals.checkValidity();
-  }
-  /**
-   * Callback to handle the reset action for a form.
-   * Resets the value of the form control to its default value, updates the form value, and clears any validity states.
-   * @returns {void} Does not return a value.
-   */
-  formResetCallback() {
-    this.value = this.defaultValue;
-    this.internals.setFormValue(this.defaultValue);
-    this.internals.setValidity({});
-  }
-  /**
-   * Restores the form state by assigning the provided state value
-   * and updating the internal form value and validity.
-   * @param {object} state The state object containing the value to restore the form.
-   * @param {*} state.value The value to set for the form element.
-   * @returns {void} This method does not return any value.
-   */
-  formStateRestoreCallback(state) {
-    this.value = state.value;
-    this.internals.setFormValue(state.value);
-    this.internals.setValidity({});
-  }
-  /**
-   * Callback method to save the current state of a form.
-   * This method captures and returns the form's value property.
-   * @returns {object} An object containing the `value` property of the current form state.
-   */
-  formStateSaveCallback() {
-    return {
-      value: this.value
-    };
-  }
-  /**
-   * Toggles the disabled state of the component and updates corresponding attributes.
-   * @param {boolean} disabled Indicates whether the form should be marked as disabled.
-   * If true, the 'disabled' class is added, and the 'disabled' attribute is set.
-   * If false, both the class and attribute are removed.
-   * @returns {void}
-   */
-  formDisabledCallback(disabled) {
-    var _a;
-    (_a = this.native) == null ? void 0 : _a.classList.toggle("disabled", disabled);
-    this.toggleAttribute("disabled", disabled);
-  }
-  /**
-   * A lifecycle callback that is executed when the element is associated with a form.
-   * It updates the form's value field with the element's value and sets up an event
-   * listener to perform validation and propagate it whenever the form is submitted.
-   * @returns {void} Does not return any value.
-   */
-  formAssociatedCallback() {
-    var _a;
-    if (this.form) {
-      this.internals.setFormValue(this.value);
-      (_a = this.form) == null ? void 0 : _a.addEventListener("submit", () => {
-        this.validate();
-        this.propagateValidation();
-      });
-    }
-  }
-}
-__publicField(FormAssociatedElement, "formAssociated", true);
-export {
-  FormAssociatedElement as F
-};
-//# sourceMappingURL=form-associated-element-DEQ4y-jn.js.map