vant 4.5.0 → 4.6.1

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 (132) hide show
  1. package/README.md +6 -6
  2. package/es/barrage/index.d.ts +1 -1
  3. package/es/barrage/types.d.ts +6 -0
  4. package/es/composables/use-touch.d.ts +1 -0
  5. package/es/composables/use-touch.mjs +8 -1
  6. package/es/config-provider/types.d.ts +1 -1
  7. package/es/dropdown-menu/index.d.ts +1 -1
  8. package/es/field/Field.mjs +1 -1
  9. package/es/floating-bubble/FloatingBubble.d.ts +86 -0
  10. package/es/floating-bubble/FloatingBubble.mjs +177 -0
  11. package/es/floating-bubble/index.css +1 -0
  12. package/es/floating-bubble/index.d.ts +63 -0
  13. package/es/floating-bubble/index.mjs +10 -0
  14. package/es/floating-bubble/style/index.d.ts +1 -0
  15. package/es/floating-bubble/style/index.mjs +4 -0
  16. package/es/floating-bubble/types.d.ts +8 -0
  17. package/es/floating-bubble/types.mjs +0 -0
  18. package/es/floating-panel/FloatingPanel.mjs +5 -7
  19. package/es/floating-panel/index.d.ts +3 -2
  20. package/es/floating-panel/index.mjs +3 -1
  21. package/es/floating-panel/types.d.ts +9 -0
  22. package/es/floating-panel/types.mjs +0 -0
  23. package/es/image-preview/ImagePreviewItem.mjs +1 -2
  24. package/es/index.d.ts +3 -1
  25. package/es/index.mjs +7 -1
  26. package/es/lazyload/vue-lazyload/util.d.ts +2 -2
  27. package/es/picker/PickerColumn.mjs +7 -2
  28. package/es/rate/Rate.d.ts +4 -0
  29. package/es/rate/Rate.mjs +16 -10
  30. package/es/rate/index.css +1 -1
  31. package/es/rate/index.d.ts +3 -0
  32. package/es/rolling-text/RollingText.d.ts +104 -0
  33. package/es/rolling-text/RollingText.mjs +98 -0
  34. package/es/rolling-text/RollingTextItem.d.ts +67 -0
  35. package/es/rolling-text/RollingTextItem.mjs +47 -0
  36. package/es/rolling-text/index.css +1 -0
  37. package/es/rolling-text/index.d.ts +79 -0
  38. package/es/rolling-text/index.mjs +10 -0
  39. package/es/rolling-text/style/index.d.ts +1 -0
  40. package/es/rolling-text/style/index.mjs +2 -0
  41. package/es/rolling-text/types.d.ts +17 -0
  42. package/es/rolling-text/types.mjs +0 -0
  43. package/es/signature/index.d.ts +1 -0
  44. package/es/signature/types.d.ts +6 -0
  45. package/es/signature/types.mjs +0 -0
  46. package/es/slider/Slider.d.ts +1 -1
  47. package/es/slider/index.d.ts +1 -1
  48. package/es/stepper/Stepper.d.ts +1 -1
  49. package/es/stepper/index.d.ts +1 -1
  50. package/es/style/base.css +1 -1
  51. package/es/submit-bar/types.d.ts +0 -1
  52. package/es/uploader/Uploader.mjs +6 -4
  53. package/es/uploader/UploaderPreviewItem.mjs +1 -1
  54. package/es/uploader/types.d.ts +1 -0
  55. package/es/utils/closest.d.ts +1 -0
  56. package/es/utils/closest.mjs +8 -0
  57. package/es/utils/constant.d.ts +1 -0
  58. package/es/utils/constant.mjs +3 -1
  59. package/es/utils/index.d.ts +1 -0
  60. package/es/utils/index.mjs +1 -0
  61. package/es/watermark/index.d.ts +1 -0
  62. package/es/watermark/types.d.ts +3 -0
  63. package/es/watermark/types.mjs +0 -0
  64. package/lib/barrage/index.d.ts +1 -1
  65. package/lib/barrage/types.d.ts +6 -0
  66. package/lib/composables/use-touch.d.ts +1 -0
  67. package/lib/composables/use-touch.js +8 -1
  68. package/lib/config-provider/types.d.ts +1 -1
  69. package/lib/dropdown-menu/index.d.ts +1 -1
  70. package/lib/field/Field.js +1 -1
  71. package/lib/floating-bubble/FloatingBubble.d.ts +86 -0
  72. package/lib/floating-bubble/FloatingBubble.js +206 -0
  73. package/lib/floating-bubble/index.css +1 -0
  74. package/lib/floating-bubble/index.d.ts +63 -0
  75. package/lib/floating-bubble/index.js +39 -0
  76. package/lib/floating-bubble/style/index.d.ts +1 -0
  77. package/lib/floating-bubble/style/index.js +4 -0
  78. package/lib/floating-bubble/types.d.ts +8 -0
  79. package/lib/floating-bubble/types.js +15 -0
  80. package/lib/floating-panel/FloatingPanel.js +6 -8
  81. package/lib/floating-panel/index.d.ts +3 -2
  82. package/lib/floating-panel/index.js +3 -1
  83. package/lib/floating-panel/types.d.ts +9 -0
  84. package/lib/floating-panel/types.js +15 -0
  85. package/lib/image-preview/ImagePreviewItem.js +1 -2
  86. package/lib/index.css +1 -1
  87. package/lib/index.d.ts +3 -1
  88. package/lib/index.js +7 -1
  89. package/lib/lazyload/vue-lazyload/util.d.ts +2 -2
  90. package/lib/picker/PickerColumn.js +7 -2
  91. package/lib/rate/Rate.d.ts +4 -0
  92. package/lib/rate/Rate.js +16 -10
  93. package/lib/rate/index.css +1 -1
  94. package/lib/rate/index.d.ts +3 -0
  95. package/lib/rolling-text/RollingText.d.ts +104 -0
  96. package/lib/rolling-text/RollingText.js +127 -0
  97. package/lib/rolling-text/RollingTextItem.d.ts +67 -0
  98. package/lib/rolling-text/RollingTextItem.js +66 -0
  99. package/lib/rolling-text/index.css +1 -0
  100. package/lib/rolling-text/index.d.ts +79 -0
  101. package/lib/rolling-text/index.js +39 -0
  102. package/lib/rolling-text/style/index.d.ts +1 -0
  103. package/lib/rolling-text/style/index.js +2 -0
  104. package/lib/rolling-text/types.d.ts +17 -0
  105. package/lib/rolling-text/types.js +15 -0
  106. package/lib/signature/index.d.ts +1 -0
  107. package/lib/signature/types.d.ts +6 -0
  108. package/lib/signature/types.js +15 -0
  109. package/lib/slider/Slider.d.ts +1 -1
  110. package/lib/slider/index.d.ts +1 -1
  111. package/lib/stepper/Stepper.d.ts +1 -1
  112. package/lib/stepper/index.d.ts +1 -1
  113. package/lib/style/base.css +1 -1
  114. package/lib/submit-bar/types.d.ts +0 -1
  115. package/lib/uploader/Uploader.js +6 -4
  116. package/lib/uploader/UploaderPreviewItem.js +1 -1
  117. package/lib/uploader/types.d.ts +1 -0
  118. package/lib/utils/closest.d.ts +1 -0
  119. package/lib/utils/closest.js +27 -0
  120. package/lib/utils/constant.d.ts +1 -0
  121. package/lib/utils/constant.js +3 -1
  122. package/lib/utils/index.d.ts +1 -0
  123. package/lib/utils/index.js +1 -0
  124. package/lib/vant.cjs.js +2355 -2028
  125. package/lib/vant.es.js +2355 -2028
  126. package/lib/vant.js +2366 -2166
  127. package/lib/vant.min.js +1 -1
  128. package/lib/watermark/index.d.ts +1 -0
  129. package/lib/watermark/types.d.ts +3 -0
  130. package/lib/watermark/types.js +15 -0
  131. package/lib/web-types.json +1 -1
  132. package/package.json +1 -1
