sard-uniapp 1.19.0 → 1.19.2

package/CHANGELOG.md

@@ -1,3 +1,32 @@
+## [1.19.2](https://github.com/sutras/sard-uniapp/compare/v1.19.1...v1.19.2) (2025-06-14)
+
+
+### Bug Fixes
+
+* picker 值为空时滚到第一个位置 ([f033ccc](https://github.com/sutras/sard-uniapp/commit/f033ccc713ec1260d1cb761769ab31ccbc39d808))
+* 修复 picker-popout 首次选择不能获取选项列表问题 ([50cebc7](https://github.com/sutras/sard-uniapp/commit/50cebc75c036c8b0bf7ed32cb46338d68716385d))
+
+
+### Features
+
+* *-input 系列组件新增valueOnClear属性 ([42275cd](https://github.com/sutras/sard-uniapp/commit/42275cd5beec09d7d5fe669c560ae6ad7dfc1b13))
+* calendar-popout组件新增title和title-prepend插槽 ([f6f8404](https://github.com/sutras/sard-uniapp/commit/f6f84042f2924f6547bb6273078ada5e08039fd5))
+* upload 组件新增 beforeChoose 属性 ([22e3137](https://github.com/sutras/sard-uniapp/commit/22e3137c72e3a16f298dcabbffd2db43268f8a74))
+* 增加 tag 组件的 mark 属性，支持 'left' 和 'right' 值以控制标记方向 ([77f9fb7](https://github.com/sutras/sard-uniapp/commit/77f9fb724040d99f7aa2612ccd03c8c6f175de52))
+* 新增css变量 ([f1b081e](https://github.com/sutras/sard-uniapp/commit/f1b081ef65c66794dec1d7b4bc6d769676cbdf7f))
+* 新增图标属性和长按菜单功能 ([62c0d7f](https://github.com/sutras/sard-uniapp/commit/62c0d7f9d4e085f91c0c745f85b02d90d0cd246e))
+
+
+
+## [1.19.1](https://github.com/sutras/sard-uniapp/compare/v1.19.0...v1.19.1) (2025-06-11)
+
+
+### Features
+
+* dropdown 新增 before-close 属性 ([fca24ac](https://github.com/sutras/sard-uniapp/commit/fca24ac536bc3840fbc9562fde4992f864968080))
+
+
+
 # [1.19.0](https://github.com/sutras/sard-uniapp/compare/v1.18.0...v1.19.0) (2025-06-10)
 
 

package/README.md

@@ -25,7 +25,7 @@
 
 ## 特性
 
-- 🧩 80+个高质量组件，覆盖移动端主流场景
+- 🧩 90+个高质量组件，覆盖移动端主流场景
 - 💪 支持一套代码同时开发 H5 / 小程序 / App
 - 🌿 支持按需引入和 `Tree Shaking`
 - 📖 详尽的文档和案例展示

package/components/action-sheet/variables.scss

@@ -23,7 +23,7 @@ page,
   --sar-action-sheet-item-description-color: var(--sar-tertiary-color);
 
   --sar-action-sheet-loading-size: 40rpx;
-  --sar-action-sheet-loading-color: var(--sar-quaternary-color);
+  --sar-action-sheet-loading-color: var(--sar-fourth-color);
 
   --sar-action-sheet-cancel-min-height: 96rpx;
   --sar-action-sheet-cancel-padding: 16rpx 32rpx;

package/components/calendar/calendar.vue

@@ -113,6 +113,8 @@ import {
   parseDate,
   formatDate
 } from "../../utils";
+import { useTranslate } from "../locale";
+import { useScrollSide } from "../../use";
 import {
   defaultCalendarProps,
   getMaxDate,
@@ -123,11 +125,9 @@ import {
 import { useInPopup } from "../popup/common";
 import SarButton from "../button/button.vue";
 import SarIcon from "../icon/icon.vue";
-import { useTranslate } from "../locale";
 import SarCalendarMonth from "../calendar-month/calendar-month.vue";
 import SarPopout from "../popout/popout.vue";
 import SarDatetimePicker from "../datetime-picker/datetime-picker.vue";
-import { useScrollSide } from "../../use";
 export default  _defineComponent({
   components: {
     SarButton,

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

@@ -10,10 +10,11 @@ declare const _default: import("vue").DefineComponent<CalendarInputProps, {}, {}
     "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
 }>, {
     type: CalendarType;
+    valueOnClear: () => any;
+    showConfirm: boolean;
     validateEvent: boolean;
+    outletFormat: string;
     weekStartsOn: number;
-    showConfirm: boolean;
     maxDays: number;
-    outletFormat: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

package/components/calendar-input/calendar-input.vue

@@ -60,6 +60,7 @@ export default  _defineComponent({
   __name: "calendar-input",
   props:  _mergeDefaults({
     outletFormat: { type: String, required: false },
+    valueOnClear: { type: Function, required: false },
     visible: { type: Boolean, required: false },
     title: { type: String, required: false },
     showConfirm: { type: Boolean, required: false },

package/components/calendar-input/common.d.ts

@@ -2,9 +2,11 @@ import { type CalendarPopoutEmits, type CalendarPopoutProps } from '../calendar-
 import { type PopoutInputProps } from '../popout-input/common';
 export interface CalendarInputProps extends CalendarPopoutProps, Omit<PopoutInputProps, 'modelValue' | 'loading'> {
     outletFormat?: string;
+    valueOnClear?: () => any;
 }
 export declare const defaultCalendarInputProps: () => {
     outletFormat: string;
+    valueOnClear: CalendarInputProps["valueOnClear"];
     showConfirm: boolean;
     validateEvent: boolean;
     type: import("../calendar").CalendarProps["type"];

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

@@ -1,5 +1,9 @@
 import { type CalendarPopoutProps } from './common';
-declare const _default: import("vue").DefineComponent<CalendarPopoutProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+declare function __VLS_template(): {
+    "title-prepend"?(_: {}): any;
+    title?(_: {}): any;
+};
+declare const __VLS_component: import("vue").DefineComponent<CalendarPopoutProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     "update:model-value": (value: string | string[] | Date | Date[] | undefined) => any;
     change: (value: string | string[] | Date | Date[] | undefined) => any;
     "update:visible": (visible: boolean) => any;
@@ -9,9 +13,15 @@ declare const _default: import("vue").DefineComponent<CalendarPopoutProps, {}, {
     "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
 }>, {
     type: import("../calendar/common.js").CalendarType;
+    showConfirm: boolean;
     validateEvent: boolean;
     weekStartsOn: number;
-    showConfirm: boolean;
     maxDays: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/calendar-popout/calendar-popout.vue

@@ -1,13 +1,19 @@
 <template>
   <sar-popout
     v-model:visible="innerVisible"
-    :title="title"
+    :title="$slots.title ? '' : title"
     :show-confirm="showConfirm"
     :confirm-disabled="confirmDisabled"
     :root-class="popoutClass"
     :root-style="popoutStyle"
     @confirm="onConfirm"
   >
+    <template #title-prepend>
+      <slot name="title-prepend"></slot>
+    </template>
+    <template #title>
+      <slot name="title"></slot>
+    </template>
     <template #visible="{ already }">
       <sar-calendar
         v-if="already"

package/components/calendar-popout/common.d.ts

@@ -17,6 +17,8 @@ export declare const defaultCalendarPopoutProps: () => {
 };
 export interface CalendarPopoutSlots {
     default?(props: Record<string, never>): any;
+    title?(props: Record<string, never>): any;
+    'title-prepend'?(props: Record<string, never>): any;
 }
 export interface CalendarPopoutEmits {
     (e: 'update:visible', visible: boolean): void;

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

@@ -12,8 +12,9 @@ declare const __VLS_component: import("vue").DefineComponent<CascaderInputProps,
     onSelect?: ((option: CascaderOption, tabIndex: number) => any) | undefined;
     "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
 }>, {
-    validateEvent: boolean;
+    valueOnClear: () => any;
     showConfirm: boolean;
+    validateEvent: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;

package/components/cascader-input/cascader-input.vue

@@ -43,7 +43,7 @@ import {
   defaultFieldKeys,
   getSelectedOptionsByValue
 } from "../cascader/common";
-import { isNullish } from "../../utils";
+import { isEmptyBinding } from "../../utils";
 import { usePopoutInput } from "../../use";
 import {
   defaultCascaderInputProps
@@ -61,6 +61,7 @@ export default  _defineComponent({
   },
   __name: "cascader-input",
   props:  _mergeDefaults({
+    valueOnClear: { type: Function, required: false },
     visible: { type: Boolean, required: false },
     title: { type: String, required: false },
     showConfirm: { type: Boolean, required: false },
@@ -88,9 +89,9 @@ export default  _defineComponent({
     const props = __props;
     const emit = __emit;
     const { innerVisible, innerValue, inputValue, show, onChange, onClear } = usePopoutInput(props, emit, {
-      onClear() {
-        emit("update:model-value", void 0, []);
-        emit("change", void 0, []);
+      onClear(value) {
+        emit("update:model-value", value, []);
+        emit("change", value, []);
       }
     });
     const fieldkeys = computed(() => {
@@ -103,13 +104,13 @@ export default  _defineComponent({
     function getOutletText(options, value, fieldKeys) {
       const selectedOptions = getSelectedOptionsByValue(options, value, fieldKeys);
       if (!selectedOptions) {
-        return isNullish(value) ? "" : String(value);
+        return isEmptyBinding(value) ? "" : String(value);
       }
       const labels = selectedOptions.map((option) => option[fieldKeys.label]);
       return labels.join("/");
     }
     function getInputValue() {
-      if (isNullish(innerValue.value) || !props.options) {
+      if (isEmptyBinding(innerValue.value) || !props.options) {
         return "";
       }
       return getOutletText(props.options, innerValue.value, fieldkeys.value);

package/components/cascader-input/common.d.ts

@@ -1,8 +1,10 @@
 import { type PopoutInputProps } from '../popout-input/common';
 import { type CascaderPopoutProps, type CascaderPopoutEmits, type CascaderPopoutSlots } from '../cascader-popout/common';
 export interface CascaderInputProps extends CascaderPopoutProps, Omit<PopoutInputProps, 'modelValue'> {
+    valueOnClear?: () => any;
 }
 export declare const defaultCascaderInputProps: () => {
+    valueOnClear: CascaderInputProps["valueOnClear"];
     showConfirm: boolean;
     validateEvent: boolean;
 };

package/components/cascader-input/common.js

@@ -1,4 +1,5 @@
 import { defaultConfig } from '../config';
 export const defaultCascaderInputProps = () => ({
     ...defaultConfig.cascaderPopout,
+    ...defaultConfig.cascaderInput,
 });

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

@@ -11,8 +11,8 @@ declare const __VLS_component: import("vue").DefineComponent<CascaderPopoutProps
     onSelect?: ((option: import("../cascader/common.js").CascaderOption, tabIndex: number) => any) | undefined;
     "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
 }>, {
-    validateEvent: boolean;
     showConfirm: boolean;
+    validateEvent: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;

package/components/cascader-popout/cascader-popout.vue

@@ -34,7 +34,7 @@ import SarCascader from "../cascader/cascader.vue";
 import {
   defaultCascaderPopoutProps
 } from "./common";
-import { isNullish } from "../../utils";
+import { isEmptyBinding } from "../../utils";
 import { useFormPopout } from "../../use";
 export default  _defineComponent({
   components: {
@@ -74,7 +74,7 @@ export default  _defineComponent({
       emit,
       {
         onChange() {
-          if (!props.showConfirm && !isNullish(popoutValue.value)) {
+          if (!props.showConfirm && !isEmptyBinding(popoutValue.value)) {
             onConfirm();
             innerVisible.value = false;
           }

package/components/check-icon/variables.scss

@@ -3,7 +3,7 @@ page,
 .sar-portal {
   --sar-check-icon-size: 1em;
   --sar-check-icon-square-border-radius: 0.15em;
-  --sar-check-icon-border-color: var(--sar-quaternary-color);
+  --sar-check-icon-border-color: var(--sar-fourth-color);
 
   --sar-check-icon-disabled-color: var(--sar-disabled-color);
   --sar-check-icon-disabled-bg: var(--sar-disabled-shallow-bg);

package/components/checkbox/variables.scss

@@ -5,7 +5,7 @@ page,
   --sar-checkbox-group-row-gap: 16rpx;
 
   --sar-checkbox-icon-font-size: 40rpx;
-  --sar-checkbox-icon-color: var(--sar-quaternary-color);
+  --sar-checkbox-icon-color: var(--sar-fourth-color);
   --sar-checkbox-icon-checked-color: var(--sar-primary);
   --sar-checkbox-icon-disabled-color: var(--sar-disabled-color);
   --sar-checkbox-icon-transition-duration: var(--sar-duration);

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

@@ -9,6 +9,7 @@ declare const _default: import("vue").DefineComponent<CheckboxInputProps, {}, {}
     "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
 }>, {
     options: import("../checkbox/common").CheckboxGroupOption[];
+    valueOnClear: () => any;
     validateEvent: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 export default _default;

package/components/checkbox-input/checkbox-input.vue

@@ -40,7 +40,7 @@ import {
 import {
   defaultCheckboxInputProps
 } from "./common";
-import { getMayPrimitiveOption, isNullish } from "../../utils";
+import { getMayPrimitiveOption, isEmptyBinding } from "../../utils";
 import { usePopoutInput } from "../../use";
 export default  _defineComponent({
   components: {
@@ -55,6 +55,7 @@ export default  _defineComponent({
   },
   __name: "checkbox-input",
   props:  _mergeDefaults({
+    valueOnClear: { type: Function, required: false },
     visible: { type: Boolean, required: false },
     title: { type: String, required: false },
     popoutClass: { type: String, required: false },
@@ -91,7 +92,7 @@ export default  _defineComponent({
       ).map((option) => getMayPrimitiveOption(option, optionKeys.label)).join(", ");
     }
     function getInputValue() {
-      if (isNullish(innerValue.value) || innerValue.value.length === 0) {
+      if (isEmptyBinding(innerValue.value) || Array.isArray(innerValue.value) && innerValue.value.length === 0) {
         return "";
       }
       return getOutletText(props.options, fieldKeys.value, innerValue.value);

package/components/checkbox-input/common.d.ts

@@ -3,8 +3,10 @@ import { type PopoutInputProps } from '../popout-input/common';
 import { type CheckboxPopoutEmits, type CheckboxPopoutProps } from '../checkbox-popout/common';
 export type CheckboxInputOption = CheckboxGroupOption;
 export interface CheckboxInputProps extends CheckboxPopoutProps, Omit<PopoutInputProps, 'modelValue'> {
+    valueOnClear?: () => any;
 }
 export declare const defaultCheckboxInputProps: () => {
+    valueOnClear: CheckboxInputProps["valueOnClear"];
     options: () => never[];
     validateEvent: boolean;
 };

package/components/checkbox-input/common.js

@@ -1,2 +1,6 @@
 import { defaultCheckboxPopoutProps, } from '../checkbox-popout/common';
-export const defaultCheckboxInputProps = defaultCheckboxPopoutProps;
+import { defaultConfig } from '../config';
+export const defaultCheckboxInputProps = () => ({
+    ...defaultCheckboxPopoutProps(),
+    ...defaultConfig.checkboxInput,
+});

package/components/config/index.d.ts

@@ -1,8 +1,13 @@
 import { type AvatarProps } from '../avatar';
 import { type AlertProps } from '../alert';
 import { type ButtonProps } from '../button';
+import { type CalendarInputProps } from '../calendar-input';
 import { type CalendarProps } from '../calendar';
+import { type CascaderInputProps } from '../cascader-input';
 import { type CheckboxGroupProps } from '../checkbox';
+import { type CheckboxInputProps } from '../checkbox-input';
+import { type DatetimePickerInputProps } from '../datetime-picker-input';
+import { type DatetimeRangePickerInputProps } from '../datetime-range-picker-input';
 import { type DialogProps } from '../dialog';
 import { type DropdownProps } from '../dropdown';
 import { type FloatingBubbleProps } from '../floating-bubble';
@@ -17,12 +22,14 @@ import { type NoticeBarProps } from '../notice-bar';
 import { type NotifyProps } from '../notify';
 import { type PaginationProps } from '../pagination';
 import { type PasswordInputProps } from '../password-input';
+import { type PickerInputProps } from '../picker-input';
 import { type PopoutProps } from '../popout';
 import { type PopoverProps } from '../popover';
 import { type PopupProps } from '../popup';
 import { type QrcodeProps } from '../qrcode';
 import { type RadioGroupProps } from '../radio';
 import { type RadioInputProps } from '../radio-input';
+import { type RadioPopoutProps } from '../radio-popout';
 import { type ResultProps } from '../result';
 import { type SearchProps } from '../search';
 import { type SpaceProps } from '../space';
@@ -40,6 +47,23 @@ type DeepPartial<T> = {
 };
 export declare const defaultConfig: {
     initialZIndex: number;
+    /**
+     * 设置点击清除按钮后的值
+     *
+     * - 类型：() => any
+     * - 默认值：() = undefined
+     *
+     * 支持以下组件：
+     *
+     * - CalendarInput
+     * - DatetimePickerInput
+     * - DatetimeRangePickerInput
+     * - CascaderInput
+     * - CheckboxInput
+     * - PickerInput
+     * - RadioInput
+     */
+    valueOnClear: (() => any) | undefined;
     actionSheet: {
         overlayClosable: boolean;
         duration: number;
@@ -74,6 +98,7 @@ export declare const defaultConfig: {
     };
     calendarInput: {
         outletFormat: string;
+        valueOnClear: CalendarInputProps["valueOnClear"];
     };
     calendarPopout: {
         showConfirm: boolean;
@@ -83,6 +108,9 @@ export declare const defaultConfig: {
         showConfirm: boolean;
         validateEvent: boolean;
     };
+    cascaderInput: {
+        valueOnClear: CascaderInputProps["valueOnClear"];
+    };
     checkbox: {
         validateEvent: boolean;
     };
@@ -90,6 +118,9 @@ export declare const defaultConfig: {
         direction: CheckboxGroupProps["direction"];
         validateEvent: boolean;
     };
+    checkboxInput: {
+        valueOnClear: CheckboxInputProps["valueOnClear"];
+    };
     checkboxPopout: {
         validateEvent: boolean;
     };
@@ -117,12 +148,18 @@ export declare const defaultConfig: {
         type: string;
         calendar: "solar";
     };
+    datetimePickerInput: {
+        valueOnClear: DatetimePickerInputProps["valueOnClear"];
+    };
     datetimePickerPopout: {
         validateEvent: boolean;
     };
     datetimeRangePicker: {
         type: string;
     };
+    datetimeRangePickerInput: {
+        valueOnClear: DatetimeRangePickerInputProps["valueOnClear"];
+    };
     datetimeRangePickerPopout: {
         validateEvent: boolean;
     };
@@ -254,6 +291,9 @@ export declare const defaultConfig: {
     picker: {
         immediateChange: boolean;
     };
+    pickerInput: {
+        valueOnClear: PickerInputProps["valueOnClear"];
+    };
     pickerPopout: {
         validateEvent: boolean;
     };
@@ -307,9 +347,12 @@ export declare const defaultConfig: {
         direction: RadioGroupProps["direction"];
         validateEvent: boolean;
     };
+    radioInput: {
+        valueOnClear: RadioInputProps["valueOnClear"];
+    };
     radioPopout: {
         validateEvent: boolean;
-        type: RadioInputProps["type"];
+        type: RadioPopoutProps["type"];
     };
     rate: {
         count: number;

package/components/config/index.js

@@ -2,6 +2,23 @@
 export const defaultConfig = {
     // 全局初始 zIndex
     initialZIndex: 1000,
+    /**
+     * 设置点击清除按钮后的值
+     *
+     * - 类型：() => any
+     * - 默认值：() = undefined
+     *
+     * 支持以下组件：
+     *
+     * - CalendarInput
+     * - DatetimePickerInput
+     * - DatetimeRangePickerInput
+     * - CascaderInput
+     * - CheckboxInput
+     * - PickerInput
+     * - RadioInput
+     */
+    valueOnClear: undefined,
     actionSheet: {
         overlayClosable: true,
         duration: 250,
@@ -36,6 +53,7 @@ export const defaultConfig = {
     },
     calendarInput: {
         outletFormat: 'YYYY-MM-DD',
+        valueOnClear: undefined,
     },
     calendarPopout: {
         showConfirm: true,
@@ -45,6 +63,9 @@ export const defaultConfig = {
         showConfirm: true,
         validateEvent: true,
     },
+    cascaderInput: {
+        valueOnClear: undefined,
+    },
     checkbox: {
         validateEvent: true,
     },
@@ -52,6 +73,9 @@ export const defaultConfig = {
         direction: 'vertical',
         validateEvent: true,
     },
+    checkboxInput: {
+        valueOnClear: undefined,
+    },
     checkboxPopout: {
         validateEvent: true,
     },
@@ -79,12 +103,18 @@ export const defaultConfig = {
         type: 'yMd',
         calendar: 'solar',
     },
+    datetimePickerInput: {
+        valueOnClear: undefined,
+    },
     datetimePickerPopout: {
         validateEvent: true,
     },
     datetimeRangePicker: {
         type: 'yMd',
     },
+    datetimeRangePickerInput: {
+        valueOnClear: undefined,
+    },
     datetimeRangePickerPopout: {
         validateEvent: true,
     },
@@ -216,6 +246,9 @@ export const defaultConfig = {
     picker: {
         immediateChange: false,
     },
+    pickerInput: {
+        valueOnClear: undefined,
+    },
     pickerPopout: {
         validateEvent: true,
     },
@@ -269,6 +302,9 @@ export const defaultConfig = {
         direction: 'vertical',
         validateEvent: true,
     },
+    radioInput: {
+        valueOnClear: undefined,
+    },
     radioPopout: {
         validateEvent: true,
         type: 'circle',

package/components/datetime-picker-input/common.d.ts

@@ -2,8 +2,10 @@ import { type PopoutInputProps } from '../popout-input/common';
 import { type DatetimePickerPopoutProps, type DatetimePickerPopoutEmits, type DatetimePickerPopoutSlots } from '../datetime-picker-popout/common';
 export interface DatetimePickerInputProps extends DatetimePickerPopoutProps, Omit<PopoutInputProps, 'modelValue' | 'loading'> {
     outletFormat?: string;
+    valueOnClear?: () => any;
 }
 export declare const defaultDatetimePickerInputProps: () => {
+    valueOnClear: DatetimePickerInputProps["valueOnClear"];
     validateEvent: boolean;
     type: string;
     calendar: "solar";

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

@@ -2,6 +2,7 @@ import { defaultConfig } from '../config';
 export const defaultDatetimePickerInputProps = () => ({
     ...defaultConfig.datetimePicker,
     ...defaultConfig.datetimePickerPopout,
+    ...defaultConfig.datetimePickerInput,
 });
 export const mapTypeFormat = {
     y: 'YYYY',

package/components/datetime-picker-input/datetime-picker-input.d.ts

@@ -10,8 +10,9 @@ declare const __VLS_component: import("vue").DefineComponent<DatetimePickerInput
     "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
 }>, {
     type: string;
-    validateEvent: boolean;
+    valueOnClear: () => any;
     calendar: "solar" | "lunar";
+    validateEvent: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;

package/components/datetime-picker-input/datetime-picker-input.vue

@@ -55,6 +55,7 @@ export default  _defineComponent({
   __name: "datetime-picker-input",
   props:  _mergeDefaults({
     outletFormat: { type: String, required: false },
+    valueOnClear: { type: Function, required: false },
     visible: { type: Boolean, required: false },
     title: { type: String, required: false },
     validateEvent: { type: Boolean, required: false },

package/components/datetime-picker-popout/datetime-picker-popout.d.ts

@@ -10,8 +10,8 @@ declare const __VLS_component: import("vue").DefineComponent<DatetimePickerPopou
     "onUpdate:visible"?: ((visible: boolean) => any) | undefined;
 }>, {
     type: string;
-    validateEvent: boolean;
     calendar: "solar" | "lunar";
+    validateEvent: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;

package/components/datetime-picker-popout/datetime-picker-popout.vue

@@ -33,7 +33,7 @@ import SarDatetimePicker from "../datetime-picker/datetime-picker.vue";
 import {
   defaultDatetimePickerPopoutProps
 } from "./common";
-import { formatDate, isNullish, toDate } from "../../utils";
+import { formatDate, isEmptyBinding, toDate } from "../../utils";
 import {
   getInitialValue,
   getMaxDate,
@@ -90,7 +90,7 @@ export default  _defineComponent({
       }
     });
     const onEnter = () => {
-      if (!isNullish(innerValue.value) && popoutValue.value !== innerValue.value) {
+      if (!isEmptyBinding(innerValue.value) && popoutValue.value !== innerValue.value) {
         popoutValue.value = innerValue.value;
       }
     };

package/components/datetime-range-picker-input/common.d.ts

@@ -2,8 +2,10 @@ import { type DatetimeRangePickerPopoutProps, type DatetimeRangePickerPopoutSlot
 import { type PopoutInputProps } from '../popout-input/common';
 export interface DatetimeRangePickerInputProps extends DatetimeRangePickerPopoutProps, Omit<PopoutInputProps, 'modelValue' | 'loading'> {
     outletFormat?: string;
+    valueOnClear?: () => any;
 }
 export declare const defaultDatetimeRangePickerInputProps: () => {
+    valueOnClear: DatetimeRangePickerInputProps["valueOnClear"];
     validateEvent: boolean;
     type: string;
 };

package/components/datetime-range-picker-input/common.js

@@ -2,4 +2,5 @@ import { defaultConfig } from '../config';
 export const defaultDatetimeRangePickerInputProps = () => ({
     ...defaultConfig.datetimeRangePicker,
     ...defaultConfig.datetimeRangePickerPopout,
+    ...defaultConfig.datetimeRangePickerInput,
 });