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/README.md CHANGED
@@ -124,13 +124,13 @@ You can scan the following QR code to access the demo:
124
124
 
125
125
  Core contributors of Vant and Vant Weapp:
126
126
 
127
- | [![chenjiahan](https://avatars.githubusercontent.com/u/7237365?s=80&v=4)](https://github.com/chenjiahan/) | [![cookfront](https://avatars.githubusercontent.com/u/4829465?s=80&v=4)](https://github.com/cookfront/) | [![w91](https://avatars.githubusercontent.com/u/2599455?s=80&v=4)](https://github.com/w91/) | [![pangxie1991](https://avatars.githubusercontent.com/u/5961240?s=80&v=4)](https://github.com/pangxie1991/) | [![rex-zsd](https://avatars.githubusercontent.com/u/8767877?s=80&v=4)](https://github.com/rex-zsd/) |
128
- | :-: | :-: | :-: | :-: | :-: |
129
- | [chenjiahan](https://github.com/chenjiahan/) | [cookfront](https://github.com/cookfront/) | [wangnaiyi](https://github.com/w91/) | [pangxie](https://github.com/pangxie1991/) | [rex-zsd](https://github.com/rex-zsd/) |
127
+ | [![chenjiahan](https://avatars.githubusercontent.com/u/7237365?s=80&v=4)](https://github.com/chenjiahan/) | [![cookfront](https://avatars.githubusercontent.com/u/4829465?s=80&v=4)](https://github.com/cookfront/) | [![w91](https://avatars.githubusercontent.com/u/2599455?s=80&v=4)](https://github.com/w91/) | [![pangxie1991](https://avatars.githubusercontent.com/u/5961240?s=80&v=4)](https://github.com/pangxie1991/) | [![rex-zsd](https://avatars.githubusercontent.com/u/8767877?s=80&v=4)](https://github.com/rex-zsd/) | [![nemo-shen](https://avatars.githubusercontent.com/u/13480805?s=80&v=4)](https://github.com/nemo-shen/) |
128
+ | :-: | :-: | :-: | :-: | :-: | :-: |
129
+ | [chenjiahan](https://github.com/chenjiahan/) | [cookfront](https://github.com/cookfront/) | [wangnaiyi](https://github.com/w91/) | [pangxie](https://github.com/pangxie1991/) | [rex-zsd](https://github.com/rex-zsd/) | [nemo-shen](https://github.com/nemo-shen/) |
130
130
 
131
- | [![nemo-shen](https://avatars.githubusercontent.com/u/13480805?s=80&v=4)](https://github.com/nemo-shen/) | [![Lindysen](https://avatars.githubusercontent.com/u/33708359?s=80&v=4)](https://github.com/Lindysen/) | [![JakeLaoyu](https://avatars.githubusercontent.com/u/16181940?s=80&v=4)](https://github.com/JakeLaoyu/) | [![landluck](https://avatars.githubusercontent.com/u/27060081?s=80&v=4)](https://github.com/landluck/) | [![wjw-gavin](https://avatars.githubusercontent.com/u/19986739?s=80&v=4)](https://github.com/wjw-gavin/) |
132
- | :-: | :-: | :-: | :-: | :-: |
133
- | [nemo-shen](https://github.com/nemo-shen/) | [Lindysen](https://github.com/Lindysen/) | [JakeLaoyu](https://github.com/JakeLaoyu/) | [landluck](https://github.com/landluck/) | [wjw-gavin](https://github.com/wjw-gavin/) |
131
+ | [![Lindysen](https://avatars.githubusercontent.com/u/33708359?s=80&v=4)](https://github.com/Lindysen/) | [![JakeLaoyu](https://avatars.githubusercontent.com/u/16181940?s=80&v=4)](https://github.com/JakeLaoyu/) | [![landluck](https://avatars.githubusercontent.com/u/27060081?s=80&v=4)](https://github.com/landluck/) | [![wjw-gavin](https://avatars.githubusercontent.com/u/19986739?s=80&v=4)](https://github.com/wjw-gavin/) | [![inottn](https://avatars.githubusercontent.com/u/18509404?s=80&v=4)](https://github.com/inottn/) | [![zhousg](https://avatars.githubusercontent.com/u/15833290?s=80&v=4)](https://github.com/zhousg/) |
132
+ | :-: | :-: | :-: | :-: | :-: | :-: |
133
+ | [Lindysen](https://github.com/Lindysen/) | [JakeLaoyu](https://github.com/JakeLaoyu/) | [landluck](https://github.com/landluck/) | [wjw-gavin](https://github.com/wjw-gavin/) | [inottn](https://github.com/inottn/) | [zhousg](https://github.com/zhousg/) |
134
134
 
135
135
  ## All Contributors
136
136
 
@@ -61,7 +61,7 @@ export declare const Barrage: import("../utils").WithInstall<import("vue").Defin
61
61
  export default Barrage;
62
62
  export { barrageProps } from './Barrage';
63
63
  export type { BarrageProps, BarrageItem } from './Barrage';
64
- export type { BarrageInstance } from './types';
64
+ export type { BarrageInstance, BarrageThemeVars } from './types';
65
65
  declare module 'vue' {
66
66
  interface GlobalComponents {
67
67
  VanBarrage: typeof Barrage;
@@ -5,3 +5,9 @@ export type BarrageExpose = {
5
5
  pause(): void;
6
6
  };
7
7
  export type BarrageInstance = ComponentPublicInstance<BarrageProps, BarrageExpose>;
8
+ export type BarrageThemeVars = {
9
+ barrageFontSize?: string;
10
+ barrageSpace?: string;
11
+ barrageFont?: string;
12
+ barrageColor?: string;
13
+ };
@@ -12,5 +12,6 @@ export declare function useTouch(): {
12
12
  direction: import("vue").Ref<Direction>;
13
13
  isVertical: () => boolean;
14
14
  isHorizontal: () => boolean;
15
+ isTap: import("vue").Ref<boolean>;
15
16
  };
16
17
  export {};
@@ -1,4 +1,5 @@
1
1
  import { ref } from "vue";
2
+ import { TAP_OFFSET } from "../utils/index.mjs";
2
3
  function getDirection(x, y) {
3
4
  if (x > y) {
4
5
  return "horizontal";
@@ -16,6 +17,7 @@ function useTouch() {
16
17
  const offsetX = ref(0);
17
18
  const offsetY = ref(0);
18
19
  const direction = ref("");
20
+ const isTap = ref(true);
19
21
  const isVertical = () => direction.value === "vertical";
20
22
  const isHorizontal = () => direction.value === "horizontal";
21
23
  const reset = () => {
@@ -24,6 +26,7 @@ function useTouch() {
24
26
  offsetX.value = 0;
25
27
  offsetY.value = 0;
26
28
  direction.value = "";
29
+ isTap.value = true;
27
30
  };
28
31
  const start = (event) => {
29
32
  reset();
@@ -40,6 +43,9 @@ function useTouch() {
40
43
  if (!direction.value || offsetX.value < LOCK_DIRECTION_DISTANCE && offsetY.value < LOCK_DIRECTION_DISTANCE) {
41
44
  direction.value = getDirection(offsetX.value, offsetY.value);
42
45
  }
46
+ if (isTap.value && (offsetX.value > TAP_OFFSET || offsetY.value > TAP_OFFSET)) {
47
+ isTap.value = false;
48
+ }
43
49
  };
44
50
  return {
45
51
  move,
@@ -53,7 +59,8 @@ function useTouch() {
53
59
  offsetY,
54
60
  direction,
55
61
  isVertical,
56
- isHorizontal
62
+ isHorizontal,
63
+ isTap
57
64
  };
58
65
  }
59
66
  export {
@@ -1 +1 @@
1
- export type ConfigProviderThemeVars = import('../action-bar').ActionBarThemeVars & import('../action-bar-button').ActionBarButtonThemeVars & import('../action-bar-icon').ActionBarIconThemeVars & import('../action-sheet').ActionSheetThemeVars & import('../address-edit').AddressEditThemeVars & import('../address-list').AddressListThemeVars & import('../badge').BadgeThemeVars & import('../button').ButtonThemeVars & import('../calendar').CalendarThemeVars & import('../card').CardThemeVars & import('../cascader').CascaderThemeVars & import('../cell').CellThemeVars & import('../cell-group').CellGroupThemeVars & import('../checkbox').CheckboxThemeVars & import('../circle').CircleThemeVars & import('../collapse-item').CollapseItemThemeVars & import('../contact-card').ContactCardThemeVars & import('../contact-edit').ContactEditThemeVars & import('../contact-list').ContactListThemeVars & import('../count-down').CountDownThemeVars & import('../coupon').CouponThemeVars & import('../coupon-cell').CouponCellThemeVars & import('../coupon-list').CouponListThemeVars & import('../dialog').DialogThemeVars & import('../divider').DividerThemeVars & import('../dropdown-item').DropdownItemThemeVars & import('../dropdown-menu').DropdownMenuThemeVars & import('../empty').EmptyThemeVars & import('../field').FieldThemeVars & import('../grid-item').GridItemThemeVars & import('../image').ImageThemeVars & import('../image-preview').ImagePreviewThemeVars & import('../index-anchor').IndexAnchorThemeVars & import('../index-bar').IndexBarThemeVars & import('../list').ListThemeVars & import('../loading').LoadingThemeVars & import('../nav-bar').NavBarThemeVars & import('../notice-bar').NoticeBarThemeVars & import('../notify').NotifyThemeVars & import('../number-keyboard').NumberKeyboardThemeVars & import('../overlay').OverlayThemeVars & import('../pagination').PaginationThemeVars & import('../password-input').PasswordInputThemeVars & import('../picker').PickerThemeVars & import('../picker-group').PickerGroupThemeVars & import('../popover').PopoverThemeVars & import('../popup').PopupThemeVars & import('../progress').ProgressThemeVars & import('../pull-refresh').PullRefreshThemeVars & import('../radio').RadioThemeVars & import('../rate').RateThemeVars & import('../search').SearchThemeVars & import('../share-sheet').ShareSheetThemeVars & import('../sidebar').SidebarThemeVars & import('../sidebar-item').SidebarItemThemeVars & import('../skeleton').SkeletonThemeVars & import('../slider').SliderThemeVars & import('../step').StepThemeVars & import('../stepper').StepperThemeVars & import('../steps').StepsThemeVars & import('../sticky').StickyThemeVars & import('../submit-bar').SubmitBarThemeVars & import('../swipe').SwipeThemeVars & import('../switch').SwitchThemeVars & import('../tabbar').TabbarThemeVars & import('../tabbar-item').TabbarItemThemeVars & import('../tabs').TabsThemeVars & import('../tag').TagThemeVars & import('../toast').ToastThemeVars & import('../tree-select').TreeSelectThemeVars & import('../uploader').UploaderThemeVars;
1
+ export type ConfigProviderThemeVars = import('../action-bar').ActionBarThemeVars & import('../action-bar-button').ActionBarButtonThemeVars & import('../action-bar-icon').ActionBarIconThemeVars & import('../action-sheet').ActionSheetThemeVars & import('../address-edit').AddressEditThemeVars & import('../address-list').AddressListThemeVars & import('../badge').BadgeThemeVars & import('../barrage').BarrageThemeVars & import('../button').ButtonThemeVars & import('../calendar').CalendarThemeVars & import('../card').CardThemeVars & import('../cascader').CascaderThemeVars & import('../cell').CellThemeVars & import('../cell-group').CellGroupThemeVars & import('../checkbox').CheckboxThemeVars & import('../circle').CircleThemeVars & import('../collapse-item').CollapseItemThemeVars & import('../contact-card').ContactCardThemeVars & import('../contact-edit').ContactEditThemeVars & import('../contact-list').ContactListThemeVars & import('../count-down').CountDownThemeVars & import('../coupon').CouponThemeVars & import('../coupon-cell').CouponCellThemeVars & import('../coupon-list').CouponListThemeVars & import('../dialog').DialogThemeVars & import('../divider').DividerThemeVars & import('../dropdown-item').DropdownItemThemeVars & import('../dropdown-menu').DropdownMenuThemeVars & import('../empty').EmptyThemeVars & import('../field').FieldThemeVars & import('../floating-bubble').FloatingBubbleThemeVars & import('../floating-panel').FloatingPanelThemeVars & import('../grid-item').GridItemThemeVars & import('../image').ImageThemeVars & import('../image-preview').ImagePreviewThemeVars & import('../index-anchor').IndexAnchorThemeVars & import('../index-bar').IndexBarThemeVars & import('../list').ListThemeVars & import('../loading').LoadingThemeVars & import('../nav-bar').NavBarThemeVars & import('../notice-bar').NoticeBarThemeVars & import('../notify').NotifyThemeVars & import('../number-keyboard').NumberKeyboardThemeVars & import('../overlay').OverlayThemeVars & import('../pagination').PaginationThemeVars & import('../password-input').PasswordInputThemeVars & import('../picker').PickerThemeVars & import('../picker-group').PickerGroupThemeVars & import('../popover').PopoverThemeVars & import('../popup').PopupThemeVars & import('../progress').ProgressThemeVars & import('../pull-refresh').PullRefreshThemeVars & import('../radio').RadioThemeVars & import('../rate').RateThemeVars & import('../rolling-text').RollingTextThemeVars & import('../search').SearchThemeVars & import('../share-sheet').ShareSheetThemeVars & import('../sidebar').SidebarThemeVars & import('../sidebar-item').SidebarItemThemeVars & import('../signature').SignatureThemeVars & import('../skeleton').SkeletonThemeVars & import('../slider').SliderThemeVars & import('../step').StepThemeVars & import('../stepper').StepperThemeVars & import('../steps').StepsThemeVars & import('../sticky').StickyThemeVars & import('../submit-bar').SubmitBarThemeVars & import('../swipe').SwipeThemeVars & import('../switch').SwitchThemeVars & import('../tabbar').TabbarThemeVars & import('../tabbar-item').TabbarItemThemeVars & import('../tabs').TabsThemeVars & import('../tag').TagThemeVars & import('../toast').ToastThemeVars & import('../tree-select').TreeSelectThemeVars & import('../uploader').UploaderThemeVars & import('../watermark').WatermarkThemeVars;
@@ -55,7 +55,7 @@ export declare const DropdownMenu: import("../utils").WithInstall<import("vue").
55
55
  export default DropdownMenu;
56
56
  export { dropdownMenuProps } from './DropdownMenu';
57
57
  export type { DropdownMenuProps };
58
- export type { DropdownMenuDirection, DropdownMenuThemeVars } from './types';
58
+ export type { DropdownMenuInstance, DropdownMenuDirection, DropdownMenuThemeVars, } from './types';
59
59
  declare module 'vue' {
60
60
  interface GlobalComponents {
61
61
  VanDropdownMenu: typeof DropdownMenu;
@@ -427,7 +427,7 @@ var stdin_default = defineComponent({
427
427
  if (props.label) {
428
428
  return _createVNode("label", {
429
429
  "id": `${id}-label`,
430
- "for": getInputId(),
430
+ "for": slots.input ? void 0 : getInputId(),
431
431
  "onClick": (event) => {
432
432
  preventDefault(event);
433
433
  focus();
@@ -0,0 +1,86 @@
1
+ import { PropType, type ExtractPropTypes } from 'vue';
2
+ export type FloatingBubbleAxis = 'x' | 'y' | 'xy' | 'lock';
3
+ export type FloatingBubbleMagnetic = 'x' | 'y';
4
+ export type FloatingBubbleOffset = {
5
+ x: number;
6
+ y: number;
7
+ };
8
+ export declare const floatingBubbleProps: {
9
+ axis: {
10
+ type: PropType<FloatingBubbleAxis>;
11
+ default: FloatingBubbleAxis;
12
+ };
13
+ magnetic: PropType<FloatingBubbleMagnetic>;
14
+ icon: StringConstructor;
15
+ gap: {
16
+ type: NumberConstructor;
17
+ default: number;
18
+ };
19
+ offset: {
20
+ type: PropType<FloatingBubbleOffset>;
21
+ default: () => {
22
+ x: number;
23
+ y: number;
24
+ };
25
+ };
26
+ teleport: {
27
+ type: PropType<string | import("vue").RendererElement | null | undefined>;
28
+ default: string;
29
+ };
30
+ };
31
+ export type FloatingBubbleProps = ExtractPropTypes<typeof floatingBubbleProps>;
32
+ declare const _default: import("vue").DefineComponent<{
33
+ axis: {
34
+ type: PropType<FloatingBubbleAxis>;
35
+ default: FloatingBubbleAxis;
36
+ };
37
+ magnetic: PropType<FloatingBubbleMagnetic>;
38
+ icon: StringConstructor;
39
+ gap: {
40
+ type: NumberConstructor;
41
+ default: number;
42
+ };
43
+ offset: {
44
+ type: PropType<FloatingBubbleOffset>;
45
+ default: () => {
46
+ x: number;
47
+ y: number;
48
+ };
49
+ };
50
+ teleport: {
51
+ type: PropType<string | import("vue").RendererElement | null | undefined>;
52
+ default: string;
53
+ };
54
+ }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "update:offset" | "offsetChange")[], "click" | "update:offset" | "offsetChange", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
55
+ axis: {
56
+ type: PropType<FloatingBubbleAxis>;
57
+ default: FloatingBubbleAxis;
58
+ };
59
+ magnetic: PropType<FloatingBubbleMagnetic>;
60
+ icon: StringConstructor;
61
+ gap: {
62
+ type: NumberConstructor;
63
+ default: number;
64
+ };
65
+ offset: {
66
+ type: PropType<FloatingBubbleOffset>;
67
+ default: () => {
68
+ x: number;
69
+ y: number;
70
+ };
71
+ };
72
+ teleport: {
73
+ type: PropType<string | import("vue").RendererElement | null | undefined>;
74
+ default: string;
75
+ };
76
+ }>> & {
77
+ onClick?: ((...args: any[]) => any) | undefined;
78
+ "onUpdate:offset"?: ((...args: any[]) => any) | undefined;
79
+ onOffsetChange?: ((...args: any[]) => any) | undefined;
80
+ }, {
81
+ offset: FloatingBubbleOffset;
82
+ teleport: string | import("vue").RendererElement | null | undefined;
83
+ gap: number;
84
+ axis: FloatingBubbleAxis;
85
+ }, {}>;
86
+ export default _default;
@@ -0,0 +1,177 @@
1
+ import { withDirectives as _withDirectives, vShow as _vShow, createVNode as _createVNode } from "vue";
2
+ import { Teleport, computed, defineComponent, nextTick, onMounted, ref, watch, onActivated, onDeactivated } from "vue";
3
+ import { useRect, useEventListener } from "@vant/use";
4
+ import { useTouch } from "../composables/use-touch.mjs";
5
+ import { addUnit, closest, createNamespace, makeNumberProp, makeStringProp, pick, windowWidth, windowHeight } from "../utils/index.mjs";
6
+ import Icon from "../icon/index.mjs";
7
+ const floatingBubbleProps = {
8
+ axis: makeStringProp("y"),
9
+ magnetic: String,
10
+ icon: String,
11
+ gap: makeNumberProp(24),
12
+ offset: {
13
+ type: Object,
14
+ default: () => ({
15
+ x: -1,
16
+ y: -1
17
+ })
18
+ },
19
+ teleport: {
20
+ type: [String, Object],
21
+ default: "body"
22
+ }
23
+ };
24
+ const [name, bem] = createNamespace("floating-bubble");
25
+ var stdin_default = defineComponent({
26
+ name,
27
+ props: floatingBubbleProps,
28
+ emits: ["click", "update:offset", "offsetChange"],
29
+ setup(props, {
30
+ slots,
31
+ emit
32
+ }) {
33
+ const rootRef = ref();
34
+ const state = ref({
35
+ x: 0,
36
+ y: 0,
37
+ width: 0,
38
+ height: 0
39
+ });
40
+ const boundary = computed(() => ({
41
+ top: props.gap,
42
+ right: windowWidth.value - state.value.height - props.gap,
43
+ bottom: windowHeight.value - state.value.width - props.gap,
44
+ left: props.gap
45
+ }));
46
+ const dragging = ref(false);
47
+ let initialized = false;
48
+ const rootStyle = computed(() => {
49
+ const style = {};
50
+ const x = addUnit(state.value.x);
51
+ const y = addUnit(state.value.y);
52
+ style.transform = `translate3d(${x}, ${y}, 0)`;
53
+ if (dragging.value || !initialized) {
54
+ style.transition = "none";
55
+ }
56
+ return style;
57
+ });
58
+ const updateState = () => {
59
+ const {
60
+ width,
61
+ height
62
+ } = useRect(rootRef.value);
63
+ const {
64
+ offset
65
+ } = props;
66
+ state.value = {
67
+ x: offset.x > -1 ? offset.x : windowWidth.value - width - props.gap,
68
+ y: offset.y > -1 ? offset.y : windowHeight.value - height - props.gap,
69
+ width,
70
+ height
71
+ };
72
+ };
73
+ const touch = useTouch();
74
+ let prevX = 0;
75
+ let prevY = 0;
76
+ const onTouchStart = (e) => {
77
+ touch.start(e);
78
+ dragging.value = true;
79
+ prevX = state.value.x;
80
+ prevY = state.value.y;
81
+ };
82
+ const onTouchMove = (e) => {
83
+ e.preventDefault();
84
+ touch.move(e);
85
+ if (props.axis === "lock")
86
+ return;
87
+ if (!touch.isTap.value) {
88
+ if (props.axis === "x" || props.axis === "xy") {
89
+ let nextX = prevX + touch.deltaX.value;
90
+ if (nextX < boundary.value.left)
91
+ nextX = boundary.value.left;
92
+ if (nextX > boundary.value.right)
93
+ nextX = boundary.value.right;
94
+ state.value.x = nextX;
95
+ }
96
+ if (props.axis === "y" || props.axis === "xy") {
97
+ let nextY = prevY + touch.deltaY.value;
98
+ if (nextY < boundary.value.top)
99
+ nextY = boundary.value.top;
100
+ if (nextY > boundary.value.bottom)
101
+ nextY = boundary.value.bottom;
102
+ state.value.y = nextY;
103
+ }
104
+ const offset = pick(state.value, ["x", "y"]);
105
+ emit("update:offset", offset);
106
+ }
107
+ };
108
+ useEventListener("touchmove", onTouchMove, {
109
+ target: rootRef
110
+ });
111
+ const onTouchEnd = () => {
112
+ dragging.value = false;
113
+ nextTick(() => {
114
+ if (props.magnetic === "x") {
115
+ const nextX = closest([boundary.value.left, boundary.value.right], state.value.x);
116
+ state.value.x = nextX;
117
+ }
118
+ if (props.magnetic === "y") {
119
+ const nextY = closest([boundary.value.top, boundary.value.bottom], state.value.y);
120
+ state.value.y = nextY;
121
+ }
122
+ if (!touch.isTap.value) {
123
+ const offset = pick(state.value, ["x", "y"]);
124
+ emit("update:offset", offset);
125
+ if (prevX !== offset.x || prevY !== offset.y) {
126
+ emit("offsetChange", offset);
127
+ }
128
+ }
129
+ });
130
+ };
131
+ const onClick = (e) => {
132
+ if (touch.isTap.value)
133
+ emit("click", e);
134
+ };
135
+ onMounted(() => {
136
+ updateState();
137
+ nextTick(() => {
138
+ initialized = true;
139
+ });
140
+ });
141
+ watch([windowWidth, windowHeight, () => props.gap, () => props.offset], () => updateState(), {
142
+ deep: true
143
+ });
144
+ const show = ref(true);
145
+ onActivated(() => {
146
+ show.value = true;
147
+ });
148
+ onDeactivated(() => {
149
+ if (props.teleport) {
150
+ show.value = false;
151
+ }
152
+ });
153
+ return () => {
154
+ const Content = _withDirectives(_createVNode("div", {
155
+ "class": bem(),
156
+ "ref": rootRef,
157
+ "onTouchstartPassive": onTouchStart,
158
+ "onTouchend": onTouchEnd,
159
+ "onTouchcancel": onTouchEnd,
160
+ "onClick": onClick,
161
+ "style": rootStyle.value
162
+ }, [slots.default ? slots.default() : _createVNode(Icon, {
163
+ "name": props.icon,
164
+ "class": bem("icon")
165
+ }, null)]), [[_vShow, show.value]]);
166
+ return props.teleport ? _createVNode(Teleport, {
167
+ "to": props.teleport
168
+ }, {
169
+ default: () => [Content]
170
+ }) : Content;
171
+ };
172
+ }
173
+ });
174
+ export {
175
+ stdin_default as default,
176
+ floatingBubbleProps
177
+ };
@@ -0,0 +1 @@
1
+ :root{--van-floating-bubble-size: 48px;--van-floating-bubble-initial-gap: 24px;--van-floating-bubble-icon-size: 28px;--van-floating-bubble-background: var(--van-primary-color);--van-floating-bubble-color: var(--van-background-2);--van-floating-bubble-z-index: 999}.van-floating-bubble{position:fixed;left:0;top:0;right:var(--van-floating-bubble-initial-gap);bottom:var(--van-floating-bubble-initial-gap);width:var(--van-floating-bubble-size);height:var(--van-floating-bubble-size);box-sizing:border-box;display:flex;justify-content:center;align-items:center;overflow:hidden;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none;background:var(--van-floating-bubble-background);color:var(--van-floating-bubble-color);border-radius:var(--van-radius-max);z-index:var(--van-floating-bubble-z-index);transition:transform .3s}.van-floating-bubble:active{opacity:.9}.van-floating-bubble__icon{font-size:var(--van-floating-bubble-icon-size)}
@@ -0,0 +1,63 @@
1
+ export declare const FloatingBubble: import("../utils").WithInstall<import("vue").DefineComponent<{
2
+ axis: {
3
+ type: import("vue").PropType<import("./FloatingBubble").FloatingBubbleAxis>;
4
+ default: import("./FloatingBubble").FloatingBubbleAxis;
5
+ };
6
+ magnetic: import("vue").PropType<import("./FloatingBubble").FloatingBubbleMagnetic>;
7
+ icon: StringConstructor;
8
+ gap: {
9
+ type: NumberConstructor;
10
+ default: number;
11
+ };
12
+ offset: {
13
+ type: import("vue").PropType<import("./FloatingBubble").FloatingBubbleOffset>;
14
+ default: () => {
15
+ x: number;
16
+ y: number;
17
+ };
18
+ };
19
+ teleport: {
20
+ type: import("vue").PropType<string | import("vue").RendererElement | null | undefined>;
21
+ default: string;
22
+ };
23
+ }, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "update:offset" | "offsetChange")[], "click" | "update:offset" | "offsetChange", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
24
+ axis: {
25
+ type: import("vue").PropType<import("./FloatingBubble").FloatingBubbleAxis>;
26
+ default: import("./FloatingBubble").FloatingBubbleAxis;
27
+ };
28
+ magnetic: import("vue").PropType<import("./FloatingBubble").FloatingBubbleMagnetic>;
29
+ icon: StringConstructor;
30
+ gap: {
31
+ type: NumberConstructor;
32
+ default: number;
33
+ };
34
+ offset: {
35
+ type: import("vue").PropType<import("./FloatingBubble").FloatingBubbleOffset>;
36
+ default: () => {
37
+ x: number;
38
+ y: number;
39
+ };
40
+ };
41
+ teleport: {
42
+ type: import("vue").PropType<string | import("vue").RendererElement | null | undefined>;
43
+ default: string;
44
+ };
45
+ }>> & {
46
+ onClick?: ((...args: any[]) => any) | undefined;
47
+ "onUpdate:offset"?: ((...args: any[]) => any) | undefined;
48
+ onOffsetChange?: ((...args: any[]) => any) | undefined;
49
+ }, {
50
+ offset: import("./FloatingBubble").FloatingBubbleOffset;
51
+ teleport: string | import("vue").RendererElement | null | undefined;
52
+ gap: number;
53
+ axis: import("./FloatingBubble").FloatingBubbleAxis;
54
+ }, {}>>;
55
+ export default FloatingBubble;
56
+ export { floatingBubbleProps } from './FloatingBubble';
57
+ export type { FloatingBubbleProps, FloatingBubbleAxis, FloatingBubbleMagnetic, FloatingBubbleOffset, } from './FloatingBubble';
58
+ export type { FloatingBubbleThemeVars } from './types';
59
+ declare module 'vue' {
60
+ interface GlobalComponents {
61
+ FloatingBubble: typeof FloatingBubble;
62
+ }
63
+ }
@@ -0,0 +1,10 @@
1
+ import { withInstall } from "../utils/index.mjs";
2
+ import _FloatingBubble from "./FloatingBubble.mjs";
3
+ const FloatingBubble = withInstall(_FloatingBubble);
4
+ var stdin_default = FloatingBubble;
5
+ import { floatingBubbleProps } from "./FloatingBubble.mjs";
6
+ export {
7
+ FloatingBubble,
8
+ stdin_default as default,
9
+ floatingBubbleProps
10
+ };
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,4 @@
1
+ import "../../style/base.css";
2
+ import "../../badge/index.css";
3
+ import "../../icon/index.css";
4
+ import "../index.css";
@@ -0,0 +1,8 @@
1
+ export type FloatingBubbleThemeVars = {
2
+ floatingBubbleSize?: string;
3
+ floatingBubbleInitialGap?: string;
4
+ floatingBubbleIconSize?: string;
5
+ floatingBubbleBackground?: string;
6
+ floatingBubbleColor?: string;
7
+ floatingBubbleZIndex?: number | string;
8
+ };
File without changes
@@ -1,13 +1,10 @@
1
1
  import { createVNode as _createVNode } from "vue";
2
2
  import { computed, defineComponent, ref, watch } from "vue";
3
- import { addUnit, createNamespace, makeArrayProp, makeNumericProp, truthProp } from "../utils/index.mjs";
4
- import { useWindowSize } from "@vant/use";
3
+ import { addUnit, closest, createNamespace, makeArrayProp, makeNumericProp, truthProp, windowHeight } from "../utils/index.mjs";
4
+ import { useEventListener } from "@vant/use";
5
5
  import { useLockScroll } from "../composables/use-lock-scroll.mjs";
6
6
  import { useTouch } from "../composables/use-touch.mjs";
7
7
  import { useSyncPropRef } from "../composables/use-sync-prop-ref.mjs";
8
- const {
9
- height: windowHeight
10
- } = useWindowSize();
11
8
  const floatingPanelProps = {
12
9
  height: makeNumericProp(0),
13
10
  anchors: makeArrayProp(),
@@ -56,7 +53,6 @@ var stdin_default = defineComponent({
56
53
  }
57
54
  return moveY;
58
55
  };
59
- const closest = (arr, target) => arr.reduce((pre, cur) => Math.abs(pre - target) < Math.abs(cur - target) ? pre : cur);
60
56
  let startY;
61
57
  const touch = useTouch();
62
58
  const onTouchstart = (e) => {
@@ -97,6 +93,9 @@ var stdin_default = defineComponent({
97
93
  immediate: true
98
94
  });
99
95
  useLockScroll(rootRef, () => true);
96
+ useEventListener("touchmove", onTouchmove, {
97
+ target: rootRef
98
+ });
100
99
  return () => {
101
100
  var _a;
102
101
  return _createVNode("div", {
@@ -106,7 +105,6 @@ var stdin_default = defineComponent({
106
105
  "ref": rootRef,
107
106
  "style": rootStyle.value,
108
107
  "onTouchstartPassive": onTouchstart,
109
- "onTouchmove": onTouchmove,
110
108
  "onTouchend": onTouchend,
111
109
  "onTouchcancel": onTouchend
112
110
  }, [_createVNode("div", {
@@ -1,4 +1,3 @@
1
- import { FloatingPanelProps } from './FloatingPanel';
2
1
  export declare const FloatingPanel: import("../utils").WithInstall<import("vue").DefineComponent<{
3
2
  height: {
4
3
  type: (NumberConstructor | StringConstructor)[];
@@ -52,7 +51,9 @@ export declare const FloatingPanel: import("../utils").WithInstall<import("vue")
52
51
  contentDraggable: boolean;
53
52
  }, {}>>;
54
53
  export default FloatingPanel;
55
- export type { FloatingPanelProps };
54
+ export { floatingPanelProps } from './FloatingPanel';
55
+ export type { FloatingPanelProps } from './FloatingPanel';
56
+ export type { FloatingPanelThemeVars } from './types';
56
57
  declare module 'vue' {
57
58
  interface GlobalComponents {
58
59
  VanFloatingPanel: typeof FloatingPanel;
@@ -2,7 +2,9 @@ import { withInstall } from "../utils/index.mjs";
2
2
  import _FloatingPanel from "./FloatingPanel.mjs";
3
3
  const FloatingPanel = withInstall(_FloatingPanel);
4
4
  var stdin_default = FloatingPanel;
5
+ import { floatingPanelProps } from "./FloatingPanel.mjs";
5
6
  export {
6
7
  FloatingPanel,
7
- stdin_default as default
8
+ stdin_default as default,
9
+ floatingPanelProps
8
10
  };
@@ -0,0 +1,9 @@
1
+ export type FloatingPanelThemeVars = {
2
+ floatingPanelBorderRadius?: string;
3
+ floatingPanelHeaderHeight?: string;
4
+ floatingPanelZIndex?: number | string;
5
+ floatingPanelBackground?: string;
6
+ floatingPanelBarWidth?: string;
7
+ floatingPanelBarHeight?: string;
8
+ floatingPanelBarColor?: string;
9
+ };
File without changes
@@ -1,6 +1,6 @@
1
1
  import { createVNode as _createVNode } from "vue";
2
2
  import { ref, watch, computed, reactive, defineComponent } from "vue";
3
- import { clamp, numericProp, preventDefault, createNamespace, makeRequiredProp, LONG_PRESS_START_TIME } from "../utils/index.mjs";
3
+ import { clamp, numericProp, preventDefault, createNamespace, makeRequiredProp, LONG_PRESS_START_TIME, TAP_OFFSET } from "../utils/index.mjs";
4
4
  import { useTouch } from "../composables/use-touch.mjs";
5
5
  import { raf, useEventListener, useRect } from "@vant/use";
6
6
  import { Image } from "../image/index.mjs";
@@ -192,7 +192,6 @@ var stdin_default = defineComponent({
192
192
  } = touch;
193
193
  const deltaTime = Date.now() - touchStartTime;
194
194
  const TAP_TIME = 250;
195
- const TAP_OFFSET = 5;
196
195
  if (offsetX.value < TAP_OFFSET && offsetY.value < TAP_OFFSET) {
197
196
  if (deltaTime < TAP_TIME) {
198
197
  if (doubleTapTimer) {
package/es/index.d.ts CHANGED
@@ -35,6 +35,7 @@ export * from "./dropdown-item";
35
35
  export * from "./dropdown-menu";
36
36
  export * from "./empty";
37
37
  export * from "./field";
38
+ export * from "./floating-bubble";
38
39
  export * from "./floating-panel";
39
40
  export * from "./form";
40
41
  export * from "./grid";
@@ -64,6 +65,7 @@ export * from "./pull-refresh";
64
65
  export * from "./radio";
65
66
  export * from "./radio-group";
66
67
  export * from "./rate";
68
+ export * from "./rolling-text";
67
69
  export * from "./row";
68
70
  export * from "./search";
69
71
  export * from "./share-sheet";
@@ -103,4 +105,4 @@ declare namespace _default {
103
105
  }
104
106
  export default _default;
105
107
  export function install(app: any): void;
106
- export const version: "4.5.0";
108
+ export const version: "4.6.1";