@vizejs/ui 0.426.2 → 0.427.0

package/dist/calendar-C_ihbcsR.mjs

@@ -0,0 +1,218 @@
+import { h as formatIsoDate } from "./plain-date-DHX8BIlm.mjs";
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
+import { a as calendar_next_default, i as calendar_prev_default, o as calendar_heading_default, r as useCalendarCore, s as calendar_grid_default } from "./calendar-year-select-C_Hn7Jbv.mjs";
+import { r as useMultipleCalendarSelection } from "./calendar-root-Dy3WPuNT.mjs";
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createVNode, defineComponent, guardReactiveProps, normalizeProps, openBlock, renderList, renderSlot, unref, useTemplateRef } from "vue";
+//#region src/families/date-time/calendar/calendar-multiple-root.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1 = [
+	"id",
+	"dir",
+	"aria-label",
+	"aria-labelledby",
+	"aria-describedby",
+	"aria-disabled",
+	"data-state",
+	"data-dir",
+	"data-months",
+	"data-count",
+	"data-disabled",
+	"data-readonly",
+	"data-pending"
+];
+const _hoisted_2 = {
+	"data-vize-ui": "calendar-header",
+	part: "header"
+};
+const _hoisted_3 = [
+	"name",
+	"value",
+	"disabled"
+];
+//#endregion
+//#region src/families/date-time/calendar/calendar-multiple-root.vue
+var calendar_multiple_root_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "calendar-multiple-root",
+	props: {
+		id: {
+			type: null,
+			required: false
+		},
+		modelValue: {
+			type: null,
+			required: false
+		},
+		defaultValue: {
+			type: null,
+			required: false
+		},
+		maxSelections: {
+			type: null,
+			required: false
+		},
+		focusedDate: {
+			type: null,
+			required: false
+		},
+		min: {
+			type: null,
+			required: false
+		},
+		max: {
+			type: null,
+			required: false
+		},
+		isDateUnavailable: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		locale: {
+			type: null,
+			required: false
+		},
+		calendar: {
+			type: null,
+			required: false
+		},
+		numberingSystem: {
+			type: null,
+			required: false
+		},
+		dir: {
+			type: null,
+			required: false
+		},
+		weekStartsOn: {
+			type: null,
+			required: false
+		},
+		weekdayFormat: {
+			type: null,
+			required: false
+		},
+		numberOfMonths: {
+			type: null,
+			required: false
+		},
+		pagedNavigation: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		fixedWeeks: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		today: {
+			type: null,
+			required: false
+		},
+		now: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		timeZone: {
+			type: null,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		readOnly: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		name: {
+			type: null,
+			required: false
+		},
+		ariaLabel: {
+			type: null,
+			required: false
+		},
+		ariaLabelledby: {
+			type: null,
+			required: false
+		},
+		ariaDescribedby: {
+			type: null,
+			required: false
+		}
+	},
+	emits: [
+		"update:modelValue",
+		"change",
+		"toggle",
+		"update:focusedDate"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const root = useTemplateRef("root");
+		const selection = useMultipleCalendarSelection({
+			value: () => props.modelValue,
+			defaultValue: () => props.defaultValue,
+			maxSelections: () => props.maxSelections,
+			onUpdate: (value) => emit("update:modelValue", value),
+			onChange: (value, previous, event) => emit("change", value, previous, event),
+			onToggle: (date, selected, event) => emit("toggle", date, selected, event)
+		});
+		const core = useCalendarCore(props, selection.adapter, root, (date) => emit("update:focusedDate", date));
+		const { id, headingId, slotState, direction, state } = core;
+		const isoValues = computed(() => selection.value.value.map((date) => formatIsoDate(date)));
+		__expose({
+			...core.exposed,
+			value: selection.value,
+			setValue: (value) => selection.setValue(value),
+			toggle: (date) => selection.toggle(date)
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				id: unref(id),
+				ref_key: "root",
+				ref: root,
+				role: "group",
+				dir: unref(direction),
+				"aria-label": props.ariaLabel,
+				"aria-labelledby": props.ariaLabelledby ?? (props.ariaLabel ? void 0 : unref(headingId)),
+				"aria-describedby": props.ariaDescribedby,
+				"aria-disabled": unref(slotState).disabled ? "true" : void 0,
+				"data-vize-ui": "calendar",
+				part: "root",
+				"data-mode": "multiple",
+				"data-state": unref(state),
+				"data-dir": unref(direction),
+				"data-months": unref(slotState).months.length,
+				"data-count": isoValues.value.length,
+				"data-disabled": unref(slotState).disabled ? "true" : void 0,
+				"data-readonly": unref(slotState).readOnly ? "true" : void 0,
+				"data-pending": unref(slotState).pending ? "true" : void 0
+			}, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(slotState))), () => [createElementVNode("div", _hoisted_2, [
+				createVNode(calendar_prev_default),
+				createVNode(calendar_heading_default),
+				createVNode(calendar_next_default)
+			]), (openBlock(true), createElementBlock(Fragment, null, renderList(unref(slotState).months, (month) => {
+				return openBlock(), createBlock(calendar_grid_default, {
+					key: month.index,
+					"month-index": month.index
+				}, null, 8, ["month-index"]);
+			}), 128))], true), (openBlock(true), createElementBlock(Fragment, null, renderList(props.name ? isoValues.value : [], (iso) => {
+				return openBlock(), createElementBlock("input", {
+					key: iso,
+					type: "hidden",
+					name: props.name,
+					value: iso,
+					disabled: unref(slotState).disabled,
+					"data-vize-ui": "calendar-input"
+				}, null, 8, _hoisted_3);
+			}), 128))], 8, _hoisted_1);
+		};
+	}
+}), [["__scopeId", "data-v-3044e35e"]]);
+//#endregion
+export { calendar_multiple_root_default as t };

