vft 0.0.362 → 0.0.363

package/lib/components/cascader/index.cjs

@@ -1 +1,10 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require("@vueuse/core");require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");require("vue");const a=require("../../utils/vue/install.cjs");require("lodash-es");const s=require("./cascader.vue2.cjs"),e=require("./cascader.cjs"),r=a.withInstall(s.default);exports.cascaderEmits=e.cascaderEmits;exports.cascaderProps=e.cascaderProps;exports.VftCascader=r;exports.default=r;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const cascader_vue_vue_type_script_setup_true_lang = require("./cascader.vue2.cjs");
+const cascader = require("./cascader.cjs");
+const install = require("../../utils/vue/install.cjs");
+const VftCascader = install.withInstall(cascader_vue_vue_type_script_setup_true_lang.default);
+exports.cascaderEmits = cascader.cascaderEmits;
+exports.cascaderProps = cascader.cascaderProps;
+exports.VftCascader = VftCascader;
+exports.default = VftCascader;

package/lib/components/cascader/style/css.cjs

@@ -1 +1 @@
-"use strict";require("vft/theme-style/base.css");require("vft/theme-style/vft-input.css");require("vft/theme-style/vft-popper.css");require("vft/theme-style/vft-tag.css");require("vft/theme-style/vft-checkbox.css");require("vft/theme-style/vft-radio.css");require("vft/theme-style/vft-scrollbar.css");require("vft/theme-style/vft-cascader-panel.css");require("vft/theme-style/vft-cascader.css");
+"use strict";

package/lib/components/cascader/style/index.cjs

@@ -1 +1 @@
-"use strict";require("vft/theme-style/src/base.scss");require("vft/theme-style/src/input.scss");require("vft/theme-style/src/popper.scss");require("vft/theme-style/src/tag.scss");require("vft/theme-style/src/checkbox.scss");require("vft/theme-style/src/radio.scss");require("vft/theme-style/src/scrollbar.scss");require("vft/theme-style/src/cascader-panel.scss");require("vft/theme-style/src/cascader.scss");
+"use strict";

package/lib/components/cascader-panel/config.cjs

@@ -1 +1,120 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("vue");require("@vueuse/core");const n=require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");const a=require("../../constants/event.cjs"),e=require("../../utils/vue/props/runtime.cjs"),t=e.buildProps({modelValue:{type:e.definePropType([Number,String,Array])},options:{type:e.definePropType(Array),default:()=>[]},props:{type:e.definePropType(Object),default:()=>({})}}),l={expandTrigger:"click",multiple:!1,checkStrictly:!1,emitPath:!0,lazy:!1,lazyLoad:n.noop,value:"value",label:"label",children:"children",leaf:"leaf",disabled:"disabled",hoverThreshold:500,checkOnClickNode:!1,checkOnClickLeaf:!0,showPrefix:!0},c=e.buildProps({...t,border:{type:Boolean,default:!0},renderLabel:{type:Function}}),o=r=>!0,i={[a.UPDATE_MODEL_EVENT]:o,[a.CHANGE_EVENT]:o,close:()=>!0,"expand-change":r=>r},u=r=>s.computed(()=>({...l,...r.props}));exports.CommonProps=t;exports.DefaultProps=l;exports.cascaderPanelEmits=i;exports.cascaderPanelProps=c;exports.useCascaderConfig=u;
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const vue = require("vue");
+const utils = require("@vft/utils");
+const runtime = require("../../utils/vue/props/runtime.cjs");
+const event = require("../../constants/event.cjs");
+const CommonProps = runtime.buildProps({
+  /**
+   * @description specify which key of node object is used as the node's value
+   */
+  modelValue: {
+    type: runtime.definePropType([Number, String, Array])
+  },
+  /**
+   * @description data of the options, the key of `value` and `label` can be customize by `CascaderProps`.
+   */
+  options: {
+    type: runtime.definePropType(Array),
+    default: () => []
+  },
+  /**
+   * @description configuration options, see the following `CascaderProps` table.
+   */
+  props: {
+    type: runtime.definePropType(Object),
+    default: () => ({})
+  }
+});
+const DefaultProps = {
+  /**
+   * @description trigger mode of expanding options
+   */
+  expandTrigger: "click",
+  /**
+   * @description whether multiple selection is enabled
+   */
+  multiple: false,
+  /**
+   * @description whether checked state of a node not affects its parent and child nodes
+   */
+  checkStrictly: false,
+  // whether all nodes can be selected
+  /**
+   * @description when checked nodes change, whether to emit an array of node's path, if false, only emit the value of node.
+   */
+  emitPath: true,
+  // wether to emit an array of all levels value in which node is located
+  /**
+   * @description whether to dynamic load child nodes, use with `lazyload` attribute
+   */
+  lazy: false,
+  /**
+   * @description method for loading child nodes data, only works when `lazy` is true
+   */
+  lazyLoad: utils.noop,
+  /**
+   * @description specify which key of node object is used as the node's value
+   */
+  value: "value",
+  /**
+   * @description specify which key of node object is used as the node's label
+   */
+  label: "label",
+  /**
+   * @description specify which key of node object is used as the node's children
+   */
+  children: "children",
+  /**
+   * @description specify which key of node object is used as the node's leaf
+   */
+  leaf: "leaf",
+  /**
+   * @description specify which key of node object is used as the node's disabled
+   */
+  disabled: "disabled",
+  /**
+   * @description hover threshold of expanding options
+   */
+  hoverThreshold: 500,
+  /**
+   * @description whether to check or uncheck node when clicking on the node
+   */
+  checkOnClickNode: false,
+  /**
+   * @description whether to check or uncheck node when clicking on leaf node (last children).
+   */
+  checkOnClickLeaf: true,
+  /**
+   * @description whether to show the radio or checkbox prefix
+   */
+  showPrefix: true
+};
+const cascaderPanelProps = runtime.buildProps({
+  ...CommonProps,
+  border: {
+    type: Boolean,
+    default: true
+  },
+  renderLabel: {
+    type: Function
+  }
+});
+const emitChangeFn = (value) => true;
+const cascaderPanelEmits = {
+  [event.UPDATE_MODEL_EVENT]: emitChangeFn,
+  [event.CHANGE_EVENT]: emitChangeFn,
+  close: () => true,
+  "expand-change": (value) => value
+};
+const useCascaderConfig = (props) => {
+  return vue.computed(() => ({
+    ...DefaultProps,
+    ...props.props
+  }));
+};
+exports.CommonProps = CommonProps;
+exports.DefaultProps = DefaultProps;
+exports.cascaderPanelEmits = cascaderPanelEmits;
+exports.cascaderPanelProps = cascaderPanelProps;
+exports.useCascaderConfig = useCascaderConfig;

