koval-ui/dist/src/lib/Form/Form.js

React components collection with minimalistic design. Supports theming, layout, and input validation.

"use client";
import { jsx as A } from "react/jsx-runtime";
import { forwardRef as D, useCallback as e } from "react";
import N from "classnames";
import { useInternalRef as b } from "../../internal/hooks/useInternalRef.js";
import { withFormProvider as x } from "./withFormProvider.js";
import C from "./Form.module.css.js";
import { useFormActions as P, useFormSelectors as j } from "./useFormContext.js";
const u = D(
  ({
    className: p,
    children: F,
    onSubmit: m = () => {
    },
    onReset: n = () => {
    },
    onChange: c = () => {
    },
    onInvalid: f = () => {
    },
    ...d
  }, S) => {
    const { markAsPristine: i, markAsDirty: s } = P(), o = e((r) => {
      const t = new FormData(r), a = {};
      for (const [w, y] of t.entries())
        a[w] = y;
      return a;
    }, []), g = e(
      (r) => {
        r.preventDefault();
        const t = r.currentTarget, a = o(t);
        m(r, a);
      },
      [o, m]
    ), h = e(
      (r) => {
        s();
        const t = o(r.currentTarget);
        f(r, t);
      },
      [o, s, f]
    ), k = e(
      (r) => {
        const t = o(r.currentTarget);
        i(), n(r, t);
      },
      [o, n, i]
    ), { pristine: l } = j(), R = e(
      (r) => {
        l && s();
        const t = o(r.currentTarget);
        c(r, t);
      },
      [o, c, s, l]
    ), T = b(S);
    return /* @__PURE__ */ A(
      "form",
      {
        ...d,
        autoFocus: !0,
        onSubmit: g,
        onInvalid: h,
        onReset: k,
        onChange: R,
        ref: T,
        className: N(C.form, p),
        children: F
      }
    );
  }
);
u.displayName = "Form";
const G = x(u);
export {
  G as Form,
  u as FormVanilla
};
//# sourceMappingURL=Form.js.map