vectis-ui 0.8.1 → 0.9.1

package/dist/components/VCalendar/VCalendar.vue_vue_type_script_setup_true_lang.js

@@ -10,20 +10,21 @@ import { useRootAttrs as re } from "../../composables/useRootAttrs.js";
 import { useTimer as ie } from "../../composables/useTimer.js";
 import ae from "../VMenu/VMenu.js";
 import oe from "../VMenu/VMenuItem.js";
-import { arrow_drop_down as se } from "../VIcon/icons/arrow_drop_down.js";
-import { firstDayOfWeekFor as ce, formatDateDisplay as o, formatDisplayRange as le } from "../../utils/date.js";
-import { hourCycleFor as ue, minutesOf as s } from "../../utils/time.js";
-import { monthWeeks as de, monthsOfYear as fe, normalizeWeekdays as pe, stepAnchor as me, timeOf as he, timesOf as ge, todayISO as c, visibleDays as _e, visibleRange as ve, windowOf as ye } from "./layout.js";
-import be from "./VCalendarMonth.js";
-import xe from "./VCalendarTimeGrid.js";
-import Se from "./VCalendarYear.js";
-import { Fragment as Ce, computed as l, createBlock as u, createCommentVNode as we, createElementBlock as d, createElementVNode as f, createSlots as p, createTextVNode as m, createVNode as h, defineComponent as g, guardReactiveProps as _, mergeModels as v, mergeProps as y, normalizeClass as Te, normalizeProps as b, normalizeStyle as Ee, onMounted as De, openBlock as x, ref as S, renderList as Oe, renderSlot as C, toDisplayString as w, unref as T, useId as ke, useModel as E, withCtx as D } from "vue";
+import { useLiveAnnouncer as se } from "../../composables/useLiveAnnouncer.js";
+import { arrow_drop_down as ce } from "../VIcon/icons/arrow_drop_down.js";
+import { firstDayOfWeekFor as le, formatDateDisplay as o, formatDisplayRange as ue } from "../../utils/date.js";
+import { hourCycleFor as de, minutesOf as s } from "../../utils/time.js";
+import { monthWeeks as fe, monthsOfYear as pe, normalizeWeekdays as me, sameTimes as he, stepAnchor as ge, timeOf as _e, timesOf as ve, todayISO as c, visibleDays as ye, visibleRange as be, windowOf as xe } from "./layout.js";
+import Se from "./VCalendarMonth.js";
+import Ce from "./VCalendarTimeGrid.js";
+import we from "./VCalendarYear.js";
+import { Fragment as Te, computed as l, createBlock as u, createCommentVNode as Ee, createElementBlock as d, createElementVNode as f, createSlots as p, createTextVNode as m, createVNode as h, defineComponent as g, guardReactiveProps as _, mergeModels as v, mergeProps as y, normalizeClass as De, normalizeProps as b, normalizeStyle as Oe, onMounted as ke, openBlock as x, ref as S, renderList as Ae, renderSlot as C, toDisplayString as w, unref as T, useId as je, useModel as E, watch as D, withCtx as O } from "vue";
 //#region src/components/VCalendar/VCalendar.vue?vue&type=script&setup=true&lang.ts
