@ponti-studios/ui 2.0.1 → 3.0.0

package/dist/components/feedback/update-guard.js

@@ -0,0 +1,38 @@
+"use client";
+import { useUiText as e } from "../../translations/ui-provider.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+import { LucideRefreshCcw as r, LucideX as i } from "lucide-react";
+//#region src/components/feedback/update-guard.tsx
+function a({ needRefresh: a, onRefresh: o, onDismiss: s, copyText: c = "New content available", refreshText: l = "Refresh" }) {
+	let u = e("dialog.close", "Close");
+	return a ? /* @__PURE__ */ t("output", {
+		"aria-live": "polite",
+		"aria-atomic": "true",
+		className: "fixed inset-x-0 bottom-0 z-50 flex justify-center px-4",
+		children: /* @__PURE__ */ n("div", {
+			className: "border-border bg-card flex items-center gap-3 rounded-md border px-4 py-2",
+			children: [
+				/* @__PURE__ */ t("span", {
+					className: "text-foreground text-sm",
+					children: c
+				}),
+				/* @__PURE__ */ t("button", {
+					type: "button",
+					"aria-label": l,
+					onClick: o,
+					className: "text-accent-text font-semibold border-muted-foreground rounded-md border px-2 py-1 hover:bg-accent hover:text-accent-foreground",
+					children: /* @__PURE__ */ t(r, { className: "size-4" })
+				}),
+				s ? /* @__PURE__ */ t("button", {
+					"aria-label": u,
+					type: "button",
+					onClick: s,
+					className: "text-accent-text font-semibold border-muted-foreground rounded-md border px-2 py-1 hover:bg-accent hover:text-accent-foreground",
+					children: /* @__PURE__ */ t(i, { className: "size-4" })
+				}) : null
+			]
+		})
+	}) : null;
+}
+//#endregion
+export { a as UpdateGuard };

package/dist/components/filters/active-filters-bar.d.ts

@@ -0,0 +1,14 @@
+export interface ActiveFilter {
+    id: string;
+    label: string;
+    onRemove: () => void;
+    onClick?: () => void;
+    variant?: "filter" | "sort";
+    direction?: "asc" | "desc";
+}
+export interface ActiveFiltersBarProps {
+    filters: ActiveFilter[];
+    className?: string;
+    onClearAll?: () => void;
+}
+export declare function ActiveFiltersBar({ filters, className, onClearAll }: ActiveFiltersBarProps): import("react").JSX.Element | null;

package/dist/components/filters/active-filters-bar.js

@@ -0,0 +1,44 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { useUiText as t } from "../../translations/ui-provider.js";
+import { FilterChip as n } from "./filter-chip.js";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { X as a } from "lucide-react";
+//#region src/components/filters/active-filters-bar.tsx
+function o({ filters: o, className: s, onClearAll: c }) {
+	let l = t("filters.clearAll", "Clear all");
+	return o.length === 0 ? null : /* @__PURE__ */ i("div", {
+		className: e("flex w-full items-center h-10 gap-2 rounded-lg border border-border pr-0", s),
+		children: [
+			/* @__PURE__ */ r("span", {
+				className: "text-muted-foreground shrink-0 self-stretch flex items-center text-sm border-r px-4",
+				children: "Filters"
+			}),
+			/* @__PURE__ */ r("ul", {
+				className: "flex flex-1 min-w-0 items-center gap-2 overflow-x-auto scroll-fade-x pl-4 py-1.5",
+				children: o.map((e) => /* @__PURE__ */ r("li", {
+					className: "shrink-0",
+					children: /* @__PURE__ */ r(n, {
+						label: e.label,
+						onRemove: e.onRemove,
+						onClick: e.onClick,
+						variant: e.variant === "sort" ? "sort" : "default",
+						direction: e.direction
+					})
+				}, e.id))
+			}),
+			c ? /* @__PURE__ */ r("button", {
+				type: "button",
+				onClick: c,
+				className: "hover:bg-muted text-muted-foreground hover:text-foreground focus-visible:ring-ring inline-flex shrink-0 items-center justify-center self-stretch aspect-square rounded-r-lg border-l border-border transition-colors focus-visible:ring-2 focus-visible:outline-none",
+				"aria-label": l,
+				children: /* @__PURE__ */ r(a, {
+					className: "size-4",
+					"aria-hidden": !0
+				})
+			}) : null
+		]
+	});
+}
+//#endregion
+export { o as ActiveFiltersBar };

