@middag-io/react 0.18.0 → 0.19.0

package/dist-lib/DateRangeField-DK02BwDy.js

@@ -1,663 +0,0 @@
-import { t as e } from "./button-D5Y6A1RJ.js";
-import { a as t, c as n, i as r, n as i, o as a, r as o, t as s } from "./calendar-bwe48kor.js";
-import { K as c, at as l, dt as u, j as d, t as f, y as p } from "./HugeiconsIcon-Bh8XgTFo.js";
-import { t as m } from "./utils-CpaZ5_iF.js";
-import { t as h } from "./scroll-area-f_LkBXTB.js";
-import { a as g, i as _, n as v, t as y } from "./use-mobile-BADA7dx5.js";
-import { t as b } from "./input-DzdJK5AV.js";
-import { createContext as x, useCallback as S, useContext as C, useEffect as w, useMemo as T, useState as E } from "react";
-import { jsx as D, jsxs as O } from "react/jsx-runtime";
-//#region node_modules/date-fns/subMonths.js
-function k(e, t, r) {
-	return n(e, -t, r);
-}
-//#endregion
-//#region src/components/reui/date-selector.tsx
-var A = {
-	selectDate: "Select date",
-	apply: "Apply",
-	cancel: "Cancel",
-	clear: "Clear",
-	today: "Today",
-	filterTypes: {
-		is: "is",
-		before: "before",
-		after: "after",
-		between: "between"
-	},
-	periodTypes: {
-		day: "Day",
-		month: "Month",
-		quarter: "Quarter",
-		halfYear: "Half-year",
-		year: "Year"
-	},
-	months: [
-		"January",
-		"February",
-		"March",
-		"April",
-		"May",
-		"June",
-		"July",
-		"August",
-		"September",
-		"October",
-		"November",
-		"December"
-	],
-	monthsShort: [
-		"Jan",
-		"Feb",
-		"Mar",
-		"Apr",
-		"May",
-		"Jun",
-		"Jul",
-		"Aug",
-		"Sep",
-		"Oct",
-		"Nov",
-		"Dec"
-	],
-	quarters: [
-		"Q1",
-		"Q2",
-		"Q3",
-		"Q4"
-	],
-	halfYears: ["H1", "H2"],
-	weekdays: [
-		"Sunday",
-		"Monday",
-		"Tuesday",
-		"Wednesday",
-		"Thursday",
-		"Friday",
-		"Saturday"
-	],
-	weekdaysShort: [
-		"Su",
-		"Mo",
-		"Tu",
-		"We",
-		"Th",
-		"Fr",
-		"Sa"
-	],
-	placeholder: "Select date...",
-	rangePlaceholder: "Select date range..."
-}, j = x({
-	i18n: A,
-	variant: "outline",
-	size: "default"
-}), M = () => C(j);
-function N(e, t = A, n = "MM/dd/yyyy") {
-	let { period: r, startDate: i, endDate: o, year: s, month: c, quarter: l, halfYear: u, rangeStart: d, rangeEnd: f } = e;
-	return r === "day" ? i && o ? `${a(i, n)} - ${a(o, n)}` : i ? a(i, n) : "" : r === "month" ? d && f ? `${t.monthsShort[d.value]} ${d.year} - ${t.monthsShort[f.value]} ${f.year}` : s !== void 0 && c !== void 0 ? `${t.monthsShort[c]} ${s}` : "" : r === "quarter" ? d && f ? `${t.quarters[d.value]} ${d.year} - ${t.quarters[f.value]} ${f.year}` : s !== void 0 && l !== void 0 ? `${t.quarters[l]} ${s}` : "" : r === "half-year" ? d && f ? `${t.halfYears[d.value]} ${d.year} - ${t.halfYears[f.value]} ${f.year}` : s !== void 0 && u !== void 0 ? `${t.halfYears[u]} ${s}` : "" : r === "year" ? d && f ? `${d.year} - ${f.year}` : s === void 0 ? "" : `${s}` : "";
-}
-function P({ value: e, onChange: n, defaultPeriodType: r = "day", defaultFilterType: i = "is", presetMode: a, allowRange: o = !0, yearRange: s = 11, baseYear: c, minYear: l, maxYear: u, periodTypes: d }) {
-	let f = c ?? (/* @__PURE__ */ new Date()).getFullYear(), p = T(() => !d || d.length === 0 || d.includes(r) ? r : d[0], [d, r]), m = a ?? e?.operator ?? i, [h, g] = E(e?.period || p), [_, v] = E(m), [y, b] = E(e?.startDate), [x, C] = E(e?.endDate), [D, O] = E(e?.startDate || /* @__PURE__ */ new Date()), [k, A] = E(e?.year), [j, M] = E(e?.month), [N, P] = E(e?.quarter), [F, I] = E(e?.halfYear), [L, R] = E(e?.rangeStart), [z, B] = E(e?.rangeEnd), [V, H] = E(), U = T(() => l !== void 0 && u !== void 0 ? Array.from({ length: u - l + 1 }, (e, t) => l + t) : Array.from({ length: s }, (e, t) => f - Math.floor(s / 2) + t), [
-		f,
-		s,
-		l,
-		u
-	]), W = T(() => ({
-		period: h,
-		operator: a ?? _,
-		startDate: y,
-		endDate: x,
-		year: k,
-		month: j,
-		quarter: N,
-		halfYear: F,
-		rangeStart: L,
-		rangeEnd: z
-	}), [
-		h,
-		a,
-		_,
-		y,
-		x,
-		k,
-		j,
-		N,
-		F,
-		L,
-		z
-	]), G = S(() => {
-		b(void 0), C(void 0), A(void 0), M(void 0), P(void 0), I(void 0), R(void 0), B(void 0);
-	}, []), K = S((e) => {
-		_ === "between" && o ? !y || y && x ? (b(e), C(void 0)) : t(e, y) ? (C(y), b(e)) : C(e) : (b(e), C(void 0));
-	}, [
-		_,
-		o,
-		y,
-		x
-	]), q = S((e, t) => {
-		if (_ === "between" && o) if (!L || L && z) R({
-			year: e,
-			value: t
-		}), B(void 0), A(e), h === "month" && M(t), h === "quarter" && P(t), h === "half-year" && I(t);
-		else {
-			let n = L.year * 100 + L.value;
-			e * 100 + t < n ? (B(L), R({
-				year: e,
-				value: t
-			})) : B({
-				year: e,
-				value: t
-			});
-		}
-		else A(e), h === "month" && M(t), h === "quarter" && P(t), h === "half-year" && I(t), R(void 0), B(void 0);
-	}, [
-		_,
-		o,
-		L,
-		z,
-		h
-	]), ee = S((e) => {
-		_ === "between" && o ? !L || L && z ? (R({
-			year: e,
-			value: 0
-		}), B(void 0), A(e)) : e < L.year ? (B(L), R({
-			year: e,
-			value: 0
-		})) : B({
-			year: e,
-			value: 0
-		}) : (A(e), R(void 0), B(void 0));
-	}, [
-		_,
-		o,
-		L,
-		z
-	]), te = S((e) => {
-		g(e), G();
-	}, [G]), ne = S((e) => {
-		a === void 0 && (v(e), G());
-	}, [G, a]), J = S((e, t) => {
-		if (!L || !z) return !1;
-		let n = e * 100 + t, r = L.year * 100 + L.value, i = z.year * 100 + z.value;
-		return n >= r && n <= i;
-	}, [L, z]), Y = S((e) => !L || !z ? !1 : e >= L.year && e <= z.year, [L, z]);
-	return w(() => {
-		e && (g(e.period || p), v(a ?? e.operator ?? i), b(e.startDate), C(e.endDate), A(e.year), M(e.month), P(e.quarter), I(e.halfYear), R(e.rangeStart), B(e.rangeEnd));
-	}, [
-		e,
-		p,
-		i,
-		a
-	]), w(() => {
-		a !== void 0 && v(a);
-	}, [a]), w(() => {
-		n?.(W);
-	}, [W, n]), {
-		periodType: h,
-		filterType: _,
-		selectedDate: y,
-		selectedEndDate: x,
-		calendarMonth: D,
-		selectedYear: k,
-		selectedMonth: j,
-		selectedQuarter: N,
-		selectedHalfYear: F,
-		rangeStart: L,
-		rangeEnd: z,
-		hoverDate: V,
-		years: U,
-		currentValue: W,
-		allowRange: o,
-		setPeriodType: te,
-		setFilterType: ne,
-		setSelectedDate: b,
-		setSelectedEndDate: C,
-		setCalendarMonth: O,
-		setHoverDate: H,
-		clearSelection: G,
-		handleDayClick: K,
-		handlePeriodSelect: q,
-		handleYearSelect: ee,
-		isInRange: J,
-		isYearInRange: Y
-	};
-}
-function F({ value: e, onChange: t, showBetween: n = !0, showIs: r = !0, presetMode: i, className: a }) {
-	let { i18n: o } = M(), s = i !== void 0;
-	return /* @__PURE__ */ D(v, {
-		value: e,
-		onValueChange: (e) => {
-			!s && e && t(e);
-		},
-		className: a,
-		children: /* @__PURE__ */ O(_, {
-			className: m("bg-muted/80", s && "pointer-events-none opacity-50", a),
-			children: [
-				r && /* @__PURE__ */ D(g, {
-					value: "is",
-					"aria-label": o.filterTypes.is,
-					className: "py-1 font-normal",
-					children: o.filterTypes.is
-				}),
-				/* @__PURE__ */ D(g, {
-					value: "before",
-					"aria-label": o.filterTypes.before,
-					className: "py-1 font-normal",
-					children: o.filterTypes.before
-				}),
-				/* @__PURE__ */ D(g, {
-					value: "after",
-					"aria-label": o.filterTypes.after,
-					className: "py-1 font-normal",
-					children: o.filterTypes.after
-				}),
-				n && /* @__PURE__ */ D(g, {
-					value: "between",
-					"aria-label": o.filterTypes.between,
-					className: "py-1 font-normal",
-					children: o.filterTypes.between
-				})
-			]
-		})
-	});
-}
-function I({ value: t, onChange: r, periodTypes: i, className: a, calendarMonth: s, onMonthChange: c, showNavigationButtons: h = !1 }) {
-	let { i18n: y } = M(), b = [
-		{
-			value: "day",
-			label: y.periodTypes.day
-		},
-		{
-			value: "month",
-			label: y.periodTypes.month
-		},
-		{
-			value: "quarter",
-			label: y.periodTypes.quarter
-		},
-		{
-			value: "half-year",
-			label: y.periodTypes.halfYear
-		},
-		{
-			value: "year",
-			label: y.periodTypes.year
-		}
-	], x = i ? b.filter((e) => i.includes(e.value)) : b;
-	return /* @__PURE__ */ O("div", {
-		className: m("flex flex-wrap items-center justify-between gap-3", a),
-		children: [/* @__PURE__ */ D(v, {
-			value: t,
-			onValueChange: (e) => {
-				e && r(e);
-			},
-			children: /* @__PURE__ */ D(_, { children: x.map((e) => /* @__PURE__ */ D(g, {
-				value: e.value,
-				"aria-label": e.label,
-				className: "px-1 py-1 font-normal sm:px-2.5",
-				children: e.label
-			}, e.value)) })
-		}), h && t === "day" && s && c && /* @__PURE__ */ O("div", {
-			className: "flex items-center",
-			children: [
-				(() => {
-					let t = /* @__PURE__ */ new Date();
-					if (o(s, t)) return null;
-					let n = s > t;
-					return /* @__PURE__ */ D(e, {
-						variant: "ghost",
-						className: "size-8.5",
-						onClick: () => c(/* @__PURE__ */ new Date()),
-						title: y.today,
-						children: n ? /* @__PURE__ */ D(f, {
-							icon: d,
-							strokeWidth: 2
-						}) : /* @__PURE__ */ D(f, {
-							icon: u,
-							strokeWidth: 2
-						})
-					});
-				})(),
-				/* @__PURE__ */ D(e, {
-					variant: "ghost",
-					className: "size-8.5",
-					onClick: () => c(k(s, 1)),
-					children: /* @__PURE__ */ D(f, {
-						icon: l,
-						strokeWidth: 2,
-						className: "size-4"
-					})
-				}),
-				/* @__PURE__ */ D(e, {
-					variant: "ghost",
-					className: "size-8.5",
-					onClick: () => c(n(s, 1)),
-					children: /* @__PURE__ */ D(f, {
-						icon: p,
-						strokeWidth: 2,
-						className: "size-4"
-					})
-				})
-			]
-		})]
-	});
-}
-function L({ currentMonth: e, selectedDate: t, selectedEndDate: n, onDayClick: r, isRange: a, onDayHover: o, hoverDate: c, showTwoMonths: l = !0, weekStartsOn: u, className: d }) {
-	let { i18n: f } = M(), p = y(), h = a ? t && n ? {
-		from: t,
-		to: n
-	} : t ? {
-		from: t,
-		to: c || t
-	} : void 0 : t, g = (e) => {
-		e && (a && "from" in e ? e.from && !e.to ? r(e.from) : e.from && e.to && r(e.to) : !a && e instanceof Date && r(e));
-	}, _ = S((e) => /* @__PURE__ */ D(i, {
-		...e,
-		onMouseEnter: () => {
-			a && o && e.day && o(e.day.date);
-		},
-		onMouseLeave: () => {
-			a && o && o(void 0);
-		}
-	}), [a, o]), v = {
-		formatWeekdayName: (e) => {
-			let t = e.getDay();
-			return f.weekdaysShort[t] || f.weekdays[t];
-		},
-		formatMonthCaption: (e) => {
-			let t = e.getMonth(), n = e.getFullYear();
-			return `${f.months[t]} ${n}`;
-		}
-	};
-	return /* @__PURE__ */ D("div", {
-		className: m("flex w-full items-center justify-between", d),
-		children: a ? /* @__PURE__ */ D(s, {
-			month: e,
-			mode: "range",
-			selected: h,
-			onSelect: g,
-			numberOfMonths: p ? 1 : l ? 2 : 1,
-			showOutsideDays: !0,
-			weekStartsOn: u,
-			formatters: v,
-			className: "w-full shrink-0 p-0",
-			classNames: {
-				months: "flex flex-wrap items-start justify-between gap-5 w-full",
-				month: "flex flex-col items-center min-w-0 flex-1",
-				nav: "hidden"
-			},
-			components: { DayButton: _ }
-		}) : /* @__PURE__ */ D(s, {
-			month: e,
-			mode: "single",
-			selected: h,
-			onSelect: g,
-			numberOfMonths: p ? 1 : l ? 2 : 1,
-			showOutsideDays: !0,
-			weekStartsOn: u,
-			formatters: v,
-			className: "w-full shrink-0 p-0",
-			classNames: {
-				months: "flex flex-wrap items-start justify-between gap-5 w-full",
-				month: "flex flex-col items-center min-w-0 flex-1",
-				nav: "hidden"
-			},
-			components: { DayButton: _ }
-		})
-	});
-}
-function R({ years: t, items: n, selectedYear: r, selectedValue: i, rangeStart: a, rangeEnd: o, isInRange: s, onSelect: c, columns: l, className: u }) {
-	return /* @__PURE__ */ D("div", {
-		className: m("w-full space-y-6", u),
-		children: t.map((t) => /* @__PURE__ */ O("div", { children: [/* @__PURE__ */ D("div", {
-			className: "text-muted-foreground mb-3 text-sm font-medium",
-			children: t
-		}), /* @__PURE__ */ D("div", {
-			className: "grid gap-2",
-			style: { gridTemplateColumns: `repeat(${l}, minmax(0, 1fr))` },
-			children: n.map((n, l) => {
-				let u = r === t && i === l, d = a?.year === t && a?.value === l, f = o?.year === t && o?.value === l, p = s(t, l);
-				return /* @__PURE__ */ D(e, {
-					size: "sm",
-					variant: u || d || f ? "default" : "outline",
-					className: m(p && !u && !d && !f && "bg-accent dark:bg-accent/60"),
-					onClick: () => c(t, l),
-					children: n
-				}, n);
-			})
-		})] }, t))
-	});
-}
-function z({ years: t, selectedYear: n, rangeStart: r, rangeEnd: i, isYearInRange: a, onSelect: o, className: s }) {
-	return /* @__PURE__ */ D("div", {
-		className: m("grid grid-cols-2 gap-2", s),
-		children: t.map((t) => {
-			let s = n === t && !r && !i, c = r?.year === t, l = i?.year === t, u = a(t);
-			return /* @__PURE__ */ D(e, {
-				size: "sm",
-				variant: s || c || l ? "default" : "outline",
-				className: m(u && !s && !c && !l && "bg-accent dark:bg-accent/60"),
-				onClick: () => o(t),
-				children: t
-			}, t);
-		})
-	});
-}
-function B({ value: e, onChange: t, allowRange: n = !0, periodTypes: i, defaultPeriodType: a = "day", defaultFilterType: o = "is", presetMode: s, showInput: l = !0, showTwoMonths: u = !0, label: d, className: p, yearRange: g = 10, baseYear: _, minYear: v = 2015, maxYear: y = 2026, i18n: x, inputHint: C, dayDateFormat: k = "MM/dd/yyyy", dayDateFormats: M, weekStartsOn: B }) {
-	let V = T(() => ({
-		...A,
-		...x
-	}), [x]), { periodType: H, filterType: U, selectedDate: W, selectedEndDate: G, calendarMonth: K, selectedYear: q, selectedMonth: ee, selectedQuarter: te, selectedHalfYear: ne, rangeStart: J, rangeEnd: Y, hoverDate: re, years: X, currentValue: ie, setPeriodType: ae, setFilterType: oe, setCalendarMonth: se, setHoverDate: ce, clearSelection: le, handleDayClick: ue, handlePeriodSelect: de, handleYearSelect: fe, isInRange: pe, isYearInRange: me } = P({
-		value: e,
-		onChange: t,
-		defaultPeriodType: a,
-		defaultFilterType: o,
-		presetMode: s,
-		allowRange: n,
-		yearRange: g,
-		baseYear: _,
-		minYear: v,
-		maxYear: y,
-		periodTypes: i
-	}), Z = N(ie, V, k), [Q, he] = E(Z), [ge, _e] = E(!1);
-	w(() => {
-		ge || he(Z);
-	}, [Z, ge]);
-	let ve = T(() => {
-		if (M && M.length > 0) {
-			let e = [...M];
-			return e.includes(k) || e.unshift(k), e;
-		}
-		let e = [
-			k,
-			"dd/MM/yyyy",
-			"yyyy-MM-dd",
-			"MM-dd-yyyy",
-			"dd-MM-yyyy"
-		];
-		return Array.from(new Set(e));
-	}, [k, M]), $ = S((e) => {
-		if (!e.trim()) return null;
-		let t = e.trim(), n = t.match(/^\d{4}$/);
-		if (n) {
-			let e = parseInt(n[0]);
-			if (e >= 1900 && e <= 2100) return {
-				period: "year",
-				operator: s ?? U,
-				year: e
-			};
-		}
-		let i = t.match(/^Q([1-4])(?:\s+(\d{4}))?$/i);
-		if (i) {
-			let e = parseInt(i[1]) - 1, t = i[2] ? parseInt(i[2]) : (/* @__PURE__ */ new Date()).getFullYear();
-			if (t >= 1900 && t <= 2100) return {
-				period: "quarter",
-				operator: s ?? U,
-				year: t,
-				quarter: e
-			};
-		}
-		for (let e of ve) try {
-			let n = r(t, e, /* @__PURE__ */ new Date());
-			if (!isNaN(n.getTime())) return {
-				period: "day",
-				operator: s ?? U,
-				startDate: n
-			};
-		} catch {}
-		return null;
-	}, [
-		U,
-		s,
-		ve
-	]), ye = S((e) => {
-		let n = e.target.value;
-		he(n);
-		let r = $(n);
-		r && t?.(r);
-	}, [t, $]), be = S(() => {
-		_e(!1), $(Q) || he(Z);
-	}, [
-		Q,
-		Z,
-		$
-	]);
-	return /* @__PURE__ */ D(j.Provider, {
-		value: {
-			i18n: V,
-			variant: "outline",
-			size: "default"
-		},
-		children: /* @__PURE__ */ O("div", {
-			className: m("w-full space-y-4 sm:w-[470px]", p),
-			children: [
-				/* @__PURE__ */ O("div", {
-					className: "flex flex-wrap items-center gap-3",
-					children: [d && /* @__PURE__ */ D("h3", {
-						className: "text-sm font-medium",
-						"data-slot": "data-selector-label",
-						children: d
-					}), /* @__PURE__ */ D(F, {
-						value: U,
-						onChange: oe,
-						showBetween: n,
-						presetMode: s
-					})]
-				}),
-				l && /* @__PURE__ */ O("div", {
-					className: "relative",
-					children: [/* @__PURE__ */ D(b, {
-						type: "text",
-						value: C ? Q : Z,
-						readOnly: !C,
-						placeholder: ge && C ? C : V.placeholder,
-						onFocus: () => _e(!0),
-						onBlur: be,
-						onChange: ye
-					}), (C ? Q : Z) && /* @__PURE__ */ D("button", {
-						type: "button",
-						onClick: le,
-						className: m("absolute end-2.5 top-1/2 size-4 -translate-y-1/2 cursor-pointer rounded-xs", "opacity-70 transition-opacity hover:opacity-100", "ring-offset-background focus:ring-ring focus:ring-2 focus:ring-offset-2 focus:outline-none"),
-						children: /* @__PURE__ */ D(f, {
-							icon: c,
-							strokeWidth: 2,
-							className: "size-4"
-						})
-					})]
-				}),
-				/* @__PURE__ */ D(I, {
-					value: H,
-					onChange: ae,
-					periodTypes: i,
-					calendarMonth: K,
-					onMonthChange: se,
-					showNavigationButtons: H === "day"
-				}),
-				H === "day" ? /* @__PURE__ */ D("div", {
-					className: "w-full pb-1",
-					children: /* @__PURE__ */ D(L, {
-						currentMonth: K,
-						selectedDate: W,
-						selectedEndDate: G,
-						onDayClick: ue,
-						isRange: U === "between" && n,
-						onDayHover: ce,
-						hoverDate: re,
-						showTwoMonths: u,
-						weekStartsOn: B
-					})
-				}) : /* @__PURE__ */ D("div", {
-					className: "-mr-3 w-full",
-					children: /* @__PURE__ */ O(h, {
-						className: "h-[200px] w-full pe-3",
-						children: [
-							H === "month" && /* @__PURE__ */ D(R, {
-								years: X,
-								items: V.monthsShort,
-								selectedYear: q,
-								selectedValue: ee,
-								rangeStart: J,
-								rangeEnd: Y,
-								isInRange: pe,
-								onSelect: de,
-								columns: 3
-							}),
-							H === "quarter" && /* @__PURE__ */ D(R, {
-								years: X,
-								items: V.quarters,
-								selectedYear: q,
-								selectedValue: te,
-								rangeStart: J,
-								rangeEnd: Y,
-								isInRange: pe,
-								onSelect: de,
-								columns: 4
-							}),
-							H === "half-year" && /* @__PURE__ */ D(R, {
-								years: X,
-								items: V.halfYears,
-								selectedYear: q,
-								selectedValue: ne,
-								rangeStart: J,
-								rangeEnd: Y,
-								isInRange: pe,
-								onSelect: de,
-								columns: 2
-							}),
-							H === "year" && /* @__PURE__ */ D(z, {
-								years: X,
-								selectedYear: q,
-								rangeStart: J,
-								rangeEnd: Y,
-								isYearInRange: me,
-								onSelect: fe
-							})
-						]
-					}, H)
-				})
-			]
-		})
-	});
-}
-//#endregion
-//#region src/base/form/fields/DateRangeField.tsx
-function V({ id: e, value: t, onChange: n, operator: r, error: i, helpTextId: a, errorId: o }) {
-	let s = [i ? o : void 0, a].filter(Boolean).join(" ") || void 0, c = S((e) => {
-		n(e);
-	}, [n]);
-	return /* @__PURE__ */ D("div", {
-		id: e,
-		"aria-invalid": i ? !0 : void 0,
-		"aria-describedby": s,
-		children: /* @__PURE__ */ D(B, {
-			value: t,
-			onChange: c,
-			allowRange: !0,
-			defaultFilterType: r ?? "is",
-			presetMode: r || void 0,
-			showInput: !0
-		})
-	});
-}
-//#endregion
-export { V as DateRangeField };