package/lib/components/cascader-panel/index.cjs

@@ -1 +1,15 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require("@vueuse/core");require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");require("vue");const a=require("../../utils/vue/install.cjs");require("lodash-es");const s=require("./index.vue2.cjs"),t=require("./types.cjs"),e=require("./config.cjs"),r=a.withInstall(s.default);exports.CASCADER_PANEL_INJECTION_KEY=t.CASCADER_PANEL_INJECTION_KEY;exports.CommonProps=e.CommonProps;exports.DefaultProps=e.DefaultProps;exports.cascaderPanelEmits=e.cascaderPanelEmits;exports.cascaderPanelProps=e.cascaderPanelProps;exports.useCascaderConfig=e.useCascaderConfig;exports.VftCascaderPanel=r;exports.default=r;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const index_vue_vue_type_script_setup_true_lang = require("./index.vue2.cjs");
+const types = require("./types.cjs");
+const config = require("./config.cjs");
+const install = require("../../utils/vue/install.cjs");
+const VftCascaderPanel = install.withInstall(index_vue_vue_type_script_setup_true_lang.default);
+exports.CASCADER_PANEL_INJECTION_KEY = types.CASCADER_PANEL_INJECTION_KEY;
+exports.CommonProps = config.CommonProps;
+exports.DefaultProps = config.DefaultProps;
+exports.cascaderPanelEmits = config.cascaderPanelEmits;
+exports.cascaderPanelProps = config.cascaderPanelProps;
+exports.useCascaderConfig = config.useCascaderConfig;
+exports.VftCascaderPanel = VftCascaderPanel;
+exports.default = VftCascaderPanel;

package/lib/components/cascader-panel/index.vue.cjs

@@ -1 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./index.vue2.cjs");exports.default=e.default;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const index_vue_vue_type_script_setup_true_lang = require("./index.vue2.cjs");
+exports.default = index_vue_vue_type_script_setup_true_lang.default;

package/lib/components/cascader-panel/index.vue2.cjs

