@lattice-php/lattice 0.1.0 → 0.3.0

package/dist/effects/use-flash-effects.js

@@ -0,0 +1,22 @@
+import { getActionEffects } from "./dispatch.js";
+import { useEffectDispatcher } from "./use-effect-dispatcher.js";
+import { useEffect } from "react";
+import { router } from "@inertiajs/react";
+//#region resources/js/effects/use-flash-effects.ts
+/**
+* Drains the `latticeEffects` flash bag (server `Effects::flash(...)`) on each
+* Inertia navigation and runs the effects through the registry dispatcher.
+*/
+function useFlashEffects() {
+	const dispatch = useEffectDispatcher();
+	useEffect(() => {
+		return router.on("flash", (event) => {
+			const effects = getActionEffects(event.detail?.flash?.latticeEffects);
+			if (effects.length > 0) dispatch(effects);
+		});
+	}, [dispatch]);
+}
+//#endregion
+export { useFlashEffects };
+
+//# sourceMappingURL=use-flash-effects.js.map

package/dist/effects/use-flash-effects.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-flash-effects.js","names":[],"sources":["../../resources/js/effects/use-flash-effects.ts"],"sourcesContent":["import { router } from \"@inertiajs/react\";\nimport { useEffect } from \"react\";\nimport { getActionEffects } from \"@lattice-php/lattice/effects/dispatch\";\nimport { useEffectDispatcher } from \"@lattice-php/lattice/effects/use-effect-dispatcher\";\n\ntype InertiaFlashEvent = CustomEvent<{\n  flash?: {\n    latticeEffects?: unknown;\n  };\n}>;\n\n/**\n * Drains the `latticeEffects` flash bag (server `Effects::flash(...)`) on each\n * Inertia navigation and runs the effects through the registry dispatcher.\n */\nexport function useFlashEffects(): void {\n  const dispatch = useEffectDispatcher();\n\n  useEffect(() => {\n    return router.on(\"flash\", (event) => {\n      const effects = getActionEffects((event as InertiaFlashEvent).detail?.flash?.latticeEffects);\n\n      if (effects.length > 0) {\n        dispatch(effects);\n      }\n    });\n  }, [dispatch]);\n}\n"],"mappings":";;;;;;;;;AAeA,SAAgB,kBAAwB;CACtC,MAAM,WAAW,oBAAoB;CAErC,gBAAgB;EACd,OAAO,OAAO,GAAG,UAAU,UAAU;GACnC,MAAM,UAAU,iBAAkB,MAA4B,QAAQ,OAAO,cAAc;GAE3F,IAAI,QAAQ,SAAS,GACnB,SAAS,OAAO;EAEpB,CAAC;CACH,GAAG,CAAC,QAAQ,CAAC;AACf"}

package/dist/events/event-bridge.d.ts

@@ -1,14 +1,10 @@
-export declare const toastVariants: readonly ["success", "info", "warning", "error"];
+import { ToastMessage } from '../toast/toast';
 export declare const appearances: readonly ["light", "dark", "system"];
-export type ToastVariant = (typeof toastVariants)[number];
 export type Appearance = (typeof appearances)[number];
-export type ToastMessage = {
-    message: string;
-    variant: ToastVariant;
-};
 type EventBridgeProps = {
     onAppearanceChange?: (appearance: Appearance) => void;
+    onLocaleChange?: (locale: string) => void;
     onToast?: (toast: ToastMessage) => void;
 };
-export declare function EventBridge({ onAppearanceChange, onToast }: EventBridgeProps): null;
+export declare function EventBridge({ onAppearanceChange, onLocaleChange, onToast }: EventBridgeProps): null;
 export {};

package/dist/events/event-bridge.js

@@ -1,61 +1,20 @@
 import { LATTICE_EVENT } from "./event-names.js";
+import { onToast } from "../toast/toast.js";
 import { useEffect } from "react";
-import { router } from "@inertiajs/react";
 //#region resources/js/events/event-bridge.tsx
-var toastVariants = [
-	"success",
-	"info",
-	"warning",
-	"error"
-];
 var appearances = [
 	"light",
 	"dark",
 	"system"
 ];
-function isToastVariant(value) {
-	return toastVariants.some((variant) => variant === value);
-}
 function isAppearance(value) {
 	return appearances.some((appearance) => appearance === value);
 }
-function normalizeFlashToast(value) {
-	if (typeof value !== "object" || value === null) return null;
-	const candidate = value;
-	if (typeof candidate.message !== "string" || !isToastVariant(candidate.variant)) return null;
-	return {
-		message: candidate.message,
-		variant: candidate.variant
-	};
-}
-function normalizeLatticeToast(event) {
-	const detail = event.detail;
-	const message = detail?.message;
-	if (typeof message !== "string" || message === "") return null;
-	return {
-		message,
-		variant: isToastVariant(detail.variant) ? detail.variant : "success"
-	};
-}
-function EventBridge({ onAppearanceChange, onToast }) {
+function EventBridge({ onAppearanceChange, onLocaleChange, onToast: onToast$1 }) {
 	useEffect(() => {
-		if (!onToast) return;
-		return router.on("flash", (event) => {
-			const toast = normalizeFlashToast(event.detail?.flash?.toast);
-			if (toast) onToast(toast);
-		});
-	}, [onToast]);
-	useEffect(() => {
-		if (!onToast) return;
-		const listener = (event) => {
-			const toast = normalizeLatticeToast(event);
-			if (toast) onToast(toast);
-		};
-		window.addEventListener(LATTICE_EVENT.toast, listener);
-		return () => {
-			window.removeEventListener(LATTICE_EVENT.toast, listener);
-		};
-	}, [onToast]);
+		if (!onToast$1) return;
+		return onToast(onToast$1);
+	}, [onToast$1]);
 	useEffect(() => {
 		if (!onAppearanceChange) return;
 		const listener = (event) => {
@@ -67,9 +26,20 @@ function EventBridge({ onAppearanceChange, onToast }) {
 			window.removeEventListener(LATTICE_EVENT.appearanceChange, listener);
 		};
 	}, [onAppearanceChange]);
+	useEffect(() => {
+		if (!onLocaleChange) return;
+		const listener = (event) => {
+			const locale = event.detail?.locale;
+			if (typeof locale === "string" && locale !== "") onLocaleChange(locale);
+		};
+		window.addEventListener(LATTICE_EVENT.localeChange, listener);
+		return () => {
+			window.removeEventListener(LATTICE_EVENT.localeChange, listener);
+		};
+	}, [onLocaleChange]);
 	return null;
 }
 //#endregion
-export { EventBridge, appearances, toastVariants };
+export { EventBridge, appearances };
 
 //# sourceMappingURL=event-bridge.js.map

package/dist/events/event-bridge.js.map

