sard 1.0.0 → 1.0.2

package/components/calendar/calendar-month.js

@@ -0,0 +1,176 @@
+import { getDaysBeforeFirstDay, getDaysInMonth, getNextMonthHeadDays, getPrevMonthTailDays, toDateNumber } from "../../utils/date.js";
+import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, renderList, toDisplayString } from "vue";
+//#region packages/sard/components/calendar/calendar-month.vue
+const _hoisted_1 = ["onClick"];
+var calendar_month_default = /*@__PURE__*/ defineComponent({
+	__name: "calendar-month",
+	props: {
+		year: {
+			type: Number,
+			required: true
+		},
+		month: {
+			type: Number,
+			required: true
+		},
+		type: {
+			type: String,
+			required: true
+		},
+		minDate: {
+			type: Date,
+			required: true
+		},
+		maxDate: {
+			type: Date,
+			required: true
+		},
+		currentDates: {
+			type: Array,
+			required: true
+		},
+		formatter: {
+			type: Function,
+			required: false
+		},
+		disabledDate: {
+			type: Function,
+			required: false
+		},
+		todayNumber: {
+			type: Number,
+			required: true
+		},
+		weekStartsOn: {
+			type: Number,
+			required: true
+		},
+		severalMonths: {
+			type: Boolean,
+			required: false
+		},
+		t: {
+			type: Function,
+			required: true
+		},
+		bem: {
+			type: null,
+			required: true
+		},
+		startDateText: {
+			type: String,
+			required: false
+		},
+		endDateText: {
+			type: String,
+			required: false
+		},
+		sameDateText: {
+			type: String,
+			required: false
+		}
+	},
+	emits: ["day-click"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const days = computed(() => {
+			return getDaysInMonth(props.year, props.month);
+		});
+		const daysBefore = computed(() => {
+			return getDaysBeforeFirstDay(props.year, props.month, props.weekStartsOn);
+		});
+		const allDays = computed(() => {
+			const currentDays = Array(days.value).fill(0).map((_, i) => new Date(props.year, props.month, i + 1));
+			if (props.severalMonths) return currentDays;
+			const prevMonthTailDays = getPrevMonthTailDays(props.year, props.month, props.weekStartsOn);
+			const nextMonthHeadDays = getNextMonthHeadDays(props.year, props.month, props.weekStartsOn);
+			return [
+				...prevMonthTailDays,
+				...currentDays,
+				...nextMonthHeadDays
+			];
+		});
+		function withinMonth(i) {
+			return props.severalMonths ? true : i >= daysBefore.value && i < daysBefore.value + days.value;
+		}
+		const types = {
+			same: "same",
+			start: "start",
+			middle: "middle",
+			end: "end",
+			selected: "selected",
+			normal: "normal"
+		};
+		const daysInfo = computed(() => {
+			return allDays.value.map((date, i) => {
+				const dateNumber = toDateNumber(date);
+				const within = withinMonth(i);
+				let disabled = false;
+				if (!within) disabled = true;
+				else {
+					if (props.disabledDate) disabled = props.disabledDate(date);
+					if (dateNumber < toDateNumber(props.minDate) || dateNumber > toDateNumber(props.maxDate)) disabled = true;
+				}
+				const selected = within && props.type !== "range" && props.currentDates.some((d) => toDateNumber(d) === dateNumber);
+				const isStart = within && props.type === "range" && props.currentDates[0] && toDateNumber(props.currentDates[0]) === dateNumber;
+				const isEnd = within && props.type === "range" && props.currentDates[1] && toDateNumber(props.currentDates[1]) === dateNumber;
+				const isMiddle = within && props.type === "range" && props.currentDates.length === 2 && dateNumber > toDateNumber(props.currentDates[0]) && dateNumber < toDateNumber(props.currentDates[1]);
+				const day = {
+					date,
+					disabled,
+					top: "",
+					text: date.getDate() + "",
+					bottom: isStart && isEnd ? props.sameDateText || `${props.t("start")}/${props.t("end")}` : isStart ? props.startDateText || props.t("start") : isEnd ? props.endDateText || props.t("end") : "",
+					type: isStart && isEnd ? "same" : isStart ? "start" : isMiddle ? "middle" : isEnd ? "end" : selected ? "selected" : "normal",
+					today: props.todayNumber === dateNumber
+				};
+				if (within && props.formatter) props.formatter(day);
+				const type = types[day.type];
+				return {
+					day,
+					style: [day.style, { marginLeft: props.severalMonths && i === 0 ? daysBefore.value / 7 * 100 + "%" : "" }],
+					className: [
+						props.bem.e("day"),
+						props.bem.em("day", type, type !== "normal"),
+						props.bem.em("day", "without", !within),
+						props.bem.em("day", "disabled", disabled),
+						props.bem.em("day", "today", day.today),
+						day.className
+					]
+				};
+			});
+		});
+		const onDayClick = (day) => {
+			if (!day.disabled) emit("day-click", day.date);
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(__props.bem.e("month")) }, [__props.severalMonths ? (openBlock(), createElementBlock("div", {
+				key: 0,
+				class: normalizeClass(__props.bem.e("month-title"))
+			}, toDisplayString(__props.t("monthTitle", {
+				year: __props.year,
+				month: __props.month + 1
+			})), 3)) : createCommentVNode("v-if", true), createElementVNode("div", { class: normalizeClass(__props.bem.e("days")) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(daysInfo.value, (item, i) => {
+				return openBlock(), createElementBlock("div", {
+					key: i,
+					class: normalizeClass(item.className),
+					style: normalizeStyle(item.style),
+					onClick: ($event) => onDayClick(item.day)
+				}, [
+					item.day.top ? (openBlock(), createElementBlock("div", {
+						key: 0,
+						class: normalizeClass(__props.bem.e("day-top"))
+					}, toDisplayString(item.day.top), 3)) : createCommentVNode("v-if", true),
+					createTextVNode(" " + toDisplayString(item.day.text) + " ", 1),
+					item.day.bottom ? (openBlock(), createElementBlock("div", {
+						key: 1,
+						class: normalizeClass(__props.bem.e("day-bottom"))
+					}, toDisplayString(item.day.bottom), 3)) : createCommentVNode("v-if", true)
+				], 14, _hoisted_1);
+			}), 128)), createElementVNode("div", { class: normalizeClass(__props.bem.e("mark")) }, toDisplayString(__props.month + 1), 3)], 2)], 2);
+		};
+	}
+});
+//#endregion
+export { calendar_month_default as default };

