@sdata/web-vue 1.13.0 → 1.14.0

package/es/_hooks/use-config-provider-prop.d.ts

@@ -0,0 +1,10 @@
+import { Ref } from 'vue';
+import { ConfigProvider } from '../config-provider/context';
+interface UseConfigProviderPropOptions<T> {
+    propNames: readonly string[];
+    getGlobalValue: (configProviderCtx: ConfigProvider | undefined) => T | undefined;
+}
+export declare const useConfigProviderProp: <T>(propValue: Ref<T | undefined>, options: UseConfigProviderPropOptions<T>) => {
+    mergedValue: import("vue").ComputedRef<T | undefined>;
+};
+export {};

package/es/_hooks/use-config-provider-prop.js

@@ -0,0 +1,19 @@
+import { configProviderInjectionKey } from "../config-provider/context.js";
+import { computed, getCurrentInstance, inject } from "vue";
+//#region components/_hooks/use-config-provider-prop.ts
+var useConfigProviderProp = (propValue, options) => {
+	const instance = getCurrentInstance();
+	const configProviderCtx = inject(configProviderInjectionKey, void 0);
+	const hasLocalProp = computed(() => {
+		const rawProps = instance === null || instance === void 0 ? void 0 : instance.vnode.props;
+		if (!rawProps) return false;
+		return options.propNames.some((propName) => Object.hasOwn(rawProps, propName));
+	});
+	return { mergedValue: computed(() => {
+		var _options$getGlobalVal;
+		if (hasLocalProp.value) return propValue.value;
+		return (_options$getGlobalVal = options.getGlobalValue(configProviderCtx)) !== null && _options$getGlobalVal !== void 0 ? _options$getGlobalVal : propValue.value;
+	}) };
+};
+//#endregion
+export { useConfigProviderProp };

package/es/config-provider/config-provider.vue.d.ts

@@ -2,6 +2,7 @@ import type { PropType } from 'vue';
 import { VirtualListProps } from '../_components/virtual-list/interface';
 import { Size } from '../_utils/constant';
 import { SDLang } from '../locale/interface';
+import { ConfigProviderDatePicker, ConfigProviderDrawer, ConfigProviderModal } from './context';
 import { SDThemeConfig, SDThemeMode } from './theme';
 declare const _default: typeof __VLS_export;
 export default _default;
@@ -47,6 +48,15 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
         type: BooleanConstructor;
         default: boolean;
     };
+    datePicker: {
+        type: PropType<ConfigProviderDatePicker>;
+    };
+    modal: {
+        type: PropType<ConfigProviderModal>;
+    };
+    drawer: {
+        type: PropType<ConfigProviderDrawer>;
+    };
     theme: {
         type: PropType<SDThemeConfig>;
     };
@@ -95,6 +105,15 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
         type: BooleanConstructor;
         default: boolean;
     };
+    datePicker: {
+        type: PropType<ConfigProviderDatePicker>;
+    };
+    modal: {
+        type: PropType<ConfigProviderModal>;
+    };
+    drawer: {
+        type: PropType<ConfigProviderDrawer>;
+    };
     theme: {
         type: PropType<SDThemeConfig>;
     };

package/es/config-provider/config-provider.vue_vue_type_script_lang.js

