react-forminate/dist/index-Bi-X6zRY.js

React.js + Typescript package that creates dynamic UI forms based on the JSON schema

import { j as s, D as I } from "./index-BPZpMa2Y.js";
import $ from "react";
const h = ({
  as: i = "div",
  fieldId: v,
  columns: d = 1,
  gap: l = 16,
  fields: a,
  containerStyles: n,
  containerClassName: m,
  styles: o,
  className: c,
  itemsStyles: p,
  itemsClassName: y,
  children: u,
  header: x,
  footer: j,
  itemsParentAttributes: f,
  ...g
}) => {
  const C = (e, t, r) => ({
    ...t,
    ...r,
    ...e && {
      gridColumn: `span ${e} / span ${e}`
    }
  });
  return /* @__PURE__ */ s.jsxs("div", { style: n, className: m, children: [
    x,
    /* @__PURE__ */ s.jsxs(
      i,
      {
        className: c,
        style: {
          display: "grid",
          gridTemplateColumns: `repeat(${d}, 1fr)`,
          gap: l,
          ...o
        },
        ...g,
        children: [
          a.map((e) => {
            const {
              colSpan: t,
              style: r,
              ...F
            } = f?.[e.fieldId] || {};
            return /* @__PURE__ */ s.jsx(
              "div",
              {
                className: y,
                style: C(t, p, r),
                ...F,
                children: /* @__PURE__ */ s.jsx(I, { ...e })
              },
              e.fieldId
            );
          }),
          u
        ]
      }
    ),
    j
  ] });
}, R = $.memo(h);
export {
  R as default
};