@axenstudio/axen-form 0.1.1

package/dist/react/AxenArrayField.js

@@ -0,0 +1,80 @@
+import { jsx, Fragment } from "react/jsx-runtime";
+import { useFormContext } from "./FormContext.js";
+import { useFieldArray } from "./useFieldArray.js";
+import { useField } from "./useField.js";
+function AxenArrayField({ name, config, children }) {
+  const { fields: items, push, remove, swap, insert, replace, move, length } = useFieldArray(name);
+  const { components, disabled } = useFormContext();
+  const helpers = { push, remove, swap, insert, replace, move, length };
+  const renderField = (index) => {
+    return /* @__PURE__ */ jsx("div", { "data-axen-array-item": index, children: config.fields.map((fieldConfig) => {
+      const fieldName = `${name}.${index}.${fieldConfig.name}`;
+      const Component = fieldConfig.component ?? components[fieldConfig.type];
+      if (!Component) return null;
+      return /* @__PURE__ */ jsx(
+        ArrayItemField,
+        {
+          name: fieldName,
+          config: fieldConfig,
+          Component,
+          disabled: disabled || config.disabled
+        },
+        fieldName
+      );
+    }) }, index);
+  };
+  return /* @__PURE__ */ jsx(Fragment, { children: children({ fields: items, helpers, renderField }) });
+}
+function ArrayItemField({
+  name,
+  config,
+  Component,
+  disabled
+}) {
+  const { store } = useFormContext();
+  const { value, error, touched, onChange, onBlur } = useField(name);
+  const showError = touched && !!error;
+  return /* @__PURE__ */ jsx(
+    Component,
+    {
+      name,
+      value,
+      onChange,
+      onBlur,
+      error: showError,
+      helperText: showError ? error : config.helperText,
+      label: config.label,
+      placeholder: config.placeholder,
+      disabled: disabled || config.disabled,
+      readOnly: config.readOnly,
+      required: config.required,
+      options: config.options,
+      form: {
+        values: store.getState().values,
+        errors: store.getState().errors,
+        touched: store.getState().touched,
+        dirty: store.getState().dirty,
+        isSubmitting: store.getState().isSubmitting,
+        isValid: Object.keys(store.getState().errors).length === 0,
+        submitCount: store.getState().submitCount,
+        setFieldValue: store.setFieldValue,
+        setFieldTouched: store.setFieldTouched,
+        setFieldError: store.setFieldError,
+        setValues: store.setValues,
+        setErrors: store.setErrors,
+        handleChange: onChange,
+        handleBlur: onBlur,
+        handleSubmit: () => {
+          void store.submitForm();
+        },
+        resetForm: store.resetForm,
+        submitForm: () => store.submitForm(),
+        validateForm: store.validateForm,
+        validateField: store.validateField
+      }
+    }
+  );
+}
+export {
+  AxenArrayField
+};

package/dist/react/AxenField.cjs

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const FormContext = require("./FormContext.cjs");
+const useField = require("./useField.cjs");
+function AxenField({ name, config, component, children }) {
+  const { store, components, disabled } = FormContext.useFormContext();
+  const { value, error, touched, onChange, onBlur, setValue, setTouched, setError } = useField.useField(name);
+  const showError = touched && !!error;
+  const helperText = showError ? error : config == null ? void 0 : config.helperText;
+  const fieldType = (config == null ? void 0 : config.type) ?? "text";
+  const Component = component ?? (config == null ? void 0 : config.component) ?? components[fieldType];
+  const fieldProps = {
+    name,
+    value,
+    onChange,
+    onBlur,
+    error: showError,
+    helperText,
+    label: config == null ? void 0 : config.label,
+    placeholder: config == null ? void 0 : config.placeholder,
+    disabled: disabled || (config == null ? void 0 : config.disabled),
+    readOnly: config == null ? void 0 : config.readOnly,
+    required: config == null ? void 0 : config.required,
+    options: config == null ? void 0 : config.options,
+    form: {
+      values: store.getState().values,
+      errors: store.getState().errors,
+      touched: store.getState().touched,
+      dirty: store.getState().dirty,
+      isSubmitting: store.getState().isSubmitting,
+      isValid: Object.keys(store.getState().errors).length === 0,
+      submitCount: store.getState().submitCount,
+      setFieldValue: store.setFieldValue,
+      setFieldTouched: store.setFieldTouched,
+      setFieldError: store.setFieldError,
+      setValues: store.setValues,
+      setErrors: store.setErrors,
+      handleChange: onChange,
+      handleBlur: onBlur,
+      handleSubmit: () => {
+        void store.submitForm();
+      },
+      resetForm: store.resetForm,
+      submitForm: () => store.submitForm(),
+      validateForm: store.validateForm,
+      validateField: store.validateField
+    },
+    setValue,
+    setTouched,
+    setError,
+    ...config == null ? void 0 : config.fieldProps
+  };
+  if (children) {
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: children(fieldProps) });
+  }
+  if (!Component) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(Component, { ...fieldProps });
+}
+exports.AxenField = AxenField;