@@ -1 +1 @@
-{"version":3,"file":"event-bridge.js","names":[],"sources":["../../resources/js/events/event-bridge.tsx"],"sourcesContent":["import { router } from \"@inertiajs/react\";\nimport { useEffect } from \"react\";\nimport { LATTICE_EVENT } from \"./event-names\";\n\nexport const toastVariants = [\"success\", \"info\", \"warning\", \"error\"] as const;\nexport const appearances = [\"light\", \"dark\", \"system\"] as const;\n\nexport type ToastVariant = (typeof toastVariants)[number];\nexport type Appearance = (typeof appearances)[number];\n\nexport type ToastMessage = {\n  message: string;\n  variant: ToastVariant;\n};\n\ntype EventBridgeProps = {\n  onAppearanceChange?: (appearance: Appearance) => void;\n  onToast?: (toast: ToastMessage) => void;\n};\n\ntype ToastEvent = CustomEvent<{\n  message?: unknown;\n  variant?: unknown;\n}>;\n\ntype AppearanceEvent = CustomEvent<{\n  value?: unknown;\n}>;\n\ntype InertiaFlashEvent = CustomEvent<{\n  flash?: {\n    toast?: unknown;\n  };\n}>;\n\nfunction isToastVariant(value: unknown): value is ToastVariant {\n  return toastVariants.some((variant) => variant === value);\n}\n\nfunction isAppearance(value: unknown): value is Appearance {\n  return appearances.some((appearance) => appearance === value);\n}\n\nfunction normalizeFlashToast(value: unknown): ToastMessage | null {\n  if (typeof value !== \"object\" || value === null) {\n    return null;\n  }\n\n  const candidate = value as Partial<ToastMessage>;\n\n  if (typeof candidate.message !== \"string\" || !isToastVariant(candidate.variant)) {\n    return null;\n  }\n\n  return {\n    message: candidate.message,\n    variant: candidate.variant,\n  };\n}\n\nfunction normalizeLatticeToast(event: Event): ToastMessage | null {\n  const detail = (event as ToastEvent).detail;\n  const message = detail?.message;\n\n  if (typeof message !== \"string\" || message === \"\") {\n    return null;\n  }\n\n  return {\n    message,\n    variant: isToastVariant(detail.variant) ? detail.variant : \"success\",\n  };\n}\n\nexport function EventBridge({ onAppearanceChange, onToast }: EventBridgeProps) {\n  useEffect(() => {\n    if (!onToast) {\n      return;\n    }\n\n    return router.on(\"flash\", (event) => {\n      const toast = normalizeFlashToast((event as InertiaFlashEvent).detail?.flash?.toast);\n\n      if (toast) {\n        onToast(toast);\n      }\n    });\n  }, [onToast]);\n\n  useEffect(() => {\n    if (!onToast) {\n      return;\n    }\n\n    const listener = (event: Event): void => {\n      const toast = normalizeLatticeToast(event);\n\n      if (toast) {\n        onToast(toast);\n      }\n    };\n\n    window.addEventListener(LATTICE_EVENT.toast, listener);\n\n    return () => {\n      window.removeEventListener(LATTICE_EVENT.toast, listener);\n    };\n  }, [onToast]);\n\n  useEffect(() => {\n    if (!onAppearanceChange) {\n      return;\n    }\n\n    const listener = (event: Event): void => {\n      const value = (event as AppearanceEvent).detail?.value;\n\n      if (isAppearance(value)) {\n        onAppearanceChange(value);\n      }\n    };\n\n    window.addEventListener(LATTICE_EVENT.appearanceChange, listener);\n\n    return () => {\n      window.removeEventListener(LATTICE_EVENT.appearanceChange, listener);\n    };\n  }, [onAppearanceChange]);\n\n  return null;\n}\n"],"mappings":";;;;AAIA,IAAa,gBAAgB;CAAC;CAAW;CAAQ;CAAW;AAAO;AACnE,IAAa,cAAc;CAAC;CAAS;CAAQ;AAAQ;AA8BrD,SAAS,eAAe,OAAuC;CAC7D,OAAO,cAAc,MAAM,YAAY,YAAY,KAAK;AAC1D;AAEA,SAAS,aAAa,OAAqC;CACzD,OAAO,YAAY,MAAM,eAAe,eAAe,KAAK;AAC9D;AAEA,SAAS,oBAAoB,OAAqC;CAChE,IAAI,OAAO,UAAU,YAAY,UAAU,MACzC,OAAO;CAGT,MAAM,YAAY;CAElB,IAAI,OAAO,UAAU,YAAY,YAAY,CAAC,eAAe,UAAU,OAAO,GAC5E,OAAO;CAGT,OAAO;EACL,SAAS,UAAU;EACnB,SAAS,UAAU;CACrB;AACF;AAEA,SAAS,sBAAsB,OAAmC;CAChE,MAAM,SAAU,MAAqB;CACrC,MAAM,UAAU,QAAQ;CAExB,IAAI,OAAO,YAAY,YAAY,YAAY,IAC7C,OAAO;CAGT,OAAO;EACL;EACA,SAAS,eAAe,OAAO,OAAO,IAAI,OAAO,UAAU;CAC7D;AACF;AAEA,SAAgB,YAAY,EAAE,oBAAoB,WAA6B;CAC7E,gBAAgB;EACd,IAAI,CAAC,SACH;EAGF,OAAO,OAAO,GAAG,UAAU,UAAU;GACnC,MAAM,QAAQ,oBAAqB,MAA4B,QAAQ,OAAO,KAAK;GAEnF,IAAI,OACF,QAAQ,KAAK;EAEjB,CAAC;CACH,GAAG,CAAC,OAAO,CAAC;CAEZ,gBAAgB;EACd,IAAI,CAAC,SACH;EAGF,MAAM,YAAY,UAAuB;GACvC,MAAM,QAAQ,sBAAsB,KAAK;GAEzC,IAAI,OACF,QAAQ,KAAK;EAEjB;EAEA,OAAO,iBAAiB,cAAc,OAAO,QAAQ;EAErD,aAAa;GACX,OAAO,oBAAoB,cAAc,OAAO,QAAQ;EAC1D;CACF,GAAG,CAAC,OAAO,CAAC;CAEZ,gBAAgB;EACd,IAAI,CAAC,oBACH;EAGF,MAAM,YAAY,UAAuB;GACvC,MAAM,QAAS,MAA0B,QAAQ;GAEjD,IAAI,aAAa,KAAK,GACpB,mBAAmB,KAAK;EAE5B;EAEA,OAAO,iBAAiB,cAAc,kBAAkB,QAAQ;EAEhE,aAAa;GACX,OAAO,oBAAoB,cAAc,kBAAkB,QAAQ;EACrE;CACF,GAAG,CAAC,kBAAkB,CAAC;CAEvB,OAAO;AACT"}
+{"version":3,"file":"event-bridge.js","names":[],"sources":["../../resources/js/events/event-bridge.tsx"],"sourcesContent":["import { useEffect } from \"react\";\nimport { onToast as subscribeToToasts } from \"@lattice-php/lattice/toast/toast\";\nimport type { ToastMessage } from \"@lattice-php/lattice/toast/toast\";\nimport { LATTICE_EVENT } from \"./event-names\";\n\nexport const appearances = [\"light\", \"dark\", \"system\"] as const;\n\nexport type Appearance = (typeof appearances)[number];\n\ntype EventBridgeProps = {\n  onAppearanceChange?: (appearance: Appearance) => void;\n  onLocaleChange?: (locale: string) => void;\n  onToast?: (toast: ToastMessage) => void;\n};\n\ntype AppearanceEvent = CustomEvent<{\n  value?: unknown;\n}>;\n\ntype LocaleEvent = CustomEvent<{\n  locale?: unknown;\n}>;\n\nfunction isAppearance(value: unknown): value is Appearance {\n  return appearances.some((appearance) => appearance === value);\n}\n\nexport function EventBridge({ onAppearanceChange, onLocaleChange, onToast }: EventBridgeProps) {\n  useEffect(() => {\n    if (!onToast) {\n      return;\n    }\n\n    return subscribeToToasts(onToast);\n  }, [onToast]);\n\n  useEffect(() => {\n    if (!onAppearanceChange) {\n      return;\n    }\n\n    const listener = (event: Event): void => {\n      const value = (event as AppearanceEvent).detail?.value;\n\n      if (isAppearance(value)) {\n        onAppearanceChange(value);\n      }\n    };\n\n    window.addEventListener(LATTICE_EVENT.appearanceChange, listener);\n\n    return () => {\n      window.removeEventListener(LATTICE_EVENT.appearanceChange, listener);\n    };\n  }, [onAppearanceChange]);\n\n  useEffect(() => {\n    if (!onLocaleChange) {\n      return;\n    }\n\n    const listener = (event: Event): void => {\n      const locale = (event as LocaleEvent).detail?.locale;\n\n      if (typeof locale === \"string\" && locale !== \"\") {\n        onLocaleChange(locale);\n      }\n    };\n\n    window.addEventListener(LATTICE_EVENT.localeChange, listener);\n\n    return () => {\n      window.removeEventListener(LATTICE_EVENT.localeChange, listener);\n    };\n  }, [onLocaleChange]);\n\n  return null;\n}\n"],"mappings":";;;;AAKA,IAAa,cAAc;CAAC;CAAS;CAAQ;AAAQ;AAkBrD,SAAS,aAAa,OAAqC;CACzD,OAAO,YAAY,MAAM,eAAe,eAAe,KAAK;AAC9D;AAEA,SAAgB,YAAY,EAAE,oBAAoB,gBAAgB,SAAA,aAA6B;CAC7F,gBAAgB;EACd,IAAI,CAAC,WACH;EAGF,OAAO,QAAkB,SAAO;CAClC,GAAG,CAAC,SAAO,CAAC;CAEZ,gBAAgB;EACd,IAAI,CAAC,oBACH;EAGF,MAAM,YAAY,UAAuB;GACvC,MAAM,QAAS,MAA0B,QAAQ;GAEjD,IAAI,aAAa,KAAK,GACpB,mBAAmB,KAAK;EAE5B;EAEA,OAAO,iBAAiB,cAAc,kBAAkB,QAAQ;EAEhE,aAAa;GACX,OAAO,oBAAoB,cAAc,kBAAkB,QAAQ;EACrE;CACF,GAAG,CAAC,kBAAkB,CAAC;CAEvB,gBAAgB;EACd,IAAI,CAAC,gBACH;EAGF,MAAM,YAAY,UAAuB;GACvC,MAAM,SAAU,MAAsB,QAAQ;GAE9C,IAAI,OAAO,WAAW,YAAY,WAAW,IAC3C,eAAe,MAAM;EAEzB;EAEA,OAAO,iBAAiB,cAAc,cAAc,QAAQ;EAE5D,aAAa;GACX,OAAO,oBAAoB,cAAc,cAAc,QAAQ;EACjE;CACF,GAAG,CAAC,cAAc,CAAC;CAEnB,OAAO;AACT"}

package/dist/events/event-names.d.ts

