@overmap-ai/core 1.0.38-component-fields.1 → 1.0.38-component-fields.3

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

@@ -4,7 +4,6 @@ interface FieldWithActionsProps {
     field: ISerializedField;
     index: number;
     sectionIndex: number;
-    takenLabels: string[];
     remove: () => void;
 }
 export declare const FieldWithActions: import("react").MemoExoticComponent<(props: FieldWithActionsProps) => import("react/jsx-runtime").JSX.Element>;

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

@@ -6,6 +6,11 @@ interface FormBuilderProps {
     onSave: FormBuilderSaveHandler;
     /** A revision of an existing form to edit. To create a new form, pass `undefined`. */
     revision?: UserFormRevision;
+    initialTitle?: string;
+    /** @default true */
+    showExplainerText?: boolean;
+    /** @default false */
+    showSectionsOnly?: boolean;
 }
 export declare const FormBuilder: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<FormBuilderProps & import("react").RefAttributes<HTMLDivElement>>>;
 export {};

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

@@ -13,8 +13,6 @@ export declare function remove<T>(list: T[], index: number): T[];
 export declare const makeIdentifier: (existing: unknown, label: string) => string;
 export declare const findFieldByIdentifier: (fields: ISerializedField[], identifier?: string) => ISerializedField | null;
 export declare const makeConditionalSourceFields: (sections: SerializedFieldSection[], index: number) => (import("../typings").SerializedTextField | import("../typings").SerializedBooleanField | import("../typings").SerializedNumberField | import("../typings").SerializedDateField | import("../typings").SerializedStringField | import("../typings").SerializedSelectField | import("../typings").SerializedMultiStringField | import("../typings").SerializedMultiSelectField | import("../typings").SerializedUploadField)[];
-export declare const getTakenFieldLabels: (fields: SerializedFieldSection[]) => string[];
-export declare const incrementFieldLabel: (label: string, takenLabels: string[]) => string;
 export type NewFieldInitialValues = Omit<ISerializedField, "identifier"> & {
     label: string;
 };

package/dist/overmap-core.js

