@verbb/plugin-kit-react 1.0.9 → 2.0.0

package/dist/forms/fields/NumberField.js

@@ -1,5 +1,4 @@
 import { Input } from "../../components/Input.js";
-import "../../components/index.js";
 import { FieldLayout } from "../Field.js";
 import { useEngineField } from "../useEngineField.js";
 import { jsx } from "react/jsx-runtime";
@@ -16,14 +15,14 @@ var NumberField = ({ form, field }) => {
 		children: /* @__PURE__ */ jsx(Input, {
 			type: "number",
 			value: String(value ?? ""),
-			onChange: (event) => {
-				return setValue(event.target.value);
+			onInput: (event) => {
+				return setValue(event.target.value ?? "");
 			},
 			onBlur: setTouched,
 			placeholder: field.placeholder,
 			disabled: field.disabled,
-			style: field.size ? { width: `${field.size}rem` } : void 0,
-			"aria-invalid": isInvalid
+			invalid: isInvalid,
+			style: field.size ? { width: `${field.size}rem` } : void 0
 		})
 	});
 };

package/dist/forms/fields/NumberField.js.map

@@ -1 +1 @@
-{"version":3,"file":"NumberField.js","names":[],"sources":["../../../src/forms/fields/NumberField.tsx"],"sourcesContent":["import { Input } from '@verbb/plugin-kit-react/components';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport { useEngineField } from '../useEngineField';\n\ntype NumberFieldProps = {\n    form: SchemaFormEngineApi;\n    field: {\n        name: string;\n        label?: string;\n        instructions?: string;\n        warning?: string;\n        placeholder?: string;\n        size?: number;\n        required?: boolean;\n        disabled?: boolean;\n    };\n};\n\nexport const NumberField = ({ form, field }: NumberFieldProps) => {\n    const {\n        value, setValue, setTouched, errors, isInvalid,\n    } = useEngineField(form, field.name);\n\n    return (\n        <FieldLayout\n            name={field.name}\n            label={field.label}\n            instructions={field.instructions}\n            warning={field.warning}\n            required={field.required}\n            errors={errors}\n        >\n            <Input\n                type=\"number\"\n                value={String(value ?? '')}\n                onChange={(event) => { return setValue(event.target.value); }}\n                onBlur={setTouched}\n                placeholder={field.placeholder}\n                disabled={field.disabled}\n                style={field.size ? { width: `${field.size}rem` } : undefined}\n                aria-invalid={isInvalid}\n            />\n        </FieldLayout>\n    );\n};\n"],"mappings":";;;;;;AAmBA,IAAa,eAAe,EAAE,MAAM,YAA8B;CAC9D,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;AAEpC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;YAER,oBAAC,OAAD;GACI,MAAK;GACL,OAAO,OAAO,SAAS,GAAG;GAC1B,WAAW,UAAU;AAAE,WAAO,SAAS,MAAM,OAAO,MAAM;;GAC1D,QAAQ;GACR,aAAa,MAAM;GACnB,UAAU,MAAM;GAChB,OAAO,MAAM,OAAO,EAAE,OAAO,GAAG,MAAM,KAAK,MAAM,GAAG,KAAA;GACpD,gBAAc;GAChB,CAAA;EACQ,CAAA"}
+{"version":3,"file":"NumberField.js","names":[],"sources":["../../../src/forms/fields/NumberField.tsx"],"sourcesContent":["import { Input } from '../../components/Input.js';\nimport { FieldLayout } from '../Field.js';\nimport type { SchemaFormEngineApi } from '../engine/context.js';\nimport { useEngineField } from '../useEngineField.js';\n\ntype NumberFieldProps = {\n    form: SchemaFormEngineApi;\n    field: {\n        name: string;\n        label?: string;\n        instructions?: string;\n        warning?: string;\n        placeholder?: string;\n        size?: number;\n        required?: boolean;\n        disabled?: boolean;\n    };\n};\n\nexport const NumberField = ({ form, field }: NumberFieldProps) => {\n    const {\n        value, setValue, setTouched, errors, isInvalid,\n    } = useEngineField(form, field.name);\n\n    return (\n        <FieldLayout\n            name={field.name}\n            label={field.label}\n            instructions={field.instructions}\n            warning={field.warning}\n            required={field.required}\n            errors={errors}\n        >\n            <Input\n                type=\"number\"\n                value={String(value ?? '')}\n                onInput={(event) => { return setValue((event.target as { value?: string }).value ?? ''); }}\n                onBlur={setTouched}\n                placeholder={field.placeholder}\n                disabled={field.disabled}\n                invalid={isInvalid}\n                style={field.size ? { width: `${field.size}rem` } : undefined}\n            />\n        </FieldLayout>\n    );\n};\n"],"mappings":";;;;;AAmBA,IAAa,eAAe,EAAE,MAAM,YAA8B;CAC9D,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;AAEpC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;YAER,oBAAC,OAAD;GACI,MAAK;GACL,OAAO,OAAO,SAAS,GAAG;GAC1B,UAAU,UAAU;AAAE,WAAO,SAAU,MAAM,OAA8B,SAAS,GAAG;;GACvF,QAAQ;GACR,aAAa,MAAM;GACnB,UAAU,MAAM;GAChB,SAAS;GACT,OAAO,MAAM,OAAO,EAAE,OAAO,GAAG,MAAM,KAAK,MAAM,GAAG,KAAA;GACtD,CAAA;EACQ,CAAA"}

package/dist/forms/fields/RadioGroupField.d.ts