package/components/calendar/calendar.d.ts

@@ -0,0 +1,27 @@
+import { type CalendarProps } from './common';
+declare const __VLS_export: import("vue").DefineComponent<CalendarProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    change: (value: string | string[] | Date | Date[]) => any;
+    "update:modelValue": (value: string | string[] | Date | Date[]) => any;
+}, string, import("vue").PublicProps, Readonly<CalendarProps> & Readonly<{
+    onChange?: ((value: string | string[] | Date | Date[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string | string[] | Date | Date[]) => any) | undefined;
+}>, {
+    min: Date;
+    max: Date;
+    type: import("./common").CalendarType;
+    modelValue: Date | Date[] | string | string[];
+    currentDate: Date;
+    disabledDate: (date: Date) => boolean;
+    maxDays: number;
+    overMaxDays: () => void;
+    weekStartsOn: number;
+    formatter: (day: import("./common").CalendarDay) => void;
+    allowSameDay: boolean;
+    severalMonths: boolean;
+    valueFormat: string;
+    startDateText: string;
+    endDateText: string;
+    sameDateText: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/components/calendar/calendar.js

@@ -0,0 +1,336 @@
+import { createBem } from "../../utils/bem.js";
+import { formatDate, getNextMonthDate, getPrevMonthDate, minmaxDate, parseDate, toDateNumber, toMonthNumber } from "../../utils/date.js";
+import { toArray } from "../../utils/array.js";
+import { useScrollSide } from "../../use/useScrollSide.js";
+import { useInPopup } from "../popup/common.js";
+import { useTranslateWithPrefix } from "../../locale/index.js";
+import button_default from "../button/button.js";
+import { defaultCalendarProps, getMaxDate, getMinDate, sortDates, weeksIndex } from "./common.js";
+import calendar_month_default from "./calendar-month.js";
+import popout_default from "../popout/popout.js";
+import datetime_picker_default from "../datetime-picker/datetime-picker.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeDefaults, normalizeClass, openBlock, ref, renderList, toDisplayString, toRaw, unref, useTemplateRef, watch, withCtx } from "vue";
+import { Left, Right } from "@sard/icons";
+//#region packages/sard/components/calendar/calendar.vue
+var calendar_default = /*@__PURE__*/ defineComponent({
+	__name: "calendar",
+	props: /*@__PURE__*/ mergeDefaults({
+		type: {
+			type: String,
+			required: false
+		},
+		modelValue: {
+			type: [
+				Date,
+				Array,
+				String
+			],
+			required: false
+		},
+		min: {
+			type: Date,
+			required: false
+		},
+		max: {
+			type: Date,
+			required: false
+		},
+		currentDate: {
+			type: Date,
+			required: false
+		},
+		disabledDate: {
+			type: Function,
+			required: false
+		},
+		maxDays: {
+			type: Number,
+			required: false
+		},
+		overMaxDays: {
+			type: Function,
+			required: false
+		},
+		weekStartsOn: {
+			type: Number,
+			required: false
+		},
+		formatter: {
+			type: Function,
+			required: false
+		},
+		allowSameDay: {
+			type: Boolean,
+			required: false
+		},
+		severalMonths: {
+			type: Boolean,
+			required: false
+		},
+		valueFormat: {
+			type: String,
+			required: false
+		},
+		startDateText: {
+			type: String,
+			required: false
+		},
+		endDateText: {
+			type: String,
+			required: false
+		},
+		sameDateText: {
+			type: String,
+			required: false
+		}
+	}, defaultCalendarProps),
+	emits: ["update:modelValue", "change"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const bem = createBem("calendar");
+		const { t } = useTranslateWithPrefix("calendar");
+		const minDate = computed(() => {
+			return props.min || getMinDate(props.severalMonths);
+		});
+		const maxDate = computed(() => {
+			const maxDate = props.max || getMaxDate(props.severalMonths);
+			return maxDate.getTime() < minDate.value.getTime() ? new Date(minDate.value) : maxDate;
+		});
+		const toDate = (date) => {
+			if (date instanceof Date) return date;
+			return parseDate(date, props.valueFormat);
+		};
+		const makeDate = (date) => {
+			return Array.isArray(date) ? date.map((item) => toDate(item)) : toDate(date);
+		};
+		const normalizeValue = (value) => {
+			return value ? makeDate(value) : props.type === "single" ? void 0 : [];
+		};
+		const innerValue = ref(normalizeValue(props.modelValue));
+		let currentEmitValue = innerValue.value;
+		watch(() => toRaw(props.modelValue), (value) => {
+			if (currentEmitValue !== value) {
+				innerValue.value = normalizeValue(value);
+				currentEmitValue = value;
+			}
+		});
+		const getInitialCurrentDate = () => {
+			let date = /* @__PURE__ */ new Date();
+			const value = toArray(innerValue.value)[0];
+			if (value) date = value;
+			if (props.currentDate) date = props.currentDate;
+			return minmaxDate(date, minDate.value, maxDate.value);
+		};
+		const innerCurrentDate = ref(getInitialCurrentDate());
+		watch(() => props.currentDate, () => {
+			innerCurrentDate.value = minmaxDate(props.currentDate || /* @__PURE__ */ new Date(), minDate.value, maxDate.value);
+		});
+		watch(innerValue, () => {
+			const onlyOneDate = Array.isArray(innerValue.value) ? innerValue.value.length === 1 ? innerValue.value[0] : void 0 : innerValue.value;
+			if (onlyOneDate && toMonthNumber(onlyOneDate) !== toMonthNumber(innerCurrentDate.value)) innerCurrentDate.value = onlyOneDate;
+		});
+		const startDate = ref(props.type === "range" && Array.isArray(innerValue.value) && innerValue.value.length === 1 ? innerValue.value[0] : void 0);
+		const onPrevMonthClick = () => {
+			innerCurrentDate.value = getPrevMonthDate(innerCurrentDate.value);
+		};
+		const onNextMonthClick = () => {
+			innerCurrentDate.value = getNextMonthDate(innerCurrentDate.value);
+		};
+		const pickerVisible = ref(false);
+		const pickerValue = ref(innerCurrentDate.value);
+		const onMonthClick = () => {
+			pickerValue.value = innerCurrentDate.value;
+			pickerVisible.value = true;
+		};
+		const onPickerConfirm = () => {
+			if (toMonthNumber(innerCurrentDate.value) !== toMonthNumber(pickerValue.value)) innerCurrentDate.value = pickerValue.value;
+		};
+		const weeks = computed(() => {
+			return weeksIndex.slice(props.weekStartsOn).concat(weeksIndex.slice(0, props.weekStartsOn));
+		});
+		const months = computed(() => {
+			if (!props.severalMonths) return [[innerCurrentDate.value.getFullYear(), innerCurrentDate.value.getMonth()]];
+			const minYear = minDate.value.getFullYear();
+			const minMonth = minDate.value.getMonth();
+			const maxYear = maxDate.value.getFullYear();
+			const maxMonth = maxDate.value.getMonth();
+			const months = (maxYear - minYear) * 12 + (maxMonth - minMonth + 1);
+			return Array(months).fill(0).map((_, i) => {
+				return [minYear + Math.floor((minMonth + i) / 12), (minMonth + i) % 12];
+			});
+		});
+		const todayNumber = toDateNumber(/* @__PURE__ */ new Date());
+		const currentDates = computed(() => {
+			let dates;
+			if (props.type === "range" && startDate.value) dates = [startDate.value];
+			else if (Array.isArray(innerValue.value)) dates = innerValue.value;
+			else if (innerValue.value) dates = [innerValue.value];
+			else dates = [];
+			return dates;
+		});
+		const onDayClick = (date) => {
+			let nextValue;
+			if (props.type === "single") nextValue = date;
+			else if (props.type === "multiple") {
+				if (Array.isArray(innerValue.value)) if (innerValue.value.some((d) => toDateNumber(d) === toDateNumber(date))) nextValue = innerValue.value.filter((d) => toDateNumber(d) !== toDateNumber(date));
+				else {
+					if (innerValue.value.length >= props.maxDays) {
+						props.overMaxDays?.();
+						return;
+					}
+					nextValue = sortDates(innerValue.value.concat(date));
+				}
+			} else if (props.type === "range") {
+				if (startDate.value) {
+					const startDays = toDateNumber(startDate.value);
+					const endDays = toDateNumber(date);
+					if (!props.allowSameDay && startDays === endDays) return;
+					if (endDays < startDays) {
+						startDate.value = date;
+						return;
+					}
+					let endDate = date;
+					if (endDays - startDays + 1 > props.maxDays) {
+						props.overMaxDays?.();
+						endDate = new Date(startDate.value);
+						endDate.setDate(endDate.getDate() + (props.maxDays - 1));
+					}
+					nextValue = [startDate.value, endDate];
+				} else nextValue = [];
+				startDate.value = startDate.value ? void 0 : date;
+			}
+			if (nextValue !== void 0) {
+				innerValue.value = nextValue;
+				const emitValue = props.valueFormat ? Array.isArray(nextValue) ? nextValue.map((item) => formatDate(item, props.valueFormat)) : formatDate(nextValue, props.valueFormat) : nextValue;
+				currentEmitValue = emitValue;
+				emit("update:modelValue", emitValue);
+				emit("change", emitValue);
+			}
+		};
+		const inPopup = useInPopup();
+		const preventPageScroll = computed(() => {
+			return inPopup && !props.severalMonths;
+		});
+		const scrollSide = useScrollSide(useTemplateRef("scroll"), { direction: "vertical" });
+		const bodyClass = computed(() => {
+			return [bem.e("body"), bem.em("body", scrollSide.vertical)];
+		});
+		const calendarClass = computed(() => {
+			return [
+				bem.b(),
+				bem.m("several", props.severalMonths),
+				bem.m("no-scroll", preventPageScroll.value)
+			];
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(calendarClass.value) }, [
+				createElementVNode("div", { class: normalizeClass(unref(bem).e("header")) }, [!__props.severalMonths ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: normalizeClass(unref(bem).e("toolbar"))
+				}, [
+					createVNode(button_default, {
+						variant: "link",
+						color: "secondary",
+						class: normalizeClass(unref(bem).e("prev-month")),
+						disabled: unref(toMonthNumber)(innerCurrentDate.value) <= unref(toMonthNumber)(minDate.value),
+						onClick: onPrevMonthClick
+					}, {
+						default: withCtx(() => [createVNode(unref(Left))]),
+						_: 1
+					}, 8, ["class", "disabled"]),
+					createVNode(button_default, {
+						variant: "link",
+						color: "secondary",
+						onClick: onMonthClick
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(unref(t)("monthTitle", {
+							year: innerCurrentDate.value.getFullYear(),
+							month: String(innerCurrentDate.value.getMonth() + 1).padStart(2, "0")
+						})), 1)]),
+						_: 1
+					}),
+					createVNode(button_default, {
+						variant: "link",
+						color: "secondary",
+						class: normalizeClass(unref(bem).e("next-month")),
+						disabled: unref(toMonthNumber)(innerCurrentDate.value) >= unref(toMonthNumber)(maxDate.value),
+						onClick: onNextMonthClick
+					}, {
+						default: withCtx(() => [createVNode(unref(Right))]),
+						_: 1
+					}, 8, ["class", "disabled"])
+				], 2)) : createCommentVNode("v-if", true), createElementVNode("div", { class: normalizeClass(unref(bem).e("week")) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(weeks.value, (item, i) => {
+					return openBlock(), createElementBlock("div", {
+						key: i,
+						class: normalizeClass(unref(bem).e("week-item"))
+					}, toDisplayString(unref(t)(`weeks.${item}`)), 3);
+				}), 128))], 2)], 2),
+				createElementVNode("div", { class: normalizeClass(bodyClass.value) }, [createElementVNode("div", {
+					ref: "scroll",
+					class: normalizeClass(unref(bem).e("scroll"))
+				}, [(openBlock(true), createElementBlock(Fragment, null, renderList(months.value, (month, i) => {
+					return openBlock(), createBlock(calendar_month_default, {
+						key: i,
+						year: month[0],
+						month: month[1],
+						type: __props.type,
+						"min-date": minDate.value,
+						"max-date": maxDate.value,
+						"current-dates": currentDates.value,
+						formatter: __props.formatter,
+						"disabled-date": __props.disabledDate,
+						"today-number": unref(todayNumber),
+						"week-starts-on": __props.weekStartsOn,
+						"several-months": __props.severalMonths,
+						"start-date-text": __props.startDateText,
+						"end-date-text": __props.endDateText,
+						"same-date-text": __props.sameDateText,
+						t: unref(t),
+						bem: unref(bem),
+						onDayClick
+					}, null, 8, [
+						"year",
+						"month",
+						"type",
+						"min-date",
+						"max-date",
+						"current-dates",
+						"formatter",
+						"disabled-date",
+						"today-number",
+						"week-starts-on",
+						"several-months",
+						"start-date-text",
+						"end-date-text",
+						"same-date-text",
+						"t",
+						"bem"
+					]);
+				}), 128))], 2)], 2),
+				!__props.severalMonths ? (openBlock(), createBlock(popout_default, {
+					key: 0,
+					visible: pickerVisible.value,
+					"onUpdate:visible": _cache[1] || (_cache[1] = ($event) => pickerVisible.value = $event),
+					type: "compact",
+					onConfirm: onPickerConfirm
+				}, {
+					default: withCtx(() => [createVNode(datetime_picker_default, {
+						type: "yM",
+						modelValue: pickerValue.value,
+						"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => pickerValue.value = $event),
+						min: minDate.value,
+						max: maxDate.value
+					}, null, 8, [
+						"modelValue",
+						"min",
+						"max"
+					])]),
+					_: 1
+				}, 8, ["visible"])) : createCommentVNode("v-if", true)
+			], 2);
+		};
+	}
+});
+//#endregion
+export { calendar_default as default };

