lazyconvex 0.0.0

package/dist/components/index.mjs

@@ -0,0 +1,937 @@
+import { n as FileApiProvider, r as FileFieldImpl, t as FileApiContext } from "../file-field-BqVgy8xY.mjs";
+import { unwrapZod } from "../zod.mjs";
+import "../error-D4GuI0ot.mjs";
+import { n as useForm$1, r as useFormMutation$1, t as useOnlineStatus } from "../use-online-status-CMr73Jlk.mjs";
+import "../use-upload-DtELytQi.mjs";
+import { Suspense, createContext, use, useEffect, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Avatar, AvatarFallback, AvatarImage } from "@a/ui/avatar";
+import { Button } from "@a/ui/button";
+import { Card, CardContent, CardHeader, CardTitle } from "@a/ui/card";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@a/ui/select";
+import { CalendarIcon, Check, ChevronsUpDown, Star, UserPlus, X } from "lucide-react";
+import { cn } from "@a/ui";
+import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from "@a/ui/command";
+import { Field, FieldError, FieldLabel } from "@a/ui/field";
+import { Input } from "@a/ui/input";
+import { Popover, PopoverContent, PopoverTrigger } from "@a/ui/popover";
+import { Slider } from "@a/ui/slider";
+import { Spinner } from "@a/ui/spinner";
+import { Switch } from "@a/ui/switch";
+import { Textarea } from "@a/ui/textarea";
+import { format } from "date-fns";
+import dynamic from "next/dynamic";
+import { toast } from "sonner";
+import { Dialog, DialogContent } from "@a/ui/dialog";
+import { useNavigationGuard } from "next-navigation-guard";
+import { Badge } from "@a/ui/badge";
+import Link from "next/link";
+
+//#region src/components/editors-section.tsx
+const EditorsSection = ({ editorsList, members, onAdd, onRemove }) => {
+	const editorIds = new Set(editorsList.map((e) => e.userId)), available = [];
+	for (const m of members) if (!editorIds.has(m.userId)) available.push(m);
+	return /* @__PURE__ */ jsxs(Card, {
+		"data-testid": "editors-section",
+		children: [/* @__PURE__ */ jsxs(CardHeader, {
+			className: "flex flex-row items-center justify-between",
+			children: [/* @__PURE__ */ jsx(CardTitle, { children: "Editors" }), available.length > 0 ? /* @__PURE__ */ jsxs(Select, {
+				onValueChange: onAdd,
+				children: [/* @__PURE__ */ jsxs(SelectTrigger, {
+					className: "w-40",
+					"data-testid": "add-editor-trigger",
+					children: [/* @__PURE__ */ jsx(UserPlus, { className: "mr-2 size-4" }), /* @__PURE__ */ jsx(SelectValue, { placeholder: "Add editor" })]
+				}), /* @__PURE__ */ jsx(SelectContent, { children: available.map((m) => /* @__PURE__ */ jsx(SelectItem, {
+					value: m.userId,
+					children: m.user?.name ?? m.user?.email ?? "Unknown"
+				}, m.userId)) })]
+			}) : null]
+		}), editorsList.length > 0 ? /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx("div", {
+			className: "divide-y",
+			children: editorsList.map((e) => /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-3 py-2",
+				"data-testid": `editor-item-${e.userId}`,
+				children: [
+					/* @__PURE__ */ jsx(Avatar, {
+						className: "size-7",
+						children: /* @__PURE__ */ jsx(AvatarFallback, {
+							className: "text-xs",
+							children: e.name.slice(0, 2).toUpperCase() || "??"
+						})
+					}),
+					/* @__PURE__ */ jsx("span", {
+						className: "flex-1 text-sm",
+						children: e.name || e.email
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						"data-testid": `remove-editor-${e.userId}`,
+						onClick: () => onRemove(e.userId),
+						size: "icon",
+						variant: "ghost",
+						children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+					})
+				]
+			}, e.userId))
+		}) }) : /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx("p", {
+			className: "text-sm text-muted-foreground",
+			children: "No editors assigned"
+		}) })]
+	});
+};
+
+//#endregion
+//#region src/components/fields.tsx
+const Calendar = dynamic(async () => import("@a/ui/calendar").then((m) => ({ default: m.Calendar })), {
+	loading: () => /* @__PURE__ */ jsx("div", { className: "h-64 w-full animate-pulse rounded-md bg-muted" }),
+	ssr: false
+}), HEX_COLOR_REGEX = /^#[\dA-Fa-f]{6}$/, DynamicFileField = dynamic(async () => import("../file-field-BqVgy8xY.mjs").then((n) => n.i), {
+	loading: () => /* @__PURE__ */ jsx("div", { className: "h-32 w-full animate-pulse rounded-lg bg-muted" }),
+	ssr: false
+}), FormContext = createContext(null), useFCtx = () => {
+	const c = use(FormContext);
+	if (!c) throw new Error("Field must be inside <Form>");
+	return c;
+}, useField = (name, kind) => {
+	const ctx = useFCtx(), info = ctx.meta[name];
+	if (!info) throw new Error(`Unknown field: ${name}`);
+	if (info.kind !== kind) throw new Error(`Field ${name} is not ${kind}`);
+	return {
+		form: ctx.form,
+		info,
+		schema: ctx.schema
+	};
+}, defaultEnumOptions = (schema, name) => {
+	const { schema: inner } = unwrapZod(schema.shape[name]);
+	if (inner && "options" in inner) return inner.options.map((v) => ({
+		label: v.charAt(0).toUpperCase() + v.slice(1),
+		value: v
+	}));
+	throw new Error(`Choose: field "${name}" has no enum options. Pass options prop.`);
+}, fields = {
+	Arr: ({ className, "data-testid": testId, disabled, inputClassName, label, name, placeholder, tagClassName, transform }) => {
+		const { form, info } = useField(name, "stringArray");
+		return /* @__PURE__ */ jsx(form.Field, {
+			mode: "array",
+			name,
+			children: (f) => {
+				const tags = f.state.value ?? [], inv = f.state.meta.isTouched && !f.state.meta.isValid, mx = info.max, tid = testId ?? f.name, errorId = `${f.name}-error`;
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [
+						label ? /* @__PURE__ */ jsx(FieldLabel, {
+							htmlFor: f.name,
+							children: label
+						}) : null,
+						/* @__PURE__ */ jsxs("div", {
+							className: cn("relative flex min-h-10 w-full flex-wrap items-center gap-0.75 rounded-md border border-input bg-transparent p-1 text-sm transition-[color,box-shadow] disabled:cursor-not-allowed disabled:opacity-50 has-[input:focus-visible]:border-ring has-[input:focus-visible]:ring-[3px] has-[input:focus-visible]:ring-ring/50 dark:bg-background", className),
+							children: [tags.map((t, i) => /* @__PURE__ */ jsxs("p", {
+								className: cn("flex h-7 items-center gap-0.5 rounded-full bg-muted pr-1.5 pl-3 transition-all duration-300 hover:bg-input", tagClassName, disabled && "cursor-not-allowed opacity-50 *:cursor-not-allowed"),
+								children: [/* @__PURE__ */ jsx("span", {
+									className: "mb-px",
+									children: t
+								}), /* @__PURE__ */ jsx(X, {
+									className: "size-4 cursor-pointer rounded-full stroke-1 p-0.5 text-muted-foreground transition-all duration-300 hover:scale-110 hover:bg-background hover:stroke-2 hover:text-destructive active:scale-75",
+									onClick: () => {
+										if (!disabled) f.removeValue(i);
+									}
+								})]
+							}, t)), /* @__PURE__ */ jsx("input", {
+								"aria-describedby": inv ? errorId : void 0,
+								"aria-invalid": inv,
+								className: cn("peer ml-1 w-0 flex-1 outline-none placeholder:text-muted-foreground placeholder:capitalize", tags.length ? "placeholder:opacity-0" : "pl-1", inputClassName),
+								disabled,
+								id: f.name,
+								name: f.name,
+								onBlur: f.handleBlur,
+								onKeyDown: (e) => {
+									const { value } = e.currentTarget;
+									if (e.key === "Enter") {
+										e.preventDefault();
+										if (!value.trim()) return;
+										const v = transform ? transform(value) : value;
+										if (tags.includes(v)) {
+											toast.error("Item duplicated");
+											return;
+										}
+										if (mx && tags.length + 1 > mx) {
+											toast.error(`Max ${mx}`);
+											return;
+										}
+										f.handleChange([...new Set([...tags, v])]);
+										e.currentTarget.value = "";
+									} else if (e.key === "Backspace" && tags.length && !value.trim()) {
+										e.preventDefault();
+										f.removeValue(tags.length - 1);
+									}
+								},
+								placeholder: tags.length ? void 0 : placeholder
+							})]
+						}),
+						inv ? /* @__PURE__ */ jsx(FieldError, {
+							errors: f.state.meta.errors,
+							id: errorId
+						}) : null
+					]
+				});
+			}
+		});
+	},
+	Choose: ({ "data-testid": testId, label, name, options: explicitOptions, placeholder }) => {
+		const { form, schema } = useField(name, "string"), options = explicitOptions ?? defaultEnumOptions(schema, name);
+		return /* @__PURE__ */ jsx(form.Field, {
+			name,
+			children: (f) => {
+				const inv = f.state.meta.isTouched && !f.state.meta.isValid, tid = testId ?? f.name, errorId = `${f.name}-error`;
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [
+						label ? /* @__PURE__ */ jsx(FieldLabel, {
+							htmlFor: f.name,
+							children: label
+						}) : null,
+						/* @__PURE__ */ jsxs(Select, {
+							name: f.name,
+							onValueChange: (v) => f.handleChange(v),
+							value: f.state.value ?? "",
+							children: [/* @__PURE__ */ jsx(SelectTrigger, {
+								"aria-describedby": inv ? errorId : void 0,
+								"aria-invalid": inv,
+								id: f.name,
+								onBlur: f.handleBlur,
+								children: /* @__PURE__ */ jsx(SelectValue, { placeholder })
+							}), /* @__PURE__ */ jsx(SelectContent, { children: options.map((o) => /* @__PURE__ */ jsx(SelectItem, {
+								value: o.value,
+								children: o.label
+							}, o.value)) })]
+						}),
+						inv ? /* @__PURE__ */ jsx(FieldError, {
+							errors: f.state.meta.errors,
+							id: errorId
+						}) : null
+					]
+				});
+			}
+		});
+	},
+	Colorpick: ({ "data-testid": testId, label, name }) => {
+		const { form } = useField(name, "string");
+		return /* @__PURE__ */ jsx(form.Field, {
+			name,
+			children: (f) => {
+				const inv = f.state.meta.isTouched && !f.state.meta.isValid, tid = testId ?? f.name, errorId = `${f.name}-error`, val = f.state.value ?? "#000000";
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [
+						label ? /* @__PURE__ */ jsx(FieldLabel, {
+							htmlFor: f.name,
+							children: label
+						}) : null,
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex gap-2",
+							children: [/* @__PURE__ */ jsx("input", {
+								"aria-describedby": inv ? errorId : void 0,
+								"aria-invalid": inv,
+								className: "size-10 cursor-pointer rounded-md border border-input",
+								id: f.name,
+								name: f.name,
+								onBlur: f.handleBlur,
+								onChange: (e) => f.handleChange(e.target.value),
+								type: "color",
+								value: val
+							}), /* @__PURE__ */ jsx(Input, {
+								className: "flex-1 font-mono",
+								onBlur: f.handleBlur,
+								onChange: (e) => {
+									const v = e.target.value;
+									if (HEX_COLOR_REGEX.test(v)) f.handleChange(v);
+								},
+								placeholder: "#000000",
+								value: val
+							})]
+						}),
+						inv ? /* @__PURE__ */ jsx(FieldError, {
+							errors: f.state.meta.errors,
+							id: errorId
+						}) : null
+					]
+				});
+			}
+		});
+	},
+	Combobox: ({ "data-testid": testId, emptyText = "No results found.", label, name, options, placeholder = "Select...", searchPlaceholder = "Search..." }) => {
+		const { form } = useField(name, "string"), [open, setOpen] = useState(false);
+		return /* @__PURE__ */ jsx(form.Field, {
+			name,
+			children: (f) => {
+				const inv = f.state.meta.isTouched && !f.state.meta.isValid, tid = testId ?? f.name, errorId = `${f.name}-error`, selected = options.find((o) => o.value === f.state.value), listId = `${f.name}-listbox`;
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [
+						label ? /* @__PURE__ */ jsx(FieldLabel, {
+							htmlFor: f.name,
+							children: label
+						}) : null,
+						/* @__PURE__ */ jsxs(Popover, {
+							onOpenChange: setOpen,
+							open,
+							children: [/* @__PURE__ */ jsx(PopoverTrigger, {
+								asChild: true,
+								children: /* @__PURE__ */ jsxs(Button, {
+									"aria-controls": listId,
+									"aria-describedby": inv ? errorId : void 0,
+									"aria-expanded": open,
+									"aria-invalid": inv,
+									className: "w-full justify-between font-normal",
+									id: f.name,
+									onBlur: f.handleBlur,
+									role: "combobox",
+									variant: "outline",
+									children: [selected ? selected.label : /* @__PURE__ */ jsx("span", {
+										className: "text-muted-foreground",
+										children: placeholder
+									}), /* @__PURE__ */ jsx(ChevronsUpDown, { className: "ml-2 size-4 shrink-0 opacity-50" })]
+								})
+							}), /* @__PURE__ */ jsx(PopoverContent, {
+								className: "w-(--radix-popover-trigger-width) p-0",
+								children: /* @__PURE__ */ jsxs(Command, { children: [/* @__PURE__ */ jsx(CommandInput, { placeholder: searchPlaceholder }), /* @__PURE__ */ jsxs(CommandList, {
+									id: listId,
+									children: [/* @__PURE__ */ jsx(CommandEmpty, { children: emptyText }), /* @__PURE__ */ jsx(CommandGroup, { children: options.map((o) => /* @__PURE__ */ jsxs(CommandItem, {
+										onSelect: () => {
+											f.handleChange(o.value === f.state.value ? "" : o.value);
+											setOpen(false);
+										},
+										value: o.label,
+										children: [/* @__PURE__ */ jsx(Check, { className: cn("mr-2 size-4", f.state.value === o.value ? "opacity-100" : "opacity-0") }), o.label]
+									}, o.value)) })]
+								})] })
+							})]
+						}),
+						inv ? /* @__PURE__ */ jsx(FieldError, {
+							errors: f.state.meta.errors,
+							id: errorId
+						}) : null
+					]
+				});
+			}
+		});
+	},
+	Datepick: ({ clearable = true, "data-testid": testId, disabled, label, name, placeholder = "Pick a date" }) => {
+		const { form } = useField(name, "number");
+		return /* @__PURE__ */ jsx(form.Field, {
+			name,
+			children: (f) => {
+				const inv = f.state.meta.isTouched && !f.state.meta.isValid, ts = f.state.value, dateVal = ts ? new Date(ts) : void 0, tid = testId ?? f.name, errorId = `${f.name}-error`;
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [
+						label ? /* @__PURE__ */ jsx(FieldLabel, {
+							htmlFor: f.name,
+							children: label
+						}) : null,
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex gap-1",
+							children: [/* @__PURE__ */ jsxs(Popover, { children: [/* @__PURE__ */ jsx(PopoverTrigger, {
+								asChild: true,
+								children: /* @__PURE__ */ jsxs(Button, {
+									"aria-describedby": inv ? errorId : void 0,
+									"aria-invalid": inv,
+									className: cn("flex-1 justify-start text-left font-normal", !dateVal && "text-muted-foreground"),
+									"data-testid": `${tid}-trigger`,
+									disabled,
+									id: f.name,
+									variant: "outline",
+									children: [/* @__PURE__ */ jsx(CalendarIcon, { className: "mr-2 size-4" }), dateVal ? format(dateVal, "PPP") : placeholder]
+								})
+							}), /* @__PURE__ */ jsx(PopoverContent, {
+								align: "start",
+								className: "w-auto p-0",
+								"data-testid": `${tid}-calendar`,
+								children: /* @__PURE__ */ jsx(Calendar, {
+									mode: "single",
+									onSelect: (d) => {
+										f.handleChange(d ? d.getTime() : null);
+										f.handleBlur();
+									},
+									selected: dateVal
+								})
+							})] }), clearable && dateVal ? /* @__PURE__ */ jsx(Button, {
+								"data-testid": `${tid}-clear`,
+								disabled,
+								onClick: () => {
+									f.handleChange(null);
+									f.handleBlur();
+								},
+								size: "icon",
+								type: "button",
+								variant: "outline",
+								children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+							}) : null]
+						}),
+						inv ? /* @__PURE__ */ jsx(FieldError, {
+							errors: f.state.meta.errors,
+							id: errorId
+						}) : null
+					]
+				});
+			}
+		});
+	},
+	Err: ({ error }) => error ? /* @__PURE__ */ jsx("p", {
+		className: "rounded-lg bg-destructive/10 p-3 text-sm text-destructive",
+		role: "alert",
+		children: error.message
+	}) : null,
+	File: ({ accept, className, compressImg, "data-testid": testId, disabled, label, maxSize, name }) => {
+		const { form } = useField(name, "file");
+		return /* @__PURE__ */ jsx(form.Field, {
+			name,
+			children: (f) => /* @__PURE__ */ jsx(DynamicFileField, {
+				accept,
+				className,
+				compressImg,
+				"data-testid": testId,
+				disabled,
+				field: f,
+				label,
+				maxSize
+			})
+		});
+	},
+	Files: ({ accept, className, compressImg, "data-testid": testId, disabled, label, max, maxSize, name }) => {
+		const { form, info } = useField(name, "files");
+		return /* @__PURE__ */ jsx(form.Field, {
+			mode: "array",
+			name,
+			children: (f) => /* @__PURE__ */ jsx(DynamicFileField, {
+				accept,
+				className,
+				compressImg,
+				"data-testid": testId,
+				disabled,
+				field: f,
+				label,
+				max: max ?? info.max,
+				maxSize,
+				multiple: true
+			})
+		});
+	},
+	MultiSelect: ({ "data-testid": testId, label, name, options, placeholder }) => {
+		const { form, info } = useField(name, "stringArray");
+		return /* @__PURE__ */ jsx(form.Field, {
+			mode: "array",
+			name,
+			children: (f) => {
+				const selected = f.state.value ?? [], inv = f.state.meta.isTouched && !f.state.meta.isValid, mx = info.max, tid = testId ?? f.name, errorId = `${f.name}-error`;
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [
+						label ? /* @__PURE__ */ jsx(FieldLabel, {
+							htmlFor: f.name,
+							children: label
+						}) : null,
+						/* @__PURE__ */ jsxs(Select, {
+							name: f.name,
+							onValueChange: (v) => {
+								if (selected.includes(v)) f.handleChange(selected.filter((x) => x !== v));
+								else {
+									if (mx && selected.length >= mx) {
+										toast.error(`Max ${mx}`);
+										return;
+									}
+									f.handleChange([...selected, v]);
+								}
+							},
+							value: "",
+							children: [/* @__PURE__ */ jsx(SelectTrigger, {
+								"aria-describedby": inv ? errorId : void 0,
+								"aria-invalid": inv,
+								id: f.name,
+								onBlur: f.handleBlur,
+								children: /* @__PURE__ */ jsx(SelectValue, { placeholder: selected.length ? `${selected.length} selected` : placeholder })
+							}), /* @__PURE__ */ jsx(SelectContent, { children: options.map((o) => /* @__PURE__ */ jsx(SelectItem, {
+								className: selected.includes(o.value) ? "bg-accent" : "",
+								value: o.value,
+								children: o.label
+							}, o.value)) })]
+						}),
+						selected.length ? /* @__PURE__ */ jsx("div", {
+							className: "flex flex-wrap gap-1",
+							children: selected.map((v) => {
+								return /* @__PURE__ */ jsxs("p", {
+									className: "flex h-7 items-center gap-0.5 rounded-full bg-muted pr-1.5 pl-3 text-sm transition-all duration-300 hover:bg-input",
+									children: [/* @__PURE__ */ jsx("span", {
+										className: "mb-px",
+										children: options.find((o) => o.value === v)?.label ?? v
+									}), /* @__PURE__ */ jsx(X, {
+										className: "size-4 cursor-pointer rounded-full stroke-1 p-0.5 text-muted-foreground transition-all duration-300 hover:scale-110 hover:bg-background hover:stroke-2 hover:text-destructive active:scale-75",
+										onClick: () => f.handleChange(selected.filter((x) => x !== v))
+									})]
+								}, v);
+							})
+						}) : null,
+						inv ? /* @__PURE__ */ jsx(FieldError, {
+							errors: f.state.meta.errors,
+							id: errorId
+						}) : null
+					]
+				});
+			}
+		});
+	},
+	Num: ({ "data-testid": testId, label, name, ...props }) => {
+		const { form } = useField(name, "number");
+		return /* @__PURE__ */ jsx(form.Field, {
+			name,
+			children: (f) => {
+				const inv = f.state.meta.isTouched && !f.state.meta.isValid, tid = testId ?? f.name, errorId = `${f.name}-error`;
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [
+						label ? /* @__PURE__ */ jsx(FieldLabel, {
+							htmlFor: f.name,
+							children: label
+						}) : null,
+						/* @__PURE__ */ jsx(Input, {
+							"aria-describedby": inv ? errorId : void 0,
+							"aria-invalid": inv,
+							id: f.name,
+							name: f.name,
+							onBlur: f.handleBlur,
+							onChange: (e) => {
+								const { value, valueAsNumber } = e.currentTarget;
+								f.handleChange(value === "" || Number.isNaN(valueAsNumber) ? void 0 : valueAsNumber);
+							},
+							type: "number",
+							value: f.state.value ?? "",
+							...props
+						}),
+						inv ? /* @__PURE__ */ jsx(FieldError, {
+							errors: f.state.meta.errors,
+							id: errorId
+						}) : null
+					]
+				});
+			}
+		});
+	},
+	Rating: ({ "data-testid": testId, label, max = 5, name }) => {
+		const { form } = useField(name, "number");
+		return /* @__PURE__ */ jsx(form.Field, {
+			name,
+			children: (f) => {
+				const inv = f.state.meta.isTouched && !f.state.meta.isValid, tid = testId ?? f.name, errorId = `${f.name}-error`, val = f.state.value ?? 0;
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [
+						label ? /* @__PURE__ */ jsx(FieldLabel, {
+							htmlFor: f.name,
+							children: label
+						}) : null,
+						/* @__PURE__ */ jsx("div", {
+							className: "flex gap-1",
+							children: Array.from({ length: max }, (_, i) => i + 1).map((i) => /* @__PURE__ */ jsx(Star, {
+								className: cn("size-6 cursor-pointer transition-all", i <= val ? "fill-yellow-400 text-yellow-400" : "text-muted-foreground hover:text-yellow-400"),
+								onBlur: f.handleBlur,
+								onClick: () => f.handleChange(i)
+							}, i))
+						}),
+						inv ? /* @__PURE__ */ jsx(FieldError, {
+							errors: f.state.meta.errors,
+							id: errorId
+						}) : null
+					]
+				});
+			}
+		});
+	},
+	Slider: ({ "data-testid": testId, label, max = 100, min = 0, name, step = 1 }) => {
+		const { form } = useField(name, "number");
+		return /* @__PURE__ */ jsx(form.Field, {
+			name,
+			children: (f) => {
+				const inv = f.state.meta.isTouched && !f.state.meta.isValid, tid = testId ?? f.name, errorId = `${f.name}-error`, val = f.state.value ?? min;
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex items-center justify-between",
+							children: [label ? /* @__PURE__ */ jsx(FieldLabel, {
+								htmlFor: f.name,
+								children: label
+							}) : null, /* @__PURE__ */ jsx("span", {
+								className: "text-sm text-muted-foreground",
+								children: val
+							})]
+						}),
+						/* @__PURE__ */ jsx(Slider, {
+							"aria-describedby": inv ? errorId : void 0,
+							"aria-invalid": inv,
+							id: f.name,
+							max,
+							min,
+							name: f.name,
+							onBlur: f.handleBlur,
+							onValueChange: ([v]) => f.handleChange(v),
+							step,
+							value: [val]
+						}),
+						inv ? /* @__PURE__ */ jsx(FieldError, {
+							errors: f.state.meta.errors,
+							id: errorId
+						}) : null
+					]
+				});
+			}
+		});
+	},
+	Submit: ({ children, disabled, Icon, ...props }) => {
+		const { form } = useFCtx();
+		return /* @__PURE__ */ jsx(form.Subscribe, {
+			selector: (s) => s.isSubmitting,
+			children: (pending) => /* @__PURE__ */ jsxs(Button, {
+				disabled: disabled ?? pending,
+				type: "submit",
+				...props,
+				children: [pending ? /* @__PURE__ */ jsx(Spinner, {}) : Icon ? /* @__PURE__ */ jsx(Icon, {}) : null, children]
+			})
+		});
+	},
+	Text: ({ asyncDebounceMs = 300, asyncValidate, "data-testid": testId, label, maxLength, multiline, name, ...props }) => {
+		const { form } = useField(name, "string");
+		return /* @__PURE__ */ jsx(form.Field, {
+			asyncDebounceMs,
+			name,
+			validators: asyncValidate ? { onChangeAsync: async ({ value }) => {
+				return await asyncValidate(value ?? "");
+			} } : void 0,
+			children: (f) => {
+				const inv = f.state.meta.isTouched && !f.state.meta.isValid, validating = f.state.meta.isValidating, C = multiline ? Textarea : Input, val = f.state.value ?? "", tid = testId ?? f.name, errorId = `${f.name}-error`;
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex items-center justify-between",
+							children: [label ? /* @__PURE__ */ jsx(FieldLabel, {
+								htmlFor: f.name,
+								children: label
+							}) : null, /* @__PURE__ */ jsxs("div", {
+								className: "flex items-center gap-2",
+								children: [validating ? /* @__PURE__ */ jsxs("div", {
+									className: "flex items-center gap-1 text-xs text-muted-foreground",
+									children: [/* @__PURE__ */ jsx(Spinner, { className: "size-3" }), /* @__PURE__ */ jsx("span", { children: "Validating..." })]
+								}) : null, maxLength ? /* @__PURE__ */ jsxs("span", {
+									className: "text-xs text-muted-foreground",
+									children: [
+										String(val).length,
+										"/",
+										maxLength
+									]
+								}) : null]
+							})]
+						}),
+						/* @__PURE__ */ jsx(C, {
+							"aria-describedby": inv ? errorId : void 0,
+							"aria-invalid": inv,
+							id: f.name,
+							maxLength,
+							name: f.name,
+							onBlur: f.handleBlur,
+							onChange: (e) => f.handleChange(e.target.value),
+							value: val,
+							...props
+						}),
+						inv ? /* @__PURE__ */ jsx(FieldError, {
+							errors: f.state.meta.errors,
+							id: errorId
+						}) : null
+					]
+				});
+			}
+		});
+	},
+	Timepick: ({ "data-testid": testId, label, name, placeholder = "HH:MM" }) => {
+		const { form } = useField(name, "string");
+		return /* @__PURE__ */ jsx(form.Field, {
+			name,
+			children: (f) => {
+				const inv = f.state.meta.isTouched && !f.state.meta.isValid, tid = testId ?? f.name, errorId = `${f.name}-error`;
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [
+						label ? /* @__PURE__ */ jsx(FieldLabel, {
+							htmlFor: f.name,
+							children: label
+						}) : null,
+						/* @__PURE__ */ jsx(Input, {
+							"aria-describedby": inv ? errorId : void 0,
+							"aria-invalid": inv,
+							id: f.name,
+							name: f.name,
+							onBlur: f.handleBlur,
+							onChange: (e) => f.handleChange(e.target.value),
+							placeholder,
+							type: "time",
+							value: f.state.value ?? ""
+						}),
+						inv ? /* @__PURE__ */ jsx(FieldError, {
+							errors: f.state.meta.errors,
+							id: errorId
+						}) : null
+					]
+				});
+			}
+		});
+	},
+	Toggle: ({ "data-testid": testId, falseLabel, name, trueLabel }) => {
+		const { form } = useField(name, "boolean");
+		return /* @__PURE__ */ jsx(form.Field, {
+			name,
+			children: (f) => {
+				const inv = f.state.meta.isTouched && !f.state.meta.isValid, tid = testId ?? f.name, errorId = `${f.name}-error`;
+				return /* @__PURE__ */ jsxs(Field, {
+					"data-invalid": inv,
+					"data-testid": tid,
+					children: [/* @__PURE__ */ jsxs("div", {
+						className: "flex items-center gap-2",
+						children: [/* @__PURE__ */ jsx(Switch, {
+							"aria-describedby": inv ? errorId : void 0,
+							"aria-invalid": inv,
+							checked: f.state.value ?? false,
+							id: f.name,
+							name: f.name,
+							onBlur: f.handleBlur,
+							onCheckedChange: (v) => f.handleChange(v)
+						}), /* @__PURE__ */ jsx(FieldLabel, {
+							htmlFor: f.name,
+							children: f.state.value ? trueLabel : falseLabel ?? trueLabel
+						})]
+					}), inv ? /* @__PURE__ */ jsx(FieldError, {
+						errors: f.state.meta.errors,
+						id: errorId
+					}) : null]
+				});
+			}
+		});
+	}
+};
+
+//#endregion
+//#region src/components/form.tsx
+const ConflictDialog = ({ conflict, onResolve }) => /* @__PURE__ */ jsx(Dialog, {
+	open: Boolean(conflict),
+	children: /* @__PURE__ */ jsxs(DialogContent, {
+		className: "[&>button]:hidden",
+		onEscapeKeyDown: () => onResolve("cancel"),
+		onInteractOutside: () => onResolve("cancel"),
+		children: [
+			/* @__PURE__ */ jsx("h2", {
+				className: "text-lg font-semibold",
+				children: "Conflict Detected"
+			}),
+			/* @__PURE__ */ jsx("p", {
+				className: "text-sm text-muted-foreground",
+				children: "This record was modified by someone else. Choose how to resolve the conflict."
+			}),
+			conflict?.current || conflict?.incoming ? /* @__PURE__ */ jsxs("div", {
+				className: "space-y-3",
+				children: [conflict.current ? /* @__PURE__ */ jsxs("div", {
+					className: "rounded-lg bg-muted p-3",
+					children: [/* @__PURE__ */ jsx("p", {
+						className: "mb-1 text-xs font-medium text-muted-foreground",
+						children: "Server version:"
+					}), /* @__PURE__ */ jsx("pre", {
+						className: "text-xs",
+						children: JSON.stringify(conflict.current, null, 2)
+					})]
+				}) : null, conflict.incoming ? /* @__PURE__ */ jsxs("div", {
+					className: "rounded-lg bg-muted p-3",
+					children: [/* @__PURE__ */ jsx("p", {
+						className: "mb-1 text-xs font-medium text-muted-foreground",
+						children: "Your version:"
+					}), /* @__PURE__ */ jsx("pre", {
+						className: "text-xs",
+						children: JSON.stringify(conflict.incoming, null, 2)
+					})]
+				}) : null]
+			}) : null,
+			/* @__PURE__ */ jsxs("div", {
+				className: "flex justify-end gap-2",
+				children: [
+					/* @__PURE__ */ jsx(Button, {
+						onClick: () => onResolve("cancel"),
+						variant: "outline",
+						children: "Cancel"
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						onClick: () => onResolve("reload"),
+						variant: "outline",
+						children: "Reload"
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						onClick: () => onResolve("overwrite"),
+						variant: "destructive",
+						children: "Overwrite"
+					})
+				]
+			})
+		]
+	})
+});
+const withGuard = (base) => {
+	const dirty = base.isDirty || base.isPending, guard = useNavigationGuard({ enabled: dirty });
+	useEffect(() => {
+		if (!dirty) return;
+		const h = (e) => {
+			e.preventDefault();
+			e.returnValue = "";
+		};
+		window.addEventListener("beforeunload", h);
+		return () => window.removeEventListener("beforeunload", h);
+	}, [dirty]);
+	return {
+		...base,
+		guard
+	};
+}, useForm = (opts) => withGuard(useForm$1(opts)), useFormMutation = (opts) => withGuard(useFormMutation$1(opts)), Form = ({ className, form: { conflict, error, guard, instance, meta, resolveConflict, schema }, render, showError = true }) => /* @__PURE__ */ jsxs(FormContext, {
+	value: {
+		form: instance,
+		meta,
+		schema
+	},
+	children: [
+		/* @__PURE__ */ jsxs("form", {
+			className,
+			onSubmit: (e) => {
+				e.preventDefault();
+				instance.handleSubmit();
+			},
+			children: [showError && error ? /* @__PURE__ */ jsx("p", {
+				className: "mb-4 rounded-lg bg-destructive/10 p-3 text-sm text-destructive",
+				role: "alert",
+				children: error.message
+			}) : null, render(fields)]
+		}),
+		/* @__PURE__ */ jsx(ConflictDialog, {
+			conflict,
+			onResolve: resolveConflict
+		}),
+		/* @__PURE__ */ jsx(Dialog, {
+			open: guard.active,
+			children: /* @__PURE__ */ jsxs(DialogContent, {
+				className: "[&>button]:hidden",
+				onEscapeKeyDown: guard.reject,
+				onInteractOutside: guard.reject,
+				children: [/* @__PURE__ */ jsx("p", { children: "You have unsaved changes. Are you sure you want to leave?" }), /* @__PURE__ */ jsxs("div", {
+					className: "flex justify-end gap-2",
+					children: [/* @__PURE__ */ jsx(Button, {
+						onClick: guard.reject,
+						variant: "outline",
+						children: "Cancel"
+					}), /* @__PURE__ */ jsx(Button, {
+						onClick: guard.accept,
+						variant: "destructive",
+						children: "Discard"
+					})]
+				})]
+			})
+		})
+	]
+}), AutoSaveIndicator = ({ lastSaved }) => {
+	const [, forceUpdate] = useState(0);
+	useEffect(() => {
+		if (!lastSaved) return;
+		const id = setInterval(() => forceUpdate((n) => n + 1), 1e4);
+		return () => clearInterval(id);
+	}, [lastSaved]);
+	if (!lastSaved) return null;
+	const ago = Math.round((Date.now() - lastSaved) / 1e3);
+	return /* @__PURE__ */ jsx("span", {
+		className: "text-xs text-muted-foreground",
+		children: ago < 5 ? "Saved" : `Saved ${ago}s ago`
+	});
+};
+
+//#endregion
+//#region src/components/offline-indicator.tsx
+const OfflineIndicator = () => {
+	if (useOnlineStatus()) return null;
+	return /* @__PURE__ */ jsx("div", {
+		className: "fixed bottom-4 left-4 z-50 rounded-md bg-destructive px-4 py-2 text-sm font-medium text-destructive-foreground shadow-lg",
+		children: "You are offline"
+	});
+};
+
+//#endregion
+//#region src/components/org-avatar.tsx
+const sizes = {
+	lg: "size-12",
+	md: "size-8",
+	sm: "size-6"
+}, OrgAvatar = ({ avatarUrl, name, size = "md" }) => /* @__PURE__ */ jsxs(Avatar, {
+	className: sizes[size],
+	children: [avatarUrl ? /* @__PURE__ */ jsx(AvatarImage, { src: avatarUrl }) : null, /* @__PURE__ */ jsx(AvatarFallback, { children: name.slice(0, 2).toUpperCase() })]
+});
+
+//#endregion
+//#region src/components/permission-guard.tsx
+const PermissionGuard = ({ backHref, backLabel, canAccess, children, resource }) => {
+	if (!canAccess) return /* @__PURE__ */ jsxs("div", {
+		className: "flex flex-col items-center gap-4 py-12",
+		children: [
+			/* @__PURE__ */ jsx(Badge, {
+				variant: "secondary",
+				children: "View only"
+			}),
+			/* @__PURE__ */ jsxs("p", {
+				className: "text-muted-foreground",
+				children: [
+					"You don't have edit permission for this ",
+					resource,
+					"."
+				]
+			}),
+			/* @__PURE__ */ jsx(Button, {
+				asChild: true,
+				variant: "outline",
+				children: /* @__PURE__ */ jsxs(Link, {
+					href: backHref,
+					children: ["Back to ", backLabel]
+				})
+			})
+		]
+	});
+	return children;
+};
+
+//#endregion
+//#region src/components/role-badge.tsx
+const variants = {
+	admin: "secondary",
+	member: "outline",
+	owner: "default"
+}, RoleBadge = ({ role }) => /* @__PURE__ */ jsx(Badge, {
+	variant: variants[role],
+	children: role
+});
+
+//#endregion
+//#region src/components/suspense-wrap.tsx
+var suspense_wrap_default = (f) => () => /* @__PURE__ */ jsx(Suspense, {
+	fallback: "",
+	children: f()
+});
+
+//#endregion
+export { AutoSaveIndicator, ConflictDialog, EditorsSection, FileApiContext, FileApiProvider, FileFieldImpl, Form, FormContext, OfflineIndicator, OrgAvatar, PermissionGuard, RoleBadge, fields, suspense_wrap_default as suspenseWrap, useForm, useFormMutation };