@v-c/picker 0.0.1

package/dist/PickerPanel/WeekPanel/index.js

@@ -0,0 +1,173 @@
+import { isInRange, isSameWeek } from "../../utils/dateUtil.js";
+import DatePanel_default from "../DatePanel/index.js";
+import { createVNode, defineComponent, mergeProps } from "vue";
+import { clsx } from "@v-c/util";
+var WeekPanel_default = /* @__PURE__ */ defineComponent((props) => {
+	return () => {
+		const { prefixCls, generateConfig = {}, locale = {}, value, hoverValue, hoverRangeValue } = props;
+		const localeName = locale.locale;
+		const rowPrefixCls = `${prefixCls}-week-panel-row`;
+		const rowClassName = (currentDate) => {
+			const rangeCls = {};
+			if (hoverRangeValue) {
+				const [rangeStart, rangeEnd] = hoverRangeValue;
+				const isRangeStart = isSameWeek(generateConfig, localeName, rangeStart, currentDate);
+				const isRangeEnd = isSameWeek(generateConfig, localeName, rangeEnd, currentDate);
+				rangeCls[`${rowPrefixCls}-range-start`] = isRangeStart;
+				rangeCls[`${rowPrefixCls}-range-end`] = isRangeEnd;
+				rangeCls[`${rowPrefixCls}-range-hover`] = !isRangeStart && !isRangeEnd && isInRange(generateConfig, rangeStart, rangeEnd, currentDate);
+			}
+			if (hoverValue) rangeCls[`${rowPrefixCls}-hover`] = hoverValue.some((date) => isSameWeek(generateConfig, localeName, currentDate, date));
+			return clsx(rowPrefixCls, { [`${rowPrefixCls}-selected`]: !hoverRangeValue && isSameWeek(generateConfig, localeName, value, currentDate) }, rangeCls);
+		};
+		return createVNode(DatePanel_default, mergeProps(props, {
+			"mode": "week",
+			"panelName": "week",
+			"rowClassName": rowClassName
+		}), null);
+	};
+}, {
+	props: {
+		prefixCls: {
+			type: String,
+			required: true,
+			default: void 0
+		},
+		locale: {
+			type: Object,
+			required: false,
+			default: void 0
+		},
+		generateConfig: {
+			type: Object,
+			required: false,
+			default: void 0
+		},
+		pickerValue: {
+			required: true,
+			default: void 0
+		},
+		onPickerValueChange: {
+			type: Function,
+			required: true,
+			default: void 0
+		},
+		value: {
+			required: false,
+			default: void 0
+		},
+		onSelect: {
+			type: Function,
+			required: true,
+			default: void 0
+		},
+		values: {
+			type: Array,
+			required: false,
+			default: void 0
+		},
+		onModeChange: {
+			type: Function,
+			required: true,
+			default: void 0
+		},
+		disabledDate: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		minDate: {
+			required: false,
+			default: void 0
+		},
+		maxDate: {
+			required: false,
+			default: void 0
+		},
+		cellRender: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		hoverRangeValue: {
+			type: [Array, null],
+			required: true,
+			default: void 0
+		},
+		hoverValue: {
+			type: [Array, null],
+			required: false,
+			default: void 0
+		},
+		onHover: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		showTime: {
+			type: Object,
+			required: false,
+			default: void 0
+		},
+		showWeek: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		prevIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		nextIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		superPrevIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		superNextIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		}
+	},
+	name: "WeekPanel",
+	inheritAttrs: false
+});
+export { WeekPanel_default as default };

package/dist/PickerPanel/YearPanel/index.cjs

