@expcat/tigercat-vue 2.1.2 → 2.1.3

package/dist/chunk-ZFJNCAZX.mjs

@@ -1,758 +0,0 @@
-import {
-  VirtualList
-} from "./chunk-HS4YQGZQ.mjs";
-import {
-  useTigerConfig
-} from "./chunk-UOJOJBEU.mjs";
-
-// src/components/Tree.ts
-import { defineComponent, computed, ref, h, watch, nextTick } from "vue";
-import {
-  classNames,
-  coerceClassValue,
-  getTreeNodeClasses,
-  getTreeNodeExpandIconClasses,
-  treeBaseClasses,
-  treeNodeWrapperClasses,
-  treeNodeIndentClasses,
-  treeNodeCheckboxClasses,
-  treeNodeIconClasses,
-  treeNodeLabelClasses,
-  treeNodeChildrenClasses,
-  treeLoadingClasses,
-  treeEmptyStateClasses,
-  treeLineClasses,
-  getSpinnerSVG,
-  normalizeSvgAttrs,
-  getVisibleTreeItems,
-  getFirstVisibleChildKey,
-  getTreeKeyboardAction,
-  getParentKeys,
-  getAllKeys,
-  findNode,
-  calculateCheckedState,
-  handleNodeCheck,
-  getCheckedKeysByStrategy,
-  filterTreeNodes,
-  getAutoExpandKeys,
-  checkedSetsFromState,
-  resolveLocaleText,
-  mergeTigerLocale
-} from "@expcat/tigercat-core";
-var spinnerSvg = getSpinnerSVG("spinner");
-var ExpandIcon = (expanded, hasChildren) => {
-  if (!hasChildren) {
-    return h("span", { class: treeNodeIndentClasses });
-  }
-  return h(
-    "svg",
-    {
-      class: getTreeNodeExpandIconClasses(expanded),
-      width: "16",
-      height: "16",
-      viewBox: "0 0 16 16",
-      fill: "currentColor"
-    },
-    [h("path", { d: "M6 4l4 4-4 4V4z" })]
-  );
-};
-var LoadingSpinner = () => {
-  return h(
-    "svg",
-    {
-      class: treeLoadingClasses,
-      xmlns: "http://www.w3.org/2000/svg",
-      fill: "none",
-      viewBox: spinnerSvg.viewBox
-    },
-    spinnerSvg.elements.map((el) => h(el.type, normalizeSvgAttrs(el.attrs)))
-  );
-};
-var Tree = defineComponent({
-  name: "TigerTree",
-  inheritAttrs: false,
-  props: {
-    /**
-     * Tree data source
-     */
-    treeData: {
-      type: Array,
-      default: () => []
-    },
-    /**
-     * Selection mode
-     */
-    selectionMode: {
-      type: String
-    },
-    /**
-     * Whether to show checkboxes
-     */
-    checkable: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether to show expand/collapse icon
-     */
-    showIcon: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Whether to show connecting lines
-     */
-    showLine: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Default expanded node keys
-     */
-    defaultExpandedKeys: {
-      type: Array,
-      default: () => []
-    },
-    /**
-     * Default selected node keys
-     */
-    defaultSelectedKeys: {
-      type: Array,
-      default: () => []
-    },
-    /**
-     * Default checked node keys
-     */
-    defaultCheckedKeys: {
-      type: Array,
-      default: () => []
-    },
-    /**
-     * Expanded node keys (controlled)
-     */
-    expandedKeys: {
-      type: Array
-    },
-    /**
-     * Selected node keys (controlled)
-     */
-    selectedKeys: {
-      type: Array
-    },
-    /**
-     * Checked node keys (controlled)
-     */
-    checkedKeys: {
-      type: [Array, Object]
-    },
-    /**
-     * Whether to expand all nodes by default
-     */
-    defaultExpandAll: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether parent and children are associated when checked
-     */
-    checkStrictly: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Check strategy for return values
-     */
-    checkStrategy: {
-      type: String,
-      default: "all"
-    },
-    /**
-     * Whether to allow node selection
-     */
-    selectable: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Whether multiple nodes can be selected
-     */
-    multiple: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether to load data asynchronously
-     */
-    loadData: {
-      type: Function
-    },
-    /**
-     * Filter value for highlighting matched nodes
-     */
-    filterValue: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Whether to show built-in search input
-     */
-    searchable: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Custom filter function
-     */
-    filterFn: {
-      type: Function
-    },
-    /**
-     * Whether to auto expand parent nodes when filtering
-     */
-    autoExpandParent: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Block node style (full width)
-     */
-    blockNode: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Empty state text
-     */
-    emptyText: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Accessible label for the tree container
-     */
-    ariaLabel: {
-      type: String,
-      default: "Tree"
-    },
-    /**
-     * Whether nodes are draggable
-     */
-    draggable: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Enable virtualized rendering. The visible tree is flattened and rendered
-     * through `VirtualList` with fixed item height. Recommended for large
-     * trees (> ~200 visible items).
-     */
-    virtual: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Pixel height of the virtualized scroll viewport.
-     */
-    height: {
-      type: Number,
-      default: 400
-    },
-    /**
-     * Pixel height of each virtualized tree row.
-     */
-    itemHeight: {
-      type: Number,
-      default: 32
-    },
-    /**
-     * Additional CSS classes (applied to root element)
-     */
-    className: {
-      type: String,
-      default: void 0
-    },
-    /**
-     * Locale overrides merged on top of ConfigProvider locale
-     */
-    locale: {
-      type: Object,
-      default: void 0
-    }
-  },
-  emits: [
-    "expand",
-    "select",
-    "check",
-    "node-click",
-    "node-expand",
-    "node-collapse",
-    "update:expandedKeys",
-    "update:selectedKeys",
-    "update:checkedKeys",
-    "drop"
-  ],
-  setup(props, { emit, attrs }) {
-    const rootEl = ref(null);
-    const config = useTigerConfig();
-    const mergedLocale = computed(() => mergeTigerLocale(config.value.locale, props.locale));
-    const effectiveSelectable = computed(() => {
-      if (props.selectionMode !== void 0) {
-        return props.selectionMode !== "none";
-      }
-      return props.selectable;
-    });
-    const effectiveMultiple = computed(() => {
-      if (props.selectionMode !== void 0) {
-        return props.selectionMode === "multiple";
-      }
-      return props.multiple;
-    });
-    const internalExpandedKeys = ref(/* @__PURE__ */ new Set());
-    const dragNodeKey = ref(null);
-    function handleTreeDragStart(key) {
-      dragNodeKey.value = key;
-    }
-    function handleTreeDragOver(e) {
-      e.preventDefault();
-    }
-    function handleTreeDrop(targetKey) {
-      if (dragNodeKey.value === null || dragNodeKey.value === targetKey) {
-        dragNodeKey.value = null;
-        return;
-      }
-      emit("drop", {
-        dragKey: dragNodeKey.value,
-        dropKey: targetKey
-      });
-      dragNodeKey.value = null;
-    }
-    function handleTreeDragEnd() {
-      dragNodeKey.value = null;
-    }
-    const internalSelectedKeys = ref(
-      new Set(props.selectedKeys ?? props.defaultSelectedKeys)
-    );
-    const internalCheckedState = ref(
-      (() => {
-        if (props.checkedKeys !== void 0) {
-          if (Array.isArray(props.checkedKeys)) {
-            return calculateCheckedState(props.treeData, props.checkedKeys, props.checkStrictly);
-          }
-          return props.checkedKeys;
-        }
-        return calculateCheckedState(props.treeData, props.defaultCheckedKeys, props.checkStrictly);
-      })()
-    );
-    watch(
-      () => [props.treeData, props.defaultExpandAll],
-      () => {
-        if (props.expandedKeys === void 0) {
-          const keys = props.defaultExpandedKeys.length > 0 ? props.defaultExpandedKeys : props.defaultExpandAll ? getAllKeys(props.treeData) : [];
-          internalExpandedKeys.value = new Set(keys);
-        }
-      },
-      { immediate: true }
-    );
-    const loadingNodes = ref(/* @__PURE__ */ new Set());
-    const filteredNodeKeys = ref(/* @__PURE__ */ new Set());
-    const activeKey = ref();
-    const computedExpandedKeys = computed(() => {
-      if (props.expandedKeys !== void 0) {
-        return new Set(props.expandedKeys);
-      }
-      return internalExpandedKeys.value;
-    });
-    const computedSelectedKeys = computed(() => {
-      if (props.selectedKeys !== void 0) {
-        return new Set(props.selectedKeys);
-      }
-      return internalSelectedKeys.value;
-    });
-    const computedCheckedState = computed(() => {
-      if (props.checkedKeys !== void 0) {
-        if (Array.isArray(props.checkedKeys)) {
-          return calculateCheckedState(props.treeData, props.checkedKeys, props.checkStrictly);
-        }
-        return props.checkedKeys;
-      }
-      return internalCheckedState.value;
-    });
-    const checkedSets = computed(() => checkedSetsFromState(computedCheckedState.value));
-    const visibleItems = computed(
-      () => getVisibleTreeItems(props.treeData, computedExpandedKeys.value, filteredNodeKeys.value)
-    );
-    const focusableKeys = computed(
-      () => visibleItems.value.filter((i) => !i.node.disabled).map((i) => i.key)
-    );
-    const defaultActiveKey = computed(() => focusableKeys.value[0]);
-    watch(
-      () => activeKey.value,
-      async (key) => {
-        if (key === void 0) return;
-        await nextTick();
-        const target = rootEl.value?.querySelector(
-          `[data-tiger-treeitem-key="${String(key)}"]`
-        );
-        target?.focus();
-      }
-    );
-    const internalSearchValue = ref("");
-    const effectiveFilterValue = computed(
-      () => props.searchable ? internalSearchValue.value : props.filterValue
-    );
-    watch(
-      () => effectiveFilterValue.value,
-      (newValue) => {
-        if (newValue) {
-          const matched = filterTreeNodes(props.treeData, newValue, props.filterFn);
-          filteredNodeKeys.value = matched;
-          if (props.autoExpandParent) {
-            const autoExpand = getAutoExpandKeys(props.treeData, matched);
-            if (props.expandedKeys === void 0) {
-              internalExpandedKeys.value = /* @__PURE__ */ new Set([...internalExpandedKeys.value, ...autoExpand]);
-            }
-          }
-        } else {
-          filteredNodeKeys.value = /* @__PURE__ */ new Set();
-        }
-      },
-      { immediate: true }
-    );
-    function handleExpand(nodeKey) {
-      const node = findNode(props.treeData, nodeKey);
-      if (!node) return;
-      const newExpandedKeys = new Set(computedExpandedKeys.value);
-      const isExpanded = newExpandedKeys.has(nodeKey);
-      if (isExpanded) {
-        newExpandedKeys.delete(nodeKey);
-        emit("node-collapse", node, nodeKey);
-      } else {
-        newExpandedKeys.add(nodeKey);
-        emit("node-expand", node, nodeKey);
-        if (props.loadData && !node.children && !node.isLeaf && !loadingNodes.value.has(nodeKey)) {
-          loadingNodes.value.add(nodeKey);
-          props.loadData(node).then((children) => {
-            node.children = children;
-            loadingNodes.value.delete(nodeKey);
-          }).catch(() => {
-            loadingNodes.value.delete(nodeKey);
-          });
-        }
-      }
-      if (props.expandedKeys === void 0) {
-        internalExpandedKeys.value = newExpandedKeys;
-      }
-      emit("update:expandedKeys", Array.from(newExpandedKeys));
-      emit("expand", Array.from(newExpandedKeys), {
-        expanded: !isExpanded,
-        node
-      });
-    }
-    function handleSelect(nodeKey, event) {
-      const node = findNode(props.treeData, nodeKey);
-      if (!node || node.disabled || !effectiveSelectable.value) return;
-      const newSelectedKeys = new Set(computedSelectedKeys.value);
-      if (effectiveMultiple.value) {
-        if (newSelectedKeys.has(nodeKey)) {
-          newSelectedKeys.delete(nodeKey);
-        } else {
-          newSelectedKeys.add(nodeKey);
-        }
-      } else {
-        newSelectedKeys.clear();
-        newSelectedKeys.add(nodeKey);
-      }
-      if (props.selectedKeys === void 0) {
-        internalSelectedKeys.value = newSelectedKeys;
-      }
-      const selectedKeysArray = Array.from(newSelectedKeys);
-      emit("update:selectedKeys", selectedKeysArray);
-      emit("select", selectedKeysArray, {
-        selected: newSelectedKeys.has(nodeKey),
-        selectedNodes: selectedKeysArray.map((k) => findNode(props.treeData, k)).filter(Boolean),
-        node,
-        event
-      });
-    }
-    function handleCheck(nodeKey, checked) {
-      const node = findNode(props.treeData, nodeKey);
-      if (!node || node.disabled) return;
-      const currentCheckedKeys = computedCheckedState.value.checked;
-      const newCheckedState = handleNodeCheck(
-        props.treeData,
-        nodeKey,
-        checked,
-        currentCheckedKeys,
-        props.checkStrictly
-      );
-      if (props.checkedKeys === void 0) {
-        internalCheckedState.value = newCheckedState;
-      }
-      const returnKeys = getCheckedKeysByStrategy(
-        newCheckedState,
-        props.treeData,
-        props.checkStrategy
-      );
-      emit("update:checkedKeys", returnKeys);
-      emit("check", returnKeys, {
-        checked,
-        checkedNodes: newCheckedState.checked.map((k) => findNode(props.treeData, k)).filter(Boolean),
-        node,
-        checkedNodesPositions: newCheckedState
-      });
-    }
-    function handleNodeClick(node, event) {
-      if (node.disabled) return;
-      emit("node-click", node, event);
-    }
-    function focusKey(key) {
-      if (key === void 0) return;
-      activeKey.value = key;
-    }
-    function getCurrentKey(fallbackKey) {
-      return activeKey.value ?? defaultActiveKey.value ?? fallbackKey;
-    }
-    function renderTreeRow(node, level) {
-      const hasChildren = !!(node.children && node.children.length > 0);
-      const isExpanded = computedExpandedKeys.value.has(node.key);
-      const isSelected = computedSelectedKeys.value.has(node.key);
-      const isChecked = checkedSets.value.checkedSet.has(node.key);
-      const isHalfChecked = checkedSets.value.halfCheckedSet.has(node.key);
-      const isLoading = loadingNodes.value.has(node.key);
-      const isFiltered = filteredNodeKeys.value.size > 0;
-      const isMatched = filteredNodeKeys.value.has(node.key);
-      const isVisible = !isFiltered || isMatched;
-      const isExpandable = hasChildren || !!(props.loadData && !node.isLeaf);
-      const isFocusable = !node.disabled && node.key === (activeKey.value ?? defaultActiveKey.value);
-      if (!isVisible) {
-        return null;
-      }
-      const indent = [];
-      for (let i = 0; i < level; i++) {
-        indent.push(h("span", { key: i, class: treeNodeIndentClasses }));
-      }
-      const nodeContent = [
-        ...indent,
-        h(
-          "span",
-          {
-            class: isExpandable ? "cursor-pointer" : "",
-            onClick: (e) => {
-              e.stopPropagation();
-              if (isExpandable) {
-                activeKey.value = node.key;
-                handleExpand(node.key);
-              }
-            }
-          },
-          [ExpandIcon(isExpanded, isExpandable)]
-        ),
-        props.checkable ? h("input", {
-          type: "checkbox",
-          class: treeNodeCheckboxClasses,
-          checked: isChecked,
-          indeterminate: isHalfChecked,
-          disabled: node.disabled,
-          "aria-label": resolveLocaleText(
-            `Select ${node.label}`,
-            mergedLocale.value?.locale?.toLowerCase().startsWith("zh") ? `\u9009\u62E9${node.label}` : void 0
-          ),
-          onClick: (e) => e.stopPropagation(),
-          onChange: (e) => {
-            const target = e.target;
-            handleCheck(node.key, target.checked);
-          }
-        }) : null,
-        props.showIcon && node.icon ? h("span", { class: treeNodeIconClasses }, node.icon) : null,
-        h(
-          "span",
-          {
-            class: classNames(
-              treeNodeLabelClasses,
-              isFiltered && isMatched ? "font-semibold text-[var(--tiger-primary,#2563eb)]" : ""
-            )
-          },
-          node.label
-        ),
-        isLoading ? LoadingSpinner() : null
-      ].filter(Boolean);
-      return h(
-        "div",
-        {
-          class: getTreeNodeClasses(isSelected, !!node.disabled, props.blockNode),
-          "data-tiger-treeitem-key": String(node.key),
-          role: "treeitem",
-          "aria-level": level + 1,
-          "aria-disabled": node.disabled ? true : void 0,
-          "aria-selected": effectiveSelectable.value ? isSelected ? true : false : void 0,
-          "aria-expanded": isExpandable ? isExpanded ? true : false : void 0,
-          "aria-checked": props.checkable ? isHalfChecked ? "mixed" : isChecked : void 0,
-          tabIndex: isFocusable ? 0 : -1,
-          draggable: props.draggable && !node.disabled ? true : void 0,
-          onDragstart: props.draggable && !node.disabled ? (e) => {
-            e.stopPropagation();
-            handleTreeDragStart(node.key);
-          } : void 0,
-          onDragover: props.draggable ? handleTreeDragOver : void 0,
-          onDrop: props.draggable ? (e) => {
-            e.preventDefault();
-            e.stopPropagation();
-            handleTreeDrop(node.key);
-          } : void 0,
-          onDragend: props.draggable ? handleTreeDragEnd : void 0,
-          onFocus: () => {
-            if (!node.disabled) activeKey.value = node.key;
-          },
-          onKeydown: (e) => {
-            if (node.disabled) return;
-            const currentKey = getCurrentKey(node.key);
-            const parents = getParentKeys(props.treeData, node.key);
-            const parentKey = parents[parents.length - 1];
-            const action = getTreeKeyboardAction({
-              key: e.key,
-              nodeKey: node.key,
-              currentKey,
-              focusableKeys: focusableKeys.value,
-              parentKey,
-              firstChildKey: getFirstVisibleChildKey(visibleItems.value, node.key),
-              isExpandable,
-              isExpanded,
-              isParentExpanded: parentKey !== void 0 && computedExpandedKeys.value.has(parentKey),
-              isChecked,
-              selectable: effectiveSelectable.value,
-              checkable: !!props.checkable
-            });
-            if (!action) return;
-            e.preventDefault();
-            switch (action.type) {
-              case "focus":
-                focusKey(action.key);
-                break;
-              case "toggleExpand":
-                handleExpand(action.key);
-                break;
-              case "select":
-                handleSelect(action.key, e);
-                break;
-              case "check":
-                handleCheck(action.key, action.checked);
-                break;
-              case "collapseAndFocus":
-                if (action.collapseKey !== void 0) handleExpand(action.collapseKey);
-                focusKey(action.focusKey);
-                break;
-            }
-          },
-          onClick: (e) => {
-            activeKey.value = node.key;
-            handleNodeClick(node, e);
-            if (effectiveSelectable.value && !node.disabled) {
-              handleSelect(node.key, e);
-            }
-          }
-        },
-        nodeContent
-      );
-    }
-    function renderTreeNode(node, level) {
-      const children = node.children ?? [];
-      const hasChildren = children.length > 0;
-      const isExpanded = computedExpandedKeys.value.has(node.key);
-      const isFiltered = filteredNodeKeys.value.size > 0;
-      const isMatched = filteredNodeKeys.value.has(node.key);
-      const isVisible = !isFiltered || isMatched;
-      if (!isVisible) {
-        return null;
-      }
-      return h(
-        "div",
-        {
-          key: node.key,
-          class: treeNodeWrapperClasses
-        },
-        [
-          renderTreeRow(node, level),
-          hasChildren && isExpanded && h(
-            "div",
-            {
-              class: classNames(treeNodeChildrenClasses, props.showLine && treeLineClasses)
-            },
-            children.map((child) => renderTreeNode(child, level + 1))
-          )
-        ]
-      );
-    }
-    return () => {
-      const rootClass = classNames(
-        treeBaseClasses,
-        props.className,
-        coerceClassValue(attrs.class)
-      );
-      if (!props.treeData || props.treeData.length === 0) {
-        return h(
-          "div",
-          {
-            ...attrs,
-            class: classNames(rootClass, "p-4"),
-            role: "tree",
-            "aria-label": props.ariaLabel
-          },
-          [
-            h(
-              "div",
-              { class: treeEmptyStateClasses },
-              resolveLocaleText("No data", props.emptyText, mergedLocale.value?.common?.emptyText)
-            )
-          ]
-        );
-      }
-      const searchInput = props.searchable ? h("input", {
-        type: "text",
-        class: "w-full mb-2 px-2 py-1 text-sm border border-[var(--tiger-border,#e5e7eb)] rounded bg-[var(--tiger-surface,#ffffff)] focus:outline-none focus:ring-1 focus:ring-[var(--tiger-primary,#2563eb)]",
-        placeholder: resolveLocaleText(
-          "Search...",
-          mergedLocale.value?.common?.searchPlaceholder
-        ),
-        value: internalSearchValue.value,
-        onInput: (e) => {
-          internalSearchValue.value = e.target.value;
-        }
-      }) : null;
-      return h(
-        "div",
-        {
-          ...attrs,
-          class: rootClass,
-          role: "tree",
-          "aria-label": props.ariaLabel,
-          "aria-multiselectable": effectiveMultiple.value ? true : void 0,
-          ref: rootEl
-        },
-        [
-          searchInput,
-          props.virtual ? h(
-            VirtualList,
-            {
-              itemCount: visibleItems.value.length,
-              itemHeight: props.itemHeight,
-              height: props.height
-            },
-            {
-              default: ({ index }) => {
-                const item = visibleItems.value[index];
-                if (!item) return null;
-                return renderTreeRow(item.node, item.level - 1);
-              }
-            }
-          ) : props.treeData.map((node) => renderTreeNode(node, 0))
-        ]
-      );
-    };
-  }
-});
-var Tree_default = Tree;
-
-export {
-  Tree,
-  Tree_default
-};