@@ -1,9 +1,10 @@
 /**
  * Single source of truth for the `lattice:*` DOM events the runtime dispatches
  * and listens for. Effect-driven events are mapped from the generated EffectType
- * in action/effects.ts; the rest are framework events with no PHP counterpart.
+ * in effects/registry.ts; the rest are framework events with no PHP counterpart.
  */
 export declare const LATTICE_EVENT: {
+    readonly callout: "lattice:callout";
     readonly toast: "lattice:toast";
     readonly reloadComponent: "lattice:reload-component";
     readonly reloadPage: "lattice:reload-page";
@@ -13,6 +14,7 @@ export declare const LATTICE_EVENT: {
     readonly closeModal: "lattice:close-modal";
     readonly resetForm: "lattice:reset-form";
     readonly appearanceChange: "lattice:appearance-change";
+    readonly localeChange: "lattice:locale-change";
     readonly actionError: "lattice:action-error";
 };
 export type ReloadComponentEvent = CustomEvent<{

package/dist/events/event-names.js

@@ -2,9 +2,10 @@
 /**
 * Single source of truth for the `lattice:*` DOM events the runtime dispatches
 * and listens for. Effect-driven events are mapped from the generated EffectType
-* in action/effects.ts; the rest are framework events with no PHP counterpart.
+* in effects/registry.ts; the rest are framework events with no PHP counterpart.
 */
 var LATTICE_EVENT = {
+	callout: "lattice:callout",
 	toast: "lattice:toast",
 	reloadComponent: "lattice:reload-component",
 	reloadPage: "lattice:reload-page",
@@ -14,6 +15,7 @@ var LATTICE_EVENT = {
 	closeModal: "lattice:close-modal",
 	resetForm: "lattice:reset-form",
 	appearanceChange: "lattice:appearance-change",
+	localeChange: "lattice:locale-change",
 	actionError: "lattice:action-error"
 };
 //#endregion

package/dist/events/event-names.js.map

@@ -1 +1 @@
-{"version":3,"file":"event-names.js","names":[],"sources":["../../resources/js/events/event-names.ts"],"sourcesContent":["/**\n * Single source of truth for the `lattice:*` DOM events the runtime dispatches\n * and listens for. Effect-driven events are mapped from the generated EffectType\n * in action/effects.ts; the rest are framework events with no PHP counterpart.\n */\nexport const LATTICE_EVENT = {\n  toast: \"lattice:toast\",\n  reloadComponent: \"lattice:reload-component\",\n  reloadPage: \"lattice:reload-page\",\n  redirect: \"lattice:redirect\",\n  download: \"lattice:download\",\n  openModal: \"lattice:open-modal\",\n  closeModal: \"lattice:close-modal\",\n  resetForm: \"lattice:reset-form\",\n  appearanceChange: \"lattice:appearance-change\",\n  actionError: \"lattice:action-error\",\n} as const;\n\nexport type ReloadComponentEvent = CustomEvent<{\n  component?: string;\n  type?: string;\n}>;\n"],"mappings":";;;;;;AAKA,IAAa,gBAAgB;CAC3B,OAAO;CACP,iBAAiB;CACjB,YAAY;CACZ,UAAU;CACV,UAAU;CACV,WAAW;CACX,YAAY;CACZ,WAAW;CACX,kBAAkB;CAClB,aAAa;AACf"}
+{"version":3,"file":"event-names.js","names":[],"sources":["../../resources/js/events/event-names.ts"],"sourcesContent":["/**\n * Single source of truth for the `lattice:*` DOM events the runtime dispatches\n * and listens for. Effect-driven events are mapped from the generated EffectType\n * in effects/registry.ts; the rest are framework events with no PHP counterpart.\n */\nexport const LATTICE_EVENT = {\n  callout: \"lattice:callout\",\n  toast: \"lattice:toast\",\n  reloadComponent: \"lattice:reload-component\",\n  reloadPage: \"lattice:reload-page\",\n  redirect: \"lattice:redirect\",\n  download: \"lattice:download\",\n  openModal: \"lattice:open-modal\",\n  closeModal: \"lattice:close-modal\",\n  resetForm: \"lattice:reset-form\",\n  appearanceChange: \"lattice:appearance-change\",\n  localeChange: \"lattice:locale-change\",\n  actionError: \"lattice:action-error\",\n} as const;\n\nexport type ReloadComponentEvent = CustomEvent<{\n  component?: string;\n  type?: string;\n}>;\n"],"mappings":";;;;;;AAKA,IAAa,gBAAgB;CAC3B,SAAS;CACT,OAAO;CACP,iBAAiB;CACjB,YAAY;CACZ,UAAU;CACV,UAAU;CACV,WAAW;CACX,YAAY;CACZ,WAAW;CACX,kBAAkB;CAClB,cAAc;CACd,aAAa;AACf"}

package/dist/form/components/base/field.d.ts

@@ -1,9 +1,11 @@
 import { FormLabelAction } from '../types';
-export declare function FormFieldFrame({ children, error, label, labelAction, name, required, }: {
+export declare function FormFieldFrame({ children, error, helperText, label, labelAction, name, required, tooltip, }: {
     children: React.ReactNode;
     error?: string;
+    helperText?: string;
     label: string;
     labelAction?: FormLabelAction;
     name: string;
     required?: boolean;
+    tooltip?: string;
 }): import("react").JSX.Element;

package/dist/form/components/base/field.js

@@ -1,9 +1,23 @@
 import { TextLink } from "../../../core/components/link.js";
-import { Label } from "./label.js";
+import { InfoTooltip } from "../../../core/components/info-tooltip.js";
 import InputError from "./input-error.js";
+import { Label } from "./label.js";
+import { useInTableCell } from "../row-layout-context.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region resources/js/form/components/base/field.tsx
-function FormFieldFrame({ children, error, label, labelAction, name, required }) {
+function FormFieldFrame({ children, error, helperText, label, labelAction, name, required, tooltip }) {
+	if (useInTableCell()) return /* @__PURE__ */ jsxs("div", {
+		className: "grid gap-1",
+		children: [
+			/* @__PURE__ */ jsx(Label, {
+				htmlFor: name,
+				className: "sr-only",
+				children: label
+			}),
+			children,
+			/* @__PURE__ */ jsx(InputError, { message: error })
+		]
+	});
 	return /* @__PURE__ */ jsxs("div", {
 		className: "grid gap-2",
 		children: [
@@ -19,6 +33,7 @@ function FormFieldFrame({ children, error, label, labelAction, name, required })
 						className: "ml-0.5 text-lt-danger",
 						children: "*"
 					}),
+					/* @__PURE__ */ jsx(InfoTooltip, { content: tooltip }),
 					labelAction && /* @__PURE__ */ jsx(TextLink, {
 						href: labelAction.href,
 						tabIndex: labelAction.tabIndex,
@@ -28,6 +43,10 @@ function FormFieldFrame({ children, error, label, labelAction, name, required })
 				]
 			}),
 			children,
+			helperText && /* @__PURE__ */ jsx("p", {
+				className: "text-sm text-lt-muted-fg",
+				children: helperText
+			}),
 			/* @__PURE__ */ jsx(InputError, { message: error })
 		]
 	});

package/dist/form/components/base/field.js.map

@@ -1 +1 @@
-{"version":3,"file":"field.js","names":[],"sources":["../../../../resources/js/form/components/base/field.tsx"],"sourcesContent":["import InputError from \"@lattice/lattice/form/components/base/input-error\";\nimport { TextLink } from \"@lattice/lattice/core/components/link\";\nimport { Label } from \"@lattice/lattice/form/components/base/label\";\nimport type { FormLabelAction } from \"../types\";\n\nexport function FormFieldFrame({\n  children,\n  error,\n  label,\n  labelAction,\n  name,\n  required,\n}: {\n  children: React.ReactNode;\n  error?: string;\n  label: string;\n  labelAction?: FormLabelAction;\n  name: string;\n  required?: boolean;\n}) {\n  return (\n    <div className=\"grid gap-2\">\n      <div className=\"flex min-h-5 items-center\">\n        <Label htmlFor={name}>{label}</Label>\n        {required && (\n          <span aria-hidden=\"true\" className=\"ml-0.5 text-lt-danger\">\n            *\n          </span>\n        )}\n        {labelAction && (\n          <TextLink\n            href={labelAction.href}\n            tabIndex={labelAction.tabIndex}\n            className=\"ml-auto text-sm\"\n          >\n            {labelAction.label}\n          </TextLink>\n        )}\n      </div>\n\n      {children}\n\n      <InputError message={error} />\n    </div>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,eAAe,EAC7B,UACA,OACA,OACA,aACA,MACA,YAQC;CACD,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GACE,qBAAC,OAAD;IAAK,WAAU;cAAf;KACE,oBAAC,OAAD;MAAO,SAAS;gBAAO;KAAa,CAAA;KACnC,YACC,oBAAC,QAAD;MAAM,eAAY;MAAO,WAAU;gBAAwB;KAErD,CAAA;KAEP,eACC,oBAAC,UAAD;MACE,MAAM,YAAY;MAClB,UAAU,YAAY;MACtB,WAAU;gBAET,YAAY;KACL,CAAA;IAET;;GAEJ;GAED,oBAAC,YAAD,EAAY,SAAS,MAAQ,CAAA;EAC1B;;AAET"}
+{"version":3,"file":"field.js","names":[],"sources":["../../../../resources/js/form/components/base/field.tsx"],"sourcesContent":["import InputError from \"@lattice-php/lattice/form/components/base/input-error\";\nimport { InfoTooltip } from \"@lattice-php/lattice/core/components/info-tooltip\";\nimport { TextLink } from \"@lattice-php/lattice/core/components/link\";\nimport { Label } from \"@lattice-php/lattice/form/components/base/label\";\nimport { useInTableCell } from \"../row-layout-context\";\nimport type { FormLabelAction } from \"../types\";\n\nexport function FormFieldFrame({\n  children,\n  error,\n  helperText,\n  label,\n  labelAction,\n  name,\n  required,\n  tooltip,\n}: {\n  children: React.ReactNode;\n  error?: string;\n  helperText?: string;\n  label: string;\n  labelAction?: FormLabelAction;\n  name: string;\n  required?: boolean;\n  tooltip?: string;\n}) {\n  const bare = useInTableCell();\n\n  if (bare) {\n    return (\n      <div className=\"grid gap-1\">\n        <Label htmlFor={name} className=\"sr-only\">\n          {label}\n        </Label>\n        {children}\n        <InputError message={error} />\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"grid gap-2\">\n      <div className=\"flex min-h-5 items-center\">\n        <Label htmlFor={name}>{label}</Label>\n        {required && (\n          <span aria-hidden=\"true\" className=\"ml-0.5 text-lt-danger\">\n            *\n          </span>\n        )}\n        <InfoTooltip content={tooltip} />\n        {labelAction && (\n          <TextLink\n            href={labelAction.href}\n            tabIndex={labelAction.tabIndex}\n            className=\"ml-auto text-sm\"\n          >\n            {labelAction.label}\n          </TextLink>\n        )}\n      </div>\n\n      {children}\n\n      {helperText && <p className=\"text-sm text-lt-muted-fg\">{helperText}</p>}\n\n      <InputError message={error} />\n    </div>\n  );\n}\n"],"mappings":";;;;;;;AAOA,SAAgB,eAAe,EAC7B,UACA,OACA,YACA,OACA,aACA,MACA,UACA,WAUC;CAGD,IAFa,eAET,GACF,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GACE,oBAAC,OAAD;IAAO,SAAS;IAAM,WAAU;cAC7B;GACI,CAAA;GACN;GACD,oBAAC,YAAD,EAAY,SAAS,MAAQ,CAAA;EAC1B;;CAIT,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf;GACE,qBAAC,OAAD;IAAK,WAAU;cAAf;KACE,oBAAC,OAAD;MAAO,SAAS;gBAAO;KAAa,CAAA;KACnC,YACC,oBAAC,QAAD;MAAM,eAAY;MAAO,WAAU;gBAAwB;KAErD,CAAA;KAER,oBAAC,aAAD,EAAa,SAAS,QAAU,CAAA;KAC/B,eACC,oBAAC,UAAD;MACE,MAAM,YAAY;MAClB,UAAU,YAAY;MACtB,WAAU;gBAET,YAAY;KACL,CAAA;IAET;;GAEJ;GAEA,cAAc,oBAAC,KAAD;IAAG,WAAU;cAA4B;GAAc,CAAA;GAEtE,oBAAC,YAAD,EAAY,SAAS,MAAQ,CAAA;EAC1B;;AAET"}

package/dist/form/components/base/input-error.js

@@ -4,7 +4,7 @@ import { jsx } from "react/jsx-runtime";
 function InputError({ message, className = "", ...props }) {
 	return message ? /* @__PURE__ */ jsx("p", {
 		...props,
-		className: cn("text-sm text-red-600 dark:text-red-400", className),
+		className: cn("text-sm text-lt-danger", className),
 		children: message
 	}) : null;
 }

package/dist/form/components/base/input-error.js.map

@@ -1 +1 @@
-{"version":3,"file":"input-error.js","names":[],"sources":["../../../../resources/js/form/components/base/input-error.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport { cn } from \"@lattice/lattice/lib/utils\";\n\nexport default function InputError({\n  message,\n  className = \"\",\n  ...props\n}: HTMLAttributes<HTMLParagraphElement> & { message?: string }) {\n  return message ? (\n    <p {...props} className={cn(\"text-sm text-red-600 dark:text-red-400\", className)}>\n      {message}\n    </p>\n  ) : null;\n}\n"],"mappings":";;;AAGA,SAAwB,WAAW,EACjC,SACA,YAAY,IACZ,GAAG,SAC2D;CAC9D,OAAO,UACL,oBAAC,KAAD;EAAG,GAAI;EAAO,WAAW,GAAG,0CAA0C,SAAS;YAC5E;CACA,CAAA,IACD;AACN"}
+{"version":3,"file":"input-error.js","names":[],"sources":["../../../../resources/js/form/components/base/input-error.tsx"],"sourcesContent":["import type { HTMLAttributes } from \"react\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\n\nexport default function InputError({\n  message,\n  className = \"\",\n  ...props\n}: HTMLAttributes<HTMLParagraphElement> & { message?: string }) {\n  return message ? (\n    <p {...props} className={cn(\"text-sm text-lt-danger\", className)}>\n      {message}\n    </p>\n  ) : null;\n}\n"],"mappings":";;;AAGA,SAAwB,WAAW,EACjC,SACA,YAAY,IACZ,GAAG,SAC2D;CAC9D,OAAO,UACL,oBAAC,KAAD;EAAG,GAAI;EAAO,WAAW,GAAG,0BAA0B,SAAS;YAC5D;CACA,CAAA,IACD;AACN"}

package/dist/form/components/base/input.js

@@ -1,4 +1,5 @@
 import { cn } from "../../../lib/utils.js";
+import { controlSurface } from "../../../core/components/control.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 //#region resources/js/form/components/base/input.tsx
@@ -6,7 +7,7 @@ function Input({ className, type, ...props }) {
 	return /* @__PURE__ */ jsx("input", {
 		type,
 		"data-slot": "input",
-		className: cn("border-lt-input file:text-lt-fg placeholder:text-lt-muted-fg selection:bg-lt-primary selection:text-lt-primary-fg flex h-9 w-full min-w-0 rounded-lt-sm border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-lt-ring focus-visible:ring-lt-ring/50 focus-visible:ring-[3px]", "aria-invalid:ring-lt-danger/20 dark:aria-invalid:ring-lt-danger/40 aria-invalid:border-lt-danger", className),
+		className: cn(controlSurface(), "file:text-lt-fg selection:bg-lt-primary selection:text-lt-primary-fg file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium", className),
 		...props
 	});
 }

package/dist/form/components/base/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.js","names":[],"sources":["../../../../resources/js/form/components/base/input.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"@lattice/lattice/lib/utils\";\n\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\n  return (\n    <input\n      type={type}\n      data-slot=\"input\"\n      className={cn(\n        \"border-lt-input file:text-lt-fg placeholder:text-lt-muted-fg selection:bg-lt-primary selection:text-lt-primary-fg flex h-9 w-full min-w-0 rounded-lt-sm border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\",\n        \"focus-visible:border-lt-ring focus-visible:ring-lt-ring/50 focus-visible:ring-[3px]\",\n        \"aria-invalid:ring-lt-danger/20 dark:aria-invalid:ring-lt-danger/40 aria-invalid:border-lt-danger\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Input };\n"],"mappings":";;;;AAIA,SAAS,MAAM,EAAE,WAAW,MAAM,GAAG,SAAwC;CAC3E,OACE,oBAAC,SAAD;EACQ;EACN,aAAU;EACV,WAAW,GACT,4aACA,uFACA,oGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"input.js","names":[],"sources":["../../../../resources/js/form/components/base/input.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { controlSurface } from \"@lattice-php/lattice/core/components/control\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\n\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\n  return (\n    <input\n      type={type}\n      data-slot=\"input\"\n      className={cn(\n        controlSurface(),\n        \"file:text-lt-fg selection:bg-lt-primary selection:text-lt-primary-fg file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Input };\n"],"mappings":";;;;;AAKA,SAAS,MAAM,EAAE,WAAW,MAAM,GAAG,SAAwC;CAC3E,OACE,oBAAC,SAAD;EACQ;EACN,aAAU;EACV,WAAW,GACT,eAAe,GACf,kKACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/form/components/base/label.js.map

@@ -1 +1 @@
-{"version":3,"file":"label.js","names":[],"sources":["../../../../resources/js/form/components/base/label.tsx"],"sourcesContent":["import * as LabelPrimitive from \"@radix-ui/react-label\";\nimport * as React from \"react\";\n\nimport { cn } from \"@lattice/lattice/lib/utils\";\n\nfunction Label({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>) {\n  return (\n    <LabelPrimitive.Root\n      data-slot=\"label\"\n      className={cn(\n        \"text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Label };\n"],"mappings":";;;;;AAKA,SAAS,MAAM,EAAE,WAAW,GAAG,SAA2D;CACxF,OACE,oBAAC,eAAe,MAAhB;EACE,aAAU;EACV,WAAW,GACT,+LACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"label.js","names":[],"sources":["../../../../resources/js/form/components/base/label.tsx"],"sourcesContent":["import * as LabelPrimitive from \"@radix-ui/react-label\";\nimport * as React from \"react\";\n\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\n\nfunction Label({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>) {\n  return (\n    <LabelPrimitive.Root\n      data-slot=\"label\"\n      className={cn(\n        \"text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Label };\n"],"mappings":";;;;;AAKA,SAAS,MAAM,EAAE,WAAW,GAAG,SAA2D;CACxF,OACE,oBAAC,eAAe,MAAhB;EACE,aAAU;EACV,WAAW,GACT,+LACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/form/components/base/password-input.js

@@ -1,8 +1,8 @@
 import { cn } from "../../../lib/utils.js";
+import { Icon } from "../../../icons/sprite.js";
 import { Input } from "./input.js";
 import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Eye, EyeOff } from "lucide-react";
 //#region resources/js/form/components/base/password-input.tsx
 function PasswordInput({ className, ref, ...props }) {
 	const [showPassword, setShowPassword] = useState(false);
@@ -15,11 +15,18 @@ function PasswordInput({ className, ref, ...props }) {
 			...props
 		}), /* @__PURE__ */ jsx("button", {
 			type: "button",
+			"data-test": typeof props.name === "string" ? `${props.name}-visibility` : "password-visibility",
 			onClick: () => setShowPassword((prev) => !prev),
 			className: "absolute inset-y-0 right-0 flex items-center rounded-r-lt-sm px-3 text-lt-muted-fg hover:text-lt-fg focus-visible:ring-[3px] focus-visible:ring-lt-ring focus-visible:outline-none",
 			"aria-label": showPassword ? "Hide password" : "Show password",
 			tabIndex: -1,
-			children: showPassword ? /* @__PURE__ */ jsx(EyeOff, { className: "size-4" }) : /* @__PURE__ */ jsx(Eye, { className: "size-4" })
+			children: showPassword ? /* @__PURE__ */ jsx(Icon, {
+				name: "eye-off",
+				className: "size-lt-icon-md"
+			}) : /* @__PURE__ */ jsx(Icon, {
+				name: "eye",
+				className: "size-lt-icon-md"
+			})
 		})]
 	});
 }

