@deot/vc-components 1.0.7 → 1.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/index.cjs +1379 -453
  2. package/dist/index.d.ts +1520 -807
  3. package/dist/index.iife.js +18609 -456
  4. package/dist/index.js +1378 -455
  5. package/dist/index.style.css +1 -1
  6. package/dist/index.umd.cjs +18609 -456
  7. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -1,17 +1,19 @@
1
1
  import { reactive, defineComponent, createVNode, ref, watch, getCurrentInstance, computed, TransitionGroup, Transition as Transition$1, h, inject, onMounted, provide, shallowRef, onUnmounted, nextTick, withDirectives, vShow, isVNode, onBeforeMount, onBeforeUnmount, createApp, Fragment as Fragment$1, Teleport, toRaw, withModifiers, createTextVNode, mergeProps, onUpdated } from 'vue';
2
2
  import { debounce, cloneDeep, throttle, pick, kebabCase } from 'lodash-es';
3
3
  import { Resize } from '@deot/helper-resize';
4
+ import { isEqualWith } from 'lodash';
4
5
  import * as Utils from '@deot/helper-utils';
5
6
  import { getPropByPath, getUid, raf, throttle as throttle$1 } from '@deot/helper-utils';
6
7
  import * as $ from '@deot/helper-dom';
7
- import { composedPath } from '@deot/helper-dom';
8
+ import { prefixStyle, composedPath, getStyle } from '@deot/helper-dom';
8
9
  import { Utils as Utils$1, IS_SERVER as IS_SERVER$1 } from '@deot/vc-shared';
9
10
  import { useScrollbar, useAttrs, getInstance } from '@deot/vc-hooks';
10
11
  import { Validator } from '@deot/helper-validator';
11
12
  import { Storage } from '@deot/helper-cache';
13
+ import * as Load from '@deot/helper-load';
14
+ import { style } from '@deot/helper-load';
12
15
  import { Interrupter } from '@deot/helper-scheduler';
13
16
  import { Wheel } from '@deot/helper-wheel';
14
- import * as Load from '@deot/helper-load';
15
17
 