package/dist/components/filters/filter-chip.d.ts

@@ -0,0 +1,11 @@
+import type { ReactNode } from "react";
+export interface FilterChipProps {
+    label: ReactNode;
+    onRemove: () => void;
+    onClick?: () => void;
+    className?: string;
+    variant?: "default" | "sort";
+    direction?: "asc" | "desc";
+    role?: string;
+}
+export declare function FilterChip({ label, onRemove, onClick, className, variant, direction, role, }: FilterChipProps): import("react").JSX.Element;

package/dist/components/filters/filter-chip.js

@@ -0,0 +1,33 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { useUiText as t } from "../../translations/ui-provider.js";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { ArrowDown as i, ArrowUp as a, X as o } from "lucide-react";
+//#region src/components/filters/filter-chip.tsx
+function s({ label: s, onRemove: c, onClick: l, className: u, variant: d = "default", direction: f, role: p }) {
+	let m = t("filterChip.remove", "Remove filter"), h = d === "sort", g = f === "asc" ? a : f === "desc" ? i : null;
+	return /* @__PURE__ */ r("span", {
+		role: p,
+		"aria-label": typeof s == "string" ? `${s} filter` : "filter",
+		className: e("border-border bg-secondary text-secondary-foreground inline-flex items-center rounded-full border text-xs font-medium", h && "border-dashed", u),
+		children: [/* @__PURE__ */ r("button", {
+			type: "button",
+			disabled: !l,
+			className: "focus-visible:ring-ring inline-flex items-center rounded-full px-3 transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:cursor-default",
+			onClick: l,
+			children: [h && g ? /* @__PURE__ */ n(g, { className: "mr-1 size-4" }) : null, s]
+		}), /* @__PURE__ */ n("button", {
+			type: "button",
+			"data-slot": "filter-chip-remove",
+			className: "text-muted-foreground hover:text-foreground focus-visible:ring-ring mr-0.5 flex size-6 items-center justify-center rounded-full transition-colors focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none",
+			onClick: c,
+			"aria-label": `${m}: ${typeof s == "string" ? s : "selected filter"}`,
+			children: /* @__PURE__ */ n(o, {
+				className: "size-4",
+				"aria-hidden": !0
+			})
+		})]
+	});
+}
+//#endregion
+export { s as FilterChip };

package/dist/components/filters/filter-select.d.ts

@@ -0,0 +1,17 @@
+export interface FilterSelectOption {
+    value: string;
+    label: string;
+}
+export interface FilterSelectProps {
+    value: string | null;
+    onChange: (value: string | null) => void;
+    options: FilterSelectOption[];
+    label: string;
+    placeholder?: string;
+    disabled?: boolean;
+    isLoading?: boolean;
+    emptyLabel?: string;
+    className?: string;
+    id?: string;
+}
+export declare function FilterSelect({ label, value, options, onChange, placeholder, disabled, isLoading, emptyLabel, className, id, }: FilterSelectProps): import("react").JSX.Element;

package/dist/components/filters/filter-select.js