package/dist/form/components/base/password-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"password-input.js","names":[],"sources":["../../../../resources/js/form/components/base/password-input.tsx"],"sourcesContent":["import { Eye, EyeOff } from \"lucide-react\";\nimport type { ComponentProps, Ref } from \"react\";\nimport { useState } from \"react\";\nimport { Input } from \"@lattice/lattice/form/components/base/input\";\nimport { cn } from \"@lattice/lattice/lib/utils\";\n\ntype PasswordInputProps = Omit<ComponentProps<\"input\">, \"type\"> & {\n  passwordrules?: string;\n  ref?: Ref<HTMLInputElement>;\n};\n\nexport default function PasswordInput({ className, ref, ...props }: PasswordInputProps) {\n  const [showPassword, setShowPassword] = useState(false);\n\n  return (\n    <div className=\"relative\">\n      <Input\n        type={showPassword ? \"text\" : \"password\"}\n        className={cn(\"pr-10\", className)}\n        ref={ref}\n        {...props}\n      />\n      <button\n        type=\"button\"\n        onClick={() => setShowPassword((prev) => !prev)}\n        className=\"absolute inset-y-0 right-0 flex items-center rounded-r-lt-sm px-3 text-lt-muted-fg hover:text-lt-fg focus-visible:ring-[3px] focus-visible:ring-lt-ring focus-visible:outline-none\"\n        aria-label={showPassword ? \"Hide password\" : \"Show password\"}\n        tabIndex={-1}\n      >\n        {showPassword ? <EyeOff className=\"size-4\" /> : <Eye className=\"size-4\" />}\n      </button>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAWA,SAAwB,cAAc,EAAE,WAAW,KAAK,GAAG,SAA6B;CACtF,MAAM,CAAC,cAAc,mBAAmB,SAAS,KAAK;CAEtD,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,OAAD;GACE,MAAM,eAAe,SAAS;GAC9B,WAAW,GAAG,SAAS,SAAS;GAC3B;GACL,GAAI;EACL,CAAA,GACD,oBAAC,UAAD;GACE,MAAK;GACL,eAAe,iBAAiB,SAAS,CAAC,IAAI;GAC9C,WAAU;GACV,cAAY,eAAe,kBAAkB;GAC7C,UAAU;aAET,eAAe,oBAAC,QAAD,EAAQ,WAAU,SAAU,CAAA,IAAI,oBAAC,KAAD,EAAK,WAAU,SAAU,CAAA;EACnE,CAAA,CACL;;AAET"}
+{"version":3,"file":"password-input.js","names":[],"sources":["../../../../resources/js/form/components/base/password-input.tsx"],"sourcesContent":["import { Icon } from \"@lattice-php/lattice/icons\";\nimport type { ComponentProps, Ref } from \"react\";\nimport { useState } from \"react\";\nimport { Input } from \"@lattice-php/lattice/form/components/base/input\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\n\ntype PasswordInputProps = Omit<ComponentProps<\"input\">, \"type\"> & {\n  passwordrules?: string;\n  ref?: Ref<HTMLInputElement>;\n};\n\nexport default function PasswordInput({ className, ref, ...props }: PasswordInputProps) {\n  const [showPassword, setShowPassword] = useState(false);\n\n  return (\n    <div className=\"relative\">\n      <Input\n        type={showPassword ? \"text\" : \"password\"}\n        className={cn(\"pr-10\", className)}\n        ref={ref}\n        {...props}\n      />\n      <button\n        type=\"button\"\n        data-test={\n          typeof props.name === \"string\" ? `${props.name}-visibility` : \"password-visibility\"\n        }\n        onClick={() => setShowPassword((prev) => !prev)}\n        className=\"absolute inset-y-0 right-0 flex items-center rounded-r-lt-sm px-3 text-lt-muted-fg hover:text-lt-fg focus-visible:ring-[3px] focus-visible:ring-lt-ring focus-visible:outline-none\"\n        aria-label={showPassword ? \"Hide password\" : \"Show password\"}\n        tabIndex={-1}\n      >\n        {showPassword ? (\n          <Icon name=\"eye-off\" className=\"size-lt-icon-md\" />\n        ) : (\n          <Icon name=\"eye\" className=\"size-lt-icon-md\" />\n        )}\n      </button>\n    </div>\n  );\n}\n"],"mappings":";;;;;;AAWA,SAAwB,cAAc,EAAE,WAAW,KAAK,GAAG,SAA6B;CACtF,MAAM,CAAC,cAAc,mBAAmB,SAAS,KAAK;CAEtD,OACE,qBAAC,OAAD;EAAK,WAAU;YAAf,CACE,oBAAC,OAAD;GACE,MAAM,eAAe,SAAS;GAC9B,WAAW,GAAG,SAAS,SAAS;GAC3B;GACL,GAAI;EACL,CAAA,GACD,oBAAC,UAAD;GACE,MAAK;GACL,aACE,OAAO,MAAM,SAAS,WAAW,GAAG,MAAM,KAAK,eAAe;GAEhE,eAAe,iBAAiB,SAAS,CAAC,IAAI;GAC9C,WAAU;GACV,cAAY,eAAe,kBAAkB;GAC7C,UAAU;aAET,eACC,oBAAC,MAAD;IAAM,MAAK;IAAU,WAAU;GAAmB,CAAA,IAElD,oBAAC,MAAD;IAAM,MAAK;IAAM,WAAU;GAAmB,CAAA;EAE1C,CAAA,CACL;;AAET"}