@@ -0,0 +1,239 @@
+Object.defineProperties(exports, {
+	__esModule: { value: true },
+	[Symbol.toStringTag]: { value: "Module" }
+});
+const require_rolldown_runtime = require("../../_virtual/rolldown_runtime.cjs");
+const require_dateUtil = require("../../utils/dateUtil.cjs");
+const require_context = require("../context.cjs");
+const require_PanelBody = require("../PanelBody.cjs");
+const require_PanelHeader = require("../PanelHeader.cjs");
+let vue = require("vue");
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
+}
+var YearPanel = /* @__PURE__ */ (0, vue.defineComponent)((props) => {
+	const sharedContext = require_context.useSharedPanelContext();
+	require_context.providePanelContext((0, vue.computed)(() => {
+		const [info] = require_context.useInfo(props, "year", sharedContext);
+		return info;
+	}));
+	return () => {
+		const { prefixCls, locale = {}, generateConfig = {}, pickerValue, disabledDate, onPickerValueChange, onModeChange } = props;
+		const panelPrefixCls = `${prefixCls}-year-panel`;
+		const cellYearFormat = locale.cellYearFormat || "YYYY";
+		const yearFormat = locale.yearFormat || "YYYY";
+		const getStartYear = (date) => {
+			const startYear = Math.floor(generateConfig.getYear(date) / 10) * 10;
+			return generateConfig.setYear(date, startYear);
+		};
+		const getEndYear = (date) => {
+			const startYear = getStartYear(date);
+			return generateConfig.addYear(startYear, 9);
+		};
+		const startYearDate = getStartYear(pickerValue);
+		const endYearDate = getEndYear(pickerValue);
+		const baseDate = generateConfig.addYear(startYearDate, -1);
+		const getCellDate = (date, offset) => {
+			return generateConfig.addYear(date, offset);
+		};
+		const getCellText = (date) => {
+			return require_dateUtil.formatValue(date, {
+				locale,
+				format: cellYearFormat,
+				generateConfig
+			});
+		};
+		const getCellClassName = (date) => {
+			return { [`${prefixCls}-cell-in-view`]: require_dateUtil.isSameYear(generateConfig, date, startYearDate) || require_dateUtil.isSameYear(generateConfig, date, endYearDate) || require_dateUtil.isInRange(generateConfig, startYearDate, endYearDate, date) };
+		};
+		const mergedDisabledDate = disabledDate ? (currentDate, disabledInfo) => {
+			const startMonth = generateConfig.setMonth(currentDate, 0);
+			const startDate = generateConfig.setDate(startMonth, 1);
+			const endMonth = generateConfig.addYear(startDate, 1);
+			const endDate = generateConfig.addDate(endMonth, -1);
+			return disabledDate(startDate, disabledInfo) && disabledDate(endDate, disabledInfo);
+		} : void 0;
+		const yearNode = (0, vue.createVNode)("button", {
+			"type": "button",
+			"key": "decade",
+			"aria-label": locale.decadeSelect,
+			"onClick": () => {
+				onModeChange("decade");
+			},
+			"tabindex": -1,
+			"class": `${prefixCls}-decade-btn`
+		}, [
+			require_dateUtil.formatValue(startYearDate, {
+				locale,
+				format: yearFormat,
+				generateConfig
+			}),
+			(0, vue.createTextVNode)("-"),
+			require_dateUtil.formatValue(endYearDate, {
+				locale,
+				format: yearFormat,
+				generateConfig
+			})
+		]);
+		return (0, vue.createVNode)("div", { "class": panelPrefixCls }, [(0, vue.createVNode)(require_PanelHeader.default, {
+			"superOffset": (distance, date) => generateConfig.addYear(date, distance * 10),
+			"onChange": onPickerValueChange,
+			"getStart": getStartYear,
+			"getEnd": getEndYear
+		}, _isSlot(yearNode) ? yearNode : { default: () => [yearNode] }), (0, vue.createVNode)(require_PanelBody.default, (0, vue.mergeProps)(props, {
+			"disabledDate": mergedDisabledDate,
+			"titleFormat": locale.fieldYearFormat,
+			"colNum": 3,
+			"rowNum": 4,
+			"baseDate": baseDate,
+			"getCellDate": getCellDate,
+			"getCellText": getCellText,
+			"getCellClassName": getCellClassName
+		}), null)]);
+	};
+}, {
+	props: {
+		prefixCls: {
+			type: String,
+			required: true,
+			default: void 0
+		},
+		locale: {
+			type: Object,
+			required: false,
+			default: void 0
+		},
+		generateConfig: {
+			type: Object,
+			required: false,
+			default: void 0
+		},
+		pickerValue: {
+			required: true,
+			default: void 0
+		},
+		onPickerValueChange: {
+			type: Function,
+			required: true,
+			default: void 0
+		},
+		value: {
+			required: false,
+			default: void 0
+		},
+		onSelect: {
+			type: Function,
+			required: true,
+			default: void 0
+		},
+		values: {
+			type: Array,
+			required: false,
+			default: void 0
+		},
+		onModeChange: {
+			type: Function,
+			required: true,
+			default: void 0
+		},
+		disabledDate: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		minDate: {
+			required: false,
+			default: void 0
+		},
+		maxDate: {
+			required: false,
+			default: void 0
+		},
+		cellRender: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		hoverRangeValue: {
+			type: [Array, null],
+			required: true,
+			default: void 0
+		},
+		hoverValue: {
+			type: [Array, null],
+			required: false,
+			default: void 0
+		},
+		onHover: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		showTime: {
+			type: Object,
+			required: false,
+			default: void 0
+		},
+		showWeek: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		prevIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		nextIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		superPrevIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		superNextIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		}
+	},
+	name: "YearPanel",
+	inheritAttrs: false
+});
+var YearPanel_default = YearPanel;
+exports.default = YearPanel_default;

