@deot/vc-components 1.0.25 → 1.0.27

package/dist/index.cjs

@@ -11,8 +11,8 @@ const $ = require('@deot/helper-dom');
 const vcHooks = require('@deot/vc-hooks');
 const helperWheel = require('@deot/helper-wheel');
 const helperValidator = require('@deot/helper-validator');
-const helperCache = require('@deot/helper-cache');
 const PhotoSwipeLightbox = require('photoswipe/lightbox');
+const helperCache = require('@deot/helper-cache');
 const Load = require('@deot/helper-load');
 const helperScheduler = require('@deot/helper-scheduler');
 const lodash = require('lodash');
@@ -103,9 +103,9 @@ const props$1q = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1$ = 'vc-action-sheet';
+const COMPONENT_NAME$20 = 'vc-action-sheet';
 const ActionSheet = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1$,
+  name: COMPONENT_NAME$20,
   props: props$1q,
   setup(props, {
     slots
@@ -292,9 +292,9 @@ const IconManager = new Manager();
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1_ = 'vc-icon';
+const COMPONENT_NAME$1$ = 'vc-icon';
 const Icon = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1_,
+  name: COMPONENT_NAME$1$,
   props: props$1o,
   setup(props) {
     const viewBox = vue.ref('0 0 1024 1024');
@@ -493,9 +493,9 @@ const useTransition = () => {
   };
 };
 
-const COMPONENT_NAME$1Z = "vc-transition";
+const COMPONENT_NAME$1_ = "vc-transition";
 const Transition = vue.defineComponent({
-  name: COMPONENT_NAME$1Z,
+  name: COMPONENT_NAME$1_,
   props: props$1n,
   // 当不声明emits的情况下，事件存在于attrs中
   inheritAttrs: false,
@@ -516,9 +516,9 @@ const Transition = vue.defineComponent({
   }
 });
 
-const COMPONENT_NAME$1Y = "vc-transition-collapse";
+const COMPONENT_NAME$1Z = "vc-transition-collapse";
 const TransitionCollapse = vue.defineComponent({
-  name: COMPONENT_NAME$1Y,
+  name: COMPONENT_NAME$1Z,
   props: props$1n,
   // 当不声明emits的情况下，事件存在于attrs中
   inheritAttrs: false,
@@ -637,9 +637,9 @@ const TransitionCollapse = vue.defineComponent({
   }
 });
 
-const COMPONENT_NAME$1X = "vc-transition-fade";
+const COMPONENT_NAME$1Y = "vc-transition-fade";
 const TransitionFade = vue.defineComponent({
-  name: COMPONENT_NAME$1X,
+  name: COMPONENT_NAME$1Y,
   props: {
     ...props$1n,
     // inheritAttrs必须是false
@@ -674,9 +674,9 @@ const TransitionFade = vue.defineComponent({
   }
 });
 
-const COMPONENT_NAME$1W = "vc-transition-scale";
+const COMPONENT_NAME$1X = "vc-transition-scale";
 const TransitionScale = vue.defineComponent({
-  name: COMPONENT_NAME$1W,
+  name: COMPONENT_NAME$1X,
   props: {
     ...props$1n,
     mode: {
@@ -716,9 +716,9 @@ const TransitionScale = vue.defineComponent({
   }
 });
 
-const COMPONENT_NAME$1V = "vc-transition-slide";
+const COMPONENT_NAME$1W = "vc-transition-slide";
 const TransitionSlide = vue.defineComponent({
-  name: COMPONENT_NAME$1V,
+  name: COMPONENT_NAME$1W,
   props: {
     ...props$1n,
     mode: {
@@ -758,9 +758,9 @@ const TransitionSlide = vue.defineComponent({
   }
 });
 
-const COMPONENT_NAME$1U = "vc-transition-zoom";
+const COMPONENT_NAME$1V = "vc-transition-zoom";
 const TransitionZoom = vue.defineComponent({
-  name: COMPONENT_NAME$1U,
+  name: COMPONENT_NAME$1V,
   props: {
     ...props$1n,
     mode: {
@@ -802,7 +802,7 @@ const TransitionZoom = vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1T = 'vc-alert';
+const COMPONENT_NAME$1U = 'vc-alert';
 
 // [color, borderColor, backgroundColor], -> CSS
 const THEME_MAP = {
@@ -812,7 +812,7 @@ const THEME_MAP = {
   warning: ['#ffbf00', '#ffe58f', '#fffbe6']
 };
 const Alert = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1T,
+  name: COMPONENT_NAME$1U,
   props: props$1p,
   setup(props, {
     slots,
@@ -911,9 +911,9 @@ const props$1m = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1S = 'vc-artboard';
+const COMPONENT_NAME$1T = 'vc-artboard';
 const Artboard = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1S,
+  name: COMPONENT_NAME$1T,
   props: props$1m,
   setup(props, {
     slots
@@ -952,9 +952,9 @@ const props$1l = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1R = 'vc-spin';
+const COMPONENT_NAME$1S = 'vc-spin';
 const Spin = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1R,
+  name: COMPONENT_NAME$1S,
   props: props$1l,
   setup(props, {
     slots
@@ -1005,9 +1005,9 @@ const props$1k = {
   exclude: RegExp
 };
 
-const COMPONENT_NAME$1Q = "vc-debounce";
+const COMPONENT_NAME$1R = "vc-debounce";
 const Debounce = vue.defineComponent({
-  name: COMPONENT_NAME$1Q,
+  name: COMPONENT_NAME$1R,
   props: props$1k,
   /**
    * 不声明emits使得事件被透传放入attrs中, 这样可以让所有的事件透传
@@ -1079,9 +1079,9 @@ const props$1j = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1P = 'vc-button';
+const COMPONENT_NAME$1Q = 'vc-button';
 const Button = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1P,
+  name: COMPONENT_NAME$1Q,
   emits: ['click'],
   props: props$1j,
   setup(props, {
@@ -1163,9 +1163,9 @@ const props$1i = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1O = 'vc-button-group';
+const COMPONENT_NAME$1P = 'vc-button-group';
 const ButtonGroup = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1O,
+  name: COMPONENT_NAME$1P,
   props: props$1i,
   setup(props, {
     slots
@@ -1199,9 +1199,9 @@ const props$1h = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1N = 'vc-calendar';
+const COMPONENT_NAME$1O = 'vc-calendar';
 const Calendar = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1N,
+  name: COMPONENT_NAME$1O,
   props: props$1h,
   setup(props, {
     slots
@@ -1239,9 +1239,9 @@ const props$1g = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1M = 'vc-card';
+const COMPONENT_NAME$1N = 'vc-card';
 const Card = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1M,
+  name: COMPONENT_NAME$1N,
   props: props$1g,
   setup(props, {
     slots
@@ -1277,9 +1277,9 @@ const props$1f = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1L = 'vc-carousel';
+const COMPONENT_NAME$1M = 'vc-carousel';
 const Carousel = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1L,
+  name: COMPONENT_NAME$1M,
   props: props$1f,
   setup(props, {
     slots
@@ -1303,9 +1303,9 @@ const props$1e = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1K = 'vc-cascader';
+const COMPONENT_NAME$1L = 'vc-cascader';
 const Cascader = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1K,
+  name: COMPONENT_NAME$1L,
   props: props$1e,
   setup(props, {
     slots
@@ -1374,9 +1374,9 @@ const props$1d = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1J = 'vc-chart';
+const COMPONENT_NAME$1K = 'vc-chart';
 const Chart = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1J,
+  name: COMPONENT_NAME$1K,
   props: props$1d,
   emits: [...EVENTS, 'ready'],
   setup(props, {
@@ -1608,9 +1608,9 @@ const useCheckbox = () => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1I = 'vc-checkbox';
+const COMPONENT_NAME$1J = 'vc-checkbox';
 const Checkbox = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1I,
+  name: COMPONENT_NAME$1J,
   props: props$1c,
   emits: ['update:modelValue', 'change'],
   setup(props, {
@@ -1697,9 +1697,9 @@ const useCheckboxGroup = () => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1H = 'vc-checkbox-group';
+const COMPONENT_NAME$1I = 'vc-checkbox-group';
 const CheckboxGroup = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1H,
+  name: COMPONENT_NAME$1I,
   props: props$1b,
   emits: ['update:modelValue', 'change'],
   setup(props, {
@@ -1717,9 +1717,9 @@ const CheckboxGroup = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1G = 'vcm-checkbox';
+const COMPONENT_NAME$1H = 'vcm-checkbox';
 const MCheckbox = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1G,
+  name: COMPONENT_NAME$1H,
   props: props$1c,
   emits: ['update:modelValue', 'change'],
   setup(props, {
@@ -1759,9 +1759,9 @@ const MCheckbox = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1F = 'vcm-checkbox-group';
+const COMPONENT_NAME$1G = 'vcm-checkbox-group';
 const MCheckboxGroup = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1F,
+  name: COMPONENT_NAME$1G,
   props: props$1b,
   emits: ['update:modelValue', 'change'],
   setup(props, {
@@ -1820,9 +1820,9 @@ const props$19 = {
   }
 };
 
-const COMPONENT_NAME$1E = "vc-customer";
+const COMPONENT_NAME$1F = "vc-customer";
 const Customer = vue.defineComponent({
-  name: COMPONENT_NAME$1E,
+  name: COMPONENT_NAME$1F,
   props: props$19,
   setup(props, context) {
     return () => vue.h(() => {
@@ -1833,9 +1833,9 @@ const Customer = vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1D = 'vc-message';
+const COMPONENT_NAME$1E = 'vc-message';
 const MessageView = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1D,
+  name: COMPONENT_NAME$1E,
   emits: ['before-close', 'close', 'portal-fulfilled'],
   props: props$1a,
   setup(props, {
@@ -1982,7 +1982,7 @@ class PortalLeaf {
   }
 }
 
-const COMPONENT_NAME$1C = "vc-portal";
+const COMPONENT_NAME$1D = "vc-portal";
 class Portal {
   /**
    * 清理Portals类型组件
@@ -2034,7 +2034,7 @@ class Portal {
     this.wrapper = wrapper;
     this.globalOptions = {
       ...options,
-      name: options?.name || wrapper.name || Utils__namespace.getUid(COMPONENT_NAME$1C)
+      name: options?.name || wrapper.name || Utils__namespace.getUid(COMPONENT_NAME$1D)
     };
   }
   popup(propsData, options) {
@@ -2133,7 +2133,7 @@ class Portal {
       ...rest
     } = options;
     let useAllNodes = fragment;
-    const name = multiple ? `${name$}__${Utils__namespace.getUid(COMPONENT_NAME$1C)}` : name$;
+    const name = multiple ? `${name$}__${Utils__namespace.getUid(COMPONENT_NAME$1D)}` : name$;
     const container = document.createElement(tag);
     const root = typeof el === "object" ? el : document.querySelector(el || "body");
     !alive && Portal.leafs.get(name)?.destroy();
@@ -2167,7 +2167,7 @@ class Portal {
     } else {
       const wrapper = this.wrapper;
       const app = vue.createApp({
-        name: COMPONENT_NAME$1C,
+        name: COMPONENT_NAME$1D,
         parent,
         setup() {
           if (alive) {
@@ -2279,13 +2279,13 @@ const props$18 = {
   }
 };
 
-const COMPONENT_NAME$1B = 'vc-portal-view';
+const COMPONENT_NAME$1C = 'vc-portal-view';
 
 /**
  * 写法不同，但与vue@2.x 保持一致
  */
 const PortalView = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1B,
+  name: COMPONENT_NAME$1C,
   props: props$18,
   setup(props, {
     slots
@@ -2456,9 +2456,9 @@ const useClipboard = (done) => {
   return () => vue.h(props.tag, { onClick: handleClick, class: "vc-clipboard" }, slots?.default?.());
 };
 
-const COMPONENT_NAME$1A = "vc-clipboard";
+const COMPONENT_NAME$1B = "vc-clipboard";
 const Clipboard$1 = vue.defineComponent({
-  name: COMPONENT_NAME$1A,
+  name: COMPONENT_NAME$1B,
   props: props$17,
   setup() {
     return useClipboard((content) => Message.success({ content }));
@@ -2498,9 +2498,9 @@ const MTransitionZoom = TransitionZoom;
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1z = 'vcm-toast';
+const COMPONENT_NAME$1A = 'vcm-toast';
 const MToastView = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1z,
+  name: COMPONENT_NAME$1A,
   emits: ['close', 'portal-fulfilled'],
   props: props$16,
   setup(props, {
@@ -2602,9 +2602,9 @@ const warning$2 = create$3({ mode: "warning" });
 const error$2 = create$3({ mode: "error" });
 const MToast = Object.assign(MToastView, { destroy: destroy$4, info: info$2, success: success$2, loading, warning: warning$2, error: error$2 });
 
-const COMPONENT_NAME$1y = "vcm-clipboard";
+const COMPONENT_NAME$1z = "vcm-clipboard";
 const MClipboard$1 = vue.defineComponent({
-  name: COMPONENT_NAME$1y,
+  name: COMPONENT_NAME$1z,
   props: props$17,
   setup() {
     return useClipboard((content) => MToast.info({ content }));
@@ -2636,9 +2636,9 @@ const props$15 = {
   }
 };
 
-const COMPONENT_NAME$1x = "vc-collapse";
+const COMPONENT_NAME$1y = "vc-collapse";
 const Collapse = vue.defineComponent({
-  name: COMPONENT_NAME$1x,
+  name: COMPONENT_NAME$1y,
   props: props$15,
   emits: ["update:moodelValue", "change"],
   setup(props, { slots, emit }) {
@@ -2755,9 +2755,9 @@ const props$13 = {
 function _isSlot$3(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
 }
-const COMPONENT_NAME$1w = 'vc-expand';
+const COMPONENT_NAME$1x = 'vc-expand';
 const Expand$1 = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1w,
+  name: COMPONENT_NAME$1x,
   props: props$13,
   setup(props, {
     slots
@@ -2787,9 +2787,9 @@ const Expand$1 = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1v = 'vc-collapse-item';
+const COMPONENT_NAME$1w = 'vc-collapse-item';
 const CollapseItem = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1v,
+  name: COMPONENT_NAME$1w,
   props: props$14,
   setup(props, {
     slots,
@@ -2864,9 +2864,9 @@ const props$12 = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1u = 'vc-color-picker';
+const COMPONENT_NAME$1v = 'vc-color-picker';
 const ColorPicker = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1u,
+  name: COMPONENT_NAME$1v,
   props: props$12,
   setup(props, {
     slots
@@ -2890,9 +2890,9 @@ const props$11 = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1t = 'vc-countdown';
+const COMPONENT_NAME$1u = 'vc-countdown';
 const Countdown = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1t,
+  name: COMPONENT_NAME$1u,
   props: props$11,
   setup(props, {
     slots
@@ -3342,9 +3342,9 @@ const useNativeEmitter = (input, expose) => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1s = 'vc-input';
+const COMPONENT_NAME$1t = 'vc-input';
 const Input = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1s,
+  name: COMPONENT_NAME$1t,
   inheritAttrs: false,
   props: {
     ...props$$,
@@ -3678,9 +3678,9 @@ const useInputNumber = () => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1r = 'vc-input-number';
+const COMPONENT_NAME$1s = 'vc-input-number';
 const InputNumber = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1r,
+  name: COMPONENT_NAME$1s,
   props: props$X,
   inheritAttrs: false,
   setup(props, {
@@ -3744,9 +3744,9 @@ const props$W = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1q = 'vc-input-search';
+const COMPONENT_NAME$1r = 'vc-input-search';
 const InputSearch = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1q,
+  name: COMPONENT_NAME$1r,
   props: props$W,
   inheritAttrs: false,
   setup(props, {
@@ -4037,9 +4037,9 @@ const usePos = () => {
 function _isSlot$2(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
 }
-const COMPONENT_NAME$1p = 'vc-popover-wrapper';
+const COMPONENT_NAME$1q = 'vc-popover-wrapper';
 const PopoverWrapper = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1p,
+  name: COMPONENT_NAME$1q,
   props: props$_,
   emits: ['portal-fulfilled', 'close'],
   setup(props, {
@@ -4289,9 +4289,9 @@ const PopoverPortal = new Portal(PopoverWrapper);
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1o = 'vc-popover';
+const COMPONENT_NAME$1p = 'vc-popover';
 const Popover$1 = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1o,
+  name: COMPONENT_NAME$1p,
   props: props$Z,
   emits: ['update:modelValue', 'visible-change', 'ready', 'close'],
   setup(props, {
@@ -5392,9 +5392,9 @@ const getTimeType = type => {
   }
   return view;
 };
-const COMPONENT_NAME$1n = 'vc-date-confirm';
+const COMPONENT_NAME$1o = 'vc-date-confirm';
 const Confirm = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1n,
+  name: COMPONENT_NAME$1o,
   props: {
     showTime: {
       type: Boolean,
@@ -5458,9 +5458,9 @@ const Confirm = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1m = 'vc-date-header';
+const COMPONENT_NAME$1n = 'vc-date-header';
 const DateHeader = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1m,
+  name: COMPONENT_NAME$1n,
   props: {
     panelDate: Date,
     showNext: {
@@ -5544,9 +5544,9 @@ const DateHeader = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1l = 'vc-date-table';
+const COMPONENT_NAME$1m = 'vc-date-table';
 const DateTable = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1l,
+  name: COMPONENT_NAME$1m,
   props: {
     value: Array,
     firstDayOfWeek: {
@@ -5755,9 +5755,9 @@ const DateTable = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1k = 'vc-month-table';
+const COMPONENT_NAME$1l = 'vc-month-table';
 const MonthTable = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1k,
+  name: COMPONENT_NAME$1l,
   props: {
     value: Array,
     panelDate: Date,
@@ -5889,7 +5889,7 @@ const MonthTable = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1j = 'vc-quarter-table';
+const COMPONENT_NAME$1k = 'vc-quarter-table';
 
 /**
  * 获取季度对应的月份范围
@@ -5923,7 +5923,7 @@ const getQuarterRangeByMonth = value => {
   }
 };
 const QuarterTable = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1j,
+  name: COMPONENT_NAME$1k,
   props: {
     value: Array,
     panelDate: Date,
@@ -6046,9 +6046,9 @@ const QuarterTable = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1i = 'vc-shortcuts-select';
+const COMPONENT_NAME$1j = 'vc-shortcuts-select';
 const ShortcutsSelect = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1i,
+  name: COMPONENT_NAME$1j,
   props: {
     panelDate: Date,
     config: Array,
@@ -6088,9 +6088,9 @@ const ShortcutsSelect = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1h = 'vc-time-select';
+const COMPONENT_NAME$1i = 'vc-time-select';
 const TimeSelect = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1h,
+  name: COMPONENT_NAME$1i,
   props: {
     hours: {
       type: [Number, String],
@@ -6369,9 +6369,9 @@ const TimeSelect = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1g = 'vc-year-table';
+const COMPONENT_NAME$1h = 'vc-year-table';
 const YearTable = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1g,
+  name: COMPONENT_NAME$1h,
   props: {
     value: Array,
     panelDate: Date,
@@ -6494,9 +6494,9 @@ const getDateIsInRange = (value, type, leftPanelDate, rightPanelDate) => {
   }
   return true;
 };
-const COMPONENT_NAME$1f = 'vc-date-range-panel';
+const COMPONENT_NAME$1g = 'vc-date-range-panel';
 const DateRangePanel = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1f,
+  name: COMPONENT_NAME$1g,
   props: {
     ...props$V,
     confirm: {
@@ -6875,9 +6875,9 @@ const DateRangePanel = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1e = 'vc-date-panel';
+const COMPONENT_NAME$1f = 'vc-date-panel';
 const DatePanel = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1e,
+  name: COMPONENT_NAME$1f,
   props: {
     ...props$V,
     type: String,
@@ -7085,9 +7085,9 @@ const isEqualYear$1 = value => {
   const endYear = value[1].getFullYear();
   return startYear === endYear;
 };
-const COMPONENT_NAME$1d = 'vc-monthrange-panel';
+const COMPONENT_NAME$1e = 'vc-monthrange-panel';
 const MonthRangePanel = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1d,
+  name: COMPONENT_NAME$1e,
   props: {
     ...props$V,
     confirm: {
@@ -7262,9 +7262,9 @@ const isEqualYear = value => {
   const endYear = value[1].getFullYear();
   return startYear === endYear;
 };
-const COMPONENT_NAME$1c = 'vc-quarterrange-panel';
+const COMPONENT_NAME$1d = 'vc-quarterrange-panel';
 const QuarterRangePanel = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1c,
+  name: COMPONENT_NAME$1d,
   props: {
     ...props$V,
     confirm: {
@@ -7503,9 +7503,9 @@ const getComparedDate = (leftDate, rightDate) => {
     seconds
   };
 };
-const COMPONENT_NAME$1b = 'vc-timerange-panel';
+const COMPONENT_NAME$1c = 'vc-timerange-panel';
 const TimeRangePanel = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1b,
+  name: COMPONENT_NAME$1c,
   props: props$U,
   emits: ['pick', 'clear', 'ok'],
   setup(props, {
@@ -7604,9 +7604,9 @@ const TimeRangePanel = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$1a = 'vc-time-panel';
+const COMPONENT_NAME$1b = 'vc-time-panel';
 const TimePanel = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$1a,
+  name: COMPONENT_NAME$1b,
   props: props$U,
   emits: ['pick', 'clear', 'ok'],
   setup(props, {
@@ -7661,7 +7661,7 @@ const TimePanel = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$19 = 'vc-date-picker';
+const COMPONENT_NAME$1a = 'vc-date-picker';
 const getPanel$1 = type => {
   if (['daterange', 'datetimerange'].includes(type)) {
     return DateRangePanel;
@@ -7672,7 +7672,7 @@ const getPanel$1 = type => {
   }
   return DatePanel;
 };
-const DatePicker = createPicker(COMPONENT_NAME$19, props$10, () => {
+const DatePicker = createPicker(COMPONENT_NAME$1a, props$10, () => {
   const props = vue.getCurrentInstance().props;
   const icon = vue.ref('date');
   const panel = vue.shallowRef({});
@@ -7705,9 +7705,9 @@ const props$T = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$18 = 'vc-divider';
+const COMPONENT_NAME$19 = 'vc-divider';
 const Divider = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$18,
+  name: COMPONENT_NAME$19,
   props: props$T,
   setup(props, {
     slots
@@ -7862,7 +7862,7 @@ const props$Q = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$17 = 'vc-scroller-track';
+const COMPONENT_NAME$18 = 'vc-scroller-track';
 const BAR_MAP = {
   vertical: {
     scroll: 'scrollTop',
@@ -7882,7 +7882,7 @@ const BAR_MAP = {
   }
 };
 const Track = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$17,
+  name: COMPONENT_NAME$18,
   props: props$S,
   emits: ['change'],
   inheritAttrs: false,
@@ -8072,9 +8072,9 @@ const Track = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$16 = 'vc-scroller-bar';
+const COMPONENT_NAME$17 = 'vc-scroller-bar';
 const Bar = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$16,
+  name: COMPONENT_NAME$17,
   props: props$R,
   emits: ['change'],
   setup(props, {
@@ -8289,7 +8289,7 @@ const useScroller = (expose) => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$15 = 'vc-scroller';
+const COMPONENT_NAME$16 = 'vc-scroller';
 
 /**
  * 作为备选方案,目前推荐使用ScrollerWheel
@@ -8300,7 +8300,7 @@ const COMPONENT_NAME$15 = 'vc-scroller';
  * 2. 增加了一层嵌套
  */
 const Scroller = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$15,
+  name: COMPONENT_NAME$16,
   props: props$Q,
   emits: ['scroll'],
   setup(props, {
@@ -8361,7 +8361,7 @@ const Scroller = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$14 = 'vc-scroller-wheel';
+const COMPONENT_NAME$15 = 'vc-scroller-wheel';
 
 /**
  * 为减少一层嵌套，为去除滚动bar的抖动，使用wheel模拟
@@ -8383,7 +8383,7 @@ const COMPONENT_NAME$14 = 'vc-scroller-wheel';
  * 设置scrollTop不会reflow和repaint，不需要考虑transfrom来改变content（transform也只在draw完成）
  */
 const ScrollerWheel = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$14,
+  name: COMPONENT_NAME$15,
   props: Object.assign(props$Q, {
     stopPropagation: {
       type: Boolean,
@@ -8572,9 +8572,9 @@ const props$P = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$13 = 'vc-drawer';
+const COMPONENT_NAME$14 = 'vc-drawer';
 const DrawerView = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$13,
+  name: COMPONENT_NAME$14,
   props: props$P,
   emits: ['close', 'update:modelValue', 'visible-change'],
   setup(props, {
@@ -8750,9 +8750,9 @@ const props$O = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$12 = 'vc-dropdown';
+const COMPONENT_NAME$13 = 'vc-dropdown';
 const Dropdown = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$12,
+  name: COMPONENT_NAME$13,
   props: props$O,
   setup(props, {
     slots
@@ -8776,9 +8776,9 @@ const props$N = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$11 = 'vc-editor';
+const COMPONENT_NAME$12 = 'vc-editor';
 const Editor = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$11,
+  name: COMPONENT_NAME$12,
   props: props$N,
   setup(props, {
     slots
@@ -8922,9 +8922,9 @@ const useForm = (expose, options = {}) => {
   });
 };
 
-const COMPONENT_NAME$10 = "vc-form";
+const COMPONENT_NAME$11 = "vc-form";
 const Form = vue.defineComponent({
-  name: COMPONENT_NAME$10,
+  name: COMPONENT_NAME$11,
   props: props$M,
   setup(props, { slots, expose }) {
     useForm(expose);
@@ -9249,9 +9249,9 @@ const useFormItem = (expose) => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$$ = 'vc-form-item';
+const COMPONENT_NAME$10 = 'vc-form-item';
 const FormItem = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$$,
+  name: COMPONENT_NAME$10,
   props: props$L,
   setup(props, {
     slots,
@@ -9316,9 +9316,9 @@ const props$K = {
   }
 };
 
-const COMPONENT_NAME$_ = "vcm-form";
+const COMPONENT_NAME$$ = "vcm-form";
 const MForm = vue.defineComponent({
-  name: COMPONENT_NAME$_,
+  name: COMPONENT_NAME$$,
   props: props$K,
   setup(props, { slots, expose }) {
     useForm(expose, {
@@ -9349,9 +9349,9 @@ const props$J = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$Z = 'vcm-form-item';
+const COMPONENT_NAME$_ = 'vcm-form-item';
 const MFormItem = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$Z,
+  name: COMPONENT_NAME$_,
   props: props$J,
   setup(props, {
     slots,
@@ -9405,9 +9405,9 @@ const MFormItem = /* @__PURE__ */ vue.defineComponent({
   }
 });
 
-const COMPONENT_NAME$Y = "vc-fragment";
+const COMPONENT_NAME$Z = "vc-fragment";
 const Fragment = vue.defineComponent({
-  name: COMPONENT_NAME$Y,
+  name: COMPONENT_NAME$Z,
   setup(_, { slots }) {
     return () => vue.h(vue.Fragment, slots.default?.());
   }
@@ -9424,9 +9424,9 @@ const props$I = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$X = 'vc-html-to-image';
+const COMPONENT_NAME$Y = 'vc-html-to-image';
 const HTMLToImage = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$X,
+  name: COMPONENT_NAME$Y,
   props: props$I,
   setup(props, {
     slots
@@ -9444,10 +9444,113 @@ const MHTMLToImage = HTMLToImage;
 const MIcon = Icon;
 
 const props$H = {
+  tag: {
+    type: String,
+    default: "div"
+  }
+};
+
+/** @jsxImportSource vue */
+
+const COMPONENT_NAME$X = 'vc-image-preview';
+const ImagePreview$1 = /* @__PURE__ */ vue.defineComponent({
+  name: COMPONENT_NAME$X,
+  props: props$H,
+  setup(props, {
+    slots
+  }) {
+    return () => {
+      return vue.createVNode("div", {
+        "class": "vc-image-preview"
+      }, [slots?.default?.()]);
+    };
+  }
+});
+
+const MAX_WIDTH = window.innerWidth;
+const MAX_HEIGHT = window.innerHeight;
+const getFitSize = (src) => {
+  return new Promise((resolve) => {
+    const img = new Image();
+    let width;
+    let height;
+    img.onload = () => {
+      const owidth = img.naturalWidth || img.width;
+      const oheight = img.naturalHeight || img.height;
+      if (owidth > oheight) {
+        width = Math.min(MAX_WIDTH, owidth);
+        height = width / owidth * oheight;
+        resolve({
+          width,
+          height
+        });
+      } else {
+        height = Math.min(MAX_HEIGHT, oheight);
+        width = height / oheight * owidth;
+        resolve({
+          width,
+          height
+        });
+      }
+    };
+    img.onerror = () => resolve({});
+    img.src = src;
+  });
+};
+const open$1 = async (options) => {
+  const e = VcInstance.globalEvent;
+  const data = options.data.map((i) => {
+    if (typeof i === "string") {
+      return {
+        src: i
+      };
+    }
+    return {
+      ...i,
+      src: i.source || i.src
+    };
+  });
+  for (let i = 0; i < data.length; i++) {
+    if (!data[i].width) {
+      data[i] = {
+        ...data[i],
+        ...await getFitSize(data[i].src)
+      };
+    }
+  }
+  const lightbox = new PhotoSwipeLightbox({
+    pswpModule: () => import('photoswipe'),
+    closeTitle: "关闭(Esc)",
+    zoomTitle: "缩放",
+    arrowPrevTitle: "上一张",
+    arrowNextTitle: "下一张",
+    errorMsg: "网络异常 图片加载失败",
+    indexIndicatorSep: " / ",
+    initialZoomLevel: "fit"
+  });
+  lightbox.init();
+  lightbox.loadAndOpen(
+    options.current || 0,
+    data,
+    // 下面无效，需要给官方支持
+    {
+      x: e?.clientX,
+      y: e?.clientY
+    }
+  );
+};
+
+const ImagePreview = Object.assign(ImagePreview$1, { open: open$1 });
+
+const props$G = {
   src: String,
   fit: String,
   lazy: Boolean,
-  wrapper: [Object, String]
+  wrapper: [Object, String],
+  previewable: {
+    type: Boolean,
+    default: true
+  }
 };
 
 class IMGStore {
@@ -9517,7 +9620,7 @@ const ObjectFit = {
 const Image$1 = /* @__PURE__ */ vue.defineComponent({
   name: COMPONENT_NAME$W,
   inheritAttrs: false,
-  props: props$H,
+  props: props$G,
   setup(props, {
     slots,
     emit
@@ -9666,6 +9769,14 @@ const Image$1 = /* @__PURE__ */ vue.defineComponent({
     const alignCenter = vue.computed(() => {
       return !isSupportObjectFit && props.fit !== ObjectFit.FILL;
     });
+    const handlePreview = () => {
+      if (!props.previewable) return;
+      ImagePreview.open({
+        current: 0,
+        data: [props.src],
+        onClose() {}
+      });
+    };
     vue.watch(() => props.src, v => {
       if (!v && !isLoading.value) {
         isLoading.value = true;
@@ -9686,7 +9797,9 @@ const Image$1 = /* @__PURE__ */ vue.defineComponent({
     return () => {
       return vue.createVNode("div", {
         "style": its.value.style,
-        "class": [its.value.class, 'vc-image']
+        "class": [its.value.class, {
+          'is-allow-preview': props.previewable
+        }, 'vc-image']
       }, [isLoading.value && (slots.placeholder ? slots.placeholder() : vue.createVNode("div", {
         "class": [{
           'is-auto': isAuto.value
@@ -9704,6 +9817,8 @@ const Image$1 = /* @__PURE__ */ vue.defineComponent({
         // 包含所有on*都会被绑定, 且listeners中覆盖将由listener内触发（inheritAttrs: false）
         ...its.value.attrs,
         ...its.value.listeners
+      }, {
+        "onClick": handlePreview
       }), null)]);
     };
   }
@@ -9711,7 +9826,7 @@ const Image$1 = /* @__PURE__ */ vue.defineComponent({
 
 const MImage = Image$1;
 
-const props$G = {
+const props$F = {
   tag: {
     type: String,
     default: "div"
@@ -9723,7 +9838,7 @@ const props$G = {
 const COMPONENT_NAME$V = 'vc-image-crop';
 const ImageCrop = /* @__PURE__ */ vue.defineComponent({
   name: COMPONENT_NAME$V,
-  props: props$G,
+  props: props$F,
   setup(props, {
     slots
   }) {
@@ -9737,105 +9852,6 @@ const ImageCrop = /* @__PURE__ */ vue.defineComponent({
 
 const MImageCrop = ImageCrop;
 
-const props$F = {
-  tag: {
-    type: String,
-    default: "div"
-  }
-};
-
-/** @jsxImportSource vue */
-
-const COMPONENT_NAME$U = 'vc-image-preview';
-const ImagePreview$1 = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$U,
-  props: props$F,
-  setup(props, {
-    slots
-  }) {
-    return () => {
-      return vue.createVNode("div", {
-        "class": "vc-image-preview"
-      }, [slots?.default?.()]);
-    };
-  }
-});
-
-const MAX_WIDTH = window.innerWidth;
-const MAX_HEIGHT = window.innerHeight;
-const getFitSize = (src) => {
-  return new Promise((resolve) => {
-    const img = new Image();
-    let width;
-    let height;
-    img.onload = () => {
-      const owidth = img.naturalWidth || img.width;
-      const oheight = img.naturalHeight || img.height;
-      if (owidth > oheight) {
-        width = Math.min(MAX_WIDTH, owidth);
-        height = width / owidth * oheight;
-        resolve({
-          width,
-          height
-        });
-      } else {
-        height = Math.min(MAX_HEIGHT, oheight);
-        width = height / oheight * owidth;
-        resolve({
-          width,
-          height
-        });
-      }
-    };
-    img.onerror = () => resolve({});
-    img.src = src;
-  });
-};
-const open$1 = async (options) => {
-  const e = VcInstance.globalEvent;
-  const data = options.data.map((i) => {
-    if (typeof i === "string") {
-      return {
-        src: i
-      };
-    }
-    return {
-      ...i,
-      src: i.source || i.src
-    };
-  });
-  for (let i = 0; i < data.length; i++) {
-    if (!data[i].width) {
-      data[i] = {
-        ...data[i],
-        ...await getFitSize(data[i].src)
-      };
-    }
-  }
-  const lightbox = new PhotoSwipeLightbox({
-    pswpModule: () => import('photoswipe'),
-    closeTitle: "关闭(Esc)",
-    zoomTitle: "缩放",
-    arrowPrevTitle: "上一张",
-    arrowNextTitle: "下一张",
-    errorMsg: "网络异常 图片加载失败",
-    indexIndicatorSep: " / ",
-    initialZoomLevel: "fit"
-  });
-  lightbox.init();
-  lightbox.loadAndOpen(
-    options.current || 0,
-    data,
-    // 下面无效，需要给官方支持
-    {
-      x: e?.clientX,
-      y: e?.clientY
-    }
-  );
-};
-
-const ImagePreview = Object.assign(ImagePreview$1, { open: open$1 });
-
 const MImagePreview = ImagePreview;
 
 const props$E = {
@@ -9847,9 +9863,9 @@ const props$E = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$T = 'vc-image-processing';
+const COMPONENT_NAME$U = 'vc-image-processing';
 const ImageProcessing = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$T,
+  name: COMPONENT_NAME$U,
   props: props$E,
   setup(props, {
     slots
@@ -9866,9 +9882,9 @@ const MImageProcessing = ImageProcessing;
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$S = 'vcm-input';
+const COMPONENT_NAME$T = 'vcm-input';
 const MInput = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$S,
+  name: COMPONENT_NAME$T,
   inheritAttrs: false,
   props: {
     ...props$$,
@@ -9957,9 +9973,9 @@ const MInput = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$R = 'vcm-input-number';
+const COMPONENT_NAME$S = 'vcm-input-number';
 const MInputNumber = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$R,
+  name: COMPONENT_NAME$S,
   props: props$X,
   inheritAttrs: false,
   setup(props, {
@@ -10008,9 +10024,9 @@ const MInputNumber = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$Q = 'vcm-input-search';
+const COMPONENT_NAME$R = 'vcm-input-search';
 const MInputSearch = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$Q,
+  name: COMPONENT_NAME$R,
   props: {
     ...props$W,
     cancelText: {
@@ -10087,9 +10103,9 @@ const props$D = {
   }
 };
 
-const COMPONENT_NAME$P = "vcm-list";
+const COMPONENT_NAME$Q = "vcm-list";
 const MList = vue.defineComponent({
-  name: COMPONENT_NAME$P,
+  name: COMPONENT_NAME$Q,
   props: props$D,
   setup(props, { slots }) {
     vue.provide("vc-list", { props });
@@ -10144,10 +10160,10 @@ const props$C = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$O = 'vcm-list-item';
+const COMPONENT_NAME$P = 'vcm-list-item';
 const HTTP_REGEX = /[a-zA-z]+:\/\/[^\s]*/;
 const MListItem = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$O,
+  name: COMPONENT_NAME$P,
   props: props$C,
   emits: ['click'],
   setup(props, {
@@ -10241,11 +10257,11 @@ const props$B = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$N = 'vc-marquee';
+const COMPONENT_NAME$O = 'vc-marquee';
 const ANIMATION = $.prefixStyle('animation').camel;
 const TRANSFORM_KEBAB = $.prefixStyle('transform').kebab;
 const Marquee = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$N,
+  name: COMPONENT_NAME$O,
   props: props$B,
   setup(props, {
     slots
@@ -10313,9 +10329,9 @@ const props$A = {
   }
 };
 
-const COMPONENT_NAME$M = "vc-resizer";
+const COMPONENT_NAME$N = "vc-resizer";
 const Resizer = vue.defineComponent({
-  name: COMPONENT_NAME$M,
+  name: COMPONENT_NAME$N,
   props: props$A,
   emit: ["resize", "change"],
   setup(props, { emit, slots, expose }) {
@@ -10473,10 +10489,10 @@ const props$z = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$L = 'vc-modal';
+const COMPONENT_NAME$M = 'vc-modal';
 let zIndexNumber = 1002;
 const ModalView = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$L,
+  name: COMPONENT_NAME$M,
   emits: ['update:modelValue', 'close', 'portal-fulfilled', 'visible-change', 'ok', 'cancel'],
   props: props$z,
   setup(props, {
@@ -10915,9 +10931,9 @@ const props$y = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$K = 'vc-modal';
+const COMPONENT_NAME$L = 'vc-modal';
 const MModalView = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$K,
+  name: COMPONENT_NAME$L,
   emits: ['update:modelValue', 'portal-fulfilled', 'close', 'ok', 'cancel'],
   props: props$y,
   setup(props, {
@@ -11129,9 +11145,9 @@ const props$x = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$J = 'vc-notice';
+const COMPONENT_NAME$K = 'vc-notice';
 const NoticeView = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$J,
+  name: COMPONENT_NAME$K,
   props: props$x,
   emits: ['portal-fulfilled', 'close', 'before-close'],
   setup(props, {
@@ -11304,9 +11320,9 @@ const props$w = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$I = 'vc-option';
+const COMPONENT_NAME$J = 'vc-option';
 const Option$1 = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$I,
+  name: COMPONENT_NAME$J,
   props: props$w,
   setup(props, {
     slots
@@ -11419,9 +11435,9 @@ const props$u = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$H = 'vc-tag';
+const COMPONENT_NAME$I = 'vc-tag';
 const Tag = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$H,
+  name: COMPONENT_NAME$I,
   props: props$u,
   emits: ['close', 'change'],
   setup(props, {
@@ -11490,9 +11506,9 @@ const props$t = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$G = 'vc-select-option';
+const COMPONENT_NAME$H = 'vc-select-option';
 const Option = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$G,
+  name: COMPONENT_NAME$H,
   props: props$t,
   setup(props, {
     slots
@@ -11565,9 +11581,9 @@ const props$s = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$F = 'vc-select-option-group';
+const COMPONENT_NAME$G = 'vc-select-option-group';
 const OptionGroup = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$F,
+  name: COMPONENT_NAME$G,
   props: props$s,
   setup(props, {
     slots
@@ -11665,9 +11681,9 @@ const props$r = {
 function _isSlot$1(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
 }
-const COMPONENT_NAME$E = 'vc-select';
+const COMPONENT_NAME$F = 'vc-select';
 const Select = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$E,
+  name: COMPONENT_NAME$F,
   props: props$r,
   emits: ['ready', 'close', 'visible-change', 'clear', 'change', 'update:modelValue'],
   setup(props, {
@@ -11914,9 +11930,9 @@ const Select = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$D = 'vc-pagination';
+const COMPONENT_NAME$E = 'vc-pagination';
 const Pagination = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$D,
+  name: COMPONENT_NAME$E,
   props: props$v,
   emits: ['update:current', 'change', 'page-size-change'],
   setup(props, {
@@ -12114,9 +12130,9 @@ const props$q = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$C = 'vc-picker';
+const COMPONENT_NAME$D = 'vc-picker';
 const Picker = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$C,
+  name: COMPONENT_NAME$D,
   props: props$q,
   setup(props, {
     slots
@@ -12140,9 +12156,9 @@ const props$p = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$B = 'vc-popconfirm';
+const COMPONENT_NAME$C = 'vc-popconfirm';
 const Popconfirm = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$B,
+  name: COMPONENT_NAME$C,
   props: props$p,
   setup(props, {
     slots
@@ -12168,9 +12184,9 @@ const props$o = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$A = 'vc-popup';
+const COMPONENT_NAME$B = 'vc-popup';
 const Popup = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$A,
+  name: COMPONENT_NAME$B,
   props: props$o,
   setup(props, {
     slots
@@ -12197,9 +12213,9 @@ const props$n = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$z = 'vc-print';
+const COMPONENT_NAME$A = 'vc-print';
 const Print = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$z,
+  name: COMPONENT_NAME$A,
   props: props$n,
   setup(props, {
     expose,
@@ -12301,9 +12317,9 @@ const props$m = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$y = 'vc-progress-circle';
+const COMPONENT_NAME$z = 'vc-progress-circle';
 const Circle = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$y,
+  name: COMPONENT_NAME$z,
   props: props$m,
   setup(props, {
     slots
@@ -12363,9 +12379,9 @@ const Circle = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$x = 'vc-progress-line';
+const COMPONENT_NAME$y = 'vc-progress-line';
 const Line = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$x,
+  name: COMPONENT_NAME$y,
   props: props$m,
   setup(props) {
     const colorStyle = vue.computed(() => {
@@ -12412,9 +12428,9 @@ const Line = /* @__PURE__ */ vue.defineComponent({
 function _isSlot(s) {
   return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !vue.isVNode(s);
 }
-const COMPONENT_NAME$w = 'vc-progress';
+const COMPONENT_NAME$x = 'vc-progress';
 const Progress = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$w,
+  name: COMPONENT_NAME$x,
   props: props$m,
   setup(props, {
     slots
@@ -12572,9 +12588,9 @@ const useRadio = () => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$v = 'vc-radio';
+const COMPONENT_NAME$w = 'vc-radio';
 const Radio = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$v,
+  name: COMPONENT_NAME$w,
   props: props$l,
   emits: ['update:modelValue', 'change'],
   setup(props, {
@@ -12685,9 +12701,9 @@ const useRadioGroup = () => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$u = 'vc-radio-group';
+const COMPONENT_NAME$v = 'vc-radio-group';
 const RadioGroup = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$u,
+  name: COMPONENT_NAME$v,
   props: props$k,
   emits: ['update:modelValue', 'change'],
   setup(props, {
@@ -12708,9 +12724,9 @@ const RadioGroup = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$t = 'vcm-radio';
+const COMPONENT_NAME$u = 'vcm-radio';
 const MRadio = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$t,
+  name: COMPONENT_NAME$u,
   props: props$l,
   emits: ['update:modelValue', 'change'],
   setup(props, {
@@ -12751,9 +12767,9 @@ const MRadio = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$s = 'vcm-radio-group';
+const COMPONENT_NAME$t = 'vcm-radio-group';
 const MRadioGroup = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$s,
+  name: COMPONENT_NAME$t,
   props: props$k,
   emits: ['update:modelValue', 'change'],
   setup(props, {
@@ -12782,9 +12798,9 @@ const props$j = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$r = 'vc-rate';
+const COMPONENT_NAME$s = 'vc-rate';
 const Rate = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$r,
+  name: COMPONENT_NAME$s,
   props: props$j,
   setup(props, {
     slots
@@ -12852,9 +12868,9 @@ const props$i = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$q = 'vc-recycle-list-scroll-state';
+const COMPONENT_NAME$r = 'vc-recycle-list-scroll-state';
 const ScrollState = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$q,
+  name: COMPONENT_NAME$r,
   setup(_, {
     slots
   }) {
@@ -12984,12 +13000,12 @@ const useDirectionKeys = () => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$p = 'vc-recycle-list-container';
+const COMPONENT_NAME$q = 'vc-recycle-list-container';
 
 // TODO: 抽离
 const transformKey = $__namespace.prefixStyle('transform').camel;
 const Container = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$p,
+  name: COMPONENT_NAME$q,
   props: props$h,
   emits: ['refresh'],
   setup(props, {
@@ -13087,9 +13103,9 @@ const Container = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$o = 'vc-recycle-list';
+const COMPONENT_NAME$p = 'vc-recycle-list';
 const RecycleList = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$o,
+  name: COMPONENT_NAME$p,
   props: props$i,
   emits: ['scroll', 'row-resize'],
   setup(props, {
@@ -13661,9 +13677,9 @@ const props$g = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$n = 'vc-slider';
+const COMPONENT_NAME$o = 'vc-slider';
 const Slider = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$n,
+  name: COMPONENT_NAME$o,
   props: props$g,
   setup(props, {
     slots
@@ -13687,9 +13703,9 @@ const props$f = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$m = 'vc-sort-list';
+const COMPONENT_NAME$n = 'vc-sort-list';
 const SortList = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$m,
+  name: COMPONENT_NAME$n,
   props: props$f,
   setup(props, {
     slots
@@ -13713,9 +13729,9 @@ const props$e = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$l = 'vc-steps';
+const COMPONENT_NAME$m = 'vc-steps';
 const Steps = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$l,
+  name: COMPONENT_NAME$m,
   props: props$e,
   setup(props, {
     slots
@@ -13828,9 +13844,9 @@ const useSwitch = (expose) => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$k = 'vc-switch';
+const COMPONENT_NAME$l = 'vc-switch';
 const Switch = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$k,
+  name: COMPONENT_NAME$l,
   props: props$d,
   // click -> onClick要被拦截，此处不能放置
   emits: ['update:modelValue', 'change', 'click'],
@@ -13867,9 +13883,9 @@ const Switch = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$j = 'vcm-switch';
+const COMPONENT_NAME$k = 'vcm-switch';
 const MSwitch = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$j,
+  name: COMPONENT_NAME$k,
   props: props$d,
   // click -> onClick要被拦截，此处不能放置
   emits: ['update:modelValue', 'change', 'click'],
@@ -14982,9 +14998,9 @@ const useStates = (mapper, $store) => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$i = 'vc-table-normal-list';
+const COMPONENT_NAME$j = 'vc-table-normal-list';
 const NormalList = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$i,
+  name: COMPONENT_NAME$j,
   props: {
     data: {
       type: Array,
@@ -15824,9 +15840,9 @@ const props$c = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$h = 'vc-table';
+const COMPONENT_NAME$i = 'vc-table';
 const Table = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$h,
+  name: COMPONENT_NAME$i,
   props: props$c,
   emits: ['select', 'select-all', 'selection-change', 'cell-mouse-enter', 'cell-mouse-leave', 'cell-click', 'cell-dblclick', 'row-click', 'row-contextmenu', 'row-dblclick', 'header-click', 'header-contextmenu', 'current-change', 'header-dragend ', 'expand-change', 'sort-change'],
   setup(props, {
@@ -16461,9 +16477,9 @@ const getFitIndex = (options = {}) => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$g = 'vc-text';
+const COMPONENT_NAME$h = 'vc-text';
 const Text = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$g,
+  name: COMPONENT_NAME$h,
   props: props$b,
   setup(props, {
     emit
@@ -17158,9 +17174,9 @@ const useTabs = (options = {}) => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$f = 'vc-tabs';
+const COMPONENT_NAME$g = 'vc-tabs';
 const Tabs = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$f,
+  name: COMPONENT_NAME$g,
   props: props$a,
   emits: ['update:modelValue', 'change', 'click'],
   setup(props, {
@@ -17408,9 +17424,9 @@ const useTabsPane = () => {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$e = 'vc-tabs-pane';
+const COMPONENT_NAME$f = 'vc-tabs-pane';
 const TabsPane = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$e,
+  name: COMPONENT_NAME$f,
   props: props$9,
   setup(_, {
     slots
@@ -17465,9 +17481,9 @@ const props$8 = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$d = 'vcm-tabs';
+const COMPONENT_NAME$e = 'vcm-tabs';
 const MTabs = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$d,
+  name: COMPONENT_NAME$e,
   props: props$8,
   emits: ['update:modelValue', 'change', 'click'],
   setup(props, {
@@ -17732,9 +17748,9 @@ const MTabs = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$c = 'vcm-tabs-pane';
+const COMPONENT_NAME$d = 'vcm-tabs-pane';
 const MTabsPane = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$c,
+  name: COMPONENT_NAME$d,
   props: props$9,
   setup(_, {
     slots
@@ -18035,9 +18051,9 @@ const props$7 = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$b = 'vc-textarea';
+const COMPONENT_NAME$c = 'vc-textarea';
 const Textarea = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$b,
+  name: COMPONENT_NAME$c,
   props: Object.assign(props$7, {
     indicator: {
       type: [Boolean, Object],
@@ -18093,9 +18109,9 @@ const Textarea = /* @__PURE__ */ vue.defineComponent({
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$a = 'vcm-textarea';
+const COMPONENT_NAME$b = 'vcm-textarea';
 const MTextarea = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$a,
+  name: COMPONENT_NAME$b,
   props: Object.assign(props$7, {
     align: {
       type: String,
@@ -18178,9 +18194,9 @@ const props$6 = {
   }
 };
 
-const COMPONENT_NAME$9 = "vc-theme";
+const COMPONENT_NAME$a = "vc-theme";
 const Theme = vue.defineComponent({
-  name: COMPONENT_NAME$9,
+  name: COMPONENT_NAME$a,
   props: props$6,
   setup(props, { slots }) {
     const themeId = Utils__namespace.getUid("vc-theme");
@@ -18266,9 +18282,9 @@ const Theme = vue.defineComponent({
   }
 });
 
-const COMPONENT_NAME$8 = "vc-theme-view";
+const COMPONENT_NAME$9 = "vc-theme-view";
 const ThemeView = vue.defineComponent({
-  name: COMPONENT_NAME$8,
+  name: COMPONENT_NAME$9,
   props: props$6,
   setup(props, { slots }) {
     return () => {
@@ -18284,9 +18300,9 @@ const ThemeView = vue.defineComponent({
   }
 });
 
-const COMPONENT_NAME$7 = "vc-theme-text";
+const COMPONENT_NAME$8 = "vc-theme-text";
 const ThemeText = vue.defineComponent({
-  name: COMPONENT_NAME$7,
+  name: COMPONENT_NAME$8,
   props: props$6,
   setup(props, { slots }) {
     return () => {
@@ -18302,9 +18318,9 @@ const ThemeText = vue.defineComponent({
   }
 });
 
-const COMPONENT_NAME$6 = "vc-theme-image";
+const COMPONENT_NAME$7 = "vc-theme-image";
 const ThemeImage = vue.defineComponent({
-  name: COMPONENT_NAME$6,
+  name: COMPONENT_NAME$7,
   props: props$6,
   setup(props, { slots }) {
     return () => {
@@ -18352,12 +18368,12 @@ const props$5 = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$5 = 'vc-time-picker';
+const COMPONENT_NAME$6 = 'vc-time-picker';
 const getPanel = type => {
   const isRange = type === 'timerange';
   return isRange ? TimeRangePanel : TimePanel;
 };
-const TimePicker = createPicker(COMPONENT_NAME$5, props$5, () => {
+const TimePicker = createPicker(COMPONENT_NAME$6, props$5, () => {
   const props = vue.getCurrentInstance().props;
   const icon = vue.ref('icon');
   const panel = vue.shallowRef({});
@@ -18392,9 +18408,9 @@ const props$4 = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$4 = 'vc-timeline';
+const COMPONENT_NAME$5 = 'vc-timeline';
 const Timeline = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$4,
+  name: COMPONENT_NAME$5,
   props: props$4,
   setup(props, {
     slots
@@ -18421,9 +18437,9 @@ const props$3 = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$3 = 'vc-touch';
+const COMPONENT_NAME$4 = 'vc-touch';
 const Touch = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$3,
+  name: COMPONENT_NAME$4,
   props: props$3,
   setup(props, {
     slots
@@ -18447,9 +18463,9 @@ const props$2 = {
 
 /** @jsxImportSource vue */
 
-const COMPONENT_NAME$2 = 'vc-tree';
+const COMPONENT_NAME$3 = 'vc-tree';
 const Tree = /* @__PURE__ */ vue.defineComponent({
-  name: COMPONENT_NAME$2,
+  name: COMPONENT_NAME$3,
   props: props$2,
   setup(props, {
     slots
@@ -18559,9 +18575,9 @@ const props$1 = {
   }
 };
 
-const COMPONENT_NAME$1 = "vc-upload";
+const COMPONENT_NAME$2 = "vc-upload";
 const Upload = vue.defineComponent({
-  name: COMPONENT_NAME$1,
+  name: COMPONENT_NAME$2,
   props: props$1,
   emits: [
     "message",
@@ -18947,6 +18963,104 @@ const props = {
   gallery: Boolean
 };
 
+/** @jsxImportSource vue */
+
+const COMPONENT_NAME$1 = 'vc-steps';
+const ImageItem = /* @__PURE__ */ vue.defineComponent({
+  name: COMPONENT_NAME$1,
+  props: {
+    imageClass: [String, Object, Array],
+    disabled: Boolean,
+    row: Object,
+    imagePreviewOptions: {
+      type: Object,
+      default: () => ({})
+    },
+    index: [String, Number],
+    data: {
+      type: Array,
+      default: () => []
+    },
+    keyValue: Object
+  },
+  emits: ['open', 'close', 'delete'],
+  setup(props, {
+    slots,
+    emit
+  }) {
+    const instance = vue.getCurrentInstance();
+    const current = vue.computed(() => {
+      if (props.row?.status === 0) return -1;
+      const v = props.data.filter(i => i.status !== 0);
+      return v.findIndex(i => {
+        const a = i[props.keyValue.value] || i;
+        const b = props.row?.[props.keyValue.value] || props.row;
+        return a === b;
+      });
+    });
+    // 拿到可预览的图片，供预览组件使用
+    const getPreviewData = () => {
+      return props.data.map(i => i?.[props.keyValue.value]);
+    };
+    const previewByPS = (e, index) => {
+      emit('open');
+      ImagePreview.open({
+        current: index,
+        data: getPreviewData(),
+        onClose: () => emit('close')
+      });
+    };
+    const handlePreview = e => {
+      /**
+       * 渐进增强
+       */
+      let {
+        enhancer
+      } = VcInstance.options.ImagePreview || {};
+      enhancer = props.imagePreviewOptions.enhancer || enhancer || (() => false);
+      const images = getPreviewData().map(item => ({
+        src: item
+      }));
+      enhancer(current.value, images, instance) || previewByPS(e, current.value);
+    };
+    const handleDel = () => {
+      emit('delete');
+    };
+    return () => {
+      const row = props.row;
+      return vue.createVNode("div", {
+        "class": [{
+          'is-error': row.status == 0
+        }, 'vc-upload-image-item']
+      }, [slots.default ? slots.default({
+        it: row,
+        current: current.value
+      }) : vue.createVNode(vue.Fragment, null, [!row.errorFlag && typeof row[props.keyValue.value] === 'string' ? vue.createVNode(Image$1, {
+        "src": row[props.keyValue.value],
+        "class": [props.imageClass, 'vc-upload-image-item__content'],
+        "fit": "cover",
+        "previewable": false,
+        "onClick": handlePreview
+      }, null) : vue.createVNode("div", {
+        "class": [props.imageClass, 'vc-upload-image-item__content']
+      }, [row.percent && row.percent != 100 ? vue.createVNode(Progress, {
+        "percent": row.percent,
+        "show-text": false,
+        "status": "normal",
+        "style": "width: 100%;padding: 0 5px"
+      }, null) : !row[props.keyValue.value] && row.percent === 100 && !row.errorFlag ? vue.createVNode("p", {
+        "style": "line-height: 1; padding: 5px"
+      }, [vue.createTextVNode("\u670D\u52A1\u5668\u6B63\u5728\u63A5\u6536...")]) : row.status == 0 ? vue.createVNode("div", {
+        "style": "padding: 5px"
+      }, [vue.createTextVNode("\u4E0A\u4F20\u5931\u8D25")]) : null]), (!props.disabled || row.errorFlag) && vue.createVNode(Icon, {
+        "type": "close-small",
+        "class": "vc-upload-picker__delete",
+        "onClick": handleDel
+      }, null)])]);
+    };
+  }
+});
+
 const recognizer = (url) => {
   const reg = /\.(jpe?g|png|gif|bmp|webp|image|heic|mp4|mov|avi|mpg|mpeg|rmvb)/ig;
   const result = url.match(reg);
@@ -19198,7 +19312,7 @@ const COMPONENT_NAME = 'vc-upload-picker';
 const UploadPicker = /* @__PURE__ */ vue.defineComponent({
   name: COMPONENT_NAME,
   props: props,
-  emits: ['update:modelValue', 'file-success', 'file-start', 'success', 'error', 'complete', 'change', 'remove-before'],
+  emits: ['update:modelValue', 'file-success', 'file-start', 'file-before', 'file-error', 'success', 'error', 'complete', 'change', 'remove-before'],
   setup(props, {
     slots,
     expose
@@ -19210,8 +19324,7 @@ const UploadPicker = /* @__PURE__ */ vue.defineComponent({
           case 'image':
             pre.push({
               type: cur,
-              item: 'div'
-              // item: ImageItem
+              item: ImageItem
             });
             return pre;
           case 'video':
@@ -19260,7 +19373,7 @@ const UploadPicker = /* @__PURE__ */ vue.defineComponent({
           const Item = picker.item;
           return vue.createVNode(Item, {
             "key": typeof item === 'object' ? item.uid : item,
-            "it": item,
+            "row": item,
             "disabled": props.disabled,
             "image-preview-options": props.imagePreviewOptions,
             "imageClass": props.imageClass,
@@ -19268,18 +19381,19 @@ const UploadPicker = /* @__PURE__ */ vue.defineComponent({
             "audioClass": props.audioClass,
             "fileClass": props.fileClass,
             "index": index,
-            "data": item,
+            "keyValue": props.keyValue,
+            "data": base.currentValue.value[picker.type],
             "class": "vc-upload-picker__item",
             "onDelete": () => base.handleDelete(index, picker.type)
           }, {
-            default: scopeData => {
-              return slots.default ? slots.default({
+            default: slots.default ? scopeData => {
+              return slots?.default?.({
                 it: scopeData?.it,
                 current: scopeData?.current,
                 index,
                 name: picker.type
-              }) : scopeData;
-            }
+              });
+            } : null
           });
         }), vue.withDirectives(vue.createVNode(Upload, vue.mergeProps(base.currentUploadOptions.value[picker.type], {
           "max": base.dynamicMax[picker.type],