package/dist/calendar-locale-Cl5bvmuE.mjs

@@ -0,0 +1,118 @@
+import { B as toUtcDate } from "./plain-date-DHX8BIlm.mjs";
+//#region src/families/date-time/calendar/calendar-locale.ts
+const sundayFirstRegions = new Set("AG AS AU BD BR BS BT BW BZ CA CN CO DM DO ET GT GU HK HN ID IL IN JM JP KE KH KR LA MH MM MO MT MX MZ NI NP PA PE PH PK PR PT PY SA SG SV TH TT TW UM US VE VI WS YE ZA ZW".split(" "));
+const saturdayFirstRegions = new Set("AE AF BH DJ DZ EG IQ IR JO KW LY OM QA SD SY".split(" "));
+const fridayFirstRegions = new Set(["MV"]);
+const firstDayKeywords = {
+	sun: 0,
+	mon: 1,
+	tue: 2,
+	wed: 3,
+	thu: 4,
+	fri: 5,
+	sat: 6
+};
+const sundayReference = Object.freeze({
+	year: 2023,
+	month: 1,
+	day: 1
+});
+/**
+* Locale-preferred first day of week.
+*
+* Honors the `-u-fw-` Unicode extension (for example `en-US-u-fw-mon`) and
+* otherwise resolves the likely region from CLDR week data, defaulting to Monday.
+*/
+function resolveWeekStart(locale) {
+	try {
+		const firstDay = /-u(?:-[a-z0-9]{2,8})*?-fw-([a-z]{3})/iu.exec(locale)?.[1]?.toLowerCase();
+		const keyword = firstDay === void 0 ? void 0 : firstDayKeywords[firstDay];
+		if (keyword !== void 0) return keyword;
+		const region = new Intl.Locale(locale).maximize().region ?? "";
+		if (sundayFirstRegions.has(region)) return 0;
+		if (saturdayFirstRegions.has(region)) return 6;
+		if (fridayFirstRegions.has(region)) return 5;
+	} catch {}
+	return 1;
+}
+/** Normalize a consumer week start, falling back to the locale preference. */
+function normalizeWeekday(value, locale) {
+	if (typeof value === "number" && Number.isInteger(value) && value >= 0 && value <= 6) return value;
+	return resolveWeekStart(locale);
+}
+function createFormatter(options, format) {
+	const base = {
+		...format,
+		timeZone: "UTC"
+	};
+	if (options.calendar) base.calendar = options.calendar;
+	if (options.numberingSystem) base.numberingSystem = options.numberingSystem;
+	try {
+		return new Intl.DateTimeFormat(options.locale, base);
+	} catch {
+		return new Intl.DateTimeFormat("en-US", {
+			...format,
+			timeZone: "UTC"
+		});
+	}
+}
+/**
+* Create Intl formatters for calendar labels.
+*
+* Dates are formatted as UTC midnight with `timeZone: "UTC"`, so labels never
+* depend on the host time zone.
+*/
+function createCalendarFormatters(options) {
+	const dayFormatter = createFormatter(options, { day: "numeric" });
+	const fullFormatter = createFormatter(options, { dateStyle: "full" });
+	const monthYearFormatter = createFormatter(options, {
+		month: "long",
+		year: "numeric"
+	});
+	const monthFormatter = createFormatter(options, { month: "long" });
+	const yearFormatter = createFormatter(options, { year: "numeric" });
+	const weekdayFormatters = /* @__PURE__ */ new Map();
+	const weekdayFormatter = (format) => {
+		let formatter = weekdayFormatters.get(format);
+		if (!formatter) {
+			formatter = createFormatter(options, { weekday: format === "full" ? "long" : format });
+			weekdayFormatters.set(format, formatter);
+		}
+		return formatter;
+	};
+	const firstOfMonth = (month) => toUtcDate({
+		year: month.year,
+		month: month.month,
+		day: 1
+	});
+	return {
+		day: (date) => dayFormatter.format(toUtcDate(date)),
+		fullDate: (date) => fullFormatter.format(toUtcDate(date)),
+		monthYear: (month) => monthYearFormatter.format(firstOfMonth(month)),
+		monthRange: (first, last) => first.year === last.year && first.month === last.month ? monthYearFormatter.format(firstOfMonth(first)) : monthYearFormatter.formatRange(firstOfMonth(first), firstOfMonth(last)),
+		monthName: (month) => monthFormatter.format(toUtcDate({
+			year: 2001,
+			month,
+			day: 1
+		})),
+		year: (year) => yearFormatter.format(toUtcDate({
+			year,
+			month: 7,
+			day: 1
+		})),
+		weekdays: (weekStartsOn, format) => Array.from({ length: 7 }, (_, offset) => {
+			const weekday = (weekStartsOn + offset) % 7;
+			const date = toUtcDate({
+				...sundayReference,
+				day: sundayReference.day + weekday
+			});
+			return {
+				weekday,
+				label: weekdayFormatter(format).format(date),
+				longLabel: weekdayFormatter("full").format(date)
+			};
+		})
+	};
+}
+//#endregion
+export { normalizeWeekday as n, resolveWeekStart as r, createCalendarFormatters as t };

