beyond-webui 1.1.41 → 1.1.43

package/dist/index.full.mjs

@@ -46087,6 +46087,7 @@ const _sfc_main$q = defineComponent({
   props: defaultProps$1,
   emits: [
     "select",
+    "scroll",
     "select-all",
     "selection-change",
     "cell-mouse-enter",
@@ -46246,7 +46247,7 @@ function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
     ]),
     style: normalizeStyle(_ctx.style),
     "data-prefix": _ctx.ns.namespace.value,
-    onMouseleave: _cache[0] || (_cache[0] = (...args) => _ctx.handleMouseLeave && _ctx.handleMouseLeave(...args))
+    onMouseleave: _cache[1] || (_cache[1] = (...args) => _ctx.handleMouseLeave && _ctx.handleMouseLeave(...args))
   }, [
     createElementVNode("div", {
       class: normalizeClass(_ctx.ns.e("inner-wrapper")),
@@ -46291,7 +46292,8 @@ function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
           ref: "scrollBarRef",
           "view-style": _ctx.scrollbarViewStyle,
           "wrap-style": _ctx.scrollbarStyle,
-          always: _ctx.scrollbarAlwaysOn
+          always: _ctx.scrollbarAlwaysOn,
+          onScroll: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("scroll", $event))
         }, {
           default: withCtx(() => [
             createElementVNode("table", {
@@ -53099,6 +53101,7 @@ var TreeOptionsEnum = /* @__PURE__ */ ((TreeOptionsEnum2) => {
   TreeOptionsEnum2["LABEL"] = "label";
   TreeOptionsEnum2["CHILDREN"] = "children";
   TreeOptionsEnum2["DISABLED"] = "disabled";
+  TreeOptionsEnum2["CLASS"] = "";
   return TreeOptionsEnum2;
 })(TreeOptionsEnum || {});
 var SetOperationEnum = /* @__PURE__ */ ((SetOperationEnum2) => {
@@ -53128,25 +53131,17 @@ const treeProps = buildProps({
       children: "children" /* CHILDREN */,
       label: "label" /* LABEL */,
       disabled: "disabled" /* DISABLED */,
-      value: "id" /* KEY */
+      value: "id" /* KEY */,
+      class: "" /* CLASS */
     })
   },
-  highlightCurrent: {
-    type: Boolean,
-    default: false
-  },
-  showCheckbox: {
-    type: Boolean,
-    default: false
-  },
+  highlightCurrent: Boolean,
+  showCheckbox: Boolean,
   defaultCheckedKeys: {
     type: definePropType(Array),
     default: () => mutable([])
   },
-  checkStrictly: {
-    type: Boolean,
-    default: false
-  },
+  checkStrictly: Boolean,
   defaultExpandedKeys: {
     type: definePropType(Array),
     default: () => mutable([])
@@ -53163,58 +53158,36 @@ const treeProps = buildProps({
     type: Boolean,
     default: true
   },
-  checkOnClickNode: {
+  checkOnClickNode: Boolean,
+  checkOnClickLeaf: {
     type: Boolean,
-    default: false
+    default: true
   },
   currentNodeKey: {
     type: definePropType([String, Number])
   },
-  accordion: {
-    type: Boolean,
-    default: false
-  },
+  accordion: Boolean,
   filterMethod: {
     type: definePropType(Function)
   },
   perfMode: {
     type: Boolean,
     default: true
-  }
+  },
+  scrollbarAlwaysOn: Boolean
 });
 const treeNodeProps = buildProps({
   node: {
     type: definePropType(Object),
     default: () => mutable(EMPTY_NODE)
   },
-  expanded: {
-    type: Boolean,
-    default: false
-  },
-  checked: {
-    type: Boolean,
-    default: false
-  },
-  indeterminate: {
-    type: Boolean,
-    default: false
-  },
-  showCheckbox: {
-    type: Boolean,
-    default: false
-  },
-  disabled: {
-    type: Boolean,
-    default: false
-  },
-  current: {
-    type: Boolean,
-    default: false
-  },
-  hiddenExpandIcon: {
-    type: Boolean,
-    default: false
-  },
+  expanded: Boolean,
+  checked: Boolean,
+  indeterminate: Boolean,
+  showCheckbox: Boolean,
+  disabled: Boolean,
+  current: Boolean,
+  hiddenExpandIcon: Boolean,
   itemSize
 });
 const treeNodeContentProps = buildProps({
@@ -53224,6 +53197,7 @@ const treeNodeContentProps = buildProps({
   }
 });
 const NODE_CLICK = "node-click";
+const NODE_DROP = "node-drop";
 const NODE_EXPAND = "node-expand";
 const NODE_COLLAPSE = "node-collapse";
 const CURRENT_CHANGE = "current-change";
@@ -53232,17 +53206,19 @@ const NODE_CHECK_CHANGE = "check-change";
 const NODE_CONTEXTMENU = "node-contextmenu";
 const treeEmits = {
   [NODE_CLICK]: (data, node, e) => data && node && e,
+  [NODE_DROP]: (data, node, e) => data && node && e,
   [NODE_EXPAND]: (data, node) => data && node,
   [NODE_COLLAPSE]: (data, node) => data && node,
   [CURRENT_CHANGE]: (data, node) => data && node,
   [NODE_CHECK]: (data, checkedInfo) => data && checkedInfo,
-  [NODE_CHECK_CHANGE]: (data, checked) => data && typeof checked === "boolean",
-  [NODE_CONTEXTMENU]: (event, data, node) => event && data && node
+  [NODE_CHECK_CHANGE]: (data, checked) => data && isBoolean(checked),
+  [NODE_CONTEXTMENU]: (evt, data, node) => evt && data && node
 };
 const treeNodeEmits = {
   click: (node, e) => !!(node && e),
+  drop: (node, e) => !!(node && e),
   toggle: (node) => !!node,
-  check: (node, checked) => node && typeof checked === "boolean"
+  check: (node, checked) => node && isBoolean(checked)
 };
 
 function useCheck(props, tree) {
@@ -53300,7 +53276,7 @@ function useCheck(props, tree) {
   };
   const isChecked = (node) => checkedKeys.value.has(node.key);
   const isIndeterminate = (node) => indeterminateKeys.value.has(node.key);
-  const toggleCheckbox = (node, isChecked2, nodeClick = true) => {
+  const toggleCheckbox = (node, isChecked2, nodeClick = true, immediateUpdate = true) => {
     const checkedKeySet = checkedKeys.value;
     const toggle = (node2, checked) => {
       checkedKeySet[checked ? SetOperationEnum.ADD : SetOperationEnum.DELETE](node2.key);
@@ -53314,7 +53290,9 @@ function useCheck(props, tree) {
       }
     };
     toggle(node, isChecked2);
-    updateCheckedKeys();
+    if (immediateUpdate) {
+      updateCheckedKeys();
+    }
     if (nodeClick) {
       afterNodeCheck(node, isChecked2);
     }
@@ -53381,7 +53359,9 @@ function useCheck(props, tree) {
   function setCheckedKeys(keys) {
     checkedKeys.value.clear();
     indeterminateKeys.value.clear();
-    _setCheckedKeys(keys);
+    nextTick(() => {
+      _setCheckedKeys(keys);
+    });
   }
   function setChecked(key, isChecked2) {
     if ((tree == null ? void 0 : tree.value) && props.showCheckbox) {
@@ -53394,13 +53374,14 @@ function useCheck(props, tree) {
   function _setCheckedKeys(keys) {
     if (tree == null ? void 0 : tree.value) {
       const { treeNodeMap } = tree.value;
-      if (props.showCheckbox && treeNodeMap && keys) {
+      if (props.showCheckbox && treeNodeMap && (keys == null ? void 0 : keys.length) > 0) {
         for (const key of keys) {
           const node = treeNodeMap.get(key);
           if (node && !isChecked(node)) {
-            toggleCheckbox(node, true, false);
+            toggleCheckbox(node, true, false, false);
           }
         }
+        updateCheckedKeys();
       }
     }
   }
@@ -53439,7 +53420,7 @@ function useFilter(props, tree) {
     function traverse(nodes2) {
       nodes2.forEach((node) => {
         family.push(node);
-        if (filter == null ? void 0 : filter(query, node.data)) {
+        if (filter == null ? void 0 : filter(query, node.data, node)) {
           family.forEach((member) => {
             expandKeySet.add(member.key);
           });
@@ -53486,19 +53467,10 @@ function useFilter(props, tree) {
 }
 
 function useTree(props, emit) {
-  const expandedKeySet = ref(new Set(props.defaultExpandedKeys));
+  const expandedKeySet = ref(/* @__PURE__ */ new Set());
   const currentKey = ref();
   const tree = shallowRef();
-  watch(() => props.currentNodeKey, (key) => {
-    currentKey.value = key;
-  }, {
-    immediate: true
-  });
-  watch(() => props.data, (data) => {
-    setData(data);
-  }, {
-    immediate: true
-  });
+  const listRef = ref();
   const {
     isIndeterminate,
     isChecked,
@@ -53528,34 +53500,26 @@ function useTree(props, emit) {
     return ((_a = props.props) == null ? void 0 : _a.label) || TreeOptionsEnum.LABEL;
   });
   const flattenTree = computed$1(() => {
+    var _a;
     const expandedKeys = expandedKeySet.value;
     const hiddenKeys = hiddenNodeKeySet.value;
     const flattenNodes = [];
-    const nodes = tree.value && tree.value.treeNodes || [];
-    function traverse() {
-      const stack = [];
-      for (let i = nodes.length - 1; i >= 0; --i) {
-        stack.push(nodes[i]);
-      }
-      while (stack.length) {
-        const node = stack.pop();
-        if (!node)
-          continue;
-        if (!hiddenKeys.has(node.key)) {
-          flattenNodes.push(node);
-        }
-        if (expandedKeys.has(node.key)) {
-          const children = node.children;
-          if (children) {
-            const length = children.length;
-            for (let i = length - 1; i >= 0; --i) {
-              stack.push(children[i]);
-            }
-          }
+    const nodes = ((_a = tree.value) == null ? void 0 : _a.treeNodes) || [];
+    const stack = [];
+    for (let i = nodes.length - 1; i >= 0; --i) {
+      stack.push(nodes[i]);
+    }
+    while (stack.length) {
+      const node = stack.pop();
+      if (hiddenKeys.has(node.key))
+        continue;
+      flattenNodes.push(node);
+      if (node.children && expandedKeys.has(node.key)) {
+        for (let i = node.children.length - 1; i >= 0; --i) {
+          stack.push(node.children[i]);
         }
       }
     }
-    traverse();
     return flattenNodes;
   });
   const isNotEmpty = computed$1(() => {
@@ -53580,6 +53544,7 @@ function useTree(props, emit) {
         const children = getChildren(rawNode);
         node.disabled = getDisabled(rawNode);
         node.isLeaf = !children || children.length === 0;
+        node.expanded = expandedKeySet.value.has(value);
         if (children && children.length) {
           node.children = traverse(children, level + 1, node);
         }
@@ -53633,7 +53598,17 @@ function useTree(props, emit) {
     }
   }
   function setExpandedKeys(keys) {
-    expandedKeySet.value = new Set(keys);
+    const expandedKeys = /* @__PURE__ */ new Set();
+    const nodeMap = tree.value.treeNodeMap;
+    keys.forEach((k) => {
+      let node = nodeMap.get(k);
+      while (node && !expandedKeys.has(node.key)) {
+        expandedKeys.add(node.key);
+        node.expanded = true;
+        node = node.parent;
+      }
+    });
+    expandedKeySet.value = expandedKeys;
   }
   function handleNodeClick(node, e) {
     emit(NODE_CLICK, node.data, node, e);
@@ -53641,10 +53616,13 @@ function useTree(props, emit) {
     if (props.expandOnClickNode) {
       toggleExpand(node);
     }
-    if (props.showCheckbox && props.checkOnClickNode && !node.disabled) {
+    if (props.showCheckbox && (props.checkOnClickNode || node.isLeaf && props.checkOnClickLeaf) && !node.disabled) {
       toggleCheckbox(node, !isChecked(node), true);
     }
   }
+  function handleNodeDrop(node, e) {
+    emit(NODE_DROP, node.data, node, e);
+  }
   function handleCurrentChange(node) {
     if (!isCurrent(node)) {
       currentKey.value = node.key;
@@ -53662,25 +53640,25 @@ function useTree(props, emit) {
         const treeNode = treeNodeMap.get(key);
         if (node && node.level === (treeNode == null ? void 0 : treeNode.level)) {
           keySet.delete(key);
+          treeNode.expanded = false;
         }
       });
     }
     keySet.add(node.key);
+    node.expanded = true;
     emit(NODE_EXPAND, node.data, node);
   }
   function collapseNode(node) {
     expandedKeySet.value.delete(node.key);
+    node.expanded = false;
     emit(NODE_COLLAPSE, node.data, node);
   }
-  function isExpanded(node) {
-    return expandedKeySet.value.has(node.key);
-  }
   function isDisabled(node) {
     return !!node.disabled;
   }
   function isCurrent(node) {
     const current = currentKey.value;
-    return !!current && current === node.key;
+    return current !== void 0 && current === node.key;
   }
   function getCurrentNode() {
     var _a, _b;
@@ -53695,28 +53673,54 @@ function useTree(props, emit) {
     currentKey.value = key;
   }
   function setData(data) {
-    nextTick(() => tree.value = createTree(data));
+    tree.value = createTree(data);
   }
   function getNode(data) {
     var _a;
     const key = isObject$1(data) ? getKey(data) : data;
     return (_a = tree.value) == null ? void 0 : _a.treeNodeMap.get(key);
   }
+  function scrollToNode(key, strategy = "auto") {
+    const node = getNode(key);
+    if (node && listRef.value) {
+      listRef.value.scrollToItem(flattenTree.value.indexOf(node), strategy);
+    }
+  }
+  function scrollTo(offset) {
+    var _a;
+    (_a = listRef.value) == null ? void 0 : _a.scrollTo(offset);
+  }
+  watch(() => props.currentNodeKey, (key) => {
+    currentKey.value = key;
+  }, {
+    immediate: true
+  });
+  watch(() => props.defaultExpandedKeys, (key) => {
+    expandedKeySet.value = new Set(key);
+  }, {
+    immediate: true
+  });
+  watch(() => props.data, (data) => {
+    setData(data);
+  }, {
+    immediate: true
+  });
   return {
     tree,
     flattenTree,
     isNotEmpty,
+    listRef,
     getKey,
     getChildren,
     toggleExpand,
     toggleCheckbox,
-    isExpanded,
     isChecked,
     isIndeterminate,
     isDisabled,
     isCurrent,
     isForceHiddenExpandIcon,
     handleNodeClick,
+    handleNodeDrop,
     handleNodeCheck,
     getCurrentNode,
     getCurrentKey,
@@ -53732,7 +53736,9 @@ function useTree(props, emit) {
     getNode,
     expandNode,
     collapseNode,
-    setExpandedKeys
+    setExpandedKeys,
+    scrollToNode,
+    scrollTo
   };
 }
 
@@ -53745,12 +53751,12 @@ var ElNodeContent = defineComponent({
     return () => {
       const node = props.node;
       const { data } = node;
-      return (tree == null ? void 0 : tree.ctx.slots.default) ? tree.ctx.slots.default({ node, data }) : h$1("span", { class: ns.be("node", "label") }, [node == null ? void 0 : node.label]);
+      return (tree == null ? void 0 : tree.ctx.slots.default) ? tree.ctx.slots.default({ node, data }) : h$1(ElText, { tag: "span", truncated: true, class: ns.be("node", "label") }, () => [node == null ? void 0 : node.label]);
     };
   }
 });
 
-const _hoisted_1$6 = ["aria-expanded", "aria-disabled", "aria-checked", "data-key", "onClick"];
+const _hoisted_1$6 = ["aria-expanded", "aria-disabled", "aria-checked", "data-key", "onClick", "onDrop"];
 const __default__$7 = defineComponent({
   name: "ElTreeNode"
 });
@@ -53770,9 +53776,25 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
       var _a;
       return (_a = tree == null ? void 0 : tree.props.icon) != null ? _a : caret_right_default;
     });
+    const getNodeClass = (node) => {
+      const nodeClassFunc = tree == null ? void 0 : tree.props.props.class;
+      if (!nodeClassFunc)
+        return {};
+      let className;
+      if (isFunction$1(nodeClassFunc)) {
+        const { data } = node;
+        className = nodeClassFunc(data, node);
+      } else {
+        className = nodeClassFunc;
+      }
+      return isString$1(className) ? { [className]: true } : className;
+    };
     const handleClick = (e) => {
       emit("click", props.node, e);
     };
+    const handleDrop = (e) => {
+      emit("drop", props.node, e);
+    };
     const handleExpandIconClick = () => {
       emit("toggle", props.node);
     };
@@ -53796,7 +53818,8 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
           unref(ns).is("expanded", _ctx.expanded),
           unref(ns).is("current", _ctx.current),
           unref(ns).is("focusable", !_ctx.disabled),
-          unref(ns).is("checked", !_ctx.disabled && _ctx.checked)
+          unref(ns).is("checked", !_ctx.disabled && _ctx.checked),
+          getNodeClass(_ctx.node)
         ]),
         role: "treeitem",
         tabindex: "-1",
@@ -53805,7 +53828,12 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
         "aria-checked": _ctx.checked,
         "data-key": (_a = _ctx.node) == null ? void 0 : _a.key,
         onClick: withModifiers(handleClick, ["stop"]),
-        onContextmenu: handleContextMenu
+        onContextmenu: handleContextMenu,
+        onDragover: _cache[1] || (_cache[1] = withModifiers(() => {
+        }, ["prevent"])),
+        onDragenter: _cache[2] || (_cache[2] = withModifiers(() => {
+        }, ["prevent"])),
+        onDrop: withModifiers(handleDrop, ["stop"])
       }, [
         createElementVNode("div", {
           class: normalizeClass(unref(ns).be("node", "content")),
@@ -53840,7 +53868,9 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
             onClick: _cache[0] || (_cache[0] = withModifiers(() => {
             }, ["stop"]))
           }, null, 8, ["model-value", "indeterminate", "disabled"])) : createCommentVNode("v-if", true),
-          createVNode(unref(ElNodeContent), { node: _ctx.node }, null, 8, ["node"])
+          createVNode(unref(ElNodeContent), {
+            node: { ..._ctx.node, expanded: _ctx.expanded }
+          }, null, 8, ["node"])
         ], 6)
       ], 42, _hoisted_1$6);
     };
@@ -53873,14 +53903,15 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
     const {
       flattenTree,
       isNotEmpty,
+      listRef,
       toggleExpand,
-      isExpanded,
       isIndeterminate,
       isChecked,
       isDisabled,
       isCurrent,
       isForceHiddenExpandIcon,
       handleNodeClick,
+      handleNodeDrop,
       handleNodeCheck,
       toggleCheckbox,
       getCurrentNode,
@@ -53897,7 +53928,9 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       getNode,
       expandNode,
       collapseNode,
-      setExpandedKeys
+      setExpandedKeys,
+      scrollToNode,
+      scrollTo
     } = useTree(props, emit);
     expose({
       toggleCheckbox,
@@ -53915,29 +53948,33 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
       getNode,
       expandNode,
       collapseNode,
-      setExpandedKeys
+      setExpandedKeys,
+      scrollToNode,
+      scrollTo
     });
     return (_ctx, _cache) => {
-      var _a;
       return openBlock(), createElementBlock("div", {
         class: normalizeClass([unref(ns).b(), { [unref(ns).m("highlight-current")]: _ctx.highlightCurrent }]),
         role: "tree"
       }, [
         unref(isNotEmpty) ? (openBlock(), createBlock(unref(FixedSizeList$1), {
           key: 0,
+          ref_key: "listRef",
+          ref: listRef,
           "class-name": unref(ns).b("virtual-list"),
           data: unref(flattenTree),
           total: unref(flattenTree).length,
           height: _ctx.height,
           "item-size": unref(treeNodeSize),
-          "perf-mode": _ctx.perfMode
+          "perf-mode": _ctx.perfMode,
+          "scrollbar-always-on": _ctx.scrollbarAlwaysOn
         }, {
           default: withCtx(({ data, index, style }) => [
             (openBlock(), createBlock(ElTreeNode, {
               key: data[index].key,
               style: normalizeStyle(style),
               node: data[index],
-              expanded: unref(isExpanded)(data[index]),
+              expanded: data[index].expanded,
               "show-checkbox": _ctx.showCheckbox,
               checked: unref(isChecked)(data[index]),
               indeterminate: unref(isIndeterminate)(data[index]),
@@ -53947,17 +53984,23 @@ const _sfc_main$7 = /* @__PURE__ */ defineComponent({
               "hidden-expand-icon": unref(isForceHiddenExpandIcon)(data[index]),
               onClick: unref(handleNodeClick),
               onToggle: unref(toggleExpand),
-              onCheck: unref(handleNodeCheck)
-            }, null, 8, ["style", "node", "expanded", "show-checkbox", "checked", "indeterminate", "item-size", "disabled", "current", "hidden-expand-icon", "onClick", "onToggle", "onCheck"]))
+              onCheck: unref(handleNodeCheck),
+              onDrop: unref(handleNodeDrop)
+            }, null, 8, ["style", "node", "expanded", "show-checkbox", "checked", "indeterminate", "item-size", "disabled", "current", "hidden-expand-icon", "onClick", "onToggle", "onCheck", "onDrop"]))
           ]),
           _: 1
-        }, 8, ["class-name", "data", "total", "height", "item-size", "perf-mode"])) : (openBlock(), createElementBlock("div", {
+        }, 8, ["class-name", "data", "total", "height", "item-size", "perf-mode", "scrollbar-always-on"])) : (openBlock(), createElementBlock("div", {
           key: 1,
           class: normalizeClass(unref(ns).e("empty-block"))
         }, [
-          createElementVNode("span", {
-            class: normalizeClass(unref(ns).e("empty-text"))
-          }, toDisplayString((_a = _ctx.emptyText) != null ? _a : unref(t)("el.tree.emptyText")), 3)
+          renderSlot(_ctx.$slots, "empty", {}, () => {
+            var _a;
+            return [
+              createElementVNode("span", {
+                class: normalizeClass(unref(ns).e("empty-text"))
+              }, toDisplayString((_a = _ctx.emptyText) != null ? _a : unref(t)("el.tree.emptyText")), 3)
+            ];
+          })
         ], 2))
       ], 2);
     };

package/es/components/affix/index.mjs

@@ -1,6 +1,6 @@
 import '../../utils/index.mjs';
-import Affix from './src/affix2.mjs';
-export { affixEmits, affixProps } from './src/affix.mjs';
+import Affix from './src/affix.mjs';
+export { affixEmits, affixProps } from './src/affix2.mjs';
 import { withInstall } from '../../utils/vue/install.mjs';
 
 const ElAffix = withInstall(Affix);