package/dist/react/AxenField.d.ts

@@ -0,0 +1,13 @@
+import { FieldComponentProps, FieldConfig } from '../types';
+export interface AxenFieldProps {
+    name: string;
+    config?: Partial<FieldConfig>;
+    component?: React.ComponentType<FieldComponentProps>;
+    children?: (fieldProps: FieldComponentProps) => React.ReactNode;
+}
+/**
+ * Standalone field component — can be used outside AxenForm grid
+ * when you need fine-grained placement.
+ */
+export declare function AxenField({ name, config, component, children }: Readonly<AxenFieldProps>): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=AxenField.d.ts.map

package/dist/react/AxenField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AxenField.d.ts","sourceRoot":"","sources":["../../src/react/AxenField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAIjE,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,CAAC;IAC9B,SAAS,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,mBAAmB,CAAC,CAAC;IACrD,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,mBAAmB,KAAK,KAAK,CAAC,SAAS,CAAC;CACjE;AAED;;;GAGG;AACH,wBAAgB,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,QAAQ,CAAC,cAAc,CAAC,kDAkExF"}

package/dist/react/AxenField.js

@@ -0,0 +1,62 @@
+import { jsx, Fragment } from "react/jsx-runtime";
+import { useFormContext } from "./FormContext.js";
+import { useField } from "./useField.js";
+function AxenField({ name, config, component, children }) {
+  const { store, components, disabled } = useFormContext();
+  const { value, error, touched, onChange, onBlur, setValue, setTouched, setError } = useField(name);
+  const showError = touched && !!error;
+  const helperText = showError ? error : config == null ? void 0 : config.helperText;
+  const fieldType = (config == null ? void 0 : config.type) ?? "text";
+  const Component = component ?? (config == null ? void 0 : config.component) ?? components[fieldType];
+  const fieldProps = {
+    name,
+    value,
+    onChange,
+    onBlur,
+    error: showError,
+    helperText,
+    label: config == null ? void 0 : config.label,
+    placeholder: config == null ? void 0 : config.placeholder,
+    disabled: disabled || (config == null ? void 0 : config.disabled),
+    readOnly: config == null ? void 0 : config.readOnly,
+    required: config == null ? void 0 : config.required,
+    options: config == null ? void 0 : config.options,
+    form: {
+      values: store.getState().values,
+      errors: store.getState().errors,
+      touched: store.getState().touched,
+      dirty: store.getState().dirty,
+      isSubmitting: store.getState().isSubmitting,
+      isValid: Object.keys(store.getState().errors).length === 0,
+      submitCount: store.getState().submitCount,
+      setFieldValue: store.setFieldValue,
+      setFieldTouched: store.setFieldTouched,
+      setFieldError: store.setFieldError,
+      setValues: store.setValues,
+      setErrors: store.setErrors,
+      handleChange: onChange,
+      handleBlur: onBlur,
+      handleSubmit: () => {
+        void store.submitForm();
+      },
+      resetForm: store.resetForm,
+      submitForm: () => store.submitForm(),
+      validateForm: store.validateForm,
+      validateField: store.validateField
+    },
+    setValue,
+    setTouched,
+    setError,
+    ...config == null ? void 0 : config.fieldProps
+  };
+  if (children) {
+    return /* @__PURE__ */ jsx(Fragment, { children: children(fieldProps) });
+  }
+  if (!Component) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(Component, { ...fieldProps });
+}
+export {
+  AxenField
+};