@@ -1 +1,321 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("vue"),y=require("lodash-es"),b=require("../../utils/dom/aria.cjs");require("@vueuse/core");const W=require("../../utils/dom/scroll.cjs"),O=require("@vft/utils"),x=require("../../utils/helper.cjs"),h=require("../../constants/aria.cjs"),F=require("../../constants/event.cjs"),X=require("../../hooks/use-namespace/index.cjs");require("../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");require("../../hooks/use-z-index/index.cjs");const Z=require("./menu.vue2.cjs"),K=require("./store.cjs"),ee=require("./node.cjs"),M=require("./config.cjs"),w=require("./utils.cjs"),te=require("./types.cjs"),ne=t.defineComponent({name:"VftCascaderPanel",inheritAttrs:!1}),ae=t.defineComponent({...ne,props:M.cascaderPanelProps,emits:M.cascaderPanelEmits,setup(H,{expose:U,emit:j}){const r=H,_=j;let k=!1;const u=X.useNamespace("cascader"),i=M.useCascaderConfig(r),G=t.useSlots();let d;const C=t.ref(!0),N=t.ref([]),q=t.ref(),p=t.ref([]),g=t.ref(),v=t.ref([]),J=t.computed(()=>i.value.expandTrigger==="hover"),R=t.computed(()=>r.renderLabel||G.default),B=()=>{const{options:e}=r,n=i.value;k=!1,d=new K.default(e,n),p.value=[d.getNodes()],n.lazy&&O.isEmpty(r.options)?(C.value=!1,D(void 0,a=>{a&&(d=new K.default(a,n),p.value=[d.getNodes()]),C.value=!0,m(!1,!0)})):m(!1,!0)},D=(e,n)=>{const a=i.value;e=e||new ee.default({},a,void 0,!0),e.loading=!0;const s=o=>{const l=e,E=l.root?null:l;o&&d?.appendNodes(o,E),l.loading=!1,l.loaded=!0,l.childrenData=l.childrenData||[],o&&n?.(o)};a.lazyLoad(e,s)},S=(e,n)=>{const{level:a}=e,s=p.value.slice(0,a);let o;e.isLeaf?o=e.pathNodes[a-2]:(o=e,s.push(e.children)),g.value?.uid!==o?.uid&&(g.value=e,p.value=s,!n&&_("expand-change",e?.pathValues||[]))},$=(e,n,a=!0)=>{const{checkStrictly:s,multiple:o}=i.value,l=v.value[0];k=!0,!o&&l?.doCheck(!1),e.doCheck(n),T(),a&&!o&&!s&&_("close"),!a&&!o&&!s&&A(e)},A=e=>{e&&(e=e.parent,A(e),e&&S(e))},L=e=>d?.getFlattedNodes(e),P=e=>L(e)?.filter(({checked:n})=>n!==!1),Y=()=>{v.value.forEach(e=>e.doCheck(!1)),T(),p.value=p.value.slice(0,1),g.value=void 0,_("expand-change",[])},T=()=>{const{checkStrictly:e,multiple:n}=i.value,a=v.value,s=P(!e),o=w.sortByOriginalOrder(a,s),l=o.map(E=>E.valueByOption);v.value=o,q.value=n?l:l[0]},m=(e=!1,n=!1)=>{const{modelValue:a}=r,{lazy:s,multiple:o,checkStrictly:l}=i.value,E=!l;if(!(!C.value||k||!n&&y.isEqual(a,q.value)))if(s&&!e){const V=x.unique(y.flattenDeep(x.castArray(a))).map(f=>d?.getNodeByValue(f)).filter(f=>!!f&&!f.loaded&&!f.loading);V.length?V.forEach(f=>{D(f,()=>m(!1,n))}):m(!0,n)}else{const c=o?x.castArray(a):[a],V=x.unique(c.map(f=>d?.getNodeByValue(f,E)));Q(V,n),q.value=y.cloneDeep(a??void 0)}},Q=(e,n=!0)=>{const{checkStrictly:a}=i.value,s=v.value,o=e.filter(c=>!!c&&(a||c.isLeaf)),l=d?.getSameNode(g.value),E=n&&l||o[0];E?E.pathNodes.forEach(c=>S(c,!0)):g.value=void 0,s.forEach(c=>c.doCheck(!1)),t.reactive(o).forEach(c=>c.doCheck(!0)),v.value=o,t.nextTick(z)},z=()=>{O.isClient&&N.value.forEach(e=>{const n=e?.$el;if(n){const a=n.querySelector(`.${u.namespace.value}-scrollbar__wrap`),s=n.querySelector(`.${u.b("node")}.${u.is("active")}:last-child`)||n.querySelector(`.${u.b("node")}.in-active-path`);W.scrollIntoView(a,s)}})},I=e=>{const n=e.target,{code:a}=e;switch(a){case h.EVENT_CODE.up:case h.EVENT_CODE.down:{e.preventDefault();const s=a===h.EVENT_CODE.up?-1:1;b.focusNode(b.getSibling(n,s,`.${u.b("node")}[tabindex="-1"]`));break}case h.EVENT_CODE.left:{e.preventDefault();const o=N.value[w.getMenuIndex(n)-1]?.$el.querySelector(`.${u.b("node")}[aria-expanded="true"]`);b.focusNode(o);break}case h.EVENT_CODE.right:{e.preventDefault();const o=N.value[w.getMenuIndex(n)+1]?.$el.querySelector(`.${u.b("node")}[tabindex="-1"]`);b.focusNode(o);break}case h.EVENT_CODE.enter:case h.EVENT_CODE.numpadEnter:w.checkNode(n);break}};return t.provide(te.CASCADER_PANEL_INJECTION_KEY,t.reactive({config:i,expandingNode:g,checkedNodes:v,isHoverMenu:J,initialLoaded:C,renderLabelFn:R,lazyLoad:D,expandNode:S,handleCheckChange:$})),t.watch(i,(e,n)=>{y.isEqual(e,n)||B()},{immediate:!0}),t.watch(()=>r.options,B,{deep:!0}),t.watch(()=>r.modelValue,()=>{k=!1,m()},{deep:!0}),t.watch(()=>q.value,e=>{y.isEqual(e,r.modelValue)||(_(F.UPDATE_MODEL_EVENT,e),_(F.CHANGE_EVENT,e))}),t.onBeforeUpdate(()=>N.value=[]),t.onMounted(()=>!O.isEmpty(r.modelValue)&&m()),U({menuList:N,menus:p,checkedNodes:v,handleKeyDown:I,handleCheckChange:$,getFlattedNodes:L,getCheckedNodes:P,clearCheckedNodes:Y,calculateCheckedValue:T,scrollToExpandingNode:z}),(e,n)=>(t.openBlock(),t.createElementBlock("div",{class:t.normalizeClass([t.unref(u).b("panel"),t.unref(u).is("bordered",e.border)]),onKeydown:I},[(t.openBlock(!0),t.createElementBlock(t.Fragment,null,t.renderList(p.value,(a,s)=>(t.openBlock(),t.createBlock(Z.default,{key:s,ref_for:!0,ref:o=>N.value[s]=o,index:s,nodes:[...a]},{empty:t.withCtx(()=>[t.renderSlot(e.$slots,"empty")]),_:2},1032,["index","nodes"]))),128))],34))}});exports.default=ae;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const lodashEs = require("lodash-es");
+const utils = require("@vft/utils");
+const menu_vue_vue_type_script_setup_true_lang = require("./menu.vue2.cjs");
+const store = require("./store.cjs");
+const node = require("./node.cjs");
+const config = require("./config.cjs");
+const utils$1 = require("./utils.cjs");
+const types = require("./types.cjs");
+const helper = require("../../utils/helper.cjs");
+const scroll = require("../../utils/dom/scroll.cjs");
+const aria$1 = require("../../utils/dom/aria.cjs");
+const index = require("../../hooks/use-namespace/index.cjs");
+const event = require("../../constants/event.cjs");
+const aria = require("../../constants/aria.cjs");
+const __default__ = vue.defineComponent({
+  name: "VftCascaderPanel",
+  inheritAttrs: false
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: config.cascaderPanelProps,
+  emits: config.cascaderPanelEmits,
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    let manualChecked = false;
+    const ns = index.useNamespace("cascader");
+    const config$1 = config.useCascaderConfig(props);
+    const slots = vue.useSlots();
+    let store$1;
+    const initialLoaded = vue.ref(true);
+    const menuList = vue.ref([]);
+    const checkedValue = vue.ref();
+    const menus = vue.ref([]);
+    const expandingNode = vue.ref();
+    const checkedNodes = vue.ref([]);
+    const isHoverMenu = vue.computed(() => config$1.value.expandTrigger === "hover");
+    const renderLabelFn = vue.computed(() => props.renderLabel || slots.default);
+    const initStore = () => {
+      const { options } = props;
+      const cfg = config$1.value;
+      manualChecked = false;
+      store$1 = new store.default(options, cfg);
+      menus.value = [store$1.getNodes()];
+      if (cfg.lazy && utils.isEmpty(props.options)) {
+        initialLoaded.value = false;
+        lazyLoad(void 0, (list) => {
+          if (list) {
+            store$1 = new store.default(list, cfg);
+            menus.value = [store$1.getNodes()];
+          }
+          initialLoaded.value = true;
+          syncCheckedValue(false, true);
+        });
+      } else {
+        syncCheckedValue(false, true);
+      }
+    };
+    const lazyLoad = (node$1, cb) => {
+      const cfg = config$1.value;
+      node$1 = node$1 || new node.default({}, cfg, void 0, true);
+      node$1.loading = true;
+      const resolve = (dataList) => {
+        const _node = node$1;
+        const parent = _node.root ? null : _node;
+        dataList && store$1?.appendNodes(dataList, parent);
+        _node.loading = false;
+        _node.loaded = true;
+        _node.childrenData = _node.childrenData || [];
+        dataList && cb?.(dataList);
+      };
+      cfg.lazyLoad(node$1, resolve);
+    };
+    const expandNode = (node2, silent) => {
+      const { level } = node2;
+      const newMenus = menus.value.slice(0, level);
+      let newExpandingNode;
+      if (node2.isLeaf) {
+        newExpandingNode = node2.pathNodes[level - 2];
+      } else {
+        newExpandingNode = node2;
+        newMenus.push(node2.children);
+      }
+      if (expandingNode.value?.uid !== newExpandingNode?.uid) {
+        expandingNode.value = node2;
+        menus.value = newMenus;
+        !silent && emit("expand-change", node2?.pathValues || []);
+      }
+    };
+    const handleCheckChange = (node2, checked, emitClose = true) => {
+      const { checkStrictly, multiple } = config$1.value;
+      const oldNode = checkedNodes.value[0];
+      manualChecked = true;
+      !multiple && oldNode?.doCheck(false);
+      node2.doCheck(checked);
+      calculateCheckedValue();
+      emitClose && !multiple && !checkStrictly && emit("close");
+      !emitClose && !multiple && !checkStrictly && expandParentNode(node2);
+    };
+    const expandParentNode = (node2) => {
+      if (!node2) return;
+      node2 = node2.parent;
+      expandParentNode(node2);
+      node2 && expandNode(node2);
+    };
+    const getFlattedNodes = (leafOnly) => store$1?.getFlattedNodes(leafOnly);
+    const getCheckedNodes = (leafOnly) => {
+      return getFlattedNodes(leafOnly)?.filter(({ checked }) => checked !== false);
+    };
+    const clearCheckedNodes = () => {
+      checkedNodes.value.forEach((node2) => node2.doCheck(false));
+      calculateCheckedValue();
+      menus.value = menus.value.slice(0, 1);
+      expandingNode.value = void 0;
+      emit("expand-change", []);
+    };
+    const calculateCheckedValue = () => {
+      const { checkStrictly, multiple } = config$1.value;
+      const oldNodes = checkedNodes.value;
+      const newNodes = getCheckedNodes(!checkStrictly);
+      const nodes = utils$1.sortByOriginalOrder(oldNodes, newNodes);
+      const values = nodes.map((node2) => node2.valueByOption);
+      checkedNodes.value = nodes;
+      checkedValue.value = multiple ? values : values[0];
+    };
+    const syncCheckedValue = (loaded = false, forced = false) => {
+      const { modelValue } = props;
+      const { lazy, multiple, checkStrictly } = config$1.value;
+      const leafOnly = !checkStrictly;
+      if (!initialLoaded.value || manualChecked || !forced && lodashEs.isEqual(modelValue, checkedValue.value))
+        return;
+      if (lazy && !loaded) {
+        const values = helper.unique(
+          lodashEs.flattenDeep(helper.castArray(modelValue))
+        );
+        const nodes = values.map((val) => store$1?.getNodeByValue(val)).filter((node2) => !!node2 && !node2.loaded && !node2.loading);
+        if (nodes.length) {
+          nodes.forEach((node2) => {
+            lazyLoad(node2, () => syncCheckedValue(false, forced));
+          });
+        } else {
+          syncCheckedValue(true, forced);
+        }
+      } else {
+        const values = multiple ? helper.castArray(modelValue) : [modelValue];
+        const nodes = helper.unique(
+          values.map(
+            (val) => store$1?.getNodeByValue(val, leafOnly)
+          )
+        );
+        syncMenuState(nodes, forced);
+        checkedValue.value = lodashEs.cloneDeep(modelValue ?? void 0);
+      }
+    };
+    const syncMenuState = (newCheckedNodes, reserveExpandingState = true) => {
+      const { checkStrictly } = config$1.value;
+      const oldNodes = checkedNodes.value;
+      const newNodes = newCheckedNodes.filter(
+        (node2) => !!node2 && (checkStrictly || node2.isLeaf)
+      );
+      const oldExpandingNode = store$1?.getSameNode(expandingNode.value);
+      const newExpandingNode = reserveExpandingState && oldExpandingNode || newNodes[0];
+      if (newExpandingNode) {
+        newExpandingNode.pathNodes.forEach((node2) => expandNode(node2, true));
+      } else {
+        expandingNode.value = void 0;
+      }
+      oldNodes.forEach((node2) => node2.doCheck(false));
+      vue.reactive(newNodes).forEach((node2) => node2.doCheck(true));
+      checkedNodes.value = newNodes;
+      vue.nextTick(scrollToExpandingNode);
+    };
+    const scrollToExpandingNode = () => {
+      if (!utils.isClient) return;
+      menuList.value.forEach((menu) => {
+        const menuElement = menu?.$el;
+        if (menuElement) {
+          const container = menuElement.querySelector(
+            `.${ns.namespace.value}-scrollbar__wrap`
+          );
+          const activeNode = menuElement.querySelector(
+            `.${ns.b("node")}.${ns.is("active")}:last-child`
+          ) || menuElement.querySelector(`.${ns.b("node")}.in-active-path`);
+          scroll.scrollIntoView(container, activeNode);
+        }
+      });
+    };
+    const handleKeyDown = (e) => {
+      const target = e.target;
+      const { code } = e;
+      switch (code) {
+        case aria.EVENT_CODE.up:
+        case aria.EVENT_CODE.down: {
+          e.preventDefault();
+          const distance = code === aria.EVENT_CODE.up ? -1 : 1;
+          aria$1.focusNode(
+            aria$1.getSibling(
+              target,
+              distance,
+              `.${ns.b("node")}[tabindex="-1"]`
+            )
+          );
+          break;
+        }
+        case aria.EVENT_CODE.left: {
+          e.preventDefault();
+          const preMenu = menuList.value[utils$1.getMenuIndex(target) - 1];
+          const expandedNode = preMenu?.$el.querySelector(
+            `.${ns.b("node")}[aria-expanded="true"]`
+          );
+          aria$1.focusNode(expandedNode);
+          break;
+        }
+        case aria.EVENT_CODE.right: {
+          e.preventDefault();
+          const nextMenu = menuList.value[utils$1.getMenuIndex(target) + 1];
+          const firstNode = nextMenu?.$el.querySelector(
+            `.${ns.b("node")}[tabindex="-1"]`
+          );
+          aria$1.focusNode(firstNode);
+          break;
+        }
+        case aria.EVENT_CODE.enter:
+        case aria.EVENT_CODE.numpadEnter:
+          utils$1.checkNode(target);
+          break;
+      }
+    };
+    vue.provide(
+      types.CASCADER_PANEL_INJECTION_KEY,
+      vue.reactive({
+        config: config$1,
+        expandingNode,
+        checkedNodes,
+        isHoverMenu,
+        initialLoaded,
+        renderLabelFn,
+        lazyLoad,
+        expandNode,
+        handleCheckChange
+      })
+    );
+    vue.watch(
+      config$1,
+      (newVal, oldVal) => {
+        if (lodashEs.isEqual(newVal, oldVal)) return;
+        initStore();
+      },
+      {
+        immediate: true
+      }
+    );
+    vue.watch(() => props.options, initStore, {
+      deep: true
+    });
+    vue.watch(
+      () => props.modelValue,
+      () => {
+        manualChecked = false;
+        syncCheckedValue();
+      },
+      {
+        deep: true
+      }
+    );
+    vue.watch(
+      () => checkedValue.value,
+      (val) => {
+        if (!lodashEs.isEqual(val, props.modelValue)) {
+          emit(event.UPDATE_MODEL_EVENT, val);
+          emit(event.CHANGE_EVENT, val);
+        }
+      }
+    );
+    vue.onBeforeUpdate(() => menuList.value = []);
+    vue.onMounted(() => !utils.isEmpty(props.modelValue) && syncCheckedValue());
+    __expose({
+      menuList,
+      menus,
+      checkedNodes,
+      handleKeyDown,
+      handleCheckChange,
+      getFlattedNodes,
+      /**
+       * @description get an array of currently selected node,(leafOnly) whether only return the leaf checked nodes, default is `false`
+       */
+      getCheckedNodes,
+      /**
+       * @description clear checked nodes
+       */
+      clearCheckedNodes,
+      calculateCheckedValue,
+      scrollToExpandingNode
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass([vue.unref(ns).b("panel"), vue.unref(ns).is("bordered", _ctx.border)]),
+        onKeydown: handleKeyDown
+      }, [
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(menus.value, (menu, index2) => {
+          return vue.openBlock(), vue.createBlock(menu_vue_vue_type_script_setup_true_lang.default, {
+            key: index2,
+            ref_for: true,
+            ref: (item) => menuList.value[index2] = item,
+            index: index2,
+            nodes: [...menu]
+          }, {
+            empty: vue.withCtx(() => [
+              vue.renderSlot(_ctx.$slots, "empty")
+            ]),
+            _: 2
+          }, 1032, ["index", "nodes"]);
+        }), 128))
+      ], 34);
+    };
+  }
+});
+exports.default = _sfc_main;

