@sdata/web-vue 1.19.0 → 2.1.1

package/es/calendar/calendar.js

@@ -1,207 +0,0 @@
-import { getPrefixCls } from "../_utils/global-config.js";
-import { useI18n } from "../locale/index.js";
-import { getDayjsValue, getNow, methods, pickDataAttributes } from "../_utils/date.js";
-import header_default from "./header.js";
-import month_default, { getAllDaysByTime } from "./month.js";
-import year_default from "./year.js";
-import { computed, createVNode, defineComponent, mergeProps, ref, toRefs } from "vue";
-//#region components/calendar/calendar.tsx
-function getFormat(mode, panel) {
-	return mode === "month" || mode === "year" && !panel ? "YYYY-MM-DD" : "YYYY-MM";
-}
-var calendar_default = /* @__PURE__ */ defineComponent({
-	name: "Calendar",
-	props: {
-		/**
-		* @zh 绑定值
-		* @en Value
-		*/
-		modelValue: {
-			type: Date,
-			default: void 0
-		},
-		/**
-		* @zh 默认值（非受控状态）
-		* @en Default value (uncontrolled state)
-		*/
-		defaultValue: { type: Date },
-		/**
-		* @zh 模式
-		* @en Mode
-		*/
-		mode: { type: String },
-		/**
-		* @zh 默认模式
-		* @en Default Mode
-		*/
-		defaultMode: {
-			type: String,
-			default: "month"
-		},
-		/**
-		* @zh 显示的模式
-		* @en Displayed mode
-		*/
-		modes: {
-			type: Array,
-			default: () => ["month", "year"]
-		},
-		allowSelect: {
-			type: Boolean,
-			default: true
-		},
-		panel: {
-			type: Boolean,
-			default: false
-		},
-		panelWidth: { type: Number },
-		panelTodayBtn: {
-			type: Boolean,
-			default: false
-		},
-		dayStartOfWeek: {
-			type: Number,
-			default: 0
-		},
-		isWeek: {
-			type: Boolean,
-			default: false
-		}
-	},
-	emits: {
-		"update:modelValue": (_date) => true,
-		/**
-		* @zh 选择的日期改变时触发
-		* @en Emitted when the button is clicked
-		* @property {Date} date
-		*/
-		"change": (_date) => true,
-		/**
-		* @zh 日期面板改变时触发
-		* @en Emitted when the button is clicked
-		* @property {Date} date
-		*/
-		"panelChange": (_date) => true
-	},
-	/**
-	* @zh 自定义单元格内容
-	* @en Custom cell content
-	* @slot default
-	* @binding {number} year
-	* @binding {number} month
-	* @binding {number} date
-	* @version 2.53.0
-	*/
-	/**
-	* @zh 自定义头部内容
-	* @en Custom header content
-	* @slot header
-	* @binding {number} year
-	* @binding {number} month
-	* @version 2.53.0
-	*/
-	setup(props, { emit, slots }) {
-		const { dayStartOfWeek, isWeek } = toRefs(props);
-		const prefixCls = getPrefixCls("calendar");
-		const _mode = ref(props.defaultMode);
-		const { t } = useI18n();
-		const computedMode = computed(() => {
-			if (props.mode) return props.mode;
-			return _mode.value;
-		});
-		const format = getFormat(computedMode.value, props.panel);
-		const _value = ref(getDayjsValue(props.defaultValue || Date.now(), format));
-		const computedValue = computed(() => {
-			if (props.modelValue) return getDayjsValue(props.modelValue, format);
-			return _value.value;
-		});
-		const pageShowDate = ref(computedValue.value || getNow());
-		const pageData = computed(() => {
-			return getAllDaysByTime(pageShowDate.value, {
-				dayStartOfWeek: dayStartOfWeek.value,
-				isWeek: isWeek.value
-			});
-		});
-		function onChangePageDate(time) {
-			pageShowDate.value = time;
-			emit("panelChange", time.toDate());
-		}
-		function move(time) {
-			_value.value = time;
-			emit("change", time.toDate());
-			emit("update:modelValue", time.toDate());
-			onChangePageDate(time);
-		}
-		function selectHandler(time, disabled = false) {
-			if (!disabled) move(time);
-		}
-		let headerValueFormat = "";
-		if (computedMode.value === "month") headerValueFormat = t("calendar.formatMonth");
-		else if (computedMode.value === "year") headerValueFormat = t("calendar.formatYear");
-		function changePageShowDate(type, unit) {
-			if (type === "prev") pageShowDate.value = methods.subtract(pageShowDate.value, 1, unit);
-			if (type === "next") pageShowDate.value = methods.add(pageShowDate.value, 1, unit);
-			emit("panelChange", pageShowDate.value.toDate());
-		}
-		function onChangeYear(year) {
-			const newValue = methods.set(pageShowDate.value, "year", year);
-			pageShowDate.value = newValue;
-			emit("panelChange", newValue.toDate());
-		}
-		function onChangeMonth(month) {
-			const newValue = methods.set(pageShowDate.value, "month", month - 1);
-			pageShowDate.value = newValue;
-			emit("panelChange", newValue.toDate());
-		}
-		function changeMode(mode) {
-			_mode.value = mode;
-		}
-		const cls = computed(() => [
-			prefixCls,
-			computedMode.value === "month" ? `${prefixCls}-mode-month` : `${prefixCls}-mode-year`,
-			{ [`${prefixCls}-panel`]: props.panel && (computedMode.value === "month" || computedMode.value === "year") }
-		]);
-		const baseStyle = props.panel ? { width: props.panelWidth } : {};
-		return () => createVNode("div", mergeProps({
-			"class": cls.value,
-			"style": baseStyle
-		}, pickDataAttributes(props)), [
-			createVNode(header_default, {
-				"move": move,
-				"headerValueFormat": headerValueFormat,
-				"modes": props.modes,
-				"mode": computedMode.value,
-				"pageShowData": pageShowDate.value,
-				"dayStartOfWeek": props.dayStartOfWeek,
-				"isWeek": props.isWeek,
-				"onModeChange": changeMode,
-				"onYearChange": onChangeYear,
-				"onMonthChange": onChangeMonth,
-				"changePageShowDate": changePageShowDate
-			}, { default: slots.header }),
-			computedMode.value === "month" && createVNode("div", { "class": `${prefixCls}-body` }, [createVNode(month_default, {
-				"key": pageShowDate.value.month(),
-				"pageData": pageData.value,
-				"value": computedValue.value,
-				"mode": computedMode.value,
-				"selectHandler": selectHandler,
-				"isWeek": props.isWeek,
-				"dayStartOfWeek": props.dayStartOfWeek,
-				"pageShowDate": pageShowDate.value
-			}, { default: slots.default })]),
-			computedMode.value === "year" && createVNode("div", { "class": `${prefixCls}-body` }, [createVNode(year_default, {
-				"key": pageShowDate.value.year(),
-				"pageData": pageData.value,
-				"pageShowData": pageShowDate.value,
-				"mode": computedMode.value,
-				"isWeek": props.isWeek,
-				"value": computedValue.value,
-				"dayStartOfWeek": props.dayStartOfWeek,
-				"selectHandler": selectHandler
-			}, null)]),
-			props.panel && props.panelTodayBtn && createVNode("div", { "class": `${prefixCls}-footer-btn-wrapper` }, [t("today")])
-		]);
-	}
-});
-//#endregion
-export { calendar_default as default };