-var Ae = ["data-disabled"], je = ["aria-label", "aria-roledescription"], Me = { class: "v-calendar-toolbar" }, Ne = { class: "v-calendar-nav" }, Pe = { class: "v-calendar-actions" }, Fe = {
+var Me = ["data-disabled"], Ne = ["aria-roledescription", "aria-label"], Pe = { class: "v-calendar-toolbar" }, Fe = { class: "v-calendar-nav" }, Ie = { class: "v-calendar-actions" }, Le = {
 	class: "v-visually-hidden",
 	role: "status",
 	"aria-live": "polite"
-}, O = /*@__PURE__*/ g({
+}, k = /*@__PURE__*/ g({
 	inheritAttrs: !1,
 	__name: "VCalendar",
 	props: /*@__PURE__*/ v({
@@ -83,128 +84,141 @@ var Ae = ["data-disabled"], je = ["aria-label", "aria-roledescription"], Me = {
 		"update:date",
 		"update:events"
 	]),
-	setup(g, { expose: v, emit: O }) {
-		let k = g, A = E(g, "view"), j = E(g, "date"), M = E(g, "events"), N = O, P = e(), { rootClass: Ie, rootStyle: Le, forwardedAttrs: Re } = re(), F = t(() => k.locale), I = l(() => k.format ?? ue(F.value)), L = l(() => pe(k.weekdays, k.firstDayOfWeek ?? ce(F.value))), R = l(() => ye(k.dayStart, k.dayEnd)), ze = l(() => _e(j.value, A.value, L.value, k.customDays)), Be = l(() => A.value !== "month" && A.value !== "year"), Ve = l(() => A.value === "month" ? de(j.value, L.value) : []), He = l(() => A.value === "year" ? fe(j.value) : []), z = S(null), B = S(null), Ue = ie();
-		function V() {
+	setup(g, { expose: v, emit: k }) {
+		let A = g, j = E(g, "view"), M = E(g, "date"), N = E(g, "events"), P = k, F = e(), { rootClass: Re, rootStyle: ze, forwardedAttrs: Be } = re(), I = t(() => A.locale), Ve = l(() => A.format ?? de(I.value)), L = l(() => me(A.weekdays, A.firstDayOfWeek ?? le(I.value))), R = l(() => xe(A.dayStart, A.dayEnd)), He = l(() => ye(M.value, j.value, L.value, A.customDays)), Ue = l(() => j.value !== "month" && j.value !== "year"), We = l(() => j.value === "month" ? fe(M.value, L.value) : []), Ge = l(() => j.value === "year" ? pe(M.value) : []), z = S(null), B = S(null), V = ie();
+		function H() {
 			let e = /* @__PURE__ */ new Date();
-			B.value = e.getHours() * 60 + e.getMinutes(), Ue.start(V, Math.max(1e3, (60 - e.getSeconds()) * 1e3));
+			B.value = e.getHours() * 60 + e.getMinutes(), V.start(H, Math.max(1e3, (60 - e.getSeconds()) * 1e3));
 		}
-		De(() => {
-			z.value = c(), k.hideCurrentTime || V();
-			let e = s(k.scrollTime);
-			e !== null && H.value?.scrollToMinutes(e);
+		function U() {
+			let e = s(A.scrollTime);
+			e !== null && W.value?.scrollToMinutes(e);
+		}
+		ke(() => {
+			z.value = c(), A.hideCurrentTime || H(), U();
+		}), D(() => A.hideCurrentTime, (e) => {
+			if (!e) return H();
+			V.cancel(), B.value = null;
 		});
-		let H = S(null), U = S({
-			iso: j.value,
+		let W = S(null);
+		D(W, U, { flush: "post" });
+		let G = S(null), K = S({
+			iso: M.value,
 			minutes: R.value.start
-		}), W = S(j.value), G = l(() => ve(j.value, A.value, L.value, k.customDays)), K = l(() => {
-			let e = F.value;
-			return A.value === "year" ? o(G.value.start, e, { year: "numeric" }) : A.value === "month" ? o(G.value.start, e, {
+		}), q = S(M.value), J = l(() => be(M.value, j.value, L.value, A.customDays)), Y = l(() => {
+			let e = I.value;
+			return j.value === "year" ? o(J.value.start, e, { year: "numeric" }) : j.value === "month" ? o(J.value.start, e, {
 				month: "long",
 				year: "numeric"
-			}) : A.value === "day" ? o(G.value.start, e, {
+			}) : j.value === "day" ? o(J.value.start, e, {
 				weekday: "long",
 				day: "numeric",
 				month: "long",
 				year: "numeric"
-			}) : le(G.value.start, G.value.end, e, {
+			}) : ue(J.value.start, J.value.end, e, {
 				day: "numeric",
 				month: "long",
 				year: "numeric"
 			});
-		}), q = (e) => {
-			let t = P.value.calendar;
-			return e === "day" ? t.viewDay : e === "4days" ? t.view4Days : e === "week" ? t.viewWeek : e === "month" ? t.viewMonth : e === "year" ? t.viewYear : t.viewCustom(k.customDays);
-		}, J = l(() => {
-			let e = P.value.calendar;
-			return A.value === "day" ? {
+		}), X = (e) => {
+			let t = F.value.calendar;
+			return e === "day" ? t.viewDay : e === "4days" ? t.view4Days : e === "week" ? t.viewWeek : e === "month" ? t.viewMonth : e === "year" ? t.viewYear : t.viewCustom(A.customDays);
+		}, Ke = l(() => {
+			let e = F.value.calendar;
+			return j.value === "day" ? {
 				previous: e.previousDay,
 				next: e.nextDay
-			} : A.value === "week" ? {
+			} : j.value === "week" ? {
 				previous: e.previousWeek,
 				next: e.nextWeek
-			} : A.value === "month" ? {
+			} : j.value === "month" ? {
 				previous: e.previousMonth,
 				next: e.nextMonth
-			} : A.value === "year" ? {
+			} : j.value === "year" ? {
 				previous: e.previousYear,
 				next: e.nextYear
 			} : {
 				previous: e.previousPeriod,
 				next: e.nextPeriod
 			};
-		}), We = ee(() => k.label ?? P.value.calendar.label);
-		function Y(e) {
-			k.disabled || (j.value = me(j.value, A.value, e, L.value, k.customDays));
+		}), qe = ee(() => A.label ?? F.value.calendar.label);
+		function Z(e) {
+			A.disabled || (M.value = ge(M.value, j.value, e, L.value, A.customDays));
 		}
-		function X() {
-			k.disabled || (j.value = c());
+		function Je() {
+			A.disabled || (M.value = c());
 		}
-		function Ge(e) {
-			k.disabled || (A.value = e);
+		function Ye(e) {
+			A.disabled || (j.value = e);
 		}
-		function Z(e) {
-			k.disabled || N("cell-activate", {
+		function Xe(e) {
+			A.disabled || P("cell-activate", {
 				date: e.date,
-				time: he(e.minutes ?? R.value.start)
+				time: _e(e.minutes ?? R.value.start)
 			});
 		}
-		function Ke(e, t) {
-			k.disabled || (j.value = e, k.views.includes(t) && (A.value = t));
+		function Ze(e, t) {
+			A.disabled || (M.value = e, A.views.includes(t) && (j.value = t));
 		}
-		let qe = S(""), Q = `${ke()}-hint`;
-		function Je(e) {
-			qe.value = e;
+		let { polite: Qe, announce: $e } = se(), Q = `${je()}-hint`;
+		function et(e) {
+			$e(e, !1);
 		}
 		function $(e, t, n) {
-			let r = M.value.find((t) => t.id === e);
+			let r = N.value.find((t) => t.id === e);
 			if (!r) return;
-			let i = ge(r), a = {
+			let i = ve(r);
+			if (he(i, t)) return;
+			let a = {
 				...r,
 				...t
 			};
-			M.value = M.value.map((t) => t.id === e ? a : t), N(n === "resize" ? "event-resize" : "event-move", a, i);
+			N.value = N.value.map((t) => t.id === e ? a : t), P(n === "resize" ? "event-resize" : "event-move", a, i);
 		}
-		function Ye(e) {
-			N("event-create", e);
+		function tt(e) {
+			P("event-create", e);
 		}
 		return v({
-			focus: () => H.value?.focus(),
-			today: X,
-			previous: () => Y(-1),
-			next: () => Y(1),
+			focus: (e) => W.value?.focus(e),
+			el: G,
+			today: Je,
+			previous: () => Z(-1),
+			next: () => Z(1),
 			scrollTo: (e) => {
 				let t = s(e);
-				t !== null && H.value?.scrollToMinutes(t);
+				t !== null && W.value?.scrollToMinutes(t);
 			}
 		}), (e, t) => (x(), d("div", {
-			class: Te(["v-calendar", T(Ie)]),
-			style: Ee(T(Le)),
+			class: De(["v-calendar", T(Re)]),
+			style: Oe(T(ze)),
 			"data-disabled": g.disabled ? "" : void 0
-		}, [f("section", y(T(Re), {
+		}, [f("section", y({
+			ref_key: "regionEl",
+			ref: G,
+			"aria-roledescription": T(F).calendar.roleDescription
+		}, T(Be), {
 			class: "v-calendar-region",
-			"aria-label": T(We),
-			"aria-roledescription": T(P).calendar.roleDescription
+			"aria-label": T(qe)
 		}), [
-			f("div", Me, [
-				f("div", Ne, [h(a, {
-					label: J.value.previous,
+			f("div", Pe, [
+				f("div", Fe, [h(a, {
+					label: Ke.value.previous,
 					size: "sm",
 					disabled: g.disabled,
-					onClick: t[0] ||= (e) => Y(-1)
+					onClick: t[0] ||= (e) => Z(-1)
 				}, {
-					default: D(() => [h(n, {
+					default: O(() => [h(n, {
 						name: T(te),
 						mirrored: ""
 					}, null, 8, ["name"])]),
 					_: 1
 				}, 8, ["label", "disabled"]), h(a, {
-					label: J.value.next,
+					label: Ke.value.next,
 					size: "sm",
 					disabled: g.disabled,
-					onClick: t[1] ||= (e) => Y(1)
+					onClick: t[1] ||= (e) => Z(1)
 				}, {
-					default: D(() => [h(n, {
+					default: O(() => [h(n, {
 						name: T(ne),
 						mirrored: ""
 					}, null, 8, ["name"])]),
@@ -215,9 +229,9 @@ var Ae = ["data-disabled"], je = ["aria-label", "aria-roledescription"], Me = {
 					tone: "neutral",
 					size: "sm",
 					disabled: g.disabled,
-					onClick: X
+					onClick: Je
 				}, {
-					default: D(() => [m(w(T(P).calendar.today), 1)]),
+					default: O(() => [m(w(T(F).calendar.today), 1)]),
 					_: 1
 				}, 8, ["disabled"]),
 				h(r, {
@@ -225,50 +239,50 @@ var Ae = ["data-disabled"], je = ["aria-label", "aria-roledescription"], Me = {
 					as: "h2",
 					class: "v-calendar-title"
 				}, {
-					default: D(() => [m(w(K.value), 1)]),
+					default: O(() => [m(w(Y.value), 1)]),
 					_: 1
 				}),
-				f("div", Pe, [C(e.$slots, "actions"), g.views.length > 1 ? (x(), u(ae, {
+				f("div", Ie, [C(e.$slots, "actions"), g.views.length > 1 ? (x(), u(ae, {
 					key: 0,
 					size: "sm",
 					placement: "bottom-end",
 					"match-trigger": ""
 				}, {
-					trigger: D(({ triggerProps: e }) => [h(i, y({
+					trigger: O(({ triggerProps: e }) => [h(i, y({
 						variant: "outline",
 						tone: "neutral",
 						size: "sm",
 						disabled: g.disabled
-					}, e, { "aria-label": `${T(P).calendar.view}: ${q(A.value)}` }), {
-						default: D(() => [m(w(q(A.value)) + " ", 1), h(n, { name: T(se) }, null, 8, ["name"])]),
+					}, e, { "aria-label": `${T(F).calendar.view}: ${X(j.value)}` }), {
+						default: O(() => [m(w(X(j.value)) + " ", 1), h(n, { name: T(ce) }, null, 8, ["name"])]),
 						_: 1
 					}, 16, ["disabled", "aria-label"])]),
-					default: D(() => [(x(!0), d(Ce, null, Oe(g.views, (e) => (x(), u(oe, {
+					default: O(() => [(x(!0), d(Te, null, Ae(g.views, (e) => (x(), u(oe, {
 						key: e,
-						label: q(e),
-						selected: e === A.value,
-						onSelect: (t) => Ge(e)
+						label: X(e),
+						selected: e === j.value,
+						onSelect: (t) => Ye(e)
 					}, null, 8, [
 						"label",
 						"selected",
 						"onSelect"
 					]))), 128))]),
 					_: 1
-				})) : we("", !0)])
+				})) : Ee("", !0)])
 			]),
-			Be.value ? (x(), u(xe, {
+			Ue.value ? (x(), u(Ce, {
 				key: 0,
 				ref_key: "gridRef",
-				ref: H,
-				focused: U.value,
-				"onUpdate:focused": t[2] ||= (e) => U.value = e,
+				ref: W,
+				focused: K.value,
+				"onUpdate:focused": t[2] ||= (e) => K.value = e,
 				class: "v-calendar-view",
-				days: ze.value,
-				events: M.value,
+				days: He.value,
+				events: N.value,
 				"time-window": R.value,
 				"slot-duration": g.slotDuration,
-				locale: T(F),
-				format: I.value,
+				locale: T(I),
+				format: Ve.value,
 				today: z.value,
 				now: g.hideCurrentTime ? null : B.value,
 				editable: !g.readonly && !g.disabled,
@@ -277,27 +291,27 @@ var Ae = ["data-disabled"], je = ["aria-label", "aria-roledescription"], Me = {
 				"hint-id": Q,
 				"edge-step-delay": g.edgeStepDelay,
 				"auto-scroll": !g.noEdgeScroll,
-				label: K.value,
-				onCellActivate: Z,
-				onEventActivate: t[3] ||= (e) => N("event-activate", e),
+				label: Y.value,
+				onCellActivate: Xe,
+				onEventActivate: t[3] ||= (e) => P("event-activate", e),
 				onEventDrop: $,
-				onSlotCreate: Ye,
-				onAnnounce: Je,
-				onStep: Y
+				onSlotCreate: tt,
+				onAnnounce: et,
+				onStep: Z
 			}, p({ _: 2 }, [
 				e.$slots.event ? {
 					name: "event",
-					fn: D((t) => [C(e.$slots, "event", b(_(t)))]),
+					fn: O((t) => [C(e.$slots, "event", b(_(t)))]),
 					key: "0"
 				} : void 0,
 				e.$slots["day-header"] ? {
 					name: "day-header",
-					fn: D((t) => [C(e.$slots, "day-header", b(_(t)))]),
+					fn: O((t) => [C(e.$slots, "day-header", b(_(t)))]),
 					key: "1"
 				} : void 0,
 				e.$slots["all-day-label"] ? {
 					name: "all-day-label",
-					fn: D(() => [C(e.$slots, "all-day-label")]),
+					fn: O(() => [C(e.$slots, "all-day-label")]),
 					key: "2"
 				} : void 0
 			]), 1032, [
@@ -316,33 +330,33 @@ var Ae = ["data-disabled"], je = ["aria-label", "aria-roledescription"], Me = {
 				"edge-step-delay",
 				"auto-scroll",
 				"label"
-			])) : A.value === "month" ? (x(), u(be, {
+			])) : j.value === "month" ? (x(), u(Se, {
 				key: 1,
 				ref_key: "gridRef",
-				ref: H,
-				focused: W.value,
-				"onUpdate:focused": t[4] ||= (e) => W.value = e,
+				ref: W,
+				focused: q.value,
+				"onUpdate:focused": t[4] ||= (e) => q.value = e,
 				class: "v-calendar-view",
-				weeks: Ve.value,
-				events: M.value,
-				locale: T(F),
-				format: I.value,
+				weeks: We.value,
+				events: N.value,
+				locale: T(I),
+				format: Ve.value,
 				today: z.value,
 				"month-event-limit": g.monthEventLimit,
 				editable: !g.readonly && !g.disabled,
 				disabled: g.disabled,
 				"hint-id": Q,
 				"edge-step-delay": g.edgeStepDelay,
-				label: K.value,
-				onDayActivate: t[5] ||= (e) => Ke(e, "day"),
-				onCellActivate: Z,
-				onEventActivate: t[6] ||= (e) => N("event-activate", e),
+				label: Y.value,
+				onDayActivate: t[5] ||= (e) => Ze(e, "day"),
+				onCellActivate: Xe,
+				onEventActivate: t[6] ||= (e) => P("event-activate", e),
 				onEventDrop: $,
-				onAnnounce: Je,
-				onStep: Y
+				onAnnounce: et,
+				onStep: Z
 			}, p({ _: 2 }, [e.$slots.event ? {
 				name: "event",
-				fn: D((t) => [C(e.$slots, "event", b(_(t)))]),
+				fn: O((t) => [C(e.$slots, "event", b(_(t)))]),
 				key: "0"
 			} : void 0]), 1032, [
 				"focused",
@@ -356,17 +370,21 @@ var Ae = ["data-disabled"], je = ["aria-label", "aria-roledescription"], Me = {
 				"disabled",
 				"edge-step-delay",
 				"label"
-			])) : (x(), u(Se, {
+			])) : (x(), u(we, {
 				key: 2,
+				ref_key: "gridRef",
+				ref: W,
 				class: "v-calendar-view",
-				months: He.value,
-				events: M.value,
-				locale: T(F),
+				disabled: g.disabled,
+				months: Ge.value,
+				events: N.value,
+				locale: T(I),
 				weekdays: L.value,
 				today: z.value,
-				label: K.value,
-				onMonthActivate: t[7] ||= (e) => Ke(e, "month")
+				label: Y.value,
+				onMonthActivate: t[7] ||= (e) => Ze(e, "month")
 			}, null, 8, [
+				"disabled",
 				"months",
 				"events",
 				"locale",
@@ -374,15 +392,15 @@ var Ae = ["data-disabled"], je = ["aria-label", "aria-roledescription"], Me = {
 				"today",
 				"label"
 			])),
-			f("div", Fe, w(qe.value), 1),
+			f("div", Le, w(T(Qe)), 1),
 			f("span", {
 				id: Q,
 				class: "v-visually-hidden"
-			}, w(T(P).calendar.eventHint), 1)
-		], 16, je)], 14, Ae));
+			}, w(T(F).calendar.eventHint), 1)
+		], 16, Ne)], 14, Me));
 	}
 });
 //#endregion
-export { O as default };
+export { k as default };
 
 //# sourceMappingURL=VCalendar.vue_vue_type_script_setup_true_lang.js.map