package/dist/calendar-root-Dy3WPuNT.mjs

@@ -0,0 +1,324 @@
+import { h as formatIsoDate, j as normalizePlainDate, w as isSameDay } from "./plain-date-DHX8BIlm.mjs";
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
+import { a as calendar_next_default, i as calendar_prev_default, o as calendar_heading_default, r as useCalendarCore, s as calendar_grid_default } from "./calendar-year-select-C_Hn7Jbv.mjs";
+import { useControllableState } from "./controllable-state.mjs";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, guardReactiveProps, normalizeProps, openBlock, renderList, renderSlot, shallowRef, unref, useTemplateRef } from "vue";
+//#region src/families/date-time/calendar/calendar-selection.ts
+const unselected = Object.freeze({
+	selected: false,
+	rangeStart: false,
+	rangeEnd: false,
+	inRange: false,
+	preview: false
+});
+const selectedDay = Object.freeze({
+	selected: true,
+	rangeStart: true,
+	rangeEnd: true,
+	inRange: true,
+	preview: false
+});
+/** Controlled/uncontrolled single-date selection for CalendarRoot and DatePicker. */
+function useSingleCalendarSelection(options) {
+	const state = useControllableState({
+		value: () => {
+			const value = options.value();
+			return value === void 0 ? void 0 : normalizePlainDate(value);
+		},
+		defaultValue: () => normalizePlainDate(options.defaultValue()),
+		equals: isSameDay,
+		onChange: (value) => options.onUpdate(value)
+	});
+	const value = computed(() => state.value.value);
+	function setValue(next, event = null) {
+		const normalized = normalizePlainDate(next);
+		const previous = value.value;
+		const changed = state.set(normalized);
+		if (changed) options.onChange(normalized, previous, event);
+		return changed;
+	}
+	return {
+		value,
+		setValue,
+		reset: state.reset,
+		adapter: {
+			mode: "single",
+			anchorDate: () => value.value,
+			hasSelection: () => value.value !== null,
+			daySelection: (date) => isSameDay(date, value.value) ? selectedDay : unselected,
+			select: (date, event) => {
+				setValue(date, event);
+				options.onSelect?.(date, event);
+			},
+			hover: () => void 0,
+			cancel: () => false
+		}
+	};
+}
+/** Sort, de-duplicate, validate, and freeze a list of dates. */
+function normalizeDateList(value) {
+	if (!Array.isArray(value)) return Object.freeze([]);
+	const byIso = /* @__PURE__ */ new Map();
+	for (const candidate of value) {
+		const date = normalizePlainDate(candidate);
+		if (date) byIso.set(date.year * 1e4 + date.month * 100 + date.day, date);
+	}
+	return Object.freeze([...byIso.entries()].sort(([a], [b]) => a - b).map(([, date]) => date));
+}
+function sameList(left, right) {
+	return left.length === right.length && left.every((date, index) => isSameDay(date, right[index]));
+}
+/** Controlled/uncontrolled multiple-date selection that toggles dates on activation. */
+function useMultipleCalendarSelection(options) {
+	const state = useControllableState({
+		value: () => {
+			const value = options.value();
+			return value === void 0 ? void 0 : normalizeDateList(value);
+		},
+		defaultValue: () => normalizeDateList(options.defaultValue()),
+		equals: sameList,
+		onChange: (value) => options.onUpdate(value)
+	});
+	const value = computed(() => state.value.value);
+	const lastToggled = shallowRef(null);
+	function setValue(next, event = null) {
+		const normalized = normalizeDateList(next);
+		const previous = value.value;
+		const changed = state.set(normalized);
+		if (changed) options.onChange(normalized, previous, event);
+		return changed;
+	}
+	function toggle(date, event = null) {
+		const normalized = normalizePlainDate(date);
+		if (!normalized) return false;
+		const selected = value.value.some((candidate) => isSameDay(candidate, normalized));
+		const limit = options.maxSelections();
+		if (!selected && limit !== void 0 && value.value.length >= Math.max(0, Math.trunc(limit))) return false;
+		lastToggled.value = normalized;
+		return setValue(selected ? value.value.filter((candidate) => !isSameDay(candidate, normalized)) : [...value.value, normalized], event);
+	}
+	return {
+		value,
+		setValue,
+		toggle,
+		reset: state.reset,
+		adapter: {
+			mode: "multiple",
+			anchorDate: () => lastToggled.value ?? value.value[0] ?? null,
+			hasSelection: () => value.value.length > 0,
+			daySelection: (date) => value.value.some((candidate) => isSameDay(candidate, date)) ? selectedDay : unselected,
+			select: (date, event) => {
+				const wasSelected = value.value.some((candidate) => isSameDay(candidate, date));
+				if (toggle(date, event)) options.onToggle?.(date, !wasSelected, event);
+			},
+			hover: () => void 0,
+			cancel: () => false
+		}
+	};
+}
+//#endregion
+//#region src/families/date-time/calendar/calendar-root.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1 = [
+	"id",
+	"dir",
+	"aria-label",
+	"aria-labelledby",
+	"aria-describedby",
+	"aria-disabled",
+	"data-state",
+	"data-dir",
+	"data-months",
+	"data-value",
+	"data-disabled",
+	"data-readonly",
+	"data-pending"
+];
+const _hoisted_2 = {
+	"data-vize-ui": "calendar-header",
+	part: "header"
+};
+const _hoisted_3 = [
+	"name",
+	"value",
+	"disabled"
+];
+//#endregion
+//#region src/families/date-time/calendar/calendar-root.vue
+var calendar_root_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "calendar-root",
+	props: {
+		id: {
+			type: null,
+			required: false
+		},
+		modelValue: {
+			type: null,
+			required: false
+		},
+		defaultValue: {
+			type: null,
+			required: false
+		},
+		focusedDate: {
+			type: null,
+			required: false
+		},
+		min: {
+			type: null,
+			required: false
+		},
+		max: {
+			type: null,
+			required: false
+		},
+		isDateUnavailable: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		locale: {
+			type: null,
+			required: false
+		},
+		calendar: {
+			type: null,
+			required: false
+		},
+		numberingSystem: {
+			type: null,
+			required: false
+		},
+		dir: {
+			type: null,
+			required: false
+		},
+		weekStartsOn: {
+			type: null,
+			required: false
+		},
+		weekdayFormat: {
+			type: null,
+			required: false
+		},
+		numberOfMonths: {
+			type: null,
+			required: false
+		},
+		pagedNavigation: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		fixedWeeks: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		today: {
+			type: null,
+			required: false
+		},
+		now: {
+			type: Function,
+			required: false,
+			skipCheck: true
+		},
+		timeZone: {
+			type: null,
+			required: false
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		readOnly: {
+			type: Boolean,
+			required: false,
+			skipCheck: true
+		},
+		name: {
+			type: null,
+			required: false
+		},
+		ariaLabel: {
+			type: null,
+			required: false
+		},
+		ariaLabelledby: {
+			type: null,
+			required: false
+		},
+		ariaDescribedby: {
+			type: null,
+			required: false
+		}
+	},
+	emits: [
+		"update:modelValue",
+		"change",
+		"select",
+		"update:focusedDate"
+	],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const root = useTemplateRef("root");
+		const selection = useSingleCalendarSelection({
+			value: () => props.modelValue,
+			defaultValue: () => props.defaultValue,
+			onUpdate: (value) => emit("update:modelValue", value),
+			onChange: (value, previous, event) => emit("change", value, previous, event),
+			onSelect: (value, event) => emit("select", value, event)
+		});
+		const core = useCalendarCore(props, selection.adapter, root, (date) => emit("update:focusedDate", date));
+		const { id, headingId, slotState, direction, state } = core;
+		const isoValue = computed(() => selection.value.value ? formatIsoDate(selection.value.value) : "");
+		__expose({
+			...core.exposed,
+			value: selection.value,
+			setValue: (value) => selection.setValue(value)
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				id: unref(id),
+				ref_key: "root",
+				ref: root,
+				role: "group",
+				dir: unref(direction),
+				"aria-label": props.ariaLabel,
+				"aria-labelledby": props.ariaLabelledby ?? (props.ariaLabel ? void 0 : unref(headingId)),
+				"aria-describedby": props.ariaDescribedby,
+				"aria-disabled": unref(slotState).disabled ? "true" : void 0,
+				"data-vize-ui": "calendar",
+				part: "root",
+				"data-mode": "single",
+				"data-state": unref(state),
+				"data-dir": unref(direction),
+				"data-months": unref(slotState).months.length,
+				"data-value": isoValue.value || void 0,
+				"data-disabled": unref(slotState).disabled ? "true" : void 0,
+				"data-readonly": unref(slotState).readOnly ? "true" : void 0,
+				"data-pending": unref(slotState).pending ? "true" : void 0
+			}, [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(unref(slotState))), () => [createElementVNode("div", _hoisted_2, [
+				createVNode(calendar_prev_default),
+				createVNode(calendar_heading_default),
+				createVNode(calendar_next_default)
+			]), (openBlock(true), createElementBlock(Fragment, null, renderList(unref(slotState).months, (month) => {
+				return openBlock(), createBlock(calendar_grid_default, {
+					key: month.index,
+					"month-index": month.index
+				}, null, 8, ["month-index"]);
+			}), 128))], true), props.name ? (openBlock(), createElementBlock("input", {
+				key: 0,
+				type: "hidden",
+				name: props.name,
+				value: isoValue.value,
+				disabled: unref(slotState).disabled,
+				"data-vize-ui": "calendar-input"
+			}, null, 8, _hoisted_3)) : createCommentVNode("v-if", true)], 8, _hoisted_1);
+		};
+	}
+}), [["__scopeId", "data-v-0bb9418d"]]);
+//#endregion
+export { normalizeDateList as n, useMultipleCalendarSelection as r, calendar_root_default as t };