package/dist/react/AxenForm.cjs

@@ -0,0 +1,134 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const react = require("react");
+const payloadUtils = require("../core/payloadUtils.cjs");
+const FormContext = require("./FormContext.cjs");
+const useAxenForm = require("./useAxenForm.cjs");
+const useField = require("./useField.cjs");
+function AxenFormInner(props, ref) {
+  const {
+    config,
+    onSubmit,
+    components = {},
+    validationAdapter,
+    payloadFields,
+    payloadDiscriminator,
+    columns = 12,
+    gap = "1rem",
+    className,
+    disabled,
+    validateOnChange,
+    validateOnBlur,
+    children
+  } = props;
+  const wrappedOnSubmit = react.useMemo(() => {
+    if (!payloadFields) return onSubmit;
+    return async (values, meta) => {
+      const filtered = payloadUtils.mapPayload(values, payloadFields, payloadDiscriminator);
+      return onSubmit(filtered, meta);
+    };
+  }, [onSubmit, payloadFields, payloadDiscriminator]);
+  const { store, formApi } = useAxenForm.useAxenForm({
+    config,
+    onSubmit: wrappedOnSubmit,
+    validationAdapter,
+    validateOnChange,
+    validateOnBlur
+  });
+  react.useImperativeHandle(ref, () => ({
+    submit: () => formApi.handleSubmit(),
+    resetForm: (nextValues) => store.resetForm(nextValues),
+    getValues: () => store.getState().values,
+    getErrors: () => store.getState().errors,
+    isValid: () => Object.keys(store.getState().errors).length === 0,
+    isDirty: () => store.getState().dirty
+  }));
+  const ctxValue = react.useMemo(
+    () => ({
+      store,
+      fields: config.fields,
+      components,
+      disabled
+    }),
+    [store, config.fields, components, disabled]
+  );
+  const gridStyle = react.useMemo(
+    () => ({
+      display: "grid",
+      gridTemplateColumns: `repeat(${columns}, 1fr)`,
+      gap: typeof gap === "number" ? `${gap}px` : gap
+    }),
+    [columns, gap]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(FormContext.FormContext.Provider, { value: ctxValue, children: /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: formApi.handleSubmit, className, noValidate: true, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { style: gridStyle, children: config.fields.map((fieldConfig) => /* @__PURE__ */ jsxRuntime.jsx(
+      AxenFieldRenderer,
+      {
+        config: fieldConfig,
+        disabled,
+        formApi
+      },
+      fieldConfig.name
+    )) }),
+    children
+  ] }) });
+}
+const AxenForm = react.forwardRef(AxenFormInner);
+function AxenFieldRenderer({
+  config,
+  disabled,
+  formApi
+}) {
+  const { store, components } = FormContext.useFormContext();
+  const { value, error, touched, onChange, onBlur } = useField.useField(config.name);
+  const hidden = typeof config.hidden === "function" ? config.hidden(store.getState().values) : config.hidden;
+  if (hidden) return null;
+  const Component = config.component ?? components[config.type];
+  if (!Component) {
+    return null;
+  }
+  const showError = touched && !!error;
+  const helperText = showError ? error : config.helperText;
+  const colSpanStyle = resolveColSpan(config.colSpan);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: colSpanStyle, children: /* @__PURE__ */ jsxRuntime.jsx(
+    Component,
+    {
+      name: config.name,
+      value,
+      onChange,
+      onBlur,
+      error: showError,
+      helperText,
+      label: config.label,
+      placeholder: config.placeholder,
+      disabled: disabled || config.disabled,
+      readOnly: config.readOnly,
+      required: config.required,
+      options: config.options,
+      form: formApi,
+      ...config.fieldProps ?? {},
+      min: config.min,
+      max: config.max,
+      step: config.step,
+      prefix: config.prefix,
+      suffix: config.suffix,
+      locale: config.locale,
+      currency: config.currency,
+      rows: config.rows,
+      format: config.format,
+      fetchOptions: config.fetchOptions,
+      optionLabel: config.optionLabel,
+      multiple: config.multiple
+    }
+  ) });
+}
+function resolveColSpan(colSpan) {
+  if (!colSpan) return { gridColumn: "span 12" };
+  if (typeof colSpan === "number") {
+    return { gridColumn: `span ${colSpan}` };
+  }
+  const xs = colSpan.xs ?? 12;
+  return { gridColumn: `span ${xs}` };
+}
+exports.AxenForm = AxenForm;

