sard 1.0.13 → 1.0.14

package/index.js

@@ -122,14 +122,13 @@ import { FormItemPlain, FormPlain } from "./components/form-plain/index.js";
 import { Grid, GridItem } from "./components/grid/index.js";
 import { Image } from "./components/image/index.js";
 import { Indexes, IndexesAnchor, IndexesNav } from "./components/indexes/index.js";
-import { useLoadMore } from "./components/load-more/useLoadMore.js";
-import { InfiniteList } from "./components/infinite-list/index.js";
 import { Input } from "./components/input/index.js";
 import { plateEnglishLetterKeys, plateProvinceKeys, plateSuffixKeys } from "./components/keyboard/common.js";
 import { Keyboard } from "./components/keyboard/index.js";
 import { KeyboardPopout } from "./components/keyboard-popout/index.js";
 import { Col, Row } from "./components/layout/index.js";
 import { List, ListItem } from "./components/list/index.js";
+import { LoadMoreStatus } from "./components/load-more/common.js";
 import { LoadMore } from "./components/load-more/index.js";
 import { Loading } from "./components/loading/index.js";
 import { Marquee } from "./components/marquee/index.js";
@@ -217,4 +216,4 @@ function prepareEnvironment() {
 	});
 }
 //#endregion
-export { ADD_SWIPER_CONTEXT_KEY, ALPHANUMERIC_CHARS, Accordion, AccordionItem, ActionSheet, ActionSheetItem, Alert, Avatar, AvatarGroup, BackTop, Badge, Barcode, BarcodeFormatList, BarcodeTextPositionList, 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, ECLList, Ellipsis, Empty, Fab, FabItem, FloatingBubble, FloatingPanel, Form, FormItem, FormItemPlain, FormPlain, Friction, Grid, GridItem, Image, Indexes, IndexesAnchor, IndexesNav, InfiniteList, Input, Keyboard, KeyboardPopout, List, ListItem, LoadMore, Loading, Marquee, Menu, MenuItem, Motion, Navbar, NavbarItem, NavbarPit, NoticeBar, Notify, OnlyChild, 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, Spring, 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, addSeparator, addUnit, arrayEqual, arrayMove, autoUpdate, barcode, baseLunarYear, calculateBarcodeLayout, camelCase, capitalize, chainGet, chainSet, checkRtl, chooseFile, clamp, clipboard, computePosition, createActionSheet, createBem, createBemStruct, createCropImage, createDialog, createInertialAnimate, createNotify, createPreviewImage, createToast, cropImage, cssVar, cssVarName, currentLocale, debounce, deepClone, defaultBemConfig, defaultColorPickerPresets, defaultColorPickerValue, defaultOptionKeys, defineSetupFnComponent, dialog, earthlyBranches, enhanceComponent, extend, flatVNode, formatColor, formatDate, formatNumber, formatTime, getAllImperatives, getAspectFillSize, getAspectFitSize, getAvailableImperative, getCurrentTime, getDampingValue, getDayOfYear, getDaysAfterLastDay, getDaysBeforeFirstDay, getDaysInMonth, getDaysSinceUnixEpoch, getDecimalsLength, getFileName, getFirstDayWeekday, getGridCenterSize, getGridIndex, getGridPrizeCount, getImperatives, getInBoundValue, getLeafNodes, getLunarDayName, getLunarHourName, getLunarLeapMonth, getLunarLeapMonthDays, getLunarMonthDays, getLunarMonthName, getLunarYearDays, getLunarYearName, getNextMonthDate, getNextMonthHeadDays, getNodeLevel, getOverflowRangeInArea, getPageRange, getPrevMonthDate, getPrevMonthTailDays, getPreviewColor, getRectDampingValue, getRotatedRect, getScrollIntoViewValue, getScrollTop, getTouchPoint, getTransformOrigin, getTreeCheckedKeys, getTreeHalfCheckedKeys, getTwoPointsDistance, heavenlyStems, hslToHsv, hslToHwb, hslToRgb, hsvToHsl, hwbToHsl, imageDataToDataURL, inRange, initializeCheckNodes, installer, isBoolean, isColorScheme, isConfigObject, isDate, isEmptyArray, isEmptyBinding, isEmptyValue, isFileUrl, isFunction, isImageFile, isImageUrl, isKorean, isLeapYear, isNoEmptyArray, isNullish, isNumber, isObject, isPlainObject, isPrimitive, isRectEqual, isRenderVisible, isSizeEqual, isString, isUndefined, isVideoFile, isVideoUrl, isVisibleEmpty, kebabCase, loadImage, localeContextKey, logError, looseToNumber, lowerFirst, lunarDayNames, lunarInfo, lunarMonthNames, lunarToSolar, lunarYearNames, mapTreeToGrid, matchScrollVisible, measureTextWidth, minmaxDate, mround, nestedToMulti, noop, normalizeBarcodeOptions, normalizeHsla, normalizeHsva, notify, omit, omitFormPopoutProps, parseColor, parseDate, partition, partitionPopoutInputProps, pascalCase, pick, plateEnglishLetterKeys, plateProvinceKeys, plateSuffixKeys, popupManager, prepareEnvironment, previewImage, provideColorScheme, provideLocale, qrcode, random, reactiveComputed, readFileContent, rgbToHsl, round, safeAreaInsets, scrollToTarget, setCheckedRecursively, setLocale, shuffle, sleep, snakeCase, solarToLunar, spaceSizes, splitUnit, spreadEach, springFestivals, throttle, toArray, toDate, toDateNumber, toDateString, toMonthNumber, toReactive, toTouchEvent, toast, treeToMap, uniqid, updateAncestorsChecked, upperFirst, useClickOutside, useColorScheme, useComposition, useCountDown, useDragPinch, useElementBackTop, useElementScroll, useFormContext, useFormItem, useFormItemContext, useFormPopout, useImperative, useInPopup, useIndeterminate, useInitialVelocity, useIntersectionObserver, useKeyList, useLoadMore, useLocale, useLockScroll, useLuckyDraw, useLuckyGrid, useLuckyWheel, useMotioning, useOptionKeys, usePageBackTop, usePageScroll, usePointerDown, usePopoutInput, usePopper, usePopupEnter, usePopupVisibleHookProvide, useReachBottom, useResizeObserver, useRtl, useScrollSide, useScrollSpy, useScroller, useSimulatedClick, useSimulatedDblClick, useSimulatedPress, useSingleTask, useSlotMachine, useStopMovedClick, useTimeout, useTimeoutLoading, useTranslate, useTranslateWithPrefix, useWindowResize, useZIndex, walkAncestor, walkDescendant, walkNodes, windowInfo, withResolvers };
+export { ADD_SWIPER_CONTEXT_KEY, ALPHANUMERIC_CHARS, Accordion, AccordionItem, ActionSheet, ActionSheetItem, Alert, Avatar, AvatarGroup, BackTop, Badge, Barcode, BarcodeFormatList, BarcodeTextPositionList, 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, ECLList, Ellipsis, Empty, Fab, FabItem, FloatingBubble, FloatingPanel, Form, FormItem, FormItemPlain, FormPlain, Friction, Grid, GridItem, Image, Indexes, IndexesAnchor, IndexesNav, Input, Keyboard, KeyboardPopout, List, ListItem, LoadMore, LoadMoreStatus, Loading, Marquee, Menu, MenuItem, Motion, Navbar, NavbarItem, NavbarPit, NoticeBar, Notify, OnlyChild, 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, Spring, 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, addSeparator, addUnit, arrayEqual, arrayMove, autoUpdate, barcode, baseLunarYear, calculateBarcodeLayout, camelCase, capitalize, chainGet, chainSet, checkRtl, chooseFile, clamp, clipboard, computePosition, createActionSheet, createBem, createBemStruct, createCropImage, createDialog, createInertialAnimate, createNotify, createPreviewImage, createToast, cropImage, cssVar, cssVarName, currentLocale, debounce, deepClone, defaultBemConfig, defaultColorPickerPresets, defaultColorPickerValue, defaultOptionKeys, defineSetupFnComponent, dialog, earthlyBranches, enhanceComponent, extend, flatVNode, formatColor, formatDate, formatNumber, formatTime, getAllImperatives, getAspectFillSize, getAspectFitSize, getAvailableImperative, getCurrentTime, getDampingValue, getDayOfYear, getDaysAfterLastDay, getDaysBeforeFirstDay, getDaysInMonth, getDaysSinceUnixEpoch, getDecimalsLength, getFileName, getFirstDayWeekday, getGridCenterSize, getGridIndex, getGridPrizeCount, getImperatives, getInBoundValue, getLeafNodes, getLunarDayName, getLunarHourName, getLunarLeapMonth, getLunarLeapMonthDays, getLunarMonthDays, getLunarMonthName, getLunarYearDays, getLunarYearName, getNextMonthDate, getNextMonthHeadDays, getNodeLevel, getOverflowRangeInArea, getPageRange, getPrevMonthDate, getPrevMonthTailDays, getPreviewColor, getRectDampingValue, getRotatedRect, getScrollIntoViewValue, getScrollTop, getTouchPoint, getTransformOrigin, getTreeCheckedKeys, getTreeHalfCheckedKeys, getTwoPointsDistance, heavenlyStems, hslToHsv, hslToHwb, hslToRgb, hsvToHsl, hwbToHsl, imageDataToDataURL, inRange, initializeCheckNodes, installer, isBoolean, isColorScheme, isConfigObject, isDate, isEmptyArray, isEmptyBinding, isEmptyValue, isFileUrl, isFunction, isImageFile, isImageUrl, isKorean, isLeapYear, isNoEmptyArray, isNullish, isNumber, isObject, isPlainObject, isPrimitive, isRectEqual, isRenderVisible, isSizeEqual, isString, isUndefined, isVideoFile, isVideoUrl, isVisibleEmpty, kebabCase, loadImage, localeContextKey, logError, looseToNumber, lowerFirst, lunarDayNames, lunarInfo, lunarMonthNames, lunarToSolar, lunarYearNames, mapTreeToGrid, matchScrollVisible, measureTextWidth, minmaxDate, mround, nestedToMulti, noop, normalizeBarcodeOptions, normalizeHsla, normalizeHsva, notify, omit, omitFormPopoutProps, parseColor, parseDate, partition, partitionPopoutInputProps, pascalCase, pick, plateEnglishLetterKeys, plateProvinceKeys, plateSuffixKeys, popupManager, prepareEnvironment, previewImage, provideColorScheme, provideLocale, qrcode, random, reactiveComputed, readFileContent, rgbToHsl, round, safeAreaInsets, scrollToTarget, setCheckedRecursively, setLocale, shuffle, sleep, snakeCase, solarToLunar, spaceSizes, splitUnit, spreadEach, springFestivals, throttle, toArray, toDate, toDateNumber, toDateString, toMonthNumber, toReactive, toTouchEvent, toast, treeToMap, uniqid, updateAncestorsChecked, upperFirst, useClickOutside, useColorScheme, useComposition, useCountDown, useDragPinch, useElementBackTop, useElementScroll, useFormContext, useFormItem, useFormItemContext, useFormPopout, useImperative, useInPopup, useIndeterminate, useInitialVelocity, useIntersectionObserver, useKeyList, useLocale, useLockScroll, useLuckyDraw, useLuckyGrid, useLuckyWheel, useMotioning, useOptionKeys, usePageBackTop, usePageScroll, usePointerDown, usePopoutInput, usePopper, usePopupEnter, usePopupVisibleHookProvide, useReachBottom, useResizeObserver, useRtl, useScrollSide, useScrollSpy, useScroller, useSimulatedClick, useSimulatedDblClick, useSimulatedPress, useSingleTask, useSlotMachine, useStopMovedClick, useTimeout, useTimeoutLoading, useTranslate, useTranslateWithPrefix, useWindowResize, useZIndex, walkAncestor, walkDescendant, walkNodes, windowInfo, withResolvers };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sard",
-  "version": "1.0.13",
+  "version": "1.0.14",
   "description": "sard 是基于 Vue3 的 Web 移动端 UI 组件库",
   "keywords": [
     "UI",

package/use/useIntersectionObserver.d.ts

@@ -4,6 +4,7 @@ export interface UseIntersectionObserverOptions {
     root?: MaybeRefOrGetter<Element | Document | Window | null | undefined>;
     rootMargin?: MaybeRefOrGetter<string>;
     threshold?: MaybeRefOrGetter<number | number[]>;
+    disabled?: MaybeRefOrGetter<boolean | null | undefined>;
 }
 export interface UseIntersectionObserverReturn {
     isIntersecting: Ref<boolean>;

package/use/useIntersectionObserver.js

@@ -9,6 +9,7 @@ function useIntersectionObserver(options = {}) {
 	const rootMargin = computed(() => toValue(options.rootMargin));
 	const threshold = computed(() => toValue(options.threshold));
 	const target = computed(() => toValue(options.target));
+	const disabled = computed(() => toValue(options.disabled));
 	const isIntersecting = ref(false);
 	const intersectionRatio = ref(0);
 	let observer = null;
@@ -26,6 +27,7 @@ function useIntersectionObserver(options = {}) {
 	};
 	const createObserver = () => {
 		destroyObserver();
+		if (disabled.value) return;
 		observer = new IntersectionObserver(callback, {
 			root: root.value,
 			rootMargin: rootMargin.value,
@@ -49,7 +51,8 @@ function useIntersectionObserver(options = {}) {
 	watch([
 		root,
 		rootMargin,
-		threshold
+		threshold,
+		disabled
 	], () => {
 		createObserver();
 	}, {

package/components/load-more/useLoadMore.d.ts

@@ -1,22 +0,0 @@
-/**
- * 以 hook 的方式组织 LoadMore 的逻辑
- */
-import { type ComputedRef, type MaybeRefOrGetter, type Ref } from 'vue';
-import type { LoadMoreStatus } from './common';
-export interface UseLoadMoreOptions {
-    request: (page: number, isRefresh: boolean) => Promise<boolean>;
-    rootMargin?: MaybeRefOrGetter<string>;
-    root?: MaybeRefOrGetter<Element | Document | Window | null | undefined>;
-    target?: MaybeRefOrGetter<Element | null>;
-    disabled?: MaybeRefOrGetter<boolean>;
-}
-export interface UseLoadMoreReturn {
-    status: Ref<LoadMoreStatus>;
-    isLoading: ComputedRef<boolean>;
-    isRefreshing: ComputedRef<boolean>;
-    onLoadMore: () => void;
-    onReload: () => void;
-    currentPage: Ref<number, number>;
-    refresh: (force?: boolean) => Promise<void | null>;
-}
-export declare function useLoadMore(options: UseLoadMoreOptions): UseLoadMoreReturn;

package/components/load-more/useLoadMore.js

@@ -1,71 +0,0 @@
-import { useIntersectionObserver } from "../../use/useIntersectionObserver.js";
-import { computed, ref, toValue, watch } from "vue";
-//#region packages/sard/components/load-more/useLoadMore.ts
-/**
-* 以 hook 的方式组织 LoadMore 的逻辑
-*/
-function useLoadMore(options) {
-	const status = ref("incomplete");
-	const currentPage = ref(1);
-	const isRefreshing = ref(false);
-	const disabled = computed(() => toValue(options.disabled));
-	const { rootMargin = "0px 0px 100px", root, target } = options;
-	let firstTime = false;
-	let currentPromise = null;
-	const loadMoreFetch = async (page) => {
-		if (status.value === "loading") return currentPromise;
-		firstTime = true;
-		status.value = "loading";
-		currentPage.value = page;
-		return currentPromise = options.request(page, isRefreshing.value).then((loaded) => {
-			isRefreshing.value = false;
-			status.value = loaded ? "complete" : "incomplete";
-			if (!loaded) setTimeout(() => {
-				if (status.value === "incomplete" && isIntersecting.value) onLoadMore();
-			}, 30);
-		}).catch(() => {
-			isRefreshing.value = false;
-			status.value = "error";
-		});
-	};
-	const refresh = async (force) => {
-		if (!disabled.value) {
-			if (force || status.value !== "loading") {
-				isRefreshing.value = true;
-				return loadMoreFetch(1);
-			}
-		}
-	};
-	const onLoadMore = () => {
-		if (!disabled.value) loadMoreFetch(currentPage.value + 1);
-	};
-	const onReload = () => {
-		if (!disabled.value) loadMoreFetch(currentPage.value);
-	};
-	const { isIntersecting } = useIntersectionObserver({
-		root,
-		rootMargin,
-		threshold: 0,
-		target
-	});
-	watch([
-		disabled,
-		status,
-		isIntersecting
-	], () => {
-		setTimeout(() => {
-			if (!disabled.value && status.value === "incomplete" && isIntersecting.value) loadMoreFetch(firstTime ? currentPage.value + 1 : currentPage.value);
-		}, 30);
-	});
-	return {
-		status,
-		isLoading: computed(() => status.value === "loading"),
-		isRefreshing: computed(() => isRefreshing.value),
-		onLoadMore,
-		onReload,
-		currentPage,
-		refresh
-	};
-}
-//#endregion
-export { useLoadMore };