@@ -0,0 +1,46 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { useUiText as t } from "../../translations/ui-provider.js";
+import { Spinner as n } from "../feedback/spinner.js";
+import { Select as r, SelectContent as i, SelectItem as a, SelectTrigger as o, SelectValue as s } from "../forms/select.js";
+import { useId as c, useMemo as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/filters/filter-select.tsx
+function f({ label: f, value: p, options: m, onChange: h, placeholder: g = "All", disabled: _ = !1, isLoading: v = !1, emptyLabel: y, className: b, id: x }) {
+	let S = t("filterSelect.empty", "No options available"), C = y ?? S, w = c(), T = x ?? w, E = l(() => [{
+		value: null,
+		label: g
+	}, ...m], [m, g]);
+	return /* @__PURE__ */ d("div", {
+		className: e("space-y-2 min-w-36", b),
+		children: [/* @__PURE__ */ u("label", {
+			htmlFor: T,
+			children: f
+		}), /* @__PURE__ */ d(r, {
+			value: p,
+			onValueChange: h,
+			items: E,
+			children: [/* @__PURE__ */ u(o, {
+				id: T,
+				disabled: _,
+				"aria-label": f,
+				className: "w-full",
+				children: /* @__PURE__ */ u(s, { placeholder: g })
+			}), /* @__PURE__ */ d(i, {
+				className: "bg-background max-h-[250px] min-w-36 overflow-y-auto",
+				children: [/* @__PURE__ */ u(a, { children: g }), v ? /* @__PURE__ */ u(n, {
+					presentation: "centered",
+					size: "sm"
+				}) : m.length === 0 ? /* @__PURE__ */ u("div", {
+					className: "text-muted-foreground px-2 py-1.5 text-sm",
+					children: C
+				}) : m.map((e) => /* @__PURE__ */ u(a, {
+					value: e.value,
+					children: e.label
+				}, e.value))]
+			})]
+		})]
+	});
+}
+//#endregion
+export { f as FilterSelect };

package/dist/components/filters/index.js

@@ -0,0 +1,4 @@
+import { FilterSelect as e } from "./filter-select.js";
+import { FilterChip as t } from "./filter-chip.js";
+import { ActiveFiltersBar as n } from "./active-filters-bar.js";
+export { n as ActiveFiltersBar, t as FilterChip, e as FilterSelect };

package/dist/components/forms/checkbox.d.ts

@@ -0,0 +1,4 @@
+import { Checkbox as CheckboxPrimitive } from "@base-ui/react/checkbox";
+import * as React from "react";
+declare function Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxPrimitive.Root>): React.JSX.Element;
+export { Checkbox };

package/dist/components/forms/checkbox.js

@@ -0,0 +1,24 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+import { CheckIcon as n, MinusIcon as r } from "lucide-react";
+import { Checkbox as i } from "@base-ui/react/checkbox";
+//#region src/components/forms/checkbox.tsx
+function a({ className: a, ...o }) {
+	return /* @__PURE__ */ t(i.Root, {
+		"data-slot": "checkbox",
+		className: e("border-input bg-background aria-checked:bg-primary aria-checked:text-primary-foreground aria-checked:border-primary focus-visible:outline-ring size-4 shrink-0 rounded-[4px] border transition-colors focus-visible:outline-2 focus-visible:outline-offset-2", "aria-[checked=mixed]:bg-primary aria-[checked=mixed]:text-primary-foreground aria-[checked=mixed]:border-primary", "data-disabled:pointer-events-none data-disabled:opacity-50", a),
+		...o,
+		children: /* @__PURE__ */ t(i.Indicator, {
+			"data-slot": "checkbox-indicator",
+			className: "flex items-center justify-center text-current transition-none",
+			render: (e, i) => /* @__PURE__ */ t("span", {
+				...e,
+				children: i.indeterminate ? /* @__PURE__ */ t(r, { className: "size-3" }) : /* @__PURE__ */ t(n, { className: "size-3" })
+			})
+		})
+	});
+}
+//#endregion
+export { a as Checkbox };

package/dist/components/forms/date-month-select.d.ts

@@ -0,0 +1,11 @@
+export interface DateMonthSelectProps {
+    selectedMonthYear: string;
+    onMonthChange: (value: string) => void;
+    monthsBack?: number;
+    className?: string;
+    placeholder?: string;
+}
+/** Select a `YYYY-MM` month from the last `monthsBack` months. */
+export declare function DateMonthSelect({ selectedMonthYear, onMonthChange, monthsBack, className, placeholder, }: DateMonthSelectProps): import("react").JSX.Element;
+/** Current month in `YYYY-MM` format. */
+export declare const getCurrentMonthYear: () => string;