package/dist/react/AxenForm.d.ts

@@ -0,0 +1,7 @@
+import { ReactNode } from 'react';
+import { AxenFormProps, AxenFormRef } from '../types';
+export declare const AxenForm: <TValues extends Record<string, unknown>>(props: AxenFormProps<TValues> & {
+    children?: ReactNode;
+    ref?: React.Ref<AxenFormRef>;
+}) => ReactNode;
+//# sourceMappingURL=AxenForm.d.ts.map

package/dist/react/AxenForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AxenForm.d.ts","sourceRoot":"","sources":["../../src/react/AxenForm.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA4C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGjF,OAAO,KAAK,EAAE,aAAa,EAAE,WAAW,EAAsC,MAAM,UAAU,CAAC;AAyF/F,eAAO,MAAM,QAAQ,EAAgC,CAAC,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC3F,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,GAAG;IAAE,QAAQ,CAAC,EAAE,SAAS,CAAC;IAAC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAA;CAAE,KACnF,SAAS,CAAC"}

package/dist/react/AxenForm.js

@@ -0,0 +1,134 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef, useMemo, useImperativeHandle } from "react";
+import { mapPayload } from "../core/payloadUtils.js";
+import { FormContext, useFormContext } from "./FormContext.js";
+import { useAxenForm } from "./useAxenForm.js";
+import { useField } from "./useField.js";
+function AxenFormInner(props, ref) {
+  const {
+    config,
+    onSubmit,
+    components = {},
+    validationAdapter,
+    payloadFields,
+    payloadDiscriminator,
+    columns = 12,
+    gap = "1rem",
+    className,
+    disabled,
+    validateOnChange,
+    validateOnBlur,
+    children
+  } = props;
+  const wrappedOnSubmit = useMemo(() => {
+    if (!payloadFields) return onSubmit;
+    return async (values, meta) => {
+      const filtered = mapPayload(values, payloadFields, payloadDiscriminator);
+      return onSubmit(filtered, meta);
+    };
+  }, [onSubmit, payloadFields, payloadDiscriminator]);
+  const { store, formApi } = useAxenForm({
+    config,
+    onSubmit: wrappedOnSubmit,
+    validationAdapter,
+    validateOnChange,
+    validateOnBlur
+  });
+  useImperativeHandle(ref, () => ({
+    submit: () => formApi.handleSubmit(),
+    resetForm: (nextValues) => store.resetForm(nextValues),
+    getValues: () => store.getState().values,
+    getErrors: () => store.getState().errors,
+    isValid: () => Object.keys(store.getState().errors).length === 0,
+    isDirty: () => store.getState().dirty
+  }));
+  const ctxValue = useMemo(
+    () => ({
+      store,
+      fields: config.fields,
+      components,
+      disabled
+    }),
+    [store, config.fields, components, disabled]
+  );
+  const gridStyle = useMemo(
+    () => ({
+      display: "grid",
+      gridTemplateColumns: `repeat(${columns}, 1fr)`,
+      gap: typeof gap === "number" ? `${gap}px` : gap
+    }),
+    [columns, gap]
+  );
+  return /* @__PURE__ */ jsx(FormContext.Provider, { value: ctxValue, children: /* @__PURE__ */ jsxs("form", { onSubmit: formApi.handleSubmit, className, noValidate: true, children: [
+    /* @__PURE__ */ jsx("div", { style: gridStyle, children: config.fields.map((fieldConfig) => /* @__PURE__ */ jsx(
+      AxenFieldRenderer,
+      {
+        config: fieldConfig,
+        disabled,
+        formApi
+      },
+      fieldConfig.name
+    )) }),
+    children
+  ] }) });
+}
+const AxenForm = forwardRef(AxenFormInner);
+function AxenFieldRenderer({
+  config,
+  disabled,
+  formApi
+}) {
+  const { store, components } = useFormContext();
+  const { value, error, touched, onChange, onBlur } = useField(config.name);
+  const hidden = typeof config.hidden === "function" ? config.hidden(store.getState().values) : config.hidden;
+  if (hidden) return null;
+  const Component = config.component ?? components[config.type];
+  if (!Component) {
+    return null;
+  }
+  const showError = touched && !!error;
+  const helperText = showError ? error : config.helperText;
+  const colSpanStyle = resolveColSpan(config.colSpan);
+  return /* @__PURE__ */ jsx("div", { style: colSpanStyle, children: /* @__PURE__ */ jsx(
+    Component,
+    {
+      name: config.name,
+      value,
+      onChange,
+      onBlur,
+      error: showError,
+      helperText,
+      label: config.label,
+      placeholder: config.placeholder,
+      disabled: disabled || config.disabled,
+      readOnly: config.readOnly,
+      required: config.required,
+      options: config.options,
+      form: formApi,
+      ...config.fieldProps ?? {},
+      min: config.min,
+      max: config.max,
+      step: config.step,
+      prefix: config.prefix,
+      suffix: config.suffix,
+      locale: config.locale,
+      currency: config.currency,
+      rows: config.rows,
+      format: config.format,
+      fetchOptions: config.fetchOptions,
+      optionLabel: config.optionLabel,
+      multiple: config.multiple
+    }
+  ) });
+}
+function resolveColSpan(colSpan) {
+  if (!colSpan) return { gridColumn: "span 12" };
+  if (typeof colSpan === "number") {
+    return { gridColumn: `span ${colSpan}` };
+  }
+  const xs = colSpan.xs ?? 12;
+  return { gridColumn: `span ${xs}` };
+}
+export {
+  AxenForm
+};

