import { r as g, c as h, f as p, h as d, H as I, g as w } from "./index.61732cef.js";
import { S as f } from "./sortable.esm-CMrz6687.dac971cd.js";
import { t as m } from "./swirl-tree-view.config-BkSXzL50.94f4a648.js";
import "react";
import "react-dom";
const x = () => "swirl-tree-view{display:block}swirl-tree-view *{box-sizing:border-box}.tree-view{display:flex;margin:0;padding:0 0 var(--s-space-4);flex-direction:column;gap:var(--s-space-2)}.tree-view--dragging{cursor:grabbing}.tree-view--dragging .tree-view-item__link:hover,.tree-view--dragging .tree-view-item__link:active{background-color:var(--s-background-default) !important}.tree-view--dragging .tree-view-item__link:hover .tree-view-item__drag-handle,.tree-view--dragging .tree-view-item__link:active .tree-view-item__drag-handle{opacity:0}", E = {
  cannotBeDropped: "Cannot drop here.",
  end: "{itemLabel}, dropped. Parent item: {parentLabel}. Final position in list: {position} of {childrenCount}.",
  initial: "Press space to move items.",
  moved: "{itemLabel}. Parent item: {parentLabel}. Current position in list: {position} of {childrenCount}.",
  start: "{itemLabel}, grabbed. Parent item: {parentLabel}. Current position in list: {position} of {childrenCount}. Press up and down arrow keys to change position, Space to drop."
}, b = class {
  constructor(e) {
    g(this, e), this.dropItem = h(this, "dropItem", 7), this.itemExpansionChanged = h(this, "itemExpansionChanged", 7), this.dragDropInstructions = E, this.dragDropItemSelector = "swirl-tree-view-item", this.semantics = "tree", this.liveRegionText = "", this.onSlotChange = () => {
      this.init();
    }, this.onFocus = () => {
      this.liveRegionText === "" && this.updateLiveRegionText("initial");
    }, this.onBlur = (t) => {
      const i = t.relatedTarget;
      this.el.contains(i) || this.liveRegionText !== "" && this.updateLiveRegionText();
    };
  }
  componentDidLoad() {
    Boolean(this.initiallyExpandedItemIds) && this.expandItems(this.initiallyExpandedItemIds), this.init(), this.setUpDragDrop();
  }
  disconnectedCallback() {
    var e;
    (e = this.sortable) == null || e.destroy();
  }
  handleEnableDragDropChange() {
    this.setUpDragDrop();
  }
  async expandItems(e) {
    if (this.semantics !== "tree")
      return;
    this.getItems().filter((i) => e.includes(i.itemId)).forEach((i) => i.expand());
  }
  onItemDrop(e) {
    if (e.stopPropagation(), this.dropItem.emit(e.detail), e.detail.targetParentItemId) {
      const t = this.el.querySelector(`
        swirl-tree-view-item#${e.detail.targetParentItemId},
        #${e.detail.targetParentItemId} > swirl-tree-view-item
      `);
      t && (p(t), t.expand());
    }
    if (e.detail.sourceParentItemId) {
      const t = this.el.querySelector(`
        swirl-tree-view-item#${e.detail.sourceParentItemId},
        #${e.detail.sourceParentItemId} > swirl-tree-view-item
      `);
      t && (p(t), t.expand());
    }
  }
  onKeyDown(e) {
    this.semantics === "tree" && (e.key === "ArrowDown" ? (e.preventDefault(), this.selectNextItem()) : e.key === "ArrowUp" ? (e.preventDefault(), this.selectPreviousItem()) : e.key === "ArrowRight" ? (e.preventDefault(), this.expandSelectedItem()) : e.key === "ArrowLeft" ? (e.preventDefault(), this.collapseSelectedItem()) : e.key === "Home" ? (e.preventDefault(), this.selectFirstItem()) : e.key === "End" && (e.preventDefault(), this.selectLastItem()));
  }
  onItemSelected(e) {
    this.getItems().forEach((t) => {
      t !== e.target && t.unselect();
    });
  }
  onExpandedChange(e) {
    const t = e.target;
    (t == null ? void 0 : t.tagName) === "SWIRL-TREE-VIEW-ITEM" && this.itemExpansionChanged.emit({
      itemId: t.itemId,
      expanded: e.detail
    });
  }
  onEndKeyboardMove(e) {
    this.updateLiveRegionText("end", e.detail);
  }
  onStartKeyboardMove(e) {
    this.updateLiveRegionText("start", e.detail);
  }
  onKeyboardMove(e) {
    this.updateLiveRegionText("moved", e.detail);
  }
  init() {
    var i;
    if (this.semantics !== "tree")
      return;
    const e = this.getSelectedItem(), t = this.getItems();
    t.forEach((r) => r.unselect()), Boolean(e) ? e.select() : (i = t[0]) == null || i.select();
  }
  setUpDragDrop() {
    this.sortable && (this.sortable.destroy(), this.sortable = void 0), this.enableDragDrop && (this.sortable = new f(this.listElement, {
      ...m,
      draggable: this.dragDropItemSelector,
      onMove: (e) => {
        var t;
        return typeof this.canDrop == "function" ? this.canDrop({
          parentId: (t = e.to.closest("swirl-tree-view-item")) == null ? void 0 : t.itemId,
          position: Math.max(Array.from(e.to.children).indexOf(e.related), 0) + 1
        }) : !0;
      },
      onStart: (e) => {
        var t, i;
        (i = (t = m).onStart) == null || i.call(t, e);
      },
      onEnd: (e) => {
        var a, s, c;
        e.stopPropagation(), (s = (a = m).onEnd) == null || s.call(a, e);
        const { to: t, newIndex: i, oldIndex: r, item: n } = e, o = void 0, l = t.closest("swirl-tree-view-item");
        l && (p(l), l.expand()), this.dropItem.emit({
          newIndex: i,
          oldIndex: r,
          item: n,
          itemId: (c = n.id) != null ? c : n.querySelector(":scope > swirl-tree-view-item").id,
          newNextSiblingItemId: i < t.children.length - 1 ? t.children[i + 1].id : void 0,
          newPrevSiblingItemId: i > 0 ? t.children[i - 1].id : void 0,
          sourceParentItemId: o,
          targetParentItemId: l == null ? void 0 : l.itemId
        });
      }
    }));
  }
  selectFirstItem() {
    var e;
    this.unselectAllItems(), (e = this.getItems()[0]) == null || e.select(!0);
  }
  selectLastItem() {
    const t = this.getItems().filter((i) => {
      var r;
      return ((r = i.parentElement.closest("swirl-tree-view-item")) == null ? void 0 : r.querySelector(':scope > li > [aria-expanded="true"]')) || !Boolean(i.parentElement.closest("swirl-tree-view-item"));
    }).pop();
    this.unselectAllItems(), t == null || t.select(!0);
  }
  expandSelectedItem() {
    const e = this.getSelectedItem();
    if (!Boolean(e))
      return;
    this.isItemExpanded(e) ? this.selectNextItem() : e.expand();
  }
  collapseSelectedItem() {
    const e = this.getSelectedItem();
    if (!Boolean(e))
      return;
    if (this.isItemExpanded(e))
      e.collapse();
    else {
      const i = e.parentElement.closest("swirl-tree-view-item");
      if (!Boolean(i))
        return;
      this.unselectAllItems(), i.select(!0);
    }
  }
  selectNextItem() {
    var a;
    const e = this.getSelectedItem(), t = this.isItemExpanded(e), i = this.getNextSibling(e);
    let r = e.parentElement.closest("swirl-tree-view-item"), n = this.getNextSibling(r);
    for (; Boolean(r) && !Boolean(n); )
      r = r == null ? void 0 : r.parentElement.closest("swirl-tree-view-item, swirl-tree-view"), n = this.getNextSibling(r);
    const o = e.querySelector("swirl-tree-view-item"), l = t ? o : i || n;
    !Boolean(l) || (this.unselectAllItems(), (a = l.select) == null || a.call(l, !0));
  }
  selectPreviousItem() {
    var l, a;
    const e = this.getItems(), t = this.getSelectedItem(), i = this.getPreviousSibling(t);
    if (Boolean(i == null ? void 0 : i.querySelector(':scope > li > [aria-expanded="true"]'))) {
      let s = i == null ? void 0 : i.querySelector(":scope > li > ul > swirl-tree-view-item:last-child, :scope > li > ul > *:last-child > swirl-tree-view-item"), c = Boolean(s == null ? void 0 : s.querySelector(':scope > li > [aria-expanded="true"]'));
      for (; c; )
        s = s == null ? void 0 : s.querySelector(":scope > li > ul > swirl-tree-view-item:last-child, :scope > li > ul > *:last-child > swirl-tree-view-item"), c = Boolean(s == null ? void 0 : s.querySelector('[aria-expanded="true"]'));
      e.forEach((u) => u.unselect()), (l = s.select) == null || l.call(s, !0);
      return;
    }
    const n = t.parentElement.closest("swirl-tree-view-item"), o = i || n;
    !Boolean(o) || (e.forEach((s) => s.unselect()), (a = o.select) == null || a.call(o, !0));
  }
  unselectAllItems() {
    this.getItems().forEach((e) => e.unselect());
  }
  getItems() {
    return Array.from(this.el.querySelectorAll("swirl-tree-view-item"));
  }
  getSelectedItem() {
    return this.getItems().find((e) => {
      var t;
      return ((t = e.querySelector("a")) == null ? void 0 : t.getAttribute("aria-selected")) === "true";
    });
  }
  isItemExpanded(e) {
    return Boolean(e.querySelector(':scope > li > [aria-expanded="true"]'));
  }
  getNextSibling(e) {
    var i, r, n;
    if (((i = e == null ? void 0 : e.nextElementSibling) == null ? void 0 : i.tagName) === "SWIRL-TREE-VIEW-ITEM")
      return e.nextElementSibling;
    const t = (n = (r = e == null ? void 0 : e.parentElement) == null ? void 0 : r.nextElementSibling) == null ? void 0 : n.querySelector("swirl-tree-view-item");
    return t != null ? t : void 0;
  }
  getPreviousSibling(e) {
    var i, r, n;
    if (((i = e == null ? void 0 : e.previousElementSibling) == null ? void 0 : i.tagName) === "SWIRL-TREE-VIEW-ITEM")
      return e.previousElementSibling;
    const t = (n = (r = e == null ? void 0 : e.parentElement) == null ? void 0 : r.previousElementSibling) == null ? void 0 : n.querySelector("swirl-tree-view-item");
    return t != null ? t : void 0;
  }
  updateLiveRegionText(e, t) {
    let i = e ? this.dragDropInstructions[e] : "";
    t != null && t.canDrop || (i += ` ${this.dragDropInstructions.cannotBeDropped}`);
    for (const [r, n] of Object.entries(t != null ? t : {}))
      i = i.replaceAll(`{${r}}`, String(n));
    i !== this.liveRegionText && (this.liveRegionText = i);
  }
  render() {
    return d(I, { key: "16d74aad51e57f5fc909eec33f55ee95bee94950" }, this.enableDragDrop && d("swirl-visually-hidden", { key: "7aa7785d4b14b0b1b206fbeb4ec3406e50db7ee4" }, d("span", { key: "4cb2256c612883094d69644e00095a37ed5a9b9d", "aria-live": "assertive" }, this.liveRegionText)), d("ul", { key: "b7085ee5c4c9a7e14d43c025019da22da00b3e6c", "aria-label": this.label, class: "tree-view", onFocusin: this.onFocus, onFocusout: this.onBlur, role: this.semantics === "tree" ? "tree" : void 0, ref: (e) => this.listElement = e, tabIndex: -1 }, d("slot", { key: "0cafa4fef896d51a2fbc46ccabf02cc61522e562", onSlotchange: this.onSlotChange })));
  }
  get el() {
    return w(this);
  }
  static get watchers() {
    return {
      enableDragDrop: [{
        handleEnableDragDropChange: 0
      }]
    };
  }
};
b.style = x();
export {
  b as swirl_tree_view
};
