beyond-webui 1.1.41 → 1.1.43

package/lib/components/tree-v2/src/tree.js

@@ -40,14 +40,15 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const {
       flattenTree,
       isNotEmpty,
+      listRef,
       toggleExpand,
-      isExpanded,
       isIndeterminate,
       isChecked,
       isDisabled,
       isCurrent,
       isForceHiddenExpandIcon,
       handleNodeClick,
+      handleNodeDrop,
       handleNodeCheck,
       toggleCheckbox,
       getCurrentNode,
@@ -64,7 +65,9 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       getNode,
       expandNode,
       collapseNode,
-      setExpandedKeys
+      setExpandedKeys,
+      scrollToNode,
+      scrollTo
     } = useTree.useTree(props, emit);
     expose({
       toggleCheckbox,
@@ -82,29 +85,33 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       getNode,
       expandNode,
       collapseNode,
-      setExpandedKeys
+      setExpandedKeys,
+      scrollToNode,
+      scrollTo
     });
     return (_ctx, _cache) => {
-      var _a;
       return vue.openBlock(), vue.createElementBlock("div", {
         class: vue.normalizeClass([vue.unref(ns).b(), { [vue.unref(ns).m("highlight-current")]: _ctx.highlightCurrent }]),
         role: "tree"
       }, [
         vue.unref(isNotEmpty) ? (vue.openBlock(), vue.createBlock(vue.unref(fixedSizeList["default"]), {
           key: 0,
+          ref_key: "listRef",
+          ref: listRef,
           "class-name": vue.unref(ns).b("virtual-list"),
           data: vue.unref(flattenTree),
           total: vue.unref(flattenTree).length,
           height: _ctx.height,
           "item-size": vue.unref(treeNodeSize),
-          "perf-mode": _ctx.perfMode
+          "perf-mode": _ctx.perfMode,
+          "scrollbar-always-on": _ctx.scrollbarAlwaysOn
         }, {
           default: vue.withCtx(({ data, index, style }) => [
             (vue.openBlock(), vue.createBlock(treeNode["default"], {
               key: data[index].key,
               style: vue.normalizeStyle(style),
               node: data[index],
-              expanded: vue.unref(isExpanded)(data[index]),
+              expanded: data[index].expanded,
               "show-checkbox": _ctx.showCheckbox,
               checked: vue.unref(isChecked)(data[index]),
               indeterminate: vue.unref(isIndeterminate)(data[index]),
@@ -114,17 +121,23 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
               "hidden-expand-icon": vue.unref(isForceHiddenExpandIcon)(data[index]),
               onClick: vue.unref(handleNodeClick),
               onToggle: vue.unref(toggleExpand),
-              onCheck: vue.unref(handleNodeCheck)
-            }, null, 8, ["style", "node", "expanded", "show-checkbox", "checked", "indeterminate", "item-size", "disabled", "current", "hidden-expand-icon", "onClick", "onToggle", "onCheck"]))
+              onCheck: vue.unref(handleNodeCheck),
+              onDrop: vue.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"])) : (vue.openBlock(), vue.createElementBlock("div", {
+        }, 8, ["class-name", "data", "total", "height", "item-size", "perf-mode", "scrollbar-always-on"])) : (vue.openBlock(), vue.createElementBlock("div", {
           key: 1,
           class: vue.normalizeClass(vue.unref(ns).e("empty-block"))
         }, [
-          vue.createElementVNode("span", {
-            class: vue.normalizeClass(vue.unref(ns).e("empty-text"))
-          }, vue.toDisplayString((_a = _ctx.emptyText) != null ? _a : vue.unref(t)("el.tree.emptyText")), 3)
+          vue.renderSlot(_ctx.$slots, "empty", {}, () => {
+            var _a;
+            return [
+              vue.createElementVNode("span", {
+                class: vue.normalizeClass(vue.unref(ns).e("empty-text"))
+              }, vue.toDisplayString((_a = _ctx.emptyText) != null ? _a : vue.unref(t)("el.tree.emptyText")), 3)
+            ];
+          })
         ], 2))
       ], 2);
     };

package/lib/components/tree-v2/src/tree.js.map

@@ -1 +1 @@
-{"version":3,"file":"tree.js","sources":["../../../../../../packages/components/tree-v2/src/tree.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b(), { [ns.m('highlight-current')]: highlightCurrent }]\"\n    role=\"tree\"\n  >\n    <fixed-size-list\n      v-if=\"isNotEmpty\"\n      :class-name=\"ns.b('virtual-list')\"\n      :data=\"flattenTree\"\n      :total=\"flattenTree.length\"\n      :height=\"height\"\n      :item-size=\"treeNodeSize\"\n      :perf-mode=\"perfMode\"\n    >\n      <template #default=\"{ data, index, style }\">\n        <el-tree-node\n          :key=\"data[index].key\"\n          :style=\"style\"\n          :node=\"data[index]\"\n          :expanded=\"isExpanded(data[index])\"\n          :show-checkbox=\"showCheckbox\"\n          :checked=\"isChecked(data[index])\"\n          :indeterminate=\"isIndeterminate(data[index])\"\n          :item-size=\"treeNodeSize\"\n          :disabled=\"isDisabled(data[index])\"\n          :current=\"isCurrent(data[index])\"\n          :hidden-expand-icon=\"isForceHiddenExpandIcon(data[index])\"\n          @click=\"handleNodeClick\"\n          @toggle=\"toggleExpand\"\n          @check=\"handleNodeCheck\"\n        />\n      </template>\n    </fixed-size-list>\n    <div v-else :class=\"ns.e('empty-block')\">\n      <span :class=\"ns.e('empty-text')\">{{\n        emptyText ?? t('el.tree.emptyText')\n      }}</span>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, getCurrentInstance, provide, useSlots } from 'vue'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { formItemContextKey } from '@element-plus/components/form'\nimport { FixedSizeList } from '@element-plus/components/virtual-list'\nimport { useTree } from './composables/useTree'\nimport ElTreeNode from './tree-node.vue'\nimport { ROOT_TREE_INJECTION_KEY, treeEmits, treeProps } from './virtual-tree'\n\ndefineOptions({\n  name: 'ElTreeV2',\n})\n\nconst props = defineProps(treeProps)\nconst emit = defineEmits(treeEmits)\n\nconst slots = useSlots()\n\nconst treeNodeSize = computed(() => props.itemSize)\n\nprovide(ROOT_TREE_INJECTION_KEY, {\n  ctx: {\n    emit,\n    slots,\n  },\n  props,\n  instance: getCurrentInstance()!,\n})\nprovide(formItemContextKey, undefined)\nconst { t } = useLocale()\nconst ns = useNamespace('tree')\nconst {\n  flattenTree,\n  isNotEmpty,\n  toggleExpand,\n  isExpanded,\n  isIndeterminate,\n  isChecked,\n  isDisabled,\n  isCurrent,\n  isForceHiddenExpandIcon,\n  handleNodeClick,\n  handleNodeCheck,\n  // expose\n  toggleCheckbox,\n  getCurrentNode,\n  getCurrentKey,\n  setCurrentKey,\n  getCheckedKeys,\n  getCheckedNodes,\n  getHalfCheckedKeys,\n  getHalfCheckedNodes,\n  setChecked,\n  setCheckedKeys,\n  filter,\n  setData,\n  getNode,\n  expandNode,\n  collapseNode,\n  setExpandedKeys,\n} = useTree(props, emit)\n\ndefineExpose({\n  toggleCheckbox,\n  getCurrentNode,\n  getCurrentKey,\n  setCurrentKey,\n  getCheckedKeys,\n  getCheckedNodes,\n  getHalfCheckedKeys,\n  getHalfCheckedNodes,\n  setChecked,\n  setCheckedKeys,\n  filter,\n  setData,\n  getNode,\n  expandNode,\n  collapseNode,\n  setExpandedKeys,\n})\n</script>\n"],"names":["useSlots","computed","provide","ROOT_TREE_INJECTION_KEY","getCurrentInstance","formItemContextKey","useLocale","useNamespace","useTree"],"mappings":";;;;;;;;;;;;;;;;;uCAkDc,CAAA;AAAA,EACZ,IAAM,EAAA,UAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAKA,IAAA,MAAM,QAAQA,YAAS,EAAA,CAAA;AAEvB,IAAA,MAAM,YAAe,GAAAC,YAAA,CAAS,MAAM,KAAA,CAAM,QAAQ,CAAA,CAAA;AAElD,IAAAC,WAAA,CAAQC,mCAAyB,EAAA;AAAA,MAC/B,GAAK,EAAA;AAAA,QACH,IAAA;AAAA,QACA,KAAA;AAAA,OACF;AAAA,MACA,KAAA;AAAA,MACA,UAAUC,sBAAmB,EAAA;AAAA,KAC9B,CAAA,CAAA;AACD,IAAAF,WAAA,CAAQG,8BAAoB,KAAS,CAAA,CAAA,CAAA;AACrC,IAAM,MAAA,EAAE,MAAMC,eAAU,EAAA,CAAA;AACxB,IAAM,MAAA,EAAA,GAAKC,qBAAa,MAAM,CAAA,CAAA;AAC9B,IAAM,MAAA;AAAA,MACJ,WAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA;AAAA,MACA,UAAA;AAAA,MACA,eAAA;AAAA,MACA,SAAA;AAAA,MACA,UAAA;AAAA,MACA,SAAA;AAAA,MACA,uBAAA;AAAA,MACA,eAAA;AAAA,MACA,eAAA;AAAA,MAEA,cAAA;AAAA,MACA,cAAA;AAAA,MACA,aAAA;AAAA,MACA,aAAA;AAAA,MACA,cAAA;AAAA,MACA,eAAA;AAAA,MACA,kBAAA;AAAA,MACA,mBAAA;AAAA,MACA,UAAA;AAAA,MACA,cAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA;AAAA,MACA,eAAA;AAAA,KACE,GAAAC,eAAA,CAAQ,OAAO,IAAI,CAAA,CAAA;AAEvB,IAAa,MAAA,CAAA;AAAA,MACX,cAAA;AAAA,MACA,cAAA;AAAA,MACA,aAAA;AAAA,MACA,aAAA;AAAA,MACA,cAAA;AAAA,MACA,eAAA;AAAA,MACA,kBAAA;AAAA,MACA,mBAAA;AAAA,MACA,UAAA;AAAA,MACA,cAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA;AAAA,MACA,eAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"tree.js","sources":["../../../../../../packages/components/tree-v2/src/tree.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b(), { [ns.m('highlight-current')]: highlightCurrent }]\"\n    role=\"tree\"\n  >\n    <fixed-size-list\n      v-if=\"isNotEmpty\"\n      ref=\"listRef\"\n      :class-name=\"ns.b('virtual-list')\"\n      :data=\"flattenTree\"\n      :total=\"flattenTree.length\"\n      :height=\"height\"\n      :item-size=\"treeNodeSize\"\n      :perf-mode=\"perfMode\"\n      :scrollbar-always-on=\"scrollbarAlwaysOn\"\n    >\n      <template #default=\"{ data, index, style }\">\n        <el-tree-node\n          :key=\"data[index].key\"\n          :style=\"style\"\n          :node=\"data[index]\"\n          :expanded=\"data[index].expanded\"\n          :show-checkbox=\"showCheckbox\"\n          :checked=\"isChecked(data[index])\"\n          :indeterminate=\"isIndeterminate(data[index])\"\n          :item-size=\"treeNodeSize\"\n          :disabled=\"isDisabled(data[index])\"\n          :current=\"isCurrent(data[index])\"\n          :hidden-expand-icon=\"isForceHiddenExpandIcon(data[index])\"\n          @click=\"handleNodeClick\"\n          @toggle=\"toggleExpand\"\n          @check=\"handleNodeCheck\"\n          @drop=\"handleNodeDrop\"\n        />\n      </template>\n    </fixed-size-list>\n    <div v-else :class=\"ns.e('empty-block')\">\n      <slot name=\"empty\">\n        <span :class=\"ns.e('empty-text')\">\n          {{ emptyText ?? t('el.tree.emptyText') }}\n        </span>\n      </slot>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, getCurrentInstance, provide, useSlots } from 'vue'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport { formItemContextKey } from '@element-plus/components/form'\nimport { FixedSizeList } from '@element-plus/components/virtual-list'\nimport { useTree } from './composables/useTree'\nimport ElTreeNode from './tree-node.vue'\nimport { ROOT_TREE_INJECTION_KEY, treeEmits, treeProps } from './virtual-tree'\n\ndefineOptions({\n  name: 'ElTreeV2',\n})\n\nconst props = defineProps(treeProps)\nconst emit = defineEmits(treeEmits)\n\nconst slots = useSlots()\n\nconst treeNodeSize = computed(() => props.itemSize)\n\nprovide(ROOT_TREE_INJECTION_KEY, {\n  ctx: {\n    emit,\n    slots,\n  },\n  props,\n  instance: getCurrentInstance()!,\n})\nprovide(formItemContextKey, undefined)\nconst { t } = useLocale()\nconst ns = useNamespace('tree')\nconst {\n  flattenTree,\n  isNotEmpty,\n  listRef,\n  toggleExpand,\n  isIndeterminate,\n  isChecked,\n  isDisabled,\n  isCurrent,\n  isForceHiddenExpandIcon,\n  handleNodeClick,\n  handleNodeDrop,\n  handleNodeCheck,\n  // expose\n  toggleCheckbox,\n  getCurrentNode,\n  getCurrentKey,\n  setCurrentKey,\n  getCheckedKeys,\n  getCheckedNodes,\n  getHalfCheckedKeys,\n  getHalfCheckedNodes,\n  setChecked,\n  setCheckedKeys,\n  filter,\n  setData,\n  getNode,\n  expandNode,\n  collapseNode,\n  setExpandedKeys,\n  scrollToNode,\n  scrollTo,\n} = useTree(props, emit)\n\ndefineExpose({\n  toggleCheckbox,\n  getCurrentNode,\n  getCurrentKey,\n  setCurrentKey,\n  getCheckedKeys,\n  getCheckedNodes,\n  getHalfCheckedKeys,\n  getHalfCheckedNodes,\n  setChecked,\n  setCheckedKeys,\n  filter,\n  setData,\n  getNode,\n  expandNode,\n  collapseNode,\n  setExpandedKeys,\n  scrollToNode,\n  scrollTo,\n})\n</script>\n"],"names":["useSlots","computed","provide","ROOT_TREE_INJECTION_KEY","getCurrentInstance","formItemContextKey","useLocale","useNamespace","useTree"],"mappings":";;;;;;;;;;;;;;;;;uCAuDc,CAAA;AAAA,EACZ,IAAM,EAAA,UAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAKA,IAAA,MAAM,QAAQA,YAAS,EAAA,CAAA;AAEvB,IAAA,MAAM,YAAe,GAAAC,YAAA,CAAS,MAAM,KAAA,CAAM,QAAQ,CAAA,CAAA;AAElD,IAAAC,WAAA,CAAQC,mCAAyB,EAAA;AAAA,MAC/B,GAAK,EAAA;AAAA,QACH,IAAA;AAAA,QACA,KAAA;AAAA,OACF;AAAA,MACA,KAAA;AAAA,MACA,UAAUC,sBAAmB,EAAA;AAAA,KAC9B,CAAA,CAAA;AACD,IAAAF,WAAA,CAAQG,8BAAoB,KAAS,CAAA,CAAA,CAAA;AACrC,IAAM,MAAA,EAAE,MAAMC,eAAU,EAAA,CAAA;AACxB,IAAM,MAAA,EAAA,GAAKC,qBAAa,MAAM,CAAA,CAAA;AAC9B,IAAM,MAAA;AAAA,MACJ,WAAA;AAAA,MACA,UAAA;AAAA,MACA,OAAA;AAAA,MACA,YAAA;AAAA,MACA,eAAA;AAAA,MACA,SAAA;AAAA,MACA,UAAA;AAAA,MACA,SAAA;AAAA,MACA,uBAAA;AAAA,MACA,eAAA;AAAA,MACA,cAAA;AAAA,MACA,eAAA;AAAA,MAEA,cAAA;AAAA,MACA,cAAA;AAAA,MACA,aAAA;AAAA,MACA,aAAA;AAAA,MACA,cAAA;AAAA,MACA,eAAA;AAAA,MACA,kBAAA;AAAA,MACA,mBAAA;AAAA,MACA,UAAA;AAAA,MACA,cAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA;AAAA,MACA,eAAA;AAAA,MACA,YAAA;AAAA,MACA,QAAA;AAAA,KACE,GAAAC,eAAA,CAAQ,OAAO,IAAI,CAAA,CAAA;AAEvB,IAAa,MAAA,CAAA;AAAA,MACX,cAAA;AAAA,MACA,cAAA;AAAA,MACA,aAAA;AAAA,MACA,aAAA;AAAA,MACA,cAAA;AAAA,MACA,eAAA;AAAA,MACA,kBAAA;AAAA,MACA,mBAAA;AAAA,MACA,UAAA;AAAA,MACA,cAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAA;AAAA,MACA,OAAA;AAAA,MACA,UAAA;AAAA,MACA,YAAA;AAAA,MACA,eAAA;AAAA,MACA,YAAA;AAAA,MACA,QAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}