vant 4.4.1 → 4.6.0
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.
- package/es/address-list/AddressList.d.ts +13 -0
- package/es/address-list/AddressList.mjs +4 -2
- package/es/address-list/AddressListItem.d.ts +9 -0
- package/es/address-list/AddressListItem.mjs +4 -3
- package/es/address-list/index.d.ts +9 -0
- package/es/back-top/BackTop.mjs +14 -1
- package/es/barrage/index.d.ts +1 -1
- package/es/barrage/types.d.ts +6 -0
- package/es/composables/use-touch.d.ts +1 -0
- package/es/composables/use-touch.mjs +8 -1
- package/es/config-provider/types.d.ts +1 -1
- package/es/date-picker/DatePicker.d.ts +3 -3
- package/es/date-picker/index.d.ts +2 -2
- package/es/date-picker/utils.d.ts +4 -2
- package/es/date-picker/utils.mjs +8 -3
- package/es/dropdown-menu/DropdownMenu.mjs +10 -3
- package/es/dropdown-menu/index.d.ts +1 -1
- package/es/dropdown-menu/types.d.ts +5 -1
- package/es/field/Field.mjs +1 -1
- package/es/floating-bubble/FloatingBubble.d.ts +86 -0
- package/es/floating-bubble/FloatingBubble.mjs +177 -0
- package/es/floating-bubble/index.css +1 -0
- package/es/floating-bubble/index.d.ts +63 -0
- package/es/floating-bubble/index.mjs +10 -0
- package/es/floating-bubble/style/index.d.ts +1 -0
- package/es/floating-bubble/style/index.mjs +4 -0
- package/es/floating-bubble/types.d.ts +8 -0
- package/es/floating-bubble/types.mjs +0 -0
- package/es/floating-panel/FloatingPanel.d.ts +77 -0
- package/es/floating-panel/FloatingPanel.mjs +127 -0
- package/es/floating-panel/index.css +1 -0
- package/es/floating-panel/index.d.ts +61 -0
- package/es/floating-panel/index.mjs +10 -0
- package/es/floating-panel/style/index.d.ts +1 -0
- package/es/floating-panel/style/index.mjs +2 -0
- package/es/floating-panel/types.d.ts +9 -0
- package/es/floating-panel/types.mjs +0 -0
- package/es/image-preview/ImagePreviewItem.mjs +1 -2
- package/es/index.d.ts +4 -1
- package/es/index.mjs +10 -1
- package/es/picker/PickerColumn.mjs +7 -2
- package/es/rate/Rate.d.ts +4 -0
- package/es/rate/Rate.mjs +16 -10
- package/es/rate/index.css +1 -1
- package/es/rate/index.d.ts +3 -0
- package/es/rolling-text/RollingText.d.ts +104 -0
- package/es/rolling-text/RollingText.mjs +98 -0
- package/es/rolling-text/RollingTextItem.d.ts +67 -0
- package/es/rolling-text/RollingTextItem.mjs +47 -0
- package/es/rolling-text/index.css +1 -0
- package/es/rolling-text/index.d.ts +79 -0
- package/es/rolling-text/index.mjs +10 -0
- package/es/rolling-text/style/index.d.ts +1 -0
- package/es/rolling-text/style/index.mjs +2 -0
- package/es/rolling-text/types.d.ts +17 -0
- package/es/rolling-text/types.mjs +0 -0
- package/es/signature/index.d.ts +1 -0
- package/es/signature/types.d.ts +6 -0
- package/es/signature/types.mjs +0 -0
- package/es/slider/Slider.d.ts +1 -1
- package/es/slider/Slider.mjs +10 -2
- package/es/slider/index.d.ts +1 -1
- package/es/stepper/Stepper.d.ts +1 -1
- package/es/stepper/index.d.ts +1 -1
- package/es/time-picker/TimePicker.d.ts +31 -4
- package/es/time-picker/TimePicker.mjs +73 -21
- package/es/time-picker/index.d.ts +20 -2
- package/es/utils/basic.d.ts +3 -0
- package/es/utils/closest.d.ts +1 -0
- package/es/utils/closest.mjs +8 -0
- package/es/utils/constant.d.ts +1 -0
- package/es/utils/constant.mjs +3 -1
- package/es/utils/index.d.ts +1 -0
- package/es/utils/index.mjs +1 -0
- package/es/watermark/index.d.ts +1 -0
- package/es/watermark/types.d.ts +3 -0
- package/es/watermark/types.mjs +0 -0
- package/lib/address-list/AddressList.d.ts +13 -0
- package/lib/address-list/AddressList.js +3 -1
- package/lib/address-list/AddressListItem.d.ts +9 -0
- package/lib/address-list/AddressListItem.js +3 -2
- package/lib/address-list/index.d.ts +9 -0
- package/lib/back-top/BackTop.js +13 -0
- package/lib/barrage/index.d.ts +1 -1
- package/lib/barrage/types.d.ts +6 -0
- package/lib/composables/use-touch.d.ts +1 -0
- package/lib/composables/use-touch.js +8 -1
- package/lib/config-provider/types.d.ts +1 -1
- package/lib/date-picker/DatePicker.d.ts +3 -3
- package/lib/date-picker/index.d.ts +2 -2
- package/lib/date-picker/utils.d.ts +4 -2
- package/lib/date-picker/utils.js +2 -2
- package/lib/dropdown-menu/DropdownMenu.js +10 -3
- package/lib/dropdown-menu/index.d.ts +1 -1
- package/lib/dropdown-menu/types.d.ts +5 -1
- package/lib/field/Field.js +1 -1
- package/lib/floating-bubble/FloatingBubble.d.ts +86 -0
- package/lib/floating-bubble/FloatingBubble.js +206 -0
- package/lib/floating-bubble/index.css +1 -0
- package/lib/floating-bubble/index.d.ts +63 -0
- package/lib/floating-bubble/index.js +39 -0
- package/lib/floating-bubble/style/index.d.ts +1 -0
- package/lib/floating-bubble/style/index.js +4 -0
- package/lib/floating-bubble/types.d.ts +8 -0
- package/lib/floating-bubble/types.js +15 -0
- package/lib/floating-panel/FloatingPanel.d.ts +77 -0
- package/lib/floating-panel/FloatingPanel.js +146 -0
- package/lib/floating-panel/index.css +1 -0
- package/lib/floating-panel/index.d.ts +61 -0
- package/lib/floating-panel/index.js +39 -0
- package/lib/floating-panel/style/index.d.ts +1 -0
- package/lib/floating-panel/style/index.js +2 -0
- package/lib/floating-panel/types.d.ts +9 -0
- package/lib/floating-panel/types.js +15 -0
- package/lib/image-preview/ImagePreviewItem.js +1 -2
- package/lib/index.css +1 -1
- package/lib/index.d.ts +4 -1
- package/lib/index.js +10 -1
- package/lib/picker/PickerColumn.js +7 -2
- package/lib/rate/Rate.d.ts +4 -0
- package/lib/rate/Rate.js +16 -10
- package/lib/rate/index.css +1 -1
- package/lib/rate/index.d.ts +3 -0
- package/lib/rolling-text/RollingText.d.ts +104 -0
- package/lib/rolling-text/RollingText.js +127 -0
- package/lib/rolling-text/RollingTextItem.d.ts +67 -0
- package/lib/rolling-text/RollingTextItem.js +66 -0
- package/lib/rolling-text/index.css +1 -0
- package/lib/rolling-text/index.d.ts +79 -0
- package/lib/rolling-text/index.js +39 -0
- package/lib/rolling-text/style/index.d.ts +1 -0
- package/lib/rolling-text/style/index.js +2 -0
- package/lib/rolling-text/types.d.ts +17 -0
- package/lib/rolling-text/types.js +15 -0
- package/lib/signature/index.d.ts +1 -0
- package/lib/signature/types.d.ts +6 -0
- package/lib/signature/types.js +15 -0
- package/lib/slider/Slider.d.ts +1 -1
- package/lib/slider/Slider.js +10 -2
- package/lib/slider/index.d.ts +1 -1
- package/lib/stepper/Stepper.d.ts +1 -1
- package/lib/stepper/index.d.ts +1 -1
- package/lib/time-picker/TimePicker.d.ts +31 -4
- package/lib/time-picker/TimePicker.js +84 -32
- package/lib/time-picker/index.d.ts +20 -2
- package/lib/utils/basic.d.ts +3 -0
- package/lib/utils/closest.d.ts +1 -0
- package/lib/utils/closest.js +27 -0
- package/lib/utils/constant.d.ts +1 -0
- package/lib/utils/constant.js +3 -1
- package/lib/utils/index.d.ts +1 -0
- package/lib/utils/index.js +1 -0
- package/lib/vant.cjs.js +2547 -2019
- package/lib/vant.es.js +2547 -2019
- package/lib/vant.js +2544 -2016
- package/lib/vant.min.js +1 -1
- package/lib/watermark/index.d.ts +1 -0
- package/lib/watermark/types.d.ts +3 -0
- package/lib/watermark/types.js +15 -0
- package/lib/web-types.json +1 -1
- package/package.json +1 -1
@@ -28,7 +28,7 @@ export declare const DatePicker: import("../utils").WithInstall<import("vue").De
|
|
28
28
|
type: import("vue").PropType<string[]>;
|
29
29
|
default: () => never[];
|
30
30
|
};
|
31
|
-
filter: import("vue").PropType<(columnType: string, options: import("..").PickerOption[]) => import("..").PickerOption[]>;
|
31
|
+
filter: import("vue").PropType<(columnType: string, options: import("..").PickerOption[], values?: string[] | undefined) => import("..").PickerOption[]>;
|
32
32
|
formatter: {
|
33
33
|
type: import("vue").PropType<(type: string, option: import("..").PickerOption) => import("..").PickerOption>;
|
34
34
|
default: (type: string, option: import("..").PickerOption) => import("..").PickerOption;
|
@@ -77,7 +77,7 @@ export declare const DatePicker: import("../utils").WithInstall<import("vue").De
|
|
77
77
|
type: import("vue").PropType<string[]>;
|
78
78
|
default: () => never[];
|
79
79
|
};
|
80
|
-
filter: import("vue").PropType<(columnType: string, options: import("..").PickerOption[]) => import("..").PickerOption[]>;
|
80
|
+
filter: import("vue").PropType<(columnType: string, options: import("..").PickerOption[], values?: string[] | undefined) => import("..").PickerOption[]>;
|
81
81
|
formatter: {
|
82
82
|
type: import("vue").PropType<(type: string, option: import("..").PickerOption) => import("..").PickerOption>;
|
83
83
|
default: (type: string, option: import("..").PickerOption) => import("..").PickerOption;
|
@@ -1,6 +1,8 @@
|
|
1
|
+
import { type RequiredParams } from '../utils';
|
1
2
|
import type { PropType } from 'vue';
|
2
3
|
import type { PickerOption } from '../picker';
|
3
|
-
type Filter = (columnType: string, options: PickerOption[]) => PickerOption[];
|
4
|
+
type Filter = (columnType: string, options: PickerOption[], values?: string[]) => PickerOption[];
|
5
|
+
export type TimeFilter = RequiredParams<Filter>;
|
4
6
|
type Formatter = (type: string, option: PickerOption) => PickerOption;
|
5
7
|
export declare const sharedProps: {
|
6
8
|
loading: BooleanConstructor;
|
@@ -40,6 +42,6 @@ export declare const sharedProps: {
|
|
40
42
|
export declare const pickerInheritKeys: ("title" | "readonly" | "loading" | "allowHtml" | "optionHeight" | "showToolbar" | "swipeDuration" | "visibleOptionNum" | "cancelButtonText" | "confirmButtonText")[];
|
41
43
|
export declare function times<T>(n: number, iteratee: (index: number) => T): T[];
|
42
44
|
export declare const getMonthEndDay: (year: number, month: number) => number;
|
43
|
-
export declare const genOptions: <T extends string>(min: number, max: number, type: T, formatter: Formatter, filter?: Filter) => PickerOption[];
|
45
|
+
export declare const genOptions: <T extends string>(min: number, max: number, type: T, formatter: Formatter, filter?: Filter | TimeFilter, values?: string[]) => PickerOption[];
|
44
46
|
export declare const formatValueRange: (values: string[], columns: PickerOption[][]) => string[];
|
45
47
|
export {};
|
package/lib/date-picker/utils.js
CHANGED
@@ -48,7 +48,7 @@ function times(n, iteratee) {
|
|
48
48
|
return result;
|
49
49
|
}
|
50
50
|
const getMonthEndDay = (year, month) => 32 - new Date(year, month - 1, 32).getDate();
|
51
|
-
const genOptions = (min, max, type, formatter, filter) => {
|
51
|
+
const genOptions = (min, max, type, formatter, filter, values) => {
|
52
52
|
const options = times(max - min + 1, (index) => {
|
53
53
|
const value = (0, import_utils.padZero)(min + index);
|
54
54
|
return formatter(type, {
|
@@ -56,7 +56,7 @@ const genOptions = (min, max, type, formatter, filter) => {
|
|
56
56
|
value
|
57
57
|
});
|
58
58
|
});
|
59
|
-
return filter ? filter(type, options) : options;
|
59
|
+
return filter ? filter(type, options, values) : options;
|
60
60
|
};
|
61
61
|
const formatValueRange = (values, columns) => values.map((value, index) => {
|
62
62
|
const column = columns[index];
|
@@ -26,6 +26,7 @@ var import_vue = require("vue");
|
|
26
26
|
var import_vue2 = require("vue");
|
27
27
|
var import_utils = require("../utils");
|
28
28
|
var import_use_id = require("../composables/use-id");
|
29
|
+
var import_use_expose = require("../composables/use-expose");
|
29
30
|
var import_use = require("@vant/use");
|
30
31
|
const [name, bem] = (0, import_utils.createNamespace)("dropdown-menu");
|
31
32
|
const dropdownMenuProps = {
|
@@ -61,11 +62,14 @@ var stdin_default = (0, import_vue2.defineComponent)({
|
|
61
62
|
};
|
62
63
|
}
|
63
64
|
});
|
65
|
+
const close = () => {
|
66
|
+
children.forEach((item) => {
|
67
|
+
item.toggle(false);
|
68
|
+
});
|
69
|
+
};
|
64
70
|
const onClickAway = () => {
|
65
71
|
if (props.closeOnClickOutside) {
|
66
|
-
|
67
|
-
item.toggle(false);
|
68
|
-
});
|
72
|
+
close();
|
69
73
|
}
|
70
74
|
};
|
71
75
|
const updateOffset = () => {
|
@@ -128,6 +132,9 @@ var stdin_default = (0, import_vue2.defineComponent)({
|
|
128
132
|
"class": "van-ellipsis"
|
129
133
|
}, [item.renderTitle()])])]);
|
130
134
|
};
|
135
|
+
(0, import_use_expose.useExpose)({
|
136
|
+
close
|
137
|
+
});
|
131
138
|
linkChildren({
|
132
139
|
id,
|
133
140
|
props,
|
@@ -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;
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import type { Ref } from 'vue';
|
1
|
+
import type { ComponentPublicInstance, Ref } from 'vue';
|
2
2
|
import type { DropdownMenuProps } from './DropdownMenu';
|
3
3
|
export type DropdownMenuDirection = 'up' | 'down';
|
4
4
|
export type DropdownMenuProvide = {
|
@@ -7,6 +7,10 @@ export type DropdownMenuProvide = {
|
|
7
7
|
offset: Ref<number>;
|
8
8
|
updateOffset: () => void;
|
9
9
|
};
|
10
|
+
export type DropdownMenuExpose = {
|
11
|
+
close: () => void;
|
12
|
+
};
|
13
|
+
export type DropdownMenuInstance = ComponentPublicInstance<DropdownMenuProps, DropdownMenuExpose>;
|
10
14
|
export type DropdownMenuThemeVars = {
|
11
15
|
dropdownMenuHeight?: string;
|
12
16
|
dropdownMenuBackground?: string;
|
package/lib/field/Field.js
CHANGED
@@ -451,7 +451,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
|
|
451
451
|
if (props.label) {
|
452
452
|
return (0, import_vue.createVNode)("label", {
|
453
453
|
"id": `${id}-label`,
|
454
|
-
"for": getInputId(),
|
454
|
+
"for": slots.input ? void 0 : getInputId(),
|
455
455
|
"onClick": (event) => {
|
456
456
|
(0, import_utils.preventDefault)(event);
|
457
457
|
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,206 @@
|
|
1
|
+
var __create = Object.create;
|
2
|
+
var __defProp = Object.defineProperty;
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
7
|
+
var __export = (target, all) => {
|
8
|
+
for (var name2 in all)
|
9
|
+
__defProp(target, name2, { get: all[name2], enumerable: true });
|
10
|
+
};
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
13
|
+
for (let key of __getOwnPropNames(from))
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
16
|
+
}
|
17
|
+
return to;
|
18
|
+
};
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
24
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
25
|
+
mod
|
26
|
+
));
|
27
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
28
|
+
var stdin_exports = {};
|
29
|
+
__export(stdin_exports, {
|
30
|
+
default: () => stdin_default,
|
31
|
+
floatingBubbleProps: () => floatingBubbleProps
|
32
|
+
});
|
33
|
+
module.exports = __toCommonJS(stdin_exports);
|
34
|
+
var import_vue = require("vue");
|
35
|
+
var import_vue2 = require("vue");
|
36
|
+
var import_use = require("@vant/use");
|
37
|
+
var import_use_touch = require("../composables/use-touch");
|
38
|
+
var import_utils = require("../utils");
|
39
|
+
var import_icon = __toESM(require("../icon"));
|
40
|
+
const floatingBubbleProps = {
|
41
|
+
axis: (0, import_utils.makeStringProp)("y"),
|
42
|
+
magnetic: String,
|
43
|
+
icon: String,
|
44
|
+
gap: (0, import_utils.makeNumberProp)(24),
|
45
|
+
offset: {
|
46
|
+
type: Object,
|
47
|
+
default: () => ({
|
48
|
+
x: -1,
|
49
|
+
y: -1
|
50
|
+
})
|
51
|
+
},
|
52
|
+
teleport: {
|
53
|
+
type: [String, Object],
|
54
|
+
default: "body"
|
55
|
+
}
|
56
|
+
};
|
57
|
+
const [name, bem] = (0, import_utils.createNamespace)("floating-bubble");
|
58
|
+
var stdin_default = (0, import_vue2.defineComponent)({
|
59
|
+
name,
|
60
|
+
props: floatingBubbleProps,
|
61
|
+
emits: ["click", "update:offset", "offsetChange"],
|
62
|
+
setup(props, {
|
63
|
+
slots,
|
64
|
+
emit
|
65
|
+
}) {
|
66
|
+
const rootRef = (0, import_vue2.ref)();
|
67
|
+
const state = (0, import_vue2.ref)({
|
68
|
+
x: 0,
|
69
|
+
y: 0,
|
70
|
+
width: 0,
|
71
|
+
height: 0
|
72
|
+
});
|
73
|
+
const boundary = (0, import_vue2.computed)(() => ({
|
74
|
+
top: props.gap,
|
75
|
+
right: import_utils.windowWidth.value - state.value.height - props.gap,
|
76
|
+
bottom: import_utils.windowHeight.value - state.value.width - props.gap,
|
77
|
+
left: props.gap
|
78
|
+
}));
|
79
|
+
const dragging = (0, import_vue2.ref)(false);
|
80
|
+
let initialized = false;
|
81
|
+
const rootStyle = (0, import_vue2.computed)(() => {
|
82
|
+
const style = {};
|
83
|
+
const x = (0, import_utils.addUnit)(state.value.x);
|
84
|
+
const y = (0, import_utils.addUnit)(state.value.y);
|
85
|
+
style.transform = `translate3d(${x}, ${y}, 0)`;
|
86
|
+
if (dragging.value || !initialized) {
|
87
|
+
style.transition = "none";
|
88
|
+
}
|
89
|
+
return style;
|
90
|
+
});
|
91
|
+
const updateState = () => {
|
92
|
+
const {
|
93
|
+
width,
|
94
|
+
height
|
95
|
+
} = (0, import_use.useRect)(rootRef.value);
|
96
|
+
const {
|
97
|
+
offset
|
98
|
+
} = props;
|
99
|
+
state.value = {
|
100
|
+
x: offset.x > -1 ? offset.x : import_utils.windowWidth.value - width - props.gap,
|
101
|
+
y: offset.y > -1 ? offset.y : import_utils.windowHeight.value - height - props.gap,
|
102
|
+
width,
|
103
|
+
height
|
104
|
+
};
|
105
|
+
};
|
106
|
+
const touch = (0, import_use_touch.useTouch)();
|
107
|
+
let prevX = 0;
|
108
|
+
let prevY = 0;
|
109
|
+
const onTouchStart = (e) => {
|
110
|
+
touch.start(e);
|
111
|
+
dragging.value = true;
|
112
|
+
prevX = state.value.x;
|
113
|
+
prevY = state.value.y;
|
114
|
+
};
|
115
|
+
const onTouchMove = (e) => {
|
116
|
+
e.preventDefault();
|
117
|
+
touch.move(e);
|
118
|
+
if (props.axis === "lock")
|
119
|
+
return;
|
120
|
+
if (!touch.isTap.value) {
|
121
|
+
if (props.axis === "x" || props.axis === "xy") {
|
122
|
+
let nextX = prevX + touch.deltaX.value;
|
123
|
+
if (nextX < boundary.value.left)
|
124
|
+
nextX = boundary.value.left;
|
125
|
+
if (nextX > boundary.value.right)
|
126
|
+
nextX = boundary.value.right;
|
127
|
+
state.value.x = nextX;
|
128
|
+
}
|
129
|
+
if (props.axis === "y" || props.axis === "xy") {
|
130
|
+
let nextY = prevY + touch.deltaY.value;
|
131
|
+
if (nextY < boundary.value.top)
|
132
|
+
nextY = boundary.value.top;
|
133
|
+
if (nextY > boundary.value.bottom)
|
134
|
+
nextY = boundary.value.bottom;
|
135
|
+
state.value.y = nextY;
|
136
|
+
}
|
137
|
+
const offset = (0, import_utils.pick)(state.value, ["x", "y"]);
|
138
|
+
emit("update:offset", offset);
|
139
|
+
}
|
140
|
+
};
|
141
|
+
(0, import_use.useEventListener)("touchmove", onTouchMove, {
|
142
|
+
target: rootRef
|
143
|
+
});
|
144
|
+
const onTouchEnd = () => {
|
145
|
+
dragging.value = false;
|
146
|
+
(0, import_vue2.nextTick)(() => {
|
147
|
+
if (props.magnetic === "x") {
|
148
|
+
const nextX = (0, import_utils.closest)([boundary.value.left, boundary.value.right], state.value.x);
|
149
|
+
state.value.x = nextX;
|
150
|
+
}
|
151
|
+
if (props.magnetic === "y") {
|
152
|
+
const nextY = (0, import_utils.closest)([boundary.value.top, boundary.value.bottom], state.value.y);
|
153
|
+
state.value.y = nextY;
|
154
|
+
}
|
155
|
+
if (!touch.isTap.value) {
|
156
|
+
const offset = (0, import_utils.pick)(state.value, ["x", "y"]);
|
157
|
+
emit("update:offset", offset);
|
158
|
+
if (prevX !== offset.x || prevY !== offset.y) {
|
159
|
+
emit("offsetChange", offset);
|
160
|
+
}
|
161
|
+
}
|
162
|
+
});
|
163
|
+
};
|
164
|
+
const onClick = (e) => {
|
165
|
+
if (touch.isTap.value)
|
166
|
+
emit("click", e);
|
167
|
+
};
|
168
|
+
(0, import_vue2.onMounted)(() => {
|
169
|
+
updateState();
|
170
|
+
(0, import_vue2.nextTick)(() => {
|
171
|
+
initialized = true;
|
172
|
+
});
|
173
|
+
});
|
174
|
+
(0, import_vue2.watch)([import_utils.windowWidth, import_utils.windowHeight, () => props.gap, () => props.offset], () => updateState(), {
|
175
|
+
deep: true
|
176
|
+
});
|
177
|
+
const show = (0, import_vue2.ref)(true);
|
178
|
+
(0, import_vue2.onActivated)(() => {
|
179
|
+
show.value = true;
|
180
|
+
});
|
181
|
+
(0, import_vue2.onDeactivated)(() => {
|
182
|
+
if (props.teleport) {
|
183
|
+
show.value = false;
|
184
|
+
}
|
185
|
+
});
|
186
|
+
return () => {
|
187
|
+
const Content = (0, import_vue.withDirectives)((0, import_vue.createVNode)("div", {
|
188
|
+
"class": bem(),
|
189
|
+
"ref": rootRef,
|
190
|
+
"onTouchstartPassive": onTouchStart,
|
191
|
+
"onTouchend": onTouchEnd,
|
192
|
+
"onTouchcancel": onTouchEnd,
|
193
|
+
"onClick": onClick,
|
194
|
+
"style": rootStyle.value
|
195
|
+
}, [slots.default ? slots.default() : (0, import_vue.createVNode)(import_icon.default, {
|
196
|
+
"name": props.icon,
|
197
|
+
"class": bem("icon")
|
198
|
+
}, null)]), [[import_vue.vShow, show.value]]);
|
199
|
+
return props.teleport ? (0, import_vue.createVNode)(import_vue2.Teleport, {
|
200
|
+
"to": props.teleport
|
201
|
+
}, {
|
202
|
+
default: () => [Content]
|
203
|
+
}) : Content;
|
204
|
+
};
|
205
|
+
}
|
206
|
+
});
|
@@ -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,39 @@
|
|
1
|
+
var __create = Object.create;
|
2
|
+
var __defProp = Object.defineProperty;
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
7
|
+
var __export = (target, all) => {
|
8
|
+
for (var name in all)
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
10
|
+
};
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
13
|
+
for (let key of __getOwnPropNames(from))
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
16
|
+
}
|
17
|
+
return to;
|
18
|
+
};
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
20
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
21
|
+
// file that has been converted to a CommonJS file using a Babel-
|
22
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
23
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
24
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
25
|
+
mod
|
26
|
+
));
|
27
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
28
|
+
var stdin_exports = {};
|
29
|
+
__export(stdin_exports, {
|
30
|
+
FloatingBubble: () => FloatingBubble,
|
31
|
+
default: () => stdin_default,
|
32
|
+
floatingBubbleProps: () => import_FloatingBubble2.floatingBubbleProps
|
33
|
+
});
|
34
|
+
module.exports = __toCommonJS(stdin_exports);
|
35
|
+
var import_utils = require("../utils");
|
36
|
+
var import_FloatingBubble = __toESM(require("./FloatingBubble"));
|
37
|
+
var import_FloatingBubble2 = require("./FloatingBubble");
|
38
|
+
const FloatingBubble = (0, import_utils.withInstall)(import_FloatingBubble.default);
|
39
|
+
var stdin_default = FloatingBubble;
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
@@ -0,0 +1,15 @@
|
|
1
|
+
var __defProp = Object.defineProperty;
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
5
|
+
var __copyProps = (to, from, except, desc) => {
|
6
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
7
|
+
for (let key of __getOwnPropNames(from))
|
8
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
9
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
10
|
+
}
|
11
|
+
return to;
|
12
|
+
};
|
13
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
14
|
+
var stdin_exports = {};
|
15
|
+
module.exports = __toCommonJS(stdin_exports);
|
@@ -0,0 +1,77 @@
|
|
1
|
+
import { type ExtractPropTypes } from 'vue';
|
2
|
+
export declare const floatingPanelProps: {
|
3
|
+
height: {
|
4
|
+
type: (NumberConstructor | StringConstructor)[];
|
5
|
+
default: number;
|
6
|
+
};
|
7
|
+
anchors: {
|
8
|
+
type: import("vue").PropType<number[]>;
|
9
|
+
default: () => never[];
|
10
|
+
};
|
11
|
+
duration: {
|
12
|
+
type: (NumberConstructor | StringConstructor)[];
|
13
|
+
default: number;
|
14
|
+
};
|
15
|
+
contentDraggable: {
|
16
|
+
type: BooleanConstructor;
|
17
|
+
default: true;
|
18
|
+
};
|
19
|
+
safeAreaInsetBottom: {
|
20
|
+
type: BooleanConstructor;
|
21
|
+
default: true;
|
22
|
+
};
|
23
|
+
};
|
24
|
+
export type FloatingPanelProps = ExtractPropTypes<typeof floatingPanelProps>;
|
25
|
+
declare const _default: import("vue").DefineComponent<{
|
26
|
+
height: {
|
27
|
+
type: (NumberConstructor | StringConstructor)[];
|
28
|
+
default: number;
|
29
|
+
};
|
30
|
+
anchors: {
|
31
|
+
type: import("vue").PropType<number[]>;
|
32
|
+
default: () => never[];
|
33
|
+
};
|
34
|
+
duration: {
|
35
|
+
type: (NumberConstructor | StringConstructor)[];
|
36
|
+
default: number;
|
37
|
+
};
|
38
|
+
contentDraggable: {
|
39
|
+
type: BooleanConstructor;
|
40
|
+
default: true;
|
41
|
+
};
|
42
|
+
safeAreaInsetBottom: {
|
43
|
+
type: BooleanConstructor;
|
44
|
+
default: true;
|
45
|
+
};
|
46
|
+
}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("heightChange" | "update:height")[], "heightChange" | "update:height", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
|
47
|
+
height: {
|
48
|
+
type: (NumberConstructor | StringConstructor)[];
|
49
|
+
default: number;
|
50
|
+
};
|
51
|
+
anchors: {
|
52
|
+
type: import("vue").PropType<number[]>;
|
53
|
+
default: () => never[];
|
54
|
+
};
|
55
|
+
duration: {
|
56
|
+
type: (NumberConstructor | StringConstructor)[];
|
57
|
+
default: number;
|
58
|
+
};
|
59
|
+
contentDraggable: {
|
60
|
+
type: BooleanConstructor;
|
61
|
+
default: true;
|
62
|
+
};
|
63
|
+
safeAreaInsetBottom: {
|
64
|
+
type: BooleanConstructor;
|
65
|
+
default: true;
|
66
|
+
};
|
67
|
+
}>> & {
|
68
|
+
onHeightChange?: ((...args: any[]) => any) | undefined;
|
69
|
+
"onUpdate:height"?: ((...args: any[]) => any) | undefined;
|
70
|
+
}, {
|
71
|
+
height: string | number;
|
72
|
+
safeAreaInsetBottom: boolean;
|
73
|
+
duration: string | number;
|
74
|
+
anchors: number[];
|
75
|
+
contentDraggable: boolean;
|
76
|
+
}, {}>;
|
77
|
+
export default _default;
|