sard 1.0.13 → 1.0.14
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/all-components.js +0 -2
- package/components/badge/index.css +1 -1
- package/components/index.d.ts +0 -1
- package/components/index.js +2 -3
- package/components/infinite-list/common.d.ts +5 -10
- package/components/infinite-list/common.js +1 -1
- package/components/infinite-list/index.css +0 -1
- package/components/infinite-list/infinite-list.vue.d.ts +5 -6
- package/components/infinite-list/infinite-list.vue.js +41 -82
- package/components/load-more/common.d.ts +9 -3
- package/components/load-more/common.js +9 -2
- package/components/load-more/index.d.ts +3 -2
- package/components/load-more/index.js +2 -2
- package/components/load-more/load-more.vue.d.ts +6 -6
- package/components/load-more/load-more.vue.js +33 -5
- package/components/pull-down-refresh/common.d.ts +1 -0
- package/components/pull-down-refresh/common.js +1 -1
- package/components/pull-down-refresh/pull-down-refresh.vue.d.ts +1 -0
- package/components/pull-down-refresh/pull-down-refresh.vue.js +27 -9
- package/components/select/common.d.ts +4 -4
- package/components/select/common.js +0 -1
- package/components/select/index.css +1 -1
- package/components/select/select.vue.d.ts +3 -5
- package/components/select/select.vue.js +14 -51
- package/components/select-input/common.d.ts +2 -2
- package/components/select-input/select-input.vue.d.ts +5 -3
- package/components/select-input/select-input.vue.js +29 -19
- package/components/select-popout/common.d.ts +3 -5
- package/components/select-popout/select-popout.vue.d.ts +5 -3
- package/components/select-popout/select-popout.vue.js +27 -20
- package/global.d.ts +0 -1
- package/index.css +1 -1
- package/index.js +2 -3
- package/package.json +1 -1
- package/use/useIntersectionObserver.d.ts +1 -0
- package/use/useIntersectionObserver.js +4 -1
- package/components/load-more/useLoadMore.d.ts +0 -22
- package/components/load-more/useLoadMore.js +0 -71
package/all-components.js
CHANGED
|
@@ -47,7 +47,6 @@ import { FormItemPlain, FormPlain } from "./components/form-plain/index.js";
|
|
|
47
47
|
import { Grid, GridItem } from "./components/grid/index.js";
|
|
48
48
|
import { Image } from "./components/image/index.js";
|
|
49
49
|
import { Indexes, IndexesAnchor, IndexesNav } from "./components/indexes/index.js";
|
|
50
|
-
import { InfiniteList } from "./components/infinite-list/index.js";
|
|
51
50
|
import { Input } from "./components/input/index.js";
|
|
52
51
|
import { Keyboard } from "./components/keyboard/index.js";
|
|
53
52
|
import { KeyboardPopout } from "./components/keyboard-popout/index.js";
|
|
@@ -185,7 +184,6 @@ var all_components_default = {
|
|
|
185
184
|
Indexes,
|
|
186
185
|
IndexesAnchor,
|
|
187
186
|
IndexesNav,
|
|
188
|
-
InfiniteList,
|
|
189
187
|
Input,
|
|
190
188
|
Keyboard,
|
|
191
189
|
KeyboardPopout,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--s-badge-height:18px;--s-badge-font-size:var(--s-font-size-sm);--s-badge-bg:var(--s-color-danger);--s-badge-color:var(--s-white);--s-badge-
|
|
1
|
+
:root{--s-badge-height:18px;--s-badge-font-size:var(--s-font-size-sm);--s-badge-bg:var(--s-color-danger);--s-badge-color:var(--s-white);--s-badge-dot-size:10px}.s-badge{flex:none;display:inline-flex;justify-content:center;align-items:center;min-width:var(--s-badge-height);height:var(--s-badge-height);padding-inline-start:var(--s-size-2xs);padding-inline-end:var(--s-size-2xs);font-size:var(--s-badge-font-size);line-height:var(--s-line-height-none);text-align:center;border-radius:var(--s-border-radius-full);color:var(--s-badge-color);background:var(--s-badge-bg)}.s-badge--fixed{position:absolute;top:0;inset-inline-end:0;transform:translate(50%, -50%);z-index:10}:root[dir=rtl] .s-badge--fixed{transform:translate(-50%, -50%)}.s-badge--dot{width:var(--s-badge-dot-size);height:var(--s-badge-dot-size);min-width:var(--s-badge-dot-size);padding:0;border-radius:var(--s-border-radius-full)}.s-badge--zero-hide{display:none}.s-badge__wrapper{position:relative;display:inline-flex}
|
package/components/index.d.ts
CHANGED
package/components/index.js
CHANGED
|
@@ -60,14 +60,13 @@ import { FormItemPlain, FormPlain } from "./form-plain/index.js";
|
|
|
60
60
|
import { Grid, GridItem } from "./grid/index.js";
|
|
61
61
|
import { Image } from "./image/index.js";
|
|
62
62
|
import { Indexes, IndexesAnchor, IndexesNav } from "./indexes/index.js";
|
|
63
|
-
import { useLoadMore } from "./load-more/useLoadMore.js";
|
|
64
|
-
import { InfiniteList } from "./infinite-list/index.js";
|
|
65
63
|
import { Input } from "./input/index.js";
|
|
66
64
|
import { plateEnglishLetterKeys, plateProvinceKeys, plateSuffixKeys } from "./keyboard/common.js";
|
|
67
65
|
import { Keyboard } from "./keyboard/index.js";
|
|
68
66
|
import { KeyboardPopout } from "./keyboard-popout/index.js";
|
|
69
67
|
import { Col, Row } from "./layout/index.js";
|
|
70
68
|
import { List, ListItem } from "./list/index.js";
|
|
69
|
+
import { LoadMoreStatus } from "./load-more/common.js";
|
|
71
70
|
import { LoadMore } from "./load-more/index.js";
|
|
72
71
|
import { Loading } from "./loading/index.js";
|
|
73
72
|
import { Marquee } from "./marquee/index.js";
|
|
@@ -140,4 +139,4 @@ import { Tree, TreeBranch, TreeNode } from "./tree/index.js";
|
|
|
140
139
|
import { Upload, UploadPreview } from "./upload/index.js";
|
|
141
140
|
import { Waterfall, WaterfallItem, WaterfallLoad } from "./waterfall/index.js";
|
|
142
141
|
import { Watermark } from "./watermark/index.js";
|
|
143
|
-
export { ADD_SWIPER_CONTEXT_KEY, Accordion, AccordionItem, ActionSheet, ActionSheetItem, Alert, Avatar, AvatarGroup, BackTop, Badge, Barcode, Button, Calendar, CalendarInput, CalendarPopout, Card, Cascader, CascaderInput, CascaderPopout, Checkbox, CheckboxGroup, CheckboxInput, CheckboxPopout, Col, Collapse, ColorPicker, ColorPickerInput, ColorPickerPopout, Compact, CoolIcon, CountDown, CountTo, CropImage, DateStrip, DatetimePicker, DatetimePickerInput, DatetimePickerPopout, DatetimeRangePicker, DatetimeRangePickerInput, DatetimeRangePickerPopout, Descriptions, DescriptionsItem, Dialog, Divider, Dnd, DndHandle, DndItem, Dropdown, DropdownItem, Ellipsis, Empty, Fab, FabItem, FloatingBubble, FloatingPanel, Form, FormItem, FormItemPlain, FormPlain, Grid, GridItem, Image, Indexes, IndexesAnchor, IndexesNav,
|
|
142
|
+
export { ADD_SWIPER_CONTEXT_KEY, Accordion, AccordionItem, ActionSheet, ActionSheetItem, Alert, Avatar, AvatarGroup, BackTop, Badge, Barcode, Button, Calendar, CalendarInput, CalendarPopout, Card, Cascader, CascaderInput, CascaderPopout, Checkbox, CheckboxGroup, CheckboxInput, CheckboxPopout, Col, Collapse, ColorPicker, ColorPickerInput, ColorPickerPopout, Compact, CoolIcon, CountDown, CountTo, CropImage, DateStrip, DatetimePicker, DatetimePickerInput, DatetimePickerPopout, DatetimeRangePicker, DatetimeRangePickerInput, DatetimeRangePickerPopout, Descriptions, DescriptionsItem, Dialog, Divider, Dnd, DndHandle, DndItem, Dropdown, DropdownItem, Ellipsis, Empty, Fab, FabItem, FloatingBubble, FloatingPanel, Form, FormItem, FormItemPlain, FormPlain, Grid, GridItem, Image, Indexes, IndexesAnchor, IndexesNav, Input, Keyboard, KeyboardPopout, List, ListItem, LoadMore, LoadMoreStatus, Loading, Marquee, Menu, MenuItem, Motion, Navbar, NavbarItem, NavbarPit, NoticeBar, Notify, Overlay, Pagination, PasswordInput, Picker, PickerInput, PickerPopout, PickerView, PickerViewColumn, Popout, PopoutInput, Popover, Popup, PreviewImage, ProgressBar, ProgressCircle, PullDownRefresh, PuzzleVerify, Qrcode, REMOVE_SWIPER_CONTEXT_KEY, Radio, RadioGroup, RadioInput, RadioPopout, Rate, ReadMore, Result, RotateVerify, Row, SWIPER_AUTO_HEIGHT_KEY, ScrollList, ScrollSpy, ScrollSpyAnchor, Search, Segmented, SegmentedItem, Select, SelectInput, SelectOption, SelectOptionGroup, SelectPopout, ShareSheet, ShareSheetIcon, ShareSheetItem, ShareSheetRow, Sidebar, SidebarItem, Signature, Skeleton, SkeletonAvatar, SkeletonBlock, SkeletonParagraph, SkeletonTitle, SlideVerify, Slider, Space, StatusBar, Step, Stepper, Steps, Sticky, StickyBox, SwipeAction, Swiper, SwiperItem, Switch, Tab, Tabbar, TabbarItem, TabbarPit, Table, Tabs, Tag, Text, Timeline, TimelineItem, Toast, Tree, TreeBranch, TreeNode, Upload, UploadPreview, Waterfall, WaterfallItem, WaterfallLoad, Watermark, actionSheet, createActionSheet, createCropImage, createDialog, createNotify, createPreviewImage, createToast, cropImage, dialog, formatTime, getCurrentTime, notify, omitFormPopoutProps, partitionPopoutInputProps, plateEnglishLetterKeys, plateProvinceKeys, plateSuffixKeys, popupManager, previewImage, safeAreaInsets, spaceSizes, toast, useCountDown, useElementBackTop, useFormContext, useFormItem, useFormItemContext, useFormPopout, useInPopup, useMotioning, usePageBackTop, usePopoutInput, usePopupEnter, usePopupVisibleHookProvide, windowInfo };
|
|
@@ -1,24 +1,19 @@
|
|
|
1
1
|
import { type DefaultProps } from '../config';
|
|
2
|
-
import type { LoadMoreStatus } from '../load-more
|
|
2
|
+
import type { LoadMoreStatus } from '../load-more';
|
|
3
3
|
import type { PullDownRefreshSlots } from '../pull-down-refresh/common';
|
|
4
4
|
export interface InfiniteListProps {
|
|
5
|
-
|
|
5
|
+
status?: LoadMoreStatus;
|
|
6
|
+
request: (page: number) => Promise<boolean>;
|
|
6
7
|
hideLoadMore?: boolean;
|
|
7
8
|
refreshable?: boolean;
|
|
8
|
-
doneDuration?: number;
|
|
9
9
|
rootMargin?: string;
|
|
10
10
|
}
|
|
11
11
|
export declare const defaultInfiniteListProps: DefaultProps<InfiniteListProps>;
|
|
12
12
|
export interface InfiniteListSlots extends Omit<PullDownRefreshSlots, 'default'> {
|
|
13
|
-
default?(props:
|
|
14
|
-
status: LoadMoreStatus;
|
|
15
|
-
refresh: () => void;
|
|
16
|
-
}): any;
|
|
13
|
+
default?(props: Record<string, never>): any;
|
|
17
14
|
}
|
|
18
15
|
export interface InfiniteListEmits {
|
|
19
|
-
(e: '
|
|
20
|
-
(e: 'refresh-error'): void;
|
|
16
|
+
(e: 'load'): void;
|
|
21
17
|
}
|
|
22
18
|
export interface InfiniteListExpose {
|
|
23
|
-
refresh: () => void;
|
|
24
19
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
.s-infinite-list .s-pull-down-refresh{min-height:100%}.s-infinite-list__load-more:is(.is-hidden){height:0;overflow:hidden;visibility:hidden;pointer-events:none}
|
|
@@ -1,15 +1,14 @@
|
|
|
1
1
|
import { type InfiniteListProps, type InfiniteListSlots, type InfiniteListExpose } from './common';
|
|
2
|
+
import { LoadMoreStatus } from '../load-more';
|
|
2
3
|
type __VLS_Slots = InfiniteListSlots;
|
|
3
4
|
declare const __VLS_base: import("vue").DefineComponent<InfiniteListProps, InfiniteListExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
4
|
-
|
|
5
|
-
"refresh-error": () => any;
|
|
5
|
+
load: () => any;
|
|
6
6
|
}, string, import("vue").PublicProps, Readonly<InfiniteListProps> & Readonly<{
|
|
7
|
-
|
|
8
|
-
"onRefresh-error"?: (() => any) | undefined;
|
|
7
|
+
onLoad?: (() => any) | undefined;
|
|
9
8
|
}>, {
|
|
10
9
|
rootMargin: string;
|
|
11
|
-
|
|
12
|
-
request: (page: number
|
|
10
|
+
status: LoadMoreStatus;
|
|
11
|
+
request: (page: number) => Promise<boolean>;
|
|
13
12
|
hideLoadMore: boolean;
|
|
14
13
|
refreshable: boolean;
|
|
15
14
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
@@ -1,16 +1,17 @@
|
|
|
1
1
|
import { createBem } from "../../utils/bem.js";
|
|
2
|
-
import
|
|
3
|
-
import { useTranslateWithPrefix } from "../../locale/index.js";
|
|
4
|
-
import { defaultInfiniteListProps } from "./common.js";
|
|
5
|
-
import { useScrollParent } from "../../use/useScrollParent.js";
|
|
6
|
-
import pull_down_refresh_default from "../pull-down-refresh/pull-down-refresh.vue.js";
|
|
2
|
+
import { LoadMoreStatus } from "../load-more/common.js";
|
|
7
3
|
import load_more_default from "../load-more/load-more.vue.js";
|
|
8
|
-
import
|
|
9
|
-
import {
|
|
4
|
+
import pull_down_refresh_default from "../pull-down-refresh/pull-down-refresh.vue.js";
|
|
5
|
+
import { defaultInfiniteListProps } from "./common.js";
|
|
6
|
+
import { createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, mergeDefaults, normalizeClass, openBlock, ref, renderSlot, unref, withCtx } from "vue";
|
|
10
7
|
//#region packages/sard/components/infinite-list/infinite-list.vue
|
|
11
8
|
var infinite_list_default = /*@__PURE__*/ defineComponent({
|
|
12
9
|
__name: "infinite-list",
|
|
13
10
|
props: /*@__PURE__*/ mergeDefaults({
|
|
11
|
+
status: {
|
|
12
|
+
type: String,
|
|
13
|
+
required: false
|
|
14
|
+
},
|
|
14
15
|
request: {
|
|
15
16
|
type: Function,
|
|
16
17
|
required: true
|
|
@@ -23,96 +24,54 @@ var infinite_list_default = /*@__PURE__*/ defineComponent({
|
|
|
23
24
|
type: Boolean,
|
|
24
25
|
required: false
|
|
25
26
|
},
|
|
26
|
-
doneDuration: {
|
|
27
|
-
type: Number,
|
|
28
|
-
required: false
|
|
29
|
-
},
|
|
30
27
|
rootMargin: {
|
|
31
28
|
type: String,
|
|
32
29
|
required: false
|
|
33
30
|
}
|
|
34
31
|
}, defaultInfiniteListProps),
|
|
35
|
-
emits: ["
|
|
32
|
+
emits: ["load"],
|
|
36
33
|
setup(__props, { expose: __expose, emit: __emit }) {
|
|
37
34
|
const props = __props;
|
|
38
|
-
const emit = __emit;
|
|
39
35
|
const bem = createBem("infinite-list");
|
|
40
|
-
const
|
|
41
|
-
|
|
42
|
-
const
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
36
|
+
const status = ref(LoadMoreStatus.INCOMPLETE);
|
|
37
|
+
let page = 1;
|
|
38
|
+
const getData = async () => {
|
|
39
|
+
status.value = LoadMoreStatus.LOADING;
|
|
40
|
+
return props.request(page).then((finish) => {
|
|
41
|
+
if (finish) status.value = LoadMoreStatus.COMPLETE;
|
|
42
|
+
else {
|
|
43
|
+
status.value = LoadMoreStatus.INCOMPLETE;
|
|
44
|
+
page++;
|
|
45
|
+
}
|
|
46
46
|
}).catch(() => {
|
|
47
|
-
|
|
48
|
-
|
|
47
|
+
status.value = LoadMoreStatus.ERROR;
|
|
48
|
+
});
|
|
49
|
+
};
|
|
50
|
+
const refreshing = ref(false);
|
|
51
|
+
const onRefresh = () => {
|
|
52
|
+
page = 1;
|
|
53
|
+
refreshing.value = true;
|
|
54
|
+
getData().finally(() => {
|
|
55
|
+
refreshing.value = false;
|
|
49
56
|
});
|
|
50
57
|
};
|
|
51
|
-
|
|
52
|
-
root: useScrollParent(useTemplateRef("scroll")),
|
|
53
|
-
target: useTemplateRef("load-more"),
|
|
54
|
-
rootMargin: () => props.rootMargin,
|
|
55
|
-
request: async (page, isRefresh) => {
|
|
56
|
-
return props.request(page, isRefresh);
|
|
57
|
-
}
|
|
58
|
-
});
|
|
59
|
-
__expose({ refresh });
|
|
58
|
+
__expose({});
|
|
60
59
|
return (_ctx, _cache) => {
|
|
61
|
-
return openBlock(), createElementBlock("div", {
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
loading: unref(isRefreshing),
|
|
66
|
-
disabled: !__props.refreshable || unref(isLoading),
|
|
67
|
-
"done-duration": __props.doneDuration,
|
|
60
|
+
return openBlock(), createElementBlock("div", { class: normalizeClass(unref(bem).b()) }, [__props.refreshable ? (openBlock(), createBlock(pull_down_refresh_default, {
|
|
61
|
+
key: 0,
|
|
62
|
+
loading: refreshing.value,
|
|
63
|
+
disabled: status.value === unref(LoadMoreStatus).LOADING,
|
|
68
64
|
onRefresh
|
|
69
65
|
}, {
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
progress: slotsProps.progress
|
|
75
|
-
}, {
|
|
76
|
-
default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("unready")), 1)]),
|
|
77
|
-
_: 1
|
|
78
|
-
}, 8, ["progress"])])]),
|
|
79
|
-
ready: withCtx(() => [renderSlot(_ctx.$slots, "ready", {}, () => [createVNode(loading_default, {
|
|
80
|
-
type: "clock",
|
|
81
|
-
size: "16px",
|
|
82
|
-
animated: false
|
|
83
|
-
}, {
|
|
84
|
-
default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("ready")), 1)]),
|
|
85
|
-
_: 1
|
|
86
|
-
})])]),
|
|
87
|
-
loading: withCtx(() => [renderSlot(_ctx.$slots, "loading", {}, () => [createVNode(loading_default, {
|
|
88
|
-
type: "clock",
|
|
89
|
-
size: "16px"
|
|
90
|
-
}, {
|
|
91
|
-
default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("loading")), 1)]),
|
|
92
|
-
_: 1
|
|
93
|
-
})])]),
|
|
94
|
-
done: withCtx(() => [renderSlot(_ctx.$slots, "done", {}, () => [createTextVNode(toDisplayString(doneText.value), 1)])]),
|
|
95
|
-
default: withCtx(() => [renderSlot(_ctx.$slots, "default", {
|
|
96
|
-
status: unref(status),
|
|
97
|
-
refresh: unref(refresh)
|
|
98
|
-
}), createElementVNode("div", {
|
|
99
|
-
ref: "load-more",
|
|
100
|
-
class: normalizeClass([unref(bem).e("load-more"), unref(bem).is("hidden", __props.hideLoadMore)])
|
|
101
|
-
}, [createVNode(load_more_default, {
|
|
102
|
-
status: unref(status),
|
|
103
|
-
onLoadMore: unref(onLoadMore),
|
|
104
|
-
onReload: unref(onReload)
|
|
105
|
-
}, null, 8, [
|
|
106
|
-
"status",
|
|
107
|
-
"onLoadMore",
|
|
108
|
-
"onReload"
|
|
109
|
-
])], 2)]),
|
|
66
|
+
default: withCtx(() => [renderSlot(_ctx.$slots, "default"), createVNode(load_more_default, {
|
|
67
|
+
status: status.value,
|
|
68
|
+
onLoad: getData
|
|
69
|
+
}, null, 8, ["status"])]),
|
|
110
70
|
_: 3
|
|
111
|
-
}, 8, [
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
])], 2);
|
|
71
|
+
}, 8, ["loading", "disabled"])) : createCommentVNode("v-if", true), createElementVNode("template", null, [renderSlot(_ctx.$slots, "default"), createVNode(load_more_default, {
|
|
72
|
+
status: status.value,
|
|
73
|
+
onLoad: getData
|
|
74
|
+
}, null, 8, ["status"])])], 2);
|
|
116
75
|
};
|
|
117
76
|
}
|
|
118
77
|
});
|
|
@@ -1,11 +1,18 @@
|
|
|
1
1
|
import { type DefaultProps } from '../config';
|
|
2
|
-
export
|
|
2
|
+
export declare enum LoadMoreStatus {
|
|
3
|
+
INCOMPLETE = "incomplete",
|
|
4
|
+
LOADING = "loading",
|
|
5
|
+
COMPLETE = "complete",
|
|
6
|
+
ERROR = "error"
|
|
7
|
+
}
|
|
3
8
|
export interface LoadMoreProps {
|
|
4
9
|
status?: LoadMoreStatus;
|
|
5
10
|
incompleteText?: string;
|
|
6
11
|
loadingText?: string;
|
|
7
12
|
completeText?: string;
|
|
8
13
|
errorText?: string;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
rootMargin?: string;
|
|
9
16
|
}
|
|
10
17
|
export declare const defaultLoadMoreProps: DefaultProps<LoadMoreProps>;
|
|
11
18
|
export interface LoadMoreSlots {
|
|
@@ -15,6 +22,5 @@ export interface LoadMoreSlots {
|
|
|
15
22
|
error?(props: Record<string, never>): any;
|
|
16
23
|
}
|
|
17
24
|
export interface LoadMoreEmits {
|
|
18
|
-
(e: 'load
|
|
19
|
-
(e: 'reload'): void;
|
|
25
|
+
(e: 'load'): void;
|
|
20
26
|
}
|
|
@@ -1,4 +1,11 @@
|
|
|
1
1
|
//#region packages/sard/components/load-more/common.ts
|
|
2
|
-
|
|
2
|
+
let LoadMoreStatus = /* @__PURE__ */ function(LoadMoreStatus) {
|
|
3
|
+
LoadMoreStatus["INCOMPLETE"] = "incomplete";
|
|
4
|
+
LoadMoreStatus["LOADING"] = "loading";
|
|
5
|
+
LoadMoreStatus["COMPLETE"] = "complete";
|
|
6
|
+
LoadMoreStatus["ERROR"] = "error";
|
|
7
|
+
return LoadMoreStatus;
|
|
8
|
+
}({});
|
|
9
|
+
const defaultLoadMoreProps = { status: LoadMoreStatus.INCOMPLETE };
|
|
3
10
|
//#endregion
|
|
4
|
-
export { defaultLoadMoreProps };
|
|
11
|
+
export { LoadMoreStatus, defaultLoadMoreProps };
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { type EnhancedComponent } from '../../utils';
|
|
2
|
+
import { LoadMoreStatus } from './common';
|
|
2
3
|
import _LoadMore from './load-more.vue';
|
|
3
4
|
export declare const LoadMore: EnhancedComponent<typeof _LoadMore>;
|
|
4
5
|
export default LoadMore;
|
|
5
|
-
export type {
|
|
6
|
-
export
|
|
6
|
+
export type { LoadMoreProps, LoadMoreSlots, LoadMoreEmits } from './common';
|
|
7
|
+
export { LoadMoreStatus };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { enhanceComponent } from "../../utils/component.js";
|
|
2
|
+
import { LoadMoreStatus } from "./common.js";
|
|
2
3
|
import load_more_default from "./load-more.vue.js";
|
|
3
|
-
import { useLoadMore } from "./useLoadMore.js";
|
|
4
4
|
//#region packages/sard/components/load-more/index.ts
|
|
5
5
|
const LoadMore = enhanceComponent(load_more_default);
|
|
6
6
|
//#endregion
|
|
7
|
-
export { LoadMore, LoadMore as default,
|
|
7
|
+
export { LoadMore, LoadMore as default, LoadMoreStatus };
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import { type LoadMoreProps, type LoadMoreSlots } from './common';
|
|
1
|
+
import { type LoadMoreProps, type LoadMoreSlots, LoadMoreStatus } from './common';
|
|
2
2
|
type __VLS_Slots = LoadMoreSlots;
|
|
3
3
|
declare const __VLS_base: import("vue").DefineComponent<LoadMoreProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
4
|
-
|
|
5
|
-
reload: () => any;
|
|
4
|
+
load: () => any;
|
|
6
5
|
}, string, import("vue").PublicProps, Readonly<LoadMoreProps> & Readonly<{
|
|
7
|
-
|
|
8
|
-
onReload?: (() => any) | undefined;
|
|
6
|
+
onLoad?: (() => any) | undefined;
|
|
9
7
|
}>, {
|
|
10
|
-
|
|
8
|
+
rootMargin: string;
|
|
9
|
+
disabled: boolean;
|
|
10
|
+
status: LoadMoreStatus;
|
|
11
11
|
incompleteText: string;
|
|
12
12
|
loadingText: string;
|
|
13
13
|
completeText: string;
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import { createBem } from "../../utils/bem.js";
|
|
2
|
+
import { useIntersectionObserver } from "../../use/useIntersectionObserver.js";
|
|
2
3
|
import loading_default from "../loading/loading.vue.js";
|
|
3
4
|
import { useTranslateWithPrefix } from "../../locale/index.js";
|
|
4
|
-
import { defaultLoadMoreProps } from "./common.js";
|
|
5
|
-
import {
|
|
5
|
+
import { LoadMoreStatus, defaultLoadMoreProps } from "./common.js";
|
|
6
|
+
import { useScrollParent } from "../../use/useScrollParent.js";
|
|
7
|
+
import { computed, createCommentVNode, createElementBlock, createTextVNode, createVNode, defineComponent, mergeDefaults, normalizeClass, openBlock, renderSlot, toDisplayString, unref, useTemplateRef, watch, withCtx } from "vue";
|
|
6
8
|
//#region packages/sard/components/load-more/load-more.vue
|
|
7
9
|
var load_more_default = /*@__PURE__*/ defineComponent({
|
|
8
10
|
__name: "load-more",
|
|
@@ -26,23 +28,49 @@ var load_more_default = /*@__PURE__*/ defineComponent({
|
|
|
26
28
|
errorText: {
|
|
27
29
|
type: String,
|
|
28
30
|
required: false
|
|
31
|
+
},
|
|
32
|
+
disabled: {
|
|
33
|
+
type: Boolean,
|
|
34
|
+
required: false
|
|
35
|
+
},
|
|
36
|
+
rootMargin: {
|
|
37
|
+
type: String,
|
|
38
|
+
required: false
|
|
29
39
|
}
|
|
30
40
|
}, defaultLoadMoreProps),
|
|
31
|
-
emits: ["load
|
|
41
|
+
emits: ["load"],
|
|
32
42
|
setup(__props, { emit: __emit }) {
|
|
33
43
|
const props = __props;
|
|
34
44
|
const emit = __emit;
|
|
35
45
|
const bem = createBem("load-more");
|
|
36
46
|
const { t } = useTranslateWithPrefix("loadMore");
|
|
47
|
+
const loadMoreRef = useTemplateRef("loadMore");
|
|
48
|
+
const scrollParent = useScrollParent(loadMoreRef);
|
|
37
49
|
const onClick = () => {
|
|
38
|
-
if (props.status === "incomplete") emit("load
|
|
39
|
-
else if (props.status === "error") emit("
|
|
50
|
+
if (props.status === "incomplete") emit("load");
|
|
51
|
+
else if (props.status === "error") emit("load");
|
|
40
52
|
};
|
|
53
|
+
const { isIntersecting } = useIntersectionObserver({
|
|
54
|
+
root: scrollParent,
|
|
55
|
+
rootMargin: () => props.rootMargin,
|
|
56
|
+
threshold: 0,
|
|
57
|
+
target: loadMoreRef,
|
|
58
|
+
disabled: () => props.disabled
|
|
59
|
+
});
|
|
60
|
+
watch(isIntersecting, () => {
|
|
61
|
+
if (!props.disabled && isIntersecting.value && props.status === LoadMoreStatus.INCOMPLETE) emit("load");
|
|
62
|
+
});
|
|
63
|
+
watch(() => props.status, (status, prevStatus) => {
|
|
64
|
+
if (prevStatus === LoadMoreStatus.LOADING && status === LoadMoreStatus.INCOMPLETE) setTimeout(() => {
|
|
65
|
+
if (!props.disabled && isIntersecting.value && status === LoadMoreStatus.INCOMPLETE) emit("load");
|
|
66
|
+
}, 30);
|
|
67
|
+
});
|
|
41
68
|
const loadMoreClass = computed(() => {
|
|
42
69
|
return [bem.b(), bem.m(props.status)];
|
|
43
70
|
});
|
|
44
71
|
return (_ctx, _cache) => {
|
|
45
72
|
return openBlock(), createElementBlock("div", {
|
|
73
|
+
ref: "loadMore",
|
|
46
74
|
class: normalizeClass(loadMoreClass.value),
|
|
47
75
|
onClick
|
|
48
76
|
}, [__props.status === "incomplete" ? renderSlot(_ctx.$slots, "incomplete", { key: 0 }, () => [createTextVNode(toDisplayString(__props.incompleteText || unref(t)("incompleteText")), 1)]) : __props.status === "loading" ? renderSlot(_ctx.$slots, "loading", { key: 1 }, () => [createVNode(loading_default, null, {
|
|
@@ -7,6 +7,7 @@ export interface PullDownRefreshProps {
|
|
|
7
7
|
transitionDuration?: number;
|
|
8
8
|
doneDuration?: number;
|
|
9
9
|
disabled?: boolean;
|
|
10
|
+
error?: boolean;
|
|
10
11
|
}
|
|
11
12
|
export declare const defaultPullDownRefreshProps: DefaultProps<PullDownRefreshProps>;
|
|
12
13
|
export interface PullDownRefreshSlots {
|
|
@@ -5,6 +5,7 @@ declare const __VLS_base: import("vue").DefineComponent<PullDownRefreshProps, Pu
|
|
|
5
5
|
}, string, import("vue").PublicProps, Readonly<PullDownRefreshProps> & Readonly<{
|
|
6
6
|
onRefresh?: (() => any) | undefined;
|
|
7
7
|
}>, {
|
|
8
|
+
error: boolean;
|
|
8
9
|
loading: boolean;
|
|
9
10
|
threshold: number;
|
|
10
11
|
disabled: boolean;
|
|
@@ -3,9 +3,10 @@ import { getScrollTop } from "../../utils/dom.js";
|
|
|
3
3
|
import { useTimeout } from "../../use/useTimeout.js";
|
|
4
4
|
import { usePointerDown } from "../../use/usePointerDown.js";
|
|
5
5
|
import loading_default from "../loading/loading.vue.js";
|
|
6
|
-
import {
|
|
6
|
+
import { useTranslateWithPrefix } from "../../locale/index.js";
|
|
7
7
|
import { useScrollParent } from "../../use/useScrollParent.js";
|
|
8
|
-
import {
|
|
8
|
+
import { defaultPullDownRefreshProps } from "./common.js";
|
|
9
|
+
import { computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeDefaults, normalizeClass, normalizeStyle, onMounted, openBlock, ref, renderSlot, toDisplayString, unref, useTemplateRef, watch, withCtx } from "vue";
|
|
9
10
|
//#region packages/sard/components/pull-down-refresh/pull-down-refresh.vue
|
|
10
11
|
var pull_down_refresh_default = /*@__PURE__*/ defineComponent({
|
|
11
12
|
__name: "pull-down-refresh",
|
|
@@ -33,6 +34,10 @@ var pull_down_refresh_default = /*@__PURE__*/ defineComponent({
|
|
|
33
34
|
disabled: {
|
|
34
35
|
type: Boolean,
|
|
35
36
|
required: false
|
|
37
|
+
},
|
|
38
|
+
error: {
|
|
39
|
+
type: Boolean,
|
|
40
|
+
required: false
|
|
36
41
|
}
|
|
37
42
|
}, defaultPullDownRefreshProps),
|
|
38
43
|
emits: ["refresh"],
|
|
@@ -40,6 +45,7 @@ var pull_down_refresh_default = /*@__PURE__*/ defineComponent({
|
|
|
40
45
|
const props = __props;
|
|
41
46
|
const emit = __emit;
|
|
42
47
|
const bem = createBem("pull-down-refresh");
|
|
48
|
+
const { t } = useTranslateWithPrefix("pullDownRefresh");
|
|
43
49
|
const scrollParent = useScrollParent(useTemplateRef("root"));
|
|
44
50
|
const status = ref("initial");
|
|
45
51
|
const translateY = ref(0);
|
|
@@ -117,6 +123,9 @@ var pull_down_refresh_default = /*@__PURE__*/ defineComponent({
|
|
|
117
123
|
}
|
|
118
124
|
};
|
|
119
125
|
const onPointerDown = usePointerDown(onTouchStart, onTouchMove, onTouchEnd);
|
|
126
|
+
const rootClass = computed(() => {
|
|
127
|
+
return [bem.b(), bem.m(status.value)];
|
|
128
|
+
});
|
|
120
129
|
const pullDownRefreshStyle = computed(() => {
|
|
121
130
|
return {
|
|
122
131
|
transform: `translate3d(0,${translateY.value}px,0)`,
|
|
@@ -130,7 +139,7 @@ var pull_down_refresh_default = /*@__PURE__*/ defineComponent({
|
|
|
130
139
|
return (_ctx, _cache) => {
|
|
131
140
|
return openBlock(), createElementBlock("div", {
|
|
132
141
|
ref: "root",
|
|
133
|
-
class: normalizeClass(
|
|
142
|
+
class: normalizeClass(rootClass.value)
|
|
134
143
|
}, [createElementVNode("div", {
|
|
135
144
|
class: normalizeClass(unref(bem).e("gesture")),
|
|
136
145
|
style: normalizeStyle(pullDownRefreshStyle.value),
|
|
@@ -147,17 +156,26 @@ var pull_down_refresh_default = /*@__PURE__*/ defineComponent({
|
|
|
147
156
|
progress: progress.value
|
|
148
157
|
}, () => [createVNode(loading_default, {
|
|
149
158
|
type: "clock",
|
|
150
|
-
|
|
159
|
+
size: "16px",
|
|
151
160
|
animated: false,
|
|
152
161
|
progress: progress.value
|
|
153
|
-
},
|
|
162
|
+
}, {
|
|
163
|
+
default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("unready")), 1)]),
|
|
164
|
+
_: 1
|
|
165
|
+
}, 8, ["progress"])]) : status.value === "ready" ? renderSlot(_ctx.$slots, "ready", { key: 1 }, () => [createVNode(loading_default, {
|
|
154
166
|
type: "clock",
|
|
155
|
-
|
|
167
|
+
size: "16px",
|
|
156
168
|
animated: false
|
|
157
|
-
},
|
|
169
|
+
}, {
|
|
170
|
+
default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("ready")), 1)]),
|
|
171
|
+
_: 1
|
|
172
|
+
})]) : status.value === "loading" ? renderSlot(_ctx.$slots, "loading", { key: 2 }, () => [createVNode(loading_default, {
|
|
158
173
|
type: "clock",
|
|
159
|
-
|
|
160
|
-
},
|
|
174
|
+
size: "16px"
|
|
175
|
+
}, {
|
|
176
|
+
default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("loading")), 1)]),
|
|
177
|
+
_: 1
|
|
178
|
+
})]) : status.value === "done" ? renderSlot(_ctx.$slots, "done", { key: 3 }, () => [createTextVNode(toDisplayString(__props.error ? unref(t)("doneFail") : unref(t)("doneSuccess")), 1)]) : createCommentVNode("v-if", true)], 6), renderSlot(_ctx.$slots, "default")], 38)], 2);
|
|
161
179
|
};
|
|
162
180
|
}
|
|
163
181
|
});
|
|
@@ -9,17 +9,16 @@ export interface SelectProps {
|
|
|
9
9
|
filterPlaceholder?: string;
|
|
10
10
|
filterMethod?: (query: string) => void;
|
|
11
11
|
filterValue?: string;
|
|
12
|
-
remote?: boolean;
|
|
13
|
-
remoteMethod?: (query: string, page: number, isRefresh: boolean) => Promise<boolean>;
|
|
14
|
-
threshold?: number;
|
|
15
12
|
showToolbar?: boolean;
|
|
16
13
|
options?: any[];
|
|
17
14
|
optionKeys?: OptionKeys;
|
|
18
15
|
valueKey?: string;
|
|
16
|
+
filterLoading?: boolean;
|
|
19
17
|
}
|
|
20
18
|
export declare const defaultSelectProps: DefaultProps<SelectProps>;
|
|
21
19
|
export interface SelectSlots {
|
|
22
20
|
default?(): any;
|
|
21
|
+
bottom?(): any;
|
|
23
22
|
option?(props: {
|
|
24
23
|
disabled: boolean;
|
|
25
24
|
selected: boolean;
|
|
@@ -37,9 +36,10 @@ export interface SelectEmits {
|
|
|
37
36
|
(e: 'update:modelValue', value: any): void;
|
|
38
37
|
(e: 'change', value: any): void;
|
|
39
38
|
(e: 'select', value: any): void;
|
|
40
|
-
(e: 'update:
|
|
39
|
+
(e: 'update:filterValue', value: string): void;
|
|
41
40
|
}
|
|
42
41
|
export interface SelectExpose {
|
|
42
|
+
scrollTop: () => void;
|
|
43
43
|
}
|
|
44
44
|
export interface SelectMember {
|
|
45
45
|
el: HTMLElement | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--s-select-max-height:320px;--s-select-bg:var(--s-bg-color-container);--s-select-search-padding-x:var(--s-content-padding-x);--s-select-search-padding-y:var(--s-content-padding-y);--s-select-option-min-height:var(--s-content-height-sm);--s-select-option-padding-x:var(--s-content-padding-x);--s-select-option-padding-y:var(--s-content-padding-y);--s-select-option-bg-active:var(--s-bg-color-active);--s-select-option-opacity-disabled:var(--s-opacity-disabled);--s-select-option-color-selected:var(--s-color-primary);--s-select-option-label-font-size:var(--s-font-size);--s-select-option-group-label-padding-x:var(--s-content-padding-x);--s-select-option-group-label-padding-y:var(--s-content-padding-y);--s-select-option-group-label-font-size:var(--s-font-size-sm);--s-select-option-group-label-color:var(--s-text-color-tertiary);--s-select-option-group-label-bg:var(--s-fill-color-fourth);--s-select-toolbar-padding-x:var(--s-content-padding-x);--s-select-toolbar-padding-y:0
|
|
1
|
+
:root{--s-select-max-height:320px;--s-select-bg:var(--s-bg-color-container);--s-select-search-padding-x:var(--s-content-padding-x);--s-select-search-padding-y:var(--s-content-padding-y);--s-select-option-min-height:var(--s-content-height-sm);--s-select-option-padding-x:var(--s-content-padding-x);--s-select-option-padding-y:var(--s-content-padding-y);--s-select-option-bg-active:var(--s-bg-color-active);--s-select-option-opacity-disabled:var(--s-opacity-disabled);--s-select-option-color-selected:var(--s-color-primary);--s-select-option-label-font-size:var(--s-font-size);--s-select-option-group-label-padding-x:var(--s-content-padding-x);--s-select-option-group-label-padding-y:var(--s-content-padding-y);--s-select-option-group-label-font-size:var(--s-font-size-sm);--s-select-option-group-label-color:var(--s-text-color-tertiary);--s-select-option-group-label-bg:var(--s-fill-color-fourth);--s-select-toolbar-padding-x:var(--s-content-padding-x);--s-select-toolbar-padding-y:0}.s-select{background:var(--s-select-bg)}.s-select__container{position:relative}.s-select__container::before,.s-select__container::after{content:"";position:absolute;left:0;right:0;z-index:10;height:10px;overflow:hidden;box-shadow:none;touch-action:none;pointer-events:none;transition:box-shadow var(--s-duration)}.s-select__container::before{top:0}.s-select__container::after{bottom:0}.s-select__container--none::before,.s-select__container--end::before{box-shadow:var(--s-box-shadow-top)}.s-select__container--none::after,.s-select__container--start::after{box-shadow:var(--s-box-shadow-bottom)}.s-select__search{padding:var(--s-select-search-padding-y) var(--s-select-search-padding-x)}.s-select__loading{color:var(--s-text-color-fourth)}.s-select__scroll{overflow-x:hidden;overflow-y:auto;max-height:var(--s-select-max-height)}.s-select__scroll--filterable{height:var(--s-select-max-height)}.s-select__toolbar{display:flex;align-items:center;padding:var(--s-select-toolbar-padding-y) var(--s-select-toolbar-padding-x)}.s-select__num{font-size:var(--s-font-size);color:var(--s-color-primary);margin-inline-end:auto}.s-select__empty{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.s-select-option{position:relative;display:flex;align-items:center;cursor:pointer}.s-select-option:not(.is-plain){min-height:var(--s-select-option-min-height);padding:var(--s-select-option-padding-y) var(--s-select-option-padding-x)}.s-select-option:not(.is-plain)::before{position:absolute;z-index:1;pointer-events:none;touch-action:none;opacity:1;content:"";left:0;right:0;transform:scaleY(0.5);top:0;border-top:var(--s-border-width) var(--s-border-style) var(--s-border-color);transform-origin:top center;left:var(--s-select-option-padding-x);right:var(--s-select-option-padding-x)}.s-select-option:not(.is-plain):first-child::before{display:none}.s-select-option:is(.is-selected){color:var(--s-select-option-color-selected);font-weight:var(--s-font-weight-bold)}.s-select-option:is(.is-selected) .s-select-option__icon{display:flex}.s-select-option:is(.is-disabled){color:var(--s-text-color-disabled);cursor:var(--s-cursor-disabled)}.s-select-option:not(.is-disabled,.is-plain):active{background:var(--s-select-option-bg-active)}.s-select-option__label{flex:1;min-width:0;word-break:break-all;font-size:var(--s-select-option-label-font-size);line-height:var(--s-line-height-normal)}.s-select-option__icon{display:none;justify-content:center;align-items:center;margin-inline-start:8px}.s-select-option-group__label{position:sticky;top:0;z-index:2;padding:var(--s-select-option-group-label-padding-y) var(--s-select-option-group-label-padding-x);font-size:var(--s-select-option-group-label-font-size);line-height:var(--s-line-height-snug);color:var(--s-select-option-group-label-color);background:var(--s-select-option-group-label-bg)}.s-select-option-group__content{position:relative}
|
|
@@ -4,16 +4,15 @@ declare const __VLS_base: import("vue").DefineComponent<SelectProps, SelectExpos
|
|
|
4
4
|
select: (value: any) => any;
|
|
5
5
|
change: (value: any) => any;
|
|
6
6
|
"update:modelValue": (value: any) => any;
|
|
7
|
-
"update:
|
|
7
|
+
"update:filterValue": (value: string) => any;
|
|
8
8
|
}, string, import("vue").PublicProps, Readonly<SelectProps> & Readonly<{
|
|
9
9
|
onSelect?: ((value: any) => any) | undefined;
|
|
10
10
|
onChange?: ((value: any) => any) | undefined;
|
|
11
11
|
"onUpdate:modelValue"?: ((value: any) => any) | undefined;
|
|
12
|
-
"onUpdate:
|
|
12
|
+
"onUpdate:filterValue"?: ((value: string) => any) | undefined;
|
|
13
13
|
}>, {
|
|
14
14
|
multiple: boolean;
|
|
15
15
|
options: any[];
|
|
16
|
-
threshold: number;
|
|
17
16
|
modelValue: any;
|
|
18
17
|
optionKeys: import("../../use").OptionKeys;
|
|
19
18
|
filterPlaceholder: string;
|
|
@@ -21,10 +20,9 @@ declare const __VLS_base: import("vue").DefineComponent<SelectProps, SelectExpos
|
|
|
21
20
|
filterable: boolean;
|
|
22
21
|
filterMethod: (query: string) => void;
|
|
23
22
|
filterValue: string;
|
|
24
|
-
remote: boolean;
|
|
25
|
-
remoteMethod: (query: string, page: number, isRefresh: boolean) => Promise<boolean>;
|
|
26
23
|
showToolbar: boolean;
|
|
27
24
|
valueKey: string;
|
|
25
|
+
filterLoading: boolean;
|
|
28
26
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
29
27
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
30
28
|
declare const _default: typeof __VLS_export;
|