package/dist/PickerPanel/YearPanel/index.d.ts

@@ -0,0 +1,3 @@
+import { SharedPanelProps } from '../../interface';
+declare const YearPanel: import('vue').DefineSetupFnComponent<SharedPanelProps<any>, {}, {}, SharedPanelProps<any> & {}, import('vue').PublicProps>;
+export default YearPanel;

package/dist/PickerPanel/YearPanel/index.js

@@ -0,0 +1,233 @@
+import { formatValue, isInRange, isSameYear } from "../../utils/dateUtil.js";
+import { providePanelContext, useInfo, useSharedPanelContext } from "../context.js";
+import PanelBody_default from "../PanelBody.js";
+import PanelHeader_default from "../PanelHeader.js";
+import { computed, createTextVNode, createVNode, defineComponent, isVNode, mergeProps } from "vue";
+function _isSlot(s) {
+	return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+var YearPanel_default = /* @__PURE__ */ defineComponent((props) => {
+	const sharedContext = useSharedPanelContext();
+	providePanelContext(computed(() => {
+		const [info] = useInfo(props, "year", sharedContext);
+		return info;
+	}));
+	return () => {
+		const { prefixCls, locale = {}, generateConfig = {}, pickerValue, disabledDate, onPickerValueChange, onModeChange } = props;
+		const panelPrefixCls = `${prefixCls}-year-panel`;
+		const cellYearFormat = locale.cellYearFormat || "YYYY";
+		const yearFormat = locale.yearFormat || "YYYY";
+		const getStartYear = (date) => {
+			const startYear = Math.floor(generateConfig.getYear(date) / 10) * 10;
+			return generateConfig.setYear(date, startYear);
+		};
+		const getEndYear = (date) => {
+			const startYear = getStartYear(date);
+			return generateConfig.addYear(startYear, 9);
+		};
+		const startYearDate = getStartYear(pickerValue);
+		const endYearDate = getEndYear(pickerValue);
+		const baseDate = generateConfig.addYear(startYearDate, -1);
+		const getCellDate = (date, offset) => {
+			return generateConfig.addYear(date, offset);
+		};
+		const getCellText = (date) => {
+			return formatValue(date, {
+				locale,
+				format: cellYearFormat,
+				generateConfig
+			});
+		};
+		const getCellClassName = (date) => {
+			return { [`${prefixCls}-cell-in-view`]: isSameYear(generateConfig, date, startYearDate) || isSameYear(generateConfig, date, endYearDate) || isInRange(generateConfig, startYearDate, endYearDate, date) };
+		};
+		const mergedDisabledDate = disabledDate ? (currentDate, disabledInfo) => {
+			const startMonth = generateConfig.setMonth(currentDate, 0);
+			const startDate = generateConfig.setDate(startMonth, 1);
+			const endMonth = generateConfig.addYear(startDate, 1);
+			const endDate = generateConfig.addDate(endMonth, -1);
+			return disabledDate(startDate, disabledInfo) && disabledDate(endDate, disabledInfo);
+		} : void 0;
+		const yearNode = createVNode("button", {
+			"type": "button",
+			"key": "decade",
+			"aria-label": locale.decadeSelect,
+			"onClick": () => {
+				onModeChange("decade");
+			},
+			"tabindex": -1,
+			"class": `${prefixCls}-decade-btn`
+		}, [
+			formatValue(startYearDate, {
+				locale,
+				format: yearFormat,
+				generateConfig
+			}),
+			createTextVNode("-"),
+			formatValue(endYearDate, {
+				locale,
+				format: yearFormat,
+				generateConfig
+			})
+		]);
+		return createVNode("div", { "class": panelPrefixCls }, [createVNode(PanelHeader_default, {
+			"superOffset": (distance, date) => generateConfig.addYear(date, distance * 10),
+			"onChange": onPickerValueChange,
+			"getStart": getStartYear,
+			"getEnd": getEndYear
+		}, _isSlot(yearNode) ? yearNode : { default: () => [yearNode] }), createVNode(PanelBody_default, mergeProps(props, {
+			"disabledDate": mergedDisabledDate,
+			"titleFormat": locale.fieldYearFormat,
+			"colNum": 3,
+			"rowNum": 4,
+			"baseDate": baseDate,
+			"getCellDate": getCellDate,
+			"getCellText": getCellText,
+			"getCellClassName": getCellClassName
+		}), null)]);
+	};
+}, {
+	props: {
+		prefixCls: {
+			type: String,
+			required: true,
+			default: void 0
+		},
+		locale: {
+			type: Object,
+			required: false,
+			default: void 0
+		},
+		generateConfig: {
+			type: Object,
+			required: false,
+			default: void 0
+		},
+		pickerValue: {
+			required: true,
+			default: void 0
+		},
+		onPickerValueChange: {
+			type: Function,
+			required: true,
+			default: void 0
+		},
+		value: {
+			required: false,
+			default: void 0
+		},
+		onSelect: {
+			type: Function,
+			required: true,
+			default: void 0
+		},
+		values: {
+			type: Array,
+			required: false,
+			default: void 0
+		},
+		onModeChange: {
+			type: Function,
+			required: true,
+			default: void 0
+		},
+		disabledDate: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		minDate: {
+			required: false,
+			default: void 0
+		},
+		maxDate: {
+			required: false,
+			default: void 0
+		},
+		cellRender: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		hoverRangeValue: {
+			type: [Array, null],
+			required: true,
+			default: void 0
+		},
+		hoverValue: {
+			type: [Array, null],
+			required: false,
+			default: void 0
+		},
+		onHover: {
+			type: Function,
+			required: false,
+			default: void 0
+		},
+		showTime: {
+			type: Object,
+			required: false,
+			default: void 0
+		},
+		showWeek: {
+			type: Boolean,
+			required: false,
+			default: void 0
+		},
+		prevIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		nextIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		superPrevIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		},
+		superNextIcon: {
+			type: [
+				Object,
+				Function,
+				String,
+				Number,
+				null,
+				Boolean,
+				Array
+			],
+			required: false,
+			default: void 0
+		}
+	},
+	name: "YearPanel",
+	inheritAttrs: false
+});
+export { YearPanel_default as default };