package/es/index.mjs CHANGED
@@ -35,6 +35,7 @@ import { DropdownItem } from "./dropdown-item/index.mjs";
35
35
  import { DropdownMenu } from "./dropdown-menu/index.mjs";
36
36
  import { Empty } from "./empty/index.mjs";
37
37
  import { Field } from "./field/index.mjs";
38
+ import { FloatingBubble } from "./floating-bubble/index.mjs";
38
39
  import { FloatingPanel } from "./floating-panel/index.mjs";
39
40
  import { Form } from "./form/index.mjs";
40
41
  import { Grid } from "./grid/index.mjs";
@@ -63,6 +64,7 @@ import { PullRefresh } from "./pull-refresh/index.mjs";
63
64
  import { Radio } from "./radio/index.mjs";
64
65
  import { RadioGroup } from "./radio-group/index.mjs";
65
66
  import { Rate } from "./rate/index.mjs";
67
+ import { RollingText } from "./rolling-text/index.mjs";
66
68
  import { Row } from "./row/index.mjs";
67
69
  import { Search } from "./search/index.mjs";
68
70
  import { ShareSheet } from "./share-sheet/index.mjs";
@@ -96,7 +98,7 @@ import { Toast } from "./toast/index.mjs";
96
98
  import { TreeSelect } from "./tree-select/index.mjs";
97
99
  import { Uploader } from "./uploader/index.mjs";
