alinea/dist/dashboard/editor/InputForm.js

Headless git-based CMS

import "../../chunks/chunk-NZLE2WMY.js";

// src/dashboard/editor/InputForm.tsx
import { Field } from "alinea/core/Field";
import { Section } from "alinea/core/Section";
import { Type } from "alinea/core/Type";
import { entries } from "alinea/core/util/Objects";
import { resolveView } from "alinea/core/View";
import { useFieldOptions } from "alinea/dashboard/editor/UseField";
import { ErrorMessage } from "alinea/ui";
import { Lift } from "alinea/ui/Lift";
import { VStack } from "alinea/ui/Stack";
import { FormProvider } from "../atoms/FormAtoms.js";
import { useDashboard } from "../hook/UseDashboard.js";
import { ErrorBoundary } from "../view/ErrorBoundary.js";
import { jsx } from "react/jsx-runtime";
function InputForm(props) {
  const { views } = useDashboard();
  const type = props.type ?? props.form.type;
  const inner = /* @__PURE__ */ jsx(VStack, { gap: 20, children: Type.sections(type).map((section, i) => {
    const view = Section.view(section);
    const View = view ? resolveView(views, view) : void 0;
    if (View) return /* @__PURE__ */ jsx(View, { section }, i);
    return /* @__PURE__ */ jsx("div", { style: { display: "contents" }, children: /* @__PURE__ */ jsx(Fields, { fields: Section.fields(section), border: props.border }) }, i);
  }) });
  if (!props.form) return inner;
  return /* @__PURE__ */ jsx(FormProvider, { form: props.form, children: inner });
}
function Fields({ fields, border = true }) {
  const inner = entries(fields).map(([name, field]) => {
    return /* @__PURE__ */ jsx(InputField, { field }, name);
  });
  if (inner.length === 0) return null;
  return border ? /* @__PURE__ */ jsx(Lift, { children: inner }) : /* @__PURE__ */ jsx("div", { children: inner });
}
function MissingView({ field }) {
  return /* @__PURE__ */ jsx(ErrorMessage, { error: `Missing view for field: ${Field.label(field)}` });
}
function InputField({ field }) {
  const { views } = useDashboard();
  const view = Field.view(field);
  const options = useFieldOptions(field);
  const View = resolveView(views, view);
  if (!View) return /* @__PURE__ */ jsx(MissingView, { field });
  if (options.hidden) return null;
  return /* @__PURE__ */ jsx(ErrorBoundary, { children: /* @__PURE__ */ jsx(View, { field }) });
}
export {
  Fields,
  InputField,
  InputForm,
  MissingView
};