sard 1.0.4 → 1.0.6

package/components/picker/picker.js

@@ -1,13 +1,11 @@
 import { createBem } from "../../utils/bem.js";
-import { isEmptyArray } from "../../utils/is.js";
-import { isEmptyBinding } from "../../utils/utils.js";
 import { nestedToMulti } from "../../utils/object.js";
 import { arrayEqual, toArray } from "../../utils/array.js";
 import { useOptionKeys } from "../../use/useOptionKeys.js";
 import { defaultPickerProps, getCascaderValidIndexes, getColumnsType, getIndexesByValue, getMaySingleValueByOptions, getOptionsByIndexes } from "./common.js";
 import picker_view_default from "../picker-view/picker-view.js";
 import picker_view_column_default from "../picker-view/picker-view-column.js";
-import { Fragment, computed, createBlock, createElementBlock, createTextVNode, createVNode, defineComponent, mergeDefaults, nextTick, normalizeClass, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useSlots, watch, withCtx } from "vue";
+import { Fragment, computed, createBlock, createElementBlock, createTextVNode, createVNode, defineComponent, mergeDefaults, normalizeClass, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useSlots, watch, withCtx } from "vue";
 //#region packages/sard/components/picker/picker.vue
 var picker_default = /*@__PURE__*/ defineComponent({
 	__name: "picker",
@@ -31,37 +29,34 @@ var picker_default = /*@__PURE__*/ defineComponent({
 		useSlots();
 		const emit = __emit;
 		const bem = createBem("picker");
-		const useOptionKeysReturn = useOptionKeys(props);
-		const { aliasProps, getLabel } = useOptionKeysReturn;
-		const columnsType = computed(() => {
-			return getColumnsType(props.columns, useOptionKeysReturn);
-		});
+		const optionKeys = useOptionKeys(props);
 		const innerValue = ref(props.modelValue);
 		watch(() => props.modelValue, () => {
 			innerValue.value = props.modelValue;
 		});
+		const columnsType = computed(() => {
+			return getColumnsType(props.columns, optionKeys);
+		});
 		const columnIndexes = ref([]);
-		const updateColumnIndexes = () => {
-			const indexes = getIndexesByValue(toArray(innerValue.value), props.columns, useOptionKeysReturn);
-			if (!arrayEqual(indexes, columnIndexes.value)) columnIndexes.value = indexes;
-		};
-		updateColumnIndexes();
 		watch([
 			innerValue,
 			() => props.columns,
-			aliasProps
+			optionKeys.aliasProps
 		], () => {
-			if (!isEmptyBinding(innerValue.value) && !isEmptyArray(innerValue.value)) updateColumnIndexes();
+			const indexes = getIndexesByValue(toArray(innerValue.value), props.columns, optionKeys);
+			if (!arrayEqual(indexes, columnIndexes.value)) columnIndexes.value = indexes;
+		}, { immediate: true });
+		const renderedColumns = computed(() => {
+			switch (columnsType.value) {
+				case "single": return [props.columns];
+				case "multi": return props.columns;
+				case "cascader": return nestedToMulti(props.columns, toArray(innerValue.value), optionKeys);
+				default: return [];
+			}
 		});
 		const onChange = (value) => {
 			if (!props.columns || props.columns.length === 0) return;
 			let indexes = value;
-			if (indexes.some((index) => index === Infinity)) {
-				nextTick(() => {
-					columnIndexes.value = isEmptyBinding(innerValue.value) || isEmptyArray(innerValue.value) ? columnIndexes.value.map(() => 0) : [...columnIndexes.value];
-				});
-				return;
-			}
 			indexes = renderedColumns.value.map((_, index) => indexes[index] || 0);
 			if (columnsType.value === "cascader") {
 				let startIndex = -1;
@@ -72,42 +67,22 @@ var picker_default = /*@__PURE__*/ defineComponent({
 				}
 				indexes = nextIndexes;
 				{
-					const validIndexes = getCascaderValidIndexes(indexes, props.columns, useOptionKeysReturn);
+					const validIndexes = getCascaderValidIndexes(indexes, props.columns, optionKeys);
 					if (!arrayEqual(indexes, validIndexes)) indexes = validIndexes;
 				}
 			}
-			const selectedOptions = getOptionsByIndexes(indexes, props.columns, useOptionKeysReturn);
+			const selectedOptions = getOptionsByIndexes(indexes, props.columns, optionKeys);
 			if (!arrayEqual(indexes, columnIndexes.value)) columnIndexes.value = indexes;
-			const nextValue = getMaySingleValueByOptions(selectedOptions, useOptionKeysReturn, props.columns);
+			const nextValue = getMaySingleValueByOptions(selectedOptions, optionKeys, props.columns);
 			innerValue.value = nextValue;
 			emit("update:modelValue", nextValue, selectedOptions, indexes);
 			emit("change", nextValue, selectedOptions, indexes);
 		};
-		const getRenderedColumns = () => {
-			switch (columnsType.value) {
-				case "single": return [props.columns];
-				case "multi": return props.columns;
-				case "cascader": return nestedToMulti(props.columns, toArray(innerValue.value), useOptionKeysReturn);
-				default: return [];
-			}
-		};
-		const renderedColumns = ref(getRenderedColumns());
-		const updateRenderedColumns = () => {
-			renderedColumns.value = getRenderedColumns();
-		};
-		watch([() => props.columns, innerValue], ([newColumns, newValue], [oldColumns, oldValue]) => {
-			if (newColumns !== oldColumns || newValue !== oldValue && columnsType.value === "cascader" && !isEmptyBinding(newValue) && !isEmptyArray(newValue)) updateRenderedColumns();
-		});
-		watch(() => props.modelValue, () => {
-			if (isEmptyBinding(props.modelValue) || isEmptyArray(props.modelValue)) {
-				updateColumnIndexes();
-				updateRenderedColumns();
-			}
-		});
+		const pickerClass = bem.b();
 		const pickerViewClass = bem.e("picker-view");
 		const indicatorClass = bem.e("indicator");
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", { class: normalizeClass(unref(bem).b()) }, [createVNode(unref(picker_view_default), {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(unref(pickerClass)) }, [createVNode(unref(picker_view_default), {
 				class: normalizeClass(unref(pickerViewClass)),
 				"indicator-class": unref(indicatorClass),
 				value: columnIndexes.value,
@@ -123,7 +98,7 @@ var picker_default = /*@__PURE__*/ defineComponent({
 								option,
 								rowIndex: j,
 								columnIndex: i
-							}, () => [createTextVNode(toDisplayString(unref(getLabel)(option)), 1)])], 2);
+							}, () => [createTextVNode(toDisplayString(unref(optionKeys).getLabel(option)), 1)])], 2);
 						}), 128))]),
 						_: 2
 					}, 1024);