package/components/calendar/common.d.ts

@@ -0,0 +1,64 @@
+import { type LocaleTranslate } from '../../locale';
+import { type Bem } from '../../utils';
+import { type DefaultProps } from '../config';
+import type { StyleValue } from 'vue';
+export type CalendarType = 'single' | 'multiple' | 'range';
+export interface CalendarDay {
+    date: Date;
+    disabled: boolean;
+    type: 'same' | 'start' | 'middle' | 'end' | 'selected' | 'normal';
+    today: boolean;
+    top: string;
+    text: string | number;
+    bottom: string;
+    className?: string;
+    style?: StyleValue;
+}
+export interface CalendarProps {
+    type?: CalendarType;
+    modelValue?: Date | Date[] | string | string[];
+    min?: Date;
+    max?: Date;
+    currentDate?: Date;
+    disabledDate?: (date: Date) => boolean;
+    maxDays?: number;
+    overMaxDays?: () => void;
+    weekStartsOn?: number;
+    formatter?: (day: CalendarDay) => void;
+    allowSameDay?: boolean;
+    severalMonths?: boolean;
+    valueFormat?: string;
+    startDateText?: string;
+    endDateText?: string;
+    sameDateText?: string;
+}
+export declare const defaultCalendarProps: DefaultProps<CalendarProps>;
+export interface CalendarEmits {
+    (e: 'update:modelValue', value: Date | Date[] | string | string[]): void;
+    (e: 'change', value: Date | Date[] | string | string[]): void;
+}
+export interface CalendarMonthProps {
+    year: number;
+    month: number;
+    type: CalendarType;
+    minDate: Date;
+    maxDate: Date;
+    currentDates: Date[];
+    formatter?: (day: CalendarDay) => void;
+    disabledDate?: (date: Date) => boolean;
+    todayNumber: number;
+    weekStartsOn: number;
+    severalMonths?: boolean;
+    t: LocaleTranslate;
+    bem: Bem;
+    startDateText?: string;
+    endDateText?: string;
+    sameDateText?: string;
+}
+export interface CalendarMonthEmits {
+    (e: 'day-click', date: Date): void;
+}
+export declare const getMinDate: (severalMonths?: boolean) => Date;
+export declare const getMaxDate: (severalMonths?: boolean) => Date;
+export declare const sortDates: (dates: Date[]) => Date[];
+export declare const weeksIndex: number[];

