react-formie-forms/src/components/PageRows.jsx

Renders Craft CMS Formie forms in React apps.

import React, { forwardRef } from "react";
import { BaseComponent } from "./BaseComponent";
import { isFunction } from "formik";
import { RowProvider } from "./RowContext";
import { useFormieContext } from "./FormieContext";

export const PageRows = forwardRef(({ children, ...props }, ref) => {
  const { page } = useFormieContext();

  return (
    <BaseComponent ref={ref} baseClassName={"page-rows"} {...props}>
      {page.rows.map((row, rowIndex) => (
        <RowProvider value={row} key={rowIndex}>
          {isFunction(children) ? children(row, rowIndex) : children}
        </RowProvider>
      ))}
    </BaseComponent>
  );
});