16
18
  class VcError {
17
19
  message;
@@ -57,7 +59,7 @@ class Instance {
57
59
  }
58
60
  const VcInstance = new Instance();
59
61
 
60
- const props$1j = {
62
+ const props$1l = {
61
63
  tag: {
62
64
  type: String,
63
65
  default: "div"
@@ -66,10 +68,10 @@ const props$1j = {
66
68
 
67
69
  /** @jsxImportSource vue */
68
70
 
69
- const COMPONENT_NAME$1A = 'vc-action-sheet';
71
+ const COMPONENT_NAME$1H = 'vc-action-sheet';
70
72
  const ActionSheet = /* @__PURE__ */ defineComponent({
71
- name: COMPONENT_NAME$1A,
72
- props: props$1j,
73
+ name: COMPONENT_NAME$1H,
74
+ props: props$1l,
73
75
  setup(props, {
74
76
  slots
75
77
  }) {
@@ -83,7 +85,7 @@ const ActionSheet = /* @__PURE__ */ defineComponent({
83
85
 
84
86
  const MActionSheet = ActionSheet;
85
87
 
86
- const props$1i = {
88
+ const props$1k = {
87
89
  modelValue: {
88
90
  type: Boolean,
89
91
  default: true
@@ -110,7 +112,7 @@ const props$1i = {
110
112
  }
111
113
  };
112
114
 
113
- const props$1h = {
115
+ const props$1j = {
114
116
  type: String,
115
117
  inherit: {
116
118
  type: Boolean,
@@ -255,10 +257,10 @@ const IconManager = new Manager();
255
257
 
256
258
  /** @jsxImportSource vue */
257
259
 
258
- const COMPONENT_NAME$1z = 'vc-icon';
260
+ const COMPONENT_NAME$1G = 'vc-icon';
259
261
  const Icon = /* @__PURE__ */ defineComponent({
260
- name: COMPONENT_NAME$1z,
261
- props: props$1h,
262
+ name: COMPONENT_NAME$1G,
263
+ props: props$1j,
262
264
  setup(props) {
263
265
  const viewBox = ref('0 0 1024 1024');
264
266
  const path = ref([]);
@@ -291,7 +293,7 @@ const Icon = /* @__PURE__ */ defineComponent({
291
293
  }
292
294
  });
293
295
 
294
- const props$1g = {
296
+ const props$1i = {
295
297
  /**
296
298
  * 进入/离开持续时间
297
299
  * {enter: 300, leave: 300}
@@ -456,10 +458,10 @@ const useTransition = () => {
456
458
  };
457
459
  };
458
460
 
459
- const COMPONENT_NAME$1y = "vc-transition";
461
+ const COMPONENT_NAME$1F = "vc-transition";
460
462
  const Transition = defineComponent({
461
- name: COMPONENT_NAME$1y,
462
- props: props$1g,
463
+ name: COMPONENT_NAME$1F,
464
+ props: props$1i,
463
465
  // 当不声明emits的情况下，事件存在于attrs中
464
466
  inheritAttrs: false,
465
467
  setup(props, { slots, attrs }) {
@@ -479,10 +481,10 @@ const Transition = defineComponent({
479
481
  }
480
482
  });
481
483
 
482
- const COMPONENT_NAME$1x = "vc-transition-collapse";
484
+ const COMPONENT_NAME$1E = "vc-transition-collapse";
483
485
  const TransitionCollapse = defineComponent({
484
- name: COMPONENT_NAME$1x,
485
- props: props$1g,
486
+ name: COMPONENT_NAME$1E,
487
+ props: props$1i,
486
488
  // 当不声明emits的情况下，事件存在于attrs中
487
489
  inheritAttrs: false,
488
490
  setup(props, { slots, attrs: _attrs }) {
@@ -600,11 +602,11 @@ const TransitionCollapse = defineComponent({
600
602
  }
601
603
  });
602
604
 
603
- const COMPONENT_NAME$1w = "vc-transition-fade";
605
+ const COMPONENT_NAME$1D = "vc-transition-fade";
604
606
  const TransitionFade = defineComponent({
605
- name: COMPONENT_NAME$1w,
607
+ name: COMPONENT_NAME$1D,
606
608
  props: {
607
- ...props$1g,
609
+ ...props$1i,
608
610
  // inheritAttrs必须是false
609
611
  style: {
610
612
  type: Object,
@@ -637,11 +639,11 @@ const TransitionFade = defineComponent({
637
639
  }
638
640
  });
639
641
 
640
- const COMPONENT_NAME$1v = "vc-transition-scale";
642
+ const COMPONENT_NAME$1C = "vc-transition-scale";
641
643
  const TransitionScale = defineComponent({
642
- name: COMPONENT_NAME$1v,
644
+ name: COMPONENT_NAME$1C,
643
645
  props: {
644
- ...props$1g,
646
+ ...props$1i,
645
647
  mode: {
646
648
  type: String,
647
649
  default: "both",
@@ -679,11 +681,11 @@ const TransitionScale = defineComponent({
679
681
  }
680
682
  });
681
683
 
682
- const COMPONENT_NAME$1u = "vc-transition-slide";
684
+ const COMPONENT_NAME$1B = "vc-transition-slide";
683
685
  const TransitionSlide = defineComponent({
684
- name: COMPONENT_NAME$1u,
686
+ name: COMPONENT_NAME$1B,
685
687
  props: {
686
- ...props$1g,
688
+ ...props$1i,
687
689
  mode: {
688
690
  type: String,
689
691
  default: "left",
@@ -721,11 +723,11 @@ const TransitionSlide = defineComponent({
721
723
  }
722
724
  });
723
725
 
724
- const COMPONENT_NAME$1t = "vc-transition-zoom";
726
+ const COMPONENT_NAME$1A = "vc-transition-zoom";
725
727
  const TransitionZoom = defineComponent({
726
- name: COMPONENT_NAME$1t,
728
+ name: COMPONENT_NAME$1A,
727
729
  props: {
728
- ...props$1g,
730
+ ...props$1i,
729
731
  mode: {
730
732
  type: String,
731
733
  default: "x",
@@ -765,7 +767,7 @@ const TransitionZoom = defineComponent({
765
767
 
766
768
  /** @jsxImportSource vue */
767
769
 
768
- const COMPONENT_NAME$1s = 'vc-alert';
770
+ const COMPONENT_NAME$1z = 'vc-alert';
769
771
 
770
772
  // [color, borderColor, backgroundColor], -> CSS
771
773
  const THEME_MAP = {
@@ -775,8 +777,8 @@ const THEME_MAP = {
775
777
  warning: ['#ffbf00', '#ffe58f', '#fffbe6']
776
778
  };
777
779
  const Alert = /* @__PURE__ */ defineComponent({
778
- name: COMPONENT_NAME$1s,
779
- props: props$1i,
780
+ name: COMPONENT_NAME$1z,
781
+ props: props$1k,
780
782
  setup(props, {
781
783
  slots,
782
784
  emit
@@ -865,7 +867,7 @@ const Alert = /* @__PURE__ */ defineComponent({
865
867
 
866
868
  const MAlert = Alert;
867
869
 
868
- const props$1f = {
870
+ const props$1h = {
869
871
  tag: {
870
872
  type: String,
871
873
  default: "div"
@@ -874,10 +876,10 @@ const props$1f = {
874
876
 
875
877
  /** @jsxImportSource vue */
876
878
 
877
- const COMPONENT_NAME$1r = 'vc-artboard';
879
+ const COMPONENT_NAME$1y = 'vc-artboard';
878
880
  const Artboard = /* @__PURE__ */ defineComponent({
879
- name: COMPONENT_NAME$1r,
880
- props: props$1f,
881
+ name: COMPONENT_NAME$1y,
882
+ props: props$1h,
881
883
  setup(props, {
882
884
  slots
883
885
  }) {
@@ -891,7 +893,7 @@ const Artboard = /* @__PURE__ */ defineComponent({
891
893
 
892
894
  const MArtboard = Artboard;
893
895
 
894
- const props$1e = {
896
+ const props$1g = {
895
897
  size: {
896
898
  type: Number,
897
899
  default: 28
@@ -915,10 +917,10 @@ const props$1e = {
915
917
 
916
918
  /** @jsxImportSource vue */
917
919
 
918
- const COMPONENT_NAME$1q = 'vc-spin';
920
+ const COMPONENT_NAME$1x = 'vc-spin';
919
921
  const Spin = /* @__PURE__ */ defineComponent({
920
- name: COMPONENT_NAME$1q,
921
- props: props$1e,
922
+ name: COMPONENT_NAME$1x,
923
+ props: props$1g,
922
924
  setup(props, {
923
925
  slots
924
926
  }) {
@@ -952,7 +954,7 @@ const Spin = /* @__PURE__ */ defineComponent({
952
954
  }
953
955
  });
954
956
 
955
- const props$1d = {
957
+ const props$1f = {
956
958
  wait: {
957
959
  type: Number,
958
960
  default: 250
@@ -968,10 +970,10 @@ const props$1d = {
968
970
  exclude: RegExp
969
971
  };
970
972
 
971
- const COMPONENT_NAME$1p = "vc-debounce";
973
+ const COMPONENT_NAME$1w = "vc-debounce";
972
974
  const Debounce = defineComponent({
973
- name: COMPONENT_NAME$1p,
974
- props: props$1d,
975
+ name: COMPONENT_NAME$1w,
976
+ props: props$1f,
975
977
  /**
976
978
  * 不声明emits使得事件被透传放入attrs中, 这样可以让所有的事件透传
977
979
  * 如事件onClick
@@ -1012,7 +1014,7 @@ const Debounce = defineComponent({
1012
1014
  }
1013
1015
  });
1014
1016
 
1015
- const props$1c = {
1017
+ const props$1e = {
1016
1018
  tag: {
1017
1019
  type: String,
1018
1020
  default: "button"
@@ -1042,11 +1044,11 @@ const props$1c = {
1042
1044
 
1043
1045
  /** @jsxImportSource vue */
1044
1046
 
1045
- const COMPONENT_NAME$1o = 'vc-button';
1047
+ const COMPONENT_NAME$1v = 'vc-button';
1046
1048
  const Button = /* @__PURE__ */ defineComponent({
1047
- name: COMPONENT_NAME$1o,
1049
+ name: COMPONENT_NAME$1v,
1048
1050
  emits: ['click'],
1049
- props: props$1c,
1051
+ props: props$1e,
1050
1052
  setup(props, {
1051
1053
  slots
1052
1054
  }) {
@@ -1103,7 +1105,7 @@ const Button = /* @__PURE__ */ defineComponent({
1103
1105
  }
1104
1106
  });
1105
1107
 
1106
- const props$1b = {
1108
+ const props$1d = {
1107
1109
  vertical: {
1108
1110
  type: Boolean,
1109
1111
  default: false
@@ -1124,10 +1126,10 @@ const props$1b = {
1124
1126
 
1125
1127
  /** @jsxImportSource vue */
1126
1128
 
1127
- const COMPONENT_NAME$1n = 'vc-button-group';
1129
+ const COMPONENT_NAME$1u = 'vc-button-group';
1128
1130
  const ButtonGroup = /* @__PURE__ */ defineComponent({
1129
- name: COMPONENT_NAME$1n,
1130
- props: props$1b,
1131
+ name: COMPONENT_NAME$1u,
1132
+ props: props$1d,
1131
1133
  setup(props, {
1132
1134
  slots
1133
1135
  }) {
@@ -1151,7 +1153,7 @@ const ButtonGroup = /* @__PURE__ */ defineComponent({
1151
1153
  const MButton = Button;
1152
1154
  const MButtonGroup = ButtonGroup;
1153
1155
 
1154
- const props$1a = {
1156
+ const props$1c = {
1155
1157
  tag: {
1156
1158
  type: String,
1157
1159
  default: "div"
@@ -1160,10 +1162,10 @@ const props$1a = {
1160
1162
 
1161
1163
  /** @jsxImportSource vue */
1162
1164
 
1163
- const COMPONENT_NAME$1m = 'vc-calendar';
1165
+ const COMPONENT_NAME$1t = 'vc-calendar';
1164
1166
  const Calendar = /* @__PURE__ */ defineComponent({
1165
- name: COMPONENT_NAME$1m,
1166
- props: props$1a,
1167
+ name: COMPONENT_NAME$1t,
1168
+ props: props$1c,
1167
1169
  setup(props, {
1168
1170
  slots
1169
1171
  }) {
@@ -1177,7 +1179,7 @@ const Calendar = /* @__PURE__ */ defineComponent({
1177
1179
 
1178
1180
  const MCalendar = Calendar;
1179
1181
 
1180
- const props$19 = {
1182
+ const props$1b = {
1181
1183
  border: {
1182
1184
  type: Boolean,
1183
1185
  default: true
@@ -1200,10 +1202,10 @@ const props$19 = {
1200
1202
 
1201
1203
  /** @jsxImportSource vue */
1202
1204
 
1203
- const COMPONENT_NAME$1l = 'vc-card';
1205
+ const COMPONENT_NAME$1s = 'vc-card';
1204
1206
  const Card = /* @__PURE__ */ defineComponent({
1205
- name: COMPONENT_NAME$1l,
1206
- props: props$19,
1207
+ name: COMPONENT_NAME$1s,
1208
+ props: props$1b,
1207
1209
  setup(props, {
1208
1210
  slots
1209
1211
  }) {
@@ -1229,7 +1231,7 @@ const Card = /* @__PURE__ */ defineComponent({
1229
1231
 
1230
1232
  const MCard = Card;
1231
1233
 
1232
- const props$18 = {
1234
+ const props$1a = {
1233
1235
  tag: {
1234
1236
  type: String,
1235
1237
  default: "div"
@@ -1238,10 +1240,10 @@ const props$18 = {
1238
1240
 
1239
1241
  /** @jsxImportSource vue */
1240
1242
 
1241
- const COMPONENT_NAME$1k = 'vc-carousel';
1243
+ const COMPONENT_NAME$1r = 'vc-carousel';
1242
1244
  const Carousel = /* @__PURE__ */ defineComponent({
1243
- name: COMPONENT_NAME$1k,
1244
- props: props$18,
1245
+ name: COMPONENT_NAME$1r,
1246
+ props: props$1a,
1245
1247
  setup(props, {
1246
1248
  slots
1247
1249
  }) {
@@ -1255,7 +1257,7 @@ const Carousel = /* @__PURE__ */ defineComponent({
1255
1257
 
1256
1258
  const MCarousel = Carousel;
1257
1259
 
1258
- const props$17 = {
1260
+ const props$19 = {
1259
1261
  tag: {
1260
1262
  type: String,
1261
1263
  default: "div"
@@ -1264,10 +1266,10 @@ const props$17 = {
1264
1266
 
1265
1267
  /** @jsxImportSource vue */
1266
1268
 
1267
- const COMPONENT_NAME$1j = 'vc-cascader';
1269
+ const COMPONENT_NAME$1q = 'vc-cascader';
1268
1270
  const Cascader = /* @__PURE__ */ defineComponent({
1269
- name: COMPONENT_NAME$1j,
1270
- props: props$17,
1271
+ name: COMPONENT_NAME$1q,
1272
+ props: props$19,
1271
1273
  setup(props, {
1272
1274
  slots
1273
1275
  }) {
@@ -1320,22 +1322,25 @@ const EVENTS = [
1320
1322
  "contextmenu"
1321
1323
  ];
1322
1324
 
1323
- const props$16 = {
1325
+ const props$18 = {
1324
1326
  options: Object,
1325
1327
  pluginOptions: Object,
1326
1328
  theme: [String, Object],
1327
1329
  group: String,
1328
- autoResize: Boolean,
1330
+ resize: {
1331
+ type: [Boolean, Number],
1332
+ default: 100
1333
+ },
1329
1334
  watchShallow: Boolean,
1330
1335
  manualUpdate: Boolean
1331
1336
  };
1332
1337
 
1333
1338
  /** @jsxImportSource vue */
1334
1339
 
1335
- const COMPONENT_NAME$1i = 'vc-chart';
1340
+ const COMPONENT_NAME$1p = 'vc-chart';
1336
1341
  const Chart = /* @__PURE__ */ defineComponent({
1337
- name: COMPONENT_NAME$1i,
1338
- props: props$16,
1342
+ name: COMPONENT_NAME$1p,
1343
+ props: props$18,
1339
1344
  emits: [...EVENTS, 'ready'],
1340
1345
  setup(props, {
1341
1346
  emit,
@@ -1358,6 +1363,17 @@ const Chart = /* @__PURE__ */ defineComponent({
1358
1363
  if (!chart.value) return;
1359
1364
  chart.value.setOption(options, notMerge, lazyUpdate);
1360
1365
  };
1366
+ const handleResize = () => {
1367
+ if (lastArea === 0) {
1368
+ // emulate initial render for initially hidden charts
1369
+ mergeOptions({}, true);
1370
+ chart.value.resize();
1371
+ mergeOptions(props.options || manualOptions.value || {}, true);
1372
+ } else {
1373
+ chart.value.resize();
1374
+ }
1375
+ lastArea = getArea();
1376
+ };
1361
1377
  const init = () => {
1362
1378
  if (chart.value || !echartsInstance.value) {
1363
1379
  return;
@@ -1374,20 +1390,10 @@ const Chart = /* @__PURE__ */ defineComponent({
1374
1390
  emit(event, params);
1375
1391
  });
1376
1392
  });
1377
- if (props.autoResize) {
1393
+ if (props.resize !== false) {
1378
1394
  lastArea = getArea();
1379
1395
  resizeHandler && Resize.off(instance.vnode.el, resizeHandler);
1380
- resizeHandler = debounce(() => {
1381
- if (lastArea === 0) {
1382
- // emulate initial render for initially hidden charts
1383
- mergeOptions({}, true);
1384
- chart.value.resize();
1385
- mergeOptions(props.options || manualOptions.value || {}, true);
1386
- } else {
1387
- chart.value.resize();
1388
- }
1389
- lastArea = getArea();
1390
- }, 100, {
1396
+ resizeHandler = props.resize === 0 || props.resize === true ? handleResize : debounce(handleResize, props.resize, {
1391
1397
  leading: true
1392
1398
  });
1393
1399
  Resize.on(instance.vnode.el, resizeHandler);
@@ -1395,7 +1401,7 @@ const Chart = /* @__PURE__ */ defineComponent({
1395
1401
  };
1396
1402
  const destroy = () => {
1397
1403
  if (!chart.value) return;
1398
- if (props.autoResize) {
1404
+ if (props.resize !== false) {
1399
1405
  resizeHandler && Resize.off(instance.vnode.el, resizeHandler);
1400
1406
  resizeHandler = null;
1401
1407
  }
@@ -1421,7 +1427,7 @@ const Chart = /* @__PURE__ */ defineComponent({
1421
1427
  deep: !props.watchShallow
1422
1428
  });
1423
1429
  }
1424
- const watched = ['theme', 'pluginOptions', 'autoResize', 'manualUpdate', 'watchShallow'];
1430
+ const watched = ['theme', 'pluginOptions', 'resize', 'manualUpdate', 'watchShallow'];
1425
1431
  watched.forEach(prop => watch(() => props[prop], refresh, {
1426
1432
  deep: true
1427
1433
  }));
@@ -1449,33 +1455,291 @@ const Chart = /* @__PURE__ */ defineComponent({
1449
1455
 
1450
1456
  const MChart = Chart;
1451
1457
 
1452
- const props$15 = {
1453
- tag: {
1454
- type: String,
1455
- default: "div"
1458
+ const props$17 = {
1459
+ disabled: {
1460
+ type: Boolean,
1461
+ default: false
1462
+ },
1463
+ modelValue: {
1464
+ type: [String, Number, Boolean],
1465
+ default: false
1466
+ },
1467
+ // 当前选项value值
1468
+ value: {
1469
+ type: [String, Number, Boolean],
1470
+ default: void 0
1471
+ },
1472
+ // 当前选项label值
1473
+ label: {
1474
+ type: [String, Number, Boolean],
1475
+ default: void 0
1476
+ },
1477
+ indeterminate: {
1478
+ type: Boolean,
1479
+ default: false
1480
+ },
1481
+ // 原生 `name` 属性
1482
+ name: String,
1483
+ // group模式下无效
1484
+ checkedValue: {
1485
+ type: [String, Number, Boolean],
1486
+ default: true
1487
+ },
1488
+ // group模式下无效
1489
+ uncheckedValue: {
1490
+ type: [String, Number, Boolean],
1491
+ default: false
1456
1492
  }
1457
1493
  };
1458
1494
 
1495
+ const useCheckbox = () => {
1496
+ const { props, emit } = getCurrentInstance();
1497
+ const group = inject("vc-checkbox-group", {});
1498
+ const formItem = inject("vc-form-item", {});
1499
+ const currentValue = ref(void 0);
1500
+ const isFocus = ref(false);
1501
+ const hasGroup = computed(() => {
1502
+ return !!group.props;
1503
+ });
1504
+ const computedValue = computed(() => {
1505
+ return typeof props.value === "undefined" || props.value === "" ? props.label : props.value;
1506
+ });
1507
+ const computedLabel = computed(() => {
1508
+ return typeof props.label === "undefined" || props.label === "" ? props.value : props.label;
1509
+ });
1510
+ const checked = computed(() => {
1511
+ return hasGroup.value ? group.currentValue.value.includes(computedValue.value) : currentValue.value === props.checkedValue;
1512
+ });
1513
+ const classes = computed(() => {
1514
+ return {
1515
+ "is-indeterminate": props.indeterminate,
1516
+ "is-checked": checked.value,
1517
+ "is-disabled": props.disabled,
1518
+ "is-focus": isFocus.value
1519
+ };
1520
+ });
1521
+ watch(
1522
+ () => props.modelValue,
1523
+ (v) => {
1524
+ currentValue.value = v;
1525
+ },
1526
+ { immediate: true }
1527
+ );
1528
+ const reset = ($checked) => {
1529
+ currentValue.value = $checked ? props.checkedValue : props.uncheckedValue;
1530
+ };
1531
+ const sync = (e) => {
1532
+ emit("update:modelValue", currentValue.value, e, reset);
1533
+ emit("change", currentValue.value, e, reset);
1534
+ formItem?.change?.(currentValue.value);
1535
+ };
1536
+ const handleChange = (e) => {
1537
+ if (props.disabled) {
1538
+ return false;
1539
+ }
1540
+ const $checked = e.target.checked;
1541
+ if (hasGroup.value) {
1542
+ group.reset(computedValue.value);
1543
+ group.sync(e);
1544
+ } else {
1545
+ reset($checked);
1546
+ sync(e);
1547
+ }
1548
+ };
1549
+ const handleBlur = () => {
1550
+ isFocus.value = false;
1551
+ };
1552
+ const handleFocus = () => {
1553
+ isFocus.value = true;
1554
+ };
1555
+ return {
1556
+ currentValue,
1557
+ isFocus,
1558
+ classes,
1559
+ hasGroup,
1560
+ checked,
1561
+ handleChange,
1562
+ handleBlur,
1563
+ handleFocus,
1564
+ sync,
1565
+ reset,
1566
+ computedValue,
1567
+ computedLabel
1568
+ };
1569
+ };
1570
+
1459
1571
  /** @jsxImportSource vue */
1460
1572
 
1461
- const COMPONENT_NAME$1h = 'vc-checkbox';
1573
+ const COMPONENT_NAME$1o = 'vc-checkbox';
1462
1574
  const Checkbox = /* @__PURE__ */ defineComponent({
1463
- name: COMPONENT_NAME$1h,
1464
- props: props$15,
1575
+ name: COMPONENT_NAME$1o,
1576
+ props: props$17,
1577
+ emits: ['update:modelValue', 'change'],
1578
+ setup(props, {
1579
+ slots
1580
+ }) {
1581
+ const {
1582
+ checked,
1583
+ classes,
1584
+ computedLabel,
1585
+ handleChange,
1586
+ handleFocus,
1587
+ handleBlur
1588
+ } = useCheckbox();
1589
+ return () => {
1590
+ return createVNode("label", {
1591
+ "class": [classes.value, 'vc-checkbox']
1592
+ }, [createVNode("span", {
1593
+ "class": [{
1594
+ 'has-sibling': !!(computedLabel.value || slots.default)
1595
+ }, 'vc-checkbox__wrapper']
1596
+ }, [createVNode("span", {
1597
+ "class": "vc-checkbox__border"
1598
+ }, [createVNode("span", {
1599
+ "class": "vc-checkbox__inner"
1600
+ }, null)]), createVNode("input", {
1601
+ "checked": checked.value,
1602
+ "name": props.name,
1603
+ "disabled": props.disabled,
1604
+ "type": "checkbox",
1605
+ "onChange": handleChange,
1606
+ "onFocus": handleFocus,
1607
+ "onBlur": handleBlur
1608
+ }, null)]), slots.default ? slots.default() : computedLabel.value && createVNode("span", null, [computedLabel.value])]);
1609
+ };
1610
+ }
1611
+ });
1612
+
1613
+ const props$16 = {
1614
+ modelValue: {
1615
+ type: Array,
1616
+ default: () => []
1617
+ },
1618
+ fragment: {
1619
+ type: Boolean,
1620
+ default: false
1621
+ }
1622
+ };
1623
+
1624
+ const useCheckboxGroup = () => {
1625
+ const { props, emit } = getCurrentInstance();
1626
+ const formItem = inject("vc-form-item", {});
1627
+ const currentValue = ref([]);
1628
+ watch(
1629
+ () => props.modelValue,
1630
+ (v) => {
1631
+ if (isEqualWith(v, currentValue.value)) {
1632
+ return;
1633
+ }
1634
+ currentValue.value = v;
1635
+ },
1636
+ { immediate: true }
1637
+ );
1638
+ const reset = (v) => {
1639
+ const index = currentValue.value.findIndex((i) => i == v);
1640
+ index == -1 ? currentValue.value.push(v) : currentValue.value.splice(index, 1);
1641
+ };
1642
+ const sync = (e) => {
1643
+ emit("update:modelValue", currentValue.value, e, reset);
1644
+ emit("change", currentValue.value, e, reset);
1645
+ formItem?.change?.(currentValue.value);
1646
+ };
1647
+ provide("vc-checkbox-group", {
1648
+ props,
1649
+ currentValue,
1650
+ reset,
1651
+ sync
1652
+ });
1653
+ return {
1654
+ currentValue,
1655
+ sync,
1656
+ reset
1657
+ };
1658
+ };
1659
+
1660
+ /** @jsxImportSource vue */
1661
+
1662
+ const COMPONENT_NAME$1n = 'vc-checkbox-group';
1663
+ const CheckboxGroup = /* @__PURE__ */ defineComponent({
1664
+ name: COMPONENT_NAME$1n,
1665
+ props: props$16,
1666
+ emits: ['update:modelValue', 'change'],
1465
1667
  setup(props, {
1466
1668
  slots
1467
1669
  }) {
1670
+ useCheckboxGroup();
1468
1671
  return () => {
1672
+ if (props.fragment) return slots.default?.();
1469
1673
  return createVNode("div", {
1470
- "class": "vc-checkbox"
1674
+ "class": "vc-checkbox-group"
1471
1675
  }, [slots?.default?.()]);
1472
1676
  };
1473
1677
  }
1474
1678
  });
1475
1679
 
1476
- const MCheckbox = Checkbox;
1680
+ /** @jsxImportSource vue */
1477
1681
 
1478
- const props$14 = {
1682
+ const COMPONENT_NAME$1m = 'vcm-checkbox';
1683
+ const MCheckbox = /* @__PURE__ */ defineComponent({
1684
+ name: COMPONENT_NAME$1m,
1685
+ props: props$17,
1686
+ emits: ['update:modelValue', 'change'],
1687
+ setup(props, {
1688
+ slots
1689
+ }) {
1690
+ const {
1691
+ checked,
1692
+ classes,
1693
+ computedLabel,
1694
+ handleChange,
1695
+ handleFocus,
1696
+ handleBlur
1697
+ } = useCheckbox();
1698
+ return () => {
1699
+ return createVNode("label", {
1700
+ "class": [classes.value, 'vcm-checkbox']
1701
+ }, [createVNode("span", {
1702
+ "class": [{
1703
+ 'has-sibling': !!(computedLabel.value || slots.default)
1704
+ }, 'vcm-checkbox__wrapper']
1705
+ }, [createVNode("span", {
1706
+ "class": "vcm-checkbox__border"
1707
+ }, [createVNode("span", {
1708
+ "class": "vcm-checkbox__inner"
1709
+ }, null)]), createVNode("input", {
1710
+ "checked": checked.value,
1711
+ "name": props.name,
1712
+ "disabled": props.disabled,
1713
+ "type": "checkbox",
1714
+ "onChange": handleChange,
1715
+ "onFocus": handleFocus,
1716
+ "onBlur": handleBlur
1717
+ }, null)]), slots.default ? slots.default() : computedLabel.value && createVNode("span", null, [computedLabel.value])]);
1718
+ };
1719
+ }
1720
+ });
1721
+
1722
+ /** @jsxImportSource vue */
1723
+
1724
+ const COMPONENT_NAME$1l = 'vcm-checkbox-group';
1725
+ const MCheckboxGroup = /* @__PURE__ */ defineComponent({
1726
+ name: COMPONENT_NAME$1l,
1727
+ props: props$16,
1728
+ emits: ['update:modelValue', 'change'],
1729
+ setup(props, {
1730
+ slots
1731
+ }) {
1732
+ useCheckboxGroup();
1733
+ return () => {
1734
+ if (props.fragment) return slots.default?.();
1735
+ return createVNode("div", {
1736
+ "class": "vcm-checkbox-group"
1737
+ }, [slots?.default?.()]);
1738
+ };
1739
+ }
1740
+ });
1741
+
1742
+ const props$15 = {
1479
1743
  tag: {
1480
1744
  type: String,
1481
1745
  default: "div"
@@ -1484,10 +1748,10 @@ const props$14 = {
1484
1748
 
1485
1749
  /** @jsxImportSource vue */
1486
1750
 
1487
- const COMPONENT_NAME$1g = 'vc-clipboard';
1751
+ const COMPONENT_NAME$1k = 'vc-clipboard';
1488
1752
  const Clipboard = /* @__PURE__ */ defineComponent({
1489
- name: COMPONENT_NAME$1g,
1490
- props: props$14,
1753
+ name: COMPONENT_NAME$1k,
1754
+ props: props$15,
1491
1755
  setup(props, {
1492
1756
  slots
1493
1757
  }) {
@@ -1501,7 +1765,7 @@ const Clipboard = /* @__PURE__ */ defineComponent({
1501
1765
 
1502
1766
  const MClipboard = Clipboard;
1503
1767
 
1504
- const props$13 = {
1768
+ const props$14 = {
1505
1769
  tag: {
1506
1770
  type: String,
1507
1771
  default: "div"
@@ -1524,10 +1788,10 @@ const props$13 = {
1524
1788
  }
1525
1789
  };
1526
1790
 
1527
- const COMPONENT_NAME$1f = "vc-collapse";
1791
+ const COMPONENT_NAME$1j = "vc-collapse";
1528
1792
  const Collapse = defineComponent({
1529
- name: COMPONENT_NAME$1f,
1530
- props: props$13,
1793
+ name: COMPONENT_NAME$1j,
1794
+ props: props$14,
1531
1795
  emits: ["update:moodelValue", "change"],
1532
1796
  setup(props, { slots, emit }) {
1533
1797
  const instance = getCurrentInstance();
@@ -1612,7 +1876,7 @@ const Collapse = defineComponent({
1612
1876
  }
1613
1877
  });
1614
1878
 
1615
- const props$12 = {
1879
+ const props$13 = {
1616
1880
  tag: {
1617
1881
  type: String,
1618
1882
  default: "div"
@@ -1622,7 +1886,7 @@ const props$12 = {
1622
1886
  }
1623
1887
  };
1624
1888
 
1625
- const props$11 = {
1889
+ const props$12 = {
1626
1890
  tag: {
1627
1891
  type: String,
1628
1892
  default: "div"
@@ -1640,13 +1904,13 @@ const props$11 = {
1640
1904
 
1641
1905
  /** @jsxImportSource vue */
1642
1906
 
1643
- function _isSlot$2(s) {
1907
+ function _isSlot$1(s) {
1644
1908
  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
1645
1909
  }
1646
- const COMPONENT_NAME$1e = 'vc-expand';
1910
+ const COMPONENT_NAME$1i = 'vc-expand';
1647
1911
  const Expand = /* @__PURE__ */ defineComponent({
1648
- name: COMPONENT_NAME$1e,
1649
- props: props$11,
1912
+ name: COMPONENT_NAME$1i,
1913
+ props: props$12,
1650
1914
  setup(props, {
1651
1915
  slots
1652
1916
  }) {
@@ -1664,7 +1928,7 @@ const Expand = /* @__PURE__ */ defineComponent({
1664
1928
  enter: 200,
1665
1929
  leave: 200
1666
1930
  }
1667
- }, _isSlot$2(_slot = withDirectives(createVNode(Content, null, {
1931
+ }, _isSlot$1(_slot = withDirectives(createVNode(Content, null, {
1668
1932
  default: () => [(props.alive || !props.alive && isActive.value) && slots.default?.()]
1669
1933
  }), [[vShow, isActive.value]])) ? _slot : {
1670
1934
  default: () => [_slot]
@@ -1675,10 +1939,10 @@ const Expand = /* @__PURE__ */ defineComponent({
1675
1939
 
1676
1940
  /** @jsxImportSource vue */
1677
1941
 
1678
- const COMPONENT_NAME$1d = 'vc-collapse-item';
1942
+ const COMPONENT_NAME$1h = 'vc-collapse-item';
1679
1943
  const CollapseItem = /* @__PURE__ */ defineComponent({
1680
- name: COMPONENT_NAME$1d,
1681
- props: props$12,
1944
+ name: COMPONENT_NAME$1h,
1945
+ props: props$13,
1682
1946
  setup(props, {
1683
1947
  slots,
1684
1948
  expose
@@ -1743,7 +2007,7 @@ const CollapseItem = /* @__PURE__ */ defineComponent({
1743
2007
  const MCollapse = Collapse;
1744
2008
  const MCollapseItem = CollapseItem;
1745
2009
 
1746
- const props$10 = {
2010
+ const props$11 = {
1747
2011
  tag: {
1748
2012
  type: String,
1749
2013
  default: "div"
@@ -1752,10 +2016,10 @@ const props$10 = {
1752
2016
 
1753
2017
  /** @jsxImportSource vue */
1754
2018
 
1755
- const COMPONENT_NAME$1c = 'vc-color-picker';
2019
+ const COMPONENT_NAME$1g = 'vc-color-picker';
1756
2020
  const ColorPicker = /* @__PURE__ */ defineComponent({
1757
- name: COMPONENT_NAME$1c,
1758
- props: props$10,
2021
+ name: COMPONENT_NAME$1g,
2022
+ props: props$11,
1759
2023
  setup(props, {
1760
2024
  slots
1761
2025
  }) {
@@ -1769,7 +2033,7 @@ const ColorPicker = /* @__PURE__ */ defineComponent({
1769
2033
 
1770
2034
  const MColorPicker = ColorPicker;
1771
2035
 
1772
- const props$$ = {
2036
+ const props$10 = {
1773
2037
  tag: {
1774
2038
  type: String,
1775
2039
  default: "div"
@@ -1778,10 +2042,10 @@ const props$$ = {
1778
2042
 
1779
2043
  /** @jsxImportSource vue */
1780
2044
 
1781
- const COMPONENT_NAME$1b = 'vc-countdown';
2045
+ const COMPONENT_NAME$1f = 'vc-countdown';
1782
2046
  const Countdown = /* @__PURE__ */ defineComponent({
1783
- name: COMPONENT_NAME$1b,
1784
- props: props$$,
2047
+ name: COMPONENT_NAME$1f,
2048
+ props: props$10,
1785
2049
  setup(props, {
1786
2050
  slots
1787
2051
  }) {
@@ -1795,17 +2059,17 @@ const Countdown = /* @__PURE__ */ defineComponent({
1795
2059
 
1796
2060
  const MCountdown = Countdown;
1797
2061
 
1798
- const props$_ = {
2062
+ const props$$ = {
1799
2063
  render: {
1800
2064
  type: Function,
1801
2065
  default: () => null
1802
2066
  }
1803
2067
  };
1804
2068
 
1805
- const COMPONENT_NAME$1a = "vc-customer";
2069
+ const COMPONENT_NAME$1e = "vc-customer";
1806
2070
  const Customer = defineComponent({
1807
- name: COMPONENT_NAME$1a,
1808
- props: props$_,
2071
+ name: COMPONENT_NAME$1e,
2072
+ props: props$$,
1809
2073
  setup(props, context) {
1810
2074
  return () => h(() => {
1811
2075
  return props.render(context.attrs, context);
@@ -1815,7 +2079,7 @@ const Customer = defineComponent({
1815
2079
 
1816
2080
  const MCustomer = Customer;
1817
2081
 
1818
- const props$Z = {
2082
+ const props$_ = {
1819
2083
  tag: {
1820
2084
  type: String,
1821
2085
  default: "div"
@@ -1824,10 +2088,10 @@ const props$Z = {
1824
2088
 
1825
2089
  /** @jsxImportSource vue */
1826
2090
 
1827
- const COMPONENT_NAME$19 = 'vc-date-picker';
2091
+ const COMPONENT_NAME$1d = 'vc-date-picker';
1828
2092
  const DatePicker = /* @__PURE__ */ defineComponent({
1829
- name: COMPONENT_NAME$19,
1830
- props: props$Z,
2093
+ name: COMPONENT_NAME$1d,
2094
+ props: props$_,
1831
2095
  setup(props, {
1832
2096
  slots
1833
2097
  }) {
@@ -1841,7 +2105,7 @@ const DatePicker = /* @__PURE__ */ defineComponent({
1841
2105
 
1842
2106
  const MDatePicker = DatePicker;
1843
2107
 
1844
- const props$Y = {
2108
+ const props$Z = {
1845
2109
  tag: {
1846
2110
  type: String,
1847
2111
  default: "div"
@@ -1850,10 +2114,10 @@ const props$Y = {
1850
2114
 
1851
2115
  /** @jsxImportSource vue */
1852
2116
 
1853
- const COMPONENT_NAME$18 = 'vc-divider';
2117
+ const COMPONENT_NAME$1c = 'vc-divider';
1854
2118
  const Divider = /* @__PURE__ */ defineComponent({
1855
- name: COMPONENT_NAME$18,
1856
- props: props$Y,
2119
+ name: COMPONENT_NAME$1c,
2120
+ props: props$Z,
1857
2121
  setup(props, {
1858
2122
  slots
1859
2123
  }) {
@@ -1918,7 +2182,7 @@ class PortalLeaf {
1918
2182
  }
1919
2183
  }
1920
2184
 
1921
- const COMPONENT_NAME$17 = "vc-portal";
2185
+ const COMPONENT_NAME$1b = "vc-portal";
1922
2186
  class Portal {
1923
2187
  /**
1924
2188
  * 清理Portals类型组件
@@ -1970,7 +2234,7 @@ class Portal {
1970
2234
  this.wrapper = wrapper;
1971
2235
  this.globalOptions = {
1972
2236
  ...options,
1973
- name: options?.name || wrapper.name || Utils.getUid(COMPONENT_NAME$17)
2237
+ name: options?.name || wrapper.name || Utils.getUid(COMPONENT_NAME$1b)
1974
2238
  };
1975
2239
  }
1976
2240
  popup(propsData, options) {
@@ -2069,7 +2333,7 @@ class Portal {
2069
2333
  ...rest
2070
2334
  } = options;
2071
2335
  let useAllNodes = fragment;
2072
- const name = multiple ? `${name$}__${Utils.getUid(COMPONENT_NAME$17)}` : name$;
2336
+ const name = multiple ? `${name$}__${Utils.getUid(COMPONENT_NAME$1b)}` : name$;
2073
2337
  const container = document.createElement(tag);
2074
2338
  const root = typeof el === "object" ? el : document.querySelector(el || "body");
2075
2339
  !alive && Portal.leafs.get(name)?.destroy();
@@ -2103,7 +2367,7 @@ class Portal {
2103
2367
  } else {
2104
2368
  const wrapper = this.wrapper;
2105
2369
  const app = createApp({
2106
- name: COMPONENT_NAME$17,
2370
+ name: COMPONENT_NAME$1b,
2107
2371
  parent,
2108
2372
  setup() {
2109
2373
  if (alive) {
@@ -2208,21 +2472,21 @@ class Portal {
2208
2472
  }
2209
2473
  }
2210
2474
 
2211
- const props$X = {
2475
+ const props$Y = {
2212
2476
  tag: {
2213
2477
  type: String,
2214
2478
  default: "div"
2215
2479
  }
2216
2480
  };
2217
2481
 
2218
- const COMPONENT_NAME$16 = 'vc-portal-view';
2482
+ const COMPONENT_NAME$1a = 'vc-portal-view';
2219
2483
 
2220
2484
  /**
2221
2485
  * 写法不同，但与vue@2.x 保持一致
2222
2486
  */
2223
2487
  const PortalView = /* @__PURE__ */ defineComponent({
2224
- name: COMPONENT_NAME$16,
2225
- props: props$X,
2488
+ name: COMPONENT_NAME$1a,
2489
+ props: props$Y,
2226
2490
  setup(props, {
2227
2491
  slots
2228
2492
  }) {
@@ -2239,7 +2503,7 @@ const PortalView = /* @__PURE__ */ defineComponent({
2239
2503
  }
2240
2504
  });
2241
2505
 
2242
- const props$W = {
2506
+ const props$X = {
2243
2507
  title: String,
2244
2508
  content: {
2245
2509
  type: [String, Function],
@@ -2307,13 +2571,10 @@ const props$W = {
2307
2571
 
2308
2572
  /** @jsxImportSource vue */
2309
2573
 
2310
- function _isSlot$1(s) {
2311
- return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
2312
- }
2313
- const COMPONENT_NAME$15 = 'vc-drawer';
2574
+ const COMPONENT_NAME$19 = 'vc-drawer';
2314
2575
  const DrawerView = /* @__PURE__ */ defineComponent({
2315
- name: COMPONENT_NAME$15,
2316
- props: props$W,
2576
+ name: COMPONENT_NAME$19,
2577
+ props: props$X,
2317
2578
  emits: ['close', 'update:modelValue', 'visible-change'],
2318
2579
  setup(props, {
2319
2580
  emit,
@@ -2394,57 +2655,58 @@ const DrawerView = /* @__PURE__ */ defineComponent({
2394
2655
  }
2395
2656
  });
2396
2657
  return () => {
2397
- let _slot, _slot2;
2398
2658
  return createVNode("div", {
2399
2659
  "class": [classes.value, 'vc-drawer']
2400
2660
  }, [createVNode(TransitionFade, {
2401
2661
  "delay": 50
2402
- }, _isSlot$1(_slot = withDirectives(createVNode("div", {
2403
- "style": props.maskStyle,
2404
- "class": "vc-drawer__mask",
2405
- "onClick": e => handleClose(e, props.maskClosable)
2406
- }, null), [[vShow, props.mask && isActive.value]])) ? _slot : {
2407
- default: () => [_slot]
2662
+ }, {
2663
+ default: () => [withDirectives(createVNode("div", {
2664
+ "style": props.maskStyle,
2665
+ "class": "vc-drawer__mask",
2666
+ "onClick": e => handleClose(e, props.maskClosable)
2667
+ }, null), [[vShow, props.mask && isActive.value]])]
2408
2668
  }), createVNode(TransitionSlide, {
2409
2669
  "mode": props.placement,
2410
2670
  "onAfterLeave": handleRemove
2411
- }, _isSlot$1(_slot2 = withDirectives(createVNode("div", {
2412
- "class": [props.wrapperClass, 'vc-drawer__wrapper'],
2413
- "style": [style.value, props.wrapperStyle]
2414
- }, [createVNode("div", {
2415
- "class": "vc-drawer__container"
2416
- }, [createVNode("div", {
2417
- "class": "vc-drawer__header"
2418
- }, [slots.header ? slots.header() : typeof props.title === 'string' ? createVNode("div", {
2419
- "class": "vc-drawer__title",
2420
- "innerHTML": props.title
2421
- }, null) : typeof props.title === 'function' && createVNode(Customer, {
2422
- "render": props.title
2423
- }, null), createVNode("a", {
2424
- "class": "vc-drawer__close",
2425
- "onClick": e => handleClose(e, true)
2426
- }, [createVNode(Icon, {
2427
- "type": "close"
2428
- }, null)])]), createVNode("div", {
2429
- "class": ['vc-drawer__content']
2430
- }, [typeof props.content === 'string' ? createVNode("div", {
2431
- "innerHTML": props.content
2432
- }, null) : typeof props.content === 'function' ? createVNode(Customer, {
2433
- "render": props.content
2434
- }, null) : null, slots.default?.()]), props.footer && (props.cancelText || props.okText) && createVNode("div", {
2435
- "class": ['vc-drawer__footer']
2436
- }, [slots['footer-extra']?.(), !slots.footer ? createVNode(Fragment$1, null, [props.cancelText && createVNode(Button, {
2437
- "style": "margin-right: 8px;",
2438
- "onClick": e => handleBefore(e, handleCancel)
2439
2671
  }, {
2440
- default: () => [props.cancelText]
2441
- }), props.okText && createVNode(Button, {
2442
- "type": "primary",
2443
- "onClick": e => handleBefore(e, handleOk)
2444
- }, {
2445
- default: () => [props.okText]
2446
- })]) : slots.footer?.()])])]), [[vShow, isActive.value]])) ? _slot2 : {
2447
- default: () => [_slot2]
2672
+ default: () => [withDirectives(createVNode("div", {
2673
+ "class": [props.wrapperClass, 'vc-drawer__wrapper'],
2674
+ "style": [style.value, props.wrapperStyle]
2675
+ }, [createVNode("div", {
2676
+ "class": [{
2677
+ 'is-no-footer': !props.footer || !props.cancelText && !props.okText
2678
+ }, 'vc-drawer__container']
2679
+ }, [createVNode("div", {
2680
+ "class": "vc-drawer__header"
2681
+ }, [slots.header ? slots.header() : typeof props.title === 'string' ? createVNode("div", {
2682
+ "class": "vc-drawer__title",
2683
+ "innerHTML": props.title
2684
+ }, null) : typeof props.title === 'function' && createVNode(Customer, {
2685
+ "render": props.title
2686
+ }, null), createVNode("a", {
2687
+ "class": "vc-drawer__close",
2688
+ "onClick": e => handleClose(e, true)
2689
+ }, [createVNode(Icon, {
2690
+ "type": "close"
2691
+ }, null)])]), createVNode("div", {
2692
+ "class": ['vc-drawer__content']
2693
+ }, [typeof props.content === 'string' ? createVNode("div", {
2694
+ "innerHTML": props.content
2695
+ }, null) : typeof props.content === 'function' ? createVNode(Customer, {
2696
+ "render": props.content
2697
+ }, null) : null, slots.default?.()]), props.footer && (props.cancelText || props.okText) && createVNode("div", {
2698
+ "class": ['vc-drawer__footer']
2699
+ }, [slots['footer-extra']?.(), !slots.footer ? createVNode(Fragment$1, null, [props.cancelText && createVNode(Button, {
2700
+ "style": "margin-right: 8px;",
2701
+ "onClick": e => handleBefore(e, handleCancel)
2702
+ }, {
2703
+ default: () => [props.cancelText]
2704
+ }), props.okText && createVNode(Button, {
2705
+ "type": "primary",
2706
+ "onClick": e => handleBefore(e, handleOk)
2707
+ }, {
2708
+ default: () => [props.okText]
2709
+ })]) : slots.footer?.()])])]), [[vShow, isActive.value]])]
2448
2710
  })]);
2449
2711
  };
2450
2712
  }
@@ -2474,7 +2736,7 @@ const drawer = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
2474
2736
 
2475
2737
  const MDrawerView = DrawerView;
2476
2738
 
2477
- const props$V = {
2739
+ const props$W = {
2478
2740
  tag: {
2479
2741
  type: String,
2480
2742
  default: "div"
@@ -2483,10 +2745,10 @@ const props$V = {
2483
2745
 
2484
2746
  /** @jsxImportSource vue */
2485
2747
 
2486
- const COMPONENT_NAME$14 = 'vc-dropdown';
2748
+ const COMPONENT_NAME$18 = 'vc-dropdown';
2487
2749
  const Dropdown = /* @__PURE__ */ defineComponent({
2488
- name: COMPONENT_NAME$14,
2489
- props: props$V,
2750
+ name: COMPONENT_NAME$18,
2751
+ props: props$W,
2490
2752
  setup(props, {
2491
2753
  slots
2492
2754
  }) {
@@ -2500,7 +2762,7 @@ const Dropdown = /* @__PURE__ */ defineComponent({
2500
2762
 
2501
2763
  const MDropdown = Dropdown;
2502
2764
 
2503
- const props$U = {
2765
+ const props$V = {
2504
2766
  tag: {
2505
2767
  type: String,
2506
2768
  default: "div"
@@ -2509,10 +2771,10 @@ const props$U = {
2509
2771
 
2510
2772
  /** @jsxImportSource vue */
2511
2773
 
2512
- const COMPONENT_NAME$13 = 'vc-editor';
2774
+ const COMPONENT_NAME$17 = 'vc-editor';
2513
2775
  const Editor = /* @__PURE__ */ defineComponent({
2514
- name: COMPONENT_NAME$13,
2515
- props: props$U,
2776
+ name: COMPONENT_NAME$17,
2777
+ props: props$V,
2516
2778
  setup(props, {
2517
2779
  slots
2518
2780
  }) {
@@ -2528,7 +2790,7 @@ const MEditor = Editor;
2528
2790
 
2529
2791
  const MExpand = Expand;
2530
2792
 
2531
- const props$T = {
2793
+ const props$U = {
2532
2794
  tag: {
2533
2795
  type: String,
2534
2796
  default: "form"
@@ -2655,10 +2917,10 @@ const useForm = (expose, options = {}) => {
2655
2917
  });
2656
2918
  };
2657
2919
 
2658
- const COMPONENT_NAME$12 = "vc-form";
2920
+ const COMPONENT_NAME$16 = "vc-form";
2659
2921
  const Form = defineComponent({
2660
- name: COMPONENT_NAME$12,
2661
- props: props$T,
2922
+ name: COMPONENT_NAME$16,
2923
+ props: props$U,
2662
2924
  setup(props, { slots, expose }) {
2663
2925
  useForm(expose);
2664
2926
  return () => {
@@ -2674,7 +2936,7 @@ const Form = defineComponent({
2674
2936
  }
2675
2937
  });
2676
2938
 
2677
- const props$S = {
2939
+ const props$T = {
2678
2940
  label: {
2679
2941
  type: String,
2680
2942
  default: ""
@@ -2977,10 +3239,10 @@ const useFormItem = (expose) => {
2977
3239
 
2978
3240
  /** @jsxImportSource vue */
2979
3241
 
2980
- const COMPONENT_NAME$11 = 'vc-form-item';
3242
+ const COMPONENT_NAME$15 = 'vc-form-item';
2981
3243
  const FormItem = /* @__PURE__ */ defineComponent({
2982
- name: COMPONENT_NAME$11,
2983
- props: props$S,
3244
+ name: COMPONENT_NAME$15,
3245
+ props: props$T,
2984
3246
  setup(props, {
2985
3247
  slots,
2986
3248
  expose
@@ -3032,8 +3294,8 @@ const FormItem = /* @__PURE__ */ defineComponent({
3032
3294
  }
3033
3295
  });
3034
3296
 
3035
- const props$R = {
3036
- ...props$T,
3297
+ const props$S = {
3298
+ ...props$U,
3037
3299
  showToast: {
3038
3300
  type: Boolean,
3039
3301
  default: false
@@ -3044,7 +3306,7 @@ const props$R = {
3044
3306
  }
3045
3307
  };
3046
3308
 
3047
- const props$Q = {
3309
+ const props$R = {
3048
3310
  content: [String, Function],
3049
3311
  maskClosable: {
3050
3312
  type: Boolean,
@@ -3073,11 +3335,11 @@ const MTransitionZoom = TransitionZoom;
3073
3335
 
3074
3336
  /** @jsxImportSource vue */
3075
3337
 
3076
- const COMPONENT_NAME$10 = 'vcm-toast';
3338
+ const COMPONENT_NAME$14 = 'vcm-toast';
3077
3339
  const MToastView = /* @__PURE__ */ defineComponent({
3078
- name: COMPONENT_NAME$10,
3340
+ name: COMPONENT_NAME$14,
3079
3341
  emits: ['close', 'portal-fulfilled'],
3080
- props: props$Q,
3342
+ props: props$R,
3081
3343
  setup(props, {
3082
3344
  emit,
3083
3345
  expose
@@ -3186,10 +3448,10 @@ const MToast$1 = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
3186
3448
  warning: warning$3
3187
3449
  }, Symbol.toStringTag, { value: 'Module' }));
3188
3450
 
3189
- const COMPONENT_NAME$$ = "vcm-form";
3451
+ const COMPONENT_NAME$13 = "vcm-form";
3190
3452
  const MForm = defineComponent({
3191
- name: COMPONENT_NAME$$,
3192
- props: props$R,
3453
+ name: COMPONENT_NAME$13,
3454
+ props: props$S,
3193
3455
  setup(props, { slots, expose }) {
3194
3456
  useForm(expose, {
3195
3457
  throwToast(message) {
@@ -3209,8 +3471,8 @@ const MForm = defineComponent({
3209
3471
  }
3210
3472
  });
3211
3473
 
3212
- const props$P = {
3213
- ...props$S,
3474
+ const props$Q = {
3475
+ ...props$T,
3214
3476
  indent: {
3215
3477
  type: Number,
3216
3478
  default: 12
@@ -3219,10 +3481,10 @@ const props$P = {
3219
3481
 
3220
3482
  /** @jsxImportSource vue */
3221
3483
 
3222
- const COMPONENT_NAME$_ = 'vcm-form-item';
3484
+ const COMPONENT_NAME$12 = 'vcm-form-item';
3223
3485
  const MFormItem = /* @__PURE__ */ defineComponent({
3224
- name: COMPONENT_NAME$_,
3225
- props: props$P,
3486
+ name: COMPONENT_NAME$12,
3487
+ props: props$Q,
3226
3488
  setup(props, {
3227
3489
  slots,
3228
3490
  expose
@@ -3275,9 +3537,9 @@ const MFormItem = /* @__PURE__ */ defineComponent({
3275
3537
  }
3276
3538
  });
3277
3539
 
3278
- const COMPONENT_NAME$Z = "vc-fragment";
3540
+ const COMPONENT_NAME$11 = "vc-fragment";
3279
3541
  const Fragment = defineComponent({
3280
- name: COMPONENT_NAME$Z,
3542
+ name: COMPONENT_NAME$11,
3281
3543
  setup(_, { slots }) {
3282
3544
  return () => h(Fragment$1, slots.default?.());
3283
3545
  }
@@ -3285,7 +3547,7 @@ const Fragment = defineComponent({
3285
3547
 
3286
3548
  const MFragment = Fragment;
3287
3549
 
3288
- const props$O = {
3550
+ const props$P = {
3289
3551
  tag: {
3290
3552
  type: String,
3291
3553
  default: "div"
@@ -3294,10 +3556,10 @@ const props$O = {
3294
3556
 
3295
3557
  /** @jsxImportSource vue */
3296
3558
 
3297
- const COMPONENT_NAME$Y = 'vc-html-to-image';
3559
+ const COMPONENT_NAME$10 = 'vc-html-to-image';
3298
3560
  const HTMLToImage = /* @__PURE__ */ defineComponent({
3299
- name: COMPONENT_NAME$Y,
3300
- props: props$O,
3561
+ name: COMPONENT_NAME$10,
3562
+ props: props$P,
3301
3563
  setup(props, {
3302
3564
  slots
3303
3565
  }) {
@@ -3313,7 +3575,7 @@ const MHTMLToImage = HTMLToImage;
3313
3575
 
3314
3576
  const MIcon = Icon;
3315
3577
 
3316
- const props$N = {
3578
+ const props$O = {
3317
3579
  src: String,
3318
3580
  fit: String,
3319
3581
  lazy: Boolean,
@@ -3372,7 +3634,7 @@ const IMGStore$1 = new IMGStore();
3372
3634
 
3373
3635
  /** @jsxImportSource vue */
3374
3636
 
3375
- const COMPONENT_NAME$X = 'vc-image';
3637
+ const COMPONENT_NAME$$ = 'vc-image';
3376
3638
  let isSupportObjectFit = false;
3377
3639
  window.addEventListener('DOMContentLoaded', () => {
3378
3640
  isSupportObjectFit = !IS_SERVER$1 && document.documentElement.style.objectFit !== undefined;
@@ -3385,9 +3647,9 @@ const ObjectFit = {
3385
3647
  SCALE_DOWN: 'scale-down'
3386
3648
  };
3387
3649
  const Image = /* @__PURE__ */ defineComponent({
3388
- name: COMPONENT_NAME$X,
3650
+ name: COMPONENT_NAME$$,
3389
3651
  inheritAttrs: false,
3390
- props: props$N,
3652
+ props: props$O,
3391
3653
  setup(props, {
3392
3654
  slots,
3393
3655
  emit
@@ -3581,7 +3843,7 @@ const Image = /* @__PURE__ */ defineComponent({
3581
3843
 
3582
3844
  const MImage = Image;
3583
3845
 
3584
- const props$M = {
3846
+ const props$N = {
3585
3847
  tag: {
3586
3848
  type: String,
3587
3849
  default: "div"
@@ -3590,10 +3852,10 @@ const props$M = {
3590
3852
 
3591
3853
  /** @jsxImportSource vue */
3592
3854
 
3593
- const COMPONENT_NAME$W = 'vc-image-crop';
3855
+ const COMPONENT_NAME$_ = 'vc-image-crop';
3594
3856
  const ImageCrop = /* @__PURE__ */ defineComponent({
3595
- name: COMPONENT_NAME$W,
3596
- props: props$M,
3857
+ name: COMPONENT_NAME$_,
3858
+ props: props$N,
3597
3859
  setup(props, {
3598
3860
  slots
3599
3861
  }) {
@@ -3607,7 +3869,7 @@ const ImageCrop = /* @__PURE__ */ defineComponent({
3607
3869
 
3608
3870
  const MImageCrop = ImageCrop;
3609
3871
 
3610
- const props$L = {
3872
+ const props$M = {
3611
3873
  tag: {
3612
3874
  type: String,
3613
3875
  default: "div"
@@ -3616,10 +3878,10 @@ const props$L = {
3616
3878
 
3617
3879
  /** @jsxImportSource vue */
3618
3880
 
3619
- const COMPONENT_NAME$V = 'vc-image-preview';
3881
+ const COMPONENT_NAME$Z = 'vc-image-preview';
3620
3882
  const ImagePreview = /* @__PURE__ */ defineComponent({
3621
- name: COMPONENT_NAME$V,
3622
- props: props$L,
3883
+ name: COMPONENT_NAME$Z,
3884
+ props: props$M,
3623
3885
  setup(props, {
3624
3886
  slots
3625
3887
  }) {
@@ -3633,7 +3895,7 @@ const ImagePreview = /* @__PURE__ */ defineComponent({
3633
3895
 
3634
3896
  const MImagePreview = ImagePreview;
3635
3897
 
3636
- const props$K = {
3898
+ const props$L = {
3637
3899
  tag: {
3638
3900
  type: String,
3639
3901
  default: "div"
@@ -3642,10 +3904,10 @@ const props$K = {
3642
3904
 
3643
3905
  /** @jsxImportSource vue */
3644
3906
 
3645
- const COMPONENT_NAME$U = 'vc-image-processing';
3907
+ const COMPONENT_NAME$Y = 'vc-image-processing';
3646
3908
  const ImageProcessing = /* @__PURE__ */ defineComponent({
3647
- name: COMPONENT_NAME$U,
3648
- props: props$K,
3909
+ name: COMPONENT_NAME$Y,
3910
+ props: props$L,
3649
3911
  setup(props, {
3650
3912
  slots
3651
3913
  }) {
@@ -3659,7 +3921,7 @@ const ImageProcessing = /* @__PURE__ */ defineComponent({
3659
3921
 
3660
3922
  const MImageProcessing = ImageProcessing;
3661
3923
 
3662
- const props$J = {
3924
+ const props$K = {
3663
3925
  // Array, 作为select等数组存放临时值
3664
3926
  modelValue: {
3665
3927
  type: [String, Number, Array],
@@ -3913,12 +4175,12 @@ const useNativeEmitter = (input, expose) => {
3913
4175
 
3914
4176
  /** @jsxImportSource vue */
3915
4177
 
3916
- const COMPONENT_NAME$T = 'vc-input';
4178
+ const COMPONENT_NAME$X = 'vc-input';
3917
4179
  const Input = /* @__PURE__ */ defineComponent({
3918
- name: COMPONENT_NAME$T,
4180
+ name: COMPONENT_NAME$X,
3919
4181
  inheritAttrs: false,
3920
4182
  props: {
3921
- ...props$J,
4183
+ ...props$K,
3922
4184
  indicator: {
3923
4185
  type: [Boolean, Object],
3924
4186
  default: false
@@ -4019,8 +4281,8 @@ const Input = /* @__PURE__ */ defineComponent({
4019
4281
  }
4020
4282
  });
4021
4283
 
4022
- const props$I = {
4023
- ...props$J,
4284
+ const props$J = {
4285
+ ...props$K,
4024
4286
  min: {
4025
4287
  type: Number,
4026
4288
  default: 0
@@ -4235,10 +4497,10 @@ const useInputNumber = () => {
4235
4497
 
4236
4498
  /** @jsxImportSource vue */
4237
4499
 
4238
- const COMPONENT_NAME$S = 'vc-input-number';
4500
+ const COMPONENT_NAME$W = 'vc-input-number';
4239
4501
  const InputNumber = /* @__PURE__ */ defineComponent({
4240
- name: COMPONENT_NAME$S,
4241
- props: props$I,
4502
+ name: COMPONENT_NAME$W,
4503
+ props: props$J,
4242
4504
  inheritAttrs: false,
4243
4505
  setup(props, {
4244
4506
  slots,
@@ -4269,28 +4531,30 @@ const InputNumber = /* @__PURE__ */ defineComponent({
4269
4531
  ...listeners
4270
4532
  }), {
4271
4533
  prepend: slots.prepend && (() => slots.prepend?.()),
4272
- append: props.step && (() => slots.append?.() || createVNode("div", {
4273
- "class": "vc-input-number__icon"
4274
- }, [createVNode("div", {
4275
- "class": "vc-input-number__up",
4276
- "disabled": plusDisabled.value ? 'disabled' : undefined,
4277
- "onClick": e => handleStepper(e, 1)
4278
- }, [createVNode(Icon, {
4279
- "type": "up"
4280
- }, null)]), createVNode("div", {
4281
- "class": "vc-input-number__down",
4282
- "disabled": minusDisabled.value ? 'disabled' : undefined,
4283
- "onClick": e => handleStepper(e, -1)
4284
- }, [createVNode(Icon, {
4285
- "type": "down"
4286
- }, null)])]))
4534
+ append: props.step ? slots.append ? () => slots.append?.() : () => {
4535
+ return createVNode("div", {
4536
+ "class": "vc-input-number__icon"
4537
+ }, [createVNode("div", {
4538
+ "class": "vc-input-number__up",
4539
+ "disabled": plusDisabled.value ? 'disabled' : undefined,
4540
+ "onClick": e => handleStepper(e, 1)
4541
+ }, [createVNode(Icon, {
4542
+ "type": "up"
4543
+ }, null)]), createVNode("div", {
4544
+ "class": "vc-input-number__down",
4545
+ "disabled": minusDisabled.value ? 'disabled' : undefined,
4546
+ "onClick": e => handleStepper(e, -1)
4547
+ }, [createVNode(Icon, {
4548
+ "type": "down"
4549
+ }, null)])]);
4550
+ } : undefined
4287
4551
  });
4288
4552
  };
4289
4553
  }
4290
4554
  });
4291
4555
 
4292
- const props$H = {
4293
- ...props$J,
4556
+ const props$I = {
4557
+ ...props$K,
4294
4558
  enterText: {
4295
4559
  type: [Boolean, String],
4296
4560
  default: true
@@ -4299,10 +4563,10 @@ const props$H = {
4299
4563
 
4300
4564
  /** @jsxImportSource vue */
4301
4565
 
4302
- const COMPONENT_NAME$R = 'vc-input-search';
4566
+ const COMPONENT_NAME$V = 'vc-input-search';
4303
4567
  const InputSearch = /* @__PURE__ */ defineComponent({
4304
- name: COMPONENT_NAME$R,
4305
- props: props$H,
4568
+ name: COMPONENT_NAME$V,
4569
+ props: props$I,
4306
4570
  inheritAttrs: false,
4307
4571
  setup(props, {
4308
4572
  emit,
@@ -4336,12 +4600,12 @@ const InputSearch = /* @__PURE__ */ defineComponent({
4336
4600
 
4337
4601
  /** @jsxImportSource vue */
4338
4602
 
4339
- const COMPONENT_NAME$Q = 'vcm-input';
4603
+ const COMPONENT_NAME$U = 'vcm-input';
4340
4604
  const MInput = /* @__PURE__ */ defineComponent({
4341
- name: COMPONENT_NAME$Q,
4605
+ name: COMPONENT_NAME$U,
4342
4606
  inheritAttrs: false,
4343
4607
  props: {
4344
- ...props$J,
4608
+ ...props$K,
4345
4609
  right: {
4346
4610
  type: Boolean,
4347
4611
  default: false
@@ -4427,10 +4691,10 @@ const MInput = /* @__PURE__ */ defineComponent({
4427
4691
 
4428
4692
  /** @jsxImportSource vue */
4429
4693
 
4430
- const COMPONENT_NAME$P = 'vcm-input-number';
4694
+ const COMPONENT_NAME$T = 'vcm-input-number';
4431
4695
  const MInputNumber = /* @__PURE__ */ defineComponent({
4432
- name: COMPONENT_NAME$P,
4433
- props: props$I,
4696
+ name: COMPONENT_NAME$T,
4697
+ props: props$J,
4434
4698
  inheritAttrs: false,
4435
4699
  setup(props, {
4436
4700
  slots,
@@ -4478,11 +4742,11 @@ const MInputNumber = /* @__PURE__ */ defineComponent({
4478
4742
 
4479
4743
  /** @jsxImportSource vue */
4480
4744
 
4481
- const COMPONENT_NAME$O = 'vcm-input-search';
4745
+ const COMPONENT_NAME$S = 'vcm-input-search';
4482
4746
  const MInputSearch = /* @__PURE__ */ defineComponent({
4483
- name: COMPONENT_NAME$O,
4747
+ name: COMPONENT_NAME$S,
4484
4748
  props: {
4485
- ...props$H,
4749
+ ...props$I,
4486
4750
  cancelText: {
4487
4751
  type: String,
4488
4752
  default: '取消'
@@ -4542,7 +4806,7 @@ const MInputSearch = /* @__PURE__ */ defineComponent({
4542
4806
  }
4543
4807
  });
4544
4808
 
4545
- const props$G = {
4809
+ const props$H = {
4546
4810
  tag: {
4547
4811
  type: String,
4548
4812
  default: "div"
@@ -4557,10 +4821,10 @@ const props$G = {
4557
4821
  }
4558
4822
  };
4559
4823
 
4560
- const COMPONENT_NAME$N = "vcm-list";
4824
+ const COMPONENT_NAME$R = "vcm-list";
4561
4825
  const MList = defineComponent({
4562
- name: COMPONENT_NAME$N,
4563
- props: props$G,
4826
+ name: COMPONENT_NAME$R,
4827
+ props: props$H,
4564
4828
  setup(props, { slots }) {
4565
4829
  provide("vc-list", { props });
4566
4830
  return () => {
@@ -4580,7 +4844,7 @@ const MList = defineComponent({
4580
4844
  }
4581
4845
  });
4582
4846
 
4583
- const props$F = {
4847
+ const props$G = {
4584
4848
  tag: {
4585
4849
  type: String,
4586
4850
  default: "div"
@@ -4614,11 +4878,11 @@ const props$F = {
4614
4878
 
4615
4879
  /** @jsxImportSource vue */
4616
4880
 
4617
- const COMPONENT_NAME$M = 'vcm-list-item';
4881
+ const COMPONENT_NAME$Q = 'vcm-list-item';
4618
4882
  const HTTP_REGEX = /[a-zA-z]+:\/\/[^\s]*/;
4619
4883
  const MListItem = /* @__PURE__ */ defineComponent({
4620
- name: COMPONENT_NAME$M,
4621
- props: props$F,
4884
+ name: COMPONENT_NAME$Q,
4885
+ props: props$G,
4622
4886
  emits: ['click'],
4623
4887
  setup(props, {
4624
4888
  slots,
@@ -4692,33 +4956,85 @@ const MListItem = /* @__PURE__ */ defineComponent({
4692
4956
  }
4693
4957
  });
4694
4958
 
4695
- const props$E = {
4696
- tag: {
4697
- type: String,
4698
- default: "div"
4959
+ const props$F = {
4960
+ // 每秒移动多少px
4961
+ speed: {
4962
+ type: Number,
4963
+ default: 50
4964
+ },
4965
+ content: [String, Function],
4966
+ animated: {
4967
+ type: Boolean,
4968
+ default: true
4969
+ },
4970
+ autoplay: {
4971
+ type: Boolean,
4972
+ default: false
4699
4973
  }
4700
4974
  };
4701
4975
 
4702
4976
  /** @jsxImportSource vue */
4703
4977
 
4704
- const COMPONENT_NAME$L = 'vc-marquee';
4978
+ const COMPONENT_NAME$P = 'vc-marquee';
4979
+ const ANIMATION = prefixStyle('animation').camel;
4980
+ const TRANSFORM_KEBAB = prefixStyle('transform').kebab;
4705
4981
  const Marquee = /* @__PURE__ */ defineComponent({
4706
- name: COMPONENT_NAME$L,
4707
- props: props$E,
4982
+ name: COMPONENT_NAME$P,
4983
+ props: props$F,
4708
4984
  setup(props, {
4709
4985
  slots
4710
4986
  }) {
4987
+ const instance = getCurrentInstance();
4988
+ const duration = ref(0);
4989
+ const elW = ref(0);
4990
+ const contentW = ref(0);
4991
+ const marqueeId = ref(getUid('marquee'));
4992
+ const paused = computed(() => {
4993
+ return !props.animated || !props.autoplay && contentW.value < elW.value;
4994
+ });
4995
+ const style$1 = computed(() => {
4996
+ return {
4997
+ [ANIMATION]: `${marqueeId.value} ${duration.value}s linear 0s ${paused.value ? 'paused' : 'running'} infinite`
4998
+ };
4999
+ });
5000
+ const refresh = () => {
5001
+ elW.value = instance.vnode.el.offsetWidth;
5002
+ contentW.value = instance.vnode.el.firstChild.offsetWidth;
5003
+ if (paused.value) return;
5004
+ const FROM = `from { ${TRANSFORM_KEBAB}: translateX(${elW.value}px) }`;
5005
+ const TO = `to { ${TRANSFORM_KEBAB}: translateX(-${contentW.value}px) }`;
5006
+ style(`@keyframes ${marqueeId.value} { ${FROM} ${TO} }`);
5007
+ duration.value = (elW.value + contentW.value) / props.speed;
5008
+ };
5009
+
5010
+ // TODO: content render和slot下也支持重置
5011
+ ['content', 'speed'].forEach(key => {
5012
+ watch(() => props[key], refresh);
5013
+ });
5014
+ onMounted(() => {
5015
+ // 兼容Portal前动画延迟
5016
+ setTimeout(refresh, 0);
5017
+ });
4711
5018
  return () => {
4712
5019
  return createVNode("div", {
4713
5020
  "class": "vc-marquee"
4714
- }, [slots?.default?.()]);
5021
+ }, [createVNode("div", {
5022
+ "style": style$1.value,
5023
+ "class": [{
5024
+ 'is-paused': paused.value
5025
+ }, 'vc-marquee__content']
5026
+ }, [slots.defalut ? slots.defalut() : typeof props.content === 'string' ? createVNode("div", {
5027
+ "innerHTML": props.content
5028
+ }, null) : typeof props.content === 'function' ? createVNode(Customer, {
5029
+ "render": props.content
5030
+ }, null) : null])]);
4715
5031
  };
4716
5032
  }
4717
5033
  });
4718
5034
 
4719
5035
  const MMarquee = Marquee;
4720
5036
 
4721
- const props$D = {
5037
+ const props$E = {
4722
5038
  content: [String, Function],
4723
5039
  mask: {
4724
5040
  type: Boolean,
@@ -4756,11 +5072,11 @@ const props$D = {
4756
5072
 
4757
5073
  /** @jsxImportSource vue */
4758
5074
 
4759
- const COMPONENT_NAME$K = 'vc-message';
5075
+ const COMPONENT_NAME$O = 'vc-message';
4760
5076
  const MessageView = /* @__PURE__ */ defineComponent({
4761
- name: COMPONENT_NAME$K,
5077
+ name: COMPONENT_NAME$O,
4762
5078
  emits: ['before-close', 'close', 'portal-fulfilled'],
4763
- props: props$D,
5079
+ props: props$E,
4764
5080
  setup(props, {
4765
5081
  emit,
4766
5082
  expose
@@ -4901,7 +5217,7 @@ const Message$1 = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty(
4901
5217
 
4902
5218
  const MMessage = Message$1;
4903
5219
 
4904
- const props$C = {
5220
+ const props$D = {
4905
5221
  modelValue: {
4906
5222
  type: Boolean,
4907
5223
  default: false
@@ -4981,12 +5297,12 @@ const props$C = {
4981
5297
 
4982
5298
  /** @jsxImportSource vue */
4983
5299
 
4984
- const COMPONENT_NAME$J = 'vc-modal';
5300
+ const COMPONENT_NAME$N = 'vc-modal';
4985
5301
  let zIndexNumber = 1002;
4986
5302
  const ModalView = /* @__PURE__ */ defineComponent({
4987
- name: COMPONENT_NAME$J,
5303
+ name: COMPONENT_NAME$N,
4988
5304
  emits: ['update:modelValue', 'close', 'portal-fulfilled', 'visible-change', 'ok', 'cancel'],
4989
- props: props$C,
5305
+ props: props$D,
4990
5306
  setup(props, {
4991
5307
  slots,
4992
5308
  emit,
@@ -5325,7 +5641,7 @@ const modal$1 = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
5325
5641
  warning: warning$1
5326
5642
  }, Symbol.toStringTag, { value: 'Module' }));
5327
5643
 
5328
- const props$B = {
5644
+ const props$C = {
5329
5645
  mode: {
5330
5646
  type: String,
5331
5647
  validator: (v) => /(alert|operation)/.test(v),
@@ -5387,11 +5703,11 @@ const props$B = {
5387
5703
 
5388
5704
  /** @jsxImportSource vue */
5389
5705
 
5390
- const COMPONENT_NAME$I = 'vc-modal';
5706
+ const COMPONENT_NAME$M = 'vc-modal';
5391
5707
  const MModalView = /* @__PURE__ */ defineComponent({
5392
- name: COMPONENT_NAME$I,
5708
+ name: COMPONENT_NAME$M,
5393
5709
  emits: ['update:modelValue', 'portal-fulfilled', 'close', 'ok', 'cancel'],
5394
- props: props$B,
5710
+ props: props$C,
5395
5711
  setup(props, {
5396
5712
  slots,
5397
5713
  emit,
@@ -5564,7 +5880,7 @@ const modal = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
5564
5880
  operation
5565
5881
  }, Symbol.toStringTag, { value: 'Module' }));
5566
5882
 
5567
- const props$A = {
5883
+ const props$B = {
5568
5884
  title: [String, Function],
5569
5885
  content: [String, Function],
5570
5886
  // 单位ms
@@ -5594,10 +5910,10 @@ const props$A = {
5594
5910
 
5595
5911
  /** @jsxImportSource vue */
5596
5912
 
5597
- const COMPONENT_NAME$H = 'vc-notice';
5913
+ const COMPONENT_NAME$L = 'vc-notice';
5598
5914
  const NoticeView = /* @__PURE__ */ defineComponent({
5599
- name: COMPONENT_NAME$H,
5600
- props: props$A,
5915
+ name: COMPONENT_NAME$L,
5916
+ props: props$B,
5601
5917
  emits: ['portal-fulfilled', 'close', 'before-close'],
5602
5918
  setup(props, {
5603
5919
  emit,
@@ -5769,7 +6085,7 @@ const Notice$1 = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
5769
6085
 
5770
6086
  const MNotice = Notice$1;
5771
6087
 
5772
- const props$z = {
6088
+ const props$A = {
5773
6089
  tag: {
5774
6090
  type: String,
5775
6091
  default: "div"
@@ -5778,10 +6094,10 @@ const props$z = {
5778
6094
 
5779
6095
  /** @jsxImportSource vue */
5780
6096
 
5781
- const COMPONENT_NAME$G = 'vc-option';
6097
+ const COMPONENT_NAME$K = 'vc-option';
5782
6098
  const Option = /* @__PURE__ */ defineComponent({
5783
- name: COMPONENT_NAME$G,
5784
- props: props$z,
6099
+ name: COMPONENT_NAME$K,
6100
+ props: props$A,
5785
6101
  setup(props, {
5786
6102
  slots
5787
6103
  }) {
@@ -5795,7 +6111,7 @@ const Option = /* @__PURE__ */ defineComponent({
5795
6111
 
5796
6112
  const MOption = Option;
5797
6113
 
5798
- const props$y = {
6114
+ const props$z = {
5799
6115
  tag: {
5800
6116
  type: String,
5801
6117
  default: "div"
@@ -5804,10 +6120,10 @@ const props$y = {
5804
6120
 
5805
6121
  /** @jsxImportSource vue */
5806
6122
 
5807
- const COMPONENT_NAME$F = 'vc-page';
6123
+ const COMPONENT_NAME$J = 'vc-page';
5808
6124
  const Page = /* @__PURE__ */ defineComponent({
5809
- name: COMPONENT_NAME$F,
5810
- props: props$y,
6125
+ name: COMPONENT_NAME$J,
6126
+ props: props$z,
5811
6127
  setup(props, {
5812
6128
  slots
5813
6129
  }) {
@@ -5821,7 +6137,7 @@ const Page = /* @__PURE__ */ defineComponent({
5821
6137
 
5822
6138
  const MPage = Page;
5823
6139
 
5824
- const props$x = {
6140
+ const props$y = {
5825
6141
  tag: {
5826
6142
  type: String,
5827
6143
  default: "div"
@@ -5830,10 +6146,10 @@ const props$x = {
5830
6146
 
5831
6147
  /** @jsxImportSource vue */
5832
6148
 
5833
- const COMPONENT_NAME$E = 'vc-picker';
6149
+ const COMPONENT_NAME$I = 'vc-picker';
5834
6150
  const Picker = /* @__PURE__ */ defineComponent({
5835
- name: COMPONENT_NAME$E,
5836
- props: props$x,
6151
+ name: COMPONENT_NAME$I,
6152
+ props: props$y,
5837
6153
  setup(props, {
5838
6154
  slots
5839
6155
  }) {
@@ -5847,7 +6163,7 @@ const Picker = /* @__PURE__ */ defineComponent({
5847
6163
 
5848
6164
  const MPicker = Picker;
5849
6165
 
5850
- const props$w = {
6166
+ const props$x = {
5851
6167
  tag: {
5852
6168
  type: String,
5853
6169
  default: "div"
@@ -5856,10 +6172,10 @@ const props$w = {
5856
6172
 
5857
6173
  /** @jsxImportSource vue */
5858
6174
 
5859
- const COMPONENT_NAME$D = 'vc-popconfirm';
6175
+ const COMPONENT_NAME$H = 'vc-popconfirm';
5860
6176
  const Popconfirm = /* @__PURE__ */ defineComponent({
5861
- name: COMPONENT_NAME$D,
5862
- props: props$w,
6177
+ name: COMPONENT_NAME$H,
6178
+ props: props$x,
5863
6179
  setup(props, {
5864
6180
  slots
5865
6181
  }) {
@@ -5873,7 +6189,7 @@ const Popconfirm = /* @__PURE__ */ defineComponent({
5873
6189
 
5874
6190
  const MPopconfirm = Popconfirm;
5875
6191
 
5876
- const props$v = {
6192
+ const props$w = {
5877
6193
  modelValue: Boolean,
5878
6194
  animation: String,
5879
6195
  placement: {
@@ -5930,7 +6246,7 @@ const props$v = {
5930
6246
  // 直接传送门标记调用时，hover需要绑定事件
5931
6247
  alone: {
5932
6248
  type: Boolean,
5933
- default: false
6249
+ default: true
5934
6250
  },
5935
6251
  hover: Boolean,
5936
6252
  always: Boolean,
@@ -5952,7 +6268,7 @@ const wrapperKeys = [
5952
6268
  "autoWidth",
5953
6269
  "always"
5954
6270
  ];
5955
- const props$u = {
6271
+ const props$v = {
5956
6272
  trigger: {
5957
6273
  type: String,
5958
6274
  default: "hover",
@@ -5970,7 +6286,7 @@ const props$u = {
5970
6286
  type: Boolean,
5971
6287
  default: true
5972
6288
  },
5973
- ...pick(props$v, wrapperKeys)
6289
+ ...pick(props$w, wrapperKeys)
5974
6290
  };
5975
6291
 
5976
6292
  const EXTRA_DISTANCE = 4;
@@ -6048,7 +6364,7 @@ const usePos = () => {
6048
6364
  const topSurplus = topDistance - el.offsetHeight;
6049
6365
  switch (direction[0]) {
6050
6366
  case "left":
6051
- if (popupRect.x - el.offsetWidth < 0) {
6367
+ if (popupRect.x - el.offsetWidth < 0 && leftSurplus < rightSurplus) {
6052
6368
  placement = placement.replace("left", "right");
6053
6369
  }
6054
6370
  placement = getYAssistFitPos({
@@ -6063,7 +6379,7 @@ const usePos = () => {
6063
6379
  break;
6064
6380
  case "right":
6065
6381
  remanentW = window.innerWidth - popupRect.x - popupRect.width - el.offsetWidth;
6066
- if (remanentW < 0) {
6382
+ if (remanentW < 0 && rightSurplus < leftSurplus) {
6067
6383
  placement = placement.replace("right", "left");
6068
6384
  }
6069
6385
  placement = getYAssistFitPos({
@@ -6077,7 +6393,7 @@ const usePos = () => {
6077
6393
  });
6078
6394
  break;
6079
6395
  case "top":
6080
- if (popupRect.y - el.offsetHeight < 0) {
6396
+ if (popupRect.y - el.offsetHeight < 0 && topSurplus < bottomSurplus) {
6081
6397
  placement = placement.replace("top", "bottom");
6082
6398
  }
6083
6399
  placement = getXAssistFitPos({
@@ -6092,7 +6408,7 @@ const usePos = () => {
6092
6408
  break;
6093
6409
  case "bottom":
6094
6410
  remanentH = window.innerHeight - popupRect.y - popupRect.height - el.offsetHeight;
6095
- if (remanentH < 0) {
6411
+ if (remanentH < 0 && bottomSurplus < topSurplus) {
6096
6412
  placement = placement.replace("bottom", "top");
6097
6413
  }
6098
6414
  placement = getXAssistFitPos({
@@ -6231,10 +6547,10 @@ const usePos = () => {
6231
6547
  function _isSlot(s) {
6232
6548
  return typeof s === 'function' || Object.prototype.toString.call(s) === '[object Object]' && !isVNode(s);
6233
6549
  }
6234
- const COMPONENT_NAME$C = 'vc-popover-wrapper';
6550
+ const COMPONENT_NAME$G = 'vc-popover-wrapper';
6235
6551
  const PopoverWrapper = /* @__PURE__ */ defineComponent({
6236
- name: COMPONENT_NAME$C,
6237
- props: props$v,
6552
+ name: COMPONENT_NAME$G,
6553
+ props: props$w,
6238
6554
  emits: ['portal-fulfilled', 'close'],
6239
6555
  setup(props, {
6240
6556
  emit,
@@ -6422,18 +6738,15 @@ const PopoverWrapper = /* @__PURE__ */ defineComponent({
6422
6738
  props.alone && props.hover && bindEvents();
6423
6739
  onMounted(() => {
6424
6740
  isActive.value = true;
6425
- nextTick(() => {
6426
- setPopupStyle();
6427
- });
6428
-
6429
6741
  // 捕获阶段执行
6430
6742
  !props.hover && document.addEventListener('click', handleClick, true);
6431
6743
  // 监听body的滚动
6432
6744
  document.addEventListener('scroll', setPopupStyle);
6433
6745
  // 监听触发节点的Resize
6434
- Resize.on(props.triggerEl, setPopupStyle);
6746
+ Resize.on(props.triggerEl, setPopupStyle); // 首次会执行一次
6435
6747
  // 监听弹层的Resize
6436
- Resize.on(vnode.el, handleWrapperResize);
6748
+ Resize.on(vnode.el, handleWrapperResize); // 首次会执行一次
6749
+
6437
6750
  props.onReady && props.onReady();
6438
6751
  });
6439
6752
  onUnmounted(() => {
@@ -6488,10 +6801,10 @@ const PopoverPortal = new Portal(PopoverWrapper);
6488
6801
 
6489
6802
  /** @jsxImportSource vue */
6490
6803
 
6491
- const COMPONENT_NAME$B = 'vc-popover';
6804
+ const COMPONENT_NAME$F = 'vc-popover';
6492
6805
  const Popover = /* @__PURE__ */ defineComponent({
6493
- name: COMPONENT_NAME$B,
6494
- props: props$u,
6806
+ name: COMPONENT_NAME$F,
6807
+ props: props$v,
6495
6808
  emits: ['update:modelValue', 'visible-change', 'ready', 'close'],
6496
6809
  open: PopoverPortal.popup.bind(PopoverPortal),
6497
6810
  setup(props, {
@@ -6561,10 +6874,12 @@ const Popover = /* @__PURE__ */ defineComponent({
6561
6874
  let {
6562
6875
  portalClass
6563
6876
  } = props;
6564
- typeof portalClass === 'object' ? portalClass instanceof Array ? portalClass.push(popoverId) : portalClass[popoverId] = true : portalClass += ` ${popoverId}`;
6877
+ typeof portalClass === 'object' ? portalClass instanceof Array ? portalClass.push(popoverId) : portalClass[popoverId] = true : portalClass = `${portalClass || ''} ${popoverId}`;
6565
6878
  popperInstance = PopoverPortal.popup({
6566
6879
  el,
6567
- cName: popoverId,
6880
+ alone: false,
6881
+ // 由当前组件控制hover/click等情况
6882
+ name: popoverId,
6568
6883
  triggerEl: instance.vnode.el,
6569
6884
  onChange: handleChange,
6570
6885
  // @ts-ignore
@@ -6628,6 +6943,34 @@ const Popover = /* @__PURE__ */ defineComponent({
6628
6943
 
6629
6944
  const MPopover = Popover;
6630
6945
 
6946
+ const props$u = {
6947
+ tag: {
6948
+ type: String,
6949
+ default: "div"
6950
+ }
6951
+ };
6952
+
6953
+ /** @jsxImportSource vue */
6954
+
6955
+ const COMPONENT_NAME$E = 'vc-popup';
6956
+ const Popup = /* @__PURE__ */ defineComponent({
6957
+ name: COMPONENT_NAME$E,
6958
+ props: props$u,
6959
+ setup(props, {
6960
+ slots
6961
+ }) {
6962
+ return () => {
6963
+ return createVNode("div", {
6964
+ "class": "vc-popup"
6965
+ }, [slots?.default?.()]);
6966
+ };
6967
+ }
6968
+ });
6969
+
6970
+ const MPopup = Popup;
6971
+
6972
+ const MPortal = Portal;
6973
+
6631
6974
  const props$t = {
6632
6975
  tag: {
6633
6976
  type: String,
@@ -6635,105 +6978,371 @@ const props$t = {
6635
6978
  }
6636
6979
  };
6637
6980
 
6638
- /** @jsxImportSource vue */
6639
-
6640
- const COMPONENT_NAME$A = 'vc-popup';
6641
- const Popup = /* @__PURE__ */ defineComponent({
6642
- name: COMPONENT_NAME$A,
6643
- props: props$t,
6644
- setup(props, {
6645
- slots
6646
- }) {
6647
- return () => {
6648
- return createVNode("div", {
6649
- "class": "vc-popup"
6650
- }, [slots?.default?.()]);
6981
+ /** @jsxImportSource vue */
6982
+
6983
+ const COMPONENT_NAME$D = 'vc-print';
6984
+ const Print = /* @__PURE__ */ defineComponent({
6985
+ name: COMPONENT_NAME$D,
6986
+ props: props$t,
6987
+ setup(props, {
6988
+ slots
6989
+ }) {
6990
+ return () => {
6991
+ return createVNode("div", {
6992
+ "class": "vc-print"
6993
+ }, [slots?.default?.()]);
6994
+ };
6995
+ }
6996
+ });
6997
+
6998
+ const MPrint = Print;
6999
+
7000
+ const props$s = {
7001
+ tag: {
7002
+ type: String,
7003
+ default: "div"
7004
+ }
7005
+ };
7006
+
7007
+ /** @jsxImportSource vue */
7008
+
7009
+ const COMPONENT_NAME$C = 'vc-progress';
7010
+ const Progress = /* @__PURE__ */ defineComponent({
7011
+ name: COMPONENT_NAME$C,
7012
+ props: props$s,
7013
+ setup(props, {
7014
+ slots
7015
+ }) {
7016
+ return () => {
7017
+ return createVNode("div", {
7018
+ "class": "vc-progress"
7019
+ }, [slots?.default?.()]);
7020
+ };
7021
+ }
7022
+ });
7023
+
7024
+ const MProgress = Progress;
7025
+
7026
+ const props$r = {
7027
+ disabled: {
7028
+ type: Boolean,
7029
+ default: false
7030
+ },
7031
+ modelValue: {
7032
+ type: [String, Number, Boolean],
7033
+ default: false
7034
+ },
7035
+ value: {
7036
+ type: [String, Number, Boolean],
7037
+ default: void 0
7038
+ },
7039
+ label: {
7040
+ type: [String, Number, Boolean],
7041
+ default: void 0
7042
+ },
7043
+ name: {
7044
+ type: String
7045
+ },
7046
+ /**
7047
+ * group模式下无效
7048
+ */
7049
+ trueValue: {
7050
+ type: [String, Number, Boolean],
7051
+ default: true
7052
+ },
7053
+ falseValue: {
7054
+ type: [String, Number, Boolean],
7055
+ default: false
7056
+ }
7057
+ };
7058
+
7059
+ const useRadio = () => {
7060
+ const { props, emit } = getCurrentInstance();
7061
+ const group = inject("vc-radio-group", {});
7062
+ const formItem = inject("vc-form-item", {});
7063
+ const currentValue = ref(void 0);
7064
+ const isFocus = ref(false);
7065
+ const computedValue = computed(() => {
7066
+ return typeof props.value === "undefined" || props.value === "" ? props.label : props.value;
7067
+ });
7068
+ const computedLabel = computed(() => {
7069
+ return typeof props.label === "undefined" || props.label === "" ? props.value : props.label;
7070
+ });
7071
+ const hasGroup = computed(() => {
7072
+ return !!group.props;
7073
+ });
7074
+ const checked = computed(() => {
7075
+ return hasGroup.value ? group.currentValue.value === computedValue.value : currentValue.value === props.checkedValue;
7076
+ });
7077
+ const radioName = computed(() => {
7078
+ return hasGroup.value ? group.props.name : props.name;
7079
+ });
7080
+ const isDisabled = computed(() => {
7081
+ return hasGroup.value ? group.props.disabled || props.disabled : props.disabled;
7082
+ });
7083
+ const classes = computed(() => {
7084
+ return {
7085
+ "is-checked": checked.value,
7086
+ "is-disabled": isDisabled.value,
7087
+ "is-focus": isFocus.value
7088
+ };
7089
+ });
7090
+ watch(
7091
+ () => props.modelValue,
7092
+ (v) => {
7093
+ currentValue.value = v;
7094
+ },
7095
+ { immediate: true }
7096
+ );
7097
+ const reset = ($checked) => {
7098
+ currentValue.value = $checked ? props.checkedValue : props.uncheckedValue;
7099
+ };
7100
+ const sync = (e) => {
7101
+ emit("update:modelValue", currentValue.value, e, reset);
7102
+ emit("change", currentValue.value, e, reset);
7103
+ formItem?.change?.(currentValue.value);
7104
+ };
7105
+ const handleChange = (e) => {
7106
+ if (props.disabled) {
7107
+ return false;
7108
+ }
7109
+ const $checked = e.target.checked;
7110
+ if (hasGroup.value) {
7111
+ group.reset(computedValue.value);
7112
+ group.sync(e);
7113
+ } else {
7114
+ reset($checked);
7115
+ sync(e);
7116
+ }
7117
+ };
7118
+ const handleBlur = () => {
7119
+ isFocus.value = false;
7120
+ };
7121
+ const handleFocus = () => {
7122
+ isFocus.value = true;
7123
+ };
7124
+ return {
7125
+ currentValue,
7126
+ isFocus,
7127
+ isDisabled,
7128
+ radioName,
7129
+ classes,
7130
+ hasGroup,
7131
+ checked,
7132
+ handleChange,
7133
+ handleBlur,
7134
+ handleFocus,
7135
+ sync,
7136
+ reset,
7137
+ computedValue,
7138
+ computedLabel
7139
+ };
7140
+ };
7141
+
7142
+ /** @jsxImportSource vue */
7143
+
7144
+ const COMPONENT_NAME$B = 'vc-radio';
7145
+ const Radio = /* @__PURE__ */ defineComponent({
7146
+ name: COMPONENT_NAME$B,
7147
+ props: props$r,
7148
+ emits: ['update:modelValue', 'change'],
7149
+ setup(props, {
7150
+ slots
7151
+ }) {
7152
+ const {
7153
+ radioName,
7154
+ checked,
7155
+ classes,
7156
+ computedLabel,
7157
+ handleChange,
7158
+ handleFocus,
7159
+ handleBlur
7160
+ } = useRadio();
7161
+ return () => {
7162
+ return createVNode("label", {
7163
+ "class": [classes.value, 'vc-radio']
7164
+ }, [createVNode("span", {
7165
+ "class": [{
7166
+ 'has-sibling': !!(computedLabel.value || slots.default)
7167
+ }, 'vc-radio__wrapper']
7168
+ }, [createVNode("span", {
7169
+ "class": "vc-radio__border"
7170
+ }, [createVNode("span", {
7171
+ "class": "vc-radio__inner"
7172
+ }, null)]), createVNode("input", {
7173
+ "checked": checked.value,
7174
+ "name": radioName.value,
7175
+ "disabled": props.disabled,
7176
+ "type": "radio",
7177
+ "onChange": handleChange,
7178
+ "onFocus": handleFocus,
7179
+ "onBlur": handleBlur
7180
+ }, null)]), slots.default ? slots.default() : computedLabel.value && createVNode("span", null, [computedLabel.value])]);
7181
+ };
7182
+ }
7183
+ });
7184
+
7185
+ const props$q = {
7186
+ modelValue: {
7187
+ type: [String, Number],
7188
+ default: ""
7189
+ },
7190
+ type: {
7191
+ type: String,
7192
+ default: ""
7193
+ // 'button'
7194
+ },
7195
+ vertical: {
7196
+ type: Boolean,
7197
+ default: false
7198
+ },
7199
+ name: {
7200
+ type: String,
7201
+ default: () => getUid("radio")
7202
+ },
7203
+ disabled: {
7204
+ type: Boolean,
7205
+ default: false
7206
+ },
7207
+ fragment: {
7208
+ type: Boolean,
7209
+ default: false
7210
+ }
7211
+ };
7212
+
7213
+ const useRadioGroup = () => {
7214
+ const { props, emit } = getCurrentInstance();
7215
+ const formItem = inject("vc-form-item", {});
7216
+ const currentValue = ref("");
7217
+ const classes = computed(() => {
7218
+ return {
7219
+ "is-vertical": props.vertical,
7220
+ "is-button": props.type === "button"
6651
7221
  };
6652
- }
6653
- });
6654
-
6655
- const MPopup = Popup;
6656
-
6657
- const MPortal = Portal;
6658
-
6659
- const props$s = {
6660
- tag: {
6661
- type: String,
6662
- default: "div"
6663
- }
7222
+ });
7223
+ watch(
7224
+ () => props.modelValue,
7225
+ (v) => {
7226
+ if (isEqualWith(v, currentValue.value)) {
7227
+ return;
7228
+ }
7229
+ currentValue.value = v;
7230
+ },
7231
+ { immediate: true }
7232
+ );
7233
+ const reset = (v) => {
7234
+ currentValue.value = v;
7235
+ };
7236
+ const sync = (e) => {
7237
+ emit("update:modelValue", currentValue.value, e, reset);
7238
+ emit("change", currentValue.value, e, reset);
7239
+ formItem?.change?.(currentValue.value);
7240
+ };
7241
+ provide("vc-radio-group", {
7242
+ props,
7243
+ currentValue,
7244
+ reset,
7245
+ sync
7246
+ });
7247
+ return {
7248
+ currentValue,
7249
+ classes,
7250
+ sync,
7251
+ reset
7252
+ };
6664
7253
  };
6665
7254
 
6666
7255
  /** @jsxImportSource vue */
6667
7256
 
6668
- const COMPONENT_NAME$z = 'vc-print';
6669
- const Print = /* @__PURE__ */ defineComponent({
6670
- name: COMPONENT_NAME$z,
6671
- props: props$s,
7257
+ const COMPONENT_NAME$A = 'vc-radio-group';
7258
+ const RadioGroup = /* @__PURE__ */ defineComponent({
7259
+ name: COMPONENT_NAME$A,
7260
+ props: props$q,
7261
+ emits: ['update:modelValue', 'change'],
6672
7262
  setup(props, {
6673
7263
  slots
6674
7264
  }) {
7265
+ const {
7266
+ classes
7267
+ } = useRadioGroup();
6675
7268
  return () => {
7269
+ if (props.fragment) return slots.default?.();
6676
7270
  return createVNode("div", {
6677
- "class": "vc-print"
7271
+ "class": "vc-radio-group",
7272
+ "style": classes.value,
7273
+ "name": props.name
6678
7274
  }, [slots?.default?.()]);
6679
7275
  };
6680
7276
  }
6681
7277
  });
6682
7278
 
6683
- const MPrint = Print;
6684
-
6685
- const props$r = {
6686
- tag: {
6687
- type: String,
6688
- default: "div"
6689
- }
6690
- };
6691
-
6692
7279
  /** @jsxImportSource vue */
6693
7280
 
6694
- const COMPONENT_NAME$y = 'vc-progress';
6695
- const Progress = /* @__PURE__ */ defineComponent({
6696
- name: COMPONENT_NAME$y,
7281
+ const COMPONENT_NAME$z = 'vcm-radio';
7282
+ const MRadio = /* @__PURE__ */ defineComponent({
7283
+ name: COMPONENT_NAME$z,
6697
7284
  props: props$r,
7285
+ emits: ['update:modelValue', 'change'],
6698
7286
  setup(props, {
6699
7287
  slots
6700
7288
  }) {
7289
+ const {
7290
+ radioName,
7291
+ checked,
7292
+ classes,
7293
+ computedLabel,
7294
+ handleChange,
7295
+ handleFocus,
7296
+ handleBlur
7297
+ } = useRadio();
6701
7298
  return () => {
6702
- return createVNode("div", {
6703
- "class": "vc-progress"
6704
- }, [slots?.default?.()]);
7299
+ return createVNode("label", {
7300
+ "class": [classes.value, 'vcm-radio']
7301
+ }, [createVNode("span", {
7302
+ "class": [{
7303
+ 'has-sibling': !!(computedLabel.value || slots.default)
7304
+ }, 'vcm-radio__wrapper']
7305
+ }, [createVNode("span", {
7306
+ "class": "vcm-radio__border"
7307
+ }, [createVNode("span", {
7308
+ "class": "vcm-radio__inner"
7309
+ }, null)]), createVNode("input", {
7310
+ "checked": checked.value,
7311
+ "name": radioName.value,
7312
+ "disabled": props.disabled,
7313
+ "type": "radio",
7314
+ "onChange": handleChange,
7315
+ "onFocus": handleFocus,
7316
+ "onBlur": handleBlur
7317
+ }, null)]), slots.default ? slots.default() : computedLabel.value && createVNode("span", null, [computedLabel.value])]);
6705
7318
  };
6706
7319
  }
6707
7320
  });
6708
7321
 
6709
- const MProgress = Progress;
6710
-
6711
- const props$q = {
6712
- tag: {
6713
- type: String,
6714
- default: "div"
6715
- }
6716
- };
6717
-
6718
7322
  /** @jsxImportSource vue */
6719
7323
 
6720
- const COMPONENT_NAME$x = 'vc-radio';
6721
- const Radio = /* @__PURE__ */ defineComponent({
6722
- name: COMPONENT_NAME$x,
7324
+ const COMPONENT_NAME$y = 'vcm-radio-group';
7325
+ const MRadioGroup = /* @__PURE__ */ defineComponent({
7326
+ name: COMPONENT_NAME$y,
6723
7327
  props: props$q,
7328
+ emits: ['update:modelValue', 'change'],
6724
7329
  setup(props, {
6725
7330
  slots
6726
7331
  }) {
7332
+ const {
7333
+ classes
7334
+ } = useRadioGroup();
6727
7335
  return () => {
7336
+ if (props.fragment) return slots.default?.();
6728
7337
  return createVNode("div", {
6729
- "class": "vc-radio"
7338
+ "class": "vcm-radio-group",
7339
+ "style": classes.value,
7340
+ "name": props.name
6730
7341
  }, [slots?.default?.()]);
6731
7342
  };
6732
7343
  }
6733
7344
  });
6734
7345
 
6735
- const MRadio = Radio;
6736
-
6737
7346
  const props$p = {
6738
7347
  tag: {
6739
7348
  type: String,
@@ -6743,9 +7352,9 @@ const props$p = {
6743
7352
 
6744
7353
  /** @jsxImportSource vue */
6745
7354
 
6746
- const COMPONENT_NAME$w = 'vc-rate';
7355
+ const COMPONENT_NAME$x = 'vc-rate';
6747
7356
  const Rate = /* @__PURE__ */ defineComponent({
6748
- name: COMPONENT_NAME$w,
7357
+ name: COMPONENT_NAME$x,
6749
7358
  props: props$p,
6750
7359
  setup(props, {
6751
7360
  slots
@@ -6951,7 +7560,7 @@ const props$l = {
6951
7560
 
6952
7561
  /** @jsxImportSource vue */
6953
7562
 
6954
- const COMPONENT_NAME$v = 'vc-scroller-track';
7563
+ const COMPONENT_NAME$w = 'vc-scroller-track';
6955
7564
  const BAR_MAP = {
6956
7565
  vertical: {
6957
7566
  scroll: 'scrollTop',
@@ -6971,7 +7580,7 @@ const BAR_MAP = {
6971
7580
  }
6972
7581
  };
6973
7582
  const Track = /* @__PURE__ */ defineComponent({
6974
- name: COMPONENT_NAME$v,
7583
+ name: COMPONENT_NAME$w,
6975
7584
  props: props$n,
6976
7585
  emits: ['change'],
6977
7586
  setup(props, {
@@ -7157,9 +7766,9 @@ const Track = /* @__PURE__ */ defineComponent({
7157
7766
 
7158
7767
  /** @jsxImportSource vue */
7159
7768
 
7160
- const COMPONENT_NAME$u = 'vc-scroller-bar';
7769
+ const COMPONENT_NAME$v = 'vc-scroller-bar';
7161
7770
  const Bar = /* @__PURE__ */ defineComponent({
7162
- name: COMPONENT_NAME$u,
7771
+ name: COMPONENT_NAME$v,
7163
7772
  props: props$m,
7164
7773
  emits: ['change'],
7165
7774
  setup(props, {
@@ -7373,7 +7982,7 @@ const useScroller = (expose) => {
7373
7982
 
7374
7983
  /** @jsxImportSource vue */
7375
7984
 
7376
- const COMPONENT_NAME$t = 'vc-scroller';
7985
+ const COMPONENT_NAME$u = 'vc-scroller';
7377
7986
 
7378
7987
  /**
7379
7988
  * 作为备选方案,目前推荐使用ScrollerWheel
@@ -7384,7 +7993,7 @@ const COMPONENT_NAME$t = 'vc-scroller';
7384
7993
  * 2. 增加了一层嵌套
7385
7994
  */
7386
7995
  const Scroller = /* @__PURE__ */ defineComponent({
7387
- name: COMPONENT_NAME$t,
7996
+ name: COMPONENT_NAME$u,
7388
7997
  props: props$l,
7389
7998
  emits: ['scroll'],
7390
7999
  setup(props, {
@@ -7445,7 +8054,7 @@ const Scroller = /* @__PURE__ */ defineComponent({
7445
8054
 
7446
8055
  /** @jsxImportSource vue */
7447
8056
 
7448
- const COMPONENT_NAME$s = 'vc-scroller-wheel';
8057
+ const COMPONENT_NAME$t = 'vc-scroller-wheel';
7449
8058
 
7450
8059
  /**
7451
8060
  * 为减少一层嵌套，为去除滚动bar的抖动，使用wheel模拟
@@ -7467,7 +8076,7 @@ const COMPONENT_NAME$s = 'vc-scroller-wheel';
7467
8076
  * 设置scrollTop不会reflow和repaint，不需要考虑transfrom来改变content（transform也只在draw完成）
7468
8077
  */
7469
8078
  const ScrollerWheel = /* @__PURE__ */ defineComponent({
7470
- name: COMPONENT_NAME$s,
8079
+ name: COMPONENT_NAME$t,
7471
8080
  props: props$l,
7472
8081
  emits: ['scroll'],
7473
8082
  setup(props, {
@@ -7572,9 +8181,9 @@ const ScrollerWheel = /* @__PURE__ */ defineComponent({
7572
8181
 
7573
8182
  /** @jsxImportSource vue */
7574
8183
 
7575
- const COMPONENT_NAME$r = 'vc-recycle-list-scroll-state';
8184
+ const COMPONENT_NAME$s = 'vc-recycle-list-scroll-state';
7576
8185
  const ScrollState = /* @__PURE__ */ defineComponent({
7577
- name: COMPONENT_NAME$r,
8186
+ name: COMPONENT_NAME$s,
7578
8187
  setup(_, {
7579
8188
  slots
7580
8189
  }) {
@@ -7704,12 +8313,12 @@ const useDirectionKeys = () => {
7704
8313
 
7705
8314
  /** @jsxImportSource vue */
7706
8315
 
7707
- const COMPONENT_NAME$q = 'vc-recycle-list-container';
8316
+ const COMPONENT_NAME$r = 'vc-recycle-list-container';
7708
8317
 
7709
8318
  // TODO: 抽离
7710
8319
  const transformKey = $.prefixStyle('transform').camel;
7711
8320
  const Container = /* @__PURE__ */ defineComponent({
7712
- name: COMPONENT_NAME$q,
8321
+ name: COMPONENT_NAME$r,
7713
8322
  props: props$k,
7714
8323
  emits: ['refresh'],
7715
8324
  setup(props, {
@@ -7807,9 +8416,9 @@ const Container = /* @__PURE__ */ defineComponent({
7807
8416
 
7808
8417
  /** @jsxImportSource vue */
7809
8418
 
7810
- const COMPONENT_NAME$p = 'vc-recycle-list-item';
8419
+ const COMPONENT_NAME$q = 'vc-recycle-list-item';
7811
8420
  const Item = /* @__PURE__ */ defineComponent({
7812
- name: COMPONENT_NAME$p,
8421
+ name: COMPONENT_NAME$q,
7813
8422
  props: {
7814
8423
  vertical: {
7815
8424
  type: Boolean,
@@ -7852,9 +8461,9 @@ const Item = /* @__PURE__ */ defineComponent({
7852
8461
 
7853
8462
  /** @jsxImportSource vue */
7854
8463
 
7855
- const COMPONENT_NAME$o = 'vc-recycle-list';
8464
+ const COMPONENT_NAME$p = 'vc-recycle-list';
7856
8465
  const RecycleList = /* @__PURE__ */ defineComponent({
7857
- name: COMPONENT_NAME$o,
8466
+ name: COMPONENT_NAME$p,
7858
8467
  props: props$o,
7859
8468
  emits: ['scroll'],
7860
8469
  setup(props, {
@@ -8406,9 +9015,9 @@ const props$j = {
8406
9015
  }
8407
9016
  };
8408
9017
 
8409
- const COMPONENT_NAME$n = "vc-resizer";
9018
+ const COMPONENT_NAME$o = "vc-resizer";
8410
9019
  const Resizer = defineComponent({
8411
- name: COMPONENT_NAME$n,
9020
+ name: COMPONENT_NAME$o,
8412
9021
  props: props$j,
8413
9022
  emit: ["resize", "change"],
8414
9023
  setup(props, { emit, slots }) {
@@ -8474,9 +9083,9 @@ const props$i = {
8474
9083
 
8475
9084
  /** @jsxImportSource vue */
8476
9085
 
8477
- const COMPONENT_NAME$m = 'vc-select';
9086
+ const COMPONENT_NAME$n = 'vc-select';
8478
9087
  const Select = /* @__PURE__ */ defineComponent({
8479
- name: COMPONENT_NAME$m,
9088
+ name: COMPONENT_NAME$n,
8480
9089
  props: props$i,
8481
9090
  setup(props, {
8482
9091
  slots
@@ -8500,9 +9109,9 @@ const props$h = {
8500
9109
 
8501
9110
  /** @jsxImportSource vue */
8502
9111
 
8503
- const COMPONENT_NAME$l = 'vc-slider';
9112
+ const COMPONENT_NAME$m = 'vc-slider';
8504
9113
  const Slider = /* @__PURE__ */ defineComponent({
8505
- name: COMPONENT_NAME$l,
9114
+ name: COMPONENT_NAME$m,
8506
9115
  props: props$h,
8507
9116
  setup(props, {
8508
9117
  slots
@@ -8526,9 +9135,9 @@ const props$g = {
8526
9135
 
8527
9136
  /** @jsxImportSource vue */
8528
9137
 
8529
- const COMPONENT_NAME$k = 'vc-sort-list';
9138
+ const COMPONENT_NAME$l = 'vc-sort-list';
8530
9139
  const SortList = /* @__PURE__ */ defineComponent({
8531
- name: COMPONENT_NAME$k,
9140
+ name: COMPONENT_NAME$l,
8532
9141
  props: props$g,
8533
9142
  setup(props, {
8534
9143
  slots
@@ -8552,9 +9161,9 @@ const props$f = {
8552
9161
 
8553
9162
  /** @jsxImportSource vue */
8554
9163
 
8555
- const COMPONENT_NAME$j = 'vc-steps';
9164
+ const COMPONENT_NAME$k = 'vc-steps';
8556
9165
  const Steps = /* @__PURE__ */ defineComponent({
8557
- name: COMPONENT_NAME$j,
9166
+ name: COMPONENT_NAME$k,
8558
9167
  props: props$f,
8559
9168
  setup(props, {
8560
9169
  slots
@@ -8570,30 +9179,178 @@ const Steps = /* @__PURE__ */ defineComponent({
8570
9179
  const MSteps = Steps;
8571
9180
 
8572
9181
  const props$e = {
8573
- tag: {
9182
+ modelValue: {
9183
+ type: [String, Number, Boolean],
9184
+ default: false
9185
+ },
9186
+ checkedValue: {
9187
+ type: [String, Number, Boolean],
9188
+ default: true
9189
+ },
9190
+ uncheckedValue: {
9191
+ type: [String, Number, Boolean],
9192
+ default: false
9193
+ },
9194
+ disabled: {
9195
+ type: Boolean,
9196
+ default: false
9197
+ },
9198
+ name: {
9199
+ type: String
9200
+ },
9201
+ checkedText: {
8574
9202
  type: String,
8575
- default: "div"
9203
+ default: ""
9204
+ },
9205
+ uncheckedText: {
9206
+ type: String,
9207
+ default: ""
8576
9208
  }
8577
9209
  };
8578
9210
 
9211
+ const useSwitch = (expose) => {
9212
+ const instance = getCurrentInstance();
9213
+ const formItem = inject("vc-form-item", {});
9214
+ const { props, emit } = instance;
9215
+ const currentValue = ref("");
9216
+ const isLoading = ref(false);
9217
+ const checked = computed(() => {
9218
+ return currentValue.value === props.checkedValue;
9219
+ });
9220
+ const classes = computed(() => {
9221
+ return {
9222
+ "is-loading": isLoading.value,
9223
+ "is-checked": checked.value
9224
+ };
9225
+ });
9226
+ watch(
9227
+ () => props.modelValue,
9228
+ (v) => {
9229
+ currentValue.value = v;
9230
+ },
9231
+ { immediate: true }
9232
+ );
9233
+ const reset = (value) => {
9234
+ currentValue.value = value === props.checkedValue ? props.checkedValue : props.uncheckedValue;
9235
+ };
9236
+ const sync = (e) => {
9237
+ emit("update:modelValue", currentValue.value, e, reset);
9238
+ emit("change", currentValue.value, e, reset);
9239
+ formItem?.change?.(currentValue.value);
9240
+ };
9241
+ const handleToggle = (e) => {
9242
+ e.preventDefault();
9243
+ if (props.disabled || isLoading.value) {
9244
+ return false;
9245
+ }
9246
+ const callback = () => {
9247
+ const value = currentValue.value === props.checkedValue ? props.uncheckedValue : props.checkedValue;
9248
+ reset(value);
9249
+ sync(e);
9250
+ };
9251
+ const { onClick } = instance.vnode.props || {};
9252
+ const fn = onClick && onClick(e, reset);
9253
+ if (fn && fn.then) {
9254
+ isLoading.value = true;
9255
+ fn.then((res) => {
9256
+ callback();
9257
+ return res;
9258
+ }).finally(() => {
9259
+ isLoading.value = false;
9260
+ });
9261
+ } else if (!fn) {
9262
+ callback();
9263
+ }
9264
+ };
9265
+ expose({ reset });
9266
+ return {
9267
+ currentValue,
9268
+ isLoading,
9269
+ classes,
9270
+ checked,
9271
+ handleToggle,
9272
+ sync,
9273
+ reset
9274
+ };
9275
+ };
9276
+
8579
9277
  /** @jsxImportSource vue */
8580
9278
 
8581
- const COMPONENT_NAME$i = 'vc-switch';
9279
+ const COMPONENT_NAME$j = 'vc-switch';
8582
9280
  const Switch = /* @__PURE__ */ defineComponent({
8583
- name: COMPONENT_NAME$i,
9281
+ name: COMPONENT_NAME$j,
8584
9282
  props: props$e,
9283
+ // click -> onClick要被拦截，此处不能放置
9284
+ emits: ['update:modelValue', 'change', 'click'],
8585
9285
  setup(props, {
8586
- slots
9286
+ slots,
9287
+ expose
8587
9288
  }) {
9289
+ const {
9290
+ classes,
9291
+ currentValue,
9292
+ isLoading,
9293
+ handleToggle
9294
+ } = useSwitch(expose);
8588
9295
  return () => {
8589
- return createVNode("div", {
8590
- "class": "vc-switch"
8591
- }, [slots?.default?.()]);
9296
+ return createVNode("span", {
9297
+ "class": [classes.value, 'vc-switch'],
9298
+ "onClick": handleToggle
9299
+ }, [createVNode("input", {
9300
+ "name": props.name,
9301
+ "value": currentValue.value,
9302
+ "type": "hidden"
9303
+ }, null), createVNode("span", {
9304
+ "class": "vc-switch__content"
9305
+ }, [currentValue.value === props.checkedValue ? slots.checked ? slots.checked() : props.checkedText : null, currentValue.value === props.uncheckedValue ? slots.unchecked ? slots.unchecked() : props.uncheckedText : null]), createVNode("span", {
9306
+ "class": "vc-switch__inner"
9307
+ }, null), isLoading.value && createVNode(Spin, {
9308
+ "size": 14,
9309
+ "foreground": "#fff",
9310
+ "class": "vc-switch__loading"
9311
+ }, null)]);
8592
9312
  };
8593
9313
  }
8594
9314
  });
8595
9315
 
8596
- const MSwitch = Switch;
9316
+ /** @jsxImportSource vue */
9317
+
9318
+ const COMPONENT_NAME$i = 'vcm-switch';
9319
+ const MSwitch = /* @__PURE__ */ defineComponent({
9320
+ name: COMPONENT_NAME$i,
9321
+ props: props$e,
9322
+ // click -> onClick要被拦截，此处不能放置
9323
+ emits: ['update:modelValue', 'change', 'click'],
9324
+ setup(props, {
9325
+ slots,
9326
+ expose
9327
+ }) {
9328
+ const {
9329
+ classes,
9330
+ currentValue,
9331
+ isLoading,
9332
+ handleToggle
9333
+ } = useSwitch(expose);
9334
+ return () => {
9335
+ return createVNode("span", {
9336
+ "class": [classes.value, 'vcm-switch'],
9337
+ "onClick": handleToggle
9338
+ }, [createVNode("input", {
9339
+ "name": props.name,
9340
+ "value": currentValue.value,
9341
+ "type": "hidden"
9342
+ }, null), createVNode("span", {
9343
+ "class": "vcm-switch__content"
9344
+ }, [currentValue.value === props.checkedValue ? slots.checked ? slots.checked() : props.checkedText : null, currentValue.value === props.uncheckedValue ? slots.unchecked ? slots.unchecked() : props.uncheckedText : null]), createVNode("span", {
9345
+ "class": "vcm-switch__inner"
9346
+ }, null), isLoading.value && createVNode(MSpin, {
9347
+ "size": 14,
9348
+ "foreground": "#fff",
9349
+ "class": "vcm-switch__loading"
9350
+ }, null)]);
9351
+ };
9352
+ }
9353
+ });
8597
9354
 
8598
9355
  const props$d = {
8599
9356
  tag: {
@@ -9398,9 +10155,106 @@ const props$8 = {
9398
10155
  tag: {
9399
10156
  type: String,
9400
10157
  default: "div"
10158
+ },
10159
+ value: {
10160
+ type: String,
10161
+ default: ""
10162
+ },
10163
+ line: {
10164
+ type: Number,
10165
+ default: 0
10166
+ },
10167
+ // TODO: 是否改为tail-indent来表示尾部缩进
10168
+ indent: {
10169
+ type: Number,
10170
+ default: 0
10171
+ },
10172
+ resize: {
10173
+ type: [Boolean, Number],
10174
+ default: 100
10175
+ },
10176
+ suffix: {
10177
+ type: String,
10178
+ default: "..."
10179
+ },
10180
+ placement: {
10181
+ type: String,
10182
+ default: "top"
10183
+ },
10184
+ portalClassName: [Object, String, Array],
10185
+ portalStyle: [Object, String, Array],
10186
+ renderRow: {
10187
+ type: Function,
10188
+ // 函数式可以用于高亮显示
10189
+ default: (props$) => {
10190
+ const { value } = props$;
10191
+ return h("span", {}, value);
10192
+ }
9401
10193
  }
9402
10194
  };
9403
10195
 
10196
+ const HIDDEN_TEXT_STYLE = `
10197
+ position: absolute!important;
10198
+ word-break: break-all!important;
10199
+ overflow: auto!important;
10200
+ opacity: 0!important;
10201
+ z-index: -1000!important;
10202
+ top: 0!important;
10203
+ right: 0!important;
10204
+ `;
10205
+ const SIZING_STYLE = [
10206
+ "letter-spacing",
10207
+ "line-height",
10208
+ "padding-top",
10209
+ "padding-bottom",
10210
+ "font-family",
10211
+ "font-weight",
10212
+ "font-size",
10213
+ "text-rendering",
10214
+ "text-transform",
10215
+ "width",
10216
+ // 'text-indent', // 需要额外计算
10217
+ "padding-left",
10218
+ "padding-right",
10219
+ "border-width",
10220
+ "box-sizing"
10221
+ ];
10222
+ let hiddenEl;
10223
+ const getFitIndex = (options = {}) => {
10224
+ const { el, line, value, suffix, indent } = options;
10225
+ let lineHeight = parseInt(getStyle(el, "line-height"), 10);
10226
+ if (!hiddenEl) {
10227
+ hiddenEl = document.createElement("div");
10228
+ document.body.appendChild(hiddenEl);
10229
+ }
10230
+ el.getAttribute("wrap") ? hiddenEl.setAttribute("wrap", el.getAttribute("wrap")) : hiddenEl.removeAttribute("wrap");
10231
+ const {
10232
+ paddingSize,
10233
+ borderSize,
10234
+ boxSizing,
10235
+ sizingStyle
10236
+ } = Utils$1.getComputedStyle(el, SIZING_STYLE);
10237
+ const textIndent = `text-indent: ${parseInt(getStyle(el, "text-indent"), 10) + indent}px;`;
10238
+ hiddenEl.setAttribute("style", `${sizingStyle};${textIndent};${HIDDEN_TEXT_STYLE}`);
10239
+ let sideHeight = paddingSize || 0;
10240
+ boxSizing === "border-box" && (sideHeight += borderSize);
10241
+ if (Number.isNaN(lineHeight)) {
10242
+ hiddenEl.innerText = ".";
10243
+ lineHeight = hiddenEl.clientHeight - sideHeight;
10244
+ }
10245
+ let endIndex = 0;
10246
+ hiddenEl.innerText = suffix;
10247
+ value.split("").forEach((item, i) => {
10248
+ let old = hiddenEl.innerText;
10249
+ old = old.substring(0, old.length - suffix.length);
10250
+ hiddenEl.innerText = old + item + suffix;
10251
+ if (hiddenEl.clientHeight - sideHeight > lineHeight * line && endIndex === 0) {
10252
+ endIndex = i;
10253
+ }
10254
+ });
10255
+ return endIndex;
10256
+ };
10257
+
9404
10258
  /** @jsxImportSource vue */
9405
10259
 
9406
10260
  const COMPONENT_NAME$b = 'vc-text';
@@ -9408,12 +10262,81 @@ const Text = /* @__PURE__ */ defineComponent({
9408
10262
  name: COMPONENT_NAME$b,
9409
10263
  props: props$8,
9410
10264
  setup(props, {
9411
- slots
10265
+ emit
9412
10266
  }) {
10267
+ const instance = getCurrentInstance();
10268
+ const isActive = ref(false);
10269
+ const endIndex = ref(0);
10270
+ const styles = computed(() => {
10271
+ return {
10272
+ cursor: endIndex.value === 0 ? 'unset' : 'pointer'
10273
+ };
10274
+ });
10275
+ const calcPosition = () => {
10276
+ const {
10277
+ suffix,
10278
+ line,
10279
+ value,
10280
+ indent
10281
+ } = props;
10282
+ if (line === 0) {
10283
+ endIndex.value = 0;
10284
+ isActive.value = true;
10285
+ } else {
10286
+ endIndex.value = getFitIndex({
10287
+ el: instance.vnode.el,
10288
+ line,
10289
+ value,
10290
+ suffix,
10291
+ indent
10292
+ });
10293
+ isActive.value = true;
10294
+ }
10295
+ emit('clip', endIndex.value);
10296
+ };
10297
+ const handleResize = props.resize === true || props.resize === 0 ? calcPosition : debounce(calcPosition, props.resize || 0);
10298
+ const handleMouseOver = e => {
10299
+ if (endIndex.value > 0) {
10300
+ Popover.open({
10301
+ el: document.body,
10302
+ name: 'vc-text-popover',
10303
+ // 确保不重复创建
10304
+ triggerEl: e.target,
10305
+ hover: true,
10306
+ theme: 'dark',
10307
+ placement: props.placement,
10308
+ portalClassName: props.portalClassName,
10309
+ portalStyle: props.portalStyle || `width: ${e.target.clientWidth}px`,
10310
+ content: props.value
10311
+ });
10312
+ }
10313
+ };
10314
+ const handleMouseOut = () => {
10315
+ // Do.
10316
+ };
10317
+ ['value', 'indent', 'line'].forEach(key => {
10318
+ watch(() => props[key], calcPosition);
10319
+ });
10320
+ onMounted(() => {
10321
+ props.resize !== false && Resize.on(instance.vnode.el, handleResize); // 首次会执行一次
10322
+ });
10323
+ onBeforeUnmount(() => {
10324
+ props.resize !== false && Resize.off(instance.vnode.el, handleResize);
10325
+ });
10326
+ const Content = props.tag;
9413
10327
  return () => {
9414
- return createVNode("div", {
9415
- "class": "vc-text"
9416
- }, [slots?.default?.()]);
10328
+ return createVNode(Content, {
10329
+ "class": "vc-text",
10330
+ "style": styles.value,
10331
+ "onMouseover": handleMouseOver,
10332
+ "onMouseout": handleMouseOut
10333
+ }, {
10334
+ default: () => [isActive.value ? createVNode(Customer, {
10335
+ "value": endIndex.value > 0 ? `${props.value.slice(0, endIndex.value)}${props.suffix}` : props.value,
10336
+ "index": endIndex.value,
10337
+ "render": props.renderRow
10338
+ }, null) : null]
10339
+ });
9417
10340
  };
9418
10341
  }
9419
10342
  });
@@ -9790,4 +10713,4 @@ const UploadPicker = /* @__PURE__ */ defineComponent({
9790
10713
 
9791
10714
  const MUploadPicker = UploadPicker;
9792
10715
 
9793
- export { ActionSheet, Alert, Artboard, Button, ButtonGroup, Calendar, Card, Carousel, Cascader, Chart, Checkbox, Clipboard, Collapse, CollapseItem, ColorPicker, Countdown, Customer, DatePicker, Debounce, Divider, drawer as Drawer, DrawerView, Dropdown, Editor, Expand, Form, FormItem, Fragment, HTMLToImage, Icon, IconManager, Image, ImageCrop, ImagePreview, ImageProcessing, Input, InputNumber, InputSearch, MList as List, MListItem as ListItem, MActionSheet, MAlert, MArtboard, MButton, MButtonGroup, MCalendar, MCard, MCarousel, MCascader, MChart, MCheckbox, MClipboard, MCollapse, MCollapseItem, MColorPicker, MCountdown, MCustomer, MDatePicker, Debounce as MDebounce, MDivider, MDrawerView, MDropdown, MEditor, MExpand, MForm, MFormItem, MFragment, MHTMLToImage, MIcon, MImage, MImageCrop, MImagePreview, MImageProcessing, MInput, MInputNumber, MInputSearch, MList, MListItem, MMarquee, MMessage, modal as MModal, MModalView, MNotice, MOption, MPage, MPicker, MPopconfirm, MPopover, MPopup, MPortal, MPrint, MProgress, MRadio, MRate, MRecycleList, MResizer, MScroller, MSelect, MSlider, MSortList, MSpin, MSteps, MSwitch, MTable, MTabs, MTabsPane, MTag, MText, MTextarea, MTimePicker, MTimeline, MToast$1 as MToast, MToastView, MTouch, MTransition, MTransitionCollapse, MTransitionFade, MTransitionScale, MTransitionSlide, MTransitionZoom, MTree, MUpload, MUploadPicker, Marquee, Message$1 as Message, MessageView, modal$1 as Modal, ModalView, Notice$1 as Notice, NoticeView, Option, Page, Picker, Popconfirm, Popover, Popup, Portal, PortalView, Print, Progress, Radio, Rate, RecycleList, Resizer, Scroller, ScrollerWheel, Select, Slider, SortList, Spin, Steps, Switch, Table, Tabs, TabsPane, Tag, Text, Textarea, Theme, ThemeImage, ThemeText, ThemeView, TimePicker, Timeline, Toast, ToastView, Touch, Transition, TransitionCollapse, TransitionFade, TransitionScale, TransitionSlide, TransitionZoom, Tree, Upload, UploadPicker, VcError, VcInstance };
10716
+ export { ActionSheet, Alert, Artboard, Button, ButtonGroup, Calendar, Card, Carousel, Cascader, Chart, Checkbox, CheckboxGroup, Clipboard, Collapse, CollapseItem, ColorPicker, Countdown, Customer, DatePicker, Debounce, Divider, drawer as Drawer, DrawerView, Dropdown, Editor, Expand, Form, FormItem, Fragment, HTMLToImage, Icon, IconManager, Image, ImageCrop, ImagePreview, ImageProcessing, Input, InputNumber, InputSearch, MList as List, MListItem as ListItem, MActionSheet, MAlert, MArtboard, MButton, MButtonGroup, MCalendar, MCard, MCarousel, MCascader, MChart, MCheckbox, MCheckboxGroup, MClipboard, MCollapse, MCollapseItem, MColorPicker, MCountdown, MCustomer, MDatePicker, Debounce as MDebounce, MDivider, MDrawerView, MDropdown, MEditor, MExpand, MForm, MFormItem, MFragment, MHTMLToImage, MIcon, MImage, MImageCrop, MImagePreview, MImageProcessing, MInput, MInputNumber, MInputSearch, MList, MListItem, MMarquee, MMessage, modal as MModal, MModalView, MNotice, MOption, MPage, MPicker, MPopconfirm, MPopover, MPopup, MPortal, MPrint, MProgress, MRadio, MRadioGroup, MRate, MRecycleList, MResizer, MScroller, MSelect, MSlider, MSortList, MSpin, MSteps, MSwitch, MTable, MTabs, MTabsPane, MTag, MText, MTextarea, MTimePicker, MTimeline, MToast$1 as MToast, MToastView, MTouch, MTransition, MTransitionCollapse, MTransitionFade, MTransitionScale, MTransitionSlide, MTransitionZoom, MTree, MUpload, MUploadPicker, Marquee, Message$1 as Message, MessageView, modal$1 as Modal, ModalView, Notice$1 as Notice, NoticeView, Option, Page, Picker, Popconfirm, Popover, Popup, Portal, PortalView, Print, Progress, Radio, RadioGroup, Rate, RecycleList, Resizer, Scroller, ScrollerWheel, Select, Slider, SortList, Spin, Steps, Switch, Table, Tabs, TabsPane, Tag, Text, Textarea, Theme, ThemeImage, ThemeText, ThemeView, TimePicker, Timeline, Toast, ToastView, Touch, Transition, TransitionCollapse, TransitionFade, TransitionScale, TransitionSlide, TransitionZoom, Tree, Upload, UploadPicker, VcError, VcInstance };