package/dist/components/forms/date-month-select.js

@@ -0,0 +1,47 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Select as t, SelectContent as n, SelectItem as r, SelectTrigger as i, SelectValue as a } from "./select.js";
+import { useMemo as o } from "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { Calendar as l } from "lucide-react";
+//#region src/components/forms/date-month-select.tsx
+function u({ selectedMonthYear: u, onMonthChange: d, monthsBack: f = 12, className: p = "w-[200px]", placeholder: m = "Select month" }) {
+	let h = o(() => {
+		let e = [], t = /* @__PURE__ */ new Date();
+		for (let n = 0; n < f; n++) {
+			let r = new Date(t.getFullYear(), t.getMonth() - n, 1), i = r.getFullYear(), a = (r.getMonth() + 1).toString().padStart(2, "0");
+			e.push({
+				value: `${i}-${a}`,
+				label: r.toLocaleString("default", {
+					month: "long",
+					year: "numeric"
+				})
+			});
+		}
+		return e;
+	}, [f]);
+	return /* @__PURE__ */ c("div", {
+		className: "flex items-center",
+		children: [/* @__PURE__ */ s("div", {
+			className: "border-border bg-background text-foreground flex size-10 items-center justify-center rounded-l-xl border",
+			children: /* @__PURE__ */ s(l, { className: "size-4" })
+		}), /* @__PURE__ */ c(t, {
+			value: u,
+			onValueChange: (e) => e != null && d(e),
+			children: [/* @__PURE__ */ s(i, {
+				className: e("border-border bg-background text-foreground min-h-10 max-h-10 rounded-l-none rounded-r-xl border-l-0", p),
+				"aria-label": m,
+				children: /* @__PURE__ */ s(a, { placeholder: m })
+			}), /* @__PURE__ */ s(n, { children: h.map((e) => /* @__PURE__ */ s(r, {
+				value: e.value,
+				children: e.label
+			}, e.value)) })]
+		})]
+	});
+}
+var d = () => {
+	let e = /* @__PURE__ */ new Date();
+	return `${e.getFullYear()}-${(e.getMonth() + 1).toString().padStart(2, "0")}`;
+};
+//#endregion
+export { u as DateMonthSelect, d as getCurrentMonthYear };

package/dist/components/forms/date-picker.d.ts

@@ -0,0 +1,60 @@
+export interface DateRangeValue {
+    from?: Date | string | null;
+    to?: Date | string | null;
+}
+interface DatePickerBaseProps {
+    label?: string;
+    helpText?: string;
+    error?: string;
+    id?: string;
+    disabled?: boolean;
+    required?: boolean;
+    className?: string;
+    /** Earliest selectable date, "YYYY-MM-DD". */
+    min?: string;
+    /** Latest selectable date, "YYYY-MM-DD". */
+    max?: string;
+}
+export interface SingleDatePickerProps extends DatePickerBaseProps {
+    mode?: "single";
+    /** Form field name — the native input submits "YYYY-MM-DD". */
+    name?: string;
+    value?: Date | string | null;
+    defaultValue?: Date | string | null;
+    onValueChange?: (value: string | null) => void;
+}
+export interface RangeDatePickerProps extends DatePickerBaseProps {
+    mode: "range";
+    /** Form field name for the range start — submits "YYYY-MM-DD". */
+    startName?: string;
+    /** Form field name for the range end — submits "YYYY-MM-DD". */
+    endName?: string;
+    value?: DateRangeValue;
+    defaultValue?: DateRangeValue;
+    onValueChange?: (value: {
+        from: string | null;
+        to: string | null;
+    }) => void;
+    fromLabel?: string;
+    toLabel?: string;
+}
+export type DatePickerProps = SingleDatePickerProps | RangeDatePickerProps;
+/**
+ * DatePicker — native date inputs styled to the design system. The browser
+ * owns the picker UI (calendar on desktop, wheel on iOS, etc.) so there is no
+ * popover, calendar grid, or positioning layer in the bundle. Both a single
+ * date (`name`) and a range (`startName` + `endName`) are supported; the
+ * native inputs submit "YYYY-MM-DD" local date strings directly.
+ *
+ * @example
+ * <DatePicker name="startDate" defaultValue="2020-01-15" label="Start date" />
+ * <DatePicker
+ *   mode="range"
+ *   startName="startDate"
+ *   endName="endDate"
+ *   defaultValue={{ from: "2020-01-15", to: "2020-06-30" }}
+ *   label="Active period"
+ * />
+ */
+declare function DatePicker(props: DatePickerProps): import("react").JSX.Element;
+export { DatePicker };

package/dist/components/forms/date-picker.js

@@ -0,0 +1,193 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { useUiText as t } from "../../translations/ui-provider.js";
+import { formatDateInput as n } from "./date-utils.js";
+import { useId as r, useRef as i, useState as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { CalendarIcon as c } from "lucide-react";
+//#region src/components/forms/date-picker.tsx
+var l = "text-foreground text-sm font-medium", u = "after:text-destructive-text after:ml-0.5 after:content-['*']", d = "text-muted-foreground text-xs font-medium", f = "bg-background text-foreground border-input h-10 w-full min-w-0 appearance-none border px-3 py-1 text-sm transition-colors [&::-webkit-calendar-picker-indicator]:appearance-none [&::-webkit-calendar-picker-indicator]:opacity-0 placeholder:text-muted-foreground focus-visible:ring-ring focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-none disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:ring-destructive/20 aria-invalid:border-destructive";
+function p({ inputRef: e, disabled: t, ariaLabel: n }) {
+	return /* @__PURE__ */ o("button", {
+		type: "button",
+		"data-slot": "date-picker-icon",
+		"aria-label": n,
+		disabled: t,
+		onClick: () => {
+			let t = e.current;
+			if (t) try {
+				t.showPicker?.();
+			} catch {
+				t.focus();
+			}
+		},
+		className: "border-input bg-background text-foreground focus-visible:outline-ring flex size-10 shrink-0 items-center justify-center rounded-l-xl border focus-visible:outline-2 focus-visible:outline-offset-2",
+		children: /* @__PURE__ */ o(c, {
+			className: "size-4",
+			"aria-hidden": !0
+		})
+	});
+}
+function m({ id: c, name: d, label: m, helpText: h, error: g, className: _, disabled: v, required: y, min: b, max: x, value: S, defaultValue: C, onValueChange: w }) {
+	let T = t("datePicker.open", "Open date picker"), E = r(), D = c ?? E, O = `${D}-description`, k = `${D}-error`, A = i(null), j = S !== void 0, [M, N] = a(() => n(j ? S : C)), P = (j ? n(S) : M) || "";
+	function F(e) {
+		let t = e.target.value || null;
+		j || N(t ?? ""), w?.(t);
+	}
+	return /* @__PURE__ */ s("div", {
+		className: e("flex flex-col gap-1.5", _),
+		children: [
+			m ? /* @__PURE__ */ o("label", {
+				htmlFor: D,
+				className: e(l, y && u),
+				children: m
+			}) : null,
+			/* @__PURE__ */ s("div", {
+				className: "flex w-full items-center",
+				children: [/* @__PURE__ */ o(p, {
+					inputRef: A,
+					disabled: v,
+					ariaLabel: T
+				}), /* @__PURE__ */ o("input", {
+					ref: A,
+					id: D,
+					name: d,
+					type: "date",
+					value: j ? P : void 0,
+					defaultValue: j ? void 0 : P,
+					onChange: F,
+					disabled: v,
+					required: y,
+					min: b,
+					max: x,
+					"aria-invalid": g ? !0 : void 0,
+					"aria-describedby": g ? k : h ? O : void 0,
+					className: e(f, "rounded-l-none rounded-r-xl border-l-0")
+				})]
+			}),
+			g ? /* @__PURE__ */ o("p", {
+				id: k,
+				role: "alert",
+				className: "text-destructive-text text-sm",
+				children: g
+			}) : h ? /* @__PURE__ */ o("p", {
+				id: O,
+				className: "text-muted-foreground text-sm",
+				children: h
+			}) : null
+		]
+	});
+}
+function h({ id: t, label: c, helpText: m, error: h, className: g, disabled: _, required: v, min: y, max: b, startName: x, endName: S, value: C, defaultValue: w, onValueChange: T, fromLabel: E = "From", toLabel: D = "To" }) {
+	let O = r(), k = t ?? O, A = `${k}-to`, j = `${k}-description`, M = `${k}-error`, N = i(null), P = i(null), F = C !== void 0, [I, L] = a(() => {
+		let e = F ? C : w;
+		return {
+			from: n(e?.from),
+			to: n(e?.to)
+		};
+	}), R = (F ? n(C?.from) : I.from) || "", z = (F ? n(C?.to) : I.to) || "";
+	function B(e) {
+		return (t) => {
+			let n = t.target.value || null, r = e === "from" ? {
+				from: n,
+				to: z
+			} : {
+				from: R,
+				to: n
+			};
+			F || L({
+				from: r.from ?? "",
+				to: r.to ?? ""
+			}), T?.({
+				from: r.from,
+				to: r.to
+			});
+		};
+	}
+	return /* @__PURE__ */ s("div", {
+		className: e("flex flex-col gap-1.5", g),
+		children: [
+			c ? /* @__PURE__ */ o("span", {
+				className: e(l, v && u),
+				children: c
+			}) : null,
+			/* @__PURE__ */ s("div", {
+				className: "grid gap-3 sm:grid-cols-2",
+				children: [/* @__PURE__ */ s("div", {
+					className: "flex min-w-0 flex-col gap-1",
+					children: [/* @__PURE__ */ o("label", {
+						htmlFor: k,
+						className: d,
+						children: E
+					}), /* @__PURE__ */ s("div", {
+						className: "flex w-full items-center",
+						children: [/* @__PURE__ */ o(p, {
+							inputRef: N,
+							disabled: _,
+							ariaLabel: E
+						}), /* @__PURE__ */ o("input", {
+							ref: N,
+							id: k,
+							name: x,
+							type: "date",
+							value: F ? R : void 0,
+							defaultValue: F ? void 0 : R,
+							onChange: B("from"),
+							disabled: _,
+							required: v,
+							min: y,
+							max: z || b || void 0,
+							"aria-invalid": h ? !0 : void 0,
+							"aria-describedby": h ? M : m ? j : void 0,
+							className: e(f, "rounded-l-none rounded-r-xl border-l-0")
+						})]
+					})]
+				}), /* @__PURE__ */ s("div", {
+					className: "flex min-w-0 flex-col gap-1",
+					children: [/* @__PURE__ */ o("label", {
+						htmlFor: A,
+						className: d,
+						children: D
+					}), /* @__PURE__ */ s("div", {
+						className: "flex w-full items-center",
+						children: [/* @__PURE__ */ o(p, {
+							inputRef: P,
+							disabled: _,
+							ariaLabel: D
+						}), /* @__PURE__ */ o("input", {
+							ref: P,
+							id: A,
+							name: S,
+							type: "date",
+							value: F ? z : void 0,
+							defaultValue: F ? void 0 : z,
+							onChange: B("to"),
+							disabled: _,
+							required: v,
+							min: R || y || void 0,
+							max: b,
+							"aria-invalid": h ? !0 : void 0,
+							"aria-describedby": h ? M : m ? j : void 0,
+							className: e(f, "rounded-l-none rounded-r-xl border-l-0")
+						})]
+					})]
+				})]
+			}),
+			h ? /* @__PURE__ */ o("p", {
+				id: M,
+				role: "alert",
+				className: "text-destructive-text text-sm",
+				children: h
+			}) : m ? /* @__PURE__ */ o("p", {
+				id: j,
+				className: "text-muted-foreground text-sm",
+				children: m
+			}) : null
+		]
+	});
+}
+function g(e) {
+	return e.mode === "range" ? /* @__PURE__ */ o(h, { ...e }) : /* @__PURE__ */ o(m, { ...e });
+}
+//#endregion
+export { g as DatePicker };

package/dist/components/forms/date-utils.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Parse a date-only string ("YYYY-MM-DD") as a local calendar day instead of
+ * UTC midnight, so negative-UTC-offset timezones don't render the previous day.
+ * Accepts a `Date` (returned as-is when valid) and returns `undefined` for
+ * null/undefined/invalid input.
+ */
+export declare function parseDateInput(value: Date | string | null | undefined): Date | undefined;
+/**
+ * Serialize a date to its "YYYY-MM-DD" form using local components, so the
+ * value round-trips without a UTC shift. Returns "" for invalid input.
+ */
+export declare function formatDateInput(value: Date | string | null | undefined): string;
+/** Today's date as a "YYYY-MM-DD" local string. */
+export declare function todayDateInput(): string;

package/dist/components/forms/date-utils.js

@@ -0,0 +1,18 @@
+//#region src/components/forms/date-utils.ts
+function e(e) {
+	if (!e) return;
+	if (e instanceof Date) return Number.isNaN(e.getTime()) ? void 0 : e;
+	let [t, n, r] = e.split("-").map(Number);
+	if (!t || !n || !r) return;
+	let i = /* @__PURE__ */ new Date(0);
+	return i.setFullYear(t, n - 1, r), Number.isNaN(i.getTime()) ? void 0 : i;
+}
+function t(t) {
+	let n = e(t);
+	return n ? `${String(n.getFullYear()).padStart(4, "0")}-${String(n.getMonth() + 1).padStart(2, "0")}-${String(n.getDate()).padStart(2, "0")}` : "";
+}
+function n() {
+	return t(/* @__PURE__ */ new Date());
+}
+//#endregion
+export { t as formatDateInput, e as parseDateInput, n as todayDateInput };

package/dist/components/forms/drop-zone.d.ts

@@ -0,0 +1,42 @@
+import { type ReactNode } from "react";
+export type DropZoneStatus = "empty" | "armed" | "busy" | "failed";
+export type DropZoneFileInfo = {
+    name: string;
+    size: number;
+};
+export type DropZoneProps = {
+    status: DropZoneStatus;
+    /** Selected file metadata for armed / busy / failed (with file retained). */
+    file?: DropZoneFileInfo | null;
+    error?: string | null;
+    notice?: string | null;
+    /** File input accept attribute, e.g. `.pdf,application/pdf`. */
+    accept?: string;
+    multiple?: boolean;
+    disabled?: boolean;
+    className?: string;
+    /** Empty idle copy */
+    emptyLabel?: ReactNode;
+    emptyHint?: ReactNode;
+    draggingLabel?: ReactNode;
+    /** Busy copy */
+    busyLabel?: ReactNode;
+    busyDescription?: ReactNode;
+    /** Action labels — parent owns domain language */
+    submitLabel?: string;
+    retryLabel?: string;
+    clearLabel?: string;
+    cancelLabel?: string;
+    /** Extra content under error (e.g. sign-in link). */
+    failedActions?: ReactNode;
+    onFiles: (files: File[]) => void;
+    onSubmit?: () => void;
+    onClear?: () => void;
+    onCancel?: () => void;
+    onRetry?: () => void;
+};
+/**
+ * Generic file drop surface. Parent owns validation, network, and domain copy.
+ * Modes: empty | armed | busy | failed, plus an internal drag overlay.
+ */
+export declare function DropZone({ status, file, error, notice, accept, multiple, disabled, className, emptyLabel, emptyHint, draggingLabel, busyLabel, busyDescription, submitLabel, retryLabel, clearLabel, cancelLabel, failedActions, onFiles, onSubmit, onClear, onCancel, onRetry, }: DropZoneProps): import("react").JSX.Element;