yc-pro-components 0.0.76 → 0.0.77

package/index.js

@@ -1,4 +1,4 @@
-/*! yc-pro-components v0.0.76 */
+/*! yc-pro-components v0.0.77 */
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('element-plus')) :
   typeof define === 'function' && define.amd ? define(['exports', 'vue', 'element-plus'], factory) :
@@ -8616,6 +8616,204 @@
     vue.provide(DictStoreInjectionKey, dictStore);
   }
 
+  const DEFAULT_RESIZE_AREA_WIDTH = 12;
+  const DEFAULT_BORDER_COLOR = "var(--theme-color)";
+  const DEFAULT_SCROLL_SELECTOR = ".el-scrollbar__wrap";
+  function useTableDragScroll(wrapperRef, tableRef, options = {}) {
+    var _a, _b, _c;
+    const resizeAreaWidth = (_a = options.resizeAreaWidth) != null ? _a : DEFAULT_RESIZE_AREA_WIDTH;
+    const borderColor = (_b = options.resizeBorderColor) != null ? _b : DEFAULT_BORDER_COLOR;
+    const scrollSelector = (_c = options.scrollContainerSelector) != null ? _c : DEFAULT_SCROLL_SELECTOR;
+    const isDragging = vue.ref(false);
+    const isResizing = vue.ref(false);
+    const startX = vue.ref(0);
+    const scrollLeft = vue.ref(0);
+    const scrollContainer = vue.ref(null);
+    const isEnabled = () => {
+      const enabled = options.enabled;
+      if (enabled === void 0) return true;
+      if (typeof enabled === "boolean") return enabled;
+      return enabled.value;
+    };
+    const getTableEl = () => {
+      var _a2;
+      const fromRef = (_a2 = tableRef == null ? void 0 : tableRef.value) == null ? void 0 : _a2.$el;
+      if (fromRef) return fromRef;
+      const wrapper = wrapperRef.value;
+      if (!wrapper) return null;
+      return wrapper.querySelector(".el-table");
+    };
+    const refreshScrollContainer = () => {
+      const tableEl = getTableEl();
+      if (tableEl) {
+        scrollContainer.value = tableEl.querySelector(scrollSelector);
+      }
+    };
+    const isInsideTable = (e) => {
+      const tableEl = getTableEl();
+      if (!tableEl) return false;
+      const target = e.target;
+      return !!target && tableEl.contains(target);
+    };
+    const isInResizeArea = (e, th) => {
+      const rect = th.getBoundingClientRect();
+      const mouseX = e.clientX;
+      return mouseX >= rect.right - resizeAreaWidth && mouseX <= rect.right + 4;
+    };
+    const getCurrentColumn = (e) => {
+      var _a2;
+      let current = e.target;
+      while (current && ((_a2 = current.tagName) == null ? void 0 : _a2.toLowerCase()) !== "th") {
+        current = current.parentElement;
+        if (!current || current === wrapperRef.value) return null;
+      }
+      return current;
+    };
+    const clearAllHeaderStyles = () => {
+      const tableEl = getTableEl();
+      if (!tableEl) return;
+      const headers = tableEl.querySelectorAll("th");
+      headers.forEach((header) => {
+        const h = header;
+        h.style.borderRight = "";
+        h.style.cursor = "";
+      });
+    };
+    const onMouseDown = (e) => {
+      if (!isEnabled()) return;
+      if (!isInsideTable(e)) return;
+      if (!scrollContainer.value) {
+        refreshScrollContainer();
+        if (!scrollContainer.value) return;
+      }
+      const target = e.target;
+      const column = getCurrentColumn(e);
+      if (column && isInResizeArea(e, column)) {
+        isDragging.value = false;
+        isResizing.value = true;
+        return;
+      }
+      if (target.classList.contains("noclick")) {
+        isDragging.value = false;
+        isResizing.value = true;
+        return;
+      }
+      isDragging.value = true;
+      isResizing.value = false;
+      startX.value = e.clientX;
+      scrollLeft.value = scrollContainer.value.scrollLeft;
+      if (wrapperRef.value) {
+        wrapperRef.value.style.cursor = "";
+      }
+      target.style.cursor = "";
+    };
+    const onMouseMove = (e) => {
+      var _a2, _b2, _c2;
+      if (!isEnabled()) return;
+      const target = e.target;
+      const parentElement = target.parentElement;
+      const insideTable = isInsideTable(e);
+      if (!insideTable) {
+        if (wrapperRef.value) {
+          wrapperRef.value.style.cursor = "";
+        }
+        if (isDragging.value && scrollContainer.value) {
+          const deltaX2 = e.clientX - startX.value;
+          scrollContainer.value.scrollLeft = scrollLeft.value - deltaX2;
+        }
+        return;
+      }
+      if (target.classList.contains("drag-disabled")) {
+        target.style.cursor = "pointer";
+        return;
+      }
+      const column = getCurrentColumn(e);
+      if (column) {
+        const allHeaders = (_a2 = column.parentElement) == null ? void 0 : _a2.querySelectorAll("th");
+        if (isInResizeArea(e, column)) {
+          isDragging.value = false;
+          isResizing.value = true;
+          column.style.borderRight = `2px solid ${borderColor}`;
+          allHeaders == null ? void 0 : allHeaders.forEach((header) => {
+            const h = header;
+            if (h !== column) {
+              h.style.borderRight = "";
+              h.style.cursor = "";
+            }
+          });
+          return;
+        } else {
+          allHeaders == null ? void 0 : allHeaders.forEach((header) => {
+            const h = header;
+            h.style.borderRight = "";
+            h.style.cursor = "";
+          });
+          isResizing.value = false;
+        }
+      }
+      if (target.classList.contains("noclick") || target.classList.contains("el-table__column-resize-proxy")) {
+        isDragging.value = false;
+        isResizing.value = true;
+        return;
+      }
+      if (isResizing.value || ((_b2 = parentElement == null ? void 0 : parentElement.tagName) == null ? void 0 : _b2.toLowerCase()) === "th" || ((_c2 = target.tagName) == null ? void 0 : _c2.toLowerCase()) === "th") {
+        isDragging.value = false;
+        return;
+      }
+      if (target.classList.contains("edit-icon")) {
+        target.style.cursor = "pointer";
+        return;
+      }
+      isResizing.value = false;
+      target.style.cursor = "";
+      if (wrapperRef.value) {
+        wrapperRef.value.style.cursor = "grab";
+      }
+      if (!isDragging.value || !scrollContainer.value) return;
+      const deltaX = e.clientX - startX.value;
+      scrollContainer.value.scrollLeft = scrollLeft.value - deltaX;
+    };
+    const onMouseUp = () => {
+      isDragging.value = false;
+      isResizing.value = false;
+      if (wrapperRef.value) {
+        wrapperRef.value.style.cursor = "";
+      }
+      clearAllHeaderStyles();
+    };
+    const onTableBodyOver = () => {
+      const ths = document.querySelectorAll(".el-table__header th");
+      ths.forEach((th) => {
+        const h = th;
+        h.style.borderRight = "";
+        h.style.cursor = "";
+      });
+    };
+    let tableBodyEl = null;
+    vue.onMounted(() => {
+      document.addEventListener("mousemove", onMouseMove);
+      document.addEventListener("mouseup", onMouseUp);
+      requestAnimationFrame(() => {
+        var _a2;
+        refreshScrollContainer();
+        const tableEl = getTableEl();
+        tableBodyEl = (_a2 = tableEl == null ? void 0 : tableEl.querySelector(".el-table__body")) != null ? _a2 : null;
+        tableBodyEl == null ? void 0 : tableBodyEl.addEventListener("mouseover", onTableBodyOver);
+      });
+    });
+    vue.onBeforeUnmount(() => {
+      document.removeEventListener("mousemove", onMouseMove);
+      document.removeEventListener("mouseup", onMouseUp);
+      tableBodyEl == null ? void 0 : tableBodyEl.removeEventListener("mouseover", onTableBodyOver);
+    });
+    return {
+      onMouseDown,
+      isDragging,
+      isResizing,
+      refreshScrollContainer
+    };
+  }
+
   const _hoisted_1$v = { class: "plus-dialog-body" };
   var _sfc_main$O = /* @__PURE__ */ vue.defineComponent({
     ...{
@@ -33209,7 +33407,8 @@
       hideHeaderFilter: { type: Boolean, default: true },
       columnCacheKey: { default: void 0 },
       disableColumnCache: { type: Boolean, default: false },
-      columnSettingsText: { default: void 0 }
+      columnSettingsText: { default: void 0 },
+      dragScroll: { type: [Boolean, Object], default: false }
     },
     emits: ["header-filter-confirm", "header-filter-reset"],
     setup(__props, { expose: __expose, emit: __emit }) {
@@ -33220,6 +33419,21 @@
       const plusPageConfig = useYcComponentConfig("plusPage");
       const plusPageRef = vue.ref();
       const rootRef = vue.ref();
+      const dragScrollWrapperRef = vue.ref(null);
+      const dragScrollEnabled = vue.computed(() => props.dragScroll !== false && props.dragScroll != null);
+      const dragScrollOptions = vue.computed(() => {
+        const value = props.dragScroll;
+        if (value && typeof value === "object") return value;
+        return {};
+      });
+      const { onMouseDown: onDragScrollMouseDown } = useTableDragScroll(
+        dragScrollWrapperRef,
+        void 0,
+        {
+          ...dragScrollOptions.value,
+          enabled: dragScrollEnabled
+        }
+      );
       const plusTableInstance = vue.computed(() => {
         var _a;
         return (_a = plusPageRef.value) == null ? void 0 : _a.plusTableInstance;
@@ -33637,6 +33851,7 @@
       void resolvedColumnSettingsText.value;
       void hasRequest.value;
       void showDefaultColumnSettingsIcon.value;
+      void dragScrollEnabled.value;
       __expose({
         plusPageRef,
         plusTableInstance,
@@ -33694,62 +33909,76 @@
             class: vue.normalizeClass(["yc-plus-page", { "yc-plus-page--borderless": isBorderless.value }])
           },
           [
-            vue.createVNode(vue.unref(PlusPage), vue.mergeProps({
-              ref_key: "plusPageRef",
-              ref: plusPageRef
-            }, { ...props, ..._ctx.$attrs }, {
-              columns: enhancedColumns.value,
-              "is-card": _ctx.isCard,
-              request: wrappedRequest.value,
-              search: mergedSearch.value,
-              "search-card-props": mergedSearchCardProps.value,
-              "table-card-props": mergedTableCardProps.value,
-              table: mergedTable.value,
-              pagination: mergedPagination.value,
-              "default-page-info": { page: 1, pageSize: DEFAULT_PAGE_SIZE },
-              onFilterTableHeader: handleFilterTableHeader,
-              onHeaderDragend: handleHeaderDragend
-            }), vue.createSlots({
-              default: vue.withCtx(() => [
-                vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
-              ]),
-              _: 2
-              /* DYNAMIC */
-            }, [
-              _ctx.$slots["column-settings-icon"] ? {
-                name: "column-settings-icon",
-                fn: vue.withCtx(() => [
-                  vue.renderSlot(_ctx.$slots, "column-settings-icon", {}, void 0, true)
-                ]),
-                key: "0"
-              } : showDefaultColumnSettingsIcon.value ? {
-                name: "column-settings-icon",
-                fn: vue.withCtx(() => [
-                  vue.createElementVNode("div", { class: "column-settings-wrapper" }, [
-                    vue.createVNode(vue.unref(YcSvgIcon), {
-                      src: fieldSettingIconUrl.value,
-                      size: 16
-                    }, null, 8, ["src"]),
-                    vue.createElementVNode(
-                      "span",
-                      { class: "column-settings-text" },
-                      vue.toDisplayString(resolvedColumnSettingsText.value),
-                      1
-                      /* TEXT */
-                    )
-                  ])
-                ]),
-                key: "1"
-              } : void 0,
-              vue.renderList(_ctx.$slots, (_, name) => {
-                return {
-                  name,
-                  fn: vue.withCtx((slotProps) => [
-                    name !== "column-settings-icon" && name !== "default" ? vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.mergeProps({ key: 0 }, slotProps)), void 0, true) : vue.createCommentVNode("v-if", true)
-                  ])
-                };
-              })
-            ]), 1040, ["columns", "is-card", "request", "search", "search-card-props", "table-card-props", "table", "pagination", "default-page-info"])
+            vue.createCommentVNode(" \u62D6\u62FD\u6EDA\u52A8\u5305\u88F9\u5C42\uFF1AdragScroll \u542F\u7528\u65F6\u4ECB\u5165\uFF0C\u4F46\u59CB\u7EC8\u4FDD\u7559 ref\uFF0C\n         \u4EE5\u4FDD\u8BC1 mousedown \u900F\u4F20 + hook \u5185\u90E8 DOM \u67E5\u8BE2\u6B63\u5E38 "),
+            vue.createElementVNode(
+              "div",
+              {
+                ref_key: "dragScrollWrapperRef",
+                ref: dragScrollWrapperRef,
+                class: vue.normalizeClass(["yc-plus-page__drag-wrapper", { "yc-plus-page__drag-wrapper--enabled": dragScrollEnabled.value }]),
+                onMousedown: _cache[0] || (_cache[0] = ($event) => dragScrollEnabled.value ? vue.unref(onDragScrollMouseDown)($event) : void 0)
+              },
+              [
+                vue.createVNode(vue.unref(PlusPage), vue.mergeProps({
+                  ref_key: "plusPageRef",
+                  ref: plusPageRef
+                }, { ...props, ..._ctx.$attrs }, {
+                  columns: enhancedColumns.value,
+                  "is-card": _ctx.isCard,
+                  request: wrappedRequest.value,
+                  search: mergedSearch.value,
+                  "search-card-props": mergedSearchCardProps.value,
+                  "table-card-props": mergedTableCardProps.value,
+                  table: mergedTable.value,
+                  pagination: mergedPagination.value,
+                  "default-page-info": { page: 1, pageSize: DEFAULT_PAGE_SIZE },
+                  onFilterTableHeader: handleFilterTableHeader,
+                  onHeaderDragend: handleHeaderDragend
+                }), vue.createSlots({
+                  default: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "default", {}, void 0, true)
+                  ]),
+                  _: 2
+                  /* DYNAMIC */
+                }, [
+                  _ctx.$slots["column-settings-icon"] ? {
+                    name: "column-settings-icon",
+                    fn: vue.withCtx(() => [
+                      vue.renderSlot(_ctx.$slots, "column-settings-icon", {}, void 0, true)
+                    ]),
+                    key: "0"
+                  } : showDefaultColumnSettingsIcon.value ? {
+                    name: "column-settings-icon",
+                    fn: vue.withCtx(() => [
+                      vue.createElementVNode("div", { class: "column-settings-wrapper" }, [
+                        vue.createVNode(vue.unref(YcSvgIcon), {
+                          src: fieldSettingIconUrl.value,
+                          size: 16
+                        }, null, 8, ["src"]),
+                        vue.createElementVNode(
+                          "span",
+                          { class: "column-settings-text" },
+                          vue.toDisplayString(resolvedColumnSettingsText.value),
+                          1
+                          /* TEXT */
+                        )
+                      ])
+                    ]),
+                    key: "1"
+                  } : void 0,
+                  vue.renderList(_ctx.$slots, (_, name) => {
+                    return {
+                      name,
+                      fn: vue.withCtx((slotProps) => [
+                        name !== "column-settings-icon" && name !== "default" ? vue.renderSlot(_ctx.$slots, name, vue.normalizeProps(vue.mergeProps({ key: 0 }, slotProps)), void 0, true) : vue.createCommentVNode("v-if", true)
+                      ])
+                    };
+                  })
+                ]), 1040, ["columns", "is-card", "request", "search", "search-card-props", "table-card-props", "table", "pagination", "default-page-info"])
+              ],
+              34
+              /* CLASS, NEED_HYDRATION */
+            )
           ],
           2
           /* CLASS */
@@ -33758,7 +33987,7 @@
     }
   });
 