package/dist/PickerPanel/context.cjs

@@ -0,0 +1,61 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_rolldown_runtime = require("../_virtual/rolldown_runtime.cjs");
+let vue = require("vue");
+var SharedPanelContextKey = Symbol("SharedPanelContext");
+function provideSharedPanelContext(context) {
+	(0, vue.provide)(SharedPanelContextKey, context);
+}
+function useSharedPanelContext() {
+	return (0, vue.inject)(SharedPanelContextKey, null);
+}
+var PanelContextKey = Symbol("PanelContext");
+function providePanelContext(context) {
+	(0, vue.provide)(PanelContextKey, context);
+}
+function usePanelContext() {
+	return (0, vue.inject)(PanelContextKey, null);
+}
+function useInfo(props, panelType, sharedContext) {
+	const ctx = sharedContext ?? useSharedPanelContext();
+	const classNames = ctx?.value.classNames;
+	const styles = ctx?.value.styles;
+	const { prefixCls, generateConfig, locale, disabledDate, minDate, maxDate, cellRender, hoverValue, hoverRangeValue, onHover, values, pickerValue, onSelect, prevIcon, nextIcon, superPrevIcon, superNextIcon } = props;
+	const now = generateConfig.getNow();
+	return [{
+		now,
+		values,
+		pickerValue,
+		prefixCls,
+		classNames,
+		styles,
+		disabledDate,
+		minDate,
+		maxDate,
+		cellRender,
+		hoverValue,
+		hoverRangeValue,
+		onHover,
+		locale,
+		generateConfig,
+		onSelect,
+		panelType,
+		prevIcon,
+		nextIcon,
+		superPrevIcon,
+		superNextIcon
+	}, now];
+}
+var PickerHackContextKey = Symbol("PickerHackContext");
+function providePickerHackContext(context) {
+	(0, vue.provide)(PickerHackContextKey, context);
+}
+function usePickerHackContext() {
+	return (0, vue.inject)(PickerHackContextKey, null);
+}
+exports.providePanelContext = providePanelContext;
+exports.providePickerHackContext = providePickerHackContext;
+exports.provideSharedPanelContext = provideSharedPanelContext;
+exports.useInfo = useInfo;
+exports.usePanelContext = usePanelContext;
+exports.usePickerHackContext = usePickerHackContext;
+exports.useSharedPanelContext = useSharedPanelContext;