package/dist/react/FormContext.cjs

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("react");
+const FormContext = react.createContext(null);
+function useFormContext() {
+  const ctx = react.useContext(FormContext);
+  if (!ctx) {
+    throw new Error("useFormContext must be used within an <AxenForm> or FormContext.Provider");
+  }
+  return ctx;
+}
+exports.FormContext = FormContext;
+exports.useFormContext = useFormContext;

package/dist/react/FormContext.d.ts

@@ -0,0 +1,11 @@
+import { FormStore } from '../core/formStore';
+import { FieldConfig, FieldTypeComponentMap } from '../types';
+export interface FormContextValue {
+    store: FormStore;
+    fields: FieldConfig[];
+    components: FieldTypeComponentMap;
+    disabled?: boolean;
+}
+export declare const FormContext: import('react').Context<FormContextValue | null>;
+export declare function useFormContext(): FormContextValue;
+//# sourceMappingURL=FormContext.d.ts.map

package/dist/react/FormContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormContext.d.ts","sourceRoot":"","sources":["../../src/react/FormContext.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,KAAK,EAAE,WAAW,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAC;AAEnE,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,SAAS,CAAC;IACjB,MAAM,EAAE,WAAW,EAAE,CAAC;IACtB,UAAU,EAAE,qBAAqB,CAAC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,WAAW,kDAA+C,CAAC;AAExE,wBAAgB,cAAc,IAAI,gBAAgB,CAMjD"}

package/dist/react/FormContext.js

@@ -0,0 +1,13 @@
+import { createContext, useContext } from "react";
+const FormContext = createContext(null);
+function useFormContext() {
+  const ctx = useContext(FormContext);
+  if (!ctx) {
+    throw new Error("useFormContext must be used within an <AxenForm> or FormContext.Provider");
+  }
+  return ctx;
+}
+export {
+  FormContext,
+  useFormContext
+};

package/dist/react/useAxenForm.cjs