-  var YcPlusPageComponent = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-73380467"], ["__file", "index.vue"]]);
+  var YcPlusPageComponent = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-3ce473db"], ["__file", "index.vue"]]);
 
   function compareValues(a, b) {
     if (a == null && b == null) return 0;
@@ -64303,7 +64532,7 @@
     });
   }
 
-  const version = "0.0.76";
+  const version = "0.0.77";
 
   const install = installer.install;
 
@@ -64449,6 +64678,7 @@
   exports.useSelectWithPagination = useSelectWithPagination;
   exports.useSortableDrag = useSortableDrag$1;
   exports.useTable = useTable;
+  exports.useTableDragScroll = useTableDragScroll;
   exports.useVirtualScroll = useVirtualScroll;
   exports.useVirtualSelection = useVirtualSelection;
   exports.useYcAuth = useYcAuth;

package/index.min.css

@@ -4,7 +4,7 @@
 .yc-svg-icon[data-v-34e1f2f7]{display:inline-block;-webkit-mask-size:contain;mask-size:contain;vertical-align:middle}.yc-svg-icon--original[data-v-34e1f2f7]{-o-object-fit:contain;object-fit:contain}
 .yc-header-filter-cell[data-v-44e8a77a]{width:100%}.yc-header-filter-cell__label--ellipsis[data-v-44e8a77a]{flex:1 1 0;min-width:0;overflow:hidden}.yc-header-filter-cell__label--ellipsis[data-v-44e8a77a] .yc-header-filter-cell__label-text[data-v-44e8a77a]{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.yc-header-filter-cell__label--active[data-v-44e8a77a]{color:var(--el-color-primary)}[data-v-44e8a77a] .yc-header-filter-cell__sort-icon--asc,[data-v-44e8a77a] .yc-header-filter-cell__sort-icon--desc{background-color:var(--el-color-primary)!important}[data-v-44e8a77a] .yc-header-filter-cell__filter-icon--active{background-color:var(--el-color-primary)!important}
 .yc-header-filter-inner-dropdown{z-index:4100!important}
-.yc-plus-page[data-v-73380467]{height:100%}.yc-plus-page[data-v-73380467] [data-v-73380467] .plus-page>.el-card{border-radius:8px}[data-v-73380467] .yc-search-card-body{padding-right:0}[data-v-73380467] .plus-table-title-bar__toolbar__icon{font-size:16px!important;position:relative;top:-2px}.column-settings-wrapper[data-v-73380467]{align-items:center;cursor:pointer;display:flex;gap:4px;margin-left:8px}.column-settings-text[data-v-73380467]{font-size:14px}
+.yc-plus-page[data-v-3ce473db]{height:100%}.yc-plus-page[data-v-3ce473db] [data-v-3ce473db] .plus-page>.el-card{border-radius:8px}.yc-plus-page__drag-wrapper[data-v-3ce473db]{height:100%}.yc-plus-page__drag-wrapper--enabled[data-v-3ce473db]{display:flex;flex-direction:column;min-height:0;overflow:hidden}[data-v-3ce473db] .yc-search-card-body{padding-right:0}[data-v-3ce473db] .plus-table-title-bar__toolbar__icon{font-size:16px!important;position:relative;top:-2px}.column-settings-wrapper[data-v-3ce473db]{align-items:center;cursor:pointer;display:flex;gap:4px;margin-left:8px}.column-settings-text[data-v-3ce473db]{font-size:14px}
 .yc-select-v2-loading.el-select-dropdown__item{color:#909399;cursor:default;font-size:13px;pointer-events:none;text-align:center}.yc-select-v2-loading.el-select-dropdown__item.is-disabled{color:#909399;cursor:default}
 .el-tree .el-tree-node__content{position:relative}.yc-tree-node-label-wrapper{align-items:center;display:flex;flex:1;min-width:0}.yc-tree-node-label{font-size:12px}.yc-tree-node-line-ver{border-left:1px dashed var(--el-border-color-light,#dcdfe6);display:block;height:100%;left:0;position:absolute;top:0}.yc-tree-node-line-ver.last-node-line{border-left:1px dashed transparent}.yc-tree-node-line-ver.last-node-isLeaf-line{height:50%}.yc-tree-node-line-hor{border-bottom:1px dashed var(--el-border-color-light,#dcdfe6);display:block;height:0;left:0;position:absolute;top:50%}
 .yc-plus-tree[data-v-45c2ba79]{display:flex;flex-direction:column;height:100%;overflow:auto}.yc-plus-tree[data-v-45c2ba79] .search-input[data-v-45c2ba79]{flex-shrink:0;margin-bottom:16px}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79]{flex:1;min-height:0;overflow:hidden}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] [data-v-45c2ba79] .el-tree-v2{overflow-x:visible!important}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .inline-input-node[data-v-45c2ba79]{align-items:center;display:flex;flex:1;padding-left:0;padding-right:8px;position:relative;z-index:1}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .inline-input-node[data-v-45c2ba79] .inline-input[data-v-45c2ba79]{flex-shrink:0;width:100%}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .inline-input-node[data-v-45c2ba79] .inline-input[data-v-45c2ba79] [data-v-45c2ba79] .el-input__wrapper{border-radius:4px;box-shadow:0 0 0 1px var(--el-border-color) inset;font-size:14px;height:26px;line-height:18px;padding:0 8px;transition:box-shadow .2s ease}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .inline-input-node[data-v-45c2ba79] .inline-input[data-v-45c2ba79] [data-v-45c2ba79] .el-input__wrapper[data-v-45c2ba79]:hover{box-shadow:0 0 0 1px var(--el-border-color-hover) inset}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .inline-input-node[data-v-45c2ba79] .inline-input[data-v-45c2ba79] [data-v-45c2ba79] .el-input__wrapper.is-focus[data-v-45c2ba79]{box-shadow:0 0 0 1px var(--el-color-primary) inset}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .inline-input-node[data-v-45c2ba79] .inline-input[data-v-45c2ba79] [data-v-45c2ba79] .el-input__inner{color:rgba(0,0,0,.7);font-size:14px;height:24px;line-height:18px}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .inline-input-node[data-v-45c2ba79] .inline-input[data-v-45c2ba79] [data-v-45c2ba79] .el-input__inner[data-v-45c2ba79]::-moz-placeholder{color:rgba(0,0,0,.4)}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .inline-input-node[data-v-45c2ba79] .inline-input[data-v-45c2ba79] [data-v-45c2ba79] .el-input__inner[data-v-45c2ba79]::placeholder{color:rgba(0,0,0,.4)}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] [data-v-45c2ba79] .el-tree-node__content:hover{background-color:var(--el-color-primary-light-9);border-radius:4px}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] [data-v-45c2ba79] .el-tree-node__content:hover .label-text[data-v-45c2ba79]{color:var(--el-color-primary)}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] [data-v-45c2ba79] .el-tree-node__content:hover .label-text{color:var(--el-color-primary)}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] [data-v-45c2ba79] .el-tree-node.is-current>.el-tree-node__content{background-color:var(--el-color-primary-light-9);border-radius:4px}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] [data-v-45c2ba79] .el-tree-node.is-current>.el-tree-node__content .label-text{color:var(--el-color-primary)}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79]{align-items:center;display:flex;gap:4px;width:100%}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79][data-v-45c2ba79]:hover .node-actions[data-v-45c2ba79]{opacity:1;pointer-events:auto}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] .node-label[data-v-45c2ba79],.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] [data-v-45c2ba79] .custom-node-label{align-items:center;display:flex;flex:1;gap:4px;min-width:0}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] .node-label[data-v-45c2ba79] [data-v-45c2ba79] .el-tooltip__trigger,.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] [data-v-45c2ba79] .custom-node-label [data-v-45c2ba79] .el-tooltip__trigger{display:block;min-width:0;overflow:hidden}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] .node-label[data-v-45c2ba79] .label-text[data-v-45c2ba79],.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] .node-label[data-v-45c2ba79] .node-text[data-v-45c2ba79],.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] [data-v-45c2ba79] .custom-node-label .label-text[data-v-45c2ba79],.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] [data-v-45c2ba79] .custom-node-label .node-text[data-v-45c2ba79]{color:var(--el-text-color-primary);display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] .node-label[data-v-45c2ba79] .label-text[data-v-45c2ba79] [data-v-45c2ba79] .highlight-keyword,.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] .node-label[data-v-45c2ba79] .node-text[data-v-45c2ba79] [data-v-45c2ba79] .highlight-keyword,.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] [data-v-45c2ba79] .custom-node-label .label-text[data-v-45c2ba79] [data-v-45c2ba79] .highlight-keyword,.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] [data-v-45c2ba79] .custom-node-label .node-text[data-v-45c2ba79] [data-v-45c2ba79] .highlight-keyword{background-color:var(--el-color-primary-light-9);border-radius:2px;color:var(--el-color-primary);font-weight:600;padding:0 2px}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] .node-label[data-v-45c2ba79] .node-count[data-v-45c2ba79],.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] [data-v-45c2ba79] .custom-node-label .node-count[data-v-45c2ba79]{color:var(--el-text-color-secondary);font-size:12px}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] .node-actions[data-v-45c2ba79]{align-items:center;display:flex;flex-shrink:0;margin-left:auto;margin-right:8px;opacity:0;pointer-events:none;transition:opacity .2s ease}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] .node-actions[data-v-45c2ba79] .action-icon-wrapper[data-v-45c2ba79]{align-items:center;cursor:pointer;display:flex;justify-content:center}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] .node-actions[data-v-45c2ba79] .action-icon[data-v-45c2ba79]{align-items:center;border-radius:4px;color:var(--el-color-primary);cursor:pointer;display:flex;height:20px;justify-content:center;transition:background-color .2s ease;width:20px}.yc-plus-tree[data-v-45c2ba79] .tree-container[data-v-45c2ba79] .node-label-wrapper[data-v-45c2ba79] .node-actions[data-v-45c2ba79] .action-icon[data-v-45c2ba79][data-v-45c2ba79]:hover{background-color:var(--el-color-primary-light-8)}.tree-dropdown-menu[data-v-45c2ba79]{border-radius:8px!important;min-width:156px!important;padding:8px!important}.tree-dropdown-menu[data-v-45c2ba79] [data-v-45c2ba79] .el-dropdown-menu__item{border-radius:8px;font-size:12px;height:32px;line-height:32px;margin:0;padding:0 12px;transition:background-color .2s ease}.tree-dropdown-menu[data-v-45c2ba79] [data-v-45c2ba79] .el-dropdown-menu__item[data-v-45c2ba79]:hover{background-color:var(--el-color-primary-light-9)!important;color:var(--el-color-primary)!important}.tree-dropdown-menu[data-v-45c2ba79] [data-v-45c2ba79] .el-dropdown-menu__item[data-v-45c2ba79]:not(:last-child){margin-bottom:4px}.tree-dropdown-menu[data-v-45c2ba79] [data-v-45c2ba79] .el-divider{border-top:1px solid #e5e7eb;margin:12px 0}.tree-dropdown-menu[data-v-45c2ba79] [data-v-45c2ba79] .sortable-ghost{background-color:var(--el-color-primary-light-9);border:1px dashed var(--el-color-primary);border-radius:4px;opacity:.4}.tree-dropdown-menu[data-v-45c2ba79] [data-v-45c2ba79] .sortable-chosen{background-color:var(--el-color-primary-light-8);box-shadow:0 2px 8px rgba(0,0,0,.1)}.tree-dropdown-menu[data-v-45c2ba79] [data-v-45c2ba79] .sortable-drag{background-color:#fff;box-shadow:0 4px 12px rgba(0,0,0,.15);cursor:move;opacity:1;transform:rotate(2deg)}.tree-dropdown-menu[data-v-45c2ba79] [data-v-45c2ba79] .sortable-fallback{-webkit-user-select:none;-moz-user-select:none;user-select:none}