@mitcsutt/kiln-ui 0.5.0 → 0.7.0

package/dist/components/inputs/Calendar/Calendar.js

@@ -0,0 +1,217 @@
+import { cx as e } from "../../../utils/cx.js";
+import { ChevronLeftIcon as t, ChevronRightIcon as n } from "../../../icons/icons.js";
+import { useMergedRefs as r } from "../internal/refs.js";
+import { useLatest as i } from "../internal/useLatest.js";
+import { IconButton as a } from "../../actions/IconButton/IconButton.js";
+import { DEFAULT_LOCALE as o, addDays as s, addMonths as c, clampDate as l, compareDates as u, dayOfWeek as d, daysInMonth as f, defaultFirstDayOfWeek as ee, formatDate as p, formatFullDate as te, formatMonthYear as ne, isSameDay as m, pad as h, parseDate as g, todayIn as re, weekdayNames as ie } from "../internal/dates.js";
+import _ from "./Calendar.module.js";
+import { forwardRef as v, useEffect as ae, useId as oe, useRef as y, useState as b } from "react";
+import { jsx as x, jsxs as S } from "react/jsx-runtime";
+//#region src/components/inputs/Calendar/Calendar.tsx
+var se = {
+	previousMonth: "Previous month",
+	nextMonth: "Next month"
+}, C = (e) => e.year * 12 + e.month - 1, w = (e) => ({
+	year: Math.floor(e / 12),
+	month: e % 12 + 1
+}), T = (e) => {
+	let t = e ? /^(\d{4})-(\d{2})$/.exec(e) : null;
+	if (!t) return null;
+	let n = Number(t[2]);
+	return n >= 1 && n <= 12 ? {
+		year: Number(t[1]),
+		month: n
+	} : null;
+}, E = (e) => `${h(e.year, 4)}-${h(e.month)}`;
+function ce(e, t) {
+	let n = {
+		year: e.year,
+		month: e.month,
+		day: 1
+	}, r = (d(n) - t + 7) % 7, i = f(e.year, e.month);
+	return Array.from({ length: 6 }, (e, t) => Array.from({ length: 7 }, (e, a) => {
+		let o = t * 7 + a - r + 1;
+		return o >= 1 && o <= i ? {
+			...n,
+			day: o
+		} : null;
+	}));
+}
+var D = v(function(h, v) {
+	let { mode: D = "single", value: O, defaultValue: ue, onValueChange: de, min: fe, max: pe, isDateDisabled: me, firstDayOfWeek: he, locale: k = o, timeZone: ge, months: A = 1, month: j, defaultMonth: _e, onMonthChange: ve, disabled: M = !1, readOnly: ye = !1, autoFocus: be = !1, labels: xe, className: Se, ...Ce } = h, N = {
+		...se,
+		...xe
+	}, we = oe(), P = y(null), Te = r(v, P), Ee = i(de), [De, Oe] = b(ue ?? (D === "range" ? le : "")), F = O ?? De, I = typeof F == "string" ? {
+		start: g(F),
+		end: g(F)
+	} : {
+		start: g(F.start),
+		end: g(F.end)
+	}, L = g(fe ?? ""), R = g(pe ?? ""), z = re(ge), B = (he ?? ee(k)) % 7, ke = !M && !ye, [V, H] = b(() => l(I.start ?? z, L, R)), [Ae, je] = b(() => T(_e) ?? {
+		year: V.year,
+		month: V.month
+	}), U = T(j) ?? Ae, [W, G] = b(null), K = y(be), q = (e) => {
+		C(e) !== C(U) && (j === void 0 && je(e), ve?.(E(e)));
+	}, J = (e) => L !== null && u(e, L) < 0 || R !== null && u(e, R) > 0 || (me?.(p(e)) ?? !1), Me = (e) => {
+		let t = l(e, L, R), n = C(U), r = C(t);
+		r < n ? q(w(r)) : r > n + A - 1 && q(w(r - A + 1)), K.current = !0, H(t);
+	}, Y = C(U), X = C(V);
+	if (X < Y || X > Y + A - 1) {
+		let e = Math.min(V.day, f(U.year, U.month)), t = l({
+			...U,
+			day: e
+		}, L, R), n = C(t);
+		H(n < Y || n > Y + A - 1 ? {
+			...U,
+			day: e
+		} : t);
+	}
+	ae(() => {
+		K.current && (K.current = !1, P.current?.querySelector(`[data-date="${p(V)}"]`)?.focus());
+	}, [V, U]);
+	let Ne = (e) => {
+		if (H(e), !ke || J(e)) return;
+		let t = p(e), n;
+		n = D === "single" ? t : !I.start || I.end ? {
+			start: t,
+			end: ""
+		} : u(e, I.start) < 0 ? {
+			start: t,
+			end: p(I.start)
+		} : {
+			start: p(I.start),
+			end: t
+		}, O === void 0 && Oe(n), Ee.current?.(n);
+	}, Pe = (e) => {
+		let t = P.current && getComputedStyle(P.current).direction === "rtl" ? -1 : 1, n = (d(V) - B + 7) % 7, r = {
+			ArrowLeft: () => s(V, -t),
+			ArrowRight: () => s(V, t),
+			ArrowUp: () => s(V, -7),
+			ArrowDown: () => s(V, 7),
+			Home: () => s(V, -n),
+			End: () => s(V, 6 - n),
+			PageUp: () => c(V, e.shiftKey ? -12 : -1),
+			PageDown: () => c(V, e.shiftKey ? 12 : 1)
+		}[e.key];
+		if (r) {
+			e.preventDefault();
+			let t = r();
+			Me(t), D === "range" && G(t);
+			return;
+		}
+		(e.key === "Enter" || e.key === " ") && (e.preventDefault(), Ne(V));
+	}, Fe = (e) => {
+		let t = w(C(U) + e);
+		q(t);
+		let n = w(C(V) + e);
+		H(l({
+			...n,
+			day: Math.min(V.day, f(n.year, n.month))
+		}, L, R));
+	}, Z = D === "range" && I.start !== null && I.end === null, Q = D === "range" ? I.start : null, $ = D === "range" ? I.end : null;
+	Z && W && I.start && ([Q, $] = u(W, I.start) < 0 ? [W, I.start] : [I.start, W]);
+	let Ie = ie(k, B), Le = Array.from({ length: A }, (e, t) => w(C(U) + t)), Re = !L || C(U) > C(L), ze = !R || C(U) + A - 1 < C(R);
+	return /* @__PURE__ */ x("div", {
+		ref: Te,
+		role: "group",
+		className: e(_.root, Se),
+		"data-mode": D,
+		"data-months": A,
+		"data-disabled": M || void 0,
+		"aria-disabled": M || void 0,
+		...Ce,
+		children: /* @__PURE__ */ x("div", {
+			className: _.months,
+			children: Le.map((e, r) => {
+				let i = `${we}-title-${String(r)}`, o = r === A - 1;
+				return /* @__PURE__ */ S("div", {
+					className: _.month,
+					children: [/* @__PURE__ */ S("div", {
+						className: _.header,
+						children: [/* @__PURE__ */ x("div", {
+							id: i,
+							className: _.title,
+							"aria-live": "polite",
+							children: ne(k, e.year, e.month)
+						}), o ? /* @__PURE__ */ S("div", {
+							className: _.nav,
+							children: [/* @__PURE__ */ x(a, {
+								variant: "ghost",
+								size: "sm",
+								label: N.previousMonth,
+								icon: /* @__PURE__ */ x(t, {}),
+								disabled: M || !Re,
+								onClick: () => {
+									Fe(-1);
+								}
+							}), /* @__PURE__ */ x(a, {
+								variant: "ghost",
+								size: "sm",
+								label: N.nextMonth,
+								icon: /* @__PURE__ */ x(n, {}),
+								disabled: M || !ze,
+								onClick: () => {
+									Fe(1);
+								}
+							})]
+						}) : null]
+					}), /* @__PURE__ */ S("table", {
+						role: "grid",
+						className: _.grid,
+						"aria-labelledby": i,
+						children: [/* @__PURE__ */ x("thead", { children: /* @__PURE__ */ x("tr", { children: Ie.map((e) => /* @__PURE__ */ x("th", {
+							scope: "col",
+							abbr: e.long,
+							className: _.weekday,
+							children: e.short
+						}, e.long)) }) }), /* @__PURE__ */ x("tbody", { children: ce(e, B).map((e, t) => /* @__PURE__ */ x("tr", { children: e.map((e, t) => {
+							if (!e) return /* @__PURE__ */ x("td", {
+								role: "gridcell",
+								className: _.empty
+							}, t);
+							let n = p(e), r = J(e), i = m(e, Q), a = m(e, $), o = Q !== null && $ !== null && u(e, Q) >= 0 && u(e, $) <= 0, s = D === "single" ? m(e, I.start) : m(e, I.start) || m(e, I.end) || !Z && o, c = m(e, V);
+							return /* @__PURE__ */ x("td", {
+								role: "gridcell",
+								className: _.day,
+								"data-date": n,
+								tabIndex: M ? void 0 : c ? 0 : -1,
+								"aria-label": te(k, e),
+								"aria-selected": s,
+								"aria-disabled": M || r || void 0,
+								"aria-current": m(e, z) ? "date" : void 0,
+								"data-today": m(e, z) || void 0,
+								"data-selected": s || void 0,
+								"data-unavailable": r || void 0,
+								"data-range-start": o && i || void 0,
+								"data-range-end": o && a || void 0,
+								"data-in-range": o || void 0,
+								"data-preview": Z && o || void 0,
+								onClick: () => {
+									Ne(e);
+								},
+								onKeyDown: Pe,
+								onFocus: () => {
+									c || H(e);
+								},
+								onPointerEnter: () => {
+									Z && G(e);
+								},
+								children: /* @__PURE__ */ x("span", {
+									className: _.dayText,
+									children: e.day
+								})
+							}, t);
+						}) }, t)) })]
+					})]
+				}, E(e));
+			})
+		})
+	});
+}), le = {
+	start: "",
+	end: ""
+};
+//#endregion
+export { D as Calendar };
+
+//# sourceMappingURL=Calendar.js.map

