@seekalfred/primitives 0.2.0 → 0.4.0

package/dist/calendar/calendar.d.ts

@@ -0,0 +1,154 @@
+import { CalendarProps, RangeCalendarProps } from "react-aria-components";
+import { DateValue } from "@internationalized/date";
+//#region src/calendar/calendar.d.ts
+/**
+ * Calendar, built on React Aria's Calendar and RangeCalendar.
+ *
+ * Values are `DateValue` objects from `@internationalized/date`, NOT JS
+ * `Date`. ADR 0006 names that package the one allowed public type dependency
+ * precisely here: a calendar day has no time zone, so modelling it as a
+ * timestamp is what costs you a day at a DST boundary. The import is
+ * `import type` only — nothing at runtime needs a constructor from it, so the
+ * package contributes zero bytes to the bundle.
+ *
+ * Every string below is a STATIC literal. Tailwind scans source text, so a
+ * class assembled at runtime is invisible to it and would simply never be
+ * emitted — the component would render unstyled, with no error anywhere.
+ *
+ * State comes from React Aria's data attributes rather than pseudo-classes:
+ * `data-[focus-visible]` is keyboard focus only, and `data-[hovered]` /
+ * `data-[pressed]` cover pointer, touch and keyboard uniformly.
+ */
+export declare const calendarVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const calendarLabelVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const calendarHeaderVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+/**
+ * The month/prev/next buttons.
+ *
+ * Deliberately NOT `buttonVariants` from ../button. That would put a
+ * cross-component import in the bundle for one caller and six classes, and
+ * DRY extracts at two callers, not one.
+ */
+export declare const calendarNavVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const calendarMonthsVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const calendarHeadingVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const calendarGridVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const calendarHeaderCellVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const calendarClearVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+/**
+ * A day.
+ *
+ * Sized from `--density-control-h-sm` rather than a new
+ * `--density-calendar-cell`: the density contract test requires every scope to
+ * declare every token name, so a new one is three file edits — and this one is
+ * already 30/36/42px, all clear of the 24px floor that WCAG 2.2 SC 2.5.8 sets.
+ *
+ * ARCHITECTURE section 5 rule 6 — no state is carried by colour alone, because
+ * every author colour is replaced under forced-colors and the distinction
+ * would vanish. Selected adds weight, the range ends add SHAPE, today is an
+ * underline (not an outline, which would fight the focus ring) and unavailable
+ * is a strikethrough.
+ */
+export declare const calendarCellVariants: (props?: ({
+  selection?: "single" | "range" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+interface CalendarSharedProps {
+  /**
+   * Accessible name for the calendar.
+   *
+   * REQUIRED. React Aria renders the root as `role="application"`, which has
+   * no implicit name, so without this every calendar announces as an unnamed
+   * application — the same finding that made `label` required on Select,
+   * Progress, Slider and ScrollArea.
+   */
+  label: string;
+  /**
+   * Hide the label visually while leaving it on the accessibility tree. Pass
+   * this when the surrounding UI already names the control.
+   *
+   * @default false
+   */
+  labelHidden?: boolean;
+  /**
+   * Number of months displayed side by side. Maps to React Aria's
+   * `visibleDuration`, which is omitted from the public surface so the two
+   * cannot disagree.
+   *
+   * @default 1
+   */
+  visibleMonths?: number;
+  /**
+   * Render a Clear button that resets the selection to `null`.
+   *
+   * Works controlled and uncontrolled: the button calls React Aria's
+   * `setValue(null)` through context, so `onChange` fires either way and there
+   * is no `onClear` for a consumer to wire up.
+   *
+   * @default false
+   */
+  clearable?: boolean;
+  /**
+   * Visible text of the Clear button.
+   *
+   * A prop rather than a literal because `ARCHITECTURE.md` §7 rule 9 forbids
+   * hard-coded user-visible strings and says it cannot be retrofitted.
+   * `useMessages()` does not exist yet, so this follows Dialog's `closeLabel`.
+   *
+   * @default "Clear"
+   */
+  clearLabel?: string;
+  /**
+   * Accessible name for the previous-month button, which is icon-only. Same
+   * reasoning as {@link CalendarSharedProps.clearLabel}.
+   *
+   * @default "Previous month"
+   */
+  previousLabel?: string;
+  /**
+   * Accessible name for the next-month button. Same reasoning as
+   * {@link CalendarSharedProps.clearLabel}.
+   *
+   * @default "Next month"
+   */
+  nextLabel?: string;
+  /** Extra classes. Merged last through `cn()`, so the consumer wins. */
+  className?: string;
+}
+/**
+ * Props for {@link Calendar}.
+ *
+ * Extends the React Aria type via `Omit` rather than
+ * `ComponentPropsWithoutRef`, matching every other React Aria-backed component
+ * here and recorded in ADR 0008. Intersecting would advertise DOM props that
+ * React Aria ignores silently.
+ */
+interface CalendarProps$1 extends Omit<CalendarProps<DateValue>, "className" | "style" | "children" | "visibleDuration">, CalendarSharedProps {}
+/** Props for {@link CalendarRange}. */
+export interface CalendarRangeProps extends Omit<RangeCalendarProps<DateValue>, "className" | "style" | "children" | "visibleDuration">, CalendarSharedProps {}
+/**
+ * A calendar for picking a single date.
+ *
+ * Maturity: **experimental**. `ARCHITECTURE.md` §7 rule 8's metadata mechanism
+ * does not exist yet, and ADR 0006 blocks `stable` until a WebKit test
+ * instance lands regardless.
+ *
+ * `onChange` hands back a `DateValue`; `String(value)` is its `YYYY-MM-DD`
+ * form, which is what an API filter or query parameter wants.
+ *
+ * @example
+ * <Calendar label="Report date" value={date} onChange={setDate} clearable />
+ */
+declare function Calendar$1({ className, label, labelHidden, visibleMonths, clearable, clearLabel, previousLabel, nextLabel, ...props }: CalendarProps$1): import("react").JSX.Element;
+/**
+ * A calendar for picking a contiguous date range.
+ *
+ * `onChange` hands back `{ start, end }`, both `DateValue`.
+ *
+ * @example
+ * <CalendarRange label="Period" visibleMonths={3}
+ *                value={range} onChange={setRange} clearable />
+ */
+export declare function CalendarRange({ className, label, labelHidden, visibleMonths, clearable, clearLabel, previousLabel, nextLabel, ...props }: CalendarRangeProps): import("react").JSX.Element;
+//#endregion
+export { Calendar$1 as Calendar, CalendarProps$1 as CalendarProps };
+//# sourceMappingURL=calendar.d.ts.map

package/dist/calendar/calendar.js

@@ -0,0 +1,282 @@
+"use client";
+import { cn } from "../lib/cn.js";
+import { cva } from "class-variance-authority";
+import { Button, Calendar, CalendarCell, CalendarGrid, CalendarGridBody, CalendarGridHeader, CalendarHeaderCell, CalendarHeading, CalendarStateContext, RangeCalendar, RangeCalendarStateContext } from "react-aria-components";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useContext } from "react";
+//#region src/calendar/calendar.tsx
+/**
+* Calendar, built on React Aria's Calendar and RangeCalendar.
+*
+* Values are `DateValue` objects from `@internationalized/date`, NOT JS
+* `Date`. ADR 0006 names that package the one allowed public type dependency
+* precisely here: a calendar day has no time zone, so modelling it as a
+* timestamp is what costs you a day at a DST boundary. The import is
+* `import type` only — nothing at runtime needs a constructor from it, so the
+* package contributes zero bytes to the bundle.
+*
+* Every string below is a STATIC literal. Tailwind scans source text, so a
+* class assembled at runtime is invisible to it and would simply never be
+* emitted — the component would render unstyled, with no error anywhere.
+*
+* State comes from React Aria's data attributes rather than pseudo-classes:
+* `data-[focus-visible]` is keyboard focus only, and `data-[hovered]` /
+* `data-[pressed]` cover pointer, touch and keyboard uniformly.
+*/
+const calendarVariants = cva(["flex w-fit flex-col gap-(--density-gap) box-border", "font-sans text-sm leading-(--leading-normal) text-foreground"]);
+const calendarLabelVariants = cva(["text-sm font-medium text-foreground"]);
+const calendarHeaderVariants = cva(["flex items-center justify-between gap-(--density-control-gap)"]);
+/**
+* The month/prev/next buttons.
+*
+* Deliberately NOT `buttonVariants` from ../button. That would put a
+* cross-component import in the bundle for one caller and six classes, and
+* DRY extracts at two callers, not one.
+*/
+const calendarNavVariants = cva([
+	"inline-flex shrink-0 items-center justify-center",
+	"size-(--density-control-h-sm) rounded-md",
+	"border-(length:--border-width) border-transparent bg-transparent",
+	"cursor-pointer select-none text-foreground outline-none",
+	"[&_svg]:pointer-events-none [&_svg]:shrink-0",
+	"[&_svg:not([class*='size-'])]:size-(--icon-sm)",
+	"[&_svg]:rtl:-scale-x-100",
+	"motion-safe:transition-colors motion-safe:duration-(--duration-fast) motion-safe:ease-standard",
+	"data-[hovered]:bg-muted data-[pressed]:bg-muted",
+	"data-[focus-visible]:outline-solid data-[focus-visible]:outline-(length:--focus-ring-width)",
+	"data-[focus-visible]:outline-offset-(--focus-ring-offset) data-[focus-visible]:outline-(--color-ring)",
+	"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-(--opacity-disabled)"
+]);
+const calendarMonthsVariants = cva(["flex flex-col gap-(--density-gap) sm:flex-row sm:items-start"]);
+const calendarHeadingVariants = cva(["mb-1 text-center text-sm font-semibold text-foreground"]);
+const calendarGridVariants = cva(["border-collapse"]);
+const calendarHeaderCellVariants = cva(["w-(--density-control-h-sm) pb-1", "text-center text-2xs font-medium text-muted-foreground"]);
+const calendarClearVariants = cva([
+	"self-end rounded-md px-2 py-1",
+	"border-(length:--border-width) border-transparent bg-transparent",
+	"cursor-pointer select-none text-sm text-muted-foreground outline-none",
+	"motion-safe:transition-colors motion-safe:duration-(--duration-fast) motion-safe:ease-standard",
+	"data-[hovered]:bg-muted data-[hovered]:text-foreground",
+	"data-[focus-visible]:outline-solid data-[focus-visible]:outline-(length:--focus-ring-width)",
+	"data-[focus-visible]:outline-offset-(--focus-ring-offset) data-[focus-visible]:outline-(--color-ring)"
+]);
+/**
+* A day.
+*
+* Sized from `--density-control-h-sm` rather than a new
+* `--density-calendar-cell`: the density contract test requires every scope to
+* declare every token name, so a new one is three file edits — and this one is
+* already 30/36/42px, all clear of the 24px floor that WCAG 2.2 SC 2.5.8 sets.
+*
+* ARCHITECTURE section 5 rule 6 — no state is carried by colour alone, because
+* every author colour is replaced under forced-colors and the distinction
+* would vanish. Selected adds weight, the range ends add SHAPE, today is an
+* underline (not an outline, which would fight the focus ring) and unavailable
+* is a strikethrough.
+*/
+const calendarCellVariants = cva([
+	"flex items-center justify-center box-border",
+	"size-(--density-control-h-sm) rounded-md",
+	"text-sm leading-(--leading-normal) text-foreground",
+	"cursor-pointer select-none outline-none",
+	"motion-safe:transition-colors motion-safe:duration-(--duration-fast) motion-safe:ease-standard",
+	"data-[hovered]:bg-muted",
+	"data-[today]:font-semibold data-[today]:underline data-[today]:underline-offset-4",
+	"data-[outside-month]:text-muted-foreground data-[outside-month]:opacity-(--opacity-disabled)",
+	"data-[unavailable]:cursor-not-allowed data-[unavailable]:text-muted-foreground",
+	"data-[unavailable]:line-through",
+	"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-(--opacity-disabled)",
+	"data-[focus-visible]:outline-solid data-[focus-visible]:outline-(length:--focus-ring-width)",
+	"data-[focus-visible]:outline-offset-(--focus-ring-offset) data-[focus-visible]:outline-(--color-ring)"
+], {
+	variants: { 
+	/**
+	* A variant axis rather than a boolean prop, because the two modes are
+	* mutually exclusive visual treatments of the same element — which is
+	* exactly what OCP asks a variant to model.
+	*/
+selection: {
+		single: ["data-[selected]:bg-primary data-[selected]:text-primary-foreground", "data-[selected]:font-semibold"],
+		range: [
+			"data-[selected]:rounded-none data-[selected]:bg-muted data-[selected]:text-foreground",
+			"data-[selection-start]:rounded-s-md data-[selection-start]:bg-primary",
+			"data-[selection-start]:font-semibold data-[selection-start]:text-primary-foreground",
+			"data-[selection-end]:rounded-e-md data-[selection-end]:bg-primary",
+			"data-[selection-end]:font-semibold data-[selection-end]:text-primary-foreground"
+		]
+	} },
+	defaultVariants: { selection: "single" }
+});
+function ChevronPrevious() {
+	return /* @__PURE__ */ jsx("svg", {
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "2",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ jsx("path", {
+			d: "m15 18-6-6 6-6",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+function ChevronNext() {
+	return /* @__PURE__ */ jsx("svg", {
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "2",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ jsx("path", {
+			d: "m9 18 6-6-6-6",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+/**
+* Resets the selection to null.
+*
+* It reads the calendar state from React Aria's context and calls
+* `setValue(null)`, which runs through `useControlledState` — so it fires
+* `onChange` for a controlled parent AND updates uncontrolled state, with no
+* mirrored state here. That is the whole reason there is no `onClear` prop:
+* from inside the provider tree the reset is free, and from outside it it
+* would force every consumer to own the value.
+*
+* The two states are narrowed separately rather than through a union, because
+* `setValue` has a different parameter type on each and the union call is not
+* assignable to either.
+*
+* `slot={null}` opts out of the Button context: inside a Calendar that context
+* carries the previous/next slots, and an unslotted Button would claim one.
+*/
+function ClearButton({ label }) {
+	const calendarState = useContext(CalendarStateContext);
+	const rangeState = useContext(RangeCalendarStateContext);
+	const state = calendarState ?? rangeState;
+	const isInert = Boolean(state?.isDisabled ?? false) || Boolean(state?.isReadOnly ?? false);
+	return /* @__PURE__ */ jsx(Button, {
+		slot: null,
+		"data-slot": "calendar-clear",
+		isDisabled: isInert,
+		className: calendarClearVariants(),
+		onPress: () => {
+			if (calendarState) calendarState.setValue(null);
+			else rangeState?.setValue(null);
+		},
+		children: label
+	});
+}
+/** Header, grids and Clear — identical under both calendar roots. */
+function CalendarBody({ visibleMonths, clearable, clearLabel, previousLabel, nextLabel, selection }) {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsxs("header", {
+			"data-slot": "calendar-header",
+			className: calendarHeaderVariants(),
+			children: [/* @__PURE__ */ jsx(Button, {
+				slot: "previous",
+				"aria-label": previousLabel,
+				className: calendarNavVariants(),
+				children: /* @__PURE__ */ jsx(ChevronPrevious, {})
+			}), /* @__PURE__ */ jsx(Button, {
+				slot: "next",
+				"aria-label": nextLabel,
+				className: calendarNavVariants(),
+				children: /* @__PURE__ */ jsx(ChevronNext, {})
+			})]
+		}),
+		/* @__PURE__ */ jsx("div", {
+			"data-slot": "calendar-months",
+			className: calendarMonthsVariants(),
+			children: Array.from({ length: visibleMonths }, (_, offset) => /* @__PURE__ */ jsxs("div", {
+				"data-slot": "calendar-month",
+				children: [/* @__PURE__ */ jsx(CalendarHeading, {
+					offset: { months: offset },
+					className: calendarHeadingVariants()
+				}), /* @__PURE__ */ jsxs(CalendarGrid, {
+					offset: { months: offset },
+					className: calendarGridVariants(),
+					children: [/* @__PURE__ */ jsx(CalendarGridHeader, { children: (weekday) => /* @__PURE__ */ jsx(CalendarHeaderCell, {
+						className: calendarHeaderCellVariants(),
+						children: weekday
+					}) }), /* @__PURE__ */ jsx(CalendarGridBody, { children: (date) => /* @__PURE__ */ jsx(CalendarCell, {
+						date,
+						"data-slot": "calendar-cell",
+						className: calendarCellVariants({ selection })
+					}) })]
+				})]
+			}, offset))
+		}),
+		clearable ? /* @__PURE__ */ jsx(ClearButton, { label: clearLabel }) : null
+	] });
+}
+/**
+* A calendar for picking a single date.
+*
+* Maturity: **experimental**. `ARCHITECTURE.md` §7 rule 8's metadata mechanism
+* does not exist yet, and ADR 0006 blocks `stable` until a WebKit test
+* instance lands regardless.
+*
+* `onChange` hands back a `DateValue`; `String(value)` is its `YYYY-MM-DD`
+* form, which is what an API filter or query parameter wants.
+*
+* @example
+* <Calendar label="Report date" value={date} onChange={setDate} clearable />
+*/
+function Calendar$1({ className, label, labelHidden = false, visibleMonths = 1, clearable = false, clearLabel = "Clear", previousLabel = "Previous month", nextLabel = "Next month", ...props }) {
+	return /* @__PURE__ */ jsxs(Calendar, {
+		...props,
+		"aria-label": label,
+		visibleDuration: { months: visibleMonths },
+		"data-slot": "calendar",
+		className: cn(calendarVariants(), className),
+		children: [labelHidden ? null : /* @__PURE__ */ jsx("span", {
+			"data-slot": "calendar-label",
+			className: calendarLabelVariants(),
+			children: label
+		}), /* @__PURE__ */ jsx(CalendarBody, {
+			visibleMonths,
+			clearable,
+			clearLabel,
+			previousLabel,
+			nextLabel,
+			selection: "single"
+		})]
+	});
+}
+/**
+* A calendar for picking a contiguous date range.
+*
+* `onChange` hands back `{ start, end }`, both `DateValue`.
+*
+* @example
+* <CalendarRange label="Period" visibleMonths={3}
+*                value={range} onChange={setRange} clearable />
+*/
+function CalendarRange({ className, label, labelHidden = false, visibleMonths = 1, clearable = false, clearLabel = "Clear", previousLabel = "Previous month", nextLabel = "Next month", ...props }) {
+	return /* @__PURE__ */ jsxs(RangeCalendar, {
+		...props,
+		"aria-label": label,
+		visibleDuration: { months: visibleMonths },
+		"data-slot": "calendar",
+		className: cn(calendarVariants(), className),
+		children: [labelHidden ? null : /* @__PURE__ */ jsx("span", {
+			"data-slot": "calendar-label",
+			className: calendarLabelVariants(),
+			children: label
+		}), /* @__PURE__ */ jsx(CalendarBody, {
+			visibleMonths,
+			clearable,
+			clearLabel,
+			previousLabel,
+			nextLabel,
+			selection: "range"
+		})]
+	});
+}
+//#endregion
+export { Calendar$1 as Calendar, CalendarRange, calendarCellVariants, calendarClearVariants, calendarGridVariants, calendarHeaderCellVariants, calendarHeaderVariants, calendarHeadingVariants, calendarLabelVariants, calendarMonthsVariants, calendarNavVariants, calendarVariants };
+
+//# sourceMappingURL=calendar.js.map

package/dist/calendar/calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calendar.js","names":["AriaButton","AriaCalendarHeading","AriaCalendarGrid","AriaCalendarGridHeader","AriaCalendarHeaderCell","AriaCalendarGridBody","AriaCalendarCell","Calendar","AriaCalendar","AriaRangeCalendar"],"sources":["../../src/calendar/calendar.tsx"],"sourcesContent":["\"use client\";\n\nimport type { DateValue } from \"@internationalized/date\";\nimport { cva } from \"class-variance-authority\";\nimport { useContext } from \"react\";\nimport {\n  Button as AriaButton,\n  Calendar as AriaCalendar,\n  CalendarCell as AriaCalendarCell,\n  CalendarGrid as AriaCalendarGrid,\n  CalendarGridBody as AriaCalendarGridBody,\n  CalendarGridHeader as AriaCalendarGridHeader,\n  CalendarHeaderCell as AriaCalendarHeaderCell,\n  CalendarHeading as AriaCalendarHeading,\n  CalendarStateContext,\n  RangeCalendar as AriaRangeCalendar,\n  RangeCalendarStateContext,\n  type CalendarProps as AriaCalendarProps,\n  type RangeCalendarProps as AriaRangeCalendarProps,\n} from \"react-aria-components\";\n\nimport { cn } from \"../lib/cn.js\";\n\n/**\n * Calendar, built on React Aria's Calendar and RangeCalendar.\n *\n * Values are `DateValue` objects from `@internationalized/date`, NOT JS\n * `Date`. ADR 0006 names that package the one allowed public type dependency\n * precisely here: a calendar day has no time zone, so modelling it as a\n * timestamp is what costs you a day at a DST boundary. The import is\n * `import type` only — nothing at runtime needs a constructor from it, so the\n * package contributes zero bytes to the bundle.\n *\n * Every string below is a STATIC literal. Tailwind scans source text, so a\n * class assembled at runtime is invisible to it and would simply never be\n * emitted — the component would render unstyled, with no error anywhere.\n *\n * State comes from React Aria's data attributes rather than pseudo-classes:\n * `data-[focus-visible]` is keyboard focus only, and `data-[hovered]` /\n * `data-[pressed]` cover pointer, touch and keyboard uniformly.\n */\nexport const calendarVariants = cva([\n  \"flex w-fit flex-col gap-(--density-gap) box-border\",\n  \"font-sans text-sm leading-(--leading-normal) text-foreground\",\n]);\n\nexport const calendarLabelVariants = cva([\"text-sm font-medium text-foreground\"]);\n\nexport const calendarHeaderVariants = cva([\n  \"flex items-center justify-between gap-(--density-control-gap)\",\n]);\n\n/**\n * The month/prev/next buttons.\n *\n * Deliberately NOT `buttonVariants` from ../button. That would put a\n * cross-component import in the bundle for one caller and six classes, and\n * DRY extracts at two callers, not one.\n */\nexport const calendarNavVariants = cva([\n  \"inline-flex shrink-0 items-center justify-center\",\n  \"size-(--density-control-h-sm) rounded-md\",\n  // A library consumer may load no reset at all, so a bare <button> keeps its\n  // user-agent border and ButtonFace grey without these two.\n  \"border-(length:--border-width) border-transparent bg-transparent\",\n  \"cursor-pointer select-none text-foreground outline-none\",\n  \"[&_svg]:pointer-events-none [&_svg]:shrink-0\",\n  \"[&_svg:not([class*='size-'])]:size-(--icon-sm)\",\n  // The glyph is directional where the BEHAVIOUR is logical: React Aria maps\n  // slot=\"previous\" to the correct month either way, so only the arrow flips.\n  \"[&_svg]:rtl:-scale-x-100\",\n  \"motion-safe:transition-colors motion-safe:duration-(--duration-fast) motion-safe:ease-standard\",\n  \"data-[hovered]:bg-muted data-[pressed]:bg-muted\",\n  \"data-[focus-visible]:outline-solid data-[focus-visible]:outline-(length:--focus-ring-width)\",\n  \"data-[focus-visible]:outline-offset-(--focus-ring-offset) data-[focus-visible]:outline-(--color-ring)\",\n  \"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-(--opacity-disabled)\",\n]);\n\nexport const calendarMonthsVariants = cva([\n  \"flex flex-col gap-(--density-gap) sm:flex-row sm:items-start\",\n]);\n\nexport const calendarHeadingVariants = cva([\n  \"mb-1 text-center text-sm font-semibold text-foreground\",\n]);\n\nexport const calendarGridVariants = cva([\n  // Without this a bare <table> falls back to user-agent border spacing and\n  // the range band shows gaps between cells.\n  \"border-collapse\",\n]);\n\nexport const calendarHeaderCellVariants = cva([\n  \"w-(--density-control-h-sm) pb-1\",\n  \"text-center text-2xs font-medium text-muted-foreground\",\n]);\n\nexport const calendarClearVariants = cva([\n  \"self-end rounded-md px-2 py-1\",\n  \"border-(length:--border-width) border-transparent bg-transparent\",\n  \"cursor-pointer select-none text-sm text-muted-foreground outline-none\",\n  \"motion-safe:transition-colors motion-safe:duration-(--duration-fast) motion-safe:ease-standard\",\n  \"data-[hovered]:bg-muted data-[hovered]:text-foreground\",\n  \"data-[focus-visible]:outline-solid data-[focus-visible]:outline-(length:--focus-ring-width)\",\n  \"data-[focus-visible]:outline-offset-(--focus-ring-offset) data-[focus-visible]:outline-(--color-ring)\",\n]);\n\n/**\n * A day.\n *\n * Sized from `--density-control-h-sm` rather than a new\n * `--density-calendar-cell`: the density contract test requires every scope to\n * declare every token name, so a new one is three file edits — and this one is\n * already 30/36/42px, all clear of the 24px floor that WCAG 2.2 SC 2.5.8 sets.\n *\n * ARCHITECTURE section 5 rule 6 — no state is carried by colour alone, because\n * every author colour is replaced under forced-colors and the distinction\n * would vanish. Selected adds weight, the range ends add SHAPE, today is an\n * underline (not an outline, which would fight the focus ring) and unavailable\n * is a strikethrough.\n */\nexport const calendarCellVariants = cva(\n  [\n    \"flex items-center justify-center box-border\",\n    \"size-(--density-control-h-sm) rounded-md\",\n    \"text-sm leading-(--leading-normal) text-foreground\",\n    \"cursor-pointer select-none outline-none\",\n    \"motion-safe:transition-colors motion-safe:duration-(--duration-fast) motion-safe:ease-standard\",\n    \"data-[hovered]:bg-muted\",\n    \"data-[today]:font-semibold data-[today]:underline data-[today]:underline-offset-4\",\n    \"data-[outside-month]:text-muted-foreground data-[outside-month]:opacity-(--opacity-disabled)\",\n    // Unavailable dates stay FOCUSABLE, so ADR 0007 holds them to 4.5:1 — this\n    // dims to muted-foreground, which the contrast contract grades, never below.\n    \"data-[unavailable]:cursor-not-allowed data-[unavailable]:text-muted-foreground\",\n    \"data-[unavailable]:line-through\",\n    \"data-[disabled]:cursor-not-allowed data-[disabled]:opacity-(--opacity-disabled)\",\n    \"data-[focus-visible]:outline-solid data-[focus-visible]:outline-(length:--focus-ring-width)\",\n    \"data-[focus-visible]:outline-offset-(--focus-ring-offset) data-[focus-visible]:outline-(--color-ring)\",\n  ],\n  {\n    variants: {\n      /**\n       * A variant axis rather than a boolean prop, because the two modes are\n       * mutually exclusive visual treatments of the same element — which is\n       * exactly what OCP asks a variant to model.\n       */\n      selection: {\n        single: [\n          \"data-[selected]:bg-primary data-[selected]:text-primary-foreground\",\n          \"data-[selected]:font-semibold\",\n        ],\n        range: [\n          // The band is `muted` — a pair the contrast contract already grades\n          // at 4.5:1, so the range needs no new contrast-pairs.json entry.\n          \"data-[selected]:rounded-none data-[selected]:bg-muted data-[selected]:text-foreground\",\n          \"data-[selection-start]:rounded-s-md data-[selection-start]:bg-primary\",\n          \"data-[selection-start]:font-semibold data-[selection-start]:text-primary-foreground\",\n          \"data-[selection-end]:rounded-e-md data-[selection-end]:bg-primary\",\n          \"data-[selection-end]:font-semibold data-[selection-end]:text-primary-foreground\",\n        ],\n      },\n    },\n    defaultVariants: { selection: \"single\" },\n  },\n);\n\nfunction ChevronPrevious() {\n  return (\n    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" aria-hidden=\"true\">\n      <path d=\"m15 18-6-6 6-6\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n    </svg>\n  );\n}\n\nfunction ChevronNext() {\n  return (\n    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" aria-hidden=\"true\">\n      <path d=\"m9 18 6-6-6-6\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n    </svg>\n  );\n}\n\n/**\n * Resets the selection to null.\n *\n * It reads the calendar state from React Aria's context and calls\n * `setValue(null)`, which runs through `useControlledState` — so it fires\n * `onChange` for a controlled parent AND updates uncontrolled state, with no\n * mirrored state here. That is the whole reason there is no `onClear` prop:\n * from inside the provider tree the reset is free, and from outside it it\n * would force every consumer to own the value.\n *\n * The two states are narrowed separately rather than through a union, because\n * `setValue` has a different parameter type on each and the union call is not\n * assignable to either.\n *\n * `slot={null}` opts out of the Button context: inside a Calendar that context\n * carries the previous/next slots, and an unslotted Button would claim one.\n */\nfunction ClearButton({ label }: { label: string }) {\n  const calendarState = useContext(CalendarStateContext);\n  const rangeState = useContext(RangeCalendarStateContext);\n\n  /*\n   * Inherit the calendar's own inert states.\n   *\n   * Without this the Clear button stayed focusable and announced as enabled\n   * inside an `isDisabled` calendar — every cell and both nav buttons were\n   * inert, and one control in the middle of them was not. `isReadOnly` is the\n   * same argument: \"the value is immutable\" has to include clearing it.\n   */\n  const state = calendarState ?? rangeState;\n  const isInert = Boolean(state?.isDisabled ?? false) || Boolean(state?.isReadOnly ?? false);\n\n  return (\n    <AriaButton\n      slot={null}\n      data-slot=\"calendar-clear\"\n      isDisabled={isInert}\n      className={calendarClearVariants()}\n      // Stays enabled when there is nothing to clear. Disabling it on press\n      // moves focus to <body>, which silently strands a keyboard user mid-grid.\n      onPress={() => {\n        if (calendarState) calendarState.setValue(null);\n        else rangeState?.setValue(null);\n      }}\n    >\n      {label}\n    </AriaButton>\n  );\n}\n\ninterface CalendarBodyProps {\n  visibleMonths: number;\n  clearable: boolean;\n  clearLabel: string;\n  previousLabel: string;\n  nextLabel: string;\n  selection: \"single\" | \"range\";\n}\n\n/** Header, grids and Clear — identical under both calendar roots. */\nfunction CalendarBody({\n  visibleMonths,\n  clearable,\n  clearLabel,\n  previousLabel,\n  nextLabel,\n  selection,\n}: CalendarBodyProps) {\n  return (\n    <>\n      <header data-slot=\"calendar-header\" className={calendarHeaderVariants()}>\n        <AriaButton slot=\"previous\" aria-label={previousLabel} className={calendarNavVariants()}>\n          <ChevronPrevious />\n        </AriaButton>\n        <AriaButton slot=\"next\" aria-label={nextLabel} className={calendarNavVariants()}>\n          <ChevronNext />\n        </AriaButton>\n      </header>\n\n      <div data-slot=\"calendar-months\" className={calendarMonthsVariants()}>\n        {Array.from({ length: visibleMonths }, (_, offset) => (\n          <div key={offset} data-slot=\"calendar-month\">\n            {/* Per grid, so three months are three named columns rather than\n                one combined range nobody can map back to a column. */}\n            <AriaCalendarHeading\n              offset={{ months: offset }}\n              className={calendarHeadingVariants()}\n            />\n            <AriaCalendarGrid offset={{ months: offset }} className={calendarGridVariants()}>\n              <AriaCalendarGridHeader>\n                {(weekday) => (\n                  <AriaCalendarHeaderCell className={calendarHeaderCellVariants()}>\n                    {weekday}\n                  </AriaCalendarHeaderCell>\n                )}\n              </AriaCalendarGridHeader>\n              <AriaCalendarGridBody>\n                {(date) => (\n                  <AriaCalendarCell\n                    date={date}\n                    data-slot=\"calendar-cell\"\n                    className={calendarCellVariants({ selection })}\n                  />\n                )}\n              </AriaCalendarGridBody>\n            </AriaCalendarGrid>\n          </div>\n        ))}\n      </div>\n\n      {clearable ? <ClearButton label={clearLabel} /> : null}\n    </>\n  );\n}\n\ninterface CalendarSharedProps {\n  /**\n   * Accessible name for the calendar.\n   *\n   * REQUIRED. React Aria renders the root as `role=\"application\"`, which has\n   * no implicit name, so without this every calendar announces as an unnamed\n   * application — the same finding that made `label` required on Select,\n   * Progress, Slider and ScrollArea.\n   */\n  label: string;\n  /**\n   * Hide the label visually while leaving it on the accessibility tree. Pass\n   * this when the surrounding UI already names the control.\n   *\n   * @default false\n   */\n  labelHidden?: boolean;\n  /**\n   * Number of months displayed side by side. Maps to React Aria's\n   * `visibleDuration`, which is omitted from the public surface so the two\n   * cannot disagree.\n   *\n   * @default 1\n   */\n  visibleMonths?: number;\n  /**\n   * Render a Clear button that resets the selection to `null`.\n   *\n   * Works controlled and uncontrolled: the button calls React Aria's\n   * `setValue(null)` through context, so `onChange` fires either way and there\n   * is no `onClear` for a consumer to wire up.\n   *\n   * @default false\n   */\n  clearable?: boolean;\n  /**\n   * Visible text of the Clear button.\n   *\n   * A prop rather than a literal because `ARCHITECTURE.md` §7 rule 9 forbids\n   * hard-coded user-visible strings and says it cannot be retrofitted.\n   * `useMessages()` does not exist yet, so this follows Dialog's `closeLabel`.\n   *\n   * @default \"Clear\"\n   */\n  clearLabel?: string;\n  /**\n   * Accessible name for the previous-month button, which is icon-only. Same\n   * reasoning as {@link CalendarSharedProps.clearLabel}.\n   *\n   * @default \"Previous month\"\n   */\n  previousLabel?: string;\n  /**\n   * Accessible name for the next-month button. Same reasoning as\n   * {@link CalendarSharedProps.clearLabel}.\n   *\n   * @default \"Next month\"\n   */\n  nextLabel?: string;\n  /** Extra classes. Merged last through `cn()`, so the consumer wins. */\n  className?: string;\n}\n\n/**\n * Props for {@link Calendar}.\n *\n * Extends the React Aria type via `Omit` rather than\n * `ComponentPropsWithoutRef`, matching every other React Aria-backed component\n * here and recorded in ADR 0008. Intersecting would advertise DOM props that\n * React Aria ignores silently.\n */\nexport interface CalendarProps\n  extends Omit<\n      AriaCalendarProps<DateValue>,\n      \"className\" | \"style\" | \"children\" | \"visibleDuration\"\n    >,\n    CalendarSharedProps {}\n\n/** Props for {@link CalendarRange}. */\nexport interface CalendarRangeProps\n  extends Omit<\n      AriaRangeCalendarProps<DateValue>,\n      \"className\" | \"style\" | \"children\" | \"visibleDuration\"\n    >,\n    CalendarSharedProps {}\n\n/**\n * A calendar for picking a single date.\n *\n * Maturity: **experimental**. `ARCHITECTURE.md` §7 rule 8's metadata mechanism\n * does not exist yet, and ADR 0006 blocks `stable` until a WebKit test\n * instance lands regardless.\n *\n * `onChange` hands back a `DateValue`; `String(value)` is its `YYYY-MM-DD`\n * form, which is what an API filter or query parameter wants.\n *\n * @example\n * <Calendar label=\"Report date\" value={date} onChange={setDate} clearable />\n */\nexport function Calendar({\n  className,\n  label,\n  labelHidden = false,\n  visibleMonths = 1,\n  clearable = false,\n  clearLabel = \"Clear\",\n  previousLabel = \"Previous month\",\n  nextLabel = \"Next month\",\n  ...props\n}: CalendarProps) {\n  return (\n    <AriaCalendar\n      {...props}\n      aria-label={label}\n      visibleDuration={{ months: visibleMonths }}\n      data-slot=\"calendar\"\n      className={cn(calendarVariants(), className)}\n    >\n      {labelHidden ? null : (\n        <span data-slot=\"calendar-label\" className={calendarLabelVariants()}>\n          {label}\n        </span>\n      )}\n      <CalendarBody\n        visibleMonths={visibleMonths}\n        clearable={clearable}\n        clearLabel={clearLabel}\n        previousLabel={previousLabel}\n        nextLabel={nextLabel}\n        selection=\"single\"\n      />\n    </AriaCalendar>\n  );\n}\n\n/**\n * A calendar for picking a contiguous date range.\n *\n * `onChange` hands back `{ start, end }`, both `DateValue`.\n *\n * @example\n * <CalendarRange label=\"Period\" visibleMonths={3}\n *                value={range} onChange={setRange} clearable />\n */\nexport function CalendarRange({\n  className,\n  label,\n  labelHidden = false,\n  visibleMonths = 1,\n  clearable = false,\n  clearLabel = \"Clear\",\n  previousLabel = \"Previous month\",\n  nextLabel = \"Next month\",\n  ...props\n}: CalendarRangeProps) {\n  return (\n    <AriaRangeCalendar\n      {...props}\n      aria-label={label}\n      visibleDuration={{ months: visibleMonths }}\n      data-slot=\"calendar\"\n      className={cn(calendarVariants(), className)}\n    >\n      {labelHidden ? null : (\n        <span data-slot=\"calendar-label\" className={calendarLabelVariants()}>\n          {label}\n        </span>\n      )}\n      <CalendarBody\n        visibleMonths={visibleMonths}\n        clearable={clearable}\n        clearLabel={clearLabel}\n        previousLabel={previousLabel}\n        nextLabel={nextLabel}\n        selection=\"range\"\n      />\n    </AriaRangeCalendar>\n  );\n}\n"],"mappings":"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"}

package/dist/calendar/index.d.ts

@@ -0,0 +1,2 @@
+import { Calendar, CalendarProps, CalendarRange, CalendarRangeProps, calendarCellVariants, calendarClearVariants, calendarGridVariants, calendarHeaderCellVariants, calendarHeaderVariants, calendarHeadingVariants, calendarLabelVariants, calendarMonthsVariants, calendarNavVariants, calendarVariants } from "./calendar.js";
+export { Calendar, type CalendarProps, CalendarRange, type CalendarRangeProps, calendarCellVariants, calendarClearVariants, calendarGridVariants, calendarHeaderCellVariants, calendarHeaderVariants, calendarHeadingVariants, calendarLabelVariants, calendarMonthsVariants, calendarNavVariants, calendarVariants };

package/dist/calendar/index.js

@@ -0,0 +1,2 @@
+import { Calendar, CalendarRange, calendarCellVariants, calendarClearVariants, calendarGridVariants, calendarHeaderCellVariants, calendarHeaderVariants, calendarHeadingVariants, calendarLabelVariants, calendarMonthsVariants, calendarNavVariants, calendarVariants } from "./calendar.js";
+export { Calendar, CalendarRange, calendarCellVariants, calendarClearVariants, calendarGridVariants, calendarHeaderCellVariants, calendarHeaderVariants, calendarHeadingVariants, calendarLabelVariants, calendarMonthsVariants, calendarNavVariants, calendarVariants };

package/dist/card/card.d.ts

@@ -0,0 +1,93 @@
+import { ComponentPropsWithoutRef } from "react";
+//#region src/card/card.d.ts
+/**
+ * Card, ported from the legacy shadcn component.
+ *
+ * Presentational, so there is no React Aria base -- React Aria ships no card,
+ * and a container that is not focusable, selectable or interactive needs no
+ * behaviour to inherit.
+ *
+ * Five parts, from six. The census (24 consumer files, the most-used
+ * container in the app) reads: Card 55, CardContent 40, CardHeader 21,
+ * CardTitle 19, CardDescription 8, CardFooter 2, **CardAction 0**.
+ *
+ * Dropping `CardAction` takes three things with it, which is most of the
+ * legacy header's complexity: the `grid`, the `grid-rows-[auto_auto]`, and
+ * the `has-data-[slot=card-action]:grid-cols-[1fr_auto]` rule that existed
+ * only to reserve a column for it. With no action to place, a header is a
+ * stack.
+ *
+ * Two more legacy rules are gone. `[.border-b]:pb-6` and `[.border-t]:pt-6`
+ * added padding when the CONSUMER happened to add a border class -- clever,
+ * but action at a distance through a class name we do not own, and the census
+ * found zero application call sites relying on it (one call site passes
+ * `border-b-0`, which removes a border it never had). `@container/card-header`
+ * named a container nothing queried.
+ *
+ * Every string in the cva blocks below is a STATIC literal. Tailwind scans
+ * source text, so a class assembled at runtime is invisible to it and would
+ * simply never be emitted.
+ */
+export declare const cardVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+/**
+ * Padding is inline-only on the sections and block-only on the shell.
+ *
+ * That split is load-bearing rather than stylistic: it is what lets a
+ * consumer run a divider or a full-bleed image edge to edge, which a single
+ * `p-6` on the shell would make impossible.
+ */
+export declare const cardHeaderVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const cardTitleVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const cardDescriptionVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const cardContentVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const cardFooterVariants: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+/**
+ * A content container.
+ *
+ * @example
+ * <Card>
+ *   <CardHeader>
+ *     <CardTitle>Learning Progress</CardTitle>
+ *     <CardDescription>Across all active courses.</CardDescription>
+ *   </CardHeader>
+ *   <CardContent>Twelve of eighteen modules complete.</CardContent>
+ * </Card>
+ */
+export type CardProps = ComponentPropsWithoutRef<"div">;
+export declare function Card({ className, ...props }: CardProps): import("react").JSX.Element;
+/** Title and description, stacked. */
+export type CardHeaderProps = ComponentPropsWithoutRef<"div">;
+export declare function CardHeader({ className, ...props }: CardHeaderProps): import("react").JSX.Element;
+/**
+ * The card's heading.
+ *
+ * A REAL heading, unlike the legacy `<div class="font-semibold">`. None of
+ * the 19 legacy call sites wrapped one, so 19 card titles were invisible to
+ * screen-reader heading navigation -- the same shape of finding as the Avatar
+ * port's missing `alt`, and the migration is when it gets answered.
+ */
+export interface CardTitleProps extends ComponentPropsWithoutRef<"h3"> {
+  /**
+   * Heading level.
+   *
+   * `3` by default, because a card almost always sits under a section
+   * heading. It is a prop rather than a constant because the correct level
+   * is a fact about the PAGE, and a fixed one would be wrong somewhere; the
+   * level changes semantics only, never the rendered size.
+   *
+   * @default 3
+   */
+  level?: 1 | 2 | 3 | 4 | 5 | 6;
+}
+export declare function CardTitle({ className, level, ...props }: CardTitleProps): import("react").JSX.Element;
+/** Secondary text under the title. */
+export type CardDescriptionProps = ComponentPropsWithoutRef<"div">;
+export declare function CardDescription({ className, ...props }: CardDescriptionProps): import("react").JSX.Element;
+/** The card's body. */
+export type CardContentProps = ComponentPropsWithoutRef<"div">;
+export declare function CardContent({ className, ...props }: CardContentProps): import("react").JSX.Element;
+/** Actions or metadata at the foot of the card. */
+export type CardFooterProps = ComponentPropsWithoutRef<"div">;
+export declare function CardFooter({ className, ...props }: CardFooterProps): import("react").JSX.Element;
+//#endregion
+//# sourceMappingURL=card.d.ts.map