@undermuz/react-json-form/dist/flat-form/FormField.mjs

Generate JSON-based forms with react

// src/flat-form/FormField.tsx
import { omit } from "underscore";
import { useFormContext, ConnectToForm } from "@undermuz/use-form";
import Input from "./form-input/input.mjs";
import { EnumSchemeItemType } from "../types.mjs";
import { useJsonFormUi } from "../contexts/ui.mjs";
import { useJsonFormUniqId } from "../contexts/id.mjs";
import { JFL_Nothing } from "../components/JsonFormLayout.mjs";
import { jsx } from "react/jsx-runtime";
var getFieldSettings = (props) => {
  const { type = EnumSchemeItemType.Widget, settings = {}, level } = props;
  if (type == EnumSchemeItemType.Widget) {
    const { scheme, multiple = false } = props;
    return { ...settings, scheme, multiple, level: level + 1 };
  }
  return settings;
};
var FormField = ({ children, ...props }) => {
  const Ui = useJsonFormUi();
  const Field = Ui?.Field ? Ui.Field : JFL_Nothing;
  const form = useFormContext();
  const fieldId = useJsonFormUniqId();
  const errors = form.errors[props.name];
  const isDisabled = form.values[`${props.name}__isDisabled`] || false;
  const {
    as: Cmp = Field,
    isLast = false,
    isFormPrimary,
    title,
    description,
    placeholder,
    settings,
    name,
    type = EnumSchemeItemType.Widget,
    onFormsRef,
    ..._customProps
  } = props;
  const id = `form-field-${fieldId}` + (name ? `--${name}` : "");
  const customProps = omit(
    _customProps,
    ["def_value", "single", "multiple", "rules", "scheme", "level"]
  );
  const { showLabel, showToggle } = settings || {};
  const body = /* @__PURE__ */ jsx(
    Cmp,
    {
      ...customProps,
      id,
      isLast,
      type,
      name,
      primary: isFormPrimary,
      showLabel,
      showToggle,
      title,
      description,
      errors,
      settings: getFieldSettings(props),
      children: /* @__PURE__ */ jsx(ConnectToForm, { id, name, disabled: isDisabled, children: /* @__PURE__ */ jsx(
        Input,
        {
          ...customProps,
          type,
          placeholder,
          title,
          settings: getFieldSettings(props),
          onFormsRef,
          children
        }
      ) })
    }
  );
  if (!Ui?.ItemWrapper) {
    return body;
  }
  return /* @__PURE__ */ jsx(
    Ui.ItemWrapper,
    {
      isLast,
      type,
      primary: isFormPrimary,
      title,
      children: body
    }
  );
};
var FormField_default = FormField;
export {
  FormField_default as default
};