package/dist/form/components/base/submit-button.d.ts

@@ -1,6 +1,6 @@
-type SubmitButtonVariant = "default" | "destructive" | "ghost" | "link" | "outline" | "secondary";
-export declare function FormSubmitButton({ label, variant, }: {
+import { ButtonVariant } from '../../../types/generated';
+export declare function FormSubmitButton({ label, summaryLabel, variant, }: {
     label: string;
-    variant?: SubmitButtonVariant;
+    summaryLabel: string;
+    variant?: ButtonVariant;
 }): import("react").JSX.Element;
-export {};

package/dist/form/components/base/submit-button.js

@@ -3,8 +3,8 @@ import { Spinner } from "../../../core/components/spinner.js";
 import { useFormContext } from "../context.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region resources/js/form/components/base/submit-button.tsx
-function FormSubmitButton({ label, variant = "default" }) {
-	const { errors, fieldLabels, processing } = useFormContext();
+function FormSubmitButton({ label, summaryLabel, variant = "default" }) {
+	const { componentId, errors, fieldLabels, processing } = useFormContext();
 	const invalidFields = Object.entries(errors).filter(([, message]) => Boolean(message)).map(([name, message]) => ({
 		label: fieldLabels[name] ?? name,
 		message
@@ -13,6 +13,8 @@ function FormSubmitButton({ label, variant = "default" }) {
 	return /* @__PURE__ */ jsxs("span", {
 		className: "group relative inline-flex flex-col",
 		children: [/* @__PURE__ */ jsxs(Button, {
+			"data-lattice-form": componentId,
+			"data-test": "form-submit",
 			disabled: processing || hasErrors,
 			type: "submit",
 			variant,
@@ -22,7 +24,7 @@ function FormSubmitButton({ label, variant = "default" }) {
 			role: "tooltip",
 			children: [/* @__PURE__ */ jsx("p", {
 				className: "mb-1 font-medium text-lt-fg",
-				children: "Fix these fields to continue:"
+				children: summaryLabel
 			}), /* @__PURE__ */ jsx("ul", {
 				className: "space-y-1",
 				children: invalidFields.map((field) => /* @__PURE__ */ jsxs("li", {

package/dist/form/components/base/submit-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"submit-button.js","names":[],"sources":["../../../../resources/js/form/components/base/submit-button.tsx"],"sourcesContent":["import { Button } from \"@lattice/lattice/core/components/button\";\nimport { Spinner } from \"@lattice/lattice/core/components/spinner\";\nimport { useFormContext } from \"../context\";\n\ntype SubmitButtonVariant = \"default\" | \"destructive\" | \"ghost\" | \"link\" | \"outline\" | \"secondary\";\n\nexport function FormSubmitButton({\n  label,\n  variant = \"default\",\n}: {\n  label: string;\n  variant?: SubmitButtonVariant;\n}) {\n  const { errors, fieldLabels, processing } = useFormContext();\n\n  const invalidFields = Object.entries(errors)\n    .filter(([, message]) => Boolean(message))\n    .map(([name, message]) => ({ label: fieldLabels[name] ?? name, message: message as string }));\n  const hasErrors = invalidFields.length > 0;\n\n  return (\n    <span className=\"group relative inline-flex flex-col\">\n      <Button disabled={processing || hasErrors} type=\"submit\" variant={variant}>\n        {processing && <Spinner />}\n        {label}\n      </Button>\n\n      {hasErrors && (\n        <div\n          className=\"pointer-events-none absolute bottom-full left-1/2 z-10 mb-2 w-max max-w-xs -translate-x-1/2 rounded-lt border border-lt-border bg-lt-surface p-3 text-left text-sm opacity-0 shadow-md transition-opacity group-hover:opacity-100\"\n          role=\"tooltip\"\n        >\n          <p className=\"mb-1 font-medium text-lt-fg\">Fix these fields to continue:</p>\n          <ul className=\"space-y-1\">\n            {invalidFields.map((field) => (\n              <li className=\"text-lt-muted-fg\" key={field.label}>\n                <span className=\"font-medium text-lt-fg\">{field.label}</span> — {field.message}\n              </li>\n            ))}\n          </ul>\n        </div>\n      )}\n    </span>\n  );\n}\n"],"mappings":";;;;;AAMA,SAAgB,iBAAiB,EAC/B,OACA,UAAU,aAIT;CACD,MAAM,EAAE,QAAQ,aAAa,eAAe,eAAe;CAE3D,MAAM,gBAAgB,OAAO,QAAQ,MAAM,EACxC,QAAQ,GAAG,aAAa,QAAQ,OAAO,CAAC,EACxC,KAAK,CAAC,MAAM,cAAc;EAAE,OAAO,YAAY,SAAS;EAAe;CAAkB,EAAE;CAC9F,MAAM,YAAY,cAAc,SAAS;CAEzC,OACE,qBAAC,QAAD;EAAM,WAAU;YAAhB,CACE,qBAAC,QAAD;GAAQ,UAAU,cAAc;GAAW,MAAK;GAAkB;aAAlE,CACG,cAAc,oBAAC,SAAD,CAAU,CAAA,GACxB,KACK;MAEP,aACC,qBAAC,OAAD;GACE,WAAU;GACV,MAAK;aAFP,CAIE,oBAAC,KAAD;IAAG,WAAU;cAA8B;GAAgC,CAAA,GAC3E,oBAAC,MAAD;IAAI,WAAU;cACX,cAAc,KAAK,UAClB,qBAAC,MAAD;KAAI,WAAU;eAAd;MACE,oBAAC,QAAD;OAAM,WAAU;iBAA0B,MAAM;MAAY,CAAA;MAAC;MAAI,MAAM;KACrE;OAFkC,MAAM,KAExC,CACL;GACC,CAAA,CACD;IAEH;;AAEV"}
+{"version":3,"file":"submit-button.js","names":[],"sources":["../../../../resources/js/form/components/base/submit-button.tsx"],"sourcesContent":["import { Button } from \"@lattice-php/lattice/core/components/button\";\nimport { Spinner } from \"@lattice-php/lattice/core/components/spinner\";\nimport type { ButtonVariant } from \"@lattice-php/lattice/types/generated\";\nimport { useFormContext } from \"../context\";\n\nexport function FormSubmitButton({\n  label,\n  summaryLabel,\n  variant = \"default\",\n}: {\n  label: string;\n  summaryLabel: string;\n  variant?: ButtonVariant;\n}) {\n  const { componentId, errors, fieldLabels, processing } = useFormContext();\n\n  const invalidFields = Object.entries(errors)\n    .filter(([, message]) => Boolean(message))\n    .map(([name, message]) => ({ label: fieldLabels[name] ?? name, message: message as string }));\n  const hasErrors = invalidFields.length > 0;\n\n  return (\n    <span className=\"group relative inline-flex flex-col\">\n      <Button\n        data-lattice-form={componentId}\n        data-test=\"form-submit\"\n        disabled={processing || hasErrors}\n        type=\"submit\"\n        variant={variant}\n      >\n        {processing && <Spinner />}\n        {label}\n      </Button>\n\n      {hasErrors && (\n        <div\n          className=\"pointer-events-none absolute bottom-full left-1/2 z-10 mb-2 w-max max-w-xs -translate-x-1/2 rounded-lt border border-lt-border bg-lt-surface p-3 text-left text-sm opacity-0 shadow-md transition-opacity group-hover:opacity-100\"\n          role=\"tooltip\"\n        >\n          <p className=\"mb-1 font-medium text-lt-fg\">{summaryLabel}</p>\n          <ul className=\"space-y-1\">\n            {invalidFields.map((field) => (\n              <li className=\"text-lt-muted-fg\" key={field.label}>\n                <span className=\"font-medium text-lt-fg\">{field.label}</span> — {field.message}\n              </li>\n            ))}\n          </ul>\n        </div>\n      )}\n    </span>\n  );\n}\n"],"mappings":";;;;;AAKA,SAAgB,iBAAiB,EAC/B,OACA,cACA,UAAU,aAKT;CACD,MAAM,EAAE,aAAa,QAAQ,aAAa,eAAe,eAAe;CAExE,MAAM,gBAAgB,OAAO,QAAQ,MAAM,EACxC,QAAQ,GAAG,aAAa,QAAQ,OAAO,CAAC,EACxC,KAAK,CAAC,MAAM,cAAc;EAAE,OAAO,YAAY,SAAS;EAAe;CAAkB,EAAE;CAC9F,MAAM,YAAY,cAAc,SAAS;CAEzC,OACE,qBAAC,QAAD;EAAM,WAAU;YAAhB,CACE,qBAAC,QAAD;GACE,qBAAmB;GACnB,aAAU;GACV,UAAU,cAAc;GACxB,MAAK;GACI;aALX,CAOG,cAAc,oBAAC,SAAD,CAAU,CAAA,GACxB,KACK;MAEP,aACC,qBAAC,OAAD;GACE,WAAU;GACV,MAAK;aAFP,CAIE,oBAAC,KAAD;IAAG,WAAU;cAA+B;GAAgB,CAAA,GAC5D,oBAAC,MAAD;IAAI,WAAU;cACX,cAAc,KAAK,UAClB,qBAAC,MAAD;KAAI,WAAU;eAAd;MACE,oBAAC,QAAD;OAAM,WAAU;iBAA0B,MAAM;MAAY,CAAA;MAAC;MAAI,MAAM;KACrE;OAFkC,MAAM,KAExC,CACL;GACC,CAAA,CACD;IAEH;;AAEV"}

package/dist/form/components/base/textarea.js

@@ -1,11 +1,12 @@
 import { cn } from "../../../lib/utils.js";
+import { FOCUS_RING } from "../../../core/components/control.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 //#region resources/js/form/components/base/textarea.tsx
 function Textarea({ className, ...props }) {
 	return /* @__PURE__ */ jsx("textarea", {
 		"data-slot": "textarea",
-		className: cn("border-lt-input placeholder:text-lt-muted-fg flex field-sizing-content min-h-16 w-full rounded-lt-sm border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-lt-ring focus-visible:ring-lt-ring/50 focus-visible:ring-[3px]", "aria-invalid:ring-lt-danger/20 dark:aria-invalid:ring-lt-danger/40 aria-invalid:border-lt-danger", className),
+		className: cn("border-lt-input placeholder:text-lt-muted-fg flex field-sizing-content min-h-16 w-full rounded-lt-sm border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", FOCUS_RING, "aria-invalid:ring-lt-danger/20 dark:aria-invalid:ring-lt-danger/40 aria-invalid:border-lt-danger", className),
 		...props
 	});
 }

package/dist/form/components/base/textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.js","names":[],"sources":["../../../../resources/js/form/components/base/textarea.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"@lattice/lattice/lib/utils\";\n\nfunction Textarea({ className, ...props }: React.ComponentProps<\"textarea\">) {\n  return (\n    <textarea\n      data-slot=\"textarea\"\n      className={cn(\n        \"border-lt-input placeholder:text-lt-muted-fg flex field-sizing-content min-h-16 w-full rounded-lt-sm border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\",\n        \"focus-visible:border-lt-ring focus-visible:ring-lt-ring/50 focus-visible:ring-[3px]\",\n        \"aria-invalid:ring-lt-danger/20 dark:aria-invalid:ring-lt-danger/40 aria-invalid:border-lt-danger\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Textarea };\n"],"mappings":";;;;AAIA,SAAS,SAAS,EAAE,WAAW,GAAG,SAA2C;CAC3E,OACE,oBAAC,YAAD;EACE,aAAU;EACV,WAAW,GACT,+RACA,uFACA,oGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}
+{"version":3,"file":"textarea.js","names":[],"sources":["../../../../resources/js/form/components/base/textarea.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport { FOCUS_RING } from \"@lattice-php/lattice/core/components/control\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\n\nfunction Textarea({ className, ...props }: React.ComponentProps<\"textarea\">) {\n  return (\n    <textarea\n      data-slot=\"textarea\"\n      className={cn(\n        \"border-lt-input placeholder:text-lt-muted-fg flex field-sizing-content min-h-16 w-full rounded-lt-sm border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\",\n        FOCUS_RING,\n        \"aria-invalid:ring-lt-danger/20 dark:aria-invalid:ring-lt-danger/40 aria-invalid:border-lt-danger\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Textarea };\n"],"mappings":";;;;;AAKA,SAAS,SAAS,EAAE,WAAW,GAAG,SAA2C;CAC3E,OACE,oBAAC,YAAD;EACE,aAAU;EACV,WAAW,GACT,+RACA,YACA,oGACA,SACF;EACA,GAAI;CACL,CAAA;AAEL"}

package/dist/form/components/conditions.d.ts

@@ -1,25 +1,22 @@
-import { ConditionOperator } from '../../../../generated/types';
-export type Condition = {
-    field: string;
-    operator: ConditionOperator;
-    value: unknown;
-};
+import { Condition } from '../../types/generated';
+export type { Condition };
 export type FieldConditions = {
     visible?: Condition[];
     required?: Condition[];
-    readonly?: Condition[];
+    readOnly?: Condition[];
     disabled?: Condition[];
 };
 export type FieldFlags = {
     hidden?: boolean;
     required?: boolean;
-    readonly?: boolean;
+    readOnly?: boolean;
     disabled?: boolean;
 };
 export type FieldState = {
     hidden: boolean;
     required: boolean;
-    readonly: boolean;
+    readOnly: boolean;
     disabled: boolean;
 };
+export declare function toBoolean(value: unknown): boolean;
 export declare function evaluateConditions(conditions: FieldConditions | undefined, values: Record<string, unknown>, flags: FieldFlags): FieldState;

package/dist/form/components/conditions.js

@@ -20,6 +20,12 @@ function isIn(actual, expected) {
 function isBlank(value) {
 	return value == null || String(value) === "";
 }
+function compareDates(actual, expected) {
+	const left = Date.parse(String(actual));
+	const right = Date.parse(String(expected));
+	if (Number.isNaN(left) || Number.isNaN(right)) return null;
+	return left === right ? 0 : left < right ? -1 : 1;
+}
 function evaluateUnknownOperator(_operator) {
 	return true;
 }
@@ -36,6 +42,8 @@ function evaluateOp(operator, actual, expected) {
 		case "ends_with": return String(actual ?? "").endsWith(String(expected ?? ""));
 		case "in": return isIn(actual, expected);
 		case "not_in": return !isIn(actual, expected);
+		case "before": return compareDates(actual, expected) === -1;
+		case "after": return compareDates(actual, expected) === 1;
 		case "empty": return isBlank(actual);
 		case "filled": return !isBlank(actual);
 		default: return evaluateUnknownOperator(operator);
@@ -52,11 +60,11 @@ function evaluateConditions(conditions, values, flags) {
 	return {
 		hidden: Boolean(flags.hidden) || !visible,
 		required: Boolean(flags.required) || anyMatch(conditions?.required, values),
-		readonly: Boolean(flags.readonly) || anyMatch(conditions?.readonly, values),
+		readOnly: Boolean(flags.readOnly) || anyMatch(conditions?.readOnly, values),
 		disabled: Boolean(flags.disabled) || anyMatch(conditions?.disabled, values)
 	};
 }
 //#endregion
-export { evaluateConditions };
+export { evaluateConditions, toBoolean };
 
 //# sourceMappingURL=conditions.js.map

package/dist/form/components/conditions.js.map

@@ -1 +1 @@
-{"version":3,"file":"conditions.js","names":[],"sources":["../../../resources/js/form/components/conditions.ts"],"sourcesContent":["import type { ConditionOperator } from \"@lattice/lattice/generated/types\";\n\nexport type Condition = { field: string; operator: ConditionOperator; value: unknown };\n\nexport type FieldConditions = {\n  visible?: Condition[];\n  required?: Condition[];\n  readonly?: Condition[];\n  disabled?: Condition[];\n};\n\nexport type FieldFlags = {\n  hidden?: boolean;\n  required?: boolean;\n  readonly?: boolean;\n  disabled?: boolean;\n};\n\nexport type FieldState = {\n  hidden: boolean;\n  required: boolean;\n  readonly: boolean;\n  disabled: boolean;\n};\n\nconst BOOLEAN_TRUE_VALUES = new Set([\"1\", \"true\", \"on\", \"yes\"]);\n\n// Mirrors PHP filter_var(FILTER_VALIDATE_BOOLEAN) so conditions evaluate\n// identically on the server and the client.\nfunction toBoolean(value: unknown): boolean {\n  if (typeof value === \"boolean\") {\n    return value;\n  }\n\n  if (typeof value === \"number\") {\n    return value === 1;\n  }\n\n  return BOOLEAN_TRUE_VALUES.has(String(value).toLowerCase());\n}\n\nfunction equals(actual: unknown, expected: unknown): boolean {\n  if (typeof expected === \"boolean\") {\n    return toBoolean(actual) === expected;\n  }\n  return String(actual ?? \"\") === String(expected ?? \"\");\n}\n\nfunction isIn(actual: unknown, expected: unknown): boolean {\n  const needles = (Array.isArray(expected) ? expected : [expected]).map((value) => String(value));\n  return needles.includes(String(actual ?? \"\"));\n}\n\nfunction isBlank(value: unknown): boolean {\n  return value == null || String(value) === \"\";\n}\n\n// Unknown operators from untrusted payloads fail open (the condition matches).\n// The `never` parameter makes a ConditionOperator added without a case above a\n// compile error rather than a silent fall-through.\nfunction evaluateUnknownOperator(_operator: never): boolean {\n  return true;\n}\n\nfunction evaluateOp(operator: ConditionOperator, actual: unknown, expected: unknown): boolean {\n  switch (operator) {\n    case \"eq\":\n      return equals(actual, expected);\n    case \"neq\":\n      return !equals(actual, expected);\n    case \"gt\":\n      return Number(actual) > Number(expected);\n    case \"lt\":\n      return Number(actual) < Number(expected);\n    case \"gte\":\n      return Number(actual) >= Number(expected);\n    case \"lte\":\n      return Number(actual) <= Number(expected);\n    case \"contains\":\n      return String(actual ?? \"\").includes(String(expected ?? \"\"));\n    case \"starts_with\":\n      return String(actual ?? \"\").startsWith(String(expected ?? \"\"));\n    case \"ends_with\":\n      return String(actual ?? \"\").endsWith(String(expected ?? \"\"));\n    case \"in\":\n      return isIn(actual, expected);\n    case \"not_in\":\n      return !isIn(actual, expected);\n    case \"empty\":\n      return isBlank(actual);\n    case \"filled\":\n      return !isBlank(actual);\n    default:\n      return evaluateUnknownOperator(operator);\n  }\n}\n\nfunction allMatch(conditions: Condition[], values: Record<string, unknown>): boolean {\n  return conditions.every((condition) =>\n    evaluateOp(condition.operator, values[condition.field], condition.value),\n  );\n}\n\nfunction anyMatch(conditions: Condition[] | undefined, values: Record<string, unknown>): boolean {\n  return Boolean(\n    conditions?.some((condition) =>\n      evaluateOp(condition.operator, values[condition.field], condition.value),\n    ),\n  );\n}\n\nexport function evaluateConditions(\n  conditions: FieldConditions | undefined,\n  values: Record<string, unknown>,\n  flags: FieldFlags,\n): FieldState {\n  const visible = !conditions?.visible?.length || allMatch(conditions.visible, values);\n\n  return {\n    hidden: Boolean(flags.hidden) || !visible,\n    required: Boolean(flags.required) || anyMatch(conditions?.required, values),\n    readonly: Boolean(flags.readonly) || anyMatch(conditions?.readonly, values),\n    disabled: Boolean(flags.disabled) || anyMatch(conditions?.disabled, values),\n  };\n}\n"],"mappings":";AAyBA,IAAM,sBAAsB,IAAI,IAAI;CAAC;CAAK;CAAQ;CAAM;AAAK,CAAC;AAI9D,SAAS,UAAU,OAAyB;CAC1C,IAAI,OAAO,UAAU,WACnB,OAAO;CAGT,IAAI,OAAO,UAAU,UACnB,OAAO,UAAU;CAGnB,OAAO,oBAAoB,IAAI,OAAO,KAAK,EAAE,YAAY,CAAC;AAC5D;AAEA,SAAS,OAAO,QAAiB,UAA4B;CAC3D,IAAI,OAAO,aAAa,WACtB,OAAO,UAAU,MAAM,MAAM;CAE/B,OAAO,OAAO,UAAU,EAAE,MAAM,OAAO,YAAY,EAAE;AACvD;AAEA,SAAS,KAAK,QAAiB,UAA4B;CAEzD,QADiB,MAAM,QAAQ,QAAQ,IAAI,WAAW,CAAC,QAAQ,GAAG,KAAK,UAAU,OAAO,KAAK,CACtF,EAAQ,SAAS,OAAO,UAAU,EAAE,CAAC;AAC9C;AAEA,SAAS,QAAQ,OAAyB;CACxC,OAAO,SAAS,QAAQ,OAAO,KAAK,MAAM;AAC5C;AAKA,SAAS,wBAAwB,WAA2B;CAC1D,OAAO;AACT;AAEA,SAAS,WAAW,UAA6B,QAAiB,UAA4B;CAC5F,QAAQ,UAAR;EACE,KAAK,MACH,OAAO,OAAO,QAAQ,QAAQ;EAChC,KAAK,OACH,OAAO,CAAC,OAAO,QAAQ,QAAQ;EACjC,KAAK,MACH,OAAO,OAAO,MAAM,IAAI,OAAO,QAAQ;EACzC,KAAK,MACH,OAAO,OAAO,MAAM,IAAI,OAAO,QAAQ;EACzC,KAAK,OACH,OAAO,OAAO,MAAM,KAAK,OAAO,QAAQ;EAC1C,KAAK,OACH,OAAO,OAAO,MAAM,KAAK,OAAO,QAAQ;EAC1C,KAAK,YACH,OAAO,OAAO,UAAU,EAAE,EAAE,SAAS,OAAO,YAAY,EAAE,CAAC;EAC7D,KAAK,eACH,OAAO,OAAO,UAAU,EAAE,EAAE,WAAW,OAAO,YAAY,EAAE,CAAC;EAC/D,KAAK,aACH,OAAO,OAAO,UAAU,EAAE,EAAE,SAAS,OAAO,YAAY,EAAE,CAAC;EAC7D,KAAK,MACH,OAAO,KAAK,QAAQ,QAAQ;EAC9B,KAAK,UACH,OAAO,CAAC,KAAK,QAAQ,QAAQ;EAC/B,KAAK,SACH,OAAO,QAAQ,MAAM;EACvB,KAAK,UACH,OAAO,CAAC,QAAQ,MAAM;EACxB,SACE,OAAO,wBAAwB,QAAQ;CAC3C;AACF;AAEA,SAAS,SAAS,YAAyB,QAA0C;CACnF,OAAO,WAAW,OAAO,cACvB,WAAW,UAAU,UAAU,OAAO,UAAU,QAAQ,UAAU,KAAK,CACzE;AACF;AAEA,SAAS,SAAS,YAAqC,QAA0C;CAC/F,OAAO,QACL,YAAY,MAAM,cAChB,WAAW,UAAU,UAAU,OAAO,UAAU,QAAQ,UAAU,KAAK,CACzE,CACF;AACF;AAEA,SAAgB,mBACd,YACA,QACA,OACY;CACZ,MAAM,UAAU,CAAC,YAAY,SAAS,UAAU,SAAS,WAAW,SAAS,MAAM;CAEnF,OAAO;EACL,QAAQ,QAAQ,MAAM,MAAM,KAAK,CAAC;EAClC,UAAU,QAAQ,MAAM,QAAQ,KAAK,SAAS,YAAY,UAAU,MAAM;EAC1E,UAAU,QAAQ,MAAM,QAAQ,KAAK,SAAS,YAAY,UAAU,MAAM;EAC1E,UAAU,QAAQ,MAAM,QAAQ,KAAK,SAAS,YAAY,UAAU,MAAM;CAC5E;AACF"}
+{"version":3,"file":"conditions.js","names":[],"sources":["../../../resources/js/form/components/conditions.ts"],"sourcesContent":["import type { Condition, Op } from \"@lattice-php/lattice/types/generated\";\n\nexport type { Condition };\n\nexport type FieldConditions = {\n  visible?: Condition[];\n  required?: Condition[];\n  readOnly?: Condition[];\n  disabled?: Condition[];\n};\n\nexport type FieldFlags = {\n  hidden?: boolean;\n  required?: boolean;\n  readOnly?: boolean;\n  disabled?: boolean;\n};\n\nexport type FieldState = {\n  hidden: boolean;\n  required: boolean;\n  readOnly: boolean;\n  disabled: boolean;\n};\n\nconst BOOLEAN_TRUE_VALUES = new Set([\"1\", \"true\", \"on\", \"yes\"]);\n\n// Mirrors PHP filter_var(FILTER_VALIDATE_BOOLEAN) so conditions evaluate\n// identically on the server and the client.\nexport function toBoolean(value: unknown): boolean {\n  if (typeof value === \"boolean\") {\n    return value;\n  }\n\n  if (typeof value === \"number\") {\n    return value === 1;\n  }\n\n  return BOOLEAN_TRUE_VALUES.has(String(value).toLowerCase());\n}\n\nfunction equals(actual: unknown, expected: unknown): boolean {\n  if (typeof expected === \"boolean\") {\n    return toBoolean(actual) === expected;\n  }\n  return String(actual ?? \"\") === String(expected ?? \"\");\n}\n\nfunction isIn(actual: unknown, expected: unknown): boolean {\n  const needles = (Array.isArray(expected) ? expected : [expected]).map((value) => String(value));\n  return needles.includes(String(actual ?? \"\"));\n}\n\nfunction isBlank(value: unknown): boolean {\n  return value == null || String(value) === \"\";\n}\n\n// Null when either value can't be parsed, so before/after never matches a bad date. Mirrors PHP strtotime.\nfunction compareDates(actual: unknown, expected: unknown): number | null {\n  const left = Date.parse(String(actual));\n  const right = Date.parse(String(expected));\n\n  if (Number.isNaN(left) || Number.isNaN(right)) {\n    return null;\n  }\n\n  return left === right ? 0 : left < right ? -1 : 1;\n}\n\n// Unknown operators from untrusted payloads fail open (the condition matches).\n// The `never` parameter makes an Op value added without a case above a\n// compile error rather than a silent fall-through.\nfunction evaluateUnknownOperator(_operator: never): boolean {\n  return true;\n}\n\nfunction evaluateOp(operator: Op, actual: unknown, expected: unknown): boolean {\n  switch (operator) {\n    case \"eq\":\n      return equals(actual, expected);\n    case \"neq\":\n      return !equals(actual, expected);\n    case \"gt\":\n      return Number(actual) > Number(expected);\n    case \"lt\":\n      return Number(actual) < Number(expected);\n    case \"gte\":\n      return Number(actual) >= Number(expected);\n    case \"lte\":\n      return Number(actual) <= Number(expected);\n    case \"contains\":\n      return String(actual ?? \"\").includes(String(expected ?? \"\"));\n    case \"starts_with\":\n      return String(actual ?? \"\").startsWith(String(expected ?? \"\"));\n    case \"ends_with\":\n      return String(actual ?? \"\").endsWith(String(expected ?? \"\"));\n    case \"in\":\n      return isIn(actual, expected);\n    case \"not_in\":\n      return !isIn(actual, expected);\n    case \"before\":\n      return compareDates(actual, expected) === -1;\n    case \"after\":\n      return compareDates(actual, expected) === 1;\n    case \"empty\":\n      return isBlank(actual);\n    case \"filled\":\n      return !isBlank(actual);\n    default:\n      return evaluateUnknownOperator(operator);\n  }\n}\n\nfunction allMatch(conditions: Condition[], values: Record<string, unknown>): boolean {\n  return conditions.every((condition) =>\n    evaluateOp(condition.operator, values[condition.field], condition.value),\n  );\n}\n\nfunction anyMatch(conditions: Condition[] | undefined, values: Record<string, unknown>): boolean {\n  return Boolean(\n    conditions?.some((condition) =>\n      evaluateOp(condition.operator, values[condition.field], condition.value),\n    ),\n  );\n}\n\nexport function evaluateConditions(\n  conditions: FieldConditions | undefined,\n  values: Record<string, unknown>,\n  flags: FieldFlags,\n): FieldState {\n  const visible = !conditions?.visible?.length || allMatch(conditions.visible, values);\n\n  return {\n    hidden: Boolean(flags.hidden) || !visible,\n    required: Boolean(flags.required) || anyMatch(conditions?.required, values),\n    readOnly: Boolean(flags.readOnly) || anyMatch(conditions?.readOnly, values),\n    disabled: Boolean(flags.disabled) || anyMatch(conditions?.disabled, values),\n  };\n}\n"],"mappings":";AAyBA,IAAM,sBAAsB,IAAI,IAAI;CAAC;CAAK;CAAQ;CAAM;AAAK,CAAC;AAI9D,SAAgB,UAAU,OAAyB;CACjD,IAAI,OAAO,UAAU,WACnB,OAAO;CAGT,IAAI,OAAO,UAAU,UACnB,OAAO,UAAU;CAGnB,OAAO,oBAAoB,IAAI,OAAO,KAAK,EAAE,YAAY,CAAC;AAC5D;AAEA,SAAS,OAAO,QAAiB,UAA4B;CAC3D,IAAI,OAAO,aAAa,WACtB,OAAO,UAAU,MAAM,MAAM;CAE/B,OAAO,OAAO,UAAU,EAAE,MAAM,OAAO,YAAY,EAAE;AACvD;AAEA,SAAS,KAAK,QAAiB,UAA4B;CAEzD,QADiB,MAAM,QAAQ,QAAQ,IAAI,WAAW,CAAC,QAAQ,GAAG,KAAK,UAAU,OAAO,KAAK,CACtF,EAAQ,SAAS,OAAO,UAAU,EAAE,CAAC;AAC9C;AAEA,SAAS,QAAQ,OAAyB;CACxC,OAAO,SAAS,QAAQ,OAAO,KAAK,MAAM;AAC5C;AAGA,SAAS,aAAa,QAAiB,UAAkC;CACvE,MAAM,OAAO,KAAK,MAAM,OAAO,MAAM,CAAC;CACtC,MAAM,QAAQ,KAAK,MAAM,OAAO,QAAQ,CAAC;CAEzC,IAAI,OAAO,MAAM,IAAI,KAAK,OAAO,MAAM,KAAK,GAC1C,OAAO;CAGT,OAAO,SAAS,QAAQ,IAAI,OAAO,QAAQ,KAAK;AAClD;AAKA,SAAS,wBAAwB,WAA2B;CAC1D,OAAO;AACT;AAEA,SAAS,WAAW,UAAc,QAAiB,UAA4B;CAC7E,QAAQ,UAAR;EACE,KAAK,MACH,OAAO,OAAO,QAAQ,QAAQ;EAChC,KAAK,OACH,OAAO,CAAC,OAAO,QAAQ,QAAQ;EACjC,KAAK,MACH,OAAO,OAAO,MAAM,IAAI,OAAO,QAAQ;EACzC,KAAK,MACH,OAAO,OAAO,MAAM,IAAI,OAAO,QAAQ;EACzC,KAAK,OACH,OAAO,OAAO,MAAM,KAAK,OAAO,QAAQ;EAC1C,KAAK,OACH,OAAO,OAAO,MAAM,KAAK,OAAO,QAAQ;EAC1C,KAAK,YACH,OAAO,OAAO,UAAU,EAAE,EAAE,SAAS,OAAO,YAAY,EAAE,CAAC;EAC7D,KAAK,eACH,OAAO,OAAO,UAAU,EAAE,EAAE,WAAW,OAAO,YAAY,EAAE,CAAC;EAC/D,KAAK,aACH,OAAO,OAAO,UAAU,EAAE,EAAE,SAAS,OAAO,YAAY,EAAE,CAAC;EAC7D,KAAK,MACH,OAAO,KAAK,QAAQ,QAAQ;EAC9B,KAAK,UACH,OAAO,CAAC,KAAK,QAAQ,QAAQ;EAC/B,KAAK,UACH,OAAO,aAAa,QAAQ,QAAQ,MAAM;EAC5C,KAAK,SACH,OAAO,aAAa,QAAQ,QAAQ,MAAM;EAC5C,KAAK,SACH,OAAO,QAAQ,MAAM;EACvB,KAAK,UACH,OAAO,CAAC,QAAQ,MAAM;EACxB,SACE,OAAO,wBAAwB,QAAQ;CAC3C;AACF;AAEA,SAAS,SAAS,YAAyB,QAA0C;CACnF,OAAO,WAAW,OAAO,cACvB,WAAW,UAAU,UAAU,OAAO,UAAU,QAAQ,UAAU,KAAK,CACzE;AACF;AAEA,SAAS,SAAS,YAAqC,QAA0C;CAC/F,OAAO,QACL,YAAY,MAAM,cAChB,WAAW,UAAU,UAAU,OAAO,UAAU,QAAQ,UAAU,KAAK,CACzE,CACF;AACF;AAEA,SAAgB,mBACd,YACA,QACA,OACY;CACZ,MAAM,UAAU,CAAC,YAAY,SAAS,UAAU,SAAS,WAAW,SAAS,MAAM;CAEnF,OAAO;EACL,QAAQ,QAAQ,MAAM,MAAM,KAAK,CAAC;EAClC,UAAU,QAAQ,MAAM,QAAQ,KAAK,SAAS,YAAY,UAAU,MAAM;EAC1E,UAAU,QAAQ,MAAM,QAAQ,KAAK,SAAS,YAAY,UAAU,MAAM;EAC1E,UAAU,QAAQ,MAAM,QAAQ,KAAK,SAAS,YAAY,UAAU,MAAM;CAC5E;AACF"}

package/dist/form/components/context.d.ts

@@ -1,16 +1,13 @@
 type FormContextValue = {
     action: string;
     clearErrors: (field: string) => void;
+    componentId?: string;
     componentRef: string;
     errors: Record<string, string | undefined>;
     fieldLabels: Record<string, string>;
-    invalid: (field: string) => boolean;
     precognitive: boolean;
     processing: boolean;
-    touch: (field: string) => void;
     validate: (field: string) => void;
-    validating: boolean;
-    valid: (field: string) => boolean;
 };
 export declare function FormProvider({ children, value, }: {
     children: React.ReactNode;

package/dist/form/components/context.js

@@ -4,16 +4,13 @@ import { jsx } from "react/jsx-runtime";
 var FormContext = createContext({
 	action: "#",
 	clearErrors: () => {},
+	componentId: void 0,
 	componentRef: "",
 	errors: {},
 	fieldLabels: {},
-	invalid: () => false,
 	precognitive: false,
 	processing: false,
-	touch: () => {},
-	validate: () => {},
-	validating: false,
-	valid: () => false
+	validate: () => {}
 });
 function FormProvider({ children, value }) {
 	return /* @__PURE__ */ jsx(FormContext.Provider, {