package/dist/calendar-today-Djkf8bII.d.mts

@@ -0,0 +1,31 @@
+import { s as PlainDate } from "./plain-date-By3bTWQG.mjs";
+import { ComputedRef } from "vue";
+
+//#region src/families/date-time/calendar/calendar-today.d.ts
+/** Clock source accepted by date-time components: epoch milliseconds or a `Date`. */
+type DateTimeNow = () => number | Date;
+/** Reactive inputs for {@link useToday}. */
+interface TodayOptions {
+  /** Explicit current date. Wins over every clock. */
+  readonly today: () => PlainDate | null | undefined;
+  /** Injectable clock; evaluated during setup on the server and the client. */
+  readonly now: () => DateTimeNow | undefined;
+  /** IANA time zone used to turn clock instants into a calendar date. */
+  readonly timeZone: () => string | null | undefined;
+}
+/**
+ * Resolve "today" without making server output depend on the wall clock.
+ *
+ * Resolution order:
+ * 1. `today` — an explicit date, deterministic everywhere.
+ * 2. `now` — an injected clock (for example the request timestamp), read in
+ *    `timeZone`, else the nearest `LocaleProvider` time zone, else `UTC`.
+ *    Server and client must inject the same instant to hydrate cleanly.
+ * 3. Otherwise `null` during SSR and hydration. After mount the host clock is
+ *    read once in `timeZone`, the provided locale time zone, or the host zone.
+ *
+ * Must be called during component setup.
+ */
+declare function useToday(options: TodayOptions): ComputedRef<PlainDate | null>;
+//#endregion
+export { TodayOptions as n, useToday as r, DateTimeNow as t };