@@ -91,6 +91,21 @@ var config_provider_vue_vue_type_script_lang_default = defineComponent({
 			default: false
 		},
 		/**
+		* @zh DatePicker 组件默认配置
+		* @en Default config for DatePicker
+		*/
+		datePicker: { type: Object },
+		/**
+		* @zh Modal 组件默认配置
+		* @en Default config for Modal
+		*/
+		modal: { type: Object },
+		/**
+		* @zh Drawer 组件默认配置
+		* @en Default config for Drawer
+		*/
+		drawer: { type: Object },
+		/**
 		* @zh 主题配置对象
 		* @en Runtime theme configuration object
 		*/
@@ -115,7 +130,7 @@ var config_provider_vue_vue_type_script_lang_default = defineComponent({
 	* @version 2.28.0
 	*/
 	setup(props, { slots }) {
-		const { prefixCls, locale, size, allowClear, allowSearch, virtualListProps, updateAtScroll, scrollToClose, exchangeTime, rtl } = toRefs(props);
+		const { prefixCls, locale, size, allowClear, allowSearch, virtualListProps, updateAtScroll, scrollToClose, exchangeTime, rtl, datePicker, modal, drawer } = toRefs(props);
 		const config = reactive({
 			slots,
 			prefixCls,
@@ -128,6 +143,9 @@ var config_provider_vue_vue_type_script_lang_default = defineComponent({
 			scrollToClose,
 			exchangeTime,
 			rtl,
+			datePicker,
+			modal,
+			drawer,
 			theme: normalizeTheme(props.theme)
 		});
 		watch(() => props.theme, (themeConfig) => {

package/es/config-provider/context.d.ts

@@ -1,8 +1,53 @@
-import { InjectionKey, Ref, Slots } from 'vue';
+import { CSSProperties, InjectionKey, Ref, Slots } from 'vue';
 import { VirtualListProps } from '../_components/virtual-list/interface';
 import { Size } from '../_utils/constant';
+import { ButtonProps } from '../button';
+import { ShortcutType, WeekStart } from '../date-picker/interface';
 import { SDLang } from '../locale/interface';
 import { SDThemeNormalized } from './theme';
+export interface ConfigProviderModal {
+    mask?: boolean;
+    maskClosable?: boolean;
+    maskStyle?: CSSProperties;
+    alignCenter?: boolean;
+    escToClose?: boolean;
+    draggable?: boolean;
+    closable?: boolean;
+    titleAlign?: 'start' | 'center';
+    top?: number | string;
+    footer?: boolean;
+    hideCancel?: boolean;
+    okText?: string;
+    cancelText?: string;
+    okButtonProps?: ButtonProps;
+    cancelButtonProps?: ButtonProps;
+    width?: number | string;
+}
+export interface ConfigProviderDrawer {
+    placement?: 'top' | 'right' | 'bottom' | 'left';
+    mask?: boolean;
+    maskClosable?: boolean;
+    escToClose?: boolean;
+    closable?: boolean;
+    header?: boolean;
+    footer?: boolean;
+    hideCancel?: boolean;
+    okText?: string;
+    cancelText?: string;
+    okButtonProps?: ButtonProps;
+    cancelButtonProps?: ButtonProps;
+    width?: number | string;
+    height?: number | string;
+}
+export interface ConfigProviderDatePicker {
+    shortcuts?: ShortcutType[];
+    shortcutsPosition?: 'left' | 'bottom' | 'right';
+    previewShortcut?: boolean;
+    showConfirmBtn?: boolean;
+    showNowBtn?: boolean;
+    dayStartOfWeek?: WeekStart;
+    abbreviation?: boolean;
+}
 export interface ConfigProvider {
     slots: Slots;
     prefixCls?: string;
@@ -15,6 +60,9 @@ export interface ConfigProvider {
     scrollToClose?: boolean;
     exchangeTime?: boolean;
     rtl?: boolean;
+    datePicker?: ConfigProviderDatePicker;
+    modal?: ConfigProviderModal;
+    drawer?: ConfigProviderDrawer;
     theme?: SDThemeNormalized;
 }
 export declare const configProviderInjectionKey: InjectionKey<ConfigProvider>;

package/es/config-provider/index.d.ts

@@ -44,6 +44,15 @@ declare const ConfigProvider: {
             type: BooleanConstructor;
             default: boolean;
         };
+        datePicker: {
+            type: import("vue").PropType<import("./context").ConfigProviderDatePicker>;
+        };
+        modal: {
+            type: import("vue").PropType<import("./context").ConfigProviderModal>;
+        };
+        drawer: {
+            type: import("vue").PropType<import("./context").ConfigProviderDrawer>;
+        };
         theme: {
             type: import("vue").PropType<import("./theme").SDThemeConfig>;
         };
@@ -155,6 +164,15 @@ declare const ConfigProvider: {
             type: BooleanConstructor;
             default: boolean;
         };
+        datePicker: {
+            type: import("vue").PropType<import("./context").ConfigProviderDatePicker>;
+        };
+        modal: {
+            type: import("vue").PropType<import("./context").ConfigProviderModal>;
+        };
+        drawer: {
+            type: import("vue").PropType<import("./context").ConfigProviderDrawer>;
+        };
         theme: {
             type: import("vue").PropType<import("./theme").SDThemeConfig>;
         };
@@ -216,6 +234,15 @@ declare const ConfigProvider: {
         type: BooleanConstructor;
         default: boolean;
     };
+    datePicker: {
+        type: import("vue").PropType<import("./context").ConfigProviderDatePicker>;
+    };
+    modal: {
+        type: import("vue").PropType<import("./context").ConfigProviderModal>;
+    };
+    drawer: {
+        type: import("vue").PropType<import("./context").ConfigProviderDrawer>;
+    };
     theme: {
         type: import("vue").PropType<import("./theme").SDThemeConfig>;
     };

package/es/date-picker/index.d.ts

@@ -274,16 +274,16 @@ declare const DatePicker: {
             default: string;
         };
         modelValue: {
-            type: import("vue").PropType<(Date | string | number)[]>;
+            type: import("vue").PropType<CalendarValue[]>;
         };
         defaultValue: {
-            type: import("vue").PropType<(Date | string | number)[]>;
+            type: import("vue").PropType<CalendarValue[]>;
         };
         pickerValue: {
-            type: import("vue").PropType<(Date | string | number)[]>;
+            type: import("vue").PropType<CalendarValue[]>;
         };
         defaultPickerValue: {
-            type: import("vue").PropType<(Date | string | number)[]>;
+            type: import("vue").PropType<CalendarValue[]>;
         };
         disabled: {
             type: import("vue").PropType<boolean | boolean[]>;
@@ -402,10 +402,14 @@ declare const DatePicker: {
         onInputChange: (e: any) => void;
         onInputPressEnter: () => void;
         rangePanelProps: import("vue").ComputedRef<{
+            shortcuts: import("./interface").ShortcutType[] | undefined;
+            shortcutsPosition: "bottom" | "left" | "right" | undefined;
+            dayStartOfWeek: 0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined;
+            abbreviation: boolean | undefined;
             prefixCls: string;
             format: string;
             value: (import("dayjs").Dayjs | undefined)[];
-            showConfirmBtn: boolean;
+            showConfirmBtn: boolean | undefined;
             confirmBtnDisabled: boolean | undefined;
             timePickerValue: import("dayjs").Dayjs[];
             timePickerProps: {
@@ -564,14 +568,10 @@ declare const DatePicker: {
             onStartHeaderSelect: (date: import("dayjs").Dayjs) => void;
             onEndHeaderSelect: (date: import("dayjs").Dayjs) => void;
             mode: "month" | "year" | "date" | "week" | "quarter";
-            dayStartOfWeek: import("./interface").WeekStart;
             hideTrigger: boolean;
             showTime: boolean;
             disabledDate: ((current: Date, type: "start" | "end") => boolean) | undefined;
             disabledTime: ((current: Date, type: "start" | "end") => import("./interface").DisabledTimeProps) | undefined;
-            abbreviation: boolean;
-            shortcuts: import("./interface").ShortcutType[];
-            shortcutsPosition: "bottom" | "left" | "right";
         }>;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
         change: (value: (CalendarValue | undefined)[] | undefined, date: (Date | undefined)[] | undefined, dateString: (string | undefined)[] | undefined) => true;
@@ -590,16 +590,16 @@ declare const DatePicker: {
             default: string;
         };
         modelValue: {
-            type: import("vue").PropType<(Date | string | number)[]>;
+            type: import("vue").PropType<CalendarValue[]>;
         };
         defaultValue: {
-            type: import("vue").PropType<(Date | string | number)[]>;
+            type: import("vue").PropType<CalendarValue[]>;
         };
         pickerValue: {
-            type: import("vue").PropType<(Date | string | number)[]>;
+            type: import("vue").PropType<CalendarValue[]>;
         };
         defaultPickerValue: {
-            type: import("vue").PropType<(Date | string | number)[]>;
+            type: import("vue").PropType<CalendarValue[]>;
         };
         disabled: {
             type: import("vue").PropType<boolean | boolean[]>;

package/es/date-picker/picker.vue.d.ts

@@ -124,12 +124,16 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
     prefixCls: string;
     refInput: import("vue").Ref<any, any>;
     panelProps: import("vue").ComputedRef<{
-        showNowBtn: boolean;
+        shortcuts: ShortcutType[] | undefined;
+        shortcutsPosition: "bottom" | "left" | "right" | undefined;
+        dayStartOfWeek: 0 | 1 | 2 | 3 | 4 | 5 | 6 | undefined;
+        abbreviation: boolean | undefined;
+        showNowBtn: boolean | undefined;
         prefixCls: string;
         format: string;
         value: Dayjs | undefined;
         visible: boolean;
-        showConfirmBtn: boolean;
+        showConfirmBtn: boolean | undefined;
         confirmBtnDisabled: boolean | undefined;
         timePickerProps: {
             visible: boolean;
@@ -182,14 +186,10 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
         onHeaderSelect: (date: Dayjs) => void;
         onMonthHeaderClick: () => void;
         mode: "month" | "year" | "date" | "week" | "quarter";
-        dayStartOfWeek: WeekStart;
         hideTrigger: boolean;
         showTime: boolean;
         disabledDate: ((current?: Date) => boolean) | undefined;
         disabledTime: ((current: Date) => DisabledTimeProps) | undefined;
-        abbreviation: boolean;
-        shortcuts: ShortcutType[];
-        shortcutsPosition: "bottom" | "left" | "right";
     }>;
     panelValue: import("vue").ComputedRef<Dayjs | undefined>;
     inputValue: import("vue").Ref<string | undefined, string | undefined>;
@@ -199,7 +199,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
     panelVisible: import("vue").ComputedRef<boolean>;
     mergedAllowClear: import("vue").ComputedRef<boolean | undefined>;
     inputEditable: import("vue").ComputedRef<boolean>;
-    needConfirm: import("vue").ComputedRef<boolean>;
+    needConfirm: import("vue").ComputedRef<boolean | undefined>;
     mergedDisabled: import("vue").ComputedRef<boolean>;
     onPanelVisibleChange: (visible: boolean) => void;
     onInputClear: (e: Event) => void;

package/es/date-picker/picker.vue_vue_type_script_lang.js

@@ -11,6 +11,7 @@ import { useI18n } from "../locale/index.js";
 import Trigger from "../trigger/index.js";
 import { dayjs, getDateValue, getNow, initializeDateLocale, isValueChange } from "../_utils/date.js";
 import input_default from "../_components/picker/input.js";
+import { useConfigProviderProp } from "../_hooks/use-config-provider-prop.js";
 import IconCalendar from "../icon/icon-calendar/index.js";
 import { getFormattedValue, isValidInputValue } from "../time-picker/utils/index.js";
 import useFormat from "./hooks/use-format.js";
@@ -329,10 +330,60 @@ var picker_vue_vue_type_script_lang_default = defineComponent({
 	* @slot icon-next-double
 	*/
 	setup(props, { emit, slots }) {
-		const { mode, modelValue, defaultValue, format, valueFormat, placeholder, popupVisible, defaultPopupVisible, disabled, showTime, timePickerProps, disabledDate, disabledTime, readonly, allowClear, locale, pickerValue, defaultPickerValue, dayStartOfWeek, previewShortcut, showConfirmBtn } = toRefs(props);
+		const { mode, modelValue, defaultValue, format, valueFormat, placeholder, popupVisible, defaultPopupVisible, disabled, showTime, timePickerProps, disabledDate, disabledTime, readonly, allowClear, locale, pickerValue, defaultPickerValue, dayStartOfWeek, shortcuts, shortcutsPosition, previewShortcut, showConfirmBtn, showNowBtn, abbreviation } = toRefs(props);
+		const { mergedValue: mergedDayStartOfWeek } = useConfigProviderProp(dayStartOfWeek, {
+			propNames: ["dayStartOfWeek", "day-start-of-week"],
+			getGlobalValue: (configProviderCtx) => {
+				var _configProviderCtx$da;
+				return configProviderCtx === null || configProviderCtx === void 0 || (_configProviderCtx$da = configProviderCtx.datePicker) === null || _configProviderCtx$da === void 0 ? void 0 : _configProviderCtx$da.dayStartOfWeek;
+			}
+		});
+		const { mergedValue: mergedShortcuts } = useConfigProviderProp(shortcuts, {
+			propNames: ["shortcuts"],
+			getGlobalValue: (configProviderCtx) => {
+				var _configProviderCtx$da2;
+				return configProviderCtx === null || configProviderCtx === void 0 || (_configProviderCtx$da2 = configProviderCtx.datePicker) === null || _configProviderCtx$da2 === void 0 ? void 0 : _configProviderCtx$da2.shortcuts;
+			}
+		});
+		const { mergedValue: mergedShortcutsPosition } = useConfigProviderProp(shortcutsPosition, {
+			propNames: ["shortcutsPosition", "shortcuts-position"],
+			getGlobalValue: (configProviderCtx) => {
+				var _configProviderCtx$da3;
+				return configProviderCtx === null || configProviderCtx === void 0 || (_configProviderCtx$da3 = configProviderCtx.datePicker) === null || _configProviderCtx$da3 === void 0 ? void 0 : _configProviderCtx$da3.shortcutsPosition;
+			}
+		});
+		const { mergedValue: mergedPreviewShortcut } = useConfigProviderProp(previewShortcut, {
+			propNames: ["previewShortcut", "preview-shortcut"],
+			getGlobalValue: (configProviderCtx) => {
+				var _configProviderCtx$da4;
+				return configProviderCtx === null || configProviderCtx === void 0 || (_configProviderCtx$da4 = configProviderCtx.datePicker) === null || _configProviderCtx$da4 === void 0 ? void 0 : _configProviderCtx$da4.previewShortcut;
+			}
+		});
+		const { mergedValue: mergedShowConfirmBtn } = useConfigProviderProp(showConfirmBtn, {
+			propNames: ["showConfirmBtn", "show-confirm-btn"],
+			getGlobalValue: (configProviderCtx) => {
+				var _configProviderCtx$da5;
+				return configProviderCtx === null || configProviderCtx === void 0 || (_configProviderCtx$da5 = configProviderCtx.datePicker) === null || _configProviderCtx$da5 === void 0 ? void 0 : _configProviderCtx$da5.showConfirmBtn;
+			}
+		});
+		const { mergedValue: mergedShowNowBtn } = useConfigProviderProp(showNowBtn, {
+			propNames: ["showNowBtn", "show-now-btn"],
+			getGlobalValue: (configProviderCtx) => {
+				var _configProviderCtx$da6;
+				return configProviderCtx === null || configProviderCtx === void 0 || (_configProviderCtx$da6 = configProviderCtx.datePicker) === null || _configProviderCtx$da6 === void 0 ? void 0 : _configProviderCtx$da6.showNowBtn;
+			}
+		});
+		const { mergedValue: mergedAbbreviation } = useConfigProviderProp(abbreviation, {
+			propNames: ["abbreviation"],
+			getGlobalValue: (configProviderCtx) => {
+				var _configProviderCtx$da7;
+				return configProviderCtx === null || configProviderCtx === void 0 || (_configProviderCtx$da7 = configProviderCtx.datePicker) === null || _configProviderCtx$da7 === void 0 ? void 0 : _configProviderCtx$da7.abbreviation;
+			}
+		});
 		const { locale: globalLocal } = useI18n();
 		watchEffect(() => {
-			initializeDateLocale(globalLocal.value, dayStartOfWeek.value);
+			var _mergedDayStartOfWeek;
+			initializeDateLocale(globalLocal.value, (_mergedDayStartOfWeek = mergedDayStartOfWeek.value) !== null && _mergedDayStartOfWeek !== void 0 ? _mergedDayStartOfWeek : 0);
 		});
 		const { mergedDisabled, eventHandlers } = useFormItem({ disabled });
 		const { mergedAllowClear } = useAllowClear(allowClear);
@@ -363,7 +414,7 @@ var picker_vue_vue_type_script_lang_default = defineComponent({
 			disabledTime,
 			showTime
 		}));
-		const needConfirm = computed(() => showTime.value || showConfirmBtn.value);
+		const needConfirm = computed(() => showTime.value || mergedShowConfirmBtn.value);
 		const confirmBtnDisabled = computed(() => needConfirm.value && (!forSelectedValue.value || isDisabledDate(forSelectedValue.value)));
 		const isDateTime = computed(() => mode.value === "date" && showTime.value);
 		const { value: selectedValue, setValue: setSelectedValue } = usePickerState(reactive({
@@ -543,16 +594,16 @@ var picker_vue_vue_type_script_lang_default = defineComponent({
 			refInput,
 			panelProps: computed(() => _objectSpread2(_objectSpread2({}, pick(props, [
 				"mode",
-				"shortcuts",
-				"shortcutsPosition",
-				"dayStartOfWeek",
 				"disabledDate",
 				"disabledTime",
 				"showTime",
-				"hideTrigger",
-				"abbreviation"
+				"hideTrigger"
 			])), {}, {
-				showNowBtn: props.showNowBtn && mode.value === "date",
+				shortcuts: mergedShortcuts.value,
+				shortcutsPosition: mergedShortcutsPosition.value,
+				dayStartOfWeek: mergedDayStartOfWeek.value,
+				abbreviation: mergedAbbreviation.value,
+				showNowBtn: mergedShowNowBtn.value && mode.value === "date",
 				prefixCls,
 				format: parseValueFormat.value,
 				value: panelValue.value,
@@ -576,8 +627,8 @@ var picker_vue_vue_type_script_lang_default = defineComponent({
 				onTimePickerSelect,
 				onConfirm: onPanelConfirm,
 				onShortcutClick: onPanelShortcutClick,
-				onShortcutMouseEnter: previewShortcut.value ? onPanelShortcutMouseEnter : void 0,
-				onShortcutMouseLeave: previewShortcut.value ? onPanelShortcutMouseLeave : void 0,
+				onShortcutMouseEnter: mergedPreviewShortcut.value ? onPanelShortcutMouseEnter : void 0,
+				onShortcutMouseLeave: mergedPreviewShortcut.value ? onPanelShortcutMouseLeave : void 0,
 				onTodayBtnClick: onPanelSelect,
 				onHeaderLabelClick: onPanelHeaderLabelClick,
 				onHeaderSelect: onPanelHeaderSelect,