package/components/calendar/common.js

@@ -0,0 +1,30 @@
+//#region packages/sard/components/calendar/common.ts
+const defaultCalendarProps = {
+	type: "single",
+	maxDays: Number.MAX_SAFE_INTEGER,
+	weekStartsOn: 0
+};
+const getMinDate = (severalMonths) => {
+	const date = /* @__PURE__ */ new Date();
+	if (severalMonths) return new Date(date.getFullYear(), date.getMonth(), 1);
+	return new Date(date.getFullYear() - 10, 0, 1);
+};
+const getMaxDate = (severalMonths) => {
+	const date = /* @__PURE__ */ new Date();
+	if (severalMonths) return new Date(date.getFullYear(), date.getMonth() + 3, 0);
+	return new Date(date.getFullYear() + 10, 11, 31);
+};
+const sortDates = (dates) => {
+	return dates.sort((a, b) => a.getTime() - b.getTime());
+};
+const weeksIndex = [
+	0,
+	1,
+	2,
+	3,
+	4,
+	5,
+	6
+];
+//#endregion
+export { defaultCalendarProps, getMaxDate, getMinDate, sortDates, weeksIndex };

package/components/calendar/index.css

@@ -0,0 +1 @@
+:root{--s-calendar-week-item-height:var(--s-size-2xl);--s-calendar-week-item-font-size:var(--s-font-size);--s-calendar-week-item-color:var(--s-text-color-primary);--s-calendar-month-padding:var(--s-size-2xs);--s-calendar-month-title-height:var(--s-content-height);--s-calendar-month-title-font-size:var(--s-font-size);--s-calendar-month-title-font-weight:var(--s-font-weight-bold);--s-calendar-month-title-color:var(--s-text-color-primary);--s-calendar-days-row-gap:var(--s-size-2xs);--s-calendar-days-column-gap:0;--s-calendar-day-height:50px;--s-calendar-day-font-size:var(--s-font-size);--s-calendar-day-border-radius:var(--s-border-radius);--s-calendar-day-color-selected:var(--s-white);--s-calendar-day-color-middle:var(--s-color-primary);--s-calendar-day-color-disabled:var(--s-text-color-disabled);--s-calendar-day-bg-selected:var(--s-color-primary);--s-calendar-day-bg-middle:rgba(var(--s-color-primary-rgb), var(--s-opacity-theme-bg));--s-calendar-day-top-top:var(--s-size-2xs);--s-calendar-day-top-font-size:var(--s-font-size-xs);--s-calendar-day-top-line-height:var(--s-line-height-tight);--s-calendar-day-bottom-bottom:var(--s-size-2xs);--s-calendar-day-bottom-font-size:var(--s-font-size-xs);--s-calendar-day-bottom-line-height:var(--s-line-height-tight);--s-calendar-mark-font-size:160px;--s-calendar-mark-color:var(--s-fill-color-fourth)}.s-calendar{overflow:hidden}.s-calendar--no-scroll{touch-action:pan-x}.s-calendar__header{position:relative;z-index:1}.s-calendar__header::after{position:absolute;z-index:1;pointer-events:none;touch-action:none;opacity:1;content:"";left:0;right:0;transform:scaleY(0.5);bottom:0;border-bottom:var(--s-border-width) var(--s-border-style) var(--s-border-color);transform-origin:bottom center}.s-calendar__toolbar{display:flex;justify-content:center;align-items:center}.s-calendar__prev-month,.s-calendar__next-month{font-size:16px}:root[dir=rtl] .s-calendar__prev-month,:root[dir=rtl] .s-calendar__next-month{transform:rotateY(180deg)}.s-calendar__week{display:flex;align-items:center}.s-calendar__week-item{display:flex;justify-content:center;align-items:center;flex:1;height:var(--s-calendar-week-item-height);font-size:var(--s-calendar-week-item-font-size);color:var(--s-calendar-week-item-color)}.s-calendar__body{position:relative}.s-calendar--several .s-calendar__body{height:360px;position:relative}.s-calendar--several .s-calendar__body::before,.s-calendar--several .s-calendar__body::after{content:"";position:absolute;left:0;right:0;z-index:10;height:10px;overflow:hidden;box-shadow:none;touch-action:none;pointer-events:none;transition:box-shadow var(--s-duration)}.s-calendar--several .s-calendar__body::before{top:0}.s-calendar--several .s-calendar__body::after{bottom:0}.s-calendar--several .s-calendar__body--none::before,.s-calendar--several .s-calendar__body--end::before{box-shadow:var(--s-box-shadow-top)}.s-calendar--several .s-calendar__body--none::after,.s-calendar--several .s-calendar__body--start::after{box-shadow:var(--s-box-shadow-bottom)}.s-calendar--several .s-calendar__scroll{height:100%;overflow-x:hidden;overflow-y:auto}.s-calendar__month{position:relative;padding:var(--s-calendar-month-padding)}.s-calendar__month-title{display:flex;justify-content:center;align-items:center;height:var(--s-calendar-month-title-height);font-size:var(--s-calendar-month-title-font-size);font-weight:var(--s-calendar-month-title-font-weight);color:var(--s-calendar-month-title-color)}.s-calendar__days{display:grid;grid-template-columns:repeat(7, 1fr);row-gap:var(--s-calendar-days-row-gap);column-gap:var(--s-calendar-days-column-gap)}.s-calendar__day{position:relative;z-index:1;height:var(--s-calendar-day-height);display:flex;justify-content:center;align-items:center;font-size:var(--s-calendar-day-font-size);line-height:var(--s-calendar-day-height);cursor:pointer}.s-calendar__day--today{font-weight:var(--s-font-weight-bold)}.s-calendar__day--disabled{color:var(--s-calendar-day-color-disabled);cursor:not-allowed}.s-calendar__day--selected,.s-calendar__day--same{border-radius:var(--s-calendar-day-border-radius);color:var(--s-calendar-day-color-selected);background:var(--s-calendar-day-bg-selected)}.s-calendar__day--start,.s-calendar__day--end{color:var(--s-calendar-day-color-selected);background:var(--s-calendar-day-bg-selected)}:root:not([dir=rtl]) .s-calendar__day--start{border-top-left-radius:var(--s-calendar-day-border-radius);border-bottom-left-radius:var(--s-calendar-day-border-radius)}:root[dir=rtl] .s-calendar__day--start{border-top-right-radius:var(--s-calendar-day-border-radius);border-bottom-right-radius:var(--s-calendar-day-border-radius)}:root:not([dir=rtl]) .s-calendar__day--end{border-top-right-radius:var(--s-calendar-day-border-radius);border-bottom-right-radius:var(--s-calendar-day-border-radius)}:root[dir=rtl] .s-calendar__day--end{border-top-left-radius:var(--s-calendar-day-border-radius);border-bottom-left-radius:var(--s-calendar-day-border-radius)}.s-calendar__day--middle{color:var(--s-calendar-day-color-middle);background:var(--s-calendar-day-bg-middle)}.s-calendar__day-top,.s-calendar__day-bottom{position:absolute;left:0;right:0;z-index:1;display:flex;justify-content:center;align-items:center}.s-calendar__day-top{top:var(--s-calendar-day-top-top);font-size:var(--s-calendar-day-top-font-size);line-height:var(--s-calendar-day-top-line-height)}.s-calendar__day-bottom{bottom:var(--s-calendar-day-bottom-bottom);font-size:var(--s-calendar-day-bottom-font-size);line-height:var(--s-calendar-day-bottom-line-height)}.s-calendar__mark{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;font-size:var(--s-calendar-mark-font-size);color:var(--s-calendar-mark-color);pointer-events:none}

package/components/calendar/index.d.ts

@@ -0,0 +1,5 @@
+import { type EnhancedComponent } from '../../utils';
+import _Calendar from './calendar.vue';
+export declare const Calendar: EnhancedComponent<typeof _Calendar>;
+export default Calendar;
+export type { CalendarDay, CalendarType, CalendarProps, CalendarEmits, CalendarMonthProps, CalendarMonthEmits, } from './common';

package/components/calendar/index.js

@@ -0,0 +1,6 @@
+import { enhanceComponent } from "../../utils/component.js";
+import calendar_default from "./calendar.js";
+//#region packages/sard/components/calendar/index.ts
+const Calendar = enhanceComponent(calendar_default);
+//#endregion
+export { Calendar, Calendar as default };