98
100
  import { Watermark } from "./watermark/index.mjs";
99
- const version = "4.5.0";
101
+ const version = "4.6.1";
100
102
  function install(app) {
101
103
  const components = [
102
104
  ActionBar,
@@ -136,6 +138,7 @@ function install(app) {
136
138
  DropdownMenu,
137
139
  Empty,
138
140
  Field,
141
+ FloatingBubble,
139
142
  FloatingPanel,
140
143
  Form,
141
144
  Grid,
@@ -164,6 +167,7 @@ function install(app) {
164
167
  Radio,
165
168
  RadioGroup,
166
169
  Rate,
170
+ RollingText,
167
171
  Row,
168
172
  Search,
169
173
  ShareSheet,
@@ -243,6 +247,7 @@ export * from "./dropdown-item/index.mjs";
243
247
  export * from "./dropdown-menu/index.mjs";
244
248
  export * from "./empty/index.mjs";
245
249
  export * from "./field/index.mjs";
250
+ export * from "./floating-bubble/index.mjs";
246
251
  export * from "./floating-panel/index.mjs";
247
252
  export * from "./form/index.mjs";
248
253
  export * from "./grid/index.mjs";
@@ -272,6 +277,7 @@ export * from "./pull-refresh/index.mjs";
272
277
  export * from "./radio/index.mjs";
273
278
  export * from "./radio-group/index.mjs";
274
279
  export * from "./rate/index.mjs";
280
+ export * from "./rolling-text/index.mjs";
275
281
  export * from "./row/index.mjs";
276
282
  export * from "./search/index.mjs";
277
283
  export * from "./share-sheet/index.mjs";
@@ -6,8 +6,8 @@ export function on(el: any, type: any, func: any): void;
6
6
  export function off(el: any, type: any, func: any): void;
7
7
  export const hasIntersectionObserver: boolean;
8
8
  export namespace modeType {
9
- const event: string;
10
- const observer: string;
9
+ let event: string;
10
+ let observer: string;
11
11
  }
12
12
  export function getDPR(scale?: number): number;
13
13
  export function loadImageAsync(item: any, resolve: any, reject: any): any;
@@ -40,9 +40,12 @@ var stdin_default = defineComponent({
40
40
  const count = () => props.options.length;
41
41
  const baseOffset = () => props.optionHeight * (+props.visibleOptionNum - 1) / 2;
42
42
  const updateValueByIndex = (index) => {
43
- const enabledIndex = findIndexOfEnabledOption(props.options, index);
43
+ let enabledIndex = findIndexOfEnabledOption(props.options, index);
44
44
  const offset = -enabledIndex * props.optionHeight;
45
45
  const trigger = () => {
46
+ if (enabledIndex > count() - 1) {
47
+ enabledIndex = findIndexOfEnabledOption(props.options, index);
48
+ }
46
49
  const value = props.options[enabledIndex][props.fields.value];
47
50
  if (value !== props.value) {
48
51
  emit("change", value);
@@ -168,9 +171,11 @@ var stdin_default = defineComponent({
168
171
  stopMomentum
169
172
  });
170
173
  watchEffect(() => {
171
- const index = props.options.findIndex((option) => option[props.fields.value] === props.value);
174
+ const index = moving ? Math.floor(-currentOffset.value / props.optionHeight) : props.options.findIndex((option) => option[props.fields.value] === props.value);
172
175
  const enabledIndex = findIndexOfEnabledOption(props.options, index);
173
176
  const offset = -enabledIndex * props.optionHeight;
177
+ if (moving && enabledIndex < index)
178
+ stopMomentum();
174
179
  currentOffset.value = offset;
175
180
  });
176
181
  useEventListener("touchmove", onTouchMove, {
package/es/rate/Rate.d.ts CHANGED
@@ -11,6 +11,7 @@ export declare const rateProps: {
11
11
  default: number;
12
12
  };
13
13
  gutter: (NumberConstructor | StringConstructor)[];
14
+ clearable: BooleanConstructor;
14
15
  readonly: BooleanConstructor;
15
16
  disabled: BooleanConstructor;
16
17
  voidIcon: {
@@ -43,6 +44,7 @@ declare const _default: import("vue").DefineComponent<{
43
44
  default: number;
44
45
  };
45
46
  gutter: (NumberConstructor | StringConstructor)[];
47
+ clearable: BooleanConstructor;
46
48
  readonly: BooleanConstructor;
47
49
  disabled: BooleanConstructor;
48
50
  voidIcon: {
@@ -73,6 +75,7 @@ declare const _default: import("vue").DefineComponent<{
73
75
  default: number;
74
76
  };
75
77
  gutter: (NumberConstructor | StringConstructor)[];
78
+ clearable: BooleanConstructor;
76
79
  readonly: BooleanConstructor;
77
80
  disabled: BooleanConstructor;
78
81
  voidIcon: {
@@ -97,6 +100,7 @@ declare const _default: import("vue").DefineComponent<{
97
100
  }, {
98
101
  disabled: boolean;
99
102
  icon: string;
103
+ clearable: boolean;
100
104
  modelValue: number;
101
105
  readonly: boolean;
102
106
  touchable: boolean;
package/es/rate/Rate.mjs CHANGED
@@ -37,6 +37,7 @@ const rateProps = {
37
37
  color: String,
38
38
  count: makeNumericProp(5),
39
39
  gutter: numericProp,
40
+ clearable: Boolean,
40
41
  readonly: Boolean,
41
42
  disabled: Boolean,
42
43
  voidIcon: makeStringProp("star-o"),
@@ -57,7 +58,8 @@ var stdin_default = defineComponent({
57
58
  const touch = useTouch();
58
59
  const [itemRefs, setItemRefs] = useRefs();
59
60
  const groupRef = ref();
60
- const untouchable = () => props.readonly || props.disabled || !props.touchable;
61
+ const unselectable = computed(() => props.readonly || props.disabled);
62
+ const untouchable = computed(() => unselectable.value || !props.touchable);
61
63
  const list = computed(() => Array(+props.count).fill("").map((_, i) => getRateStatus(props.modelValue, i + 1, props.allowHalf, props.readonly)));
62
64
  let ranges;
63
65
  let groupRefRect;
@@ -107,25 +109,25 @@ var stdin_default = defineComponent({
107
109
  }
108
110
  return props.allowHalf ? 0.5 : 1;
109
111
  };
110
- const select = (index) => {
111
- if (!props.disabled && !props.readonly && index !== props.modelValue) {
112
- emit("update:modelValue", index);
113
- emit("change", index);
114
- }
112
+ const select = (value) => {
113
+ if (unselectable.value || value === props.modelValue)
114
+ return;
115
+ emit("update:modelValue", value);
116
+ emit("change", value);
115
117
  };
116
118
  const onTouchStart = (event) => {
117
- if (untouchable()) {
119
+ if (untouchable.value) {
118
120
  return;
119
121
  }
120
122
  touch.start(event);
121
123
  updateRanges();
122
124
  };
123
125
  const onTouchMove = (event) => {
124
- if (untouchable()) {
126
+ if (untouchable.value) {
125
127
  return;
126
128
  }
127
129
  touch.move(event);
128
- if (touch.isHorizontal()) {
130
+ if (touch.isHorizontal() && !touch.isTap.value) {
129
131
  const {
130
132
  clientX,
131
133
  clientY
@@ -160,7 +162,11 @@ var stdin_default = defineComponent({
160
162
  }
161
163
  const onClickItem = (event) => {
162
164
  updateRanges();
163
- select(allowHalf ? getScoreByPosition(event.clientX, event.clientY) : score);
165
+ let value = allowHalf ? getScoreByPosition(event.clientX, event.clientY) : score;
166
+ if (props.clearable && touch.isTap.value && value === props.modelValue) {
167
+ value = 0;
168
+ }
169
+ select(value);
164
170
  };
165
171
  return _createVNode("div", {
166
172
  "key": index,
package/es/rate/index.css CHANGED
@@ -1 +1 @@
1
- :root{--van-rate-icon-size: 20px;--van-rate-icon-gutter: var(--van-padding-base);--van-rate-icon-void-color: var(--van-gray-5);--van-rate-icon-full-color: var(--van-danger-color);--van-rate-icon-disabled-color: var(--van-gray-5)}.van-rate{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;flex-wrap:wrap}.van-rate__item{position:relative}.van-rate__item:not(:last-child){padding-right:var(--van-rate-icon-gutter)}.van-rate__icon{display:block;width:1em;color:var(--van-rate-icon-void-color);font-size:var(--van-rate-icon-size)}.van-rate__icon--half{position:absolute;top:0;left:0;overflow:hidden}.van-rate__icon--full{color:var(--van-rate-icon-full-color)}.van-rate__icon--disabled{color:var(--van-rate-icon-disabled-color)}.van-rate--disabled{cursor:not-allowed}.van-rate--readonly{cursor:default}
1
+ :root{--van-rate-icon-size: 20px;--van-rate-icon-gutter: var(--van-padding-base);--van-rate-icon-void-color: var(--van-gray-5);--van-rate-icon-full-color: var(--van-danger-color);--van-rate-icon-disabled-color: var(--van-gray-5)}.van-rate{display:inline-flex;cursor:pointer;-webkit-user-select:none;user-select:none;flex-wrap:wrap}.van-rate__item{position:relative}.van-rate__item:not(:last-child){padding-right:var(--van-rate-icon-gutter)}.van-rate__icon{display:block;width:1em;color:var(--van-rate-icon-void-color);font-size:var(--van-rate-icon-size)}.van-rate__icon--half{position:absolute;top:0;left:0;overflow:hidden;pointer-events:none}.van-rate__icon--full{color:var(--van-rate-icon-full-color)}.van-rate__icon--disabled{color:var(--van-rate-icon-disabled-color)}.van-rate--disabled{cursor:not-allowed}.van-rate--readonly{cursor:default}
@@ -10,6 +10,7 @@ export declare const Rate: import("../utils").WithInstall<import("vue").DefineCo
10
10
  default: number;
11
11
  };
12
12
  gutter: (NumberConstructor | StringConstructor)[];
13
+ clearable: BooleanConstructor;
13
14
  readonly: BooleanConstructor;
14
15
  disabled: BooleanConstructor;
15
16
  voidIcon: {
@@ -40,6 +41,7 @@ export declare const Rate: import("../utils").WithInstall<import("vue").DefineCo
40
41
  default: number;
41
42
  };
42
43
  gutter: (NumberConstructor | StringConstructor)[];
44
+ clearable: BooleanConstructor;
43
45
  readonly: BooleanConstructor;
44
46
  disabled: BooleanConstructor;
45
47
  voidIcon: {
@@ -64,6 +66,7 @@ export declare const Rate: import("../utils").WithInstall<import("vue").DefineCo
64
66
  }, {
65
67
  disabled: boolean;
66
68
  icon: string;
69
+ clearable: boolean;
67
70
  modelValue: number;
68
71
  readonly: boolean;
69
72
  touchable: boolean;
@@ -0,0 +1,104 @@
1
+ import { type ExtractPropTypes } from 'vue';
2
+ import { RollingTextDirection, RollingTextStopOrder } from './types';
3
+ export declare const rollingTextProps: {
4
+ startNum: {
5
+ type: NumberConstructor;
6
+ default: number;
7
+ };
8
+ targetNum: NumberConstructor;
9
+ textList: {
10
+ type: import("vue").PropType<string[]>;
11
+ default: () => never[];
12
+ };
13
+ duration: {
14
+ type: NumberConstructor;
15
+ default: number;
16
+ };
17
+ autoStart: {
18
+ type: BooleanConstructor;
19
+ default: true;
20
+ };
21
+ direction: {
22
+ type: import("vue").PropType<RollingTextDirection>;
23
+ default: RollingTextDirection;
24
+ };
25
+ stopOrder: {
26
+ type: import("vue").PropType<RollingTextStopOrder>;
27
+ default: RollingTextStopOrder;
28
+ };
29
+ height: {
30
+ type: NumberConstructor;
31
+ default: number;
32
+ };
33
+ };
34
+ export type RollingTextProps = ExtractPropTypes<typeof rollingTextProps>;
35
+ declare const _default: import("vue").DefineComponent<{
36
+ startNum: {
37
+ type: NumberConstructor;
38
+ default: number;
39
+ };
40
+ targetNum: NumberConstructor;
41
+ textList: {
42
+ type: import("vue").PropType<string[]>;
43
+ default: () => never[];
44
+ };
45
+ duration: {
46
+ type: NumberConstructor;
47
+ default: number;
48
+ };
49
+ autoStart: {
50
+ type: BooleanConstructor;
51
+ default: true;
52
+ };
53
+ direction: {
54
+ type: import("vue").PropType<RollingTextDirection>;
55
+ default: RollingTextDirection;
56
+ };
57
+ stopOrder: {
58
+ type: import("vue").PropType<RollingTextStopOrder>;
59
+ default: RollingTextStopOrder;
60
+ };
61
+ height: {
62
+ type: NumberConstructor;
63
+ default: number;
64
+ };
65
+ }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
66
+ startNum: {
67
+ type: NumberConstructor;
68
+ default: number;
69
+ };
70
+ targetNum: NumberConstructor;
71
+ textList: {
72
+ type: import("vue").PropType<string[]>;
73
+ default: () => never[];
74
+ };
75
+ duration: {
76
+ type: NumberConstructor;
77
+ default: number;
78
+ };
79
+ autoStart: {
80
+ type: BooleanConstructor;
81
+ default: true;
82
+ };
83
+ direction: {
84
+ type: import("vue").PropType<RollingTextDirection>;
85
+ default: RollingTextDirection;
86
+ };
87
+ stopOrder: {
88
+ type: import("vue").PropType<RollingTextStopOrder>;
89
+ default: RollingTextStopOrder;
90
+ };
91
+ height: {
92
+ type: NumberConstructor;
93
+ default: number;
94
+ };
95
+ }>>, {
96
+ height: number;
97
+ duration: number;
98
+ direction: RollingTextDirection;
99
+ autoStart: boolean;
100
+ startNum: number;
101
+ textList: string[];
102
+ stopOrder: RollingTextStopOrder;
103
+ }, {}>;
104
+ export default _default;
@@ -0,0 +1,98 @@
1
+ import { createVNode as _createVNode } from "vue";
2
+ import { ref, defineComponent, computed, watch } from "vue";
3
+ import { raf } from "@vant/use";
4
+ import { createNamespace, makeArrayProp, makeNumberProp, makeStringProp, truthProp, padZero } from "../utils/index.mjs";
5
+ import { useExpose } from "../composables/use-expose.mjs";
6
+ import RollingTextItem from "./RollingTextItem.mjs";
7
+ const [name, bem] = createNamespace("rolling-text");
8
+ const rollingTextProps = {
9
+ startNum: makeNumberProp(0),
10
+ targetNum: Number,
11
+ textList: makeArrayProp(),
12
+ duration: makeNumberProp(2),
13
+ autoStart: truthProp,
14
+ direction: makeStringProp("down"),
15
+ stopOrder: makeStringProp("ltr"),
16
+ height: makeNumberProp(40)
17
+ };
18
+ const CIRCLE_NUM = 2;
19
+ var stdin_default = defineComponent({
20
+ name,
21
+ props: rollingTextProps,
22
+ setup(props) {
23
+ const isCustomType = computed(() => Array.isArray(props.textList) && props.textList.length);
24
+ const itemLength = computed(() => {
25
+ if (isCustomType.value)
26
+ return props.textList[0].length;
27
+ return `${Math.max(props.startNum, props.targetNum)}`.length;
28
+ });
29
+ const getTextArrByIdx = (idx) => {
30
+ const result = [];
31
+ for (let i = 0; i < props.textList.length; i++) {
32
+ result.push(props.textList[i][idx]);
33
+ }
34
+ return result;
35
+ };
36
+ const targetNumArr = computed(() => {
37
+ if (isCustomType.value)
38
+ return new Array(itemLength.value).fill("");
39
+ return padZero(props.targetNum, itemLength.value).split("");
40
+ });
41
+ const startNumArr = computed(() => padZero(props.startNum, itemLength.value).split(""));
42
+ const getFigureArr = (i) => {
43
+ const start2 = +startNumArr.value[i];
44
+ const target = +targetNumArr.value[i];
45
+ const result = [];
46
+ for (let i2 = start2; i2 <= 9; i2++) {
47
+ result.push(i2);
48
+ }
49
+ for (let i2 = 0; i2 <= CIRCLE_NUM; i2++) {
50
+ for (let j = 0; j <= 9; j++) {
51
+ result.push(j);
52
+ }
53
+ }
54
+ for (let i2 = 0; i2 <= target; i2++) {
55
+ result.push(i2);
56
+ }
57
+ return result;
58
+ };
59
+ const getDelay = (i, len) => {
60
+ if (props.stopOrder === "ltr")
61
+ return 0.2 * i;
62
+ return 0.2 * (len - 1 - i);
63
+ };
64
+ const rolling = ref(props.autoStart);
65
+ const start = () => {
66
+ rolling.value = true;
67
+ };
68
+ const reset = () => {
69
+ rolling.value = false;
70
+ if (props.autoStart) {
71
+ raf(() => start());
72
+ }
73
+ };
74
+ watch(() => props.autoStart, (value) => {
75
+ if (value) {
76
+ start();
77
+ }
78
+ });
79
+ useExpose({
80
+ start,
81
+ reset
82
+ });
83
+ return () => _createVNode("div", {
84
+ "class": bem()
85
+ }, [targetNumArr.value.map((_, i) => _createVNode(RollingTextItem, {
86
+ "figureArr": isCustomType.value ? getTextArrByIdx(i) : getFigureArr(i),
87
+ "duration": props.duration,
88
+ "direction": props.direction,
89
+ "isStart": rolling.value,
90
+ "height": props.height,
91
+ "delay": getDelay(i, itemLength.value)
92
+ }, null))]);
93
+ }
94
+ });
95
+ export {
96
+ stdin_default as default,
97
+ rollingTextProps
98
+ };
@@ -0,0 +1,67 @@
1
+ import { RollingTextDirection } from './types';
2
+ export declare const props: {
3
+ figureArr: {
4
+ type: import("vue").PropType<unknown[]>;
5
+ default: () => never[];
6
+ };
7
+ delay: NumberConstructor;
8
+ duration: {
9
+ type: NumberConstructor;
10
+ default: number;
11
+ };
12
+ isStart: BooleanConstructor;
13
+ direction: {
14
+ type: import("vue").PropType<RollingTextDirection>;
15
+ default: RollingTextDirection;
16
+ };
17
+ height: {
18
+ type: NumberConstructor;
19
+ default: number;
20
+ };
21
+ };
22
+ declare const _default: import("vue").DefineComponent<{
23
+ figureArr: {
24
+ type: import("vue").PropType<unknown[]>;
25
+ default: () => never[];
26
+ };
27
+ delay: NumberConstructor;
28
+ duration: {
29
+ type: NumberConstructor;
30
+ default: number;
31
+ };
32
+ isStart: BooleanConstructor;
33
+ direction: {
34
+ type: import("vue").PropType<RollingTextDirection>;
35
+ default: RollingTextDirection;
36
+ };
37
+ height: {
38
+ type: NumberConstructor;
39
+ default: number;
40
+ };
41
+ }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
42
+ figureArr: {
43
+ type: import("vue").PropType<unknown[]>;
44
+ default: () => never[];
45
+ };
46
+ delay: NumberConstructor;
47
+ duration: {
48
+ type: NumberConstructor;
49
+ default: number;
50
+ };
51
+ isStart: BooleanConstructor;
52
+ direction: {
53
+ type: import("vue").PropType<RollingTextDirection>;
54
+ default: RollingTextDirection;
55
+ };
56
+ height: {
57
+ type: NumberConstructor;
58
+ default: number;
59
+ };
60
+ }>>, {
61
+ height: number;
62
+ duration: number;
63
+ direction: RollingTextDirection;
64
+ figureArr: unknown[];
65
+ isStart: boolean;
66
+ }, {}>;
67
+ export default _default;
@@ -0,0 +1,47 @@
1
+ import { createVNode as _createVNode } from "vue";
2
+ import { defineComponent, computed } from "vue";
3
+ import { createNamespace, makeNumberProp, makeArrayProp, makeStringProp, addUnit } from "../utils/index.mjs";
4
+ const props = {
5
+ figureArr: makeArrayProp(),
6
+ delay: Number,
7
+ duration: makeNumberProp(2),
8
+ isStart: Boolean,
9
+ direction: makeStringProp("down"),
10
+ height: makeNumberProp(40)
11
+ };
12
+ const [name, bem] = createNamespace("rolling-text-item");
13
+ var stdin_default = defineComponent({
14
+ name,
15
+ props,
16
+ setup(props2) {
17
+ const newFigureArr = computed(() => props2.direction === "down" ? props2.figureArr.slice().reverse() : props2.figureArr);
18
+ const translatePx = computed(() => {
19
+ const totalHeight = props2.height * (props2.figureArr.length - 1);
20
+ return `-${totalHeight}px`;
21
+ });
22
+ const itemStyle = computed(() => ({
23
+ lineHeight: addUnit(props2.height)
24
+ }));
25
+ const rootStyle = computed(() => ({
26
+ height: addUnit(props2.height),
27
+ "--van-translate": translatePx.value,
28
+ "--van-duration": props2.duration + "s",
29
+ "--van-delay": props2.delay + "s"
30
+ }));
31
+ return () => _createVNode("div", {
32
+ "class": bem([props2.direction]),
33
+ "style": rootStyle.value
34
+ }, [_createVNode("div", {
35
+ "class": bem("box", {
36
+ animate: props2.isStart
37
+ })
38
+ }, [Array.isArray(newFigureArr.value) && newFigureArr.value.map((figure) => _createVNode("div", {
39
+ "class": bem("item"),
40
+ "style": itemStyle.value
41
+ }, [figure]))])]);
42
+ }
43
+ });
44
+ export {
45
+ stdin_default as default,
46
+ props
47
+ };
@@ -0,0 +1 @@
1
+ :root{--van-rolling-text-background: inherit;--van-rolling-text-color: var(--van-text-color);--van-rolling-text-font-size: var(--van-font-size-md);--van-rolling-text-gap: 0px;--van-rolling-text-item-width: 15px;--van-rolling-text-item-border-radius: 0px}.van-rolling-text{display:inline-flex;justify-content:center;align-items:center;font-size:var(--van-rolling-text-font-size);color:var(--van-rolling-text-color)}.van-rolling-text-item{margin-right:var(--van-rolling-text-gap);width:var(--van-rolling-text-item-width);border-radius:var(--van-rolling-text-item-border-radius);background:var(--van-rolling-text-background);overflow:hidden}.van-rolling-text-item:last-child{margin-right:0}.van-rolling-text-item__box{overflow:hidden}.van-rolling-text-item__box--animate{animation:van-up var(--van-duration) ease-in-out var(--van-delay);animation-iteration-count:1;animation-fill-mode:both}.van-rolling-text-item__item{text-align:center}.van-rolling-text-item--down .van-rolling-text-item__box{transform:translateY(var(--van-translate))}.van-rolling-text-item--down .van-rolling-text-item__box--animate{animation-name:van-down}@keyframes van-down{0%{transform:translateY(var(--van-translate))}to{transform:translateY(0)}}@keyframes van-up{0%{transform:translateY(0)}to{transform:translateY(var(--van-translate))}}
@@ -0,0 +1,79 @@
1
+ import _RollingText from './RollingText';
2
+ export declare const RollingText: import("../utils").WithInstall<import("vue").DefineComponent<{
3
+ startNum: {
4
+ type: NumberConstructor;
5
+ default: number;
6
+ };
7
+ targetNum: NumberConstructor;
8
+ textList: {
9
+ type: import("vue").PropType<string[]>;
10
+ default: () => never[];
11
+ };
12
+ duration: {
13
+ type: NumberConstructor;
14
+ default: number;
15
+ };
16
+ autoStart: {
17
+ type: BooleanConstructor;
18
+ default: true;
19
+ };
20
+ direction: {
21
+ type: import("vue").PropType<import("./types").RollingTextDirection>;
22
+ default: import("./types").RollingTextDirection;
23
+ };
24
+ stopOrder: {
25
+ type: import("vue").PropType<import("./types").RollingTextStopOrder>;
26
+ default: import("./types").RollingTextStopOrder;
27
+ };
28
+ height: {
29
+ type: NumberConstructor;
30
+ default: number;
31
+ };
32
+ }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
33
+ startNum: {
34
+ type: NumberConstructor;
35
+ default: number;
36
+ };
37
+ targetNum: NumberConstructor;
38
+ textList: {
39
+ type: import("vue").PropType<string[]>;
40
+ default: () => never[];
41
+ };
42
+ duration: {
43
+ type: NumberConstructor;
44
+ default: number;
45
+ };
46
+ autoStart: {
47
+ type: BooleanConstructor;
48
+ default: true;
49
+ };
50
+ direction: {
51
+ type: import("vue").PropType<import("./types").RollingTextDirection>;
52
+ default: import("./types").RollingTextDirection;
53
+ };
54
+ stopOrder: {
55
+ type: import("vue").PropType<import("./types").RollingTextStopOrder>;
56
+ default: import("./types").RollingTextStopOrder;
57
+ };
58
+ height: {
59
+ type: NumberConstructor;
60
+ default: number;
61
+ };
62
+ }>>, {
63
+ height: number;
64
+ duration: number;
65
+ direction: import("./types").RollingTextDirection;
66
+ autoStart: boolean;
67
+ startNum: number;
68
+ textList: string[];
69
+ stopOrder: import("./types").RollingTextStopOrder;
70
+ }, {}>>;
71
+ export default RollingText;
72
+ export { rollingTextProps } from './RollingText';
73
+ export type { RollingTextProps } from './RollingText';
74
+ export type { RollingTextDirection, RollingTextInstance, RollingTextStopOrder, RollingTextThemeVars, } from './types';
75
+ declare module 'vue' {
76
+ interface GlobalComponents {
77
+ VanRollingText: typeof _RollingText;
78
+ }
79
+ }
@@ -0,0 +1,10 @@
1
+ import { withInstall } from "../utils/index.mjs";
2
+ import _RollingText from "./RollingText.mjs";
3
+ const RollingText = withInstall(_RollingText);
4
+ var stdin_default = RollingText;
5
+ import { rollingTextProps } from "./RollingText.mjs";
6
+ export {
7
+ RollingText,
8
+ stdin_default as default,
9
+ rollingTextProps
10
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,2 @@
1
+ import "../../style/base.css";
2
+ import "../index.css";
@@ -0,0 +1,17 @@
1
+ import type { ComponentPublicInstance } from 'vue';
2
+ import type { RollingTextProps } from './RollingText';
3
+ export type RollingTextDirection = 'up' | 'down';
4
+ export type RollingTextStopOrder = 'ltr' | 'rtl';
5
+ export type RollingTextExpose = {
6
+ start: () => void;
7
+ reset: () => void;
8
+ };
9
+ export type RollingTextInstance = ComponentPublicInstance<RollingTextProps, RollingTextExpose>;
10
+ export type RollingTextThemeVars = {
11
+ rollingTextBackground?: string;
12
+ rollingTextColor?: string;
13
+ rollingTextFontSize?: string;
14
+ rollingTextGap?: string;
15
+ rollingTextItemWidth?: string;
16
+ rollingTextItemBorderRadius?: string;
17
+ };
File without changes
@@ -52,6 +52,7 @@ export declare const Signature: import("../utils").WithInstall<import("vue").Def
52
52
  }, {}>>;
53
53
  export default Signature;
54
54
  export type { SignatureProps } from './Signature';
55
+ export type { SignatureThemeVars } from './types';
55
56
  declare module 'vue' {
56
57
  interface GlobalComponents {
57
58
  Signature: typeof Signature;