niuma-ui 1.1.12 → 1.2.0

package/dist/components/RsDatePicker.impl.js

@@ -0,0 +1,719 @@
+import { useRsI18n } from "../composables/useRsI18n.js";
+import RsIcon_default from "./RsIcon.js";
+import { RS_COMPONENT_SIZE_ICON_PX } from "../theme/types.js";
+import { buildLocalInputRules, runFormFieldRules } from "./form-rules.js";
+import { isRsFormItemBoundControl, useRsFormContext, useRsFormField, useRsFormItemContext } from "./form-utils.js";
+import { useResolvedRsComponentSize } from "./resolve-size.js";
+import { PopoverContent, PopoverPortal, PopoverRoot, PopoverTrigger } from "./reka.js";
+import { EMPTY_DATE_RANGE, compareDates, extractTimeFromDateTime, formatDateDisplay, formatDateParts, formatDateRangeLabel, formatDateTimeDisplay, formatDateTimeParts, formatDateTimeRangeLabel, formatTimestampValue, fromInternalPickerValue, getNextMonth, getNowDateTime, getTodayDate, isDateRangeEmpty, isDateRangeOrdered, isDateWithinBounds, isTimestampRange, normalizeShortcutValue, parseDateTimeValue, parseDateValue, parseTimestampValue, toInternalPickerValue, toRangeEndpointString } from "./date-picker-utils.js";
+import RsCalendarGrid_default from "./RsCalendarGrid.js";
+import { formatTimeParts } from "./time-picker-utils.js";
+import RsTimePicker_default from "./RsTimePicker.js";
+import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, mergeProps, normalizeClass, openBlock, ref, renderList, toDisplayString, unref, useAttrs, useId, useModel, watch, withCtx } from "vue";
+//#region src/components/RsDatePicker.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	key: 0,
+	class: "rs-field__label"
+};
+var _hoisted_2 = ["for"];
+var _hoisted_3 = {
+	key: 2,
+	class: "rs-field__required",
+	"aria-hidden": "true"
+};
+var _hoisted_4 = { class: "rs-date-picker__leading" };
+var _hoisted_5 = { class: "rs-date-picker__value" };
+var _hoisted_6 = {
+	key: 0,
+	class: "rs-date-picker__panel"
+};
+var _hoisted_7 = {
+	key: 0,
+	class: "rs-date-picker__range-grid"
+};
+var _hoisted_8 = { class: "rs-date-picker__range-pane" };
+var _hoisted_9 = { class: "rs-date-picker__pane-title" };
+var _hoisted_10 = {
+	key: 0,
+	class: "rs-date-picker__time-row"
+};
+var _hoisted_11 = { class: "rs-date-picker__time-label" };
+var _hoisted_12 = { class: "rs-date-picker__range-pane" };
+var _hoisted_13 = { class: "rs-date-picker__pane-title" };
+var _hoisted_14 = {
+	key: 0,
+	class: "rs-date-picker__time-row"
+};
+var _hoisted_15 = { class: "rs-date-picker__time-label" };
+var _hoisted_16 = {
+	key: 0,
+	class: "rs-date-picker__time-row"
+};
+var _hoisted_17 = { class: "rs-date-picker__time-label" };
+var _hoisted_18 = { class: "rs-date-picker__footer" };
+var _hoisted_19 = { class: "rs-date-picker__footer-start" };
+var _hoisted_20 = {
+	key: 0,
+	class: "rs-date-picker__shortcuts"
+};
+var _hoisted_21 = ["disabled", "onClick"];
+var _hoisted_22 = { class: "rs-date-picker__actions" };
+var _hoisted_23 = ["disabled"];
+var _hoisted_24 = {
+	key: 1,
+	class: "rs-date-picker-field__error",
+	role: "alert"
+};
+var _hoisted_25 = {
+	key: 2,
+	class: "rs-field__hint"
+};
+var RsDatePicker_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	inheritAttrs: false,
+	__name: "RsDatePicker",
+	props: /*@__PURE__*/ mergeModels({
+		name: {},
+		label: {},
+		hint: {},
+		placeholder: {},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			default: false
+		},
+		range: {
+			type: Boolean,
+			default: false
+		},
+		minDate: {},
+		maxDate: {},
+		withTime: {
+			type: Boolean,
+			default: false
+		},
+		withSeconds: { type: Boolean },
+		valueFormat: { default: "string" },
+		labelPosition: { default: "top" },
+		shortcuts: {},
+		size: {},
+		id: {},
+		invalid: { type: Boolean },
+		showValidateMessage: {
+			type: Boolean,
+			default: true
+		}
+	}, {
+		"modelValue": { default: "" },
+		"modelModifiers": {},
+		"open": {
+			type: Boolean,
+			default: false
+		},
+		"openModifiers": {}
+	}),
+	emits: ["update:modelValue", "update:open"],
+	setup(__props, { expose: __expose }) {
+		function isRangeModel(value) {
+			return typeof value === "object" && value !== null && !Array.isArray(value) && ("start" in value || "end" in value);
+		}
+		const model = useModel(__props, "modelValue");
+		const open = useModel(__props, "open");
+		const props = __props;
+		const fieldId = useId();
+		const attrs = useAttrs();
+		const { t } = useRsI18n();
+		const resolvedSize = useResolvedRsComponentSize(() => props.size);
+		const triggerIconSize = computed(() => RS_COMPONENT_SIZE_ICON_PX[resolvedSize.value]);
+		/** withTime 默认带秒；显式 withSeconds 优先（勿与 prop 同名，避免模板取到未传 prop） */
+		const resolvedWithSeconds = computed(() => props.withSeconds !== void 0 ? props.withSeconds : props.withTime);
+		const formContext = useRsFormContext();
+		const formItem = useRsFormItemContext();
+		const boundToItem = computed(() => isRsFormItemBoundControl(formItem, {
+			id: props.id,
+			name: props.name
+		}));
+		const autoMessage = ref("");
+		const isInvalid = computed(() => Boolean(props.invalid || boundToItem.value && formItem?.invalid.value || !boundToItem.value && autoMessage.value));
+		const triggerId = computed(() => props.id || fieldId);
+		const visibleMessage = computed(() => boundToItem.value || props.showValidateMessage === false ? "" : autoMessage.value);
+		const viewYear = ref(getTodayDate().year);
+		const viewMonth = ref(getTodayDate().month);
+		const startViewYear = ref(getTodayDate().year);
+		const startViewMonth = ref(getTodayDate().month);
+		const endViewYear = ref(getTodayDate().year);
+		const endViewMonth = ref(getTodayDate().month);
+		const draftDate = ref(null);
+		const draftStart = ref(null);
+		const draftEnd = ref(null);
+		const draftTime = ref("");
+		const draftStartTime = ref("");
+		const draftEndTime = ref("");
+		const convertOptions = computed(() => ({
+			valueFormat: props.valueFormat ?? "string",
+			withTime: props.withTime
+		}));
+		const useTimestamp = computed(() => props.valueFormat === "timestamp");
+		const rangeModel = computed({
+			get() {
+				if (!props.range) return { ...EMPTY_DATE_RANGE };
+				const value = model.value;
+				const opts = convertOptions.value;
+				if (isTimestampRange(value)) return {
+					start: formatTimestampValue(value[0], opts.withTime),
+					end: formatTimestampValue(value[1], opts.withTime)
+				};
+				if (!isRangeModel(value)) return { ...EMPTY_DATE_RANGE };
+				return {
+					start: toInternalPickerValue(value.start, opts) || void 0,
+					end: toInternalPickerValue(value.end, opts) || void 0
+				};
+			},
+			set(value) {
+				const opts = convertOptions.value;
+				if (useTimestamp.value) {
+					const start = parseTimestampValue(value.start);
+					const end = parseTimestampValue(value.end);
+					model.value = start != null && end != null ? [start, end] : null;
+					return;
+				}
+				model.value = {
+					start: toRangeEndpointString(fromInternalPickerValue(value.start || "", opts)),
+					end: toRangeEndpointString(fromInternalPickerValue(value.end || "", opts))
+				};
+			}
+		});
+		const singleModel = computed({
+			get() {
+				if (props.range) return "";
+				return toInternalPickerValue(model.value, convertOptions.value);
+			},
+			set(value) {
+				model.value = fromInternalPickerValue(value, convertOptions.value);
+			}
+		});
+		const startMaxDate = computed(() => {
+			if (!draftEnd.value) return props.maxDate;
+			return formatDateParts(draftEnd.value);
+		});
+		const endMinDate = computed(() => {
+			if (!draftStart.value) return props.minDate;
+			return formatDateParts(draftStart.value);
+		});
+		const isEmpty = computed(() => props.range ? isDateRangeEmpty(rangeModel.value) : !singleModel.value);
+		const displayValue = computed(() => {
+			if (props.range) {
+				const formatted = props.withTime ? formatDateTimeRangeLabel(rangeModel.value, t("datePicker.separator")) : formatDateRangeLabel(rangeModel.value, t("datePicker.separator"));
+				if (formatted) return formatted;
+				if (props.placeholder) return props.placeholder;
+				return props.withTime ? t("dateTimePicker.rangePlaceholder") : t("datePicker.rangePlaceholder");
+			}
+			if (!singleModel.value) return props.placeholder ?? (props.withTime ? t("dateTimePicker.placeholder") : t("datePicker.placeholder"));
+			return props.withTime ? formatDateTimeDisplay(singleModel.value) : formatDateDisplay(singleModel.value);
+		});
+		const triggerIcon = computed(() => {
+			if (props.range || props.withTime) return "calendar-clock";
+			return "calendar-days";
+		});
+		function currentTimeValue() {
+			const now = getNowDateTime();
+			return formatTimeParts(now.hour, now.minute, resolvedWithSeconds.value ? now.second : void 0);
+		}
+		function resetRangeTimeDrafts() {
+			const time = currentTimeValue();
+			draftStartTime.value = time;
+			draftEndTime.value = time;
+		}
+		function combineDraftDateTime(date, time) {
+			return formatDateTimeParts(date, time, resolvedWithSeconds.value);
+		}
+		function setEndViewFromStart(start) {
+			const next = getNextMonth(start.year, start.month);
+			endViewYear.value = next.year;
+			endViewMonth.value = next.month;
+		}
+		function syncSingleDraft() {
+			if (props.withTime) {
+				const parsed = parseDateTimeValue(singleModel.value);
+				if (parsed) {
+					draftDate.value = {
+						year: parsed.year,
+						month: parsed.month,
+						day: parsed.day
+					};
+					draftTime.value = extractTimeFromDateTime(singleModel.value, resolvedWithSeconds.value);
+					viewYear.value = parsed.year;
+					viewMonth.value = parsed.month;
+					return;
+				}
+				const today = getTodayDate();
+				draftDate.value = null;
+				draftTime.value = currentTimeValue();
+				viewYear.value = today.year;
+				viewMonth.value = today.month;
+				return;
+			}
+			const parsed = parseDateValue(singleModel.value);
+			if (parsed) {
+				draftDate.value = parsed;
+				viewYear.value = parsed.year;
+				viewMonth.value = parsed.month;
+				return;
+			}
+			const today = getTodayDate();
+			draftDate.value = null;
+			viewYear.value = today.year;
+			viewMonth.value = today.month;
+		}
+		function syncRangeDraft() {
+			const today = getTodayDate();
+			const value = rangeModel.value;
+			if (props.withTime) {
+				const start = parseDateTimeValue(value.start);
+				const end = parseDateTimeValue(value.end);
+				draftStart.value = start ? {
+					year: start.year,
+					month: start.month,
+					day: start.day
+				} : null;
+				draftEnd.value = end ? {
+					year: end.year,
+					month: end.month,
+					day: end.day
+				} : null;
+				if (start) {
+					draftStartTime.value = extractTimeFromDateTime(value.start, resolvedWithSeconds.value);
+					startViewYear.value = start.year;
+					startViewMonth.value = start.month;
+				} else {
+					resetRangeTimeDrafts();
+					startViewYear.value = today.year;
+					startViewMonth.value = today.month;
+				}
+				if (end) {
+					draftEndTime.value = extractTimeFromDateTime(value.end, resolvedWithSeconds.value);
+					endViewYear.value = end.year;
+					endViewMonth.value = end.month;
+				} else if (start) {
+					draftEndTime.value = draftStartTime.value;
+					setEndViewFromStart(start);
+				} else {
+					const next = getNextMonth(today.year, today.month);
+					endViewYear.value = next.year;
+					endViewMonth.value = next.month;
+				}
+				return;
+			}
+			const start = parseDateValue(value.start);
+			const end = parseDateValue(value.end);
+			draftStart.value = start;
+			draftEnd.value = end;
+			if (start) {
+				startViewYear.value = start.year;
+				startViewMonth.value = start.month;
+			} else {
+				startViewYear.value = today.year;
+				startViewMonth.value = today.month;
+			}
+			if (end) {
+				endViewYear.value = end.year;
+				endViewMonth.value = end.month;
+			} else if (start) setEndViewFromStart(start);
+			else {
+				const next = getNextMonth(today.year, today.month);
+				endViewYear.value = next.year;
+				endViewMonth.value = next.month;
+			}
+		}
+		function syncDraftFromModel() {
+			if (props.range) {
+				syncRangeDraft();
+				return;
+			}
+			syncSingleDraft();
+		}
+		function confirmSingleSelection() {
+			if (!draftDate.value) return;
+			if (props.withTime) {
+				const combined = combineDraftDateTime(draftDate.value, draftTime.value);
+				if (!combined) return;
+				singleModel.value = combined;
+				open.value = false;
+				return;
+			}
+			if (!isDateWithinBounds(draftDate.value.year, draftDate.value.month, draftDate.value.day, {
+				minDate: props.minDate,
+				maxDate: props.maxDate
+			})) return;
+			singleModel.value = formatDateParts(draftDate.value);
+			open.value = false;
+		}
+		function confirmRangeSelection() {
+			if (!draftStart.value || !draftEnd.value) return;
+			if (props.withTime) {
+				const start = combineDraftDateTime(draftStart.value, draftStartTime.value);
+				const end = combineDraftDateTime(draftEnd.value, draftEndTime.value);
+				if (!start || !end) return;
+				if (!isDateRangeOrdered({
+					start,
+					end
+				})) return;
+				rangeModel.value = {
+					start,
+					end
+				};
+				open.value = false;
+				return;
+			}
+			const start = formatDateParts(draftStart.value);
+			const end = formatDateParts(draftEnd.value);
+			if (!isDateRangeOrdered({
+				start,
+				end
+			})) return;
+			if (!isDateWithinBounds(draftStart.value.year, draftStart.value.month, draftStart.value.day, {
+				minDate: props.minDate,
+				maxDate: props.maxDate
+			}) || !isDateWithinBounds(draftEnd.value.year, draftEnd.value.month, draftEnd.value.day, {
+				minDate: props.minDate,
+				maxDate: props.maxDate
+			})) return;
+			rangeModel.value = {
+				start,
+				end
+			};
+			open.value = false;
+		}
+		function confirmSelection() {
+			if (props.range) {
+				confirmRangeSelection();
+				return;
+			}
+			confirmSingleSelection();
+		}
+		function applyShortcut(shortcut) {
+			if (props.disabled) return;
+			const normalized = normalizeShortcutValue(shortcut.value(), { withTime: props.withTime });
+			if (!normalized) return;
+			if (props.range) {
+				const rangeValue = typeof normalized === "string" ? {
+					start: normalized,
+					end: normalized
+				} : normalized;
+				if (!rangeValue.start || !rangeValue.end) return;
+				if (!isDateRangeOrdered(rangeValue)) return;
+				rangeModel.value = rangeValue;
+				open.value = false;
+				return;
+			}
+			if (typeof normalized !== "string") return;
+			singleModel.value = normalized;
+			open.value = false;
+		}
+		function clearSelection() {
+			if (props.range) {
+				if (useTimestamp.value) model.value = null;
+				else rangeModel.value = { ...EMPTY_DATE_RANGE };
+				draftStart.value = null;
+				draftEnd.value = null;
+				if (props.withTime) resetRangeTimeDrafts();
+			} else {
+				singleModel.value = "";
+				draftDate.value = null;
+				if (props.withTime) draftTime.value = currentTimeValue();
+			}
+			open.value = false;
+		}
+		function selectToday() {
+			const today = getTodayDate();
+			const now = getNowDateTime();
+			if (props.range) {
+				draftStart.value = today;
+				draftEnd.value = today;
+				startViewYear.value = today.year;
+				startViewMonth.value = today.month;
+				endViewYear.value = today.year;
+				endViewMonth.value = today.month;
+				if (props.withTime) {
+					const time = formatTimeParts(now.hour, now.minute, resolvedWithSeconds.value ? now.second : void 0);
+					draftStartTime.value = time;
+					draftEndTime.value = time;
+				}
+				confirmRangeSelection();
+				return;
+			}
+			draftDate.value = today;
+			viewYear.value = today.year;
+			viewMonth.value = today.month;
+			if (props.withTime) draftTime.value = formatTimeParts(now.hour, now.minute, resolvedWithSeconds.value ? now.second : void 0);
+			confirmSingleSelection();
+		}
+		function handleDateSelect(date) {
+			draftDate.value = date;
+			viewYear.value = date.year;
+			viewMonth.value = date.month;
+		}
+		function handleStartSelect(date) {
+			if (!isDateWithinBounds(date.year, date.month, date.day, {
+				minDate: props.minDate,
+				maxDate: startMaxDate.value
+			})) return;
+			draftStart.value = date;
+			startViewYear.value = date.year;
+			startViewMonth.value = date.month;
+			if (draftEnd.value && compareDates(date, draftEnd.value) > 0) {
+				draftEnd.value = null;
+				setEndViewFromStart(date);
+			}
+		}
+		function handleEndSelect(date) {
+			if (!isDateWithinBounds(date.year, date.month, date.day, {
+				minDate: endMinDate.value,
+				maxDate: props.maxDate
+			})) return;
+			if (draftStart.value && compareDates(date, draftStart.value) < 0) return;
+			draftEnd.value = date;
+			endViewYear.value = date.year;
+			endViewMonth.value = date.month;
+		}
+		function clearValidation() {
+			autoMessage.value = "";
+		}
+		function setFieldValue(value) {
+			if (props.range) {
+				if (isRangeModel(value)) {
+					model.value = value;
+					return;
+				}
+				if (Array.isArray(value) && value.length >= 2) {
+					model.value = {
+						start: String(value[0] ?? ""),
+						end: String(value[1] ?? "")
+					};
+					return;
+				}
+				model.value = { ...EMPTY_DATE_RANGE };
+				return;
+			}
+			model.value = value == null ? "" : value;
+		}
+		async function runValidate(trigger = "submit") {
+			const formRules = formContext?.getFieldRules(props.name) ?? [];
+			const localRules = buildLocalInputRules({ required: props.required });
+			const rules = [...formRules, ...localRules];
+			if (!rules.length) {
+				autoMessage.value = "";
+				return {
+					valid: true,
+					name: props.name
+				};
+			}
+			const result = await runFormFieldRules(model.value, rules, { trigger });
+			autoMessage.value = result.message ?? "";
+			return {
+				valid: result.valid,
+				message: result.message,
+				name: props.name
+			};
+		}
+		useRsFormField(() => ({
+			get name() {
+				return props.name;
+			},
+			getValue: () => model.value,
+			setValue: setFieldValue,
+			validate: (trigger) => runValidate(trigger ?? "submit"),
+			clearValidation,
+			setError: (message) => {
+				autoMessage.value = message;
+			}
+		}));
+		__expose({
+			setValue: setFieldValue,
+			clearValidation,
+			validate: runValidate
+		});
+		watch(open, (isOpen) => {
+			if (isOpen) syncDraftFromModel();
+			if (!isOpen && props.name) runValidate("change");
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(["rs-field", `rs-field--label-${__props.labelPosition}`]) }, [
+				__props.label ? (openBlock(), createElementBlock("span", _hoisted_1, [__props.labelPosition === "left" ? (openBlock(), createElementBlock("label", {
+					key: 0,
+					for: unref(fieldId)
+				}, toDisplayString(__props.label), 9, _hoisted_2)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createTextVNode(toDisplayString(__props.label), 1)], 64)), __props.required ? (openBlock(), createElementBlock("span", _hoisted_3, "*")) : createCommentVNode("", true)])) : createCommentVNode("", true),
+				createElementVNode("div", { class: normalizeClass(["rs-date-picker", `rs-date-picker--${unref(resolvedSize)}`]) }, [createVNode(unref(PopoverRoot), {
+					open: open.value,
+					"onUpdate:open": _cache[9] || (_cache[9] = ($event) => open.value = $event)
+				}, {
+					default: withCtx(() => [createVNode(unref(PopoverTrigger), mergeProps(unref(attrs), {
+						id: triggerId.value,
+						type: "button",
+						class: ["rs-date-picker__trigger", {
+							"rs-date-picker__trigger--placeholder": isEmpty.value,
+							"rs-date-picker__trigger--invalid": isInvalid.value
+						}],
+						disabled: __props.disabled,
+						"aria-invalid": isInvalid.value || void 0
+					}), {
+						default: withCtx(() => [createElementVNode("span", _hoisted_4, [createVNode(RsIcon_default, {
+							name: triggerIcon.value,
+							size: triggerIconSize.value,
+							class: "rs-date-picker__icon"
+						}, null, 8, ["name", "size"]), createElementVNode("span", _hoisted_5, toDisplayString(displayValue.value), 1)]), createVNode(RsIcon_default, {
+							name: "chevron-down",
+							size: triggerIconSize.value,
+							class: "rs-date-picker__chevron"
+						}, null, 8, ["size"])]),
+						_: 1
+					}, 16, [
+						"id",
+						"class",
+						"disabled",
+						"aria-invalid"
+					]), createVNode(unref(PopoverPortal), null, {
+						default: withCtx(() => [createVNode(unref(PopoverContent), {
+							class: normalizeClass(["rs-date-picker__content", { "rs-date-picker__content--range": __props.range }]),
+							"side-offset": 6,
+							align: "start"
+						}, {
+							default: withCtx(() => [open.value ? (openBlock(), createElementBlock("div", _hoisted_6, [__props.range ? (openBlock(), createElementBlock("div", _hoisted_7, [createElementVNode("section", _hoisted_8, [
+								createElementVNode("span", _hoisted_9, toDisplayString(__props.withTime ? unref(t)("dateTimePicker.rangeStart") : unref(t)("datePicker.rangeStart")), 1),
+								createVNode(RsCalendarGrid_default, {
+									"view-year": startViewYear.value,
+									"onUpdate:viewYear": _cache[0] || (_cache[0] = ($event) => startViewYear.value = $event),
+									"view-month": startViewMonth.value,
+									"onUpdate:viewMonth": _cache[1] || (_cache[1] = ($event) => startViewMonth.value = $event),
+									selected: draftStart.value,
+									"range-start": draftStart.value,
+									"range-end": draftEnd.value,
+									"min-date": __props.minDate,
+									"max-date": startMaxDate.value,
+									onSelect: handleStartSelect
+								}, null, 8, [
+									"view-year",
+									"view-month",
+									"selected",
+									"range-start",
+									"range-end",
+									"min-date",
+									"max-date"
+								]),
+								__props.withTime ? (openBlock(), createElementBlock("div", _hoisted_10, [createElementVNode("span", _hoisted_11, toDisplayString(unref(t)("dateTimePicker.time")), 1), createVNode(RsTimePicker_default, {
+									modelValue: draftStartTime.value,
+									"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => draftStartTime.value = $event),
+									class: "rs-date-picker__time-picker",
+									embedded: "",
+									size: unref(resolvedSize),
+									"with-seconds": resolvedWithSeconds.value,
+									disabled: !draftStart.value || __props.disabled
+								}, null, 8, [
+									"modelValue",
+									"size",
+									"with-seconds",
+									"disabled"
+								])])) : createCommentVNode("", true)
+							]), createElementVNode("section", _hoisted_12, [
+								createElementVNode("span", _hoisted_13, toDisplayString(__props.withTime ? unref(t)("dateTimePicker.rangeEnd") : unref(t)("datePicker.rangeEnd")), 1),
+								createVNode(RsCalendarGrid_default, {
+									"view-year": endViewYear.value,
+									"onUpdate:viewYear": _cache[3] || (_cache[3] = ($event) => endViewYear.value = $event),
+									"view-month": endViewMonth.value,
+									"onUpdate:viewMonth": _cache[4] || (_cache[4] = ($event) => endViewMonth.value = $event),
+									selected: draftEnd.value,
+									"range-start": draftStart.value,
+									"range-end": draftEnd.value,
+									"min-date": endMinDate.value,
+									"max-date": __props.maxDate,
+									onSelect: handleEndSelect
+								}, null, 8, [
+									"view-year",
+									"view-month",
+									"selected",
+									"range-start",
+									"range-end",
+									"min-date",
+									"max-date"
+								]),
+								__props.withTime ? (openBlock(), createElementBlock("div", _hoisted_14, [createElementVNode("span", _hoisted_15, toDisplayString(unref(t)("dateTimePicker.time")), 1), createVNode(RsTimePicker_default, {
+									modelValue: draftEndTime.value,
+									"onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => draftEndTime.value = $event),
+									class: "rs-date-picker__time-picker",
+									embedded: "",
+									size: unref(resolvedSize),
+									"with-seconds": resolvedWithSeconds.value,
+									disabled: !draftEnd.value || __props.disabled
+								}, null, 8, [
+									"modelValue",
+									"size",
+									"with-seconds",
+									"disabled"
+								])])) : createCommentVNode("", true)
+							])])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createVNode(RsCalendarGrid_default, {
+								"view-year": viewYear.value,
+								"onUpdate:viewYear": _cache[6] || (_cache[6] = ($event) => viewYear.value = $event),
+								"view-month": viewMonth.value,
+								"onUpdate:viewMonth": _cache[7] || (_cache[7] = ($event) => viewMonth.value = $event),
+								selected: draftDate.value,
+								"min-date": __props.minDate,
+								"max-date": __props.maxDate,
+								onSelect: handleDateSelect
+							}, null, 8, [
+								"view-year",
+								"view-month",
+								"selected",
+								"min-date",
+								"max-date"
+							]), __props.withTime ? (openBlock(), createElementBlock("div", _hoisted_16, [createElementVNode("span", _hoisted_17, toDisplayString(unref(t)("dateTimePicker.time")), 1), createVNode(RsTimePicker_default, {
+								modelValue: draftTime.value,
+								"onUpdate:modelValue": _cache[8] || (_cache[8] = ($event) => draftTime.value = $event),
+								class: "rs-date-picker__time-picker",
+								embedded: "",
+								size: unref(resolvedSize),
+								"with-seconds": resolvedWithSeconds.value,
+								disabled: !draftDate.value || __props.disabled
+							}, null, 8, [
+								"modelValue",
+								"size",
+								"with-seconds",
+								"disabled"
+							])])) : createCommentVNode("", true)], 64)), createElementVNode("footer", _hoisted_18, [createElementVNode("div", _hoisted_19, [__props.shortcuts?.length ? (openBlock(), createElementBlock("div", _hoisted_20, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.shortcuts, (item) => {
+								return openBlock(), createElementBlock("button", {
+									key: item.label,
+									type: "button",
+									class: "rs-date-picker__shortcut",
+									disabled: __props.disabled,
+									onClick: ($event) => applyShortcut(item)
+								}, toDisplayString(item.label), 9, _hoisted_21);
+							}), 128))])) : (openBlock(), createElementBlock("button", {
+								key: 1,
+								type: "button",
+								class: "rs-date-picker__link",
+								onClick: selectToday
+							}, toDisplayString(__props.range ? __props.withTime ? unref(t)("dateTimePicker.now") : unref(t)("datePicker.rangeToday") : __props.withTime ? unref(t)("dateTimePicker.now") : unref(t)("datePicker.today")), 1))]), createElementVNode("div", _hoisted_22, [createElementVNode("button", {
+								type: "button",
+								class: "rs-date-picker__ghost",
+								onClick: clearSelection
+							}, toDisplayString(__props.withTime ? unref(t)("dateTimePicker.clear") : unref(t)("datePicker.clear")), 1), createElementVNode("button", {
+								type: "button",
+								class: "rs-date-picker__confirm",
+								disabled: __props.range ? !draftStart.value || !draftEnd.value : !draftDate.value || __props.withTime && !draftTime.value,
+								onClick: confirmSelection
+							}, toDisplayString(unref(t)("datePicker.confirm")), 9, _hoisted_23)])])])) : createCommentVNode("", true)]),
+							_: 1
+						}, 8, ["class"])]),
+						_: 1
+					})]),
+					_: 1
+				}, 8, ["open"])], 2),
+				visibleMessage.value ? (openBlock(), createElementBlock("p", _hoisted_24, toDisplayString(visibleMessage.value), 1)) : createCommentVNode("", true),
+				__props.hint ? (openBlock(), createElementBlock("span", _hoisted_25, toDisplayString(__props.hint), 1)) : createCommentVNode("", true)
+			], 2);
+		};
+	}
+});
+//#endregion
+export { RsDatePicker_vue_vue_type_script_setup_true_lang_default as default };