package/components/picker-input/picker-input.js

@@ -96,15 +96,15 @@ var picker_input_default = /*@__PURE__*/ defineComponent({
 		const props = __props;
 		const slots = useSlots();
 		const emit = __emit;
-		const useOptionKeysReturn = useOptionKeys(props);
+		const optionKeys = useOptionKeys(props);
 		const partitionedProps = partitionPopoutInputProps(props);
 		const { innerVisible, innerValue, inputValue, show, onChange, onClear, onVisibleHook } = usePopoutInput(props, emit);
-		const { getLabel } = useOptionKeysReturn;
+		const { getLabel } = optionKeys;
 		const onClick = () => {
 			if (props.columns && props.columns.length > 0) show();
 		};
 		function getOutletText(columns, value) {
-			return getOptionsByIndexes(getIndexesByValue(toArray(value), columns || [], useOptionKeysReturn), columns || [], useOptionKeysReturn).map((option) => getLabel(option)).join("/");
+			return getOptionsByIndexes(getIndexesByValue(toArray(value), columns || [], optionKeys), columns || [], optionKeys).map((option) => getLabel(option)).join("/");
 		}
 		function getInputValue() {
 			if (isEmptyBinding(innerValue.value) || isEmptyArray(innerValue.value)) return "";

package/components/picker-popout/picker-popout.js

@@ -63,11 +63,11 @@ var picker_popout_default = /*@__PURE__*/ defineComponent({
 		const props = __props;
 		const slots = useSlots();
 		const emit = __emit;
-		const useOptionKeysReturn = useOptionKeys(props);
+		const optionKeys = useOptionKeys(props);
 		const omittedProps = omitFormPopoutProps(props);
 		const { innerVisible, innerValue, draftValue, onChange, onConfirm, onVisibleHook } = useFormPopout(props, emit, { onConfirmBefore() {
 			if (isEmptyBinding(draftValue.value) || isEmptyArray(draftValue.value)) {
-				const [initialValue, selectedOptions] = getInitialValue(props.columns, useOptionKeysReturn);
+				const [initialValue, selectedOptions] = getInitialValue(props.columns, optionKeys);
 				draftValue.value = initialValue;
 				return [selectedOptions];
 			}

package/components/picker-view/common.d.ts

@@ -46,7 +46,6 @@ export interface PickerViewContext {
     maskClass: any;
     indicatorClass: any;
     indicatorStyle: any;
-    height: number;
     getColumnValue: (ins: ComponentInternalInstance) => WritableComputedRef<number>;
 }
 export declare const pickerViewContextKey: InjectionKey<PickerViewContext>;

package/components/picker-view/picker-view-column.js

@@ -7,26 +7,26 @@ import { usePointerDown } from "../../use/usePointerDown.js";
 import { useResizeObserver } from "../../use/useResizeObserver.js";
 import { useScroller } from "../../utils/scroller/useScroller.js";
 import { pickerViewContextKey } from "./common.js";
-import { computed, createVNode, getCurrentInstance, inject, nextTick, onMounted, ref, useTemplateRef, watch } from "vue";
+import { computed, createVNode, getCurrentInstance, inject, ref, watch, watchPostEffect } from "vue";
 //#region packages/sard/components/picker-view/picker-view-column.tsx
 var picker_view_column_default = defineSetupFnComponent((_props, { slots }) => {
 	const bem = createBem("picker-view-column");
+	const instance = getCurrentInstance();
 	const rootRef = ref(null);
 	const contentRef = ref(null);
-	const instance = getCurrentInstance();
+	const indicatorRef = ref(null);
 	const context = inject(pickerViewContextKey);
 	const columnValue = context.getColumnValue(instance);
 	const itemCount = ref(0);
-	const indicatorHeight = ref(48);
-	useResizeObserver(useTemplateRef("indicator"), (size) => {
-		if (size.height > 0) indicatorHeight.value = size.height;
+	const rootSize = useResizeObserver(rootRef);
+	const contentSize = useResizeObserver(contentRef);
+	const indicatorSize = useResizeObserver(indicatorRef);
+	const maskSize = computed(() => (rootSize.height - indicatorSize.height) / 2);
+	const contentHeight = computed(() => {
+		return contentSize.height + maskSize.value * 2;
 	});
-	const maskSize = computed(() => (context.height - indicatorHeight.value) / 2);
-	const { update, scrollTo, isIdle, handleTouchStart, handleTouchMove, handleTouchEnd } = useScroller(contentRef, {
-		enableY: true,
-		enableX: false,
-		enableSnap: true,
-		itemSize: indicatorHeight.value,
+	const { position, update, scrollTo, isIdle, handleTouchStart, handleTouchMove, handleTouchEnd } = useScroller({
+		itemSize: indicatorSize.height,
 		friction: new Friction(1e-4),
 		spring: new Spring(2, 90, 20),
 		onSnap: (index) => {
@@ -36,27 +36,29 @@ var picker_view_column_default = defineSetupFnComponent((_props, { slots }) => {
 			handleTap(event);
 		}
 	});
-	let updatesScrollerRequest;
-	function updatesScroller() {
-		if (!updatesScrollerRequest && indicatorHeight.value) {
-			updatesScrollerRequest = true;
-			nextTick(() => {
-				updatesScrollerRequest = false;
-				const current = Math.max(Math.min(columnValue.value, itemCount.value - 1), 0);
-				update(current * indicatorHeight.value, void 0, indicatorHeight.value);
-			});
-		}
-	}
+	let updatePending = false;
 	watch([
-		indicatorHeight,
+		() => indicatorSize.height,
+		columnValue,
 		itemCount,
-		() => context.height,
-		columnValue
+		() => rootSize.height,
+		contentHeight
 	], () => {
-		updatesScroller();
-	});
-	onMounted(() => {
-		updatesScroller();
+		if (updatePending) return;
+		updatePending = true;
+		setTimeout(() => {
+			updatePending = false;
+			if (indicatorSize.height) {
+				const current = Math.max(Math.min(columnValue.value, itemCount.value - 1), 0);
+				update(current * indicatorSize.height, indicatorSize.height, rootSize.height, contentHeight.value);
+			}
+		});
+	}, { flush: "post" });
+	watchPostEffect(() => {
+		const el = contentRef.value;
+		if (!el) return;
+		const transform = "translateY(" + position.value + "px) translateZ(0)";
+		el.style.transform = transform;
 	});
 	let oldDeltaY = 0;
 	function handleWheel(event) {
@@ -65,21 +67,21 @@ var picker_view_column_default = defineSetupFnComponent((_props, { slots }) => {
 			oldDeltaY = 0;
 			let current = Math.min(columnValue.value + (deltaY < 0 ? -1 : 1), itemCount.value - 1);
 			columnValue.value = current = Math.max(current, 0);
-			scrollTo(current * indicatorHeight.value);
+			scrollTo(current * indicatorSize.height);
 		} else oldDeltaY = deltaY;
 		event.preventDefault();
 	}
 	function handleTap({ changedTouches: [{ clientY }] }) {
 		const el = rootRef.value;
 		if (isIdle()) {
-			const r = clientY - el.getBoundingClientRect().top - context.height / 2;
-			const o = indicatorHeight.value / 2;
+			const r = clientY - el.getBoundingClientRect().top - rootSize.height / 2;
+			const o = indicatorSize.height / 2;
 			if (!(Math.abs(r) <= o)) {
-				const a = Math.ceil((Math.abs(r) - o) / indicatorHeight.value);
+				const a = Math.ceil((Math.abs(r) - o) / indicatorSize.height);
 				const s = r < 0 ? -a : a;
 				let current = Math.min(columnValue.value + s, itemCount.value - 1);
 				columnValue.value = current = Math.max(current, 0);
-				scrollTo(current * indicatorHeight.value);
+				scrollTo(current * indicatorSize.height);
 			}
 		}
 	}
@@ -115,7 +117,7 @@ var picker_view_column_default = defineSetupFnComponent((_props, { slots }) => {
 				"style": [`background-size: 100% ${maskSize.value}px;`, context.maskStyle]
 			}, null),
 			createVNode("div", {
-				"ref": "indicator",
+				"ref": indicatorRef,
 				"class": [bem.e("indicator"), context.indicatorClass],
 				"style": context.indicatorStyle
 			}, null),
@@ -124,7 +126,7 @@ var picker_view_column_default = defineSetupFnComponent((_props, { slots }) => {
 				"class": [bem.e("content")],
 				"style": {
 					padding,
-					"--picker-view-indicator-height": `${indicatorHeight.value}px`
+					"--picker-view-indicator-height": `${indicatorSize.height}px`
 				}
 			}, [defaultSlots])
 		])]);

package/components/picker-view/picker-view.js

@@ -1,13 +1,11 @@
 import { createBem } from "../../utils/bem.js";
 import { flatVNode } from "../../utils/vnode.js";
 import { defineSetupFnComponent } from "../../utils/component.js";
-import { useResizeObserver } from "../../use/useResizeObserver.js";
 import { pickerViewContextKey, pickerViewProps } from "./common.js";
-import { computed, createVNode, provide, reactive, ref, toRef, useTemplateRef, watch } from "vue";
+import { computed, createVNode, provide, reactive, ref, toRef, watch } from "vue";
 //#region packages/sard/components/picker-view/picker-view.tsx
 var picker_view_default = defineSetupFnComponent((props, { slots, emit }) => {
 	const bem = createBem("picker-view");
-	const rootRef = useTemplateRef("root");
 	const innerValue = reactive([...props.value]);
 	watch(() => props.value, (value) => {
 		innerValue.length = value.length;
@@ -30,32 +28,24 @@ var picker_view_default = defineSetupFnComponent((props, { slots, emit }) => {
 				if (index < 0) return;
 				if (innerValue[index] !== current) {
 					innerValue[index] = current;
-					const value = innerValue.map((val) => val);
+					const value = [...innerValue];
 					emit("update:value", value);
 					emit("change", value);
 				}
 			}
 		});
 	};
-	const height = ref(48);
-	useResizeObserver(rootRef, (size) => {
-		height.value = size.height;
-	});
 	provide(pickerViewContextKey, reactive({
 		maskStyle: toRef(() => props.maskStyle),
 		maskClass: toRef(() => props.maskClass),
 		indicatorClass: toRef(() => props.indicatorClass),
 		indicatorStyle: toRef(() => props.indicatorStyle),
-		height,
 		getColumnValue
 	}));
 	return () => {
 		const defaultSlots = slots.default && slots.default();
 		columnsRef.value = flatVNode(defaultSlots);
-		return createVNode("div", {
-			"ref": "root",
-			"class": bem.b()
-		}, [createVNode("div", { "class": bem.e("wrapper") }, [defaultSlots])]);
+		return createVNode("div", { "class": bem.b() }, [createVNode("div", { "class": bem.e("wrapper") }, [defaultSlots])]);
 	};
 }, {
 	name: "PickerView",

package/components/preview-image/preview-image.js

@@ -52,7 +52,6 @@ var preview_image_default = /*@__PURE__*/ defineComponent({
 	setup(__props, { expose: __expose, emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
-		__expose({});
 		const bem = createBem("preview-image");
 		const innerVisible = useModel(props, "visible");
 		const visibleTimer = useTimeout();
@@ -132,6 +131,7 @@ var preview_image_default = /*@__PURE__*/ defineComponent({
 			};
 		});
 		const current = useModel(props, "current");
+		__expose({});
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(popup_default, {
 				effect: "full-fade",

package/components/pull-down-refresh/pull-down-refresh.js

@@ -115,7 +115,6 @@ var pull_down_refresh_default = /*@__PURE__*/ defineComponent({
 		const enableToRefresh = (can) => {
 			canRefresh.value = can;
 		};
-		__expose({ enableToRefresh });
 		const pullDownRefreshStyle = computed(() => {
 			return {
 				transform: `translate3d(0,${translateY.value}px,0)`,
@@ -125,6 +124,7 @@ var pull_down_refresh_default = /*@__PURE__*/ defineComponent({
 		const headerStyle = computed(() => {
 			return { height: props.headerHeight + "px" };
 		});
+		__expose({ enableToRefresh });
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
 				class: normalizeClass(unref(bem).b()),

package/components/puzzle-verify/puzzle-verify.js

@@ -89,7 +89,6 @@ var puzzle_verify_default = /*@__PURE__*/ defineComponent({
 			emit("end", event);
 			isDown.value = false;
 		};
-		__expose({ reset });
 		const puzzleVerifyClass = computed(() => {
 			return [bem.b(), bem.m("down", isDown.value)];
 		});
@@ -101,6 +100,7 @@ var puzzle_verify_default = /*@__PURE__*/ defineComponent({
 				"--padding-top": 1 / aspectRatio.value * 100 + "%"
 			};
 		});
+		__expose({ reset });
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
 				class: normalizeClass(puzzleVerifyClass.value),

package/components/rate/index.css

@@ -1 +1 @@
-:root{--s-rate-gap:var(--s-size-xs);--s-rate-star-font-size:var(--s-size-lg);--s-rate-void-star-color:var(--s-text-color-fourth);--s-rate-star-color:var(--s-color-warning)}.s-rate{display:inline-flex;-webkit-user-select:none;user-select:none}.s-rate__content{display:flex;gap:var(--s-rate-gap);touch-action:pan-y}.s-rate__item{position:relative;font-size:var(--s-rate-star-font-size);line-height:var(--s-line-height-none);cursor:pointer}.s-rate__item svg{flex:none}.s-rate__void-star{color:var(--s-rate-void-star-color)}.s-rate__star{position:absolute;top:0;inset-inline-start:0;display:flex;align-items:flex-start;width:0;overflow:hidden;color:var(--s-rate-star-color)}.s-rate--readonly,.s-rate--disabled{touch-action:auto}.s-rate--readonly .s-rate__item{cursor:unset}.s-rate--disabled .s-rate__void-star{color:var(--s-border-color-disabled)}.s-rate--disabled .s-rate__star{color:var(--s-text-color-disabled)}.s-rate--disabled .s-rate__item{cursor:not-allowed}
+:root{--s-rate-gap:var(--s-size-xs);--s-rate-star-font-size:var(--s-size-lg);--s-rate-void-star-color:var(--s-text-color-fourth);--s-rate-star-color:var(--s-color-warning)}.s-rate{display:inline-flex;-webkit-user-select:none;user-select:none}.s-rate__content{display:flex;gap:var(--s-rate-gap);touch-action:pan-y}.s-rate__item{position:relative;font-size:var(--s-rate-star-font-size);line-height:var(--s-line-height-none);cursor:pointer}.s-rate__item svg{flex:none}.s-rate__void-star{color:var(--s-rate-void-star-color)}.s-rate__star{position:absolute;top:0;inset-inline-start:0;display:flex;align-items:flex-start;width:0;overflow:hidden;color:var(--s-rate-star-color)}.s-rate--readonly,.s-rate--disabled{touch-action:auto}.s-rate--readonly .s-rate__item{cursor:unset}.s-rate--disabled .s-rate__void-star{color:var(--s-border-color-dark)}.s-rate--disabled .s-rate__star{color:var(--s-text-color-disabled)}.s-rate--disabled .s-rate__item{cursor:not-allowed}

package/components/read-more/read-more.js

@@ -86,13 +86,13 @@ var read_more_default = /*@__PURE__*/ defineComponent({
 				behavior: "instant"
 			});
 		};
-		__expose({});
 		const readMoreClass = computed(() => {
 			return [bem.b(), bem.m("close", !innerVisible.value)];
 		});
 		const contentStyle = computed(() => {
 			return { maxHeight: innerVisible.value ? "none" : props.maxHeight + "px" };
 		});
+		__expose({});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", { class: normalizeClass(readMoreClass.value) }, [createElementVNode("div", {
 				ref: "content",

package/components/rotate-verify/rotate-verify.js

@@ -65,10 +65,10 @@ var rotate_verify_default = /*@__PURE__*/ defineComponent({
 		const reset = () => {
 			slideVerifyRef.value?.reset();
 		};
-		__expose({ reset });
 		const imageStyle = computed(() => {
 			return { transform: `rotate(${targetDegree.value}deg) rotate(${-slideDegree.value}deg)` };
 		});
+		__expose({ reset });
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", { class: normalizeClass(unref(bem).b()) }, [createElementVNode("img", {
 				class: normalizeClass(unref(bem).e("image")),

package/components/segmented/segmented-item.js

@@ -48,7 +48,6 @@ var segmented_item_default = /*@__PURE__*/ defineComponent({
 			if (!isDisabled.value && !isReadonly.value) context.toggle(props.value);
 			emit("click", event);
 		};
-		__expose({});
 		const segmentedItemClass = computed(() => {
 			return [
 				bem.b(),
@@ -60,6 +59,7 @@ var segmented_item_default = /*@__PURE__*/ defineComponent({
 				bem.m(context.shape)
 			];
 		});
+		__expose({});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
 				class: normalizeClass(segmentedItemClass.value),

package/components/segmented/segmented.js

@@ -94,7 +94,6 @@ var segmented_default = /*@__PURE__*/ defineComponent({
 			value: innerValue,
 			toggle
 		}));
-		__expose({});
 		const segmentedClass = computed(() => {
 			return [
 				bem.b(),
@@ -109,6 +108,7 @@ var segmented_default = /*@__PURE__*/ defineComponent({
 				"--offset": `${currentIndex.value * 100}%`
 			};
 		});
+		__expose({});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", { class: normalizeClass(segmentedClass.value) }, [createElementVNode("div", { class: normalizeClass(unref(bem).e("wrapper")) }, [createElementVNode("div", {
 				class: normalizeClass(unref(bem).e("pointer")),

package/components/select/common.d.ts

@@ -8,6 +8,7 @@ export interface SelectProps {
     filterable?: boolean;
     filterPlaceholder?: string;
     filterMethod?: (query: string) => void;
+    filterValue?: string;
     remote?: boolean;
     remoteMethod?: (query: string, page: number, isRefresh: boolean) => Promise<boolean>;
     threshold?: number;
@@ -36,6 +37,7 @@ export interface SelectEmits {
     (e: 'update:modelValue', value: any): void;
     (e: 'change', value: any): void;
     (e: 'select', value: any): void;
+    (e: 'update:filter-value', value: string): void;
 }
 export interface SelectExpose {
 }

package/components/select/select-option.js

@@ -59,7 +59,6 @@ var select_option_default = /*@__PURE__*/ defineComponent({
 		onUnmounted(() => {
 			removeMember(member);
 		});
-		__expose({});
 		const selectOptionClass = computed(() => {
 			return [
 				bem.b(),
@@ -68,6 +67,7 @@ var select_option_default = /*@__PURE__*/ defineComponent({
 				bem.is("plain", props.plain)
 			];
 		});
+		__expose({});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
 				ref: "option",

package/components/select/select.d.ts

@@ -4,10 +4,12 @@ declare const __VLS_base: import("vue").DefineComponent<SelectProps, SelectExpos
     select: (value: any) => any;
     change: (value: any) => any;
     "update:modelValue": (value: any) => any;
+    "update:filter-value": (value: string) => any;
 }, string, import("vue").PublicProps, Readonly<SelectProps> & Readonly<{
     onSelect?: ((value: any) => any) | undefined;
     onChange?: ((value: any) => any) | undefined;
     "onUpdate:modelValue"?: ((value: any) => any) | undefined;
+    "onUpdate:filter-value"?: ((value: string) => any) | undefined;
 }>, {
     multiple: boolean;
     options: any[];
@@ -18,6 +20,7 @@ declare const __VLS_base: import("vue").DefineComponent<SelectProps, SelectExpos
     multipleLimit: number;
     filterable: boolean;
     filterMethod: (query: string) => void;
+    filterValue: string;
     remote: boolean;
     remoteMethod: (query: string, page: number, isRefresh: boolean) => Promise<boolean>;
     showToolbar: boolean;

package/components/select/select.js

@@ -49,6 +49,10 @@ var select_default = /*@__PURE__*/ defineComponent({
 			type: Function,
 			required: false
 		},
+		filterValue: {
+			type: String,
+			required: false
+		},
 		remote: {
 			type: Boolean,
 			required: false
@@ -81,7 +85,8 @@ var select_default = /*@__PURE__*/ defineComponent({
 	emits: [
 		"update:modelValue",
 		"change",
-		"select"
+		"select",
+		"update:filter-value"
 	],
 	setup(__props, { expose: __expose, emit: __emit }) {
 		const props = __props;
@@ -113,9 +118,13 @@ var select_default = /*@__PURE__*/ defineComponent({
 		const scrollRef = useTemplateRef("scroll");
 		const scrollSide = useScrollSide(scrollRef, { direction: "vertical" });
 		const searchValue = ref("");
+		watch(() => props.filterValue, () => {
+			searchValue.value = String(props.filterValue ?? "");
+		});
 		watch(searchValue, () => {
 			props.filterMethod?.(searchValue.value);
 			debouncedRefresh();
+			if (searchValue.value !== props.filterValue) emit("update:filter-value", searchValue.value);
 		});
 		const { status, isLoading, onLoadMore, onReload, refresh } = useLoadMore({
 			root: scrollRef,
@@ -157,13 +166,13 @@ var select_default = /*@__PURE__*/ defineComponent({
 		usePopupEnter(() => {
 			scrollIntoView();
 		});
-		__expose({});
 		const containerClass = computed(() => {
 			return [bem.e("container"), bem.em("container", scrollSide.vertical)];
 		});
 		const scrollClass = computed(() => {
 			return [bem.e("scroll"), bem.em("scroll", "filterable", props.filterable)];
 		});
+		__expose({});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", { class: normalizeClass(unref(bem).b()) }, [
 				__props.filterable ? (openBlock(), createElementBlock("div", {

package/components/select-input/select-input.d.ts

@@ -51,6 +51,7 @@ declare const __VLS_base: import("vue").DefineComponent<SelectInputProps, Select
     multipleLimit: number;
     filterable: boolean;
     filterMethod: (query: string) => void;
+    filterValue: string;
     remote: boolean;
     remoteMethod: (query: string, page: number, isRefresh: boolean) => Promise<boolean>;
     showToolbar: boolean;

package/components/select-input/select-input.js

@@ -62,6 +62,10 @@ var select_input_default = /*@__PURE__*/ defineComponent({
 			type: Function,
 			required: false
 		},
+		filterValue: {
+			type: String,
+			required: false
+		},
 		remote: {
 			type: Boolean,
 			required: false

package/components/select-popout/select-popout.d.ts

@@ -43,6 +43,7 @@ declare const __VLS_base: import("vue").DefineComponent<SelectPopoutProps, Selec
     multipleLimit: number;
     filterable: boolean;
     filterMethod: (query: string) => void;
+    filterValue: string;
     remote: boolean;
     remoteMethod: (query: string, page: number, isRefresh: boolean) => Promise<boolean>;
     showToolbar: boolean;

package/components/select-popout/select-popout.js

@@ -51,6 +51,10 @@ var select_popout_default = /*@__PURE__*/ defineComponent({
 			type: Function,
 			required: false
 		},
+		filterValue: {
+			type: String,
+			required: false
+		},
 		remote: {
 			type: Boolean,
 			required: false

package/components/share-sheet/index.css

@@ -1 +1 @@
-:root{--s-share-sheet-border-radius:var(--s-border-radius-xl);--s-share-sheet-border-color:var(--s-border-color);--s-share-sheet-bg:var(--s-bg-color-elevated);--s-share-sheet-header-padding:var(--s-size);--s-share-sheet-title-font-size:var(--s-font-size-lg);--s-share-sheet-description-font-size:var(--s-font-size);--s-share-sheet-description-color:var(--s-text-color-tertiary);--s-share-sheet-row-padding-y:var(--s-size);--s-share-sheet-row-padding-x:var(--s-size-xs);--s-share-sheet-item-width:80px;--s-share-sheet-item-opacity-active:var(--s-opacity-active);--s-share-sheet-icon-size:var(--s-size-4xl);--s-share-sheet-icon-radius:var(--s-border-radius-full);--s-share-sheet-icon-font-size:var(--s-size-xl);--s-share-sheet-icon-color:var(--s-text-color-tertiary);--s-share-sheet-icon-bg:var(--s-fill-color);--s-share-sheet-label-margin-top:var(--s-size-xs);--s-share-sheet-label-padding-x:var(--s-size-2xs);--s-share-sheet-label-font-size:var(--s-font-size);--s-share-sheet-label-color:var(--s-text-color-tertiary);--s-share-sheet-item-description-margin-top:0;--s-share-sheet-item-description-padding-x:var(--s-size-2xs);--s-share-sheet-item-description-font-size:var(--s-font-size-sm);--s-share-sheet-item-description-color:var(--s-text-color-fourth);--s-share-sheet-gap-bg:var(--s-fill-color-tertiary);--s-share-sheet-gap-height:var(--s-size-xs);--s-share-sheet-cancel-min-height:var(--s-content-height-lg);--s-share-sheet-cancel-padding:var(--s-size-xs) var(--s-size);--s-share-sheet-cancel-font-size:var(--s-font-size-lg);--s-share-sheet-cancel-bg-active:var(--s-bg-color-active)}.s-share-sheet{padding-bottom:var(--s-safe-bottom);border-top-left-radius:var(--s-share-sheet-border-radius);border-top-right-radius:var(--s-share-sheet-border-radius);background:var(--s-share-sheet-bg);touch-action:pan-x}.s-share-sheet__header{position:relative;display:flex;flex-direction:column;gap:var(--s-size-2xs);padding:var(--s-share-sheet-header-padding)}.s-share-sheet__header::after{position:absolute;z-index:1;pointer-events:none;touch-action:none;opacity:1;content:"";left:0;right:0;transform:scaleY(0.5);bottom:0;border-bottom:var(--s-border-width) var(--s-border-style) var(--s-share-sheet-border-color);transform-origin:bottom center}.s-share-sheet__title{font-size:var(--s-share-sheet-title-font-size);font-weight:var(--s-font-weight-bold);text-align:center}.s-share-sheet__description{font-size:var(--s-share-sheet-description-font-size);text-align:center;color:var(--s-share-sheet-description-color)}.s-share-sheet__gap{height:var(--s-share-sheet-gap-height);background:var(--s-share-sheet-gap-bg)}.s-share-sheet__cancel{display:flex;justify-content:center;align-items:center;min-height:var(--s-share-sheet-cancel-min-height);padding:var(--s-share-sheet-cancel-padding);font-size:var(--s-share-sheet-cancel-font-size);cursor:pointer}.s-share-sheet__cancel:active{background:var(--s-share-sheet-cancel-bg-active)}.s-share-sheet-item{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;width:var(--s-share-sheet-item-width);flex:none;cursor:pointer}.s-share-sheet-item:not(.is-disabled):active{opacity:var(--s-share-sheet-item-opacity-active)}.s-share-sheet-item:is(.is-disabled){opacity:var(--s-opacity-disabled);cursor:var(--s-cursor-disabled);filter:var(--s-filter-disabled)}.s-share-sheet-item__label{margin-top:var(--s-share-sheet-label-margin-top);padding:0 var(--s-share-sheet-label-padding-x);font-size:var(--s-share-sheet-label-font-size);color:var(--s-share-sheet-label-color)}.s-share-sheet-item__description{margin-top:var(--s-share-sheet-item-description-margin-top);padding:0 var(--s-share-sheet-item-description-padding-x);font-size:var(--s-share-sheet-item-description-font-size);color:var(--s-share-sheet-item-description-color)}.s-share-sheet-row{position:relative}.s-share-sheet-row:not(:first-child)::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-share-sheet-border-color);transform-origin:top center}.s-share-sheet-row__scroll{display:flex;padding:var(--s-share-sheet-row-padding-y) var(--s-share-sheet-row-padding-x);overflow-x:auto;overflow-y:hidden}.s-share-sheet-icon{display:flex;justify-content:center;align-items:center;width:var(--s-share-sheet-icon-size);height:var(--s-share-sheet-icon-size);border-radius:var(--s-share-sheet-icon-radius);font-size:var(--s-share-sheet-icon-font-size);color:var(--s-share-sheet-icon-color);background:var(--s-share-sheet-icon-bg)}.s-share-sheet-icon__image{width:100%;height:100%;object-fit:cover;border-radius:var(--s-share-sheet-icon-radius)}
+:root{--s-share-sheet-border-radius:var(--s-border-radius-xl);--s-share-sheet-border-color:var(--s-border-color);--s-share-sheet-bg:var(--s-bg-color-elevated);--s-share-sheet-header-padding:var(--s-size);--s-share-sheet-title-font-size:var(--s-font-size-lg);--s-share-sheet-description-font-size:var(--s-font-size);--s-share-sheet-description-color:var(--s-text-color-tertiary);--s-share-sheet-row-padding-y:var(--s-size);--s-share-sheet-row-padding-x:var(--s-size-xs);--s-share-sheet-item-width:80px;--s-share-sheet-item-opacity-active:var(--s-opacity-active);--s-share-sheet-icon-size:var(--s-size-4xl);--s-share-sheet-icon-radius:var(--s-border-radius-full);--s-share-sheet-icon-font-size:var(--s-size-xl);--s-share-sheet-icon-color:var(--s-text-color-tertiary);--s-share-sheet-icon-bg:var(--s-fill-color);--s-share-sheet-label-margin-top:var(--s-size-xs);--s-share-sheet-label-padding-x:var(--s-size-2xs);--s-share-sheet-label-font-size:var(--s-font-size);--s-share-sheet-label-color:var(--s-text-color-tertiary);--s-share-sheet-item-description-margin-top:0;--s-share-sheet-item-description-padding-x:var(--s-size-2xs);--s-share-sheet-item-description-font-size:var(--s-font-size-sm);--s-share-sheet-item-description-color:var(--s-text-color-fourth);--s-share-sheet-gap-bg:var(--s-fill-color-fourth);--s-share-sheet-gap-height:var(--s-size-xs);--s-share-sheet-cancel-min-height:var(--s-content-height-lg);--s-share-sheet-cancel-padding:var(--s-size-xs) var(--s-size);--s-share-sheet-cancel-font-size:var(--s-font-size-lg);--s-share-sheet-cancel-bg-active:var(--s-bg-color-active)}.s-share-sheet{padding-bottom:var(--s-safe-bottom);border-top-left-radius:var(--s-share-sheet-border-radius);border-top-right-radius:var(--s-share-sheet-border-radius);background:var(--s-share-sheet-bg);touch-action:pan-x}.s-share-sheet__header{position:relative;display:flex;flex-direction:column;gap:var(--s-size-2xs);padding:var(--s-share-sheet-header-padding)}.s-share-sheet__header::after{position:absolute;z-index:1;pointer-events:none;touch-action:none;opacity:1;content:"";left:0;right:0;transform:scaleY(0.5);bottom:0;border-bottom:var(--s-border-width) var(--s-border-style) var(--s-share-sheet-border-color);transform-origin:bottom center}.s-share-sheet__title{font-size:var(--s-share-sheet-title-font-size);font-weight:var(--s-font-weight-bold);text-align:center}.s-share-sheet__description{font-size:var(--s-share-sheet-description-font-size);text-align:center;color:var(--s-share-sheet-description-color)}.s-share-sheet__gap{height:var(--s-share-sheet-gap-height);background:var(--s-share-sheet-gap-bg)}.s-share-sheet__cancel{display:flex;justify-content:center;align-items:center;min-height:var(--s-share-sheet-cancel-min-height);padding:var(--s-share-sheet-cancel-padding);font-size:var(--s-share-sheet-cancel-font-size);cursor:pointer}.s-share-sheet__cancel:active{background:var(--s-share-sheet-cancel-bg-active)}.s-share-sheet-item{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;width:var(--s-share-sheet-item-width);flex:none;cursor:pointer}.s-share-sheet-item:not(.is-disabled):active{opacity:var(--s-share-sheet-item-opacity-active)}.s-share-sheet-item:is(.is-disabled){opacity:var(--s-opacity-disabled);cursor:var(--s-cursor-disabled);filter:var(--s-filter-disabled)}.s-share-sheet-item__label{margin-top:var(--s-share-sheet-label-margin-top);padding:0 var(--s-share-sheet-label-padding-x);font-size:var(--s-share-sheet-label-font-size);color:var(--s-share-sheet-label-color)}.s-share-sheet-item__description{margin-top:var(--s-share-sheet-item-description-margin-top);padding:0 var(--s-share-sheet-item-description-padding-x);font-size:var(--s-share-sheet-item-description-font-size);color:var(--s-share-sheet-item-description-color)}.s-share-sheet-row{position:relative}.s-share-sheet-row:not(:first-child)::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-share-sheet-border-color);transform-origin:top center}.s-share-sheet-row__scroll{display:flex;padding:var(--s-share-sheet-row-padding-y) var(--s-share-sheet-row-padding-x);overflow-x:auto;overflow-y:hidden}.s-share-sheet-icon{display:flex;justify-content:center;align-items:center;width:var(--s-share-sheet-icon-size);height:var(--s-share-sheet-icon-size);border-radius:var(--s-share-sheet-icon-radius);font-size:var(--s-share-sheet-icon-font-size);color:var(--s-share-sheet-icon-color);background:var(--s-share-sheet-icon-bg)}.s-share-sheet-icon__image{width:100%;height:100%;object-fit:cover;border-radius:var(--s-share-sheet-icon-radius)}