package/es/calendar/header.d.ts

@@ -1,104 +0,0 @@
-import { PropType } from 'vue';
-import { Dayjs } from 'dayjs';
-declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    mode: {
-        type: PropType<"day" | "week" | "month" | "year">;
-    };
-    dayStartOfWeek: {
-        type: PropType<0 | 1>;
-    };
-    isWeek: {
-        type: BooleanConstructor;
-    };
-    panel: {
-        type: BooleanConstructor;
-    };
-    modes: {
-        type: PropType<("day" | "week" | "month" | "year")[]>;
-    };
-    headerType: {
-        type: StringConstructor;
-    };
-    pageShowData: {
-        type: PropType<Dayjs>;
-        required: true;
-    };
-    move: {
-        type: FunctionConstructor;
-        required: true;
-    };
-    onYearChange: {
-        type: FunctionConstructor;
-        required: true;
-    };
-    onMonthChange: {
-        type: FunctionConstructor;
-        required: true;
-    };
-    changePageShowDate: {
-        type: FunctionConstructor;
-        required: true;
-    };
-    onModeChange: {
-        type: PropType<(value: any, ev: Event) => void>;
-        required: true;
-    };
-    headerValueFormat: {
-        type: StringConstructor;
-        required: true;
-    };
-}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("yearChange" | "monthChange")[], "yearChange" | "monthChange", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    mode: {
-        type: PropType<"day" | "week" | "month" | "year">;
-    };
-    dayStartOfWeek: {
-        type: PropType<0 | 1>;
-    };
-    isWeek: {
-        type: BooleanConstructor;
-    };
-    panel: {
-        type: BooleanConstructor;
-    };
-    modes: {
-        type: PropType<("day" | "week" | "month" | "year")[]>;
-    };
-    headerType: {
-        type: StringConstructor;
-    };
-    pageShowData: {
-        type: PropType<Dayjs>;
-        required: true;
-    };
-    move: {
-        type: FunctionConstructor;
-        required: true;
-    };
-    onYearChange: {
-        type: FunctionConstructor;
-        required: true;
-    };
-    onMonthChange: {
-        type: FunctionConstructor;
-        required: true;
-    };
-    changePageShowDate: {
-        type: FunctionConstructor;
-        required: true;
-    };
-    onModeChange: {
-        type: PropType<(value: any, ev: Event) => void>;
-        required: true;
-    };
-    headerValueFormat: {
-        type: StringConstructor;
-        required: true;
-    };
-}>> & Readonly<{
-    onYearChange?: ((...args: any[]) => any) | undefined;
-    onMonthChange?: ((...args: any[]) => any) | undefined;
-}>, {
-    isWeek: boolean;
-    panel: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-export default _default;

package/es/calendar/header.js

@@ -1,131 +0,0 @@
-import { getPrefixCls } from "../_utils/global-config.js";
-import { isArray } from "../_utils/is.js";
-import Button from "../button/index.js";
-import { useI18n } from "../locale/index.js";
-import IconRight from "../icon/icon-right/index.js";
-import { getNow } from "../_utils/date.js";
-import IconLeft from "../icon/icon-left/index.js";
-import Radio from "../radio/index.js";
-import Select from "../select/index.js";
-import { Fragment, computed, createVNode, defineComponent, isVNode } from "vue";
-//#region components/calendar/header.tsx
-function _isSlot(s) {
-	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
-}
-var header_default = /* @__PURE__ */ defineComponent({
-	name: "Header",
-	props: {
-		mode: { type: String },
-		dayStartOfWeek: { type: Number },
-		isWeek: { type: Boolean },
-		panel: { type: Boolean },
-		modes: { type: Array },
-		headerType: { type: String },
-		pageShowData: {
-			type: Object,
-			required: true
-		},
-		move: {
-			type: Function,
-			required: true
-		},
-		onYearChange: {
-			type: Function,
-			required: true
-		},
-		onMonthChange: {
-			type: Function,
-			required: true
-		},
-		changePageShowDate: {
-			type: Function,
-			required: true
-		},
-		onModeChange: {
-			type: Function,
-			required: true
-		},
-		headerValueFormat: {
-			type: String,
-			required: true
-		}
-	},
-	emits: ["yearChange", "monthChange"],
-	setup(props, { slots }) {
-		const prefixCls = getPrefixCls("calendar");
-		const { t } = useI18n();
-		const modesOptions = isArray(props.modes) ? props.modes.map((m) => ({
-			label: t(`datePicker.view.${m}`),
-			value: m
-		})) : [];
-		const isSelectHeaderType = props.headerType === "select";
-		const pageShowDateYear = computed(() => props.pageShowData.year());
-		const pageShowDateMonth = computed(() => props.pageShowData.month() + 1);
-		const optionsYear = computed(() => {
-			const options = [pageShowDateYear.value];
-			for (let i = 1; i <= 10; i++) options.unshift(pageShowDateYear.value - i);
-			for (let i = 1; i < 10; i++) options.push(pageShowDateYear.value + i);
-			return options;
-		});
-		const optionsMonth = [
-			1,
-			2,
-			3,
-			4,
-			5,
-			6,
-			7,
-			8,
-			9,
-			10,
-			11,
-			12
-		];
-		return () => {
-			let _slot;
-			return createVNode("div", { "class": `${prefixCls}-header` }, [createVNode("div", { "class": `${prefixCls}-header-left` }, [isSelectHeaderType ? createVNode(Fragment, null, [createVNode(Select, {
-				"size": "small",
-				"class": `${prefixCls}-header-value-year`,
-				"defaultValue": pageShowDateYear.value,
-				"options": optionsYear.value,
-				"onChange": props.onYearChange,
-				"popupContainer": `${prefixCls}-header`
-			}, null), props.mode === "month" && createVNode(Select, {
-				"size": "small",
-				"class": `${prefixCls}-header-value-month`,
-				"defaultValue": pageShowDateMonth.value,
-				"options": optionsMonth,
-				"onChange": props.onMonthChange,
-				"popupContainer": `${prefixCls}-header`
-			}, null)]) : createVNode(Fragment, null, [
-				createVNode("div", {
-					"class": `${prefixCls}-header-icon`,
-					"role": "button",
-					"tabindex": 0,
-					"onClick": () => props.changePageShowDate("prev", props.mode)
-				}, [createVNode(IconLeft, null, null)]),
-				createVNode("div", { "class": `${prefixCls}-header-value` }, [slots.default ? slots.default({
-					year: pageShowDateYear,
-					month: pageShowDateMonth
-				}) : props.pageShowData.format(props.headerValueFormat)]),
-				createVNode("div", {
-					"role": "button",
-					"tabindex": 0,
-					"class": `${prefixCls}-header-icon`,
-					"onClick": () => props.changePageShowDate("next", props.mode)
-				}, [createVNode(IconRight, null, null)])
-			]), createVNode(Button, {
-				"size": "small",
-				"onClick": () => props.move(getNow())
-			}, _isSlot(_slot = t(`datePicker.today`)) ? _slot : { default: () => [_slot] })]), createVNode("div", { "class": `${prefixCls}-header-right` }, [createVNode(Radio.Group, {
-				"size": "small",
-				"type": "button",
-				"options": modesOptions,
-				"onChange": props.onModeChange,
-				"modelValue": props.mode
-			}, null)])]);
-		};
-	}
-});
-//#endregion
-export { header_default as default };

package/es/calendar/hooks/useCellClassName.d.ts

@@ -1,19 +0,0 @@
-import { Dayjs } from 'dayjs';
-interface CalendarCellDate {
-    time: Dayjs;
-    isPrev?: boolean;
-    isNext?: boolean;
-}
-interface UseCellClassNameOptions {
-    prefixCls: string;
-    mergedValue?: Dayjs;
-    rangeValues?: Dayjs[];
-    hoverRangeValues?: Dayjs[];
-    panel?: boolean;
-    isSameTime: (current: Dayjs, target: Dayjs) => boolean;
-    innerMode?: 'month' | 'week' | 'day' | 'year';
-}
-export default function useClassName({ prefixCls, mergedValue, rangeValues, hoverRangeValues, panel, isSameTime, innerMode, }: UseCellClassNameOptions): (cellDateObj: CalendarCellDate, disabled: boolean) => (string | {
-    [x: string]: boolean | undefined;
-})[];
-export {};

package/es/calendar/hooks/useCellClassName.js

@@ -1,43 +0,0 @@
-import { isArray } from "../../_utils/is.js";
-import { getNow } from "../../_utils/date.js";
-//#region components/calendar/hooks/useCellClassName.ts
-function getDateValue(date, index) {
-	if (!date || index === void 0) return;
-	if (isArray(date)) return date[index];
-}
-function useClassName({ prefixCls, mergedValue, rangeValues, hoverRangeValues, panel, isSameTime, innerMode }) {
-	function isInRange(current, startDate, endDate) {
-		if (!startDate || !endDate) return false;
-		return isSameTime(current, startDate) || isSameTime(current, endDate) || current.isBetween(startDate, endDate, null, "[]");
-	}
-	return function getCellClassName(cellDateObj, disabled) {
-		const rangeStart = getDateValue(rangeValues, 0);
-		const rangeEnd = getDateValue(rangeValues, 1);
-		const hoverRangeStart = getDateValue(hoverRangeValues, 0);
-		const hoverRangeEnd = getDateValue(hoverRangeValues, 1);
-		const isInView = !cellDateObj.isPrev && !cellDateObj.isNext;
-		const rangeAvailable = isInView && panel;
-		const isRangeStart = rangeAvailable && rangeStart && isSameTime(cellDateObj.time, rangeStart);
-		const isRangeEnd = rangeAvailable && rangeEnd && isSameTime(cellDateObj.time, rangeEnd);
-		const nearRangeStart = hoverRangeStart && rangeStart && hoverRangeStart.isBefore(rangeStart);
-		const nearRangeEnd = rangeEnd && hoverRangeEnd && hoverRangeEnd.isAfter(rangeEnd);
-		const isHoverNearRange = nearRangeStart && isRangeStart || nearRangeEnd && isRangeEnd;
-		let isToday = isSameTime(cellDateObj.time, getNow());
-		if (!panel && innerMode === "year") isToday = getNow().isSame(cellDateObj.time, "date");
-		return [`${prefixCls}-cell`, {
-			[`${prefixCls}-cell-in-view`]: isInView,
-			[`${prefixCls}-cell-today`]: isToday,
-			[`${prefixCls}-cell-selected`]: mergedValue && isSameTime(cellDateObj.time, mergedValue),
-			[`${prefixCls}-cell-range-start`]: isRangeStart,
-			[`${prefixCls}-cell-range-end`]: isRangeEnd,
-			[`${prefixCls}-cell-in-range`]: rangeAvailable && isInRange(cellDateObj.time, rangeStart, rangeEnd),
-			[`${prefixCls}-cell-in-range-near-hover`]: isHoverNearRange,
-			[`${prefixCls}-cell-hover-range-start`]: rangeAvailable && hoverRangeStart && isSameTime(cellDateObj.time, hoverRangeStart),
-			[`${prefixCls}-cell-hover-range-end`]: rangeAvailable && hoverRangeEnd && isSameTime(cellDateObj.time, hoverRangeEnd),
-			[`${prefixCls}-cell-hover-in-range`]: rangeAvailable && isInRange(cellDateObj.time, hoverRangeStart, hoverRangeEnd),
-			[`${prefixCls}-cell-disabled`]: disabled
-		}];
-	};
-}
-//#endregion
-export { useClassName as default };

package/es/calendar/month.d.ts

@@ -1,83 +0,0 @@
-import { PropType } from 'vue';
-import { Dayjs } from 'dayjs';
-export declare function getAllDaysByTime(time: Dayjs, { dayStartOfWeek, isWeek }: {
-    dayStartOfWeek: 0 | 1;
-    isWeek: boolean;
-}): any[][];
-declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
-    cell: {
-        type: BooleanConstructor;
-    };
-    pageData: {
-        type: ArrayConstructor;
-    };
-    current: {
-        type: PropType<number>;
-    };
-    value: {
-        type: PropType<Dayjs>;
-        required: true;
-    };
-    selectHandler: {
-        type: PropType<(time: Dayjs, disabled: boolean) => void>;
-        required: true;
-    };
-    mode: {
-        type: PropType<"day" | "week" | "month" | "year">;
-    };
-    pageShowDate: {
-        type: PropType<Dayjs>;
-        required: true;
-    };
-    panel: {
-        type: BooleanConstructor;
-    };
-    dayStartOfWeek: {
-        type: PropType<0 | 1>;
-        required: true;
-    };
-    isWeek: {
-        type: BooleanConstructor;
-        required: true;
-    };
-}>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
-    cell: {
-        type: BooleanConstructor;
-    };
-    pageData: {
-        type: ArrayConstructor;
-    };
-    current: {
-        type: PropType<number>;
-    };
-    value: {
-        type: PropType<Dayjs>;
-        required: true;
-    };
-    selectHandler: {
-        type: PropType<(time: Dayjs, disabled: boolean) => void>;
-        required: true;
-    };
-    mode: {
-        type: PropType<"day" | "week" | "month" | "year">;
-    };
-    pageShowDate: {
-        type: PropType<Dayjs>;
-        required: true;
-    };
-    panel: {
-        type: BooleanConstructor;
-    };
-    dayStartOfWeek: {
-        type: PropType<0 | 1>;
-        required: true;
-    };
-    isWeek: {
-        type: BooleanConstructor;
-        required: true;
-    };
-}>> & Readonly<{}>, {
-    cell: boolean;
-    panel: boolean;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-export default _default;