@deot/vc-components 1.0.39 → 1.0.41

package/dist/index.cjs

@@ -2386,7 +2386,7 @@ const defaults = {
   el: "body",
   alive: false,
   multiple: false,
-  aliveRegExp: { className: /(vc-hack-alive|vc-hack-cp)/ },
+  aliveRegExp: { className: /(vc-portal-alive)/ },
   aliveVisibleKey: "isVisible",
   aliveUpdateKey: "update",
   leaveDelay: 300,
@@ -2613,7 +2613,8 @@ class Portal {
       leaf = Portal.leafs.get(name);
       leaf.target = target;
       leaf.propsData.value = propsData$;
-      leaf.wrapper?.[aliveUpdateKey]?.(options);
+      const next = leaf.wrapper?.[aliveUpdateKey];
+      next && vue.nextTick(() => next(options));
     } else {
       const wrapper = this.wrapper;
       const app = vue.createApp({
@@ -2628,7 +2629,7 @@ class Portal {
                 if (container && e.target && !container.contains(e.target) && !path?.some((item) => vcShared.Utils.eleInRegExp(item, aliveRegExp))) {
                   /* istanbul ignore else -- @preserve */
                   if (leaf.wrapper && leaf.wrapper?.[aliveVisibleKey]) {
-                    leaf.wrapper[aliveVisibleKey] = false;
+                    typeof leaf.wrapper[aliveVisibleKey] === "function" ? leaf.wrapper[aliveVisibleKey](false) : leaf.wrapper[aliveVisibleKey] = false;
                   }
                   leaveDelay ? setTimeout($onDestroyed, leaveDelay) : $onDestroyed();
                 }
@@ -3284,6 +3285,8 @@ const popoverKeys$1 = [
 const props$19 = {
   ...lodashEs.pick(props$1c, popoverKeys$1),
   ...lodashEs.pick(props$1g, inputKeys$2),
+  renderOption: [Function],
+  renderOptionGroup: [Function],
   data: {
     type: Array,
     default: () => []
@@ -4711,7 +4714,7 @@ const props$$ = {
 
 /** @jsxImportSource vue */
 
-function _isSlot$3(s) {
+function _isSlot$2(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
 }
 const COMPONENT_NAME$1w = 'vc-expand';
@@ -4735,7 +4738,7 @@ const Expand$1 = /* @__PURE__ */ vue.defineComponent({
           enter: 200,
           leave: 200
         }
-      }, _isSlot$3(_slot = vue.withDirectives(vue.createVNode(Content, null, {
+      }, _isSlot$2(_slot = vue.withDirectives(vue.createVNode(Content, null, {
         default: () => [(props.alive || !props.alive && isActive.value) && slots.default?.()]
       }), [[vue.vShow, isActive.value]])) ? _slot : {
         default: () => [_slot]
@@ -4885,7 +4888,7 @@ const formatter = (format, arr) => {
 
 /** @jsxImportSource vue */
 
-function _isSlot$2(s) {
+function _isSlot$1(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
 }
 const COMPONENT_NAME$1t = 'vc-countdown';
@@ -5020,7 +5023,7 @@ const Countdown = /* @__PURE__ */ vue.defineComponent({
         return (// @ts-ignore
           vue.createVNode(Content, {
             "class": "vc-countdown"
-          }, _isSlot$2(_slot = slots.default(binds.value)) ? _slot : {
+          }, _isSlot$1(_slot = slots.default(binds.value)) ? _slot : {
             default: () => [_slot]
           })
         );
@@ -12336,7 +12339,9 @@ const props$u = {
   filterable: {
     type: Boolean,
     default: true
-  }
+  },
+  render: [Function],
+  row: Object
 };
 
 /** @jsxImportSource vue */
@@ -12353,7 +12358,7 @@ const Option = /* @__PURE__ */ vue.defineComponent({
       const v = String(props.label || props.value);
       return v.trim();
     });
-    const isSelect = vue.computed(() => {
+    const isChecked = vue.computed(() => {
       const {
         current
       } = owner.exposed;
@@ -12370,15 +12375,24 @@ const Option = /* @__PURE__ */ vue.defineComponent({
       const regex = owner.exposed.searchRegex.value;
       return regex.test(formatterLabel.value) || !props.filterable;
     });
-    const handleSelect = e => {
-      e.stopPropagation();
+    const customOptions = vue.computed(() => {
+      return {
+        store: {
+          last: isLast.value,
+          checked: isChecked.value,
+          click: handleClick
+        },
+        row: props.row
+      };
+    });
+    const handleClick = () => {
       // 禁止操作
       if (props.disabled) return;
       // 已选中，弹层关闭
-      if (!owner.exposed.multiple.value && isSelect.value) {
+      if (!owner.exposed.multiple.value && isChecked.value) {
         owner.exposed.close();
         return;
-      } else if (isSelect.value) {
+      } else if (isChecked.value) {
         owner.exposed.remove(props.value, formatterLabel.value);
         return;
       }
@@ -12389,15 +12403,17 @@ const Option = /* @__PURE__ */ vue.defineComponent({
     };
     return () => {
       if (!isActive.value) return;
-      return vue.createVNode("div", {
+      return typeof props.render === 'function' ? vue.createVNode(Customer, vue.mergeProps({
+        "render": props.render
+      }, customOptions.value), null) : slots.default ? slots.default(customOptions.value) : vue.createVNode("div", {
         "disabled": props.disabled && 'disabled',
         "class": [{
-          'is-select': isSelect.value,
+          'is-select': isChecked.value,
           'is-last': isLast.value
         }, 'vc-select-option'],
-        "onClick": handleSelect,
+        "onClick": vue.withModifiers(handleClick, ['stop']),
         "onMousedown": handlePrevent
-      }, [slots.default ? slots.default() : formatterLabel.value, isSelect.value && vue.createVNode(Icon, {
+      }, [formatterLabel.value, isChecked.value && vue.createVNode(Icon, {
         "type": "correct"
       }, null)]);
     };
@@ -12411,7 +12427,9 @@ const props$t = {
   },
   label: {
     type: [String, Number]
-  }
+  },
+  row: Object,
+  render: [Function]
 };
 
 /** @jsxImportSource vue */
@@ -12427,10 +12445,19 @@ const OptionGroup = /* @__PURE__ */ vue.defineComponent({
       const v = String(props.label || props.value);
       return v.trim();
     });
+    const customOptions = vue.computed(() => {
+      return {
+        row: props.row
+      };
+    });
     return () => {
       return vue.createVNode("div", {
         "class": "vc-select-option-group"
-      }, [vue.createVNode("div", {
+      }, [typeof props.render === 'function' ? vue.createVNode(Customer, vue.mergeProps({
+        "render": props.render
+      }, customOptions.value), null) : slots.title ? slots.title({
+        row: props.row
+      }) : vue.createVNode("div", {
         "class": "vc-select-option-group__title"
       }, [formatterLabel.value]), vue.createVNode("div", null, [slots?.default?.()])]);
     };
@@ -12439,9 +12466,6 @@ const OptionGroup = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-function _isSlot$1(s) {
-  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
-}
 const COMPONENT_NAME$H = 'vc-select';
 const Select = /* @__PURE__ */ vue.defineComponent({
   name: COMPONENT_NAME$H,
@@ -12667,29 +12691,41 @@ const Select = /* @__PURE__ */ vue.defineComponent({
             "max-height": "200px"
           }, {
             default: () => [props.data ? vue.createVNode("div", null, [props.data.map(item => {
-              let _slot;
-              return Array.isArray(item.children) ? vue.createVNode(OptionGroup, {
+              return Array.isArray(item.children) && item.children.length ? vue.createVNode(OptionGroup, {
+                "row": item,
                 "value": item.value,
                 "label": item.label,
-                "key": item.value
-              }, _isSlot$1(_slot = item.children.map($item => {
-                return vue.createVNode(Option, {
-                  "key": $item.value,
-                  "value": $item.value,
-                  "label": $item.label,
-                  "disabled": $item.disabled,
-                  "filterable": $item.filterable
-                }, null);
-              })) ? _slot : {
-                default: () => [_slot]
+                "key": item.value,
+                "render": props.renderOptionGroup
+              }, {
+                title: slots?.optionGroup,
+                default: () => {
+                  return item.children.map($item => {
+                    return vue.createVNode(Option, {
+                      "key": $item.value,
+                      "row": $item,
+                      "value": $item.value,
+                      "label": $item.label,
+                      "disabled": $item.disabled,
+                      "filterable": $item.filterable,
+                      "render": props.renderOption
+                    }, {
+                      default: slots?.option
+                    });
+                  });
+                }
               }) : vue.createVNode(Option, {
                 "key": item.value,
+                "row": item,
                 "value": item.value,
                 "label": item.label,
                 "disabled": item.disabled,
-                "filterable": item.filterable
-              }, null);
-            })]) : slots.default?.()]
+                "filterable": item.filterable,
+                "render": props.renderOption
+              }, {
+                default: slots?.option
+              });
+            })]) : slots?.default?.()]
           })]);
         }
       });
@@ -20340,116 +20376,36 @@ const useCollectNode = () => {
   };
 };
 
-const selectKeys = [
-  "separator",
-  "numerable",
-  "nullValue"
-];
 const props$4 = {
-  ...lodashEs.pick(props$19, selectKeys),
-  // 暂不支持，仅作为默认值
-  max: {
-    type: Number,
-    default: Infinity,
-    validator: (v) => v >= 1
-  },
-  // 确保所有value是唯一的; 否则会出现问题
-  data: {
-    type: Array,
-    default: () => []
-  },
-  emptyText: {
-    type: String,
-    default: "暂无数据"
-  },
-  renderAfterExpand: {
-    type: Boolean,
-    default: true
-  },
-  checkStrictly: {
-    type: Boolean,
-    default: false
-  },
-  defaultExpandAll: Boolean,
-  expandOnClickNode: {
-    type: Boolean,
-    default: true
-  },
-  checkOnClickNode: Boolean,
-  checkDescendants: {
-    type: Boolean,
-    default: false
+  node: {
+    type: Object,
+    default: () => ({})
   },
-  autoExpandParent: {
+  renderNodeLabel: Function,
+  renderNodeAfterExpand: {
     type: Boolean,
     default: true
   },
-  // checkedValues -> modelValue
-  modelValue: [String, Number, Array],
-  // Value[]
-  expandedValues: {
-    type: Array,
-    default: () => []
-  },
-  currentNodeValue: [String, Number],
-  render: Function,
   showCheckbox: {
     type: Boolean,
     default: false
   },
-  draggable: {
-    type: Boolean,
-    default: false
-  },
-  allowDrag: Function,
-  allowDrop: Function,
-  lazy: {
-    type: Boolean,
-    default: false
-  },
-  highlightCurrent: Boolean,
-  loadData: Function,
-  filterNode: Function,
   accordion: {
     type: Boolean,
     default: false
   },
-  indent: {
-    type: Number,
-    default: 18
-  },
-  iconClass: String,
-  keyValue: {
-    type: Object,
-    default: () => KEY_VALUE
-  },
   allowDispatch: {
     type: Boolean,
     default: true
   }
 };
 
-const treeKeys$1 = [
-  "render",
-  "renderAfterExpand",
-  "showCheckbox",
-  "accordion",
-  "allowDispatch"
-];
-const props$3 = {
-  ...lodashEs.pick(props$4, treeKeys$1),
-  node: {
-    type: Object,
-    default: () => ({})
-  }
-};
-
 /** @jsxImportSource vue */
 
 const COMPONENT_NAME$5 = 'vc-tree-node';
 const TreeNodeContent = /* @__PURE__ */ vue.defineComponent({
   name: COMPONENT_NAME$5,
-  props: props$3,
+  props: props$4,
   emits: ['node-expand'],
   setup(props, {
     emit
@@ -20623,20 +20579,20 @@ const TreeNodeContent = /* @__PURE__ */ vue.defineComponent({
       }, null), node.states.loading && vue.createVNode(Spin, {
         "size": 12,
         "class": "vc-tree-node__loading-icon"
-      }, null), props.render ? vue.createVNode(Customer, {
-        "render": props.render,
+      }, null), props.renderNodeLabel ? vue.createVNode(Customer, {
+        "render": props.renderNodeLabel,
         "store": node,
         "row": node.states.data
       }, null) : vue.createVNode("span", null, [node.getter.label])]), vue.createVNode(TransitionCollapse, null, {
-        default: () => [(!props.renderAfterExpand || childNodeRendered.value) && vue.withDirectives(vue.createVNode("div", {
+        default: () => [(!props.renderNodeAfterExpand || childNodeRendered.value) && vue.withDirectives(vue.createVNode("div", {
           "aria-expanded": expanded.value,
           "class": "vc-tree-node__children",
           "role": "group"
         }, [node.childNodes.map(child => {
           return vue.createVNode(TreeNodeContent, {
             "key": getNodeKey(child),
-            "render": props.render,
-            "renderAfterExpand": props.renderAfterExpand,
+            "renderNodeLabel": props.renderNodeLabel,
+            "renderNodeAfterExpand": props.renderNodeAfterExpand,
             "showCheckbox": props.showCheckbox,
             "allowDispatch": props.allowDispatch,
             "accordion": props.accordion,
@@ -20865,12 +20821,92 @@ const useKeydown = () => {
   };
 };
 
+const selectKeys = [
+  "separator",
+  "numerable",
+  "nullValue"
+];
+const treeNodeContentKeys = [
+  "renderNodeLabel",
+  "renderNodeAfterExpand",
+  "showCheckbox",
+  "accordion",
+  "allowDispatch"
+];
+const props$3 = {
+  ...lodashEs.pick(props$19, selectKeys),
+  ...lodashEs.pick(props$4, treeNodeContentKeys),
+  // 暂不支持，仅作为默认值
+  max: {
+    type: Number,
+    default: Infinity,
+    validator: (v) => v >= 1
+  },
+  // 确保所有value是唯一的; 否则会出现问题
+  data: {
+    type: Array,
+    default: () => []
+  },
+  emptyText: {
+    type: String,
+    default: "暂无数据"
+  },
+  checkStrictly: {
+    type: Boolean,
+    default: false
+  },
+  defaultExpandAll: Boolean,
+  expandOnClickNode: {
+    type: Boolean,
+    default: true
+  },
+  checkOnClickNode: Boolean,
+  checkDescendants: {
+    type: Boolean,
+    default: false
+  },
+  autoExpandParent: {
+    type: Boolean,
+    default: true
+  },
+  // checkedValues -> modelValue
+  modelValue: [String, Number, Array],
+  // Value[]
+  expandedValues: {
+    type: Array,
+    default: () => []
+  },
+  currentNodeValue: [String, Number],
+  draggable: {
+    type: Boolean,
+    default: false
+  },
+  allowDrag: Function,
+  allowDrop: Function,
+  lazy: {
+    type: Boolean,
+    default: false
+  },
+  highlightCurrent: Boolean,
+  loadData: Function,
+  filterNode: Function,
+  indent: {
+    type: Number,
+    default: 18
+  },
+  iconClass: String,
+  keyValue: {
+    type: Object,
+    default: () => KEY_VALUE
+  }
+};
+
 /** @jsxImportSource vue */
 
 const COMPONENT_NAME$4 = 'vc-tree';
 const Tree = /* @__PURE__ */ vue.defineComponent({
   name: COMPONENT_NAME$4,
-  props: props$4,
+  props: props$3,
   emits: ['update:modelValue', 'change', 'check-change', 'current-change', 'node-click', 'node-contextmenu', 'node-collapse', 'node-expand', 'check', 'node-drag-start', 'node-drag-end', 'node-drop', 'node-drag-leave', 'node-drag-enter', 'node-drag-over'],
   setup(props, {
     expose,
@@ -21044,8 +21080,8 @@ const Tree = /* @__PURE__ */ vue.defineComponent({
       }, [root.childNodes.map(child => {
         return vue.createVNode(TreeNodeContent, {
           "key": getNodeKey(child),
-          "render": props.render,
-          "renderAfterExpand": props.renderAfterExpand,
+          "renderNodeLabel": props.renderNodeLabel,
+          "renderNodeAfterExpand": props.renderNodeAfterExpand,
           "showCheckbox": props.showCheckbox,
           "allowDispatch": props.allowDispatch,
           "accordion": props.accordion,
@@ -21067,11 +21103,12 @@ const Tree = /* @__PURE__ */ vue.defineComponent({
 const treeKeys = [
   "checkStrictly",
   "data",
-  "max"
+  "max",
+  "renderNodeLabel"
 ];
 const props$2 = {
   ...props$19,
-  ...lodashEs.pick(props$4, treeKeys)
+  ...lodashEs.pick(props$3, treeKeys)
 };
 
 /** @jsxImportSource vue */
@@ -21295,6 +21332,7 @@ const TreeSelect = /* @__PURE__ */ vue.defineComponent({
               "checkStrictly": props.checkStrictly,
               "allowDispatch": false,
               "showCheckbox": true,
+              "renderNodeLabel": props.renderNodeLabel,
               "onChange": handleChange
             }, null)]
           })]);