import { jsx as r } from "react/jsx-runtime";
import { useCallback as x } from "react";
import { F as C, a as d } from "../../FormPrimitives-CuaI5fdh.js";
import u from "./context/FieldContext.js";
import h from "../../hooks/useOptionalFormContext.js";
import n from "../grid/components/grid-cell/GridCell.js";
import { c as w } from "../../index-BtlgVD4m.js";
import N from "../box/Box.js";
const G = ({
  children: a,
  columnSpan: s,
  name: l,
  control: F,
  render: t,
  orientation: i = "vertical",
  isLoading: e
}) => {
  const m = h(), c = F ?? (m == null ? void 0 : m.control), v = x(
    (o) => s ? /* @__PURE__ */ r(n, { columnSpan: s, children: o }) : o,
    [s]
  ), p = w("flex", "gap-[var(--spacing-2)]", i === "horizontal" ? "flex-row items-start" : "flex-col");
  return v(
    l && c ? (
      // Form integration mode: RHF wires field/fieldState into context for sub-components
      /* @__PURE__ */ r(
        C,
        {
          name: l,
          control: c,
          render: ({ field: o, fieldState: f }) => t ? /* @__PURE__ */ r(d, { children: t({ field: o, fieldState: f, isLoading: e }) }) : /* @__PURE__ */ r(d, { className: p, children: /* @__PURE__ */ r(
            u,
            {
              value: {
                name: l,
                field: o,
                fieldState: f,
                orientation: i,
                isLoading: e
              },
              children: a
            }
          ) })
        }
      )
    ) : t ? (
      // Custom render in composition mode — no layout wrapper, no RHF wiring
      t({ field: void 0, fieldState: void 0, isLoading: e })
    ) : (
      // Composition mode: context provides name (for FieldLabel htmlFor), field is undefined
      /* @__PURE__ */ r(u, { value: { name: l, orientation: i, isLoading: e }, children: /* @__PURE__ */ r(N, { className: p, children: a }) })
    )
  );
};
G.displayName = "Field";
export {
  G as default
};
//# sourceMappingURL=Field.js.map