package/dist/components/inputs/Calendar/Calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.js","names":["styles","Calendar_module_default","DEFAULT_LABELS","monthIndex","m","monthFromIndex","index","parseMonth","match","text","month","formatMonth","pad","monthGrid","first","offset","dayOfWeek","firstDay","length","daysInMonth","day","row","column","Calendar","forwardRef","valueProp","DEFAULT_LOCALE","monthProp","labelsProp","rest","props","labels","autoId","useId","rootRef","useRef","composedRef","useMergedRefs","ref","onValueChangeRef","useLatest","onValueChange","internal","setInternal","useState","defaultValue","mode","EMPTY_RANGE","value","range","parseDate","minDate","min","maxDate","max","today","todayIn","timeZone","firstDayOfWeek","defaultFirstDayOfWeek","locale","interactive","disabled","readOnly","focused","setFocused","clampDate","internalMonth","setInternalMonth","defaultMonth","visible","hovered","setHovered","shouldFocus","autoFocus","setMonth","next","onMonthChange","isUnavailable","compareDates","date","isDateDisabled","formatDate","moveFocus","months","firstVisible","focusedIndex","select","iso","handleKeyDown","ahead","weekStart","move","addDays","addMonths","event","turnPage","step","targetMonth","pending","spanStart","spanEnd","weekdays","weekdayNames","visibleMonths","i","canGoBack","canGoForward","cx","className","titleId","monthNumber","last","formatMonthYear","IconButton","ChevronLeftIcon","ChevronRightIcon","weekday","week","unavailable","isStart","isSameDay","isEnd","inSpan","selected","isFocused","formatFullDate"],"sources":["../../../../src/components/inputs/Calendar/Calendar.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useEffect,\n  useId,\n  useRef,\n  useState,\n  type HTMLAttributes,\n  type KeyboardEvent,\n} from 'react'\nimport { ChevronLeftIcon, ChevronRightIcon } from '#icons'\nimport { cx } from '#utils/cx'\nimport { IconButton } from '#components/actions/IconButton'\nimport type { DateRangeValue } from '#components/inputs/DateRangeField'\nimport { useMergedRefs } from '#components/inputs/internal/refs'\nimport { useLatest } from '#components/inputs/internal/useLatest'\nimport {\n  DEFAULT_LOCALE,\n  addDays,\n  addMonths,\n  clampDate,\n  compareDates,\n  dayOfWeek,\n  daysInMonth,\n  defaultFirstDayOfWeek,\n  formatDate,\n  formatFullDate,\n  formatMonthYear,\n  isSameDay,\n  pad,\n  parseDate,\n  todayIn,\n  weekdayNames,\n  type CalendarDate,\n} from '#components/inputs/internal/dates'\nimport styles from './Calendar.module.css'\n\n/** Accessible names of the calendar's own buttons. */\nexport interface CalendarLabels {\n  /** Default `'Previous month'`. */\n  previousMonth: string\n  /** Default `'Next month'`. */\n  nextMonth: string\n}\n\nconst DEFAULT_LABELS: CalendarLabels = {\n  previousMonth: 'Previous month',\n  nextMonth: 'Next month',\n}\n\ninterface CalendarCommonProps extends Omit<\n  HTMLAttributes<HTMLDivElement>,\n  'onChange' | 'defaultValue'\n> {\n  /** Earliest date that can be picked (`YYYY-MM-DD`). */\n  min?: string\n  /** Latest date that can be picked (`YYYY-MM-DD`). */\n  max?: string\n  /** Marks other dates unavailable: weekends, public holidays, booked nights. */\n  isDateDisabled?: (date: string) => boolean\n  /** 0 (Sunday) to 6 (Saturday). Defaults to the locale's own week. */\n  firstDayOfWeek?: number\n  /** BCP 47 locale for month and weekday names. Default `en-AU`. */\n  locale?: string\n  /** The zone \"today\" is read in. Defaults to the device's. */\n  timeZone?: string\n  /** How many months to show side by side (they wrap when narrow). Default `1`. */\n  months?: 1 | 2\n  /** The first month shown (`YYYY-MM`). Controlled. */\n  month?: string\n  /** The first month shown at first (`YYYY-MM`). Defaults to the selected or current month. */\n  defaultMonth?: string\n  onMonthChange?: (month: string) => void\n  disabled?: boolean\n  /** Dates can be focused and read but not picked. */\n  readOnly?: boolean\n  /** Focus the current day once mounted, as a picker's popover does. */\n  autoFocus?: boolean\n  labels?: Partial<CalendarLabels>\n}\n\nexport interface CalendarSingleProps extends CalendarCommonProps {\n  /** `single` (default) picks one date; `range` picks a start and an end. */\n  mode?: 'single'\n  /** `YYYY-MM-DD`, or `''` for none. */\n  value?: string\n  defaultValue?: string\n  onValueChange?: (value: string) => void\n}\n\nexport interface CalendarRangeProps extends CalendarCommonProps {\n  mode: 'range'\n  /** The first click sets `start` (and clears `end`), the second sets `end`. */\n  value?: DateRangeValue\n  defaultValue?: DateRangeValue\n  onValueChange?: (value: DateRangeValue) => void\n}\n\nexport type CalendarProps = CalendarSingleProps | CalendarRangeProps\n\ninterface Month {\n  year: number\n  month: number\n}\n\nconst monthIndex = (m: Month) => m.year * 12 + m.month - 1\nconst monthFromIndex = (index: number): Month => ({\n  year: Math.floor(index / 12),\n  month: (index % 12) + 1,\n})\nconst parseMonth = (text: string | undefined): Month | null => {\n  const match = text ? /^(\\d{4})-(\\d{2})$/.exec(text) : null\n  if (!match) return null\n  const month = Number(match[2])\n  return month >= 1 && month <= 12 ? { year: Number(match[1]), month } : null\n}\nconst formatMonth = (m: Month) => `${pad(m.year, 4)}-${pad(m.month)}`\n\n/** Six rows of seven: every month the same height, so a popover never jumps. */\nfunction monthGrid(month: Month, firstDay: number): (CalendarDate | null)[][] {\n  const first = { year: month.year, month: month.month, day: 1 }\n  const offset = (dayOfWeek(first) - firstDay + 7) % 7\n  const length = daysInMonth(month.year, month.month)\n  return Array.from({ length: 6 }, (_, row) =>\n    Array.from({ length: 7 }, (_, column) => {\n      const day = row * 7 + column - offset + 1\n      return day >= 1 && day <= length ? { ...first, day } : null\n    }),\n  )\n}\n\n/**\n * A month grid for picking a date or a range, with the full keyboard of a date grid.\n *\n * @remarks\n * `Calendar` shows one or two months as a grid of days. Click a day or move with the arrow keys\n * and press Enter. In `range` mode the first pick is the start and the second the end, with the\n * days between shaded as you go. `min`, `max` and `isDateDisabled` mark days that can't be picked;\n * they stay focusable, so a screen reader can still say why a date is missing. Month and weekday\n * names come from `locale`, and so does the first day of the week unless you set\n * `firstDayOfWeek`.\n *\n * {@link DateInput | DateInput}, {@link DateTimeInput | DateTimeInput} and\n * {@link DateRangePickerField | DateRangePickerField} open it in a popover. Use it on its own for a calendar\n * that's always visible, such as a booking page.\n *\n * ## Keyboard\n *\n * | Key | Moves to |\n * | --- | --- |\n * | Arrow keys | The previous or next day, or the same day in the previous or next week |\n * | Home / End | The first or last day of the week |\n * | Page Up / Page Down | The same day in the previous or next month |\n * | Shift + Page Up / Page Down | The same day in the previous or next year |\n * | Enter / Space | Picks the focused day |\n *\n * @privateRemarks\n * ARIA grid pattern: one `<table role=\"grid\">` per month, labelled by its title, with a roving\n * tabindex on the day cells (the focused date is the only tab stop). Cells outside the month are\n * empty, so two months side by side never show a date twice. Values are ISO strings; all date\n * maths goes through `internal/dates` (ADR 0042).\n *\n * <Calendar mode=\"range\" months={2} value={stay} onValueChange={setStay} />\n */\nexport const Calendar = forwardRef<HTMLDivElement, CalendarProps>(function Calendar(props, ref) {\n  const {\n    mode = 'single',\n    value: valueProp,\n    defaultValue,\n    onValueChange,\n    min,\n    max,\n    isDateDisabled,\n    firstDayOfWeek,\n    locale = DEFAULT_LOCALE,\n    timeZone,\n    months = 1,\n    month: monthProp,\n    defaultMonth,\n    onMonthChange,\n    disabled = false,\n    readOnly = false,\n    autoFocus = false,\n    labels: labelsProp,\n    className,\n    ...rest\n  } = props as CalendarCommonProps & {\n    mode?: 'single' | 'range'\n    value?: string | DateRangeValue\n    defaultValue?: string | DateRangeValue\n    onValueChange?: (value: string & DateRangeValue) => void\n  }\n  const labels = { ...DEFAULT_LABELS, ...labelsProp }\n  const autoId = useId()\n  const rootRef = useRef<HTMLDivElement>(null)\n  const composedRef = useMergedRefs(ref, rootRef)\n  const onValueChangeRef = useLatest(onValueChange)\n\n  const [internal, setInternal] = useState(defaultValue ?? (mode === 'range' ? EMPTY_RANGE : ''))\n  const value = valueProp ?? internal\n  const range =\n    typeof value === 'string'\n      ? { start: parseDate(value), end: parseDate(value) }\n      : { start: parseDate(value.start), end: parseDate(value.end) }\n  const minDate = parseDate(min ?? '')\n  const maxDate = parseDate(max ?? '')\n  const today = todayIn(timeZone)\n  const firstDay = (firstDayOfWeek ?? defaultFirstDayOfWeek(locale)) % 7\n  const interactive = !disabled && !readOnly\n\n  const [focused, setFocused] = useState<CalendarDate>(() =>\n    clampDate(range.start ?? today, minDate, maxDate),\n  )\n  const [internalMonth, setInternalMonth] = useState<Month>(\n    () => parseMonth(defaultMonth) ?? { year: focused.year, month: focused.month },\n  )\n  const visible = parseMonth(monthProp) ?? internalMonth\n  const [hovered, setHovered] = useState<CalendarDate | null>(null)\n  const shouldFocus = useRef(autoFocus)\n\n  const setMonth = (next: Month) => {\n    if (monthIndex(next) === monthIndex(visible)) return\n    if (monthProp === undefined) setInternalMonth(next)\n    onMonthChange?.(formatMonth(next))\n  }\n\n  const isUnavailable = (date: CalendarDate) =>\n    (minDate !== null && compareDates(date, minDate) < 0) ||\n    (maxDate !== null && compareDates(date, maxDate) > 0) ||\n    (isDateDisabled?.(formatDate(date)) ?? false)\n\n  // Keep the focused date on screen: arrowing past the last visible month turns the page.\n  const moveFocus = (next: CalendarDate) => {\n    const date = clampDate(next, minDate, maxDate)\n    const first = monthIndex(visible)\n    const index = monthIndex(date)\n    if (index < first) setMonth(monthFromIndex(index))\n    else if (index > first + months - 1) setMonth(monthFromIndex(index - months + 1))\n    shouldFocus.current = true\n    setFocused(date)\n  }\n\n  // A controlled month moving elsewhere takes the focused date with it.\n  const firstVisible = monthIndex(visible)\n  const focusedIndex = monthIndex(focused)\n  if (focusedIndex < firstVisible || focusedIndex > firstVisible + months - 1) {\n    const day = Math.min(focused.day, daysInMonth(visible.year, visible.month))\n    const date = clampDate({ ...visible, day }, minDate, maxDate)\n    const index = monthIndex(date)\n    setFocused(\n      index < firstVisible || index > firstVisible + months - 1 ? { ...visible, day } : date,\n    )\n  }\n\n  useEffect(() => {\n    if (!shouldFocus.current) return\n    shouldFocus.current = false\n    rootRef.current?.querySelector<HTMLElement>(`[data-date=\"${formatDate(focused)}\"]`)?.focus()\n  }, [focused, visible])\n\n  const select = (date: CalendarDate) => {\n    setFocused(date)\n    if (!interactive || isUnavailable(date)) return\n    const iso = formatDate(date)\n    let next: string | DateRangeValue\n    if (mode === 'single') {\n      next = iso\n    } else if (!range.start || range.end) {\n      next = { start: iso, end: '' }\n    } else if (compareDates(date, range.start) < 0) {\n      next = { start: iso, end: formatDate(range.start) }\n    } else {\n      next = { start: formatDate(range.start), end: iso }\n    }\n    if (valueProp === undefined) setInternal(next)\n    onValueChangeRef.current?.(next as string & DateRangeValue)\n  }\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLElement>) => {\n    const rtl = rootRef.current ? getComputedStyle(rootRef.current).direction === 'rtl' : false\n    const ahead = rtl ? -1 : 1\n    const weekStart = (dayOfWeek(focused) - firstDay + 7) % 7\n    const moves: Record<string, () => CalendarDate> = {\n      ArrowLeft: () => addDays(focused, -ahead),\n      ArrowRight: () => addDays(focused, ahead),\n      ArrowUp: () => addDays(focused, -7),\n      ArrowDown: () => addDays(focused, 7),\n      Home: () => addDays(focused, -weekStart),\n      End: () => addDays(focused, 6 - weekStart),\n      PageUp: () => addMonths(focused, event.shiftKey ? -12 : -1),\n      PageDown: () => addMonths(focused, event.shiftKey ? 12 : 1),\n    }\n    const move = moves[event.key]\n    if (move) {\n      event.preventDefault()\n      const next = move()\n      moveFocus(next)\n      if (mode === 'range') setHovered(next)\n      return\n    }\n    if (event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault()\n      select(focused)\n    }\n  }\n\n  const turnPage = (step: 1 | -1) => {\n    const next = monthFromIndex(monthIndex(visible) + step)\n    setMonth(next)\n    const target = monthIndex(focused) + step\n    const targetMonth = monthFromIndex(target)\n    setFocused(\n      clampDate(\n        {\n          ...targetMonth,\n          day: Math.min(focused.day, daysInMonth(targetMonth.year, targetMonth.month)),\n        },\n        minDate,\n        maxDate,\n      ),\n    )\n  }\n\n  // The shaded span: the chosen range, or start → the hovered day while the end is pending.\n  const pending = mode === 'range' && range.start !== null && range.end === null\n  let spanStart = mode === 'range' ? range.start : null\n  let spanEnd = mode === 'range' ? range.end : null\n  if (pending && hovered && range.start) {\n    ;[spanStart, spanEnd] =\n      compareDates(hovered, range.start) < 0 ? [hovered, range.start] : [range.start, hovered]\n  }\n\n  const weekdays = weekdayNames(locale, firstDay)\n  const visibleMonths = Array.from({ length: months }, (_, i) =>\n    monthFromIndex(monthIndex(visible) + i),\n  )\n  const canGoBack = !minDate || monthIndex(visible) > monthIndex(minDate)\n  const canGoForward = !maxDate || monthIndex(visible) + months - 1 < monthIndex(maxDate)\n\n  return (\n    <div\n      ref={composedRef}\n      role=\"group\"\n      className={cx(styles.root, className)}\n      data-mode={mode}\n      data-months={months}\n      data-disabled={disabled || undefined}\n      aria-disabled={disabled || undefined}\n      {...rest}\n    >\n      <div className={styles.months}>\n        {visibleMonths.map((month, monthNumber) => {\n          const titleId = `${autoId}-title-${String(monthNumber)}`\n          const last = monthNumber === months - 1\n          return (\n            <div key={formatMonth(month)} className={styles.month}>\n              <div className={styles.header}>\n                <div id={titleId} className={styles.title} aria-live=\"polite\">\n                  {formatMonthYear(locale, month.year, month.month)}\n                </div>\n                {last ? (\n                  <div className={styles.nav}>\n                    <IconButton\n                      variant=\"ghost\"\n                      size=\"sm\"\n                      label={labels.previousMonth}\n                      icon={<ChevronLeftIcon />}\n                      disabled={disabled || !canGoBack}\n                      onClick={() => {\n                        turnPage(-1)\n                      }}\n                    />\n                    <IconButton\n                      variant=\"ghost\"\n                      size=\"sm\"\n                      label={labels.nextMonth}\n                      icon={<ChevronRightIcon />}\n                      disabled={disabled || !canGoForward}\n                      onClick={() => {\n                        turnPage(1)\n                      }}\n                    />\n                  </div>\n                ) : null}\n              </div>\n              <table role=\"grid\" className={styles.grid} aria-labelledby={titleId}>\n                <thead>\n                  <tr>\n                    {weekdays.map((weekday) => (\n                      <th\n                        key={weekday.long}\n                        scope=\"col\"\n                        abbr={weekday.long}\n                        className={styles.weekday}\n                      >\n                        {weekday.short}\n                      </th>\n                    ))}\n                  </tr>\n                </thead>\n                <tbody>\n                  {monthGrid(month, firstDay).map((week, row) => (\n                    <tr key={row}>\n                      {week.map((date, column) => {\n                        if (!date)\n                          return <td key={column} role=\"gridcell\" className={styles.empty} />\n                        const iso = formatDate(date)\n                        const unavailable = isUnavailable(date)\n                        const isStart = isSameDay(date, spanStart)\n                        const isEnd = isSameDay(date, spanEnd)\n                        const inSpan =\n                          spanStart !== null &&\n                          spanEnd !== null &&\n                          compareDates(date, spanStart) >= 0 &&\n                          compareDates(date, spanEnd) <= 0\n                        const selected =\n                          mode === 'single'\n                            ? isSameDay(date, range.start)\n                            : isSameDay(date, range.start) ||\n                              isSameDay(date, range.end) ||\n                              (!pending && inSpan)\n                        const isFocused = isSameDay(date, focused)\n                        return (\n                          <td\n                            key={column}\n                            role=\"gridcell\"\n                            className={styles.day}\n                            data-date={iso}\n                            tabIndex={disabled ? undefined : isFocused ? 0 : -1}\n                            aria-label={formatFullDate(locale, date)}\n                            aria-selected={selected}\n                            aria-disabled={disabled || unavailable || undefined}\n                            aria-current={isSameDay(date, today) ? 'date' : undefined}\n                            data-today={isSameDay(date, today) || undefined}\n                            data-selected={selected || undefined}\n                            data-unavailable={unavailable || undefined}\n                            data-range-start={(inSpan && isStart) || undefined}\n                            data-range-end={(inSpan && isEnd) || undefined}\n                            data-in-range={inSpan || undefined}\n                            data-preview={(pending && inSpan) || undefined}\n                            onClick={() => {\n                              select(date)\n                            }}\n                            onKeyDown={handleKeyDown}\n                            onFocus={() => {\n                              if (!isFocused) setFocused(date)\n                            }}\n                            onPointerEnter={() => {\n                              if (pending) setHovered(date)\n                            }}\n                          >\n                            <span className={styles.dayText}>{date.day}</span>\n                          </td>\n                        )\n                      })}\n                    </tr>\n                  ))}\n                </tbody>\n              </table>\n            </div>\n          )\n        })}\n      </div>\n    </div>\n  )\n})\n\nconst EMPTY_RANGE: DateRangeValue = { start: '', end: '' }\n"],"mappings":";;;;;;;;;;AA4CA,IAAME,KAAiC;CACrC,eAAe;CACf,WAAW;AACb,GAyDMC,KAAc,MAAaC,EAAE,OAAO,KAAKA,EAAE,QAAQ,GACnDC,KAAkB,OAA0B;CAChD,MAAM,KAAK,MAAMC,IAAQ,EAAE;CAC3B,OAAQA,IAAQ,KAAM;AACxB,IACMC,KAAc,MAA2C;CAC7D,IAAMC,IAAQC,IAAO,oBAAoB,KAAKA,CAAI,IAAI;CACtD,IAAI,CAACD,GAAO,OAAO;CACnB,IAAME,IAAQ,OAAOF,EAAM,EAAE;CAC7B,OAAOE,KAAS,KAAKA,KAAS,KAAK;EAAE,MAAM,OAAOF,EAAM,EAAE;EAAG;CAAM,IAAI;AACzE,GACMG,KAAe,MAAa,GAAGC,EAAIR,EAAE,MAAM,CAAC,EAAE,GAAGQ,EAAIR,EAAE,KAAK;AAGlE,SAASS,GAAU,GAAc,GAA6C;CAC5E,IAAMC,IAAQ;EAAE,MAAMJ,EAAM;EAAM,OAAOA,EAAM;EAAO,KAAK;CAAE,GACvDK,KAAUC,EAAUF,CAAK,IAAIG,IAAW,KAAK,GAC7CC,IAASC,EAAYT,EAAM,MAAMA,EAAM,KAAK;CAClD,OAAO,MAAM,KAAK,EAAE,QAAQ,EAAE,IAAI,GAAG,MACnC,MAAM,KAAK,EAAE,QAAQ,EAAE,IAAI,GAAG,MAAW;EACvC,IAAMU,IAAMC,IAAM,IAAIC,IAASP,IAAS;EACxC,OAAOK,KAAO,KAAKA,KAAOF,IAAS;GAAE,GAAGJ;GAAO;EAAI,IAAI;CACzD,CAAC,CACH;AACF;AAmCA,IAAaS,IAAWC,EAA0C,SAAkB,GAAO,GAAK;CAC9F,IAAM,EACJ,UAAO,UACP,OAAOC,GACP,kBACA,mBACA,SACA,SACA,oBACA,oBACA,YAASC,GACT,cACA,YAAS,GACT,OAAOC,GACP,kBACA,mBACA,cAAW,IACX,eAAW,IACX,gBAAY,IACZ,QAAQC,IACR,eACA,GAAGC,OACDC,GAMEC,IAAS;EAAE,GAAG7B;EAAgB,GAAG0B;CAAW,GAC5CI,KAASC,GAAM,GACfC,IAAUC,EAAuB,IAAI,GACrCC,KAAcC,EAAcC,GAAKJ,CAAO,GACxCK,KAAmBC,EAAUC,EAAa,GAE1C,CAACC,IAAUC,MAAeC,EAASC,OAAiBC,MAAS,UAAUC,KAAc,GAAG,GACxFC,IAAQvB,KAAaiB,IACrBO,IACJ,OAAOD,KAAU,WACb;EAAE,OAAOE,EAAUF,CAAK;EAAG,KAAKE,EAAUF,CAAK;CAAE,IACjD;EAAE,OAAOE,EAAUF,EAAM,KAAK;EAAG,KAAKE,EAAUF,EAAM,GAAG;CAAE,GAC3DG,IAAUD,EAAUE,MAAO,EAAE,GAC7BC,IAAUH,EAAUI,MAAO,EAAE,GAC7BC,IAAQC,GAAQC,EAAQ,GACxBxC,KAAYyC,MAAkBC,GAAsBC,CAAM,KAAK,GAC/DC,KAAc,CAACC,KAAY,CAACC,IAE5B,CAACC,GAASC,KAAcrB,QAC5BsB,EAAUjB,EAAM,SAASM,GAAOJ,GAASE,CAAO,CAClD,GACM,CAACc,IAAeC,MAAoBxB,QAClCrC,EAAW8D,EAAY,KAAK;EAAE,MAAML,EAAQ;EAAM,OAAOA,EAAQ;CAAM,CAC/E,GACMM,IAAU/D,EAAWoB,CAAS,KAAKwC,IACnC,CAACI,GAASC,KAAc5B,EAA8B,IAAI,GAC1D6B,IAActC,EAAOuC,EAAS,GAE9BC,KAAY,MAAgB;EAChC,AAAIxE,EAAWyE,CAAI,MAAMzE,EAAWmE,CAAO,MACvC3C,MAAc,KAAA,KAAWyC,GAAiBQ,CAAI,GAClDC,KAAgBlE,EAAYiE,CAAI,CAAC;CACnC,GAEME,KAAiB,MACpB3B,MAAY,QAAQ4B,EAAaC,GAAM7B,CAAO,IAAI,KAClDE,MAAY,QAAQ0B,EAAaC,GAAM3B,CAAO,IAAI,MAClD4B,KAAiBC,EAAWF,CAAI,CAAC,KAAK,KAGnCG,MAAa,MAAuB;EACxC,IAAMH,IAAOd,EAAUU,GAAMzB,GAASE,CAAO,GACvCvC,IAAQX,EAAWmE,CAAO,GAC1BhE,IAAQH,EAAW6E,CAAI;EAI7B,AAHI1E,IAAQQ,IAAO6D,EAAStE,EAAeC,CAAK,CAAC,IACxCA,IAAQQ,IAAQsE,IAAS,KAAGT,EAAStE,EAAeC,IAAQ8E,IAAS,CAAC,CAAC,GAChF,EAAY,UAAU,IACtBnB,EAAWe,CAAI;CACjB,GAGMK,IAAelF,EAAWmE,CAAO,GACjCgB,IAAenF,EAAW6D,CAAO;CACvC,IAAIsB,IAAeD,KAAgBC,IAAeD,IAAeD,IAAS,GAAG;EAC3E,IAAMhE,IAAM,KAAK,IAAI4C,EAAQ,KAAK7C,EAAYmD,EAAQ,MAAMA,EAAQ,KAAK,CAAC,GACpEU,IAAOd,EAAU;GAAE,GAAGI;GAAS;EAAI,GAAGnB,GAASE,CAAO,GACtD/C,IAAQH,EAAW6E,CAAI;EAC7B,EACE1E,IAAQ+E,KAAgB/E,IAAQ+E,IAAeD,IAAS,IAAI;GAAE,GAAGd;GAAS;EAAI,IAAIU,CACpF;CACF;CAEA,SAAgB;EACd,AAAKP,EAAY,YACjB,EAAY,UAAU,IACtBvC,EAAQ,SAAS,cAA2B,eAAegD,EAAWlB,CAAO,EAAE,GAAG,CAAC,EAAE,MAAM;CAC7F,GAAG,CAACA,GAASM,CAAO,CAAC;CAErB,IAAMiB,MAAU,MAAuB;EAErC,IADAtB,EAAWe,CAAI,GACX,CAACnB,MAAeiB,EAAcE,CAAI,GAAG;EACzC,IAAMQ,IAAMN,EAAWF,CAAI,GACvBJ;EAWJ,AAVA,AAOEA,IAPE9B,MAAS,WACJ0C,IACE,CAACvC,EAAM,SAASA,EAAM,MACxB;GAAE,OAAOuC;GAAK,KAAK;EAAG,IACpBT,EAAaC,GAAM/B,EAAM,KAAK,IAAI,IACpC;GAAE,OAAOuC;GAAK,KAAKN,EAAWjC,EAAM,KAAK;EAAE,IAE3C;GAAE,OAAOiC,EAAWjC,EAAM,KAAK;GAAG,KAAKuC;EAAI,GAEhD/D,MAAc,KAAA,KAAWkB,GAAYiC,CAAI,GAC7CrC,GAAiB,UAAUqC,CAA+B;CAC5D,GAEMa,MAAiB,MAAsC;EAE3D,IAAMC,IADMxD,EAAQ,WAAU,iBAAiBA,EAAQ,OAAO,CAAC,CAAC,cAAc,QAC1D,KAAK,GACnByD,KAAa3E,EAAUgD,CAAO,IAAI/C,IAAW,KAAK,GAWlD2E,IAAO;GATX,iBAAiBC,EAAQ7B,GAAS,CAAC0B,CAAK;GACxC,kBAAkBG,EAAQ7B,GAAS0B,CAAK;GACxC,eAAeG,EAAQ7B,GAAS,EAAE;GAClC,iBAAiB6B,EAAQ7B,GAAS,CAAC;GACnC,YAAY6B,EAAQ7B,GAAS,CAAC2B,CAAS;GACvC,WAAWE,EAAQ7B,GAAS,IAAI2B,CAAS;GACzC,cAAcG,EAAU9B,GAAS+B,EAAM,WAAW,MAAM,EAAE;GAC1D,gBAAgBD,EAAU9B,GAAS+B,EAAM,WAAW,KAAK,CAAC;EAE/C,EAAMA,EAAM;EACzB,IAAIH,GAAM;GACR,EAAM,eAAe;GACrB,IAAMhB,IAAOgB,EAAK;GAElB,AADAT,GAAUP,CAAI,GACV9B,MAAS,WAAS0B,EAAWI,CAAI;GACrC;EACF;EACA,CAAImB,EAAM,QAAQ,WAAWA,EAAM,QAAQ,SACzCA,EAAM,eAAe,GACrBR,GAAOvB,CAAO;CAElB,GAEMgC,MAAY,MAAiB;EACjC,IAAMpB,IAAOvE,EAAeF,EAAWmE,CAAO,IAAI2B,CAAI;EACtD,EAASrB,CAAI;EAEb,IAAMsB,IAAc7F,EADLF,EAAW6D,CAAO,IAAIiC,CACI;EACzC,EACE/B,EACE;GACE,GAAGgC;GACH,KAAK,KAAK,IAAIlC,EAAQ,KAAK7C,EAAY+E,EAAY,MAAMA,EAAY,KAAK,CAAC;EAC7E,GACA/C,GACAE,CACF,CACF;CACF,GAGM8C,IAAUrD,MAAS,WAAWG,EAAM,UAAU,QAAQA,EAAM,QAAQ,MACtEmD,IAAYtD,MAAS,UAAUG,EAAM,QAAQ,MAC7CoD,IAAUvD,MAAS,UAAUG,EAAM,MAAM;CAC7C,AAAIkD,KAAW5B,KAAWtB,EAAM,UAC7B,CAACmD,GAAWC,KACXtB,EAAaR,GAAStB,EAAM,KAAK,IAAI,IAAI,CAACsB,GAAStB,EAAM,KAAK,IAAI,CAACA,EAAM,OAAOsB,CAAO;CAG3F,IAAM+B,KAAWC,GAAa3C,GAAQ3C,CAAQ,GACxCuF,KAAgB,MAAM,KAAK,EAAE,QAAQpB,EAAO,IAAI,GAAG,MACvD/E,EAAeF,EAAWmE,CAAO,IAAImC,CAAC,CACxC,GACMC,KAAY,CAACvD,KAAWhD,EAAWmE,CAAO,IAAInE,EAAWgD,CAAO,GAChEwD,KAAe,CAACtD,KAAWlD,EAAWmE,CAAO,IAAIc,IAAS,IAAIjF,EAAWkD,CAAO;CAEtF,OACE,kBAAC,OAAD;EACE,KAAKjB;EACL,MAAK;EACL,WAAWwE,EAAG5G,EAAO,MAAM6G,EAAS;EACpC,aAAW/D;EACX,eAAasC;EACb,iBAAetB,KAAY,KAAA;EAC3B,iBAAeA,KAAY,KAAA;EAC3B,GAAIjC;EAEJ,UAAA,kBAAC,OAAD;GAAK,WAAW7B,EAAO;GACpB,UAAAwG,GAAc,KAAK,GAAO,MAAgB;IACzC,IAAMM,IAAU,GAAG9E,GAAO,SAAS,OAAO+E,CAAW,KAC/CC,IAAOD,MAAgB3B,IAAS;IACtC,OACE,kBAAC,OAAD;KAA8B,WAAWpF,EAAO;KAAhD,UAAA,CACE,kBAAC,OAAD;MAAK,WAAWA,EAAO;MAAvB,UAAA,CACE,kBAAC,OAAD;OAAK,IAAI8G;OAAS,WAAW9G,EAAO;OAAO,aAAU;OAClD,UAAAiH,GAAgBrD,GAAQlD,EAAM,MAAMA,EAAM,KAAK;MAC7C,CAAA,GACJsG,IACC,kBAAC,OAAD;OAAK,WAAWhH,EAAO;OAAvB,UAAA,CACE,kBAACkH,GAAD;QACE,SAAQ;QACR,MAAK;QACL,OAAOnF,EAAO;QACd,MAAM,kBAACoF,GAAD,CAAkB,CAAA;QACxB,UAAUrD,KAAY,CAAC4C;QACvB,eAAe;SACb,GAAS,EAAE;QACb;OACD,CAAA,GACD,kBAACQ,GAAD;QACE,SAAQ;QACR,MAAK;QACL,OAAOnF,EAAO;QACd,MAAM,kBAACqF,GAAD,CAAmB,CAAA;QACzB,UAAUtD,KAAY,CAAC6C;QACvB,eAAe;SACb,GAAS,CAAC;QACZ;OACD,CAAA,CACE;MACH,CAAA,IAAA,IACD;KACL,CAAA,GAAA,kBAAC,SAAD;MAAO,MAAK;MAAO,WAAW3G,EAAO;MAAM,mBAAiB8G;MAA5D,UAAA,CACE,kBAAC,SAAD,EAAA,UACE,kBAAC,MAAD,EAAA,UACGR,GAAS,KAAK,MACb,kBAAC,MAAD;OAEE,OAAM;OACN,MAAMe,EAAQ;OACd,WAAWrH,EAAO;OAEjB,UAAAqH,EAAQ;MACP,GANGA,EAAQ,IAMX,CACL,EACC,CAAA,EACC,CAAA,GACP,kBAAC,SAAD,EAAA,UACGxG,GAAUH,GAAOO,CAAQ,CAAC,CAAC,KAAK,GAAM,MACrC,kBAAC,MAAD,EAAA,UACGqG,EAAK,KAAK,GAAM,MAAW;OAC1B,IAAI,CAACtC,GACH,OAAO,kBAAC,MAAD;QAAiB,MAAK;QAAW,WAAWhF,EAAO;OAAQ,GAAlDsB,CAAkD;OACpE,IAAMkE,IAAMN,EAAWF,CAAI,GACrBuC,IAAczC,EAAcE,CAAI,GAChCwC,IAAUC,EAAUzC,GAAMoB,CAAS,GACnCsB,IAAQD,EAAUzC,GAAMqB,CAAO,GAC/BsB,IACJvB,MAAc,QACdC,MAAY,QACZtB,EAAaC,GAAMoB,CAAS,KAAK,KACjCrB,EAAaC,GAAMqB,CAAO,KAAK,GAC3BuB,IACJ9E,MAAS,WACL2E,EAAUzC,GAAM/B,EAAM,KAAK,IAC3BwE,EAAUzC,GAAM/B,EAAM,KAAK,KAC3BwE,EAAUzC,GAAM/B,EAAM,GAAG,KACxB,CAACkD,KAAWwB,GACbE,IAAYJ,EAAUzC,GAAMhB,CAAO;OACzC,OACE,kBAAC,MAAD;QAEE,MAAK;QACL,WAAWhE,EAAO;QAClB,aAAWwF;QACX,UAAU1B,IAAW,KAAA,IAAY+D,IAAY,IAAI;QACjD,cAAYC,GAAelE,GAAQoB,CAAI;QACvC,iBAAe4C;QACf,iBAAe9D,KAAYyD,KAAe,KAAA;QAC1C,gBAAcE,EAAUzC,GAAMzB,CAAK,IAAI,SAAS,KAAA;QAChD,cAAYkE,EAAUzC,GAAMzB,CAAK,KAAK,KAAA;QACtC,iBAAeqE,KAAY,KAAA;QAC3B,oBAAkBL,KAAe,KAAA;QACjC,oBAAmBI,KAAUH,KAAY,KAAA;QACzC,kBAAiBG,KAAUD,KAAU,KAAA;QACrC,iBAAeC,KAAU,KAAA;QACzB,gBAAexB,KAAWwB,KAAW,KAAA;QACrC,eAAe;SACb,GAAO3C,CAAI;QACb;QACA,WAAWS;QACX,eAAe;SACb,AAAKoC,KAAW5D,EAAWe,CAAI;QACjC;QACA,sBAAsB;SACpB,AAAImB,KAAS3B,EAAWQ,CAAI;QAC9B;QAEA,UAAA,kBAAC,QAAD;SAAM,WAAWhF,EAAO;SAAU,UAAAgF,EAAK;QAAU,CAAA;OAC/C,GA5BG1D,CA4BH;MAER,CAAC,EACC,GArDKD,CAqDL,CACL,EACI,CAAA,CACF;KACJ,CAAA,CAAA;IAxGK,GAAAV,EAAYD,CAAK,CAwGtB;GAET,CAAC;EACE,CAAA;CACF,CAAA;AAET,CAAC,GAEKqC,KAA8B;CAAE,OAAO;CAAI,KAAK;AAAG"}

package/dist/components/inputs/Calendar/Calendar.module.js

@@ -0,0 +1,18 @@
+//#region src/components/inputs/Calendar/Calendar.module.css
+var e = "kiln-Calendar__root", t = "kiln-Calendar__months", n = "kiln-Calendar__month", r = "kiln-Calendar__header", i = "kiln-Calendar__title", a = "kiln-Calendar__nav", o = "kiln-Calendar__grid", s = "kiln-Calendar__weekday", c = "kiln-Calendar__empty", l = "kiln-Calendar__day", u = "kiln-Calendar__dayText", d = {
+	root: e,
+	months: t,
+	month: n,
+	header: r,
+	title: i,
+	nav: a,
+	grid: o,
+	weekday: s,
+	empty: c,
+	day: l,
+	dayText: u
+};
+//#endregion
+export { l as day, u as dayText, d as default, c as empty, o as grid, r as header, n as month, t as months, a as nav, e as root, i as title, s as weekday };
+
+//# sourceMappingURL=Calendar.module.js.map

package/dist/components/inputs/Calendar/Calendar.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Calendar.module.js","names":["root","months","month","header","title","nav","grid","weekday","empty","day","dayText","Calendar_module_default"],"sources":["../../../../src/components/inputs/Calendar/Calendar.module.css"],"sourcesContent":["/*\n * A month (or two) of days. Figures are tabular in the theme's numeric face so columns line\n * up; the picked day takes the accent, a range's days between take the soft accent as one\n * continuous band, and today is underlined rather than coloured, so it never reads as picked.\n *\n * Component tokens:\n *   --calendar-cell-size      default var(--control-md)\n *   --calendar-day-radius     default var(--radius-action)\n *   --calendar-selected-bg    default var(--color-accent)\n *   --calendar-selected-ink   default var(--color-accent-ink)\n *   --calendar-range-bg       default var(--color-accent-soft)\n */\n.root {\n  --_cell: var(--calendar-cell-size, var(--control-md));\n\n  display: inline-flex;\n  flex-direction: column;\n  max-inline-size: 100%;\n  color: var(--color-ink);\n  font-family: var(--font-text);\n}\n\n.months {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--space-5);\n}\n\n.month {\n  display: flex;\n  flex-direction: column;\n  gap: var(--space-2);\n}\n\n.header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--space-2);\n  min-block-size: var(--control-sm);\n  padding-inline-start: var(--space-2);\n}\n\n.title {\n  font-family: var(--heading-font);\n  font-size: var(--text-md);\n  font-weight: var(--heading-weight);\n  letter-spacing: var(--heading-tracking);\n  font-variant-numeric: tabular-nums lining-nums;\n}\n\n.nav {\n  display: inline-flex;\n  gap: var(--space-1);\n}\n\n.grid {\n  border-collapse: collapse;\n  border-spacing: 0;\n  table-layout: fixed;\n}\n\n.weekday {\n  inline-size: var(--_cell);\n  padding-block-end: var(--space-1);\n  color: var(--color-ink-muted);\n  font-size: var(--text-xs);\n  font-weight: var(--label-weight);\n  letter-spacing: var(--label-tracking);\n  text-align: center;\n  text-transform: var(--label-transform);\n}\n\n.empty,\n.day {\n  inline-size: var(--_cell);\n  block-size: var(--_cell);\n  padding: 0;\n}\n\n.day {\n  position: relative;\n  outline: none;\n  font-family: var(--font-numeric);\n  font-size: var(--text-sm);\n  font-stretch: var(--numeric-stretch);\n  font-variant-numeric: tabular-nums lining-nums;\n  text-align: center;\n  cursor: pointer;\n}\n\n.dayText {\n  position: relative;\n  z-index: 1;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  inline-size: 100%;\n  block-size: 100%;\n  border-radius: var(--calendar-day-radius, var(--radius-action));\n  transition:\n    background-color var(--dur-1) var(--ease-out),\n    color var(--dur-1) var(--ease-out);\n}\n\n@media (hover: hover) {\n  .day:hover:not([aria-disabled='true'], [data-selected]) .dayText {\n    background-color: var(--color-surface-sunken);\n  }\n}\n\n.day:focus-visible {\n  z-index: 2;\n}\n.day:focus-visible .dayText {\n  outline: 2px solid var(--color-focus);\n  outline-offset: 2px;\n}\n\n/* Today: an underline, not a fill, so it never reads as the picked day. */\n.day[data-today] .dayText {\n  text-decoration: underline;\n  text-decoration-thickness: 2px;\n  text-underline-offset: 0.3em;\n}\n\n/* The band between a range's ends; at each end it reaches only the inner half. */\n.day[data-in-range]::before {\n  position: absolute;\n  inset: 0;\n  background-color: var(--calendar-range-bg, var(--color-accent-soft));\n  content: '';\n}\n.day[data-range-start]::before {\n  inset-inline-start: 50%;\n}\n.day[data-range-end]::before {\n  inset-inline-end: 50%;\n}\n.day[data-range-start][data-range-end]::before {\n  content: none;\n}\n\n.day[data-selected] .dayText,\n.day[data-preview][data-range-start] .dayText,\n.day[data-preview][data-range-end] .dayText {\n  background-color: var(--calendar-selected-bg, var(--color-accent));\n  color: var(--calendar-selected-ink, var(--color-accent-ink));\n}\n.day[data-in-range][data-selected]:not([data-range-start], [data-range-end]) .dayText {\n  background-color: transparent;\n  color: var(--color-ink);\n}\n\n/* Unavailable: struck through as well as faded, so it doesn't rest on colour alone. */\n.day[aria-disabled='true'] {\n  color: var(--color-ink-subtle);\n  cursor: not-allowed;\n}\n.day[data-unavailable] .dayText {\n  text-decoration: line-through;\n}\n\n.root[data-disabled] {\n  opacity: 0.6;\n}\n"],"mappings":""}

