yc-pro-components 0.0.1

package/lib/components/yc-plus-tree/src/index.vue2.js

@@ -0,0 +1,891 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var lodashEs = require('lodash-es');
+var pinyinPro = require('pinyin-pro');
+require('../../yc-card/index.js');
+require('../../yc-line-tree/index.js');
+var index$1 = require('../../yc-select-v2/src/index.vue.js');
+var index$3 = require('../../yc-svg-icon/src/index.vue.js');
+var useSortableDrag = require('./useSortableDrag.js');
+var treeDataUtils = require('./treeDataUtils.js');
+var index = require('../../yc-card/src/index.vue.js');
+var index$2 = require('../../yc-line-tree/src/index.vue.js');
+var useYcConfig = require('../../yc-config-provider/src/useYcConfig.js');
+
+const _hoisted_1 = {
+  key: 0,
+  class: "inline-input-node",
+  "data-input-node": "true"
+};
+const _hoisted_2 = {
+  key: 1,
+  class: "inline-input-node",
+  "data-input-node": "true"
+};
+const _hoisted_3 = {
+  class: "node-label-wrapper",
+  style: { "display": "flex", "gap": "4px", "align-items": "center", "width": "100%" }
+};
+const _hoisted_4 = { class: "node-label" };
+const _hoisted_5 = ["innerHTML"];
+const _hoisted_6 = {
+  key: 0,
+  class: "node-actions",
+  style: { "display": "flex", "flex-shrink": "0", "align-items": "center", "margin-right": "8px", "margin-left": "auto" }
+};
+const _hoisted_7 = {
+  key: 0,
+  style: { "padding": "0 12px" }
+};
+const INLINE_INPUT_NODE_ID = "__inline_input_node__";
+var _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    name: "YcPlusTree"
+  },
+  __name: "index",
+  props: {
+    treeData: { default: () => [] },
+    expandedKeys: { default: () => [] },
+    placeholder: { default: "\u641C\u7D22" },
+    nodeKey: { default: "id" },
+    showNodeActions: { default: false },
+    nodeActions: { default: void 0 },
+    highlightCurrent: { type: Boolean, default: true },
+    filterMethod: { type: Function, default: void 0 },
+    showCardStyle: { type: Boolean, default: true },
+    showCheckbox: { type: Boolean, default: false },
+    defaultCheckedKeys: { default: () => [] },
+    treeProps: { default: () => ({ label: "label", children: "children" }) },
+    draggable: { type: Boolean, default: true },
+    sortableDragOptions: { default: () => ({}) },
+    sameLevelDragOnly: { type: Boolean, default: true },
+    searchMode: { default: "local" },
+    searchLoadMore: { type: Function, default: void 0 },
+    searchPageSize: { default: 20 },
+    onSearchChange: { type: Function, default: void 0 },
+    padding: { default: 16 }
+  },
+  emits: ["node-click", "action-click", "check", "add-node", "update-node", "update:expandedKeys", "node-expand", "node-collapse", "drag-start", "drag-end", "drag-update", "node-reorder"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k;
+    const props = __props;
+    const emit = __emit;
+    const inlineInputState = vue.ref({
+      visible: false,
+      parentNodeKey: null,
+      targetNodeKey: null,
+      inputValue: "",
+      placeholder: "\u8BF7\u8F93\u5165\u540D\u79F0",
+      mode: "add"
+    });
+    const inlineInputRef = vue.ref();
+    const filterText = vue.ref("");
+    const remoteSearchValue = vue.ref("");
+    const treeRef = vue.ref();
+    const treeContainerRef = vue.ref();
+    const treeHeight = vue.ref(400);
+    const { getCdnUrl } = useYcConfig.useYcCdnUrl();
+    const treeMoreIconUrl = getCdnUrl("images", "tree_more.svg");
+    const updateTreeHeight = () => {
+      if (treeContainerRef.value) {
+        const height = treeContainerRef.value.clientHeight;
+        treeHeight.value = height > 0 ? height : 400;
+      }
+    };
+    let resizeObserver = null;
+    vue.onMounted(() => {
+      updateTreeHeight();
+      if (treeContainerRef.value) {
+        resizeObserver = new ResizeObserver(() => {
+          updateTreeHeight();
+        });
+        resizeObserver.observe(treeContainerRef.value);
+      }
+    });
+    vue.onBeforeUnmount(() => {
+      if (resizeObserver) {
+        resizeObserver.disconnect();
+        resizeObserver = null;
+      }
+    });
+    const matchWithPinyin = (text, keyword) => {
+      if (!text) return false;
+      if (!keyword || !keyword.trim()) return true;
+      try {
+        const lowerText = text.toLowerCase();
+        const lowerKeyword = keyword.trim().toLowerCase();
+        if (lowerText.includes(lowerKeyword)) {
+          return true;
+        }
+        const fullPinyin = pinyinPro.pinyin(text, {
+          pattern: "pinyin",
+          toneType: "none"
+        }).toLowerCase();
+        if (fullPinyin.replace(/\s+/g, "").includes(lowerKeyword)) {
+          return true;
+        }
+        if (fullPinyin.includes(lowerKeyword)) {
+          return true;
+        }
+        const firstPinyin = pinyinPro.pinyin(text, {
+          pattern: "first",
+          toneType: "none"
+        }).toLowerCase();
+        if (firstPinyin.replace(/\s+/g, "").includes(lowerKeyword)) {
+          return true;
+        }
+        return false;
+      } catch (error) {
+        console.warn("[YcPlusTree] \u62FC\u97F3\u5339\u914D\u51FA\u9519\uFF0C\u964D\u7EA7\u5230\u666E\u901A\u5339\u914D:", error);
+        return text.toLowerCase().includes(keyword.toLowerCase());
+      }
+    };
+    const filterTreeData = (data, keyword, filterMethod) => {
+      var _a2, _b2;
+      if (!keyword || !keyword.trim()) return data;
+      const clonedData = lodashEs.cloneDeep(data);
+      const childrenKey = ((_a2 = props.treeProps) == null ? void 0 : _a2.children) || "children";
+      const labelKey = ((_b2 = props.treeProps) == null ? void 0 : _b2.label) || "label";
+      const nodeKey = props.nodeKey || "id";
+      const filter = (nodes, parent = null) => {
+        return nodes.reduce((acc, node) => {
+          const children = node[childrenKey];
+          const label = node[labelKey];
+          const key = node[nodeKey];
+          const nodeObj = {
+            data: node,
+            label,
+            key,
+            level: parent ? parent.level + 1 : 1,
+            parent
+          };
+          const isMatch = filterMethod ? filterMethod(keyword, node, nodeObj) : matchWithPinyin(label, keyword);
+          const filteredChildren = children ? filter(children, nodeObj) : [];
+          if (isMatch || filteredChildren.length > 0) {
+            acc.push({
+              ...node,
+              [childrenKey]: filteredChildren
+            });
+          }
+          return acc;
+        }, []);
+      };
+      return filter(clonedData);
+    };
+    const insertInlineInputNode = (treeData) => {
+      var _a2;
+      if (!inlineInputState.value.visible || inlineInputState.value.mode === "edit") {
+        return treeData;
+      }
+      const { parentNodeKey, placeholder } = inlineInputState.value;
+      const childrenKey = ((_a2 = props.treeProps) == null ? void 0 : _a2.children) || "children";
+      const getNodeKey = (node) => {
+        return node[props.nodeKey];
+      };
+      const getChildren = (node) => {
+        return node[childrenKey];
+      };
+      const setChildren = (node, newChildren) => {
+        const nodeRecord = node;
+        nodeRecord[childrenKey] = newChildren;
+      };
+      const cloneTree = (nodes) => {
+        return nodes.map((node) => {
+          const clonedNode = { ...node };
+          if (getNodeKey(node) === parentNodeKey) {
+            const inputNode = {
+              id: INLINE_INPUT_NODE_ID,
+              label: "",
+              __isInlineInput: true,
+              __placeholder: placeholder
+            };
+            const existingChildren = getChildren(node) || [];
+            setChildren(clonedNode, [inputNode, ...existingChildren]);
+          } else {
+            const nodeChildren = getChildren(node);
+            if (nodeChildren) {
+              setChildren(clonedNode, cloneTree(nodeChildren));
+            }
+          }
+          return clonedNode;
+        });
+      };
+      return cloneTree(treeData);
+    };
+    const isEditingNode = (nodeKey) => {
+      if (!nodeKey) return false;
+      return inlineInputState.value.visible && inlineInputState.value.mode === "edit" && inlineInputState.value.targetNodeKey === nodeKey;
+    };
+    const filteredTreeData = vue.computed(() => {
+      if (props.searchMode === "remote") {
+        return insertInlineInputNode(props.treeData);
+      }
+      const filtered = filterTreeData(props.treeData, filterText.value, props.filterMethod);
+      return insertInlineInputNode(filtered);
+    });
+    const escapeRegExp = (str) => {
+      return str.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    };
+    const highlightKeyword = (text, keyword) => {
+      if (!keyword || !text) return text;
+      const escapedKeyword = escapeRegExp(keyword);
+      const regex = new RegExp(`(${escapedKeyword})`, "gi");
+      return text.replace(regex, '<span class="highlight-keyword">$1</span>');
+    };
+    const searchLoadMoreAdapter = vue.computed(() => {
+      const searchLoadMoreFn = props.searchLoadMore;
+      if (!searchLoadMoreFn) return void 0;
+      return async (params) => {
+        const result = await searchLoadMoreFn(params.keyword || "", params.page, params.pageSize);
+        return {
+          list: result.data.map((item) => {
+            const { label, value, ...rest } = item;
+            return { label, value, ...rest };
+          }),
+          total: result.total,
+          hasMore: params.page * params.pageSize < result.total
+        };
+      };
+    });
+    const handleRemoteSearchChange = (value) => {
+      const singleValue = Array.isArray(value) ? value[0] : value;
+      const normalizedValue = singleValue != null ? singleValue : "";
+      remoteSearchValue.value = normalizedValue;
+      if (props.onSearchChange && singleValue !== void 0 && singleValue !== null) {
+        props.onSearchChange(singleValue);
+      }
+    };
+    const handleNodeClick = (data, node) => {
+      emit("node-click", data, node);
+    };
+    const expandedKeysSync = vue.ref([...props.expandedKeys]);
+    vue.watch(
+      () => props.expandedKeys,
+      (newKeys) => {
+        expandedKeysSync.value = [...newKeys];
+      },
+      { deep: true }
+    );
+    const handleNodeExpand = (data, node) => {
+      const nodeKey = data[props.nodeKey];
+      if (!expandedKeysSync.value.includes(nodeKey)) {
+        expandedKeysSync.value = [...expandedKeysSync.value, nodeKey];
+      }
+      emit("update:expandedKeys", expandedKeysSync.value);
+      emit("node-expand", data, node);
+    };
+    const handleNodeCollapse = (data, node) => {
+      const nodeKey = data[props.nodeKey];
+      expandedKeysSync.value = expandedKeysSync.value.filter((key) => key !== nodeKey);
+      emit("update:expandedKeys", expandedKeysSync.value);
+      emit("node-collapse", data, node);
+    };
+    const handleActionCommand = (command, data, node) => {
+      emit("action-click", command, data, node);
+    };
+    const handleCheck = (data, checkedInfo) => {
+      emit("check", data, checkedInfo);
+    };
+    let currentDropTarget = null;
+    let draggedElementLevel = null;
+    function getNodeKeyFromElement(element) {
+      if (!element) return null;
+      const treeItem = element.closest('[role="treeitem"]');
+      if (!treeItem) return null;
+      return treeItem.getAttribute("data-key");
+    }
+    function getNodeKeysFromContainer(container) {
+      if (!container) return [];
+      const treeItems = container.querySelectorAll('[role="treeitem"]');
+      const keys = [];
+      treeItems.forEach((item) => {
+        const key = item.getAttribute("data-key");
+        if (key) keys.push(key);
+      });
+      return keys;
+    }
+    function reorderChildrenById(treeData, parentId, oldIndex, newIndex) {
+      const clonedData = lodashEs.cloneDeep(treeData);
+      function findAndReorder(nodes) {
+        for (const node of nodes) {
+          if (String(node.id) === String(parentId)) {
+            if (node.children && node.children.length > 0) {
+              let adjustedNewIndex = newIndex;
+              if (oldIndex < newIndex) {
+                adjustedNewIndex = newIndex - 1;
+              }
+              const [movedNode] = node.children.splice(oldIndex, 1);
+              node.children.splice(adjustedNewIndex, 0, movedNode);
+              return true;
+            }
+          }
+          if (node.children && node.children.length > 0) {
+            if (findAndReorder(node.children)) return true;
+          }
+        }
+        return false;
+      }
+      findAndReorder(clonedData);
+      return clonedData;
+    }
+    function handleNodeReorder(oldIndex, newIndex, event) {
+      var _a2, _b2, _c2, _d2, _e2, _f2;
+      if (!(event == null ? void 0 : event.item) || !(event == null ? void 0 : event.to)) return;
+      const draggedNodeId = getNodeKeyFromElement(event.item);
+      if (!draggedNodeId) {
+        console.warn("[YcPlusTree] \u65E0\u6CD5\u83B7\u53D6\u88AB\u62D6\u62FD\u8282\u70B9ID");
+        return;
+      }
+      const originalPosition = treeDataUtils.findNodePosition(props.treeData, draggedNodeId);
+      if (!originalPosition) {
+        console.warn(`[YcPlusTree] \u65E0\u6CD5\u627E\u5230\u8282\u70B9\u4F4D\u7F6E: ${draggedNodeId}`);
+        return;
+      }
+      const originalParentId = ((_b2 = (_a2 = originalPosition.parent) == null ? void 0 : _a2.id) == null ? void 0 : _b2.toString()) || null;
+      const allNodeIds = getNodeKeysFromContainer(event.to);
+      const draggedIndexInDOM = allNodeIds.indexOf(draggedNodeId);
+      let targetIndex = originalPosition.index;
+      let prevSiblingIndex = -1;
+      for (let i = draggedIndexInDOM - 1; i >= 0; i--) {
+        const nodeId = allNodeIds[i];
+        const pos = treeDataUtils.findNodePosition(props.treeData, nodeId);
+        if (pos && ((_c2 = pos.parent) == null ? void 0 : _c2.id) === ((_d2 = originalPosition.parent) == null ? void 0 : _d2.id)) {
+          prevSiblingIndex = pos.index;
+          break;
+        }
+      }
+      let nextSiblingIndex = -1;
+      for (let i = draggedIndexInDOM + 1; i < allNodeIds.length; i++) {
+        const nodeId = allNodeIds[i];
+        const pos = treeDataUtils.findNodePosition(props.treeData, nodeId);
+        if (pos && ((_e2 = pos.parent) == null ? void 0 : _e2.id) === ((_f2 = originalPosition.parent) == null ? void 0 : _f2.id)) {
+          nextSiblingIndex = pos.index;
+          break;
+        }
+      }
+      if (prevSiblingIndex !== -1) {
+        targetIndex = prevSiblingIndex + 1;
+      } else if (nextSiblingIndex !== -1) {
+        targetIndex = nextSiblingIndex;
+      } else {
+        targetIndex = 0;
+      }
+      if (originalPosition.index === targetIndex) {
+        return;
+      }
+      const originalSiblings = lodashEs.cloneDeep(originalPosition.siblings);
+      let updatedTreeData;
+      if (originalParentId === null) {
+        updatedTreeData = treeDataUtils.reorderSiblingNodes(props.treeData, originalPosition.index, targetIndex);
+      } else {
+        updatedTreeData = reorderChildrenById(
+          props.treeData,
+          originalParentId,
+          originalPosition.index,
+          targetIndex
+        );
+      }
+      const targetPosition = treeDataUtils.findNodePosition(updatedTreeData, draggedNodeId);
+      if (!targetPosition) {
+        console.warn(`[YcPlusTree] \u66F4\u65B0\u540E\u65E0\u6CD5\u627E\u5230\u8282\u70B9: ${draggedNodeId}`);
+        return;
+      }
+      const targetSiblings = targetPosition.siblings;
+      const draggedNode = targetSiblings[targetPosition.index];
+      if (!draggedNode) {
+        console.warn("[YcPlusTree] \u65E0\u6CD5\u627E\u5230\u88AB\u62D6\u62FD\u7684\u8282\u70B9\u6570\u636E");
+        return;
+      }
+      const reorderEvent = {
+        draggedNode: lodashEs.cloneDeep(draggedNode),
+        from: {
+          parentId: originalParentId,
+          index: originalPosition.index,
+          siblings: originalSiblings
+        },
+        to: {
+          parentId: originalParentId,
+          // 同级拖拽，父节点相同
+          index: targetPosition.index,
+          siblings: lodashEs.cloneDeep(targetSiblings)
+        },
+        isSameLevel: true,
+        // 目前只支持同级拖拽
+        updatedTreeData
+      };
+      emit("node-reorder", reorderEvent);
+    }
+    useSortableDrag.useSortableDrag({
+      containerRef: treeContainerRef,
+      options: {
+        enabled: props.draggable,
+        animation: (_b = (_a = props.sortableDragOptions) == null ? void 0 : _a.animation) != null ? _b : 150,
+        handle: (_c = props.sortableDragOptions) == null ? void 0 : _c.handle,
+        group: (_d = props.sortableDragOptions) == null ? void 0 : _d.group,
+        ghostClass: (_f = (_e = props.sortableDragOptions) == null ? void 0 : _e.ghostClass) != null ? _f : "sortable-ghost",
+        chosenClass: (_h = (_g = props.sortableDragOptions) == null ? void 0 : _g.chosenClass) != null ? _h : "sortable-chosen",
+        dragClass: (_j = (_i = props.sortableDragOptions) == null ? void 0 : _i.dragClass) != null ? _j : "sortable-drag",
+        // 排除展开箭头、操作按钮等元素，避免拖拽拦截点击事件
+        filter: ((_k = props.sortableDragOptions) == null ? void 0 : _k.filter) || ".el-icon, .node-actions, .action-icon, button, input",
+        ...props.sortableDragOptions
+      },
+      events: {
+        onStart: (evt) => {
+          if (props.sameLevelDragOnly && evt.item) {
+            const draggedContent = evt.item.querySelector(
+              ".el-tree-node__content, .node-content-wrapper"
+            );
+            if (draggedContent) {
+              draggedElementLevel = parseInt(window.getComputedStyle(draggedContent).paddingLeft) / 16;
+            }
+          }
+          if (currentDropTarget) {
+            currentDropTarget.classList.remove("drop-target");
+            currentDropTarget = null;
+          }
+          emit("drag-start", evt);
+        },
+        onEnd: (evt) => {
+          draggedElementLevel = null;
+          if (currentDropTarget) {
+            currentDropTarget.classList.remove("drop-target");
+            currentDropTarget = null;
+          }
+          emit("drag-end", evt);
+        },
+        onMove: (evt) => {
+          if (props.sameLevelDragOnly) {
+            if (draggedElementLevel === null) {
+              return false;
+            }
+            const related2 = evt.related;
+            const relatedContent = related2.querySelector(
+              ".el-tree-node__content, .node-content-wrapper"
+            );
+            if (!relatedContent) {
+              return false;
+            }
+            const relatedLevel = parseInt(window.getComputedStyle(relatedContent).paddingLeft) / 16;
+            if (draggedElementLevel !== relatedLevel) {
+              return false;
+            }
+          }
+          if (currentDropTarget) {
+            currentDropTarget.classList.remove("drop-target");
+            currentDropTarget.style.removeProperty("--drop-indent");
+          }
+          const related = evt.related;
+          if (related && related.getAttribute("role") === "treeitem") {
+            currentDropTarget = related;
+            currentDropTarget.classList.add("drop-target");
+            const contentEl = related.querySelector(
+              ".el-tree-node__content, .node-content-wrapper"
+            );
+            if (contentEl) {
+              const computedStyle = window.getComputedStyle(contentEl);
+              const paddingLeft = computedStyle.paddingLeft;
+              currentDropTarget.style.setProperty("--drop-indent", paddingLeft);
+            } else {
+              currentDropTarget.style.setProperty("--drop-indent", "0px");
+            }
+          }
+          return true;
+        },
+        onUpdate: (evt) => {
+          emit("drag-update", evt);
+          if (evt.oldIndex !== void 0 && evt.newIndex !== void 0) {
+            handleNodeReorder(evt.oldIndex, evt.newIndex, evt);
+          }
+        }
+      },
+      filterText
+    });
+    const shouldShowNodeActions = (data, node) => {
+      var _a2;
+      try {
+        if (typeof props.showNodeActions === "function") {
+          return Boolean(props.showNodeActions(data, node));
+        }
+        return (_a2 = props.showNodeActions) != null ? _a2 : false;
+      } catch (error) {
+        console.warn("[YcPlusTree] showNodeActions \u51FD\u6570\u6267\u884C\u51FA\u9519:", error);
+        return false;
+      }
+    };
+    const showInlineInput = (targetKey, placeholder = "\u8BF7\u8F93\u5165\u540D\u79F0", options) => {
+      var _a2, _b2, _c2;
+      const mode = (_a2 = options == null ? void 0 : options.mode) != null ? _a2 : "add";
+      const treeInstance = treeRef.value;
+      if (mode === "add") {
+        if (treeInstance && treeInstance.setExpanded) {
+          treeInstance.setExpanded(targetKey, true);
+        }
+        if (!props.expandedKeys.includes(targetKey)) {
+          const newExpandedKeys = [...props.expandedKeys, targetKey];
+          emit("update:expandedKeys", newExpandedKeys);
+        }
+      } else if (treeInstance && treeInstance.scrollToNode) {
+        treeInstance.scrollToNode(targetKey);
+      }
+      inlineInputState.value = {
+        visible: true,
+        parentNodeKey: mode === "add" ? targetKey : null,
+        targetNodeKey: (_b2 = options == null ? void 0 : options.targetNodeKey) != null ? _b2 : targetKey,
+        inputValue: mode === "edit" ? (_c2 = options == null ? void 0 : options.initialValue) != null ? _c2 : "" : "",
+        placeholder,
+        mode
+      };
+      vue.nextTick(() => {
+        setTimeout(() => {
+          var _a3;
+          (_a3 = inlineInputRef.value) == null ? void 0 : _a3.focus();
+        }, 300);
+      });
+    };
+    const hideInlineInput = () => {
+      inlineInputState.value = {
+        visible: false,
+        parentNodeKey: null,
+        targetNodeKey: null,
+        inputValue: "",
+        placeholder: "\u8BF7\u8F93\u5165\u540D\u79F0",
+        mode: "add"
+      };
+    };
+    const handleInlineInputBlur = () => {
+      const { inputValue, parentNodeKey, targetNodeKey, mode } = inlineInputState.value;
+      if (!inputValue.trim()) {
+        hideInlineInput();
+        return;
+      }
+      if (mode === "edit") {
+        if (!targetNodeKey) {
+          hideInlineInput();
+          return;
+        }
+        emit("update-node", targetNodeKey, inputValue.trim(), (success) => {
+          if (success) {
+            hideInlineInput();
+          } else {
+            vue.nextTick(() => {
+              var _a2;
+              (_a2 = inlineInputRef.value) == null ? void 0 : _a2.focus();
+            });
+          }
+        });
+        return;
+      }
+      if (parentNodeKey === null) {
+        hideInlineInput();
+        return;
+      }
+      emit("add-node", parentNodeKey, inputValue.trim(), (success) => {
+        if (success) {
+          hideInlineInput();
+        } else {
+          vue.nextTick(() => {
+            var _a2;
+            (_a2 = inlineInputRef.value) == null ? void 0 : _a2.focus();
+          });
+        }
+      });
+    };
+    const handleInlineInputKeydown = (e) => {
+      var _a2;
+      if (e.key === "Enter") {
+        (_a2 = inlineInputRef.value) == null ? void 0 : _a2.blur();
+      } else if (e.key === "Escape") {
+        hideInlineInput();
+      }
+    };
+    __expose({
+      /**
+       * 滚动到指定节点
+       */
+      scrollToNode: (key) => {
+        var _a2, _b2;
+        (_b2 = (_a2 = treeRef.value) == null ? void 0 : _a2.scrollToNode) == null ? void 0 : _b2.call(_a2, key);
+      },
+      /**
+       * 设置当前选中节点（高亮）
+       */
+      setCurrentKey: (key) => {
+        var _a2, _b2;
+        (_b2 = (_a2 = treeRef.value) == null ? void 0 : _a2.setCurrentKey) == null ? void 0 : _b2.call(_a2, key);
+      },
+      /**
+       * 设置节点展开/收起状态
+       */
+      setExpanded: (key, expanded) => {
+        var _a2, _b2;
+        (_b2 = (_a2 = treeRef.value) == null ? void 0 : _a2.setExpanded) == null ? void 0 : _b2.call(_a2, key, expanded);
+      },
+      /**
+       * 获取选中节点的 key 数组
+       */
+      getCheckedKeys: (leafOnly = false) => {
+        var _a2, _b2;
+        return (_b2 = (_a2 = treeRef.value) == null ? void 0 : _a2.getCheckedKeys) == null ? void 0 : _b2.call(_a2, leafOnly);
+      },
+      /**
+       * 获取选中节点的数据数组
+       */
+      getCheckedNodes: (leafOnly = false, includeHalfChecked = false) => {
+        var _a2, _b2;
+        return (_b2 = (_a2 = treeRef.value) == null ? void 0 : _a2.getCheckedNodes) == null ? void 0 : _b2.call(_a2, leafOnly, includeHalfChecked);
+      },
+      /**
+       * 设置选中的节点
+       */
+      setCheckedKeys: (keys, leafOnly = false) => {
+        var _a2, _b2;
+        (_b2 = (_a2 = treeRef.value) == null ? void 0 : _a2.setCheckedKeys) == null ? void 0 : _b2.call(_a2, keys, leafOnly);
+      },
+      /**
+       * 获取完整的 tree 实例
+       */
+      getTreeInstance: () => treeRef.value,
+      /**
+       * 显示内联输入框
+       */
+      showInlineInput,
+      /**
+       * 隐藏内联输入框
+       */
+      hideInlineInput
+    });
+    return (_ctx, _cache) => {
+      const _component_el_input = vue.resolveComponent("el-input");
+      const _component_el_divider = vue.resolveComponent("el-divider");
+      const _component_el_dropdown_item = vue.resolveComponent("el-dropdown-item");
+      const _component_el_dropdown_menu = vue.resolveComponent("el-dropdown-menu");
+      const _component_el_dropdown = vue.resolveComponent("el-dropdown");
+      const _component_el_tree_v2 = vue.resolveComponent("el-tree-v2");
+      return vue.openBlock(), vue.createBlock(vue.unref(index.default), {
+        padding: props.padding,
+        height: "100%",
+        radius: _ctx.showCardStyle ? 8 : 0,
+        style: vue.normalizeStyle(_ctx.showCardStyle ? {} : { border: "1px solid transparent" }),
+        class: "yc-plus-tree plus-yc-plus-tree"
+      }, {
+        default: vue.withCtx(() => [
+          vue.renderSlot(_ctx.$slots, "header", {}, void 0, true),
+          vue.createCommentVNode(" \u641C\u7D22\u6846 "),
+          vue.createCommentVNode(" \u9759\u6001\u641C\u7D22\u6A21\u5F0F\uFF1A\u4F7F\u7528 el-input "),
+          props.searchMode === "local" ? (vue.openBlock(), vue.createBlock(_component_el_input, {
+            key: 0,
+            modelValue: filterText.value,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => filterText.value = $event),
+            placeholder: _ctx.placeholder,
+            "prefix-icon": "Search",
+            clearable: "",
+            class: "search-input"
+          }, null, 8, ["modelValue", "placeholder"])) : (vue.openBlock(), vue.createElementBlock(
+            vue.Fragment,
+            { key: 1 },
+            [
+              vue.createCommentVNode(" \u8FDC\u7A0B\u641C\u7D22\u6A21\u5F0F\uFF1A\u4F7F\u7528 YcSelectV2 "),
+              vue.createVNode(vue.unref(index$1.default), {
+                modelValue: remoteSearchValue.value,
+                "onUpdate:modelValue": [
+                  _cache[1] || (_cache[1] = ($event) => remoteSearchValue.value = $event),
+                  handleRemoteSearchChange
+                ],
+                "load-more": searchLoadMoreAdapter.value,
+                "page-size": _ctx.searchPageSize,
+                "search-mode": "remote",
+                placeholder: _ctx.placeholder,
+                clearable: "",
+                filterable: "",
+                class: "search-input"
+              }, null, 8, ["modelValue", "load-more", "page-size", "placeholder"])
+            ],
+            2112
+            /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+          )),
+          vue.renderSlot(_ctx.$slots, "under-search-input", {}, void 0, true),
+          vue.createCommentVNode(" \u6811\u5F62\u7ED3\u6784 "),
+          vue.createElementVNode(
+            "div",
+            {
+              ref_key: "treeContainerRef",
+              ref: treeContainerRef,
+              class: "tree-container"
+            },
+            [
+              vue.createVNode(_component_el_tree_v2, {
+                ref_key: "treeRef",
+                ref: treeRef,
+                data: filteredTreeData.value,
+                "default-expanded-keys": expandedKeysSync.value,
+                "expand-on-click-node": false,
+                "node-key": _ctx.nodeKey,
+                "highlight-current": _ctx.highlightCurrent,
+                "show-checkbox": _ctx.showCheckbox,
+                "default-checked-keys": _ctx.defaultCheckedKeys,
+                props: _ctx.treeProps,
+                height: treeHeight.value,
+                "item-size": 32,
+                onNodeClick: handleNodeClick,
+                onNodeExpand: handleNodeExpand,
+                onNodeCollapse: handleNodeCollapse,
+                onCheck: handleCheck
+              }, {
+                default: vue.withCtx(({ node, data }) => [
+                  vue.createCommentVNode(" \u5982\u679C\u662F\u8F93\u5165\u6846\u8282\u70B9\uFF0C\u6E32\u67D3\u8F93\u5165\u6846 "),
+                  data.__isInlineInput ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+                    vue.createVNode(_component_el_input, {
+                      ref_key: "inlineInputRef",
+                      ref: inlineInputRef,
+                      modelValue: inlineInputState.value.inputValue,
+                      "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => inlineInputState.value.inputValue = $event),
+                      placeholder: data.__placeholder || "\u8BF7\u8F93\u5165\u540D\u79F0",
+                      size: "small",
+                      class: "inline-input",
+                      onBlur: handleInlineInputBlur,
+                      onKeydown: handleInlineInputKeydown
+                    }, null, 8, ["modelValue", "placeholder"])
+                  ])) : isEditingNode(data.id) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_2, [
+                    vue.createVNode(_component_el_input, {
+                      ref_key: "inlineInputRef",
+                      ref: inlineInputRef,
+                      modelValue: inlineInputState.value.inputValue,
+                      "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => inlineInputState.value.inputValue = $event),
+                      placeholder: inlineInputState.value.placeholder,
+                      size: "small",
+                      class: "inline-input",
+                      onBlur: handleInlineInputBlur,
+                      onKeydown: handleInlineInputKeydown
+                    }, null, 8, ["modelValue", "placeholder"])
+                  ])) : (vue.openBlock(), vue.createElementBlock(
+                    vue.Fragment,
+                    { key: 2 },
+                    [
+                      vue.createCommentVNode(" \u6B63\u5E38\u8282\u70B9 "),
+                      vue.createVNode(vue.unref(index$2.default), {
+                        node,
+                        "tree-data": filteredTreeData.value
+                      }, {
+                        "node-label": vue.withCtx(() => [
+                          vue.createElementVNode("span", _hoisted_3, [
+                            vue.createCommentVNode(" \u8282\u70B9\u6807\u7B7E\u533A\u57DF\uFF08\u652F\u6301\u81EA\u5B9A\u4E49\uFF09 "),
+                            vue.renderSlot(_ctx.$slots, "node-label", {
+                              node,
+                              data,
+                              highlightedLabel: highlightKeyword(node.label, props.searchMode === "local" ? filterText.value : "")
+                            }, () => [
+                              vue.createElementVNode("span", _hoisted_4, [
+                                vue.createCommentVNode(" \u9ED8\u8BA4\u8282\u70B9\u6807\u7B7E\u6587\u672C "),
+                                vue.createElementVNode("span", {
+                                  class: "label-text",
+                                  innerHTML: highlightKeyword(node.label, props.searchMode === "local" ? filterText.value : "")
+                                }, null, 8, _hoisted_5)
+                              ])
+                            ], true),
+                            vue.createCommentVNode(" \u8282\u70B9\u64CD\u4F5C\u533A\u57DF\uFF08\u72EC\u7ACB\u4E8E\u81EA\u5B9A\u4E49 slot\uFF09 "),
+                            shouldShowNodeActions(data, node) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_6, [
+                              vue.renderSlot(_ctx.$slots, "node-actions", {
+                                node,
+                                data
+                              }, () => [
+                                _ctx.nodeActions && _ctx.nodeActions.length > 0 ? (vue.openBlock(), vue.createBlock(_component_el_dropdown, {
+                                  key: 0,
+                                  trigger: "click",
+                                  "popper-class": "tree-dropdown-popper",
+                                  onCommand: (cmd) => handleActionCommand(cmd, data, node)
+                                }, {
+                                  dropdown: vue.withCtx(() => [
+                                    vue.createVNode(
+                                      _component_el_dropdown_menu,
+                                      { class: "tree-dropdown-menu" },
+                                      {
+                                        default: vue.withCtx(() => [
+                                          (vue.openBlock(true), vue.createElementBlock(
+                                            vue.Fragment,
+                                            null,
+                                            vue.renderList(_ctx.nodeActions, (action, _actionIdx) => {
+                                              return vue.openBlock(), vue.createElementBlock(
+                                                vue.Fragment,
+                                                { key: _actionIdx },
+                                                [
+                                                  action.type === "divider" && (!action.visible || action.visible(data)) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_7, [
+                                                    vue.createVNode(_component_el_divider, { class: "dropdown-divider" })
+                                                  ])) : action.type === "action" && (!action.visible || action.visible(data)) ? (vue.openBlock(), vue.createBlock(_component_el_dropdown_item, {
+                                                    key: 1,
+                                                    command: action.code,
+                                                    class: "dropdown-item"
+                                                  }, {
+                                                    default: vue.withCtx(() => [
+                                                      vue.createTextVNode(
+                                                        vue.toDisplayString(action.label),
+                                                        1
+                                                        /* TEXT */
+                                                      )
+                                                    ]),
+                                                    _: 2
+                                                    /* DYNAMIC */
+                                                  }, 1032, ["command"])) : vue.createCommentVNode("v-if", true)
+                                                ],
+                                                64
+                                                /* STABLE_FRAGMENT */
+                                              );
+                                            }),
+                                            128
+                                            /* KEYED_FRAGMENT */
+                                          ))
+                                        ]),
+                                        _: 2
+                                        /* DYNAMIC */
+                                      },
+                                      1024
+                                      /* DYNAMIC_SLOTS */
+                                    )
+                                  ]),
+                                  default: vue.withCtx(() => [
+                                    vue.createVNode(vue.unref(index$3.default), {
+                                      src: vue.unref(treeMoreIconUrl),
+                                      size: 16,
+                                      class: "action-icon",
+                                      onClick: _cache[4] || (_cache[4] = vue.withModifiers(() => {
+                                      }, ["stop"]))
+                                    }, null, 8, ["src"])
+                                  ]),
+                                  _: 2
+                                  /* DYNAMIC */
+                                }, 1032, ["onCommand"])) : (vue.openBlock(), vue.createBlock(vue.unref(index$3.default), {
+                                  key: 1,
+                                  src: vue.unref(treeMoreIconUrl),
+                                  size: 16,
+                                  class: "action-icon"
+                                }, null, 8, ["src"]))
+                              ], true)
+                            ])) : vue.createCommentVNode("v-if", true)
+                          ])
+                        ]),
+                        _: 2
+                        /* DYNAMIC */
+                      }, 1032, ["node", "tree-data"])
+                    ],
+                    2112
+                    /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+                  ))
+                ]),
+                _: 3
+                /* FORWARDED */
+              }, 8, ["data", "default-expanded-keys", "node-key", "highlight-current", "show-checkbox", "default-checked-keys", "props", "height"])
+            ],
+            512
+            /* NEED_PATCH */
+          )
+        ]),
+        _: 3
+        /* FORWARDED */
+      }, 8, ["padding", "radius", "style"]);
+    };
+  }
+});
+
+exports.default = _sfc_main;