@overmap-ai/core 1.0.38-component-fields.8 → 1.0.38-component-fields.9

package/dist/forms/builder/FieldSectionWithActions.d.ts

@@ -5,6 +5,7 @@ interface FieldSectionWithActionsProps {
     field: SerializedFieldSection;
     index: number;
     dropState: DropState;
+    fieldsOnly: boolean;
 }
 export declare const FieldSectionWithActions: import("react").MemoExoticComponent<(props: FieldSectionWithActionsProps) => import("react/jsx-runtime").JSX.Element>;
 export {};

package/dist/forms/builder/FieldsEditor.d.ts

@@ -1,2 +1,6 @@
 /// <reference types="react" />
-export declare const FieldsEditor: import("react").MemoExoticComponent<() => import("react/jsx-runtime").JSX.Element>;
+interface FieldsEditorProps {
+    fieldsOnly: boolean;
+}
+export declare const FieldsEditor: import("react").MemoExoticComponent<(props: FieldsEditorProps) => import("react/jsx-runtime").JSX.Element>;
+export {};

package/dist/forms/builder/FormBuilder.d.ts

@@ -9,8 +9,16 @@ interface FormBuilderProps {
     initialTitle?: string;
     /** @default true */
     showExplainerText?: boolean;
-    /** @default false */
-    showSectionsOnly?: boolean;
+    /** @default true */
+    showFormTitle?: boolean;
+    /** Show and edit non-section fields only. Functionally, these fields will be in a single section with no label
+     * @default false
+     */
+    fieldsOnly?: boolean;
+    /** Show the Edit and Preview tabs at the top of the component. If false, the preview is entirely inaccessible.
+     * @default true
+     */
+    showTabs?: boolean;
 }
 export declare const FormBuilder: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<FormBuilderProps & import("react").RefAttributes<HTMLDivElement>>>;
 export {};

package/dist/overmap-core.js

@@ -11237,7 +11237,7 @@ const FieldWithActions = memo((props) => {
 FieldWithActions.displayName = "FieldWithActions";
 const FieldSectionWithActions = memo((props) => {
   var _a2;
-  const { field, index: sectionIndex, dropState } = props;
+  const { field, index: sectionIndex, dropState, fieldsOnly } = props;
   const isDropDisabled = (_a2 = dropState[field.identifier]) == null ? void 0 : _a2.disabled;
   const { setFieldValue, values } = useFormikContext();
   const alertDialog = useAlertDialog();
@@ -11377,7 +11377,7 @@ const FieldSectionWithActions = memo((props) => {
         mb: "4",
         children: /* @__PURE__ */ jsxs(Flex, { gap: "3", justify: "between", align: "center", children: [
           /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "2", grow: "1", children: [
-            /* @__PURE__ */ jsx(FieldBuilder, { ...editSectionProps }),
+            !fieldsOnly && /* @__PURE__ */ jsx(FieldBuilder, { ...editSectionProps }),
             /* @__PURE__ */ jsx(
               Droppable,
               {
@@ -11421,7 +11421,7 @@ const FieldSectionWithActions = memo((props) => {
               }
             )
           ] }),
-          /* @__PURE__ */ jsx(
+          !fieldsOnly && /* @__PURE__ */ jsx(
             FieldActions,
             {
               index: sectionIndex,
@@ -11498,7 +11498,8 @@ const findSection = (fields, sectionId) => {
       return [section, i];
   }
 };
-const FieldsEditor = memo(() => {
+const FieldsEditor = memo((props) => {
+  const { fieldsOnly } = props;
   const { values, setFieldValue } = useFormikContext();
   const [dropState, dispatch] = useReducer(reducer, values.fields, initializer);
   const { reorderSection, reorderField } = useFieldReordering();
@@ -11551,8 +11552,16 @@ const FieldsEditor = memo(() => {
       gap: "0",
       children: [
         values.fields.map((field, index2) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
-          /* @__PURE__ */ jsx(FieldSectionWithActions, { field, index: index2, dropState }),
-          /* @__PURE__ */ jsxs(
+          /* @__PURE__ */ jsx(
+            FieldSectionWithActions,
+            {
+              field,
+              index: index2,
+              dropState,
+              fieldsOnly
+            }
+          ),
+          !fieldsOnly && /* @__PURE__ */ jsxs(
             Button,
             {
               className: styles$1.addSectionButton,
@@ -11580,7 +11589,16 @@ const previewSubmit = () => {
 };
 const FormBuilder = memo(
   forwardRef((props, ref) => {
-    const { onCancel, onSave, revision, initialTitle, showExplainerText = true, showSectionsOnly = false } = props;
+    const {
+      onCancel,
+      onSave,
+      revision,
+      initialTitle,
+      showExplainerText = true,
+      showFormTitle = true,
+      fieldsOnly = false,
+      showTabs = true
+    } = props;
     const { showError } = useToast();
     const validate = useCallback(
       (form) => {
@@ -11643,7 +11661,7 @@ const FormBuilder = memo(
     });
     const previewSchema = useMemo(() => formRevisionToSchema(formik.values), [formik.values]);
     return /* @__PURE__ */ jsx(Tabs.Root, { ref, defaultValue: "edit", children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "2", children: [
-      /* @__PURE__ */ jsxs(Tabs.List, { className: styles$7.tabsList, children: [
+      showTabs && /* @__PURE__ */ jsxs(Tabs.List, { className: styles$7.tabsList, children: [
         /* @__PURE__ */ jsx(Tabs.Trigger, { className: styles$7.tabTrigger, value: "edit", children: /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "2", children: [
           /* @__PURE__ */ jsx(Pencil1Icon, {}),
           "Edit"
@@ -11664,7 +11682,7 @@ const FormBuilder = memo(
         ] }),
         /* @__PURE__ */ jsx(Flex, { asChild: true, direction: "column", gap: "2", mt: "3", children: /* @__PURE__ */ jsxs("form", { id: formId, onSubmit: formik.handleSubmit, children: [
           /* @__PURE__ */ jsxs(FormikProvider, { value: formik, children: [
-            !showSectionsOnly && /* @__PURE__ */ jsxs(Fragment, { children: [
+            showFormTitle && /* @__PURE__ */ jsxs(Fragment, { children: [
               /* @__PURE__ */ jsx(
                 PatchField,
                 {
@@ -11710,7 +11728,7 @@ const FormBuilder = memo(
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx(FieldsEditor, {}),
+            /* @__PURE__ */ jsx(FieldsEditor, { fieldsOnly }),
             /* @__PURE__ */ jsx(Text, { severity: "danger", size: "1", children: typeof formik.errors.fields === "string" && formik.errors.fields })
           ] }),
           /* @__PURE__ */ jsxs(Flex, { className: styles$7.floatingButtonContainer, align: "center", justify: "end", gap: "2", children: [
@@ -11719,7 +11737,7 @@ const FormBuilder = memo(
           ] })
         ] }) })
       ] }),
-      /* @__PURE__ */ jsx(Tabs.Content, { value: "preview", children: /* @__PURE__ */ jsx(FormRenderer, { schema: previewSchema, onSubmit: previewSubmit, hideTitle: showSectionsOnly }) })
+      /* @__PURE__ */ jsx(Tabs.Content, { value: "preview", children: /* @__PURE__ */ jsx(FormRenderer, { schema: previewSchema, onSubmit: previewSubmit, hideTitle: !showFormTitle }) })
     ] }) });
   })
 );