package/dist/components/inputs/Calendar/index.d.ts

@@ -0,0 +1,2 @@
+export { Calendar } from './Calendar.js';
+export type { CalendarProps, CalendarSingleProps, CalendarRangeProps, CalendarLabels, } from './Calendar.js';

package/dist/components/inputs/Combobox/Combobox.js

@@ -2,44 +2,36 @@ import { cx as e } from "../../../utils/cx.js";
 import { CheckIcon as t, ChevronDownIcon as n, CloseIcon as r } from "../../../icons/icons.js";
 import { useMergedRefs as i } from "../internal/refs.js";
 import { Spinner as a } from "../../feedback/Spinner/Spinner.js";
-import { markFieldAware as o, useResolvedField as ee } from "../internal/FieldContext.js";
-import te from "../internal/messages.module.js";
-import ne from "../internal/control.module.js";
-import { Tag as re, TagList as ie } from "../../display/Tag/Tag.js";
-import { PortalAnchorContext as ae, usePortalTheme as oe } from "../../overlays/usePortalTheme.js";
-import { filterOptions as s, foldText as se } from "../internal/filterOptions.js";
-import { useControllableState as c } from "./useControllableState.js";
+import { PortalAnchorContext as ee, usePortalTheme as o } from "../../overlays/usePortalTheme.js";
+import { markFieldAware as te, useResolvedField as ne } from "../internal/FieldContext.js";
+import re from "../internal/messages.module.js";
+import ie from "../internal/control.module.js";
+import { useControllableState as s } from "./useControllableState.js";
+import { Tag as ae, TagList as oe } from "../../display/Tag/Tag.js";
+import { filterOptions as se, foldText as ce, groupOptions as c } from "../internal/filterOptions.js";
 import l from "./Combobox.module.js";