package/lib/components/cascader-panel/menu.vue.cjs

@@ -1 +1,4 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./menu.vue2.cjs");exports.default=e.default;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const menu_vue_vue_type_script_setup_true_lang = require("./menu.vue2.cjs");
+exports.default = menu_vue_vue_type_script_setup_true_lang.default;

package/lib/components/cascader-panel/menu.vue2.cjs

@@ -1,4 +1,117 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),B=require("../scrollbar/index.cjs");require("@vueuse/core");require("@vft/utils");require("../config-provider/hooks/use-global-config.cjs");require("lodash-es");const M=require("../../hooks/use-id/index.cjs"),T=require("../../hooks/use-namespace/index.cjs");require("../../hooks/use-model-toggle/index.cjs");require("@popperjs/core");require("../../hooks/use-z-index/index.cjs");const E=require("../icon/index.cjs"),N=require("./node.vue2.cjs"),V=require("./types.cjs"),w=e.defineComponent({name:"VftCascaderMenu"}),H=e.defineComponent({...w,props:{nodes:{type:Array,required:!0},index:{type:Number,required:!0}},setup(c){const d=c,q=e.getCurrentInstance(),t=T.useNamespace("cascader-menu"),C=M.useId();let o,s;const u=e.inject(V.CASCADER_PANEL_INJECTION_KEY),l=e.ref(),f=e.computed(()=>!d.nodes.length),_=e.computed(()=>!u.initialLoaded),p=e.computed(()=>`${C.value}-${d.index}`),$=r=>{o=r.target},h=r=>{if(!(!u.isHoverMenu||!o||!l.value))if(o.contains(r.target)){m();const n=q.vnode.el,{left:a}=n.getBoundingClientRect(),{offsetWidth:y,offsetHeight:x}=n,g=r.clientX-a,i=o.offsetTop,k=i+o.offsetHeight;l.value.innerHTML=`
-          <path style="pointer-events: auto;" fill="transparent" d="M${g} ${i} L${y} 0 V${i} Z" />
-          <path style="pointer-events: auto;" fill="transparent" d="M${g} ${k} L${y} ${x} V${k} Z" />
-        `}else s||(s=window.setTimeout(v,u.config.hoverThreshold))},m=()=>{s&&(clearTimeout(s),s=void 0)},v=()=>{l.value&&(l.value.innerHTML="",m())};return(r,n)=>(e.openBlock(),e.createBlock(e.unref(B.VftScrollbar),{key:p.value,tag:"ul",role:"menu",class:e.normalizeClass(e.unref(t).b()),"wrap-class":e.unref(t).e("wrap"),"view-class":[e.unref(t).e("list"),e.unref(t).is("empty",f.value)],onMousemove:h,onMouseleave:v},{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(c.nodes,a=>(e.openBlock(),e.createBlock(N.default,{key:a.uid,node:a,"menu-id":p.value,onExpand:$},null,8,["node","menu-id"]))),128)),_.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(e.unref(t).e("empty-text"))},[e.createVNode(e.unref(E.VftIcon),{icon:"icon-loadding",size:"14",class:e.normalizeClass(e.unref(t).is("loading"))},null,8,["class"]),n[0]||(n[0]=e.createTextVNode(" 加载中 "))],2)):f.value?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(e.unref(t).e("empty-text"))},[e.renderSlot(r.$slots,"empty",{},()=>[n[1]||(n[1]=e.createTextVNode("暂无数据"))])],2)):e.unref(u)?.isHoverMenu?(e.openBlock(),e.createElementBlock("svg",{key:2,ref_key:"hoverZone",ref:l,class:e.normalizeClass(e.unref(t).e("hover-zone"))},null,2)):e.createCommentVNode("",!0)]),_:3},8,["class","wrap-class","view-class"]))}});exports.default=H;
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const index$2 = require("../scrollbar/index.cjs");
+const index$3 = require("../icon/index.cjs");
+const node_vue_vue_type_script_setup_true_lang = require("./node.vue2.cjs");
+const types = require("./types.cjs");
+const index = require("../../hooks/use-namespace/index.cjs");
+const index$1 = require("../../hooks/use-id/index.cjs");
+const __default__ = vue.defineComponent({
+  name: "VftCascaderMenu"
+});
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: {
+    nodes: {
+      type: Array,
+      required: true
+    },
+    index: {
+      type: Number,
+      required: true
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const instance = vue.getCurrentInstance();
+    const ns = index.useNamespace("cascader-menu");
+    const id = index$1.useId();
+    let activeNode;
+    let hoverTimer;
+    const panel = vue.inject(types.CASCADER_PANEL_INJECTION_KEY);
+    const hoverZone = vue.ref();
+    const isEmpty = vue.computed(() => !props.nodes.length);
+    const isLoading = vue.computed(() => !panel.initialLoaded);
+    const menuId = vue.computed(() => `${id.value}-${props.index}`);
+    const handleExpand = (e) => {
+      activeNode = e.target;
+    };
+    const handleMouseMove = (e) => {
+      if (!panel.isHoverMenu || !activeNode || !hoverZone.value) return;
+      if (activeNode.contains(e.target)) {
+        clearHoverTimer();
+        const el = instance.vnode.el;
+        const { left } = el.getBoundingClientRect();
+        const { offsetWidth, offsetHeight } = el;
+        const startX = e.clientX - left;
+        const top = activeNode.offsetTop;
+        const bottom = top + activeNode.offsetHeight;
+        hoverZone.value.innerHTML = `
+          <path style="pointer-events: auto;" fill="transparent" d="M${startX} ${top} L${offsetWidth} 0 V${top} Z" />
+          <path style="pointer-events: auto;" fill="transparent" d="M${startX} ${bottom} L${offsetWidth} ${offsetHeight} V${bottom} Z" />
+        `;
+      } else if (!hoverTimer) {
+        hoverTimer = window.setTimeout(clearHoverZone, panel.config.hoverThreshold);
+      }
+    };
+    const clearHoverTimer = () => {
+      if (!hoverTimer) return;
+      clearTimeout(hoverTimer);
+      hoverTimer = void 0;
+    };
+    const clearHoverZone = () => {
+      if (!hoverZone.value) return;
+      hoverZone.value.innerHTML = "";
+      clearHoverTimer();
+    };
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.unref(index$2.VftScrollbar), {
+        key: menuId.value,
+        tag: "ul",
+        role: "menu",
+        class: vue.normalizeClass(vue.unref(ns).b()),
+        "wrap-class": vue.unref(ns).e("wrap"),
+        "view-class": [vue.unref(ns).e("list"), vue.unref(ns).is("empty", isEmpty.value)],
+        onMousemove: handleMouseMove,
+        onMouseleave: clearHoverZone
+      }, {
+        default: vue.withCtx(() => [
+          (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.nodes, (node) => {
+            return vue.openBlock(), vue.createBlock(node_vue_vue_type_script_setup_true_lang.default, {
+              key: node.uid,
+              node,
+              "menu-id": menuId.value,
+              onExpand: handleExpand
+            }, null, 8, ["node", "menu-id"]);
+          }), 128)),
+          isLoading.value ? (vue.openBlock(), vue.createElementBlock("div", {
+            key: 0,
+            class: vue.normalizeClass(vue.unref(ns).e("empty-text"))
+          }, [
+            vue.createVNode(vue.unref(index$3.VftIcon), {
+              icon: "icon-loadding",
+              size: "14",
+              class: vue.normalizeClass(vue.unref(ns).is("loading"))
+            }, null, 8, ["class"]),
+            _cache[0] || (_cache[0] = vue.createTextVNode(" 加载中 "))
+          ], 2)) : isEmpty.value ? (vue.openBlock(), vue.createElementBlock("div", {
+            key: 1,
+            class: vue.normalizeClass(vue.unref(ns).e("empty-text"))
+          }, [
+            vue.renderSlot(_ctx.$slots, "empty", {}, () => [
+              _cache[1] || (_cache[1] = vue.createTextVNode("暂无数据"))
+            ])
+          ], 2)) : vue.unref(panel)?.isHoverMenu ? (vue.openBlock(), vue.createElementBlock("svg", {
+            key: 2,
+            ref_key: "hoverZone",
+            ref: hoverZone,
+            class: vue.normalizeClass(vue.unref(ns).e("hover-zone"))
+          }, null, 2)) : vue.createCommentVNode("", true)
+        ]),
+        _: 3
+      }, 8, ["class", "wrap-class", "view-class"]);
+    };
+  }
+});
+exports.default = _sfc_main;