@@ -1,5 +1,5 @@
-import { SchemaFormEngineApi } from '../engine/context';
-import { SchemaNode } from '../engine/SchemaIndex';
+import { SchemaNode } from '@verbb/plugin-kit-forms';
+import { SchemaFormEngineApi } from '../engine/context.js';
 type RadioGroupFieldOption = {
     value: unknown;
     label: string;

package/dist/forms/fields/RadioGroupField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroupField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/RadioGroupField.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAGxD,KAAK,qBAAqB,GAAG;IACzB,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B,CAAC;AAEF,KAAK,oBAAoB,GAAG;IACxB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE,UAAU,GAAG;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,OAAO,CAAC,EAAE,qBAAqB,EAAE,CAAC;QAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,iBAAiB,oBAAoB,4CAsHpE,CAAC"}
+{"version":3,"file":"RadioGroupField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/RadioGroupField.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAI1D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAGhE,KAAK,qBAAqB,GAAG;IACzB,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B,CAAC;AAEF,KAAK,oBAAoB,GAAG;IACxB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE,UAAU,GAAG;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,OAAO,CAAC,EAAE,qBAAqB,EAAE,CAAC;QAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,iBAAiB,oBAAoB,4CAiFpE,CAAC"}

package/dist/forms/fields/RadioGroupField.js

@@ -1,14 +1,12 @@
-import { cn } from "../../utils/classes.js";
-import { evaluateCondition } from "../../utils/schema.js";
-import "../../utils/index.js";
-import { RadioGroup, RadioGroupItem } from "../../components/RadioGroup.js";
+import { RadioGroupInput } from "../../components/RadioGroupInput.js";
 import { FieldLayout } from "../Field.js";
 import { useEngineField } from "../useEngineField.js";
 import { useEffect, useMemo, useSyncExternalStore } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
+import { evaluateCondition } from "@verbb/plugin-kit-forms";
 //#region src/forms/fields/RadioGroupField.tsx
 var RadioGroupField = ({ form, field }) => {
-	const { value, setValue, setTouched, errors, isInvalid } = useEngineField(form, field.name);
+	const { value, setValue, setTouched, errors } = useEngineField(form, field.name);
 	const values = useSyncExternalStore(form.store.subscribe.bind(form.store), () => {
 		return form.store.state.values;
 	}, () => {
@@ -35,7 +33,6 @@ var RadioGroupField = ({ form, field }) => {
 			return evaluateCondition(option.if, conditionData);
 		});
 	}, [conditionData, field.options]);
-	const currentValueKey = value === void 0 || value === null ? void 0 : String(value);
 	useEffect(() => {
 		if (value === void 0 || value === null || value === "") return;
 		if (filteredOptions.some((option) => {
@@ -57,42 +54,20 @@ var RadioGroupField = ({ form, field }) => {
 		warning: field.warning,
 		required: field.required,
 		errors,
-		children: /* @__PURE__ */ jsx(RadioGroup, {
+		children: /* @__PURE__ */ jsx(RadioGroupInput, {
 			name: field.name,
-			value: currentValueKey,
-			onValueChange: (nextValue) => {
-				const matchedOption = filteredOptions.find((option) => {
-					return String(option?.value) === nextValue;
-				});
-				setValue(matchedOption ? matchedOption.value : nextValue);
+			value,
+			options: filteredOptions.map((option) => ({
+				value: option.value,
+				label: option.label,
+				disabled: option.disabled
+			})),
+			onChange: (nextValue) => {
+				setValue(nextValue);
 				setTouched();
 			},
-			"aria-invalid": isInvalid,
 			disabled: field.disabled,
-			className: "gap-3",
-			children: filteredOptions.map((option, index) => {
-				const optionId = `${field.name}-${index}`;
-				const optionValue = String(option.value);
-				const hasDescription = Boolean(option.description);
-				const optionDisabled = field.disabled || option.disabled;
-				return /* @__PURE__ */ jsxs("label", {
-					htmlFor: optionId,
-					className: cn("flex gap-2 text-sm", hasDescription ? "items-start" : "items-center", optionDisabled && "cursor-not-allowed opacity-60"),
-					children: [/* @__PURE__ */ jsx(RadioGroupItem, {
-						id: optionId,
-						value: optionValue,
-						disabled: optionDisabled,
-						"aria-invalid": isInvalid,
-						className: hasDescription ? "mt-0.5" : void 0
-					}), /* @__PURE__ */ jsxs("span", { children: [/* @__PURE__ */ jsx("span", {
-						className: "font-medium text-slate-950",
-						children: option.label
-					}), hasDescription && /* @__PURE__ */ jsx("span", {
-						className: "block text-gray-500",
-						children: option.description
-					})] })]
-				}, optionId);
-			})
+			"aria-label": field.label
 		})
 	});
 };

package/dist/forms/fields/RadioGroupField.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroupField.js","names":[],"sources":["../../../src/forms/fields/RadioGroupField.tsx"],"sourcesContent":["import { useEffect, useMemo, useSyncExternalStore } from 'react';\nimport { RadioGroup, RadioGroupItem } from '@verbb/plugin-kit-react/components/RadioGroup';\nimport { evaluateCondition } from '@verbb/plugin-kit-react/utils/schema';\nimport { cn } from '@verbb/plugin-kit-react/utils';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport type { SchemaNode } from '../engine/SchemaIndex';\nimport { useEngineField } from '../useEngineField';\n\ntype RadioGroupFieldOption = {\n    value: unknown;\n    label: string;\n    description?: string;\n    disabled?: boolean;\n    if?: string;\n    [key: string]: unknown;\n};\n\ntype RadioGroupFieldProps = {\n    form: SchemaFormEngineApi;\n    field: SchemaNode & {\n        name: string;\n        label?: string;\n        instructions?: string;\n        warning?: string;\n        options?: RadioGroupFieldOption[];\n        required?: boolean;\n        disabled?: boolean;\n    };\n};\n\nexport const RadioGroupField = ({ form, field }: RadioGroupFieldProps) => {\n    const {\n        value, setValue, setTouched, errors, isInvalid,\n    } = useEngineField(form, field.name);\n    const values = useSyncExternalStore(\n        form.store.subscribe.bind(form.store),\n        () => { return form.store.state.values; },\n        () => { return form.store.state.values; },\n    );\n\n    const conditionData = useMemo(() => {\n        const scopePath = typeof field._scopePath === 'string' ? field._scopePath : '';\n        const scopedValues = scopePath ? form?.getFieldValue?.(scopePath) : null;\n        const scopedObject = scopedValues && typeof scopedValues === 'object' ? scopedValues : {};\n        const fieldData = (field._data && typeof field._data === 'object') ? field._data : {};\n\n        return {\n            ...(values || {}),\n            ...scopedObject,\n            ...fieldData,\n        };\n    }, [field, form, values]);\n\n    const filteredOptions = useMemo(() => {\n        const options = Array.isArray(field.options) ? field.options : [];\n\n        return options.filter((option) => {\n            if (!option?.if) {\n                return true;\n            }\n\n            return evaluateCondition(option.if, conditionData);\n        });\n    }, [conditionData, field.options]);\n\n    const currentValueKey = value === undefined || value === null ? undefined : String(value);\n\n    useEffect(() => {\n        if (value === undefined || value === null || value === '') {\n            return;\n        }\n\n        const hasCurrentValue = filteredOptions.some((option) => {\n            return String(option?.value) === String(value);\n        });\n\n        if (hasCurrentValue) {\n            return;\n        }\n\n        const fallback = filteredOptions.find((option) => {\n            return option?.value !== undefined && option?.disabled !== true;\n        });\n\n        setValue(fallback ? fallback.value : '');\n    }, [filteredOptions, setValue, value]);\n\n    return (\n        <FieldLayout\n            name={field.name}\n            label={field.label}\n            instructions={field.instructions}\n            warning={field.warning}\n            required={field.required}\n            errors={errors}\n        >\n            <RadioGroup\n                name={field.name}\n                value={currentValueKey}\n                onValueChange={(nextValue) => {\n                    const matchedOption = filteredOptions.find((option) => {\n                        return String(option?.value) === nextValue;\n                    });\n\n                    setValue(matchedOption ? matchedOption.value : nextValue);\n                    setTouched();\n                }}\n                aria-invalid={isInvalid}\n                disabled={field.disabled}\n                className=\"gap-3\"\n            >\n                {filteredOptions.map((option, index) => {\n                    const optionId = `${field.name}-${index}`;\n                    const optionValue = String(option.value);\n                    const hasDescription = Boolean(option.description);\n                    const optionDisabled = field.disabled || option.disabled;\n\n                    return (\n                        <label\n                            key={optionId}\n                            htmlFor={optionId}\n                            className={cn(\n                                'flex gap-2 text-sm',\n                                hasDescription ? 'items-start' : 'items-center',\n                                optionDisabled && 'cursor-not-allowed opacity-60',\n                            )}\n                        >\n                            <RadioGroupItem\n                                id={optionId}\n                                value={optionValue}\n                                disabled={optionDisabled}\n                                aria-invalid={isInvalid}\n                                className={hasDescription ? 'mt-0.5' : undefined}\n                            />\n\n                            <span>\n                                <span className=\"font-medium text-slate-950\">{option.label}</span>\n\n                                {hasDescription && (\n                                    <span className=\"block text-gray-500\">{option.description}</span>\n                                )}\n                            </span>\n                        </label>\n                    );\n                })}\n            </RadioGroup>\n        </FieldLayout>\n    );\n};\n"],"mappings":";;;;;;;;;AA+BA,IAAa,mBAAmB,EAAE,MAAM,YAAkC;CACtE,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;CACpC,MAAM,SAAS,qBACX,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AAAE,SAAO,KAAK,MAAM,MAAM;UAC1B;AAAE,SAAO,KAAK,MAAM,MAAM;GACnC;CAED,MAAM,gBAAgB,cAAc;EAChC,MAAM,YAAY,OAAO,MAAM,eAAe,WAAW,MAAM,aAAa;EAC5E,MAAM,eAAe,YAAY,MAAM,gBAAgB,UAAU,GAAG;EACpE,MAAM,eAAe,gBAAgB,OAAO,iBAAiB,WAAW,eAAe,EAAE;EACzF,MAAM,YAAa,MAAM,SAAS,OAAO,MAAM,UAAU,WAAY,MAAM,QAAQ,EAAE;AAErF,SAAO;GACH,GAAI,UAAU,EAAE;GAChB,GAAG;GACH,GAAG;GACN;IACF;EAAC;EAAO;EAAM;EAAO,CAAC;CAEzB,MAAM,kBAAkB,cAAc;AAGlC,UAFgB,MAAM,QAAQ,MAAM,QAAQ,GAAG,MAAM,UAAU,EAAE,EAElD,QAAQ,WAAW;AAC9B,OAAI,CAAC,QAAQ,GACT,QAAO;AAGX,UAAO,kBAAkB,OAAO,IAAI,cAAc;IACpD;IACH,CAAC,eAAe,MAAM,QAAQ,CAAC;CAElC,MAAM,kBAAkB,UAAU,KAAA,KAAa,UAAU,OAAO,KAAA,IAAY,OAAO,MAAM;AAEzF,iBAAgB;AACZ,MAAI,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU,GACnD;AAOJ,MAJwB,gBAAgB,MAAM,WAAW;AACrD,UAAO,OAAO,QAAQ,MAAM,KAAK,OAAO,MAAM;IAG9C,CACA;EAGJ,MAAM,WAAW,gBAAgB,MAAM,WAAW;AAC9C,UAAO,QAAQ,UAAU,KAAA,KAAa,QAAQ,aAAa;IAC7D;AAEF,WAAS,WAAW,SAAS,QAAQ,GAAG;IACzC;EAAC;EAAiB;EAAU;EAAM,CAAC;AAEtC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;YAER,oBAAC,YAAD;GACI,MAAM,MAAM;GACZ,OAAO;GACP,gBAAgB,cAAc;IAC1B,MAAM,gBAAgB,gBAAgB,MAAM,WAAW;AACnD,YAAO,OAAO,QAAQ,MAAM,KAAK;MACnC;AAEF,aAAS,gBAAgB,cAAc,QAAQ,UAAU;AACzD,gBAAY;;GAEhB,gBAAc;GACd,UAAU,MAAM;GAChB,WAAU;aAET,gBAAgB,KAAK,QAAQ,UAAU;IACpC,MAAM,WAAW,GAAG,MAAM,KAAK,GAAG;IAClC,MAAM,cAAc,OAAO,OAAO,MAAM;IACxC,MAAM,iBAAiB,QAAQ,OAAO,YAAY;IAClD,MAAM,iBAAiB,MAAM,YAAY,OAAO;AAEhD,WACI,qBAAC,SAAD;KAEI,SAAS;KACT,WAAW,GACP,sBACA,iBAAiB,gBAAgB,gBACjC,kBAAkB,gCACrB;eAPL,CASI,oBAAC,gBAAD;MACI,IAAI;MACJ,OAAO;MACP,UAAU;MACV,gBAAc;MACd,WAAW,iBAAiB,WAAW,KAAA;MACzC,CAAA,EAEF,qBAAC,QAAD,EAAA,UAAA,CACI,oBAAC,QAAD;MAAM,WAAU;gBAA8B,OAAO;MAAa,CAAA,EAEjE,kBACG,oBAAC,QAAD;MAAM,WAAU;gBAAuB,OAAO;MAAmB,CAAA,CAElE,EAAA,CAAA,CACH;OAvBC,SAuBD;KAEd;GACO,CAAA;EACH,CAAA"}
+{"version":3,"file":"RadioGroupField.js","names":[],"sources":["../../../src/forms/fields/RadioGroupField.tsx"],"sourcesContent":["import { useEffect, useMemo, useSyncExternalStore } from 'react';\n\nimport { evaluateCondition } from '@verbb/plugin-kit-forms';\nimport type { SchemaNode } from '@verbb/plugin-kit-forms';\n\nimport { RadioGroupInput } from '../../components/RadioGroupInput.js';\nimport { FieldLayout } from '../Field.js';\nimport type { SchemaFormEngineApi } from '../engine/context.js';\nimport { useEngineField } from '../useEngineField.js';\n\ntype RadioGroupFieldOption = {\n    value: unknown;\n    label: string;\n    description?: string;\n    disabled?: boolean;\n    if?: string;\n    [key: string]: unknown;\n};\n\ntype RadioGroupFieldProps = {\n    form: SchemaFormEngineApi;\n    field: SchemaNode & {\n        name: string;\n        label?: string;\n        instructions?: string;\n        warning?: string;\n        options?: RadioGroupFieldOption[];\n        required?: boolean;\n        disabled?: boolean;\n    };\n};\n\nexport const RadioGroupField = ({ form, field }: RadioGroupFieldProps) => {\n    const {\n        value, setValue, setTouched, errors,\n    } = useEngineField(form, field.name);\n    const values = useSyncExternalStore(\n        form.store.subscribe.bind(form.store),\n        () => { return form.store.state.values; },\n        () => { return form.store.state.values; },\n    );\n\n    const conditionData = useMemo(() => {\n        const scopePath = typeof field._scopePath === 'string' ? field._scopePath : '';\n        const scopedValues = scopePath ? form?.getFieldValue?.(scopePath) : null;\n        const scopedObject = scopedValues && typeof scopedValues === 'object' ? scopedValues : {};\n        const fieldData = (field._data && typeof field._data === 'object') ? field._data : {};\n\n        return {\n            ...(values || {}),\n            ...scopedObject,\n            ...fieldData,\n        };\n    }, [field, form, values]);\n\n    const filteredOptions = useMemo(() => {\n        const options = Array.isArray(field.options) ? field.options : [];\n\n        return options.filter((option) => {\n            if (!option?.if) {\n                return true;\n            }\n\n            return evaluateCondition(option.if, conditionData);\n        });\n    }, [conditionData, field.options]);\n\n    useEffect(() => {\n        if (value === undefined || value === null || value === '') {\n            return;\n        }\n\n        const hasCurrentValue = filteredOptions.some((option) => {\n            return String(option?.value) === String(value);\n        });\n\n        if (hasCurrentValue) {\n            return;\n        }\n\n        const fallback = filteredOptions.find((option) => {\n            return option?.value !== undefined && option?.disabled !== true;\n        });\n\n        setValue(fallback ? fallback.value : '');\n    }, [filteredOptions, setValue, value]);\n\n    return (\n        <FieldLayout\n            name={field.name}\n            label={field.label}\n            instructions={field.instructions}\n            warning={field.warning}\n            required={field.required}\n            errors={errors}\n        >\n            <RadioGroupInput\n                name={field.name}\n                value={value}\n                options={filteredOptions.map((option) => ({\n                    value: option.value,\n                    label: option.label,\n                    disabled: option.disabled,\n                }))}\n                onChange={(nextValue) => {\n                    setValue(nextValue);\n                    setTouched();\n                }}\n                disabled={field.disabled}\n                aria-label={field.label}\n            />\n        </FieldLayout>\n    );\n};\n"],"mappings":";;;;;;;AAgCA,IAAa,mBAAmB,EAAE,MAAM,YAAkC;CACtE,MAAM,EACF,OAAO,UAAU,YAAY,WAC7B,eAAe,MAAM,MAAM,KAAK;CACpC,MAAM,SAAS,qBACX,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AAAE,SAAO,KAAK,MAAM,MAAM;UAC1B;AAAE,SAAO,KAAK,MAAM,MAAM;GACnC;CAED,MAAM,gBAAgB,cAAc;EAChC,MAAM,YAAY,OAAO,MAAM,eAAe,WAAW,MAAM,aAAa;EAC5E,MAAM,eAAe,YAAY,MAAM,gBAAgB,UAAU,GAAG;EACpE,MAAM,eAAe,gBAAgB,OAAO,iBAAiB,WAAW,eAAe,EAAE;EACzF,MAAM,YAAa,MAAM,SAAS,OAAO,MAAM,UAAU,WAAY,MAAM,QAAQ,EAAE;AAErF,SAAO;GACH,GAAI,UAAU,EAAE;GAChB,GAAG;GACH,GAAG;GACN;IACF;EAAC;EAAO;EAAM;EAAO,CAAC;CAEzB,MAAM,kBAAkB,cAAc;AAGlC,UAFgB,MAAM,QAAQ,MAAM,QAAQ,GAAG,MAAM,UAAU,EAAE,EAElD,QAAQ,WAAW;AAC9B,OAAI,CAAC,QAAQ,GACT,QAAO;AAGX,UAAO,kBAAkB,OAAO,IAAI,cAAc;IACpD;IACH,CAAC,eAAe,MAAM,QAAQ,CAAC;AAElC,iBAAgB;AACZ,MAAI,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU,GACnD;AAOJ,MAJwB,gBAAgB,MAAM,WAAW;AACrD,UAAO,OAAO,QAAQ,MAAM,KAAK,OAAO,MAAM;IAG9C,CACA;EAGJ,MAAM,WAAW,gBAAgB,MAAM,WAAW;AAC9C,UAAO,QAAQ,UAAU,KAAA,KAAa,QAAQ,aAAa;IAC7D;AAEF,WAAS,WAAW,SAAS,QAAQ,GAAG;IACzC;EAAC;EAAiB;EAAU;EAAM,CAAC;AAEtC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;YAER,oBAAC,iBAAD;GACI,MAAM,MAAM;GACL;GACP,SAAS,gBAAgB,KAAK,YAAY;IACtC,OAAO,OAAO;IACd,OAAO,OAAO;IACd,UAAU,OAAO;IACpB,EAAE;GACH,WAAW,cAAc;AACrB,aAAS,UAAU;AACnB,gBAAY;;GAEhB,UAAU,MAAM;GAChB,cAAY,MAAM;GACpB,CAAA;EACQ,CAAA"}

package/dist/forms/fields/SelectField.d.ts

@@ -1,5 +1,5 @@
-import { SchemaFormEngineApi } from '../engine/context';
-import { SchemaNode } from '../engine/SchemaIndex';
+import { SchemaNode } from '@verbb/plugin-kit-forms';
+import { SchemaFormEngineApi } from '../engine/context.js';
 type SelectFieldOption = {
     value: unknown;
     label: string;

package/dist/forms/fields/SelectField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/SelectField.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAGxD,KAAK,iBAAiB,GAAG;IACrB,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACpB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE,UAAU,GAAG;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;QAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;CACL,CAAC;AAIF,eAAO,MAAM,WAAW,GAAI,iBAAiB,gBAAgB,4CA2E5D,CAAC"}
+{"version":3,"file":"SelectField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/SelectField.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAI1D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAGhE,KAAK,iBAAiB,GAAG;IACrB,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B,CAAC;AAEF,KAAK,gBAAgB,GAAG;IACpB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE,UAAU,GAAG;QAChB,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,OAAO,CAAC,EAAE,iBAAiB,EAAE,CAAC;QAC9B,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACtB,CAAC;CACL,CAAC;AAIF,eAAO,MAAM,WAAW,GAAI,iBAAiB,gBAAgB,4CA2E5D,CAAC"}

package/dist/forms/fields/SelectField.js

@@ -1,10 +1,9 @@
-import { evaluateCondition } from "../../utils/schema.js";
 import { SelectInput } from "../../components/SelectInput.js";
-import "../../components/index.js";
 import { FieldLayout } from "../Field.js";
 import { useEngineField } from "../useEngineField.js";
 import { useEffect, useMemo, useSyncExternalStore } from "react";
 import { jsx } from "react/jsx-runtime";
+import { evaluateCondition } from "@verbb/plugin-kit-forms";
 //#region src/forms/fields/SelectField.tsx
 var SelectField = ({ form, field }) => {
 	const { value, setValue, setTouched, errors, isInvalid } = useEngineField(form, field.name);

package/dist/forms/fields/SelectField.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectField.js","names":[],"sources":["../../../src/forms/fields/SelectField.tsx"],"sourcesContent":["import type React from 'react';\nimport { SelectInput } from '@verbb/plugin-kit-react/components';\nimport { evaluateCondition } from '@verbb/plugin-kit-react/utils/schema';\nimport { useEffect, useMemo, useSyncExternalStore } from 'react';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport type { SchemaNode } from '../engine/SchemaIndex';\nimport { useEngineField } from '../useEngineField';\n\ntype SelectFieldOption = {\n    value: unknown;\n    label: string;\n    disabled?: boolean;\n    if?: string;\n    [key: string]: unknown;\n};\n\ntype SelectFieldProps = {\n    form: SchemaFormEngineApi;\n    field: SchemaNode & {\n        name: string;\n        label?: string;\n        instructions?: string;\n        warning?: string;\n        placeholder?: string;\n        options?: SelectFieldOption[];\n        required?: boolean;\n        disabled?: boolean;\n    };\n};\n\ntype SelectInputProps = React.ComponentProps<typeof SelectInput>;\n\nexport const SelectField = ({ form, field }: SelectFieldProps) => {\n    const {\n        value, setValue, setTouched, errors, isInvalid,\n    } = useEngineField(form, field.name);\n    const values = useSyncExternalStore(\n        form.store.subscribe.bind(form.store),\n        () => { return form.store.state.values; },\n        () => { return form.store.state.values; },\n    );\n\n    const conditionData = useMemo(() => {\n        const scopePath = typeof field._scopePath === 'string' ? field._scopePath : '';\n        const scopedValues = scopePath ? form?.getFieldValue?.(scopePath) : null;\n        const scopedObject = scopedValues && typeof scopedValues === 'object' ? scopedValues : {};\n        const fieldData = (field._data && typeof field._data === 'object') ? field._data : {};\n\n        return {\n            ...(values || {}),\n            ...scopedObject,\n            ...fieldData,\n        };\n    }, [field, form, values]);\n\n    const filteredOptions = useMemo(() => {\n        const options = Array.isArray(field.options) ? field.options : [];\n\n        return options.filter((option) => {\n            if (!option?.if) {\n                return true;\n            }\n\n            return evaluateCondition(option.if, conditionData);\n        });\n    }, [conditionData, field.options]);\n\n    useEffect(() => {\n        if (value === undefined || value === null || value === '') {\n            return;\n        }\n\n        const hasCurrentValue = filteredOptions.some((option) => {\n            return String(option?.value) === String(value);\n        });\n\n        if (hasCurrentValue) {\n            return;\n        }\n\n        const fallback = filteredOptions.find((option) => {\n            return option?.value !== undefined && option?.disabled !== true;\n        });\n\n        setValue(fallback ? fallback.value : '');\n    }, [filteredOptions, setValue, value]);\n\n    return (\n        <FieldLayout\n            name={field.name}\n            label={field.label}\n            instructions={field.instructions}\n            warning={field.warning}\n            required={field.required}\n            errors={errors}\n        >\n            <SelectInput\n                options={filteredOptions}\n                placeholder={field.placeholder}\n                value={value ?? ''}\n                onChange={(nextValue) => { return setValue(nextValue); }}\n                isInvalid={isInvalid}\n                onBlur={setTouched as SelectInputProps['onBlur']}\n                disabled={field.disabled}\n            />\n        </FieldLayout>\n    );\n};\n"],"mappings":";;;;;;;;AAiCA,IAAa,eAAe,EAAE,MAAM,YAA8B;CAC9D,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;CACpC,MAAM,SAAS,qBACX,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AAAE,SAAO,KAAK,MAAM,MAAM;UAC1B;AAAE,SAAO,KAAK,MAAM,MAAM;GACnC;CAED,MAAM,gBAAgB,cAAc;EAChC,MAAM,YAAY,OAAO,MAAM,eAAe,WAAW,MAAM,aAAa;EAC5E,MAAM,eAAe,YAAY,MAAM,gBAAgB,UAAU,GAAG;EACpE,MAAM,eAAe,gBAAgB,OAAO,iBAAiB,WAAW,eAAe,EAAE;EACzF,MAAM,YAAa,MAAM,SAAS,OAAO,MAAM,UAAU,WAAY,MAAM,QAAQ,EAAE;AAErF,SAAO;GACH,GAAI,UAAU,EAAE;GAChB,GAAG;GACH,GAAG;GACN;IACF;EAAC;EAAO;EAAM;EAAO,CAAC;CAEzB,MAAM,kBAAkB,cAAc;AAGlC,UAFgB,MAAM,QAAQ,MAAM,QAAQ,GAAG,MAAM,UAAU,EAAE,EAElD,QAAQ,WAAW;AAC9B,OAAI,CAAC,QAAQ,GACT,QAAO;AAGX,UAAO,kBAAkB,OAAO,IAAI,cAAc;IACpD;IACH,CAAC,eAAe,MAAM,QAAQ,CAAC;AAElC,iBAAgB;AACZ,MAAI,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU,GACnD;AAOJ,MAJwB,gBAAgB,MAAM,WAAW;AACrD,UAAO,OAAO,QAAQ,MAAM,KAAK,OAAO,MAAM;IAG9C,CACA;EAGJ,MAAM,WAAW,gBAAgB,MAAM,WAAW;AAC9C,UAAO,QAAQ,UAAU,KAAA,KAAa,QAAQ,aAAa;IAC7D;AAEF,WAAS,WAAW,SAAS,QAAQ,GAAG;IACzC;EAAC;EAAiB;EAAU;EAAM,CAAC;AAEtC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;YAER,oBAAC,aAAD;GACI,SAAS;GACT,aAAa,MAAM;GACnB,OAAO,SAAS;GAChB,WAAW,cAAc;AAAE,WAAO,SAAS,UAAU;;GAC1C;GACX,QAAQ;GACR,UAAU,MAAM;GAClB,CAAA;EACQ,CAAA"}
+{"version":3,"file":"SelectField.js","names":[],"sources":["../../../src/forms/fields/SelectField.tsx"],"sourcesContent":["import { useEffect, useMemo, useSyncExternalStore } from 'react';\nimport type React from 'react';\n\nimport { evaluateCondition } from '@verbb/plugin-kit-forms';\nimport type { SchemaNode } from '@verbb/plugin-kit-forms';\n\nimport { SelectInput } from '../../components/SelectInput.js';\nimport { FieldLayout } from '../Field.js';\nimport type { SchemaFormEngineApi } from '../engine/context.js';\nimport { useEngineField } from '../useEngineField.js';\n\ntype SelectFieldOption = {\n    value: unknown;\n    label: string;\n    disabled?: boolean;\n    if?: string;\n    [key: string]: unknown;\n};\n\ntype SelectFieldProps = {\n    form: SchemaFormEngineApi;\n    field: SchemaNode & {\n        name: string;\n        label?: string;\n        instructions?: string;\n        warning?: string;\n        placeholder?: string;\n        options?: SelectFieldOption[];\n        required?: boolean;\n        disabled?: boolean;\n    };\n};\n\ntype SelectInputProps = React.ComponentProps<typeof SelectInput>;\n\nexport const SelectField = ({ form, field }: SelectFieldProps) => {\n    const {\n        value, setValue, setTouched, errors, isInvalid,\n    } = useEngineField(form, field.name);\n    const values = useSyncExternalStore(\n        form.store.subscribe.bind(form.store),\n        () => { return form.store.state.values; },\n        () => { return form.store.state.values; },\n    );\n\n    const conditionData = useMemo(() => {\n        const scopePath = typeof field._scopePath === 'string' ? field._scopePath : '';\n        const scopedValues = scopePath ? form?.getFieldValue?.(scopePath) : null;\n        const scopedObject = scopedValues && typeof scopedValues === 'object' ? scopedValues : {};\n        const fieldData = (field._data && typeof field._data === 'object') ? field._data : {};\n\n        return {\n            ...(values || {}),\n            ...scopedObject,\n            ...fieldData,\n        };\n    }, [field, form, values]);\n\n    const filteredOptions = useMemo(() => {\n        const options = Array.isArray(field.options) ? field.options : [];\n\n        return options.filter((option) => {\n            if (!option?.if) {\n                return true;\n            }\n\n            return evaluateCondition(option.if, conditionData);\n        });\n    }, [conditionData, field.options]);\n\n    useEffect(() => {\n        if (value === undefined || value === null || value === '') {\n            return;\n        }\n\n        const hasCurrentValue = filteredOptions.some((option) => {\n            return String(option?.value) === String(value);\n        });\n\n        if (hasCurrentValue) {\n            return;\n        }\n\n        const fallback = filteredOptions.find((option) => {\n            return option?.value !== undefined && option?.disabled !== true;\n        });\n\n        setValue(fallback ? fallback.value : '');\n    }, [filteredOptions, setValue, value]);\n\n    return (\n        <FieldLayout\n            name={field.name}\n            label={field.label}\n            instructions={field.instructions}\n            warning={field.warning}\n            required={field.required}\n            errors={errors}\n        >\n            <SelectInput\n                options={filteredOptions}\n                placeholder={field.placeholder}\n                value={value ?? ''}\n                onChange={(nextValue) => { return setValue(nextValue); }}\n                isInvalid={isInvalid}\n                onBlur={setTouched as SelectInputProps['onBlur']}\n                disabled={field.disabled}\n            />\n        </FieldLayout>\n    );\n};\n"],"mappings":";;;;;;;AAmCA,IAAa,eAAe,EAAE,MAAM,YAA8B;CAC9D,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;CACpC,MAAM,SAAS,qBACX,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AAAE,SAAO,KAAK,MAAM,MAAM;UAC1B;AAAE,SAAO,KAAK,MAAM,MAAM;GACnC;CAED,MAAM,gBAAgB,cAAc;EAChC,MAAM,YAAY,OAAO,MAAM,eAAe,WAAW,MAAM,aAAa;EAC5E,MAAM,eAAe,YAAY,MAAM,gBAAgB,UAAU,GAAG;EACpE,MAAM,eAAe,gBAAgB,OAAO,iBAAiB,WAAW,eAAe,EAAE;EACzF,MAAM,YAAa,MAAM,SAAS,OAAO,MAAM,UAAU,WAAY,MAAM,QAAQ,EAAE;AAErF,SAAO;GACH,GAAI,UAAU,EAAE;GAChB,GAAG;GACH,GAAG;GACN;IACF;EAAC;EAAO;EAAM;EAAO,CAAC;CAEzB,MAAM,kBAAkB,cAAc;AAGlC,UAFgB,MAAM,QAAQ,MAAM,QAAQ,GAAG,MAAM,UAAU,EAAE,EAElD,QAAQ,WAAW;AAC9B,OAAI,CAAC,QAAQ,GACT,QAAO;AAGX,UAAO,kBAAkB,OAAO,IAAI,cAAc;IACpD;IACH,CAAC,eAAe,MAAM,QAAQ,CAAC;AAElC,iBAAgB;AACZ,MAAI,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU,GACnD;AAOJ,MAJwB,gBAAgB,MAAM,WAAW;AACrD,UAAO,OAAO,QAAQ,MAAM,KAAK,OAAO,MAAM;IAG9C,CACA;EAGJ,MAAM,WAAW,gBAAgB,MAAM,WAAW;AAC9C,UAAO,QAAQ,UAAU,KAAA,KAAa,QAAQ,aAAa;IAC7D;AAEF,WAAS,WAAW,SAAS,QAAQ,GAAG;IACzC;EAAC;EAAiB;EAAU;EAAM,CAAC;AAEtC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EACR;YAER,oBAAC,aAAD;GACI,SAAS;GACT,aAAa,MAAM;GACnB,OAAO,SAAS;GAChB,WAAW,cAAc;AAAE,WAAO,SAAS,UAAU;;GAC1C;GACX,QAAQ;GACR,UAAU,MAAM;GAClB,CAAA;EACQ,CAAA"}

package/dist/forms/fields/TextField.d.ts

@@ -1,4 +1,4 @@
-import { SchemaFormEngineApi } from '../engine/context';
+import { SchemaFormEngineApi } from '../engine/context.js';
 type TextFieldProps = {
     form: SchemaFormEngineApi;
     field: {

package/dist/forms/fields/TextField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/TextField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAG7D,KAAK,cAAc,GAAG;IAClB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,YAAY,CAAC,EAAE,OAAO,CAAC;KAC1B,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,iBAAiB,cAAc,4CAyBxD,CAAC"}
+{"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/TextField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAGhE,KAAK,cAAc,GAAG;IAClB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,YAAY,CAAC,EAAE,OAAO,CAAC;KAC1B,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,iBAAiB,cAAc,4CAyBxD,CAAC"}

package/dist/forms/fields/TextField.js

@@ -1,5 +1,4 @@
 import { Input } from "../../components/Input.js";
-import "../../components/index.js";
 import { FieldLayout } from "../Field.js";
 import { useEngineField } from "../useEngineField.js";
 import { jsx } from "react/jsx-runtime";
@@ -16,13 +15,13 @@ var TextField = ({ form, field }) => {
 		errors,
 		children: /* @__PURE__ */ jsx(Input, {
 			value: String(value ?? ""),
-			onChange: (event) => {
-				return setValue(event.target.value);
+			onInput: (event) => {
+				return setValue(event.target.value ?? "");
 			},
 			onBlur: setTouched,
 			placeholder: field.placeholder,
 			disabled: field.disabled,
-			"aria-invalid": isInvalid
+			invalid: isInvalid
 		})
 	});
 };

package/dist/forms/fields/TextField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.js","names":[],"sources":["../../../src/forms/fields/TextField.tsx"],"sourcesContent":["import { Input } from '@verbb/plugin-kit-react/components';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport { useEngineField } from '../useEngineField';\n\ntype TextFieldProps = {\n    form: SchemaFormEngineApi;\n    field: {\n        name: string;\n        label?: string;\n        instructions?: string;\n        warning?: string;\n        placeholder?: string;\n        required?: boolean;\n        disabled?: boolean;\n        translatable?: boolean;\n    };\n};\n\nexport const TextField = ({ form, field }: TextFieldProps) => {\n    const {\n        value, setValue, setTouched, errors, isInvalid,\n    } = useEngineField(form, field.name);\n\n    return (\n        <FieldLayout\n            name={field.name}\n            label={field.label}\n            instructions={field.instructions}\n            warning={field.warning}\n            required={field.required}\n            translatable={field.translatable}\n            errors={errors}\n        >\n            <Input\n                value={String(value ?? '')}\n                onChange={(event) => { return setValue(event.target.value); }}\n                onBlur={setTouched}\n                placeholder={field.placeholder}\n                disabled={field.disabled}\n                aria-invalid={isInvalid}\n            />\n        </FieldLayout>\n    );\n};\n"],"mappings":";;;;;;AAmBA,IAAa,aAAa,EAAE,MAAM,YAA4B;CAC1D,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;AAEpC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EAChB,cAAc,MAAM;EACZ;YAER,oBAAC,OAAD;GACI,OAAO,OAAO,SAAS,GAAG;GAC1B,WAAW,UAAU;AAAE,WAAO,SAAS,MAAM,OAAO,MAAM;;GAC1D,QAAQ;GACR,aAAa,MAAM;GACnB,UAAU,MAAM;GAChB,gBAAc;GAChB,CAAA;EACQ,CAAA"}
+{"version":3,"file":"TextField.js","names":[],"sources":["../../../src/forms/fields/TextField.tsx"],"sourcesContent":["import { Input } from '../../components/Input.js';\nimport { FieldLayout } from '../Field.js';\nimport type { SchemaFormEngineApi } from '../engine/context.js';\nimport { useEngineField } from '../useEngineField.js';\n\ntype TextFieldProps = {\n    form: SchemaFormEngineApi;\n    field: {\n        name: string;\n        label?: string;\n        instructions?: string;\n        warning?: string;\n        placeholder?: string;\n        required?: boolean;\n        disabled?: boolean;\n        translatable?: boolean;\n    };\n};\n\nexport const TextField = ({ form, field }: TextFieldProps) => {\n    const {\n        value, setValue, setTouched, errors, isInvalid,\n    } = useEngineField(form, field.name);\n\n    return (\n        <FieldLayout\n            name={field.name}\n            label={field.label}\n            instructions={field.instructions}\n            warning={field.warning}\n            required={field.required}\n            translatable={field.translatable}\n            errors={errors}\n        >\n            <Input\n                value={String(value ?? '')}\n                onInput={(event) => { return setValue((event.target as { value?: string }).value ?? ''); }}\n                onBlur={setTouched}\n                placeholder={field.placeholder}\n                disabled={field.disabled}\n                invalid={isInvalid}\n            />\n        </FieldLayout>\n    );\n};\n"],"mappings":";;;;;AAmBA,IAAa,aAAa,EAAE,MAAM,YAA4B;CAC1D,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;AAEpC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EAChB,cAAc,MAAM;EACZ;YAER,oBAAC,OAAD;GACI,OAAO,OAAO,SAAS,GAAG;GAC1B,UAAU,UAAU;AAAE,WAAO,SAAU,MAAM,OAA8B,SAAS,GAAG;;GACvF,QAAQ;GACR,aAAa,MAAM;GACnB,UAAU,MAAM;GAChB,SAAS;GACX,CAAA;EACQ,CAAA"}

package/dist/forms/fields/TextareaField.d.ts

@@ -1,4 +1,4 @@
-import { SchemaFormEngineApi } from '../engine/context';
+import { SchemaFormEngineApi } from '../engine/context.js';
 type TextareaFieldProps = {
     form: SchemaFormEngineApi;
     field: {

package/dist/forms/fields/TextareaField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextareaField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/TextareaField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AAG7D,KAAK,kBAAkB,GAAG;IACtB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,YAAY,CAAC,EAAE,OAAO,CAAC;KAC1B,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,iBAAiB,kBAAkB,4CA0BhE,CAAC"}
+{"version":3,"file":"TextareaField.d.ts","sourceRoot":"","sources":["../../../src/forms/fields/TextareaField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAGhE,KAAK,kBAAkB,GAAG;IACtB,IAAI,EAAE,mBAAmB,CAAC;IAC1B,KAAK,EAAE;QACH,IAAI,EAAE,MAAM,CAAC;QACb,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,YAAY,CAAC,EAAE,OAAO,CAAC;KAC1B,CAAC;CACL,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,iBAAiB,kBAAkB,4CAyBhE,CAAC"}

package/dist/forms/fields/TextareaField.js

@@ -1,5 +1,4 @@
 import { Textarea } from "../../components/Textarea.js";
-import "../../components/index.js";
 import { FieldLayout } from "../Field.js";
 import { useEngineField } from "../useEngineField.js";
 import { jsx } from "react/jsx-runtime";
@@ -16,14 +15,13 @@ var TextareaField = ({ form, field }) => {
 		errors,
 		children: /* @__PURE__ */ jsx(Textarea, {
 			value: String(value ?? ""),
-			onChange: (event) => {
-				return setValue(event.target.value);
+			onInput: (event) => {
+				return setValue(event.target.value ?? "");
 			},
 			onBlur: setTouched,
 			placeholder: field.placeholder,
 			disabled: field.disabled,
-			rows: field.rows,
-			"aria-invalid": isInvalid
+			invalid: isInvalid
 		})
 	});
 };

package/dist/forms/fields/TextareaField.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextareaField.js","names":[],"sources":["../../../src/forms/fields/TextareaField.tsx"],"sourcesContent":["import { Textarea } from '@verbb/plugin-kit-react/components';\nimport { FieldLayout } from '../Field';\nimport type { SchemaFormEngineApi } from '../engine/context';\nimport { useEngineField } from '../useEngineField';\n\ntype TextareaFieldProps = {\n    form: SchemaFormEngineApi;\n    field: {\n        name: string;\n        label?: string;\n        instructions?: string;\n        warning?: string;\n        placeholder?: string;\n        rows?: number;\n        required?: boolean;\n        disabled?: boolean;\n        translatable?: boolean;\n    };\n};\n\nexport const TextareaField = ({ form, field }: TextareaFieldProps) => {\n    const {\n        value, setValue, setTouched, errors, isInvalid,\n    } = useEngineField(form, field.name);\n\n    return (\n        <FieldLayout\n            name={field.name}\n            label={field.label}\n            instructions={field.instructions}\n            warning={field.warning}\n            required={field.required}\n            translatable={field.translatable}\n            errors={errors}\n        >\n            <Textarea\n                value={String(value ?? '')}\n                onChange={(event) => { return setValue(event.target.value); }}\n                onBlur={setTouched}\n                placeholder={field.placeholder}\n                disabled={field.disabled}\n                rows={field.rows}\n                aria-invalid={isInvalid}\n            />\n        </FieldLayout>\n    );\n};\n"],"mappings":";;;;;;AAoBA,IAAa,iBAAiB,EAAE,MAAM,YAAgC;CAClE,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;AAEpC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EAChB,cAAc,MAAM;EACZ;YAER,oBAAC,UAAD;GACI,OAAO,OAAO,SAAS,GAAG;GAC1B,WAAW,UAAU;AAAE,WAAO,SAAS,MAAM,OAAO,MAAM;;GAC1D,QAAQ;GACR,aAAa,MAAM;GACnB,UAAU,MAAM;GAChB,MAAM,MAAM;GACZ,gBAAc;GAChB,CAAA;EACQ,CAAA"}
+{"version":3,"file":"TextareaField.js","names":[],"sources":["../../../src/forms/fields/TextareaField.tsx"],"sourcesContent":["import { Textarea } from '../../components/Textarea.js';\nimport { FieldLayout } from '../Field.js';\nimport type { SchemaFormEngineApi } from '../engine/context.js';\nimport { useEngineField } from '../useEngineField.js';\n\ntype TextareaFieldProps = {\n    form: SchemaFormEngineApi;\n    field: {\n        name: string;\n        label?: string;\n        instructions?: string;\n        warning?: string;\n        placeholder?: string;\n        rows?: number;\n        required?: boolean;\n        disabled?: boolean;\n        translatable?: boolean;\n    };\n};\n\nexport const TextareaField = ({ form, field }: TextareaFieldProps) => {\n    const {\n        value, setValue, setTouched, errors, isInvalid,\n    } = useEngineField(form, field.name);\n\n    return (\n        <FieldLayout\n            name={field.name}\n            label={field.label}\n            instructions={field.instructions}\n            warning={field.warning}\n            required={field.required}\n            translatable={field.translatable}\n            errors={errors}\n        >\n            <Textarea\n                value={String(value ?? '')}\n                onInput={(event) => { return setValue((event.target as { value?: string }).value ?? ''); }}\n                onBlur={setTouched}\n                placeholder={field.placeholder}\n                disabled={field.disabled}\n                invalid={isInvalid}\n            />\n        </FieldLayout>\n    );\n};\n"],"mappings":";;;;;AAoBA,IAAa,iBAAiB,EAAE,MAAM,YAAgC;CAClE,MAAM,EACF,OAAO,UAAU,YAAY,QAAQ,cACrC,eAAe,MAAM,MAAM,KAAK;AAEpC,QACI,oBAAC,aAAD;EACI,MAAM,MAAM;EACZ,OAAO,MAAM;EACb,cAAc,MAAM;EACpB,SAAS,MAAM;EACf,UAAU,MAAM;EAChB,cAAc,MAAM;EACZ;YAER,oBAAC,UAAD;GACI,OAAO,OAAO,SAAS,GAAG;GAC1B,UAAU,UAAU;AAAE,WAAO,SAAU,MAAM,OAA8B,SAAS,GAAG;;GACvF,QAAQ;GACR,aAAa,MAAM;GACnB,UAAU,MAAM;GAChB,SAAS;GACX,CAAA;EACQ,CAAA"}

package/dist/forms/index.d.ts

@@ -1,8 +1,13 @@
-export * from './SchemaFormEngine';
-export * from './Field';
-export * from './useEngineField';
-export * from './useEditableTableFieldBinding';
-export * from './registry';
-export * from './components';
-export * from './contexts/VariableCategoriesContext';
+/** SchemaForm engine. Built-in `$field` types load lazily on first render. */
+export * from './SchemaFormEngine.js';
+export * from './Field.js';
+export * from './useEngineField.js';
+export * from './registry.js';
+export * from './engine/context.js';
+export { normalizeAttrs } from './utils.js';
+export { isBuiltinFormFieldType, loadBuiltinFormField } from './builtin-field-loaders.js';
+export { parseDateTimeParts, formatDateTimeParts, type DateTimeParts } from './datetime.js';
+export { assertSchemaRegistry, debugSchemaRegistry, type AssertSchemaRegistryOptions, type SchemaRegistryIssue, } from './assertSchemaRegistry.js';
+/** Built-in `$cmp` wrappers (`ModalTabs*`, `FieldWrap`) — auto-registered via `./registry`. */
+export { FieldWrap, ModalTabs, ModalTabsList, ModalTabsTrigger, ModalTabsContent, useModalTabsErrors, } from './components/index.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/forms/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/forms/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC;AACxB,cAAc,kBAAkB,CAAC;AACjC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,sCAAsC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/forms/index.ts"],"names":[],"mappings":"AAAA,8EAA8E;AAC9E,cAAc,uBAAuB,CAAC;AACtC,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,YAAY,CAAC;AAC5C,OAAO,EAAE,sBAAsB,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAE1F,OAAO,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,KAAK,aAAa,EAAE,MAAM,eAAe,CAAC;AAC5F,OAAO,EACH,oBAAoB,EACpB,mBAAmB,EACnB,KAAK,2BAA2B,EAChC,KAAK,mBAAmB,GAC3B,MAAM,2BAA2B,CAAC;AAEnC,+FAA+F;AAC/F,OAAO,EACH,SAAS,EACT,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,gBAAgB,EAChB,kBAAkB,GACrB,MAAM,uBAAuB,CAAC"}

package/dist/forms/index.js

@@ -1,10 +1,12 @@
-import { FieldControl, FieldErrors, FieldHeader, FieldInstructions, FieldLabel, FieldLayout, FieldRoot, InlineFieldErrorVisibilityContext, useFieldContext } from "./Field.js";
-import { useEngineField } from "./useEngineField.js";
-import { useEditableTableFieldBinding } from "./useEditableTableFieldBinding.js";
-import { VariableCategoriesProvider, useVariableCategoriesContext } from "./contexts/VariableCategoriesContext.js";
+import { normalizeAttrs } from "./utils.js";
+import { FieldLayout } from "./Field.js";
+import { SchemaEngineContext, useSchemaEngineContext } from "./engine/context.js";
 import { FieldWrap } from "./components/FieldWrap.js";
 import { ModalTabs, ModalTabsContent, ModalTabsList, ModalTabsTrigger, useModalTabsErrors } from "./components/ModalTabs.js";
-import "./components/index.js";
-import { getFormComponentRegistry, getFormFieldRegistry, registerFormComponent, registerFormComponents, registerFormField, registerFormFields } from "./registry.js";
+import { cacheLoadedBuiltinFormField, getFormComponentRegistry, getFormFieldRegistry, getRegisteredFormField, registerFormComponent, registerFormComponents, registerFormField, registerFormFields } from "./registry.js";
+import { isBuiltinFormFieldType, loadBuiltinFormField } from "./builtin-field-loaders.js";
 import { SchemaFormEngine, useSchemaFormEngine } from "./SchemaFormEngine.js";
-export { FieldControl, FieldErrors, FieldHeader, FieldInstructions, FieldLabel, FieldLayout, FieldRoot, FieldWrap, InlineFieldErrorVisibilityContext, ModalTabs, ModalTabsContent, ModalTabsList, ModalTabsTrigger, SchemaFormEngine, VariableCategoriesProvider, getFormComponentRegistry, getFormFieldRegistry, registerFormComponent, registerFormComponents, registerFormField, registerFormFields, useEditableTableFieldBinding, useEngineField, useFieldContext, useModalTabsErrors, useSchemaFormEngine, useVariableCategoriesContext };
+import { useEngineField } from "./useEngineField.js";
+import { formatDateTimeParts, parseDateTimeParts } from "./datetime.js";
+import { assertSchemaRegistry, debugSchemaRegistry } from "./assertSchemaRegistry.js";
+export { FieldLayout, FieldWrap, ModalTabs, ModalTabsContent, ModalTabsList, ModalTabsTrigger, SchemaEngineContext, SchemaFormEngine, assertSchemaRegistry, cacheLoadedBuiltinFormField, debugSchemaRegistry, formatDateTimeParts, getFormComponentRegistry, getFormFieldRegistry, getRegisteredFormField, isBuiltinFormFieldType, loadBuiltinFormField, normalizeAttrs, parseDateTimeParts, registerFormComponent, registerFormComponents, registerFormField, registerFormFields, useEngineField, useModalTabsErrors, useSchemaEngineContext, useSchemaFormEngine };

package/dist/forms/registry.d.ts

@@ -1,8 +1,11 @@
-import { SchemaFormComponent, SchemaFormFieldComponent } from './engine/context';
+import { SchemaFormComponent, SchemaFormFieldComponent } from './engine/context.js';
+/** Override a built-in field or register a custom `$field` type plugin-kit does not ship. */
 export declare const registerFormField: (name: string, component: SchemaFormFieldComponent) => void;
 export declare const registerFormFields: (fields: Record<string, SchemaFormFieldComponent>) => void;
 export declare const registerFormComponent: (name: string, component: SchemaFormComponent) => void;
 export declare const registerFormComponents: (components: Record<string, SchemaFormComponent>) => void;
+export declare const cacheLoadedBuiltinFormField: (name: string, component: SchemaFormFieldComponent) => void;
+export declare const getRegisteredFormField: (name: string) => SchemaFormFieldComponent | undefined;
 export declare const getFormFieldRegistry: () => Record<string, SchemaFormFieldComponent>;
 export declare const getFormComponentRegistry: () => Record<string, SchemaFormComponent>;
 //# sourceMappingURL=registry.d.ts.map

package/dist/forms/registry.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../src/forms/registry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,kBAAkB,CAAC;AA+EtF,eAAO,MAAM,iBAAiB,GAAI,MAAM,MAAM,EAAE,WAAW,wBAAwB,KAAG,IAErF,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,QAAQ,MAAM,CAAC,MAAM,EAAE,wBAAwB,CAAC,KAAG,IAErF,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,MAAM,MAAM,EAAE,WAAW,mBAAmB,KAAG,IAEpF,CAAC;AAEF,eAAO,MAAM,sBAAsB,GAAI,YAAY,MAAM,CAAC,MAAM,EAAE,mBAAmB,CAAC,KAAG,IAExF,CAAC;AAEF,eAAO,MAAM,oBAAoB,QAAO,MAAM,CAAC,MAAM,EAAE,wBAAwB,CAAkC,CAAC;AAElH,eAAO,MAAM,wBAAwB,QAAO,MAAM,CAAC,MAAM,EAAE,mBAAmB,CAAsC,CAAC"}
+{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../src/forms/registry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAyBzF,6FAA6F;AAC7F,eAAO,MAAM,iBAAiB,GAAI,MAAM,MAAM,EAAE,WAAW,wBAAwB,KAAG,IAErF,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,QAAQ,MAAM,CAAC,MAAM,EAAE,wBAAwB,CAAC,KAAG,IAErF,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,MAAM,MAAM,EAAE,WAAW,mBAAmB,KAAG,IAEpF,CAAC;AAEF,eAAO,MAAM,sBAAsB,GAAI,YAAY,MAAM,CAAC,MAAM,EAAE,mBAAmB,CAAC,KAAG,IAExF,CAAC;AAEF,eAAO,MAAM,2BAA2B,GAAI,MAAM,MAAM,EAAE,WAAW,wBAAwB,KAAG,IAE/F,CAAC;AAEF,eAAO,MAAM,sBAAsB,GAAI,MAAM,MAAM,KAAG,wBAAwB,GAAG,SAEhF,CAAC;AAEF,eAAO,MAAM,oBAAoB,QAAO,MAAM,CAAC,MAAM,EAAE,wBAAwB,CAK9E,CAAC;AAEF,eAAO,MAAM,wBAAwB,QAAO,MAAM,CAAC,MAAM,EAAE,mBAAmB,CAAsC,CAAC"}

package/dist/forms/registry.js

@@ -1,64 +1,23 @@
-import { TextField } from "./fields/TextField.js";
-import { TextareaField } from "./fields/TextareaField.js";
-import { NumberField } from "./fields/NumberField.js";
-import { SelectField } from "./fields/SelectField.js";
-import { LightswitchField } from "./fields/LightswitchField.js";
-import { HandleField } from "./fields/HandleField.js";
-import { ListField } from "./fields/ListField.js";
-import { EditableTableField } from "./fields/EditableTableField.js";
-import { DateTimeField } from "./fields/DateTimeField.js";
-import { RichTextField } from "./fields/RichTextField.js";
-import { CodeEditorField } from "./fields/CodeEditorField.js";
-import { VariablePickerField } from "./fields/VariablePickerField.js";
-import { CalculationsField } from "./fields/CalculationsField.js";
-import { ElementSelectField } from "./fields/ElementSelectField.js";
-import { ColorField } from "./fields/ColorField.js";
-import { CheckboxSelectField } from "./fields/CheckboxSelectField.js";
-import { ComboboxField } from "./fields/ComboboxField.js";
-import { GroupField } from "./fields/GroupField.js";
-import { StaticTableField } from "./fields/StaticTableField.js";
-import { RadioGroupField } from "./fields/RadioGroupField.js";
+import { Separator } from "../components/Separator.js";
 import { FieldWrap } from "./components/FieldWrap.js";
 import { ModalTabs, ModalTabsContent, ModalTabsList, ModalTabsTrigger } from "./components/ModalTabs.js";
-import "./components/index.js";
 //#region src/forms/registry.ts
-var hmrData = {};
-var formFieldRegistry = {
-	text: TextField,
-	textarea: TextareaField,
-	number: NumberField,
-	select: SelectField,
-	lightswitch: LightswitchField,
-	handle: HandleField,
-	list: ListField,
-	table: EditableTableField,
-	date: DateTimeField,
-	richText: RichTextField,
-	codeEditor: CodeEditorField,
-	variablePicker: VariablePickerField,
-	calculations: CalculationsField,
-	elementSelect: ElementSelectField,
-	color: ColorField,
-	checkboxSelect: CheckboxSelectField,
-	combobox: ComboboxField,
-	radioGroup: RadioGroupField,
-	group: GroupField,
-	staticTable: StaticTableField,
-	...hmrData.fields ?? {}
-};
+var customFormFieldRegistry = {};
+var loadedBuiltinFormFieldCache = {};
 var formComponentRegistry = {
 	FieldWrap,
 	ModalTabs,
 	ModalTabsList,
 	ModalTabsTrigger,
 	ModalTabsContent,
-	...hmrData.components ?? {}
+	Separator
 };
+/** Override a built-in field or register a custom `$field` type plugin-kit does not ship. */
 var registerFormField = (name, component) => {
-	formFieldRegistry[name] = component;
+	customFormFieldRegistry[name] = component;
 };
 var registerFormFields = (fields) => {
-	Object.assign(formFieldRegistry, fields);
+	Object.assign(customFormFieldRegistry, fields);
 };
 var registerFormComponent = (name, component) => {
 	formComponentRegistry[name] = component;
@@ -66,13 +25,22 @@ var registerFormComponent = (name, component) => {
 var registerFormComponents = (components) => {
 	Object.assign(formComponentRegistry, components);
 };
+var cacheLoadedBuiltinFormField = (name, component) => {
+	loadedBuiltinFormFieldCache[name] = component;
+};
+var getRegisteredFormField = (name) => {
+	return customFormFieldRegistry[name] ?? loadedBuiltinFormFieldCache[name];
+};
 var getFormFieldRegistry = () => {
-	return formFieldRegistry;
+	return {
+		...loadedBuiltinFormFieldCache,
+		...customFormFieldRegistry
+	};
 };
 var getFormComponentRegistry = () => {
 	return formComponentRegistry;
 };
 //#endregion
-export { getFormComponentRegistry, getFormFieldRegistry, registerFormComponent, registerFormComponents, registerFormField, registerFormFields };
+export { cacheLoadedBuiltinFormField, getFormComponentRegistry, getFormFieldRegistry, getRegisteredFormField, registerFormComponent, registerFormComponents, registerFormField, registerFormFields };
 
 //# sourceMappingURL=registry.js.map

package/dist/forms/registry.js.map

@@ -1 +1 @@
-{"version":3,"file":"registry.js","names":[],"sources":["../../src/forms/registry.ts"],"sourcesContent":["import type { SchemaFormComponent, SchemaFormFieldComponent } from './engine/context';\nimport { TextField } from './fields/TextField';\nimport { TextareaField } from './fields/TextareaField';\nimport { NumberField } from './fields/NumberField';\nimport { SelectField } from './fields/SelectField';\nimport { LightswitchField } from './fields/LightswitchField';\nimport { HandleField } from './fields/HandleField';\nimport { ListField } from './fields/ListField';\nimport { EditableTableField } from './fields/EditableTableField';\nimport { DateTimeField } from './fields/DateTimeField';\nimport { RichTextField } from './fields/RichTextField';\nimport { CodeEditorField } from './fields/CodeEditorField';\nimport { VariablePickerField } from './fields/VariablePickerField';\nimport { CalculationsField } from './fields/CalculationsField';\nimport { ElementSelectField } from './fields/ElementSelectField';\nimport { ColorField } from './fields/ColorField';\nimport { CheckboxSelectField } from './fields/CheckboxSelectField';\nimport { ComboboxField } from './fields/ComboboxField';\nimport { GroupField } from './fields/GroupField';\nimport { StaticTableField } from './fields/StaticTableField';\nimport { RadioGroupField } from './fields/RadioGroupField';\nimport {\n    FieldWrap,\n    ModalTabs,\n    ModalTabsContent,\n    ModalTabsList,\n    ModalTabsTrigger,\n} from './components';\n\ntype RegistryHotData = {\n    formRegistry?: {\n        fields?: Record<string, SchemaFormFieldComponent>;\n        components?: Record<string, SchemaFormComponent>;\n    };\n};\n\nconst hmrData = (import.meta.hot?.data as RegistryHotData | undefined)?.formRegistry ?? {};\nconst formFieldRegistry: Record<string, SchemaFormFieldComponent> = {\n    text: TextField,\n    textarea: TextareaField,\n    number: NumberField,\n    select: SelectField,\n    lightswitch: LightswitchField,\n    handle: HandleField,\n    list: ListField,\n    table: EditableTableField,\n    date: DateTimeField,\n    richText: RichTextField,\n    codeEditor: CodeEditorField,\n    variablePicker: VariablePickerField,\n    calculations: CalculationsField,\n    elementSelect: ElementSelectField,\n    color: ColorField,\n    checkboxSelect: CheckboxSelectField,\n    combobox: ComboboxField,\n    radioGroup: RadioGroupField,\n    group: GroupField,\n    staticTable: StaticTableField,\n    ...(hmrData.fields ?? {}),\n};\n\nconst formComponentRegistry: Record<string, SchemaFormComponent> = {\n    FieldWrap,\n    ModalTabs,\n    ModalTabsList,\n    ModalTabsTrigger,\n    ModalTabsContent,\n    ...(hmrData.components ?? {}),\n};\n\nif (import.meta.hot) {\n    import.meta.hot.dispose((data: RegistryHotData) => {\n        data.formRegistry = {\n            fields: formFieldRegistry,\n            components: formComponentRegistry,\n        };\n    });\n}\n\nexport const registerFormField = (name: string, component: SchemaFormFieldComponent): void => {\n    formFieldRegistry[name] = component;\n};\n\nexport const registerFormFields = (fields: Record<string, SchemaFormFieldComponent>): void => {\n    Object.assign(formFieldRegistry, fields);\n};\n\nexport const registerFormComponent = (name: string, component: SchemaFormComponent): void => {\n    formComponentRegistry[name] = component;\n};\n\nexport const registerFormComponents = (components: Record<string, SchemaFormComponent>): void => {\n    Object.assign(formComponentRegistry, components);\n};\n\nexport const getFormFieldRegistry = (): Record<string, SchemaFormFieldComponent> => { return formFieldRegistry; };\n\nexport const getFormComponentRegistry = (): Record<string, SchemaFormComponent> => { return formComponentRegistry; };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAoCA,IAAM,UAAkF,EAAE;AAC1F,IAAM,oBAA8D;CAChE,MAAM;CACN,UAAU;CACV,QAAQ;CACR,QAAQ;CACR,aAAa;CACb,QAAQ;CACR,MAAM;CACN,OAAO;CACP,MAAM;CACN,UAAU;CACV,YAAY;CACZ,gBAAgB;CAChB,cAAc;CACd,eAAe;CACf,OAAO;CACP,gBAAgB;CAChB,UAAU;CACV,YAAY;CACZ,OAAO;CACP,aAAa;CACb,GAAI,QAAQ,UAAU,EAAE;CAC3B;AAED,IAAM,wBAA6D;CAC/D;CACA;CACA;CACA;CACA;CACA,GAAI,QAAQ,cAAc,EAAE;CAC/B;AAWD,IAAa,qBAAqB,MAAc,cAA8C;AAC1F,mBAAkB,QAAQ;;AAG9B,IAAa,sBAAsB,WAA2D;AAC1F,QAAO,OAAO,mBAAmB,OAAO;;AAG5C,IAAa,yBAAyB,MAAc,cAAyC;AACzF,uBAAsB,QAAQ;;AAGlC,IAAa,0BAA0B,eAA0D;AAC7F,QAAO,OAAO,uBAAuB,WAAW;;AAGpD,IAAa,6BAAuE;AAAE,QAAO;;AAE7F,IAAa,iCAAsE;AAAE,QAAO"}
+{"version":3,"file":"registry.js","names":[],"sources":["../../src/forms/registry.ts"],"sourcesContent":["import type { SchemaFormComponent, SchemaFormFieldComponent } from './engine/context.js';\nimport { Separator } from '../components/Separator.js';\nimport {\n    FieldWrap,\n    ModalTabs,\n    ModalTabsContent,\n    ModalTabsList,\n    ModalTabsTrigger,\n} from './components/index.js';\n\n// Explicit overrides and third-party custom fields. Built-in `$field` types resolve lazily\n// via SchemaFormEngine — consumers do not register them at bootstrap.\nconst customFormFieldRegistry: Record<string, SchemaFormFieldComponent> = {};\nconst loadedBuiltinFormFieldCache: Record<string, SchemaFormFieldComponent> = {};\n\n// Built-in `$cmp` keys seed the component registry (ModalTabs*/FieldWrap + shared chrome like Separator).\nconst formComponentRegistry: Record<string, SchemaFormComponent> = {\n    FieldWrap,\n    ModalTabs,\n    ModalTabsList,\n    ModalTabsTrigger,\n    ModalTabsContent,\n    Separator,\n};\n\n/** Override a built-in field or register a custom `$field` type plugin-kit does not ship. */\nexport const registerFormField = (name: string, component: SchemaFormFieldComponent): void => {\n    customFormFieldRegistry[name] = component;\n};\n\nexport const registerFormFields = (fields: Record<string, SchemaFormFieldComponent>): void => {\n    Object.assign(customFormFieldRegistry, fields);\n};\n\nexport const registerFormComponent = (name: string, component: SchemaFormComponent): void => {\n    formComponentRegistry[name] = component;\n};\n\nexport const registerFormComponents = (components: Record<string, SchemaFormComponent>): void => {\n    Object.assign(formComponentRegistry, components);\n};\n\nexport const cacheLoadedBuiltinFormField = (name: string, component: SchemaFormFieldComponent): void => {\n    loadedBuiltinFormFieldCache[name] = component;\n};\n\nexport const getRegisteredFormField = (name: string): SchemaFormFieldComponent | undefined => {\n    return customFormFieldRegistry[name] ?? loadedBuiltinFormFieldCache[name];\n};\n\nexport const getFormFieldRegistry = (): Record<string, SchemaFormFieldComponent> => {\n    return {\n        ...loadedBuiltinFormFieldCache,\n        ...customFormFieldRegistry,\n    };\n};\n\nexport const getFormComponentRegistry = (): Record<string, SchemaFormComponent> => { return formComponentRegistry; };\n"],"mappings":";;;;AAYA,IAAM,0BAAoE,EAAE;AAC5E,IAAM,8BAAwE,EAAE;AAGhF,IAAM,wBAA6D;CAC/D;CACA;CACA;CACA;CACA;CACA;CACH;;AAGD,IAAa,qBAAqB,MAAc,cAA8C;AAC1F,yBAAwB,QAAQ;;AAGpC,IAAa,sBAAsB,WAA2D;AAC1F,QAAO,OAAO,yBAAyB,OAAO;;AAGlD,IAAa,yBAAyB,MAAc,cAAyC;AACzF,uBAAsB,QAAQ;;AAGlC,IAAa,0BAA0B,eAA0D;AAC7F,QAAO,OAAO,uBAAuB,WAAW;;AAGpD,IAAa,+BAA+B,MAAc,cAA8C;AACpG,6BAA4B,QAAQ;;AAGxC,IAAa,0BAA0B,SAAuD;AAC1F,QAAO,wBAAwB,SAAS,4BAA4B;;AAGxE,IAAa,6BAAuE;AAChF,QAAO;EACH,GAAG;EACH,GAAG;EACN;;AAGL,IAAa,iCAAsE;AAAE,QAAO"}

package/dist/forms/useEngineField.d.ts

@@ -1,4 +1,4 @@
-import { SchemaFormEngineApi } from './engine/context';
+import { SchemaFormEngineApi } from './engine/context.js';
 export declare const useEngineField: (form: SchemaFormEngineApi, name: string) => {
     value: unknown;
     errors: string[];

package/dist/forms/useEngineField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useEngineField.d.ts","sourceRoot":"","sources":["../../src/forms/useEngineField.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAI5D,eAAO,MAAM,cAAc,GAAI,MAAM,mBAAmB,EAAE,MAAM,MAAM;;;;0BAYrC,OAAO;;CAevC,CAAC"}
+{"version":3,"file":"useEngineField.d.ts","sourceRoot":"","sources":["../../src/forms/useEngineField.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAI/D,eAAO,MAAM,cAAc,GAAI,MAAM,mBAAmB,EAAE,MAAM,MAAM;;;;0BAYrC,OAAO;;CAevC,CAAC"}

package/dist/forms/useEngineField.js.map

@@ -1 +1 @@
-{"version":3,"file":"useEngineField.js","names":[],"sources":["../../src/forms/useEngineField.ts"],"sourcesContent":["import { useSyncExternalStore } from 'react';\nimport type { SchemaFormEngineApi } from './engine/context';\n\nconst EMPTY_ERRORS: string[] = [];\n\nexport const useEngineField = (form: SchemaFormEngineApi, name: string) => {\n    const value = useSyncExternalStore(\n        form.store.subscribe.bind(form.store),\n        () => { return form.getFieldValue(name); },\n        () => { return form.getFieldValue(name); },\n    );\n    const errors = useSyncExternalStore(\n        form.store.subscribe.bind(form.store),\n        () => { return form.getErrorMapFields()[name] || EMPTY_ERRORS; },\n        () => { return form.getErrorMapFields()[name] || EMPTY_ERRORS; },\n    );\n\n    const setValue = (nextValue: unknown) => {\n        form.setFieldValue(name, nextValue);\n    };\n\n    const setTouched = () => {\n        form.store.setTouched(name, true);\n    };\n\n    return {\n        value,\n        errors,\n        isInvalid: errors.length > 0,\n        setValue,\n        setTouched,\n    };\n};\n"],"mappings":";;AAGA,IAAM,eAAyB,EAAE;AAEjC,IAAa,kBAAkB,MAA2B,SAAiB;CACvE,MAAM,QAAQ,qBACV,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AAAE,SAAO,KAAK,cAAc,KAAK;UACjC;AAAE,SAAO,KAAK,cAAc,KAAK;GAC1C;CACD,MAAM,SAAS,qBACX,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AAAE,SAAO,KAAK,mBAAmB,CAAC,SAAS;UAC3C;AAAE,SAAO,KAAK,mBAAmB,CAAC,SAAS;GACpD;CAED,MAAM,YAAY,cAAuB;AACrC,OAAK,cAAc,MAAM,UAAU;;CAGvC,MAAM,mBAAmB;AACrB,OAAK,MAAM,WAAW,MAAM,KAAK;;AAGrC,QAAO;EACH;EACA;EACA,WAAW,OAAO,SAAS;EAC3B;EACA;EACH"}
+{"version":3,"file":"useEngineField.js","names":[],"sources":["../../src/forms/useEngineField.ts"],"sourcesContent":["import { useSyncExternalStore } from 'react';\nimport type { SchemaFormEngineApi } from './engine/context.js';\n\nconst EMPTY_ERRORS: string[] = [];\n\nexport const useEngineField = (form: SchemaFormEngineApi, name: string) => {\n    const value = useSyncExternalStore(\n        form.store.subscribe.bind(form.store),\n        () => { return form.getFieldValue(name); },\n        () => { return form.getFieldValue(name); },\n    );\n    const errors = useSyncExternalStore(\n        form.store.subscribe.bind(form.store),\n        () => { return form.getErrorMapFields()[name] || EMPTY_ERRORS; },\n        () => { return form.getErrorMapFields()[name] || EMPTY_ERRORS; },\n    );\n\n    const setValue = (nextValue: unknown) => {\n        form.setFieldValue(name, nextValue);\n    };\n\n    const setTouched = () => {\n        form.store.setTouched(name, true);\n    };\n\n    return {\n        value,\n        errors,\n        isInvalid: errors.length > 0,\n        setValue,\n        setTouched,\n    };\n};\n"],"mappings":";;AAGA,IAAM,eAAyB,EAAE;AAEjC,IAAa,kBAAkB,MAA2B,SAAiB;CACvE,MAAM,QAAQ,qBACV,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AAAE,SAAO,KAAK,cAAc,KAAK;UACjC;AAAE,SAAO,KAAK,cAAc,KAAK;GAC1C;CACD,MAAM,SAAS,qBACX,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AAAE,SAAO,KAAK,mBAAmB,CAAC,SAAS;UAC3C;AAAE,SAAO,KAAK,mBAAmB,CAAC,SAAS;GACpD;CAED,MAAM,YAAY,cAAuB;AACrC,OAAK,cAAc,MAAM,UAAU;;CAGvC,MAAM,mBAAmB;AACrB,OAAK,MAAM,WAAW,MAAM,KAAK;;AAGrC,QAAO;EACH;EACA;EACA,WAAW,OAAO,SAAS;EAC3B;EACA;EACH"}

package/dist/forms/utils.d.ts

@@ -0,0 +1,6 @@
+/** Normalize HTML attributes for React consumption (e.g. `class` -> `className`). */
+export declare const normalizeAttrs: (attrs?: Record<string, unknown>) => Record<string, unknown> & {
+    class?: string;
+    className?: string;
+};
+//# sourceMappingURL=utils.d.ts.map

package/dist/forms/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/forms/utils.ts"],"names":[],"mappings":"AAAA,qFAAqF;AACrF,eAAO,MAAM,cAAc,GAAI,QAAO,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM;YACR,MAAM;gBAAc,MAAM;CAQnF,CAAC"}

package/dist/forms/utils.js

@@ -0,0 +1,14 @@
+//#region src/forms/utils.ts
+/** Normalize HTML attributes for React consumption (e.g. `class` -> `className`). */
+var normalizeAttrs = (attrs = {}) => {
+	const normalized = { ...attrs };
+	if (typeof normalized.class === "string") {
+		normalized.className = normalized.class;
+		delete normalized.class;
+	}
+	return normalized;
+};
+//#endregion
+export { normalizeAttrs };
+
+//# sourceMappingURL=utils.js.map

package/dist/forms/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","names":[],"sources":["../../src/forms/utils.ts"],"sourcesContent":["/** Normalize HTML attributes for React consumption (e.g. `class` -> `className`). */\nexport const normalizeAttrs = (attrs: Record<string, unknown> = {}) => {\n    const normalized: Record<string, unknown> & { class?: string; className?: string } = { ...attrs };\n\n    if (typeof normalized.class === 'string') {\n        normalized.className = normalized.class;\n        delete normalized.class;\n    }\n\n    return normalized;\n};\n"],"mappings":";;AACA,IAAa,kBAAkB,QAAiC,EAAE,KAAK;CACnE,MAAM,aAA+E,EAAE,GAAG,OAAO;AAEjG,KAAI,OAAO,WAAW,UAAU,UAAU;AACtC,aAAW,YAAY,WAAW;AAClC,SAAO,WAAW;;AAGtB,QAAO"}

package/dist/hooks/index.d.ts

@@ -1,3 +1,2 @@
-export * from './useKeyboardShortcuts';
-export * from './useTranslation';
+export { useTranslation } from './useTranslation.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/hooks/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/hooks/index.js

@@ -1,3 +1,2 @@
-import { useKeyboardShortcuts } from "./useKeyboardShortcuts.js";
 import { useTranslation } from "./useTranslation.js";
-export { useKeyboardShortcuts, useTranslation };
+export { useTranslation };