@@ -5440,6 +5440,7 @@ class UserFormService extends BaseApiService {
     const activeWorkspaceId = state.workspaceReducer.activeWorkspaceId;
     const offlineFormPayload = offline({});
     const offlineRevisionPayload = offline(initialRevision);
+    console.log(componentType);
     const retForm = {
       ...offlineFormPayload,
       index_workspace: activeWorkspaceId,
@@ -5449,6 +5450,7 @@ class UserFormService extends BaseApiService {
       ...componentType && { component_type: componentType },
       ...ownerAttrs
     };
+    console.log(retForm);
     const { payloadWithoutImage, images } = await separateImageFromFields(offlineRevisionPayload);
     const retRevision = {
       ...payloadWithoutImage,
@@ -9070,21 +9072,10 @@ const findFieldByIdentifier = (fields, identifier) => {
 const makeConditionalSourceFields = (sections, index2) => {
   return sections.filter((_, i) => i < index2).flatMap((field) => field.fields);
 };
-const getTakenFieldLabels = (fields) => {
-  return fields.flatMap((field) => [...field.fields.map((f) => f.label), field.label]).filter((id) => id !== null);
-};
-const incrementFieldLabel = (label, takenLabels) => {
-  let count = 1;
-  let newLabel = `${label} (${count})`;
-  while (takenLabels.includes(newLabel)) {
-    newLabel = `${label} (${++count})`;
-  }
-  return newLabel;
-};
-const createNewField = (parentPath, index2, initialValues2, values, setFieldValue) => {
-  const { label } = initialValues2;
+const createNewField = (parentPath, index2, initialValues, values, setFieldValue) => {
+  const { label } = initialValues;
   const newField = {
-    ...initialValues2,
+    ...initialValues,
     identifier: makeIdentifier(null, label)
   };
   const parent = get(values, parentPath);
@@ -9098,11 +9089,11 @@ const createNewField = (parentPath, index2, initialValues2, values, setFieldValu
   void setFieldValue(parentPath, updatedFields).then();
 };
 const createNewEmptySection = (index2, values, setFieldValue) => {
-  const initialValues2 = {
+  const initialValues = {
     ...emptySection(),
     label: ""
   };
-  createNewField("fields", index2, initialValues2, values, setFieldValue);
+  createNewField("fields", index2, initialValues, values, setFieldValue);
 };
 const useFieldReordering = () => {
   const { showError } = useToast();
@@ -10590,19 +10581,19 @@ PatchField.displayName = "PatchField";
 const PatchFormProvider = memo(
   forwardRef((props, ref) => {
     const { children, schema, values, onPatch, onError, requiresDiff = true, onDirtyChange, ...rest } = props;
-    const initialValues2 = useMemo(() => initialFormValues(schema.fields, values), [schema.fields, values]);
+    const initialValues = useMemo(() => initialFormValues(schema.fields, values), [schema.fields, values]);
     const getDiff = useCallback(
       (values2) => {
         const diff = {};
         for (const key in values2) {
           const value = values2[key];
-          if (value !== initialValues2[key] && value !== void 0) {
+          if (value !== initialValues[key] && value !== void 0) {
             diff[key] = value;
           }
         }
         return diff;
       },
-      [initialValues2]
+      [initialValues]
     );
     const handlePatch = useCallback(
       (values2) => {
@@ -10628,7 +10619,7 @@ const PatchFormProvider = memo(
       [schema, onDirtyChange, onError, getDiff]
     );
     const formik = useFormik({
-      initialValues: initialValues2,
+      initialValues,
       onSubmit: handlePatch,
       validate,
       // only validate the entire form on submit
@@ -10646,9 +10637,9 @@ const PatchFormProvider = memo(
     const { errors, resetForm } = formik;
     useEffect(() => {
       if (hasKeys(errors)) {
-        resetForm({ values: initialValues2, errors: {} });
+        resetForm({ values: initialValues, errors: {} });
       }
-    }, [errors, initialValues2, resetForm]);
+    }, [errors, initialValues, resetForm]);
     return /* @__PURE__ */ jsx(FormikProvider, { value: formik, children: /* @__PURE__ */ jsx("form", { ...rest, ref, onSubmit: formik.handleSubmit, onChange: handleChange, children }) });
   })
 );
@@ -11097,7 +11088,7 @@ const FieldBuilder = memo((props) => {
 });
 FieldBuilder.displayName = "FieldBuilder";
 const FieldWithActions = memo((props) => {
-  const { field, index: index2, sectionIndex, takenLabels, remove: remove2 } = props;
+  const { field, index: index2, sectionIndex, remove: remove2 } = props;
   const { setFieldValue, values } = useFormikContext();
   const { reorderField } = useFieldReordering();
   const { showError } = useToast();
@@ -11114,10 +11105,10 @@ const FieldWithActions = memo((props) => {
     const label = field.label ?? "Unlabelled field";
     const duplicatedField = {
       ...field,
-      label: incrementFieldLabel(label, takenLabels)
+      label
     };
     createNewField(parentPath, index2 + 1, duplicatedField, values, setFieldValue);
-  }, [field, takenLabels, parentPath, index2, values, setFieldValue]);
+  }, [field, parentPath, index2, values, setFieldValue]);
   const moveField = useCallback(
     (direction) => {
       const srcSectionIndex = sectionIndex;
@@ -11204,7 +11195,6 @@ const FieldSectionWithActions = memo((props) => {
   const { setFieldValue, values } = useFormikContext();
   const alertDialog = useAlertDialog();
   const { reorderSection } = useFieldReordering();
-  const takenFieldLabels = getTakenFieldLabels(values.fields);
   const removeSectionConditions = useCallback(
     (sectionsToUpdate, allSections) => {
       for (const section of sectionsToUpdate) {
@@ -11308,18 +11298,15 @@ const FieldSectionWithActions = memo((props) => {
   );
   const duplicateSection = useCallback(() => {
     const fieldLabel = field.label ?? "Untitled section";
-    const newSectionLabel = incrementFieldLabel(fieldLabel, takenFieldLabels);
-    const newFields = field.fields.map((f) => {
-      const newLabel = incrementFieldLabel(f.label, takenFieldLabels);
+    const newFields = field.fields.map((oldField) => {
       return {
-        ...f,
-        label: newLabel,
-        identifier: makeIdentifier(null, newLabel)
+        ...oldField,
+        identifier: makeIdentifier(null, oldField.label)
       };
     });
-    const duplicatedField = { ...field, label: newSectionLabel, fields: newFields };
+    const duplicatedField = { ...field, label: fieldLabel, fields: newFields };
     createNewField("fields", sectionIndex + 1, duplicatedField, values, setFieldValue);
-  }, [field, takenFieldLabels, sectionIndex, values, setFieldValue]);
+  }, [field, sectionIndex, values, setFieldValue]);
   const handleCreateField = useCallback(
     (type) => {
       createNewField(
@@ -11366,8 +11353,7 @@ const FieldSectionWithActions = memo((props) => {
                           sectionIndex,
                           remove: () => {
                             removeField(i);
-                          },
-                          takenLabels: takenFieldLabels
+                          }
                         },
                         child.identifier
                       )),
@@ -11542,17 +11528,12 @@ const FieldsEditor = memo(() => {
   ) }) });
 });
 FieldsEditor.displayName = "FieldsEditor";
-const initialValues = {
-  title: "",
-  description: "",
-  fields: [{ ...emptySection(makeIdentifier(null, "")), label: "" }]
-};
 const previewSubmit = () => {
   alert("This is a form preview, your data will not be saved.");
 };
 const FormBuilder = memo(
   forwardRef((props, ref) => {
-    const { onCancel, onSave, revision } = props;
+    const { onCancel, onSave, revision, initialTitle, showExplainerText = true, showSectionsOnly = false } = props;
     const { showError } = useToast();
     const validate = useCallback(
       (form) => {
@@ -11598,6 +11579,14 @@ const FormBuilder = memo(
       },
       [showError]
     );
+    const initialValues = useMemo(
+      () => ({
+        title: initialTitle ?? "",
+        description: "",
+        fields: [{ ...emptySection(makeIdentifier(null, "")), label: "" }]
+      }),
+      [initialTitle]
+    );
     const formik = useFormik({
       initialValues: wrapRootFieldsWithFieldSection(revision) ?? initialValues,
       validate,
@@ -11618,7 +11607,7 @@ const FormBuilder = memo(
         ] }) })
       ] }),
       /* @__PURE__ */ jsxs(Tabs.Content, { value: "edit", children: [
-        /* @__PURE__ */ jsxs(Text, { children: [
+        showExplainerText && /* @__PURE__ */ jsxs(Text, { children: [
           "Create your form using various field types. Sections can be",
           " ",
           /* @__PURE__ */ jsx("strong", { children: "conditionally rendered" }),
@@ -11628,60 +11617,62 @@ 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: [
-            /* @__PURE__ */ jsx(
-              PatchField,
-              {
-                name: "title",
-                render: ({ setValue, value, meta }) => /* @__PURE__ */ jsx(InputWithHelpText, { severity: "danger", helpText: meta.error ?? null, children: /* @__PURE__ */ jsx(
-                  Input,
-                  {
-                    className: classNames$1(styles$7.title, {
-                      [styles$7.error]: meta.error
-                    }),
-                    placeholder: "Form title",
-                    value,
-                    onChange: (event) => {
-                      setValue(event.target.value);
-                    },
-                    maxLength: 100,
-                    showInputLength: false,
-                    variant: "ghost",
-                    size: "large"
-                  }
-                ) })
-              }
-            ),
-            /* @__PURE__ */ jsx(
-              PatchField,
-              {
-                name: "description",
-                render: ({ setValue, value }) => /* @__PURE__ */ jsx(
-                  TextArea,
-                  {
-                    className: styles$7.description,
-                    placeholder: "Explain the purpose of this form",
-                    value,
-                    onChange: (event) => {
-                      setValue(event.target.value);
-                    },
-                    resize: "vertical",
-                    maxLength: 1e3,
-                    showInputLength: false,
-                    variant: "ghost"
-                  }
-                )
-              }
-            ),
+            !showSectionsOnly && /* @__PURE__ */ jsxs(Fragment, { children: [
+              /* @__PURE__ */ jsx(
+                PatchField,
+                {
+                  name: "title",
+                  render: ({ setValue, value, meta }) => /* @__PURE__ */ jsx(InputWithHelpText, { severity: "danger", helpText: meta.error ?? null, children: /* @__PURE__ */ jsx(
+                    Input,
+                    {
+                      className: classNames$1(styles$7.title, {
+                        [styles$7.error]: meta.error
+                      }),
+                      placeholder: "Form title",
+                      value,
+                      onChange: (event) => {
+                        setValue(event.target.value);
+                      },
+                      maxLength: 100,
+                      showInputLength: false,
+                      variant: "ghost",
+                      size: "large"
+                    }
+                  ) })
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                PatchField,
+                {
+                  name: "description",
+                  render: ({ setValue, value }) => /* @__PURE__ */ jsx(
+                    TextArea,
+                    {
+                      className: styles$7.description,
+                      placeholder: "Explain the purpose of this form",
+                      value,
+                      onChange: (event) => {
+                        setValue(event.target.value);
+                      },
+                      resize: "vertical",
+                      maxLength: 1e3,
+                      showInputLength: false,
+                      variant: "ghost"
+                    }
+                  )
+                }
+              )
+            ] }),
             /* @__PURE__ */ jsx(FieldsEditor, {}),
             /* @__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: [
-            /* @__PURE__ */ jsx(Button, { type: "button", variant: "solid", severity: "info", onClick: onCancel, children: "Cancel" }),
+            onCancel && /* @__PURE__ */ jsx(Button, { type: "button", variant: "solid", severity: "info", onClick: onCancel, children: "Cancel" }),
             /* @__PURE__ */ jsx(Button, { type: "submit", children: "Save form" })
           ] })
         ] }) })
       ] }),
-      /* @__PURE__ */ jsx(Tabs.Content, { value: "preview", children: /* @__PURE__ */ jsx(FormRenderer, { schema: previewSchema, onSubmit: previewSubmit }) })
+      /* @__PURE__ */ jsx(Tabs.Content, { value: "preview", children: /* @__PURE__ */ jsx(FormRenderer, { schema: previewSchema, onSubmit: previewSubmit, hideTitle: showSectionsOnly }) })
     ] }) });
   })
 );