-import { forwardRef as u, useCallback as d, useEffect as f, useId as ce, useMemo as le, useRef as p, useState as m } from "react";
+import { forwardRef as u, useCallback as d, useEffect as f, useId as le, useMemo as ue, useRef as p, useState as m } from "react";
 import { jsx as h, jsxs as g } from "react/jsx-runtime";
 import { Popover as _ } from "radix-ui";
 //#region src/components/inputs/Combobox/Combobox.tsx
-function ue(e, t, n) {
-	let r = n ? s(e, t) : [...e], i = [], a = /* @__PURE__ */ new Map();
-	for (let e of r) {
-		let t = e.group === void 0 ? "" : `g:${e.group}`, n = a.get(t);
-		n || (n = {
-			key: t,
-			label: e.group,
-			options: []
-		}, a.set(t, n), i.push(n)), n.options.push(e);
-	}
+function de(e, t, n) {
+	let r = n ? se(e, t) : [...e], i = c(r);
 	return {
 		sections: i,
 		ordered: i.flatMap((e) => e.options)
 	};
 }
 var v = (e) => `Remove ${e}`;
-function de(e) {
+function fe(e) {
 	if (e.multiple === !0) {
-		let { multiple: t, value: n, defaultValue: r, onValueChange: i, maxSelected: a, removeLabel: o, ...ee } = e;
-		return [ee, {
+		let { multiple: t, value: n, defaultValue: r, onValueChange: i, maxSelected: a, removeLabel: ee, ...o } = e;
+		return [o, {
 			multiple: t,
 			value: n,
 			defaultValue: r ?? [],
 			emit: (e) => i?.([...e]),
 			maxSelected: a,
-			removeLabel: o ?? v
+			removeLabel: ee ?? v
 		}];
 	}
 	let { multiple: t, value: n, defaultValue: r, onValueChange: i, ...a } = e;
@@ -52,15 +44,15 @@ function de(e) {
 		removeLabel: v
 	}];
 }
-function fe(e) {
+function pe(e) {
 	let t = e?.closest("[data-theme]");
 	return t && t !== e?.ownerDocument.documentElement ? t : void 0;
 }
-function pe(e) {
+function me(e) {
 	return `${String(e)} ${e === 1 ? "option" : "options"} available`;
 }
-var me = u(function({ children: e, onInteractOutside: t }, n) {
-	let r = oe();
+var he = u(function({ children: e, onInteractOutside: t }, n) {
+	let r = o();
 	return /* @__PURE__ */ h(_.Content, {
 		ref: n,
 		className: l.popup,
@@ -85,8 +77,8 @@ var me = u(function({ children: e, onInteractOutside: t }, n) {
 		...r,
 		children: e
 	});
-}), he = o(u(function(o, oe) {
-	let [s, u] = de(o), { options: v, inputValue: he, defaultInputValue: ge, onInputValueChange: _e, filter: ve = "auto", loading: y = !1, loadingMessage: ye = "Loading…", emptyMessage: b = "No matches", open: be, defaultOpen: xe = !1, onOpenChange: Se, creatable: x = !1, clearable: Ce = !1, clearLabel: we = "Clear", size: Te = "md", invalid: Ee, id: De, disabled: Oe, required: ke, readOnly: Ae, name: S, form: je, placeholder: Me, className: Ne, style: Pe, onKeyDown: Fe, onBlur: Ie, onClick: Le, "aria-describedby": Re, "aria-invalid": ze, "aria-label": Be, "aria-labelledby": Ve, ...He } = s, { multiple: C, maxSelected: Ue, removeLabel: We } = u, w = ee({
+}), ge = te(u(function(o, te) {
+	let [se, c] = fe(o), { options: u, inputValue: v, defaultInputValue: ge, onInputValueChange: _e, filter: ve = "auto", loading: y = !1, loadingMessage: ye = "Loading…", emptyMessage: b = "No matches", open: be, defaultOpen: xe = !1, onOpenChange: Se, creatable: x = !1, clearable: Ce = !1, clearLabel: we = "Clear", size: Te = "md", invalid: Ee, id: De, disabled: Oe, required: ke, readOnly: Ae, name: S, form: je, placeholder: Me, className: Ne, style: Pe, onKeyDown: Fe, onBlur: Ie, onClick: Le, "aria-describedby": Re, "aria-invalid": ze, "aria-label": Be, "aria-labelledby": Ve, ...He } = se, { multiple: C, maxSelected: Ue, removeLabel: We } = c, w = ne({
 		id: De,
 		describedBy: Re,
 		invalid: Ee,
@@ -94,13 +86,13 @@ var me = u(function({ children: e, onInteractOutside: t }, n) {
 		required: ke,
 		disabled: Oe,
 		readOnly: Ae
-	}), Ge = ce(), T = w.id ?? `${Ge}combobox`, Ke = `${T}-listbox`, qe = `${T}-status`, E = !w.disabled && !w.readOnly, D = p(null), O = p(null), Je = i(oe, D), k = p(/* @__PURE__ */ new Map());
-	for (let e of v) k.current.set(e.value, e.label);
-	let A = d((e) => v.find((t) => t.value === e)?.label ?? k.current.get(e) ?? e, [v]), [j, M] = c(u.value, u.defaultValue, u.emit), N = !C && j[0] !== void 0 ? A(j[0]) : "", [P, Ye] = c(he, ge ?? (C || u.defaultValue[0] === void 0 ? "" : A(u.defaultValue[0])), _e), Xe = p(P);
+	}), Ge = le(), T = w.id ?? `${Ge}combobox`, Ke = `${T}-listbox`, qe = `${T}-status`, E = !w.disabled && !w.readOnly, D = p(null), O = p(null), Je = i(te, D), k = p(/* @__PURE__ */ new Map());
+	for (let e of u) k.current.set(e.value, e.label);
+	let A = d((e) => u.find((t) => t.value === e)?.label ?? k.current.get(e) ?? e, [u]), [j, M] = s(c.value, c.defaultValue, c.emit), N = !C && j[0] !== void 0 ? A(j[0]) : "", [P, Ye] = s(v, ge ?? (C || c.defaultValue[0] === void 0 ? "" : A(c.defaultValue[0])), _e), Xe = p(P);
 	Xe.current = P;
 	let F = d((e) => {
 		e !== Xe.current && Ye(e);
-	}, [Ye]), [I, L] = m(!1), [R, Ze] = c(be, xe, Se), z = p(R);
+	}, [Ye]), [I, L] = m(!1), [R, Ze] = s(be, xe, Se), z = p(R);
 	z.current = R;
 	let B = d((e) => {
 		e !== z.current && Ze(e);
@@ -113,11 +105,11 @@ var me = u(function({ children: e, onInteractOutside: t }, n) {
 		N,
 		F
 	]);
-	let $e = ve === "auto" && (C || I), { sections: H, ordered: U } = le(() => ue(v, P, $e), [
-		v,
+	let $e = ve === "auto" && (C || I), { sections: H, ordered: U } = ue(() => de(u, P, $e), [
+		u,
 		P,
 		$e
-	]), et = le(() => new Map(v.map((e, t) => [e.value, t])), [v]), tt = (e) => `${T}-option-${String(et.get(e) ?? 0)}`, nt = C && Ue !== void 0 && j.length >= Ue, W = (e) => j.includes(e), G = (e) => !!e.disabled || nt && !W(e.value), K = U.filter((e) => !G(e)), q = P.trim(), rt = x && q !== "" && (C || I), it = !y && U.length === 0 && !rt, at = U.length > 0 || y || it, J = R && E && at, ot = J && !y && !x && q !== "" && (C || I), st = K.find((e) => e.value === Qe) ?? (ot ? K[0] : void 0), Y = J ? st : void 0, [ct, lt] = m(""), X = y ? "" : U.length === 0 ? typeof b == "string" ? b : "No matches" : pe(U.length);
+	]), et = ue(() => new Map(u.map((e, t) => [e.value, t])), [u]), tt = (e) => `${T}-option-${String(et.get(e) ?? 0)}`, nt = C && Ue !== void 0 && j.length >= Ue, W = (e) => j.includes(e), G = (e) => !!e.disabled || nt && !W(e.value), K = U.filter((e) => !G(e)), q = P.trim(), rt = x && q !== "" && (C || I), it = !y && U.length === 0 && !rt, at = U.length > 0 || y || it, J = R && E && at, ot = J && !y && !x && q !== "" && (C || I), st = K.find((e) => e.value === Qe) ?? (ot ? K[0] : void 0), Y = J ? st : void 0, [ct, lt] = m(""), X = y ? "" : U.length === 0 ? typeof b == "string" ? b : "No matches" : me(U.length);
 	f(() => {
 		if (!J || X === "") {
 			J || lt("");
@@ -143,7 +135,7 @@ var me = u(function({ children: e, onInteractOutside: t }, n) {
 		}
 	}, Q = () => {
 		if (!x || q === "") return !1;
-		let e = se(q), t = v.find((t) => !t.disabled && se(t.label) === e), n = t?.value ?? q, r = t?.label ?? q;
+		let e = ce(q), t = u.find((t) => !t.disabled && ce(t.label) === e), n = t?.value ?? q, r = t?.label ?? q;
 		return k.current.set(n, r), C ? (F(""), L(!1), W(n) || nt ? !1 : (M([...j, n]), !0)) : (L(!1), F(r), j[0] !== n && (M([n]), !0));
 	}, dt = (e) => {
 		E && M(j.filter((t) => t !== e));
@@ -240,13 +232,13 @@ var me = u(function({ children: e, onInteractOutside: t }, n) {
 		onOpenChange: (e) => {
 			e || B(!1);
 		},
-		children: /* @__PURE__ */ g(ae.Provider, {
+		children: /* @__PURE__ */ g(ee.Provider, {
 			value: O,
 			children: [/* @__PURE__ */ h(_.Anchor, {
 				asChild: !0,
 				children: /* @__PURE__ */ g("div", {
 					ref: O,
-					className: e(ne.box, l.root, Ne),
+					className: e(ie.box, l.root, Ne),
 					style: Pe,
 					"data-size": Te,
 					"data-multiple": C || void 0,
@@ -259,11 +251,11 @@ var me = u(function({ children: e, onInteractOutside: t }, n) {
 					children: [
 						/* @__PURE__ */ g("div", {
 							className: l.values,
-							children: [C && j.length > 0 ? /* @__PURE__ */ h(ie, {
+							children: [C && j.length > 0 ? /* @__PURE__ */ h(oe, {
 								className: l.chips,
 								children: j.map((e) => {
 									let t = A(e);
-									return /* @__PURE__ */ h(re, {
+									return /* @__PURE__ */ h(ae, {
 										className: l.chip,
 										onRemove: E ? () => {
 											dt(e), D.current?.focus();
@@ -341,14 +333,14 @@ var me = u(function({ children: e, onInteractOutside: t }, n) {
 							id: qe,
 							role: "status",
 							"aria-live": "polite",
-							className: te.visuallyHidden,
+							className: re.visuallyHidden,
 							children: ct
 						})
 					]
 				})
 			}), /* @__PURE__ */ h(_.Portal, {
-				container: J ? fe(O.current) : void 0,
-				children: /* @__PURE__ */ g(me, {
+				container: J ? pe(O.current) : void 0,
+				children: /* @__PURE__ */ g(he, {
 					onInteractOutside: bt,
 					children: [
 						/* @__PURE__ */ h("div", {
@@ -389,6 +381,6 @@ var me = u(function({ children: e, onInteractOutside: t }, n) {
 	});
 }));
 //#endregion
-export { he as Combobox };
+export { ge as Combobox };
 
 //# sourceMappingURL=Combobox.js.map