@@ -0,0 +1,88 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("react");
+const formStore = require("../core/formStore.cjs");
+const validation = require("../core/validation.cjs");
+function useAxenForm(props) {
+  const {
+    config,
+    onSubmit,
+    validationAdapter,
+    validateOnChange = true,
+    validateOnBlur = true
+  } = props;
+  const adapter = validationAdapter ?? validation.simpleValidator;
+  const storeRef = react.useRef(null);
+  storeRef.current ?? (storeRef.current = formStore.createFormStore({
+    initialValues: config.initialValues,
+    validationAdapter: adapter,
+    fields: config.fields,
+    validateOnChange,
+    validateOnBlur,
+    onSubmit: async (values) => {
+      await onSubmit(values, {
+        isUpdate: config.isUpdate ?? false,
+        resetForm: () => {
+          var _a;
+          return (_a = storeRef.current) == null ? void 0 : _a.resetForm();
+        }
+      });
+    }
+  }));
+  const store = storeRef.current;
+  const formApi = react.useMemo(() => {
+    const handleChange = (e) => {
+      const { name, type, value } = e.target;
+      const newValue = type === "checkbox" ? e.target.checked : value;
+      store.setFieldValue(name, newValue);
+    };
+    const handleBlur = (e) => {
+      const name = e.target.name;
+      if (name) store.setFieldTouched(name, true);
+    };
+    const handleSubmit = (e) => {
+      if (e) {
+        e.preventDefault();
+        e.stopPropagation();
+      }
+      store.submitForm();
+    };
+    return {
+      get values() {
+        return store.getState().values;
+      },
+      get errors() {
+        return store.getState().errors;
+      },
+      get touched() {
+        return store.getState().touched;
+      },
+      get dirty() {
+        return store.getState().dirty;
+      },
+      get isSubmitting() {
+        return store.getState().isSubmitting;
+      },
+      get isValid() {
+        return Object.keys(store.getState().errors).length === 0;
+      },
+      get submitCount() {
+        return store.getState().submitCount;
+      },
+      setFieldValue: store.setFieldValue,
+      setFieldTouched: store.setFieldTouched,
+      setFieldError: store.setFieldError,
+      setValues: store.setValues,
+      setErrors: store.setErrors,
+      handleChange,
+      handleBlur,
+      handleSubmit,
+      resetForm: store.resetForm,
+      submitForm: () => store.submitForm(),
+      validateForm: store.validateForm,
+      validateField: store.validateField
+    };
+  }, [store]);
+  return { store, formApi };
+}
+exports.useAxenForm = useAxenForm;

package/dist/react/useAxenForm.d.ts

@@ -0,0 +1,8 @@
+import { FormStore } from '../core/formStore';
+import { AxenFormProps, FormApi } from '../types';
+export interface UseAxenFormReturn<TValues extends Record<string, unknown>> {
+    store: FormStore<TValues>;
+    formApi: FormApi<TValues>;
+}
+export declare function useAxenForm<TValues extends Record<string, unknown>>(props: Pick<AxenFormProps<TValues>, 'config' | 'onSubmit' | 'validationAdapter' | 'validateOnChange' | 'validateOnBlur' | 'payloadFields' | 'payloadDiscriminator'>): UseAxenFormReturn<TValues>;
+//# sourceMappingURL=useAxenForm.d.ts.map

package/dist/react/useAxenForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAxenForm.d.ts","sourceRoot":"","sources":["../../src/react/useAxenForm.ts"],"names":[],"mappings":"AACA,OAAO,EAAmB,KAAK,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAEpE,OAAO,KAAK,EAAE,aAAa,EAAe,OAAO,EAAqB,MAAM,UAAU,CAAC;AAEvF,MAAM,WAAW,iBAAiB,CAAC,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACxE,KAAK,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAC1B,OAAO,EAAE,OAAO,CAAC,OAAO,CAAC,CAAC;CAC3B;AAED,wBAAgB,WAAW,CAAC,OAAO,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACjE,KAAK,EAAE,IAAI,CACT,aAAa,CAAC,OAAO,CAAC,EACpB,QAAQ,GACR,UAAU,GACV,mBAAmB,GACnB,kBAAkB,GAClB,gBAAgB,GAChB,eAAe,GACf,sBAAsB,CACzB,GACA,iBAAiB,CAAC,OAAO,CAAC,CA2F5B"}