wj-elements 0.7.2 → 0.7.4

package/dist/wje-tree.js

@@ -5,7 +5,7 @@ import WJElement from "./wje-element.js";
 const styles = "/*\n[ WJ Tree ]\n*/\n\n:host {\n    position: relative;\n    width: 100%;\n    font-size: 0;\n}\n";
 class Tree extends WJElement {
   /**
-   * Creates an instance of Toast.
+   * Creates an instance of Tree.
    */
   constructor() {
     super();
@@ -22,24 +22,89 @@ class Tree extends WJElement {
      * @param {Event} e The click event object.
      */
     __publicField(this, "handleClick", (e) => {
+      var _a;
       if (e == null ? void 0 : e.preventDefault) e.preventDefault();
-      let selectedItem = e.target.closest("wje-tree-item");
-      let isClickButton = e.composedPath().some((el) => {
-        var _a;
-        return (_a = el == null ? void 0 : el.classList) == null ? void 0 : _a.contains("toggle");
+      if (this.reorder && this.isReorderHandleEvent(e)) return;
+      const selectedItem = this.getTreeItemFromEvent(e);
+      if (!selectedItem) return;
+      const isClickButton = (((_a = e.composedPath) == null ? void 0 : _a.call(e)) || []).some((el) => {
+        var _a2;
+        return (_a2 = el == null ? void 0 : el.classList) == null ? void 0 : _a2.contains("toggle");
       });
       if (isClickButton) return;
       if (this.selection === "single") {
-        if (selectedItem) {
-          for (let item of this.getAllItems()) {
-            item.selected = item === selectedItem;
-          }
+        for (let item of this.getAllItems()) {
+          item.selected = item === selectedItem;
         }
       } else if (this.selection === "multiple") {
         selectedItem.selected = !selectedItem.selected;
         this.updateCheckboxState(selectedItem);
       }
     });
+    /**
+     * Starts dragging a tree item when the drag begins from the configured start slot handle.
+     * @param {DragEvent} e The drag event.
+     * @returns {void}
+     */
+    __publicField(this, "handleDragStart", (e) => {
+      var _a;
+      if (!this.reorder || !this.isReorderHandleEvent(e)) return;
+      const item = this.getTreeItemFromEvent(e);
+      if (!item) return;
+      this.draggedItem = item;
+      item.classList.add("wje-tree-dragging");
+      if (e.dataTransfer) {
+        e.dataTransfer.effectAllowed = "move";
+        e.dataTransfer.setData("text/plain", ((_a = item.textContent) == null ? void 0 : _a.trim()) || "");
+      }
+    });
+    /**
+     * Updates the current drop target and exposes a visual drop position.
+     * @param {DragEvent} e The drag event.
+     * @returns {void}
+     */
+    __publicField(this, "handleDragOver", (e) => {
+      if (!this.reorder || !this.draggedItem) return;
+      const target = this.getTreeItemFromEvent(e);
+      if (!this.canDrop(this.draggedItem, target)) {
+        this.clearDropState();
+        return;
+      }
+      e.preventDefault();
+      if (e.dataTransfer) e.dataTransfer.dropEffect = "move";
+      const position = this.getDropPosition(e, target);
+      this.setDropState(target, position);
+    });
+    /**
+     * Completes a tree item move.
+     * @param {DragEvent} e The drop event.
+     * @returns {void}
+     */
+    __publicField(this, "handleDrop", (e) => {
+      if (!this.reorder || !this.draggedItem) return;
+      e.preventDefault();
+      const target = this.dropTarget || this.getTreeItemFromEvent(e);
+      const position = this.dropPosition || this.getDropPosition(e, target);
+      const detail = this.moveItem(this.draggedItem, target, position);
+      if (detail) {
+        this.dispatchEvent(new CustomEvent("wje-tree:move", {
+          detail,
+          bubbles: true,
+          composed: true
+        }));
+      }
+      this.clearDragState();
+    });
+    /**
+     * Clears drag state after the browser drag operation ends.
+     * @returns {void}
+     */
+    __publicField(this, "handleDragEnd", () => {
+      this.clearDragState();
+    });
+    this.draggedItem = null;
+    this.dropTarget = null;
+    this.dropPosition = null;
   }
   /**
    * Sets the selection attribute for the element.
@@ -56,6 +121,21 @@ class Tree extends WJElement {
   get selection() {
     return this.getAttribute("selection") || "single";
   }
+  /**
+   * Enables reordering tree items by dragging an element assigned to the start slot.
+   * @param {boolean} value Whether reordering is enabled.
+   */
+  set reorder(value) {
+    if (value) this.setAttribute("reorder", "");
+    else this.removeAttribute("reorder");
+  }
+  /**
+   * Indicates whether tree items can be reordered with the start slot handle.
+   * @returns {boolean}
+   */
+  get reorder() {
+    return this.hasAttribute("reorder");
+  }
   /**
    * Returns the CSS stylesheet for the component.
    * @static
@@ -78,17 +158,21 @@ class Tree extends WJElement {
    * @returns {void} This method does not return a value.
    */
   beforeDraw() {
+    const template = this.querySelector("template");
     const items = this.querySelectorAll("wje-tree-item");
     items == null ? void 0 : items.forEach((item) => {
+      var _a;
       item.selection = this.selection;
-      this.getExpandCollapseIcon(item, "expand");
-      this.getExpandCollapseIcon(item, "collapse");
-      this.getSlots(item, "start");
-      this.getSlots(item, "end");
+      (_a = item.syncNestingState) == null ? void 0 : _a.call(item);
+      this.appendTemplateSlot(item, template, "expand");
+      this.appendTemplateSlot(item, template, "collapse");
+      this.appendTemplateSlot(item, template, "start");
+      this.appendTemplateSlot(item, template, "end");
+      if (this.reorder) this.setupReorderHandle(item);
     });
   }
   /**
-   * Draw method for the toast notification.
+   * Draw method for the tree.
    * @returns {object} Document fragment
    */
   draw() {
@@ -109,6 +193,10 @@ class Tree extends WJElement {
    */
   afterDraw() {
     this.addEventListener("click", this.handleClick);
+    this.addEventListener("dragstart", this.handleDragStart);
+    this.addEventListener("dragover", this.handleDragOver);
+    this.addEventListener("drop", this.handleDrop);
+    this.addEventListener("dragend", this.handleDragEnd);
     this.syncAria();
   }
   /**
@@ -122,6 +210,10 @@ class Tree extends WJElement {
   }
   beforeDisconnect() {
     this.removeEventListener("click", this.handleClick);
+    this.removeEventListener("dragstart", this.handleDragStart);
+    this.removeEventListener("dragover", this.handleDragOver);
+    this.removeEventListener("drop", this.handleDrop);
+    this.removeEventListener("dragend", this.handleDragEnd);
   }
   /**
    * Retrieves all items that match the selector 'wje-tree-item' within the current context.
@@ -131,30 +223,266 @@ class Tree extends WJElement {
     return [...this.querySelectorAll("wje-tree-item")];
   }
   /**
-   * Retrieves and appends an expand/collapse icon to a given item based on the provided status.
-   * @param {HTMLElement} item The DOM element to which the icon will be appended.
-   * @param {string} status The status indicating which icon to retrieve (e.g., "expand" or "collapse").
-   * @returns {void} This method does not return a value. If the icon matching the given status is not found, a warning is logged.
+   * Retrieves and appends a template slot to a tree item.
+   * @param {HTMLElement} item The DOM element to which the slot content will be appended.
+   * @param {HTMLTemplateElement|null} template Template that may provide reusable slot content.
+   * @param {string} slotName Name of the projected slot content to clone.
+   * @returns {void}
+   */
+  appendTemplateSlot(item, template, slotName) {
+    const slot = template == null ? void 0 : template.content.querySelector(`[slot="${slotName}"]`);
+    if (!slot) return;
+    const templateSlotClass = this.getTemplateSlotClass(slotName);
+    const existing = item.querySelector(`:scope > [slot="${slotName}"].${templateSlotClass}`);
+    if (existing) return;
+    const slotClone = slot.cloneNode(true);
+    slotClone.classList.add("wje-tree-template-slot", templateSlotClass);
+    item.append(slotClone);
+  }
+  /**
+   * Returns the internal class used to identify cloned template slot content.
+   * @param {string} slotName Name of the projected slot.
+   * @returns {string}
+   */
+  getTemplateSlotClass(slotName) {
+    return `wje-tree-template-slot-${slotName}`;
+  }
+  /**
+   * Marks direct start slot content as the drag handle for reorderable trees.
+   * @param {HTMLElement} item Host item that receives draggable start content.
+   * @returns {void}
+   */
+  setupReorderHandle(item) {
+    const handles = item.querySelectorAll(':scope > [slot="start"]');
+    handles.forEach((handle) => {
+      handle.setAttribute("draggable", "true");
+      handle.classList.add("wje-tree-drag-handle");
+      if (!handle.hasAttribute("aria-label")) {
+        handle.setAttribute("aria-label", "Move tree item");
+      }
+    });
+  }
+  /**
+   * Finds a tree item from a composed event path.
+   * @param {Event} e User interaction that may originate inside shadow DOM.
+   * @returns {HTMLElement|null}
    */
-  getExpandCollapseIcon(item, status) {
+  getTreeItemFromEvent(e) {
+    var _a, _b, _c;
+    const path = ((_a = e.composedPath) == null ? void 0 : _a.call(e)) || [];
+    const pathItem = path.find((el) => this.isTreeItem(el) && this.contains(el));
+    if (pathItem) return pathItem;
+    const targetItem = (_c = (_b = e.target) == null ? void 0 : _b.closest) == null ? void 0 : _c.call(_b, "wje-tree-item");
+    return targetItem && this.contains(targetItem) ? targetItem : null;
+  }
+  /**
+   * Checks whether the event started from a reorder handle.
+   * @param {Event} e User interaction to inspect.
+   * @returns {boolean}
+   */
+  isReorderHandleEvent(e) {
     var _a;
-    let icon = (_a = this.querySelector("template")) == null ? void 0 : _a.content.querySelector(`[slot="${status}"]`);
-    if (!icon) {
-      console.warn(`Icon with slot "${status}" was not found.`);
-      return;
+    return (((_a = e.composedPath) == null ? void 0 : _a.call(e)) || []).some((el) => {
+      var _a2;
+      return (_a2 = el == null ? void 0 : el.classList) == null ? void 0 : _a2.contains("wje-tree-drag-handle");
+    });
+  }
+  /**
+   * Checks whether a node is a tree item element.
+   * @param {object} node The node to inspect.
+   * @returns {boolean}
+   */
+  isTreeItem(node) {
+    return node instanceof Element && node.localName === "wje-tree-item";
+  }
+  /**
+   * Returns direct tree item children for a tree or tree item parent.
+   * @param {HTMLElement} parent The parent element.
+   * @returns {HTMLElement[]}
+   */
+  getDirectTreeItems(parent) {
+    return Array.from((parent == null ? void 0 : parent.children) || []).filter((child) => this.isTreeItem(child));
+  }
+  /**
+   * Gets the index of a tree item among direct tree item siblings.
+   * @param {HTMLElement} item Element whose sibling position should be resolved.
+   * @returns {number}
+   */
+  getTreeItemIndex(item) {
+    return this.getDirectTreeItems(item.parentElement).indexOf(item);
+  }
+  /**
+   * Determines whether the dragged item can be dropped on the target.
+   * @param {HTMLElement} draggedItem Item currently being moved.
+   * @param {HTMLElement} targetItem Candidate item under the pointer.
+   * @returns {boolean}
+   */
+  canDrop(draggedItem, targetItem) {
+    return !!draggedItem && !!targetItem && draggedItem !== targetItem && !draggedItem.contains(targetItem);
+  }
+  /**
+   * Resolves the drop position against the visible tree item row.
+   * @param {DragEvent} e Browser drag event carrying pointer coordinates.
+   * @param {HTMLElement|null} target Item used to calculate row boundaries.
+   * @returns {'before'|'inside'|'after'}
+   */
+  getDropPosition(e, target) {
+    var _a, _b, _c;
+    const row = (_a = target == null ? void 0 : target.shadowRoot) == null ? void 0 : _a.querySelector(".item");
+    const rect = ((_b = row == null ? void 0 : row.getBoundingClientRect) == null ? void 0 : _b.call(row)) || ((_c = target == null ? void 0 : target.getBoundingClientRect) == null ? void 0 : _c.call(target));
+    if (!rect) return "after";
+    const topBoundary = rect.top + rect.height * 0.25;
+    const bottomBoundary = rect.bottom - rect.height * 0.25;
+    if (e.clientY < topBoundary) return "before";
+    if (e.clientY > bottomBoundary) return "after";
+    return "inside";
+  }
+  /**
+   * Applies the visual drop position to the current target item.
+   * @param {HTMLElement} target Item currently showing insertion feedback.
+   * @param {string} position Resolved insertion area for the target row.
+   * @returns {void}
+   */
+  setDropState(target, position) {
+    if (this.dropTarget !== target || this.dropPosition !== position) {
+      this.clearDropState();
+      this.dropTarget = target;
+      this.dropPosition = position;
+      target.classList.add(this.getDropPositionClass(position));
     }
-    let iconClone = icon.cloneNode(true);
-    item.append(iconClone);
   }
-  getSlots(item, slotName) {
+  /**
+   * Clears visual drop target state.
+   * @returns {void}
+   */
+  clearDropState() {
+    var _a;
+    (_a = this.dropTarget) == null ? void 0 : _a.classList.remove(
+      this.getDropPositionClass("before"),
+      this.getDropPositionClass("inside"),
+      this.getDropPositionClass("after")
+    );
+    this.dropTarget = null;
+    this.dropPosition = null;
+  }
+  /**
+   * Clears the active drag state.
+   * @returns {void}
+   */
+  clearDragState() {
     var _a;
-    let slot = (_a = this.querySelector("template")) == null ? void 0 : _a.content.querySelector(`[slot="${slotName}"]`);
-    if (!slot) {
-      console.warn(`Icon with slot "${slotName}" was not found.`);
-      return;
+    (_a = this.draggedItem) == null ? void 0 : _a.classList.remove("wje-tree-dragging");
+    this.clearDropState();
+    this.draggedItem = null;
+  }
+  /**
+   * Returns the internal class used to render a drop marker.
+   * @param {'before'|'inside'|'after'} position Drop marker position.
+   * @returns {string}
+   */
+  getDropPositionClass(position) {
+    return `wje-tree-drop-${position}`;
+  }
+  /**
+   * Moves a tree item relative to another tree item and syncs nesting metadata.
+   * @param {HTMLElement} draggedItem The item being moved.
+   * @param {HTMLElement} targetItem Item that receives or anchors the moved item.
+   * @param {'before'|'inside'|'after'} position The target position.
+   * @returns {object|null} Move detail, or null when the move is invalid.
+   */
+  moveItem(draggedItem, targetItem, position = "after") {
+    var _a, _b, _c;
+    if (!this.canDrop(draggedItem, targetItem)) return null;
+    const fromParent = draggedItem.parentElement;
+    const fromParentItem = (_a = fromParent == null ? void 0 : fromParent.closest) == null ? void 0 : _a.call(fromParent, "wje-tree-item");
+    const fromIndex = this.getTreeItemIndex(draggedItem);
+    if (position === "inside") {
+      targetItem.appendChild(draggedItem);
+      (_b = targetItem.setChildrenExpanded) == null ? void 0 : _b.call(targetItem, true);
+    } else {
+      const parent = targetItem.parentElement;
+      const reference = position === "before" ? targetItem : targetItem.nextSibling;
+      parent.insertBefore(draggedItem, reference);
     }
-    let slotClone = slot.cloneNode(true);
-    item.append(slotClone);
+    this.syncTreeItems();
+    const toParent = draggedItem.parentElement;
+    const toParentItem = (_c = toParent == null ? void 0 : toParent.closest) == null ? void 0 : _c.call(toParent, "wje-tree-item");
+    const toIndex = this.getTreeItemIndex(draggedItem);
+    const orderElements = this.getOrderElements(toParent);
+    const order = orderElements.map((item) => item.innerText.trim());
+    this.refreshMovedItems([fromParentItem, toParentItem, targetItem]);
+    return {
+      item: draggedItem,
+      target: targetItem,
+      position,
+      from: fromIndex,
+      to: toIndex,
+      order,
+      orderElements,
+      orderIds: this.getOrderIds(toParent),
+      itemId: this.getItemId(draggedItem),
+      targetId: this.getItemId(targetItem),
+      fromParentItem,
+      toParentItem,
+      fromParentId: this.getItemId(fromParentItem),
+      toParentId: this.getItemId(toParentItem),
+      fromParent,
+      toParent,
+      fromIndex,
+      toIndex
+    };
+  }
+  /**
+   * Returns cloned direct tree item children for an event detail.
+   * @param {HTMLElement} parent Parent whose direct tree item children should be serialized.
+   * @returns {HTMLElement[]}
+   */
+  getOrderElements(parent) {
+    return this.getDirectTreeItems(parent).map((item) => {
+      const clone = item.cloneNode(true);
+      clone.querySelectorAll(".wje-tree-template-slot").forEach((slot) => slot.remove());
+      return clone;
+    });
+  }
+  /**
+   * Returns stable ids for direct tree item children when they are available.
+   * @param {HTMLElement} parent Parent whose direct tree item children should be serialized.
+   * @returns {Array<string|null>}
+   */
+  getOrderIds(parent) {
+    return this.getDirectTreeItems(parent).map((item) => this.getItemId(item));
+  }
+  /**
+   * Gets an application-facing id from a tree item.
+   * @param {HTMLElement|null} item Tree item to read.
+   * @returns {string|null}
+   */
+  getItemId(item) {
+    if (!this.isTreeItem(item)) return null;
+    return item.getAttribute("value") || item.id || null;
+  }
+  /**
+   * Syncs item selection mode and nesting metadata after a DOM move.
+   * @returns {void}
+   */
+  syncTreeItems() {
+    this.getAllItems().forEach((item) => {
+      var _a, _b;
+      item.selection = this.selection;
+      (_a = item.syncNestingState) == null ? void 0 : _a.call(item);
+      (_b = item.syncAria) == null ? void 0 : _b.call(item);
+    });
+  }
+  /**
+   * Redraws affected parent items so expand/collapse affordances match current children.
+   * @param {HTMLElement[]} items Items that may need refresh.
+   * @returns {void}
+   */
+  refreshMovedItems(items) {
+    [...new Set(items)].forEach((item) => {
+      var _a;
+      if (this.isTreeItem(item)) (_a = item.refresh) == null ? void 0 : _a.call(item);
+    });
   }
   /**
    * Updates the state of a checkbox, syncing the state both upwards to parent elements

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/**\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 * @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 Toast.\n     */\n    constructor() {\n        super();\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     * 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 items = this.querySelectorAll('wje-tree-item');\n        items?.forEach((item) => {\n            item.selection = this.selection;\n\n            this.getExpandCollapseIcon(item, 'expand');\n            this.getExpandCollapseIcon(item, 'collapse');\n\n            this.getSlots(item, 'start');\n            this.getSlots(item, 'end');\n        });\n    }\n\n    /**\n     * Draw method for the toast notification.\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.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    }\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\n        let selectedItem = e.target.closest('wje-tree-item');\n        let isClickButton = e.composedPath().some((el) => el?.classList?.contains('toggle'));\n        if (isClickButton) return;\n\n        if (this.selection === 'single') {\n            if (selectedItem) {\n                for (let item of this.getAllItems()) {\n                    item.selected = item === selectedItem;\n                }\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     * 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 an expand/collapse icon to a given item based on the provided status.\n     * @param {HTMLElement} item The DOM element to which the icon will be appended.\n     * @param {string} status The status indicating which icon to retrieve (e.g., \"expand\" or \"collapse\").\n     * @returns {void} This method does not return a value. If the icon matching the given status is not found, a warning is logged.\n     */\n    getExpandCollapseIcon(item, status) {\n        let icon = this.querySelector('template')?.content.querySelector(`[slot=\"${status}\"]`);\n        if (!icon) {\n            console.warn(`Icon with slot \"${status}\" was not found.`);\n            return;\n        }\n\n        let iconClone = icon.cloneNode(true);\n        item.append(iconClone);\n    }\n\n    getSlots(item, slotName) {\n        let slot = this.querySelector('template')?.content.querySelector(`[slot=\"${slotName}\"]`);\n        if (!slot) {\n            console.warn(`Icon with slot \"${slotName}\" was not found.`);\n            return;\n        }\n\n        let slotClone = slot.cloneNode(true);\n        item.append(slotClone);\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":[],"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":["_a"],"mappings":"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"}

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.2",
+  "version": "0.7.4",
   "homepage": "https://github.com/lencys/wj-elements",
   "author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
   "license": "MIT",