@fiestaboard/ui 3.0.1 → 3.2.0

package/dist/components/feedback/status-dot.d.ts

@@ -0,0 +1,49 @@
+import { type VariantProps } from "class-variance-authority";
+import * as React from "react";
+declare const statusDotVariants: (props?: ({
+    status?: "info" | "success" | "warning" | "danger" | "neutral" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+    pulse?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface StatusDotProps extends Omit<React.ComponentProps<"span">, "children" | "color">, VariantProps<typeof statusDotVariants> {
+    /**
+     * Soft halo in the dot's own colour, colour-mixed to 50%. Purely
+     * decorative emphasis — it is never the only signal of anything.
+     */
+    glow?: boolean;
+    /**
+     * Text announced to assistive technology.
+     *
+     * Defaults to `null` — a DECORATIVE dot, `aria-hidden`, for the common case
+     * where the dot sits immediately beside text that already states the status
+     * ("● Running"). Announcing it there would produce "Running Running", and a
+     * bare unlabelled dot in the tree is worse than none.
+     *
+     * Pass a string for a STANDALONE dot that is the only carrier of the state
+     * (a header service indicator, a cell in a dense table). The dot then gets
+     * `role="status"` and an `sr-only` label, so the state is announced when it
+     * changes — which is also what keeps it clear of WCAG 1.4.1 (Use of Colour),
+     * since hue alone would otherwise be the entire message.
+     *
+     * There is deliberately no default label per status: "success" is not a
+     * sentence, and the real one ("Service running", "3 boards offline") is
+     * always the caller's to write.
+     */
+    label?: string | null;
+}
+/**
+ * Small coloured state indicator.
+ *
+ * Two supported shapes, and the `label` prop is what selects between them:
+ *
+ *   <StatusDot status="success" /> Running          decorative, aria-hidden
+ *   <StatusDot status="success" label="Running" />  standalone, role="status"
+ *
+ * `role="status"` is a polite live region: the label is announced when it
+ * changes, which is the right behaviour for a dot tracking a connection. For
+ * a dot describing something static (a legend swatch, a row that never
+ * updates in place) pass `role="img"` — props spread over the computed
+ * attributes, so the override lands.
+ */
+declare function StatusDot({ className, status, size, pulse, glow, label, style, ...props }: StatusDotProps): React.JSX.Element;
+export { StatusDot, statusDotVariants };

package/dist/components/feedback/status-dot.js

@@ -0,0 +1,58 @@
+import { cn as e } from "../../lib/utils.js";
+import "react";
+import { jsx as t } from "react/jsx-runtime";
+import { cva as n } from "class-variance-authority";
+//#region src/components/feedback/status-dot.tsx
+var r = n("inline-block shrink-0 rounded-full align-middle transition-[background-color,box-shadow] duration-control", {
+	variants: {
+		status: {
+			success: "bg-success [--status-dot-color:var(--color-success)]",
+			warning: "bg-warning [--status-dot-color:var(--color-warning)]",
+			danger: "bg-destructive [--status-dot-color:var(--color-destructive)]",
+			info: "bg-info [--status-dot-color:var(--color-info)]",
+			neutral: "bg-muted-foreground [--status-dot-color:var(--color-muted-foreground)]"
+		},
+		size: {
+			sm: "size-1.5 [--status-dot-glow:4px]",
+			md: "size-2 [--status-dot-glow:6px]",
+			lg: "size-3 [--status-dot-glow:8px]"
+		},
+		pulse: {
+			true: "animate-pulse motion-reduce:animate-none",
+			false: ""
+		}
+	},
+	defaultVariants: {
+		status: "neutral",
+		size: "md",
+		pulse: !1
+	}
+}), i = { boxShadow: "0 0 var(--status-dot-glow) color-mix(in oklch, var(--status-dot-color) 50%, transparent)" };
+function a({ className: n, status: a = "neutral", size: o = "md", pulse: s = !1, glow: c = !1, label: l = null, style: u, ...d }) {
+	let f = l == null;
+	return /* @__PURE__ */ t("span", {
+		"data-slot": "status-dot",
+		"data-status": a,
+		"data-size": o,
+		role: f ? void 0 : "status",
+		"aria-hidden": f || void 0,
+		className: e(r({
+			status: a,
+			size: o,
+			pulse: s
+		}), n),
+		style: c ? {
+			...i,
+			...u
+		} : u,
+		...d,
+		children: f ? null : /* @__PURE__ */ t("span", {
+			className: "sr-only",
+			children: l
+		})
+	});
+}
+//#endregion
+export { a as StatusDot, r as statusDotVariants };
+
+//# sourceMappingURL=status-dot.js.map

package/dist/components/feedback/status-dot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"status-dot.js","names":[],"sources":["../../../src/components/feedback/status-dot.tsx"],"mappings":";;;;;AAkBA,IAAM,IAAoB,EACxB,6GACA;CACE,UAAU;EACR,QAAQ;GACN,SAAS;GACT,SAAS;GACT,QAAQ;GACR,MAAM;GACN,SAAS;EACX;EAIA,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACN;EAOA,OAAO;GACL,MAAM;GACN,OAAO;EACT;CACF;CACA,iBAAiB;EACf,QAAQ;EACR,MAAM;EACN,OAAO;CACT;AACF,CACF,GAMM,IAAkC,EACtC,WAAW,2FACb;AA4CA,SAAS,EAAU,EACjB,cACA,YAAS,WACT,UAAO,MACP,WAAQ,IACR,UAAO,IACP,WAAQ,MACR,UACA,GAAG,KACc;CACjB,IAAM,IAAa,KAAS;CAC5B,OACE,kBAAC,QAAD;EACE,aAAU;EACV,eAAa;EACb,aAAW;EACX,MAAM,IAAa,KAAA,IAAY;EAC/B,eAAa,KAAc,KAAA;EAC3B,WAAW,EAAG,EAAkB;GAAE;GAAQ;GAAM;EAAM,CAAC,GAAG,CAAS;EAEnE,OAAO,IAAO;GAAE,GAAG;GAAY,GAAG;EAAM,IAAI;EAC5C,GAAI;EASH,UAAA,IAAa,OAAO,kBAAC,QAAD;GAAM,WAAU;GAAW,UAAA;EAAY,CAAA;CACxD,CAAA;AAEV"}

package/dist/components/forms/secret-input.d.ts

@@ -0,0 +1,38 @@
+import * as React from "react";
+import { type InputProps } from "./input";
+export interface SecretInputProps extends Omit<InputProps, "type"> {
+    /**
+     * Accessible name for the toggle while the secret is masked — i.e. the
+     * action the button performs. Defaults to English "Show"; apps that
+     * localize pass their own string (this package never depends on i18n).
+     */
+    showLabel?: string;
+    /** Accessible name for the toggle while the secret is revealed. Default "Hide". */
+    hideLabel?: string;
+    /** Initial visibility for the uncontrolled case. */
+    defaultVisible?: boolean;
+    /** Controlled visibility; pair with {@link SecretInputProps.onVisibleChange}. */
+    visible?: boolean;
+    /** Fired with the next visibility whenever the toggle is activated. */
+    onVisibleChange?: (visible: boolean) => void;
+    /**
+     * Disables only the toggle, leaving the field editable. For write-only
+     * secrets the server returns a placeholder (`"***"`) rather than the value,
+     * so there is nothing to reveal — but the user may still type a new one.
+     */
+    revealDisabled?: boolean;
+    /** Classes for the relative wrapper (e.g. `flex-1` in a settings row). */
+    containerClassName?: string;
+}
+/**
+ * Password/token field with a reveal toggle.
+ *
+ * Composes {@link Input} rather than re-declaring a bordered control, so the
+ * field can never drift from the design system's control tokens, and mounts
+ * the toggle inside the field as a ghost icon {@link Button}.
+ *
+ * Value styling defaults to `font-mono` — secrets are keys and tokens, where
+ * character-level legibility matters — and is overridable through `className`.
+ */
+declare function SecretInput({ className, containerClassName, showLabel, hideLabel, defaultVisible, visible: visibleProp, onVisibleChange, revealDisabled, disabled, ref, ...props }: SecretInputProps): React.JSX.Element;
+export { SecretInput };

package/dist/components/forms/secret-input.js

@@ -0,0 +1,42 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "./button.js";
+import { Input as n } from "./input.js";
+import { Eye as r, EyeOff as i } from "lucide-react";
+import * as a from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/forms/secret-input.tsx
+function c({ className: c, containerClassName: l, showLabel: u = "Show", hideLabel: d = "Hide", defaultVisible: f = !1, visible: p, onVisibleChange: m, revealDisabled: h = !1, disabled: g, ref: _, ...v }) {
+	let [y, b] = a.useState(f), x = p !== void 0, S = (x ? p : y) && !h, C = () => {
+		let e = !S;
+		x || b(e), m?.(e);
+	}, w = S ? i : r;
+	return /* @__PURE__ */ s("div", {
+		"data-slot": "secret-input",
+		"data-visible": S ? "" : void 0,
+		className: e("relative w-full", l),
+		children: [/* @__PURE__ */ o(n, {
+			ref: _,
+			type: S ? "text" : "password",
+			disabled: g,
+			spellCheck: !1,
+			autoCapitalize: "none",
+			autoCorrect: "off",
+			className: e("pr-9 font-mono", c),
+			...v
+		}), /* @__PURE__ */ o(t, {
+			type: "button",
+			variant: "ghost",
+			size: "icon-sm",
+			onClick: C,
+			disabled: g || h,
+			"aria-label": S ? d : u,
+			className: "absolute right-0.5 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground",
+			children: /* @__PURE__ */ o(w, { "aria-hidden": "true" })
+		})]
+	});
+}
+//#endregion
+export { c as SecretInput };
+
+//# sourceMappingURL=secret-input.js.map

package/dist/components/forms/secret-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"secret-input.js","names":[],"sources":["../../../src/components/forms/secret-input.tsx"],"mappings":";;;;;;;;AA4CA,SAAS,EAAY,EACnB,cACA,uBACA,eAAY,QACZ,eAAY,QACZ,oBAAiB,IACjB,SAAS,GACT,oBACA,oBAAiB,IACjB,aACA,QACA,GAAG,KACgB;CACnB,IAAM,CAAC,GAAqB,KAA0B,EAAM,SAAS,CAAc,GAC7E,IAAe,MAAgB,KAAA,GAO/B,KANU,IAAe,IAAc,MAMP,CAAC,GAEjC,UAAqB;EACzB,IAAM,IAAO,CAAC;EAEd,AADK,KAAc,EAAuB,CAAI,GAC9C,IAAkB,CAAI;CACxB,GAEM,IAAO,IAAqB,IAAS;CAE3C,OACE,kBAAC,OAAD;EACE,aAAU;EACV,gBAAc,IAAqB,KAAK,KAAA;EACxC,WAAW,EAAG,mBAAmB,CAAkB;EAHrD,UAAA,CAKE,kBAAC,GAAD;GACO;GACL,MAAM,IAAqB,SAAS;GAC1B;GAIV,YAAY;GACZ,gBAAe;GACf,aAAY;GACZ,WAAW,EAAG,kBAAkB,CAAS;GACzC,GAAI;EACL,CAAA,GACD,kBAAC,GAAD;GACE,MAAK;GACL,SAAQ;GACR,MAAK;GAGL,SAAS;GACT,UAAU,KAAY;GAOtB,cAAY,IAAqB,IAAY;GAC7C,WAAU;GAEV,UAAA,kBAAC,GAAD,EAAM,eAAY,OAAQ,CAAA;EACpB,CAAA,CACL;;AAET"}

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

@@ -0,0 +1,87 @@
+import * as React from "react";
+type HourCycle = "12" | "24";
+export interface TimePickerPreset {
+    /** `HH:MM` value applied when the chip is activated. */
+    value: string;
+    /** Chip text. Defaults to the formatted `value`, so it follows `hourCycle`. */
+    label?: string;
+}
+/**
+ * Every user-visible string the picker renders on its own. All optional with
+ * English defaults — the package never resolves i18n, the app passes copy in.
+ */
+export interface TimePickerLabels {
+    /** Accessible name of the popover panel. Default `"Choose a time"`. */
+    panel?: string;
+    /** Heading above the hour listbox. Default `"Hour"`. */
+    hour?: string;
+    /** Heading above the minute listbox. Default `"Minute"`. */
+    minute?: string;
+    /** Heading above the preset chips. Default `"Quick presets"`. */
+    quickPresets?: string;
+    /** Morning period suffix in 12-hour display. Default `"AM"`. */
+    am?: string;
+    /** Afternoon period suffix in 12-hour display. Default `"PM"`. */
+    pm?: string;
+}
+export interface TimePickerProps {
+    /**
+     * Current time as `HH:MM` (24-hour), controlled. Empty string means "unset".
+     * Pair with {@link TimePickerProps.onValueChange}; omit both for the
+     * uncontrolled form seeded by `defaultValue`.
+     */
+    value?: string;
+    /** Initial `HH:MM` value (uncontrolled). Default `""` — unset. */
+    defaultValue?: string;
+    /** Fired with the new `HH:MM` value whenever an hour, minute, or preset is chosen. */
+    onValueChange?: (value: string) => void;
+    /** Trigger text while the value is empty. Default `"00:00"`. */
+    placeholder?: string;
+    /** Classes for the trigger button. */
+    className?: string;
+    /** Classes for the popover panel. */
+    contentClassName?: string;
+    disabled?: boolean;
+    /** Forwarded to the trigger so an external `<Label htmlFor>` can name it. */
+    id?: string;
+    /**
+     * Accessible name when no visible label is associated. Composed with the
+     * trigger's own value text rather than replacing it, so the name reads
+     * `"Start time 8:00 PM"` — a bare `aria-label` would override the content
+     * and stop announcing the very value the control exists to report.
+     */
+    "aria-label"?: string;
+    /**
+     * Id of an external label. It is composed with the trigger's own value text,
+     * so the accessible name stays `"Start time 8:00 PM"` rather than collapsing
+     * to `"Start time"` the way a bare `<Label htmlFor>` association would.
+     */
+    "aria-labelledby"?: string;
+    "aria-describedby"?: string;
+    "aria-invalid"?: React.AriaAttributes["aria-invalid"];
+    /** Display format of the trigger and the hour list. Default `"12"`. */
+    hourCycle?: HourCycle;
+    /** Granularity of the minute list, in minutes. Default `5`. */
+    minuteStep?: number;
+    /** Preset chips. Pass `[]` to drop the section. Defaults to 8 AM / 12 PM / 6 PM / 8 PM / 12 AM. */
+    presets?: TimePickerPreset[];
+    labels?: TimePickerLabels;
+    /** Open the panel on first render (uncontrolled). */
+    defaultOpen?: boolean;
+    /** Controlled open state; pair with `onOpenChange`. */
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    ref?: React.Ref<HTMLButtonElement>;
+}
+/**
+ * Time-of-day picker: a button showing the current time that opens a popover
+ * with an hour listbox, a minute listbox, and preset chips.
+ *
+ * Fully keyboard operable — Enter/Space on the trigger opens the panel and
+ * moves focus to the selected hour, Arrow/Home/End/PageUp/PageDown walk a
+ * list, Tab crosses to the minutes and the presets, Escape closes and returns
+ * focus to the trigger. Selection follows focus inside each list, so arrowing
+ * through hours updates `value` live the way a native `<select>` does.
+ */
+declare function TimePicker({ value: valueProp, defaultValue, onValueChange, placeholder, className, contentClassName, disabled, id, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, hourCycle, minuteStep, presets, labels, defaultOpen, open: openProp, onOpenChange, ref, }: TimePickerProps): React.JSX.Element;
+export { TimePicker };

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

@@ -0,0 +1,260 @@
+"use client";
+import { cn as e } from "../../lib/utils.js";
+import { Button as t } from "./button.js";
+import { Flex as n } from "../layout/flex.js";
+import { Popover as r, PopoverContent as i, PopoverTrigger as a } from "../overlays/popover.js";
+import { Text as o } from "../typography/text.js";
+import { Clock as s } from "lucide-react";
+import * as c from "react";
+import { Fragment as l, jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/components/forms/time-picker.tsx
+var f = /^(\d{1,2}):(\d{1,2})$/, p = {
+	hours: "00",
+	minutes: "00"
+};
+function m(e) {
+	if (!e) return null;
+	let t = f.exec(e.trim());
+	if (!t) return null;
+	let n = Number(t[1]), r = Number(t[2]);
+	return n > 23 || r > 59 ? null : {
+		hours: String(n).padStart(2, "0"),
+		minutes: String(r).padStart(2, "0")
+	};
+}
+function h({ hours: e, minutes: t }, n, r, i) {
+	if (n === "24") return `${e}:${t}`;
+	let a = Number(e), o = a >= 12 ? i : r;
+	return `${a % 12 == 0 ? 12 : a % 12}:${t} ${o}`;
+}
+function g(e, t, n, r) {
+	return t === "24" ? String(e).padStart(2, "0") : `${e % 12 == 0 ? 12 : e % 12} ${e >= 12 ? r : n}`;
+}
+var _ = [
+	"08:00",
+	"12:00",
+	"18:00",
+	"20:00",
+	"00:00"
+], v = "[role=\"option\"]";
+function y(e, t) {
+	let n = e.findIndex((e) => e.value === t);
+	if (n >= 0) return n;
+	let r = Number(t), i = 0;
+	for (let t = 1; t < e.length; t += 1) Math.abs(Number(e[t].value) - r) < Math.abs(Number(e[i].value) - r) && (i = t);
+	return i;
+}
+var b = {
+	panel: "Choose a time",
+	hour: "Hour",
+	minute: "Minute",
+	quickPresets: "Quick presets",
+	am: "AM",
+	pm: "PM"
+};
+function x({ value: n, defaultValue: o = "", onValueChange: l, placeholder: f = "00:00", className: g, contentClassName: _, disabled: v, id: y, "aria-label": x, "aria-labelledby": C, "aria-describedby": w, "aria-invalid": T, hourCycle: E = "12", minuteStep: D = 5, presets: O, labels: k, defaultOpen: A = !1, open: j, onOpenChange: M, ref: N }) {
+	let [P, F] = c.useState(A), I = j ?? P, [L, R] = c.useState(o), z = n ?? L, B = c.useId(), V = {
+		...b,
+		...k
+	}, H = m(z), U = H ?? p, W = (e) => {
+		j === void 0 && F(e), M?.(e);
+	}, G = (e) => {
+		n === void 0 && R(e), l?.(e);
+	}, K = H ? h(H, E, V.am, V.pm) : f, q = `${B}-value`, J = `${B}-label`, Y = C ?? (x ? J : void 0);
+	return /* @__PURE__ */ d(r, {
+		open: I,
+		onOpenChange: W,
+		children: [/* @__PURE__ */ u(a, {
+			asChild: !0,
+			children: /* @__PURE__ */ d(t, {
+				ref: N,
+				id: y,
+				type: "button",
+				variant: "outline",
+				disabled: v,
+				"aria-labelledby": Y ? `${Y} ${q}` : void 0,
+				"aria-describedby": w,
+				"aria-invalid": T,
+				className: e("h-9 w-full justify-start px-3 text-sm font-normal", !H && "text-muted-foreground", g),
+				children: [
+					/* @__PURE__ */ u(s, {
+						className: "size-4",
+						"aria-hidden": "true"
+					}),
+					x && !C ? /* @__PURE__ */ u("span", {
+						id: J,
+						className: "sr-only",
+						children: x
+					}) : null,
+					/* @__PURE__ */ u("span", {
+						id: q,
+						children: K
+					})
+				]
+			})
+		}), /* @__PURE__ */ u(i, {
+			className: e("w-64", _),
+			align: "start",
+			label: V.panel,
+			children: I ? /* @__PURE__ */ u(S, {
+				baseId: B,
+				parts: U,
+				hasValue: H !== null,
+				hourCycle: E,
+				minuteStep: D,
+				presets: O,
+				text: V,
+				onChange: G,
+				onClose: () => W(!1)
+			}) : null
+		})]
+	});
+}
+function S({ baseId: e, parts: r, hasValue: i, hourCycle: a, minuteStep: s, presets: f, text: y, onChange: b, onClose: x }) {
+	let S = c.useRef(null), w = c.useMemo(() => Array.from({ length: 24 }, (e, t) => ({
+		value: String(t).padStart(2, "0"),
+		label: g(t, a, y.am, y.pm)
+	})), [
+		a,
+		y.am,
+		y.pm
+	]), T = c.useMemo(() => {
+		let e = Math.min(60, Math.max(1, Math.floor(s) || 1));
+		return Array.from({ length: Math.ceil(60 / e) }, (t, n) => {
+			let r = String(n * e).padStart(2, "0");
+			return {
+				value: r,
+				label: r
+			};
+		});
+	}, [s]), E = c.useMemo(() => (f ?? _.map((e) => ({ value: e }))).filter((e) => m(e.value) !== null), [f]);
+	c.useEffect(() => {
+		let e = requestAnimationFrame(() => {
+			S.current?.querySelector(`${v}[tabindex="0"]`)?.focus({ preventScroll: !0 });
+		});
+		return () => cancelAnimationFrame(e);
+	}, []);
+	let D = `${e}-hour`, O = `${e}-minute`, k = `${e}-presets`;
+	return /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ d(n, {
+		gap: "4",
+		children: [/* @__PURE__ */ d("div", {
+			className: "flex-1",
+			ref: S,
+			children: [/* @__PURE__ */ u(o, {
+				as: "span",
+				id: D,
+				size: "xs",
+				weight: "medium",
+				tone: "muted",
+				className: "mb-2 block",
+				children: y.hour
+			}), /* @__PURE__ */ u(C, {
+				labelId: D,
+				options: w,
+				selected: r.hours,
+				onSelect: (e) => b(`${e}:${r.minutes}`)
+			})]
+		}), /* @__PURE__ */ d("div", {
+			className: "flex-1",
+			children: [/* @__PURE__ */ u(o, {
+				as: "span",
+				id: O,
+				size: "xs",
+				weight: "medium",
+				tone: "muted",
+				className: "mb-2 block",
+				children: y.minute
+			}), /* @__PURE__ */ u(C, {
+				labelId: O,
+				options: T,
+				selected: r.minutes,
+				onSelect: (e) => b(`${r.hours}:${e}`)
+			})]
+		})]
+	}), E.length > 0 && /* @__PURE__ */ d("div", {
+		className: "mt-4 border-t pt-4",
+		children: [/* @__PURE__ */ u(o, {
+			as: "span",
+			id: k,
+			size: "xs",
+			weight: "medium",
+			tone: "muted",
+			className: "mb-2 block",
+			children: y.quickPresets
+		}), /* @__PURE__ */ u(n, {
+			gap: "2",
+			wrap: !0,
+			role: "group",
+			"aria-labelledby": k,
+			children: E.map((e) => {
+				let n = m(e.value) ?? p, o = `${n.hours}:${n.minutes}`;
+				return /* @__PURE__ */ u(t, {
+					type: "button",
+					variant: "outline",
+					size: "sm",
+					"aria-current": i && o === `${r.hours}:${r.minutes}` ? !0 : void 0,
+					onClick: () => {
+						b(o), x();
+					},
+					className: "h-7 px-2 text-xs aria-[current=true]:bg-accent aria-[current=true]:text-accent-foreground",
+					children: e.label ?? h(n, a, y.am, y.pm)
+				}, e.value);
+			})
+		})]
+	})] });
+}
+function C({ labelId: t, options: n, selected: r, onSelect: i }) {
+	let a = c.useRef(null), o = y(n, r);
+	c.useEffect(() => {
+		let e = a.current, t = e?.querySelectorAll(v)[o];
+		if (!e || !t) return;
+		let n = e.getBoundingClientRect(), r = t.getBoundingClientRect();
+		e.scrollTop += r.top - n.top - (e.clientHeight - r.height) / 2;
+	}, []);
+	let s = (e) => {
+		let t = Math.max(0, Math.min(n.length - 1, e));
+		i(n[t].value), (a.current?.querySelectorAll(v))?.[t]?.focus();
+	}, l = (e, t) => {
+		switch (e.key) {
+			case "ArrowDown":
+				e.preventDefault(), s(t + 1);
+				break;
+			case "ArrowUp":
+				e.preventDefault(), s(t - 1);
+				break;
+			case "PageDown":
+				e.preventDefault(), s(t + 5);
+				break;
+			case "PageUp":
+				e.preventDefault(), s(t - 5);
+				break;
+			case "Home":
+				e.preventDefault(), s(0);
+				break;
+			case "End":
+				e.preventDefault(), s(n.length - 1);
+				break;
+			case "Enter":
+			case " ": e.preventDefault(), i(n[t].value);
+		}
+	};
+	return /* @__PURE__ */ u("div", {
+		ref: a,
+		role: "listbox",
+		"aria-labelledby": t,
+		className: "max-h-48 overflow-y-auto rounded-md border bg-background",
+		children: n.map((t, n) => /* @__PURE__ */ u("div", {
+			role: "option",
+			"aria-selected": t.value === r,
+			tabIndex: n === o ? 0 : -1,
+			onClick: () => i(t.value),
+			onKeyDown: (e) => l(e, n),
+			className: e("cursor-default px-3 py-2 text-left text-sm transition-colors duration-control", "hover:bg-accent hover:text-accent-foreground", "outline-none focus:bg-accent focus:text-accent-foreground focus:ring-[3px] focus:ring-inset focus:ring-ring/50", t.value === r && "bg-accent font-medium text-accent-foreground"),
+			children: t.label
+		}, t.value))
+	});
+}
+//#endregion
+export { x as TimePicker };
+
+//# sourceMappingURL=time-picker.js.map

package/dist/components/forms/time-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"time-picker.js","names":[],"sources":["../../../src/components/forms/time-picker.tsx"],"mappings":"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"}