vant 4.7.3 → 4.8.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/calendar/Calendar.mjs +20 -17
- package/es/checkbox/Checker.mjs +7 -1
- package/es/col/Col.mjs +11 -3
- package/es/config-provider/types.d.ts +1 -1
- package/es/highlight/Highlight.d.ts +96 -0
- package/es/highlight/Highlight.mjs +122 -0
- package/es/highlight/index.css +1 -0
- package/es/highlight/index.d.ts +73 -0
- package/es/highlight/index.mjs +10 -0
- package/es/highlight/style/index.d.ts +1 -0
- package/es/highlight/style/index.mjs +2 -0
- package/es/highlight/types.d.ts +3 -0
- package/es/highlight/types.mjs +0 -0
- package/es/image-preview/ImagePreview.mjs +10 -0
- package/es/image-preview/ImagePreviewItem.d.ts +27 -1
- package/es/image-preview/ImagePreviewItem.mjs +17 -12
- package/es/image-preview/types.d.ts +7 -0
- package/es/index.d.ts +2 -1
- package/es/index.mjs +4 -1
- package/es/row/Row.d.ts +8 -4
- package/es/row/Row.mjs +35 -4
- package/es/row/index.d.ts +3 -3
- package/lib/calendar/Calendar.js +20 -17
- package/lib/checkbox/Checker.js +7 -1
- package/lib/col/Col.js +10 -2
- package/lib/config-provider/types.d.ts +1 -1
- package/lib/highlight/Highlight.d.ts +96 -0
- package/lib/highlight/Highlight.js +141 -0
- package/lib/highlight/index.css +1 -0
- package/lib/highlight/index.d.ts +73 -0
- package/lib/highlight/index.js +39 -0
- package/lib/highlight/style/index.d.ts +1 -0
- package/lib/highlight/style/index.js +2 -0
- package/lib/highlight/types.d.ts +3 -0
- package/lib/highlight/types.js +15 -0
- package/lib/image-preview/ImagePreview.js +10 -0
- package/lib/image-preview/ImagePreviewItem.d.ts +27 -1
- package/lib/image-preview/ImagePreviewItem.js +17 -12
- package/lib/image-preview/types.d.ts +7 -0
- package/lib/index.css +1 -1
- package/lib/index.d.ts +2 -1
- package/lib/index.js +4 -1
- package/lib/row/Row.d.ts +8 -4
- package/lib/row/Row.js +34 -3
- package/lib/row/index.d.ts +3 -3
- package/lib/vant.cjs.js +775 -594
- package/lib/vant.es.js +775 -594
- package/lib/vant.js +775 -594
- package/lib/vant.min.js +1 -1
- package/lib/web-types.json +1 -1
- package/package.json +2 -2
package/es/calendar/Calendar.mjs
CHANGED
@@ -107,7 +107,7 @@ var stdin_default = defineComponent({
|
|
107
107
|
let bodyHeight;
|
108
108
|
const bodyRef = ref();
|
109
109
|
const subtitle = ref({
|
110
|
-
|
110
|
+
textFn: () => "",
|
111
111
|
date: void 0
|
112
112
|
});
|
113
113
|
const currentDate = ref(getInitialDate());
|
@@ -171,7 +171,7 @@ var stdin_default = defineComponent({
|
|
171
171
|
});
|
172
172
|
if (currentMonth) {
|
173
173
|
subtitle.value = {
|
174
|
-
|
174
|
+
textFn: currentMonth.getTitle,
|
175
175
|
date: currentMonth.date
|
176
176
|
};
|
177
177
|
}
|
@@ -361,21 +361,24 @@ var stdin_default = defineComponent({
|
|
361
361
|
"van-safe-area-bottom": props.safeAreaInsetBottom
|
362
362
|
}]
|
363
363
|
}, [renderFooterButton()]);
|
364
|
-
const renderCalendar = () =>
|
365
|
-
|
366
|
-
|
367
|
-
|
368
|
-
|
369
|
-
|
370
|
-
|
371
|
-
|
372
|
-
|
373
|
-
|
374
|
-
|
375
|
-
|
376
|
-
"
|
377
|
-
|
378
|
-
|
364
|
+
const renderCalendar = () => {
|
365
|
+
const subTitle = subtitle.value.textFn();
|
366
|
+
return _createVNode("div", {
|
367
|
+
"class": bem()
|
368
|
+
}, [_createVNode(CalendarHeader, {
|
369
|
+
"date": subtitle.value.date,
|
370
|
+
"title": props.title,
|
371
|
+
"subtitle": subTitle,
|
372
|
+
"showTitle": props.showTitle,
|
373
|
+
"showSubtitle": props.showSubtitle,
|
374
|
+
"firstDayOfWeek": dayOffset.value,
|
375
|
+
"onClickSubtitle": (event) => emit("clickSubtitle", event)
|
376
|
+
}, pick(slots, ["title", "subtitle"])), _createVNode("div", {
|
377
|
+
"ref": bodyRef,
|
378
|
+
"class": bem("body"),
|
379
|
+
"onScroll": onScroll
|
380
|
+
}, [months.value.map(renderMonth)]), renderFooter()]);
|
381
|
+
};
|
379
382
|
watch(() => props.show, init);
|
380
383
|
watch(() => [props.type, props.minDate, props.maxDate], () => reset(getInitialDate(currentDate.value)));
|
381
384
|
watch(() => props.defaultDate, (value = null) => {
|
package/es/checkbox/Checker.mjs
CHANGED
@@ -108,12 +108,18 @@ var stdin_default = defineComponent({
|
|
108
108
|
}, null)]);
|
109
109
|
};
|
110
110
|
const renderLabel = () => {
|
111
|
+
const {
|
112
|
+
checked
|
113
|
+
} = props;
|
111
114
|
if (slots.default) {
|
112
115
|
return _createVNode("span", {
|
113
116
|
"class": props.bem("label", [props.labelPosition, {
|
114
117
|
disabled: disabled.value
|
115
118
|
}])
|
116
|
-
}, [slots.default(
|
119
|
+
}, [slots.default({
|
120
|
+
checked,
|
121
|
+
disabled: disabled.value
|
122
|
+
})]);
|
117
123
|
}
|
118
124
|
};
|
119
125
|
return () => {
|
package/es/col/Col.mjs
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
import { createVNode as _createVNode } from "vue";
|
2
2
|
import { computed, defineComponent } from "vue";
|
3
|
-
import { numericProp, createNamespace, makeNumericProp, makeStringProp } from "../utils/index.mjs";
|
3
|
+
import { numericProp, createNamespace, makeNumericProp, makeStringProp, extend } from "../utils/index.mjs";
|
4
4
|
import { useParent } from "@vant/use";
|
5
5
|
import { ROW_KEY } from "../row/Row.mjs";
|
6
6
|
const [name, bem] = createNamespace("col");
|
@@ -24,18 +24,26 @@ var stdin_default = defineComponent({
|
|
24
24
|
return;
|
25
25
|
}
|
26
26
|
const {
|
27
|
-
spaces
|
27
|
+
spaces,
|
28
|
+
verticalSpaces
|
28
29
|
} = parent;
|
30
|
+
let styles = {};
|
29
31
|
if (spaces && spaces.value && spaces.value[index.value]) {
|
30
32
|
const {
|
31
33
|
left,
|
32
34
|
right
|
33
35
|
} = spaces.value[index.value];
|
34
|
-
|
36
|
+
styles = {
|
35
37
|
paddingLeft: left ? `${left}px` : null,
|
36
38
|
paddingRight: right ? `${right}px` : null
|
37
39
|
};
|
38
40
|
}
|
41
|
+
const {
|
42
|
+
bottom
|
43
|
+
} = verticalSpaces.value[index.value] || {};
|
44
|
+
return extend(styles, {
|
45
|
+
marginBottom: bottom ? `${bottom}px` : null
|
46
|
+
});
|
39
47
|
});
|
40
48
|
return () => {
|
41
49
|
const {
|
@@ -57,5 +57,5 @@ type BaseThemeVars = {
|
|
57
57
|
radiusLg?: string;
|
58
58
|
radiusMax?: string;
|
59
59
|
};
|
60
|
-
export type ConfigProviderThemeVars = BaseThemeVars & 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('../back-top').BackTopThemeVars & 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;
|
60
|
+
export type ConfigProviderThemeVars = BaseThemeVars & 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('../back-top').BackTopThemeVars & 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('../highlight').HighlightThemeVars & 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;
|
61
61
|
export {};
|
@@ -0,0 +1,96 @@
|
|
1
|
+
import { type ExtractPropTypes, type PropType } from 'vue';
|
2
|
+
export declare const highlightProps: {
|
3
|
+
autoEscape: {
|
4
|
+
type: BooleanConstructor;
|
5
|
+
default: true;
|
6
|
+
};
|
7
|
+
caseSensitive: BooleanConstructor;
|
8
|
+
highlightClass: StringConstructor;
|
9
|
+
highlightTag: {
|
10
|
+
type: PropType<keyof HTMLElementTagNameMap>;
|
11
|
+
default: keyof HTMLElementTagNameMap;
|
12
|
+
};
|
13
|
+
keywords: {
|
14
|
+
type: PropType<string | string[]>;
|
15
|
+
required: true;
|
16
|
+
};
|
17
|
+
sourceString: {
|
18
|
+
type: PropType<string>;
|
19
|
+
default: string;
|
20
|
+
};
|
21
|
+
tag: {
|
22
|
+
type: PropType<keyof HTMLElementTagNameMap>;
|
23
|
+
default: keyof HTMLElementTagNameMap;
|
24
|
+
};
|
25
|
+
unhighlightClass: StringConstructor;
|
26
|
+
unhighlightTag: {
|
27
|
+
type: PropType<keyof HTMLElementTagNameMap>;
|
28
|
+
default: keyof HTMLElementTagNameMap;
|
29
|
+
};
|
30
|
+
};
|
31
|
+
export type HighlightProps = ExtractPropTypes<typeof highlightProps>;
|
32
|
+
declare const _default: import("vue").DefineComponent<{
|
33
|
+
autoEscape: {
|
34
|
+
type: BooleanConstructor;
|
35
|
+
default: true;
|
36
|
+
};
|
37
|
+
caseSensitive: BooleanConstructor;
|
38
|
+
highlightClass: StringConstructor;
|
39
|
+
highlightTag: {
|
40
|
+
type: PropType<keyof HTMLElementTagNameMap>;
|
41
|
+
default: keyof HTMLElementTagNameMap;
|
42
|
+
};
|
43
|
+
keywords: {
|
44
|
+
type: PropType<string | string[]>;
|
45
|
+
required: true;
|
46
|
+
};
|
47
|
+
sourceString: {
|
48
|
+
type: PropType<string>;
|
49
|
+
default: string;
|
50
|
+
};
|
51
|
+
tag: {
|
52
|
+
type: PropType<keyof HTMLElementTagNameMap>;
|
53
|
+
default: keyof HTMLElementTagNameMap;
|
54
|
+
};
|
55
|
+
unhighlightClass: StringConstructor;
|
56
|
+
unhighlightTag: {
|
57
|
+
type: PropType<keyof HTMLElementTagNameMap>;
|
58
|
+
default: keyof HTMLElementTagNameMap;
|
59
|
+
};
|
60
|
+
}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
|
61
|
+
autoEscape: {
|
62
|
+
type: BooleanConstructor;
|
63
|
+
default: true;
|
64
|
+
};
|
65
|
+
caseSensitive: BooleanConstructor;
|
66
|
+
highlightClass: StringConstructor;
|
67
|
+
highlightTag: {
|
68
|
+
type: PropType<keyof HTMLElementTagNameMap>;
|
69
|
+
default: keyof HTMLElementTagNameMap;
|
70
|
+
};
|
71
|
+
keywords: {
|
72
|
+
type: PropType<string | string[]>;
|
73
|
+
required: true;
|
74
|
+
};
|
75
|
+
sourceString: {
|
76
|
+
type: PropType<string>;
|
77
|
+
default: string;
|
78
|
+
};
|
79
|
+
tag: {
|
80
|
+
type: PropType<keyof HTMLElementTagNameMap>;
|
81
|
+
default: keyof HTMLElementTagNameMap;
|
82
|
+
};
|
83
|
+
unhighlightClass: StringConstructor;
|
84
|
+
unhighlightTag: {
|
85
|
+
type: PropType<keyof HTMLElementTagNameMap>;
|
86
|
+
default: keyof HTMLElementTagNameMap;
|
87
|
+
};
|
88
|
+
}>>, {
|
89
|
+
tag: keyof HTMLElementTagNameMap;
|
90
|
+
autoEscape: boolean;
|
91
|
+
caseSensitive: boolean;
|
92
|
+
highlightTag: keyof HTMLElementTagNameMap;
|
93
|
+
sourceString: string;
|
94
|
+
unhighlightTag: keyof HTMLElementTagNameMap;
|
95
|
+
}, {}>;
|
96
|
+
export default _default;
|
@@ -0,0 +1,122 @@
|
|
1
|
+
import { createVNode as _createVNode } from "vue";
|
2
|
+
import { defineComponent, computed } from "vue";
|
3
|
+
import { createNamespace, makeRequiredProp, makeStringProp, truthProp } from "../utils/index.mjs";
|
4
|
+
const [name, bem] = createNamespace("highlight");
|
5
|
+
const highlightProps = {
|
6
|
+
autoEscape: truthProp,
|
7
|
+
caseSensitive: Boolean,
|
8
|
+
highlightClass: String,
|
9
|
+
highlightTag: makeStringProp("span"),
|
10
|
+
keywords: makeRequiredProp([String, Array]),
|
11
|
+
sourceString: makeStringProp(""),
|
12
|
+
tag: makeStringProp("div"),
|
13
|
+
unhighlightClass: String,
|
14
|
+
unhighlightTag: makeStringProp("span")
|
15
|
+
};
|
16
|
+
var stdin_default = defineComponent({
|
17
|
+
name,
|
18
|
+
props: highlightProps,
|
19
|
+
setup(props) {
|
20
|
+
const highlightChunks = computed(() => {
|
21
|
+
const {
|
22
|
+
autoEscape,
|
23
|
+
caseSensitive,
|
24
|
+
keywords,
|
25
|
+
sourceString
|
26
|
+
} = props;
|
27
|
+
const flags = caseSensitive ? "g" : "gi";
|
28
|
+
const _keywords = Array.isArray(keywords) ? keywords : [keywords];
|
29
|
+
let chunks = _keywords.filter((keyword) => keyword).reduce((chunks2, keyword) => {
|
30
|
+
if (autoEscape) {
|
31
|
+
keyword = keyword.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
|
32
|
+
}
|
33
|
+
const regex = new RegExp(keyword, flags);
|
34
|
+
let match;
|
35
|
+
while (match = regex.exec(sourceString)) {
|
36
|
+
const start = match.index;
|
37
|
+
const end = regex.lastIndex;
|
38
|
+
if (start >= end) {
|
39
|
+
regex.lastIndex++;
|
40
|
+
continue;
|
41
|
+
}
|
42
|
+
chunks2.push({
|
43
|
+
start,
|
44
|
+
end,
|
45
|
+
highlight: true
|
46
|
+
});
|
47
|
+
}
|
48
|
+
return chunks2;
|
49
|
+
}, []);
|
50
|
+
chunks = chunks.sort((a, b) => a.start - b.start).reduce((chunks2, currentChunk) => {
|
51
|
+
const prevChunk = chunks2[chunks2.length - 1];
|
52
|
+
if (!prevChunk || currentChunk.start > prevChunk.end) {
|
53
|
+
const unhighlightStart = prevChunk ? prevChunk.end : 0;
|
54
|
+
const unhighlightEnd = currentChunk.start;
|
55
|
+
if (unhighlightStart !== unhighlightEnd) {
|
56
|
+
chunks2.push({
|
57
|
+
start: unhighlightStart,
|
58
|
+
end: unhighlightEnd,
|
59
|
+
highlight: false
|
60
|
+
});
|
61
|
+
}
|
62
|
+
chunks2.push(currentChunk);
|
63
|
+
} else {
|
64
|
+
prevChunk.end = Math.max(prevChunk.end, currentChunk.end);
|
65
|
+
}
|
66
|
+
return chunks2;
|
67
|
+
}, []);
|
68
|
+
const lastChunk = chunks[chunks.length - 1];
|
69
|
+
if (lastChunk && lastChunk.end < sourceString.length) {
|
70
|
+
chunks.push({
|
71
|
+
start: lastChunk.end,
|
72
|
+
end: sourceString.length,
|
73
|
+
highlight: false
|
74
|
+
});
|
75
|
+
}
|
76
|
+
return chunks;
|
77
|
+
});
|
78
|
+
const renderContent = () => {
|
79
|
+
const {
|
80
|
+
sourceString,
|
81
|
+
highlightClass,
|
82
|
+
unhighlightClass,
|
83
|
+
highlightTag,
|
84
|
+
unhighlightTag
|
85
|
+
} = props;
|
86
|
+
return highlightChunks.value.map((chunk) => {
|
87
|
+
const {
|
88
|
+
start,
|
89
|
+
end,
|
90
|
+
highlight
|
91
|
+
} = chunk;
|
92
|
+
const text = sourceString.slice(start, end);
|
93
|
+
if (highlight) {
|
94
|
+
return _createVNode(highlightTag, {
|
95
|
+
"class": [bem("tag"), highlightClass]
|
96
|
+
}, {
|
97
|
+
default: () => [text]
|
98
|
+
});
|
99
|
+
}
|
100
|
+
return _createVNode(unhighlightTag, {
|
101
|
+
"class": unhighlightClass
|
102
|
+
}, {
|
103
|
+
default: () => [text]
|
104
|
+
});
|
105
|
+
});
|
106
|
+
};
|
107
|
+
return () => {
|
108
|
+
const {
|
109
|
+
tag
|
110
|
+
} = props;
|
111
|
+
return _createVNode(tag, {
|
112
|
+
"class": bem()
|
113
|
+
}, {
|
114
|
+
default: () => [renderContent()]
|
115
|
+
});
|
116
|
+
};
|
117
|
+
}
|
118
|
+
});
|
119
|
+
export {
|
120
|
+
stdin_default as default,
|
121
|
+
highlightProps
|
122
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
:root{--van-highlight-tag-color: var(--van-primary-color)}.van-highlight__tag{color:var(--van-highlight-tag-color)}
|
@@ -0,0 +1,73 @@
|
|
1
|
+
export declare const Highlight: import("../utils").WithInstall<import("vue").DefineComponent<{
|
2
|
+
autoEscape: {
|
3
|
+
type: BooleanConstructor;
|
4
|
+
default: true;
|
5
|
+
};
|
6
|
+
caseSensitive: BooleanConstructor;
|
7
|
+
highlightClass: StringConstructor;
|
8
|
+
highlightTag: {
|
9
|
+
type: import("vue").PropType<keyof HTMLElementTagNameMap>;
|
10
|
+
default: keyof HTMLElementTagNameMap;
|
11
|
+
};
|
12
|
+
keywords: {
|
13
|
+
type: import("vue").PropType<string | string[]>;
|
14
|
+
required: true;
|
15
|
+
};
|
16
|
+
sourceString: {
|
17
|
+
type: import("vue").PropType<string>;
|
18
|
+
default: string;
|
19
|
+
};
|
20
|
+
tag: {
|
21
|
+
type: import("vue").PropType<keyof HTMLElementTagNameMap>;
|
22
|
+
default: keyof HTMLElementTagNameMap;
|
23
|
+
};
|
24
|
+
unhighlightClass: StringConstructor;
|
25
|
+
unhighlightTag: {
|
26
|
+
type: import("vue").PropType<keyof HTMLElementTagNameMap>;
|
27
|
+
default: keyof HTMLElementTagNameMap;
|
28
|
+
};
|
29
|
+
}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
|
30
|
+
autoEscape: {
|
31
|
+
type: BooleanConstructor;
|
32
|
+
default: true;
|
33
|
+
};
|
34
|
+
caseSensitive: BooleanConstructor;
|
35
|
+
highlightClass: StringConstructor;
|
36
|
+
highlightTag: {
|
37
|
+
type: import("vue").PropType<keyof HTMLElementTagNameMap>;
|
38
|
+
default: keyof HTMLElementTagNameMap;
|
39
|
+
};
|
40
|
+
keywords: {
|
41
|
+
type: import("vue").PropType<string | string[]>;
|
42
|
+
required: true;
|
43
|
+
};
|
44
|
+
sourceString: {
|
45
|
+
type: import("vue").PropType<string>;
|
46
|
+
default: string;
|
47
|
+
};
|
48
|
+
tag: {
|
49
|
+
type: import("vue").PropType<keyof HTMLElementTagNameMap>;
|
50
|
+
default: keyof HTMLElementTagNameMap;
|
51
|
+
};
|
52
|
+
unhighlightClass: StringConstructor;
|
53
|
+
unhighlightTag: {
|
54
|
+
type: import("vue").PropType<keyof HTMLElementTagNameMap>;
|
55
|
+
default: keyof HTMLElementTagNameMap;
|
56
|
+
};
|
57
|
+
}>>, {
|
58
|
+
tag: keyof HTMLElementTagNameMap;
|
59
|
+
autoEscape: boolean;
|
60
|
+
caseSensitive: boolean;
|
61
|
+
highlightTag: keyof HTMLElementTagNameMap;
|
62
|
+
sourceString: string;
|
63
|
+
unhighlightTag: keyof HTMLElementTagNameMap;
|
64
|
+
}, {}>>;
|
65
|
+
export default Highlight;
|
66
|
+
export { highlightProps } from './Highlight';
|
67
|
+
export type { HighlightProps } from './Highlight';
|
68
|
+
export type { HighlightThemeVars } from './types';
|
69
|
+
declare module 'vue' {
|
70
|
+
interface GlobalComponents {
|
71
|
+
vanHighlight: typeof Highlight;
|
72
|
+
}
|
73
|
+
}
|
@@ -0,0 +1,10 @@
|
|
1
|
+
import { withInstall } from "../utils/index.mjs";
|
2
|
+
import _Highlight from "./Highlight.mjs";
|
3
|
+
const Highlight = withInstall(_Highlight);
|
4
|
+
var stdin_default = Highlight;
|
5
|
+
import { highlightProps } from "./Highlight.mjs";
|
6
|
+
export {
|
7
|
+
Highlight,
|
8
|
+
stdin_default as default,
|
9
|
+
highlightProps
|
10
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
File without changes
|
@@ -42,6 +42,7 @@ var stdin_default = defineComponent({
|
|
42
42
|
slots
|
43
43
|
}) {
|
44
44
|
const swipeRef = ref();
|
45
|
+
const activedPreviewItemRef = ref();
|
45
46
|
const state = reactive({
|
46
47
|
active: 0,
|
47
48
|
rootWidth: 0,
|
@@ -106,6 +107,11 @@ var stdin_default = defineComponent({
|
|
106
107
|
"onDragStart": onDragStart
|
107
108
|
}, {
|
108
109
|
default: () => [props.images.map((image, index) => _createVNode(ImagePreviewItem, {
|
110
|
+
"ref": (item) => {
|
111
|
+
if (index === state.active) {
|
112
|
+
activedPreviewItemRef.value = item;
|
113
|
+
}
|
114
|
+
},
|
109
115
|
"src": image,
|
110
116
|
"show": props.show,
|
111
117
|
"active": state.active,
|
@@ -141,6 +147,10 @@ var stdin_default = defineComponent({
|
|
141
147
|
return (_a = swipeRef.value) == null ? void 0 : _a.swipeTo(index, options);
|
142
148
|
};
|
143
149
|
useExpose({
|
150
|
+
resetScale: () => {
|
151
|
+
var _a;
|
152
|
+
(_a = activedPreviewItemRef.value) == null ? void 0 : _a.resetScale();
|
153
|
+
},
|
144
154
|
swipeTo
|
145
155
|
});
|
146
156
|
onMounted(resize);
|
@@ -1,3 +1,29 @@
|
|
1
|
+
import { type ExtractPropTypes } from 'vue';
|
2
|
+
declare const imagePreviewItemProps: {
|
3
|
+
src: StringConstructor;
|
4
|
+
show: BooleanConstructor;
|
5
|
+
active: NumberConstructor;
|
6
|
+
minZoom: {
|
7
|
+
type: (NumberConstructor | StringConstructor)[];
|
8
|
+
required: true;
|
9
|
+
};
|
10
|
+
maxZoom: {
|
11
|
+
type: (NumberConstructor | StringConstructor)[];
|
12
|
+
required: true;
|
13
|
+
};
|
14
|
+
rootWidth: {
|
15
|
+
type: NumberConstructor;
|
16
|
+
required: true;
|
17
|
+
};
|
18
|
+
rootHeight: {
|
19
|
+
type: NumberConstructor;
|
20
|
+
required: true;
|
21
|
+
};
|
22
|
+
disableZoom: BooleanConstructor;
|
23
|
+
doubleScale: BooleanConstructor;
|
24
|
+
closeOnClickOverlay: BooleanConstructor;
|
25
|
+
};
|
26
|
+
export type ImagePreviewItemProps = ExtractPropTypes<typeof imagePreviewItemProps>;
|
1
27
|
declare const _default: import("vue").DefineComponent<{
|
2
28
|
src: StringConstructor;
|
3
29
|
show: BooleanConstructor;
|
@@ -21,7 +47,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
21
47
|
disableZoom: BooleanConstructor;
|
22
48
|
doubleScale: BooleanConstructor;
|
23
49
|
closeOnClickOverlay: BooleanConstructor;
|
24
|
-
}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("close" | "scale" | "longPress")[], "close" | "scale" | "longPress", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<
|
50
|
+
}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("close" | "scale" | "longPress")[], "close" | "scale" | "longPress", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
|
25
51
|
src: StringConstructor;
|
26
52
|
show: BooleanConstructor;
|
27
53
|
active: NumberConstructor;
|
@@ -1,6 +1,7 @@
|
|
1
1
|
import { createVNode as _createVNode } from "vue";
|
2
2
|
import { ref, watch, computed, reactive, defineComponent } from "vue";
|
3
3
|
import { clamp, numericProp, preventDefault, createNamespace, makeRequiredProp, LONG_PRESS_START_TIME, TAP_OFFSET } from "../utils/index.mjs";
|
4
|
+
import { useExpose } from "../composables/use-expose.mjs";
|
4
5
|
import { useTouch } from "../composables/use-touch.mjs";
|
5
6
|
import { raf, useEventListener, useRect } from "@vant/use";
|
6
7
|
import { Image } from "../image/index.mjs";
|
@@ -13,19 +14,20 @@ const getCenter = (touches) => ({
|
|
13
14
|
});
|
14
15
|
const bem = createNamespace("image-preview")[1];
|
15
16
|
const longImageRatio = 2.6;
|
17
|
+
const imagePreviewItemProps = {
|
18
|
+
src: String,
|
19
|
+
show: Boolean,
|
20
|
+
active: Number,
|
21
|
+
minZoom: makeRequiredProp(numericProp),
|
22
|
+
maxZoom: makeRequiredProp(numericProp),
|
23
|
+
rootWidth: makeRequiredProp(Number),
|
24
|
+
rootHeight: makeRequiredProp(Number),
|
25
|
+
disableZoom: Boolean,
|
26
|
+
doubleScale: Boolean,
|
27
|
+
closeOnClickOverlay: Boolean
|
28
|
+
};
|
16
29
|
var stdin_default = defineComponent({
|
17
|
-
props:
|
18
|
-
src: String,
|
19
|
-
show: Boolean,
|
20
|
-
active: Number,
|
21
|
-
minZoom: makeRequiredProp(numericProp),
|
22
|
-
maxZoom: makeRequiredProp(numericProp),
|
23
|
-
rootWidth: makeRequiredProp(Number),
|
24
|
-
rootHeight: makeRequiredProp(Number),
|
25
|
-
disableZoom: Boolean,
|
26
|
-
doubleScale: Boolean,
|
27
|
-
closeOnClickOverlay: Boolean
|
28
|
-
},
|
30
|
+
props: imagePreviewItemProps,
|
29
31
|
emits: ["scale", "close", "longPress"],
|
30
32
|
setup(props, {
|
31
33
|
emit,
|
@@ -291,6 +293,9 @@ var stdin_default = defineComponent({
|
|
291
293
|
return (_a = swipeItem.value) == null ? void 0 : _a.$el;
|
292
294
|
})
|
293
295
|
});
|
296
|
+
useExpose({
|
297
|
+
resetScale
|
298
|
+
});
|
294
299
|
return () => {
|
295
300
|
const imageSlots = {
|
296
301
|
loading: () => _createVNode(Loading, {
|
@@ -3,6 +3,7 @@ import type { Interceptor } from '../utils';
|
|
3
3
|
import type { SwipeToOptions } from '../swipe';
|
4
4
|
import type { PopupCloseIconPosition } from '../popup';
|
5
5
|
import type { ImagePreviewProps } from './ImagePreview';
|
6
|
+
import type { ImagePreviewItemProps } from './ImagePreviewItem';
|
6
7
|
export type ImagePreviewOptions = {
|
7
8
|
loop?: boolean;
|
8
9
|
images: string[];
|
@@ -35,7 +36,12 @@ export type ImagePreviewScaleEventParams = {
|
|
35
36
|
scale: number;
|
36
37
|
index: number;
|
37
38
|
};
|
39
|
+
type ImagePreviewItemExpose = {
|
40
|
+
resetScale: () => void;
|
41
|
+
};
|
42
|
+
export type ImagePreviewItemInstance = ComponentPublicInstance<ImagePreviewItemProps, ImagePreviewItemExpose>;
|
38
43
|
export type ImagePreviewExpose = {
|
44
|
+
resetScale: () => void;
|
39
45
|
swipeTo: (index: number, options?: SwipeToOptions) => void;
|
40
46
|
};
|
41
47
|
export type ImagePreviewInstance = ComponentPublicInstance<ImagePreviewProps, ImagePreviewExpose>;
|
@@ -50,3 +56,4 @@ export type ImagePreviewThemeVars = {
|
|
50
56
|
imagePreviewCloseIconMargin?: string;
|
51
57
|
imagePreviewCloseIconZIndex?: number | string;
|
52
58
|
};
|
59
|
+
export {};
|
package/es/index.d.ts
CHANGED
@@ -40,6 +40,7 @@ export * from "./floating-panel";
|
|
40
40
|
export * from "./form";
|
41
41
|
export * from "./grid";
|
42
42
|
export * from "./grid-item";
|
43
|
+
export * from "./highlight";
|
43
44
|
export * from "./icon";
|
44
45
|
export * from "./image";
|
45
46
|
export * from "./image-preview";
|
@@ -105,4 +106,4 @@ declare namespace _default {
|
|
105
106
|
}
|
106
107
|
export default _default;
|
107
108
|
export function install(app: any): void;
|
108
|
-
export const version: "4.
|
109
|
+
export const version: "4.8.0";
|
package/es/index.mjs
CHANGED
@@ -40,6 +40,7 @@ import { FloatingPanel } from "./floating-panel/index.mjs";
|
|
40
40
|
import { Form } from "./form/index.mjs";
|
41
41
|
import { Grid } from "./grid/index.mjs";
|
42
42
|
import { GridItem } from "./grid-item/index.mjs";
|
43
|
+
import { Highlight } from "./highlight/index.mjs";
|
43
44
|
import { Icon } from "./icon/index.mjs";
|
44
45
|
import { Image } from "./image/index.mjs";
|
45
46
|
import { ImagePreview } from "./image-preview/index.mjs";
|
@@ -98,7 +99,7 @@ import { Toast } from "./toast/index.mjs";
|
|
98
99
|
import { TreeSelect } from "./tree-select/index.mjs";
|
99
100
|
import { Uploader } from "./uploader/index.mjs";
|
100
101
|
import { Watermark } from "./watermark/index.mjs";
|
101
|
-
const version = "4.
|
102
|
+
const version = "4.8.0";
|
102
103
|
function install(app) {
|
103
104
|
const components = [
|
104
105
|
ActionBar,
|
@@ -143,6 +144,7 @@ function install(app) {
|
|
143
144
|
Form,
|
144
145
|
Grid,
|
145
146
|
GridItem,
|
147
|
+
Highlight,
|
146
148
|
Icon,
|
147
149
|
Image,
|
148
150
|
ImagePreview,
|
@@ -252,6 +254,7 @@ export * from "./floating-panel/index.mjs";
|
|
252
254
|
export * from "./form/index.mjs";
|
253
255
|
export * from "./grid/index.mjs";
|
254
256
|
export * from "./grid-item/index.mjs";
|
257
|
+
export * from "./highlight/index.mjs";
|
255
258
|
export * from "./icon/index.mjs";
|
256
259
|
export * from "./image/index.mjs";
|
257
260
|
export * from "./image-preview/index.mjs";
|