@overmap-ai/core 1.0.33-revamp-forms-builder.22 → 1.0.33-revamp-forms-builder.24

package/dist/overmap-core.js

@@ -6089,7 +6089,7 @@ const OvermapProvider = (props) => {
   }
   return /* @__PURE__ */ jsx(OvermapContext.Provider, { value: null, children: ret });
 };
-const description$2 = "_description_o5vqt_1";
+const description$1 = "_description_o5vqt_1";
 const floatingButtonContainer$1 = "_floatingButtonContainer_o5vqt_5";
 const tabsList = "_tabsList_o5vqt_12";
 const tabTrigger = "_tabTrigger_o5vqt_20";
@@ -6097,7 +6097,7 @@ const patchfieldBorder = "_patchfieldBorder_o5vqt_24";
 const title = "_title_o5vqt_24";
 const error = "_error_o5vqt_40";
 const styles$7 = {
-  description: description$2,
+  description: description$1,
   floatingButtonContainer: floatingButtonContainer$1,
   tabsList,
   tabTrigger,
@@ -6200,10 +6200,10 @@ class BaseField extends BaseFormElement {
 }
 __publicField(BaseField, "fieldTypeName");
 __publicField(BaseField, "fieldTypeDescription");
-const description$1 = "_description_1p32e_1";
+const description = "_description_1p32e_1";
 const floatingButtonContainer = "_floatingButtonContainer_1p32e_5";
 const styles$6 = {
-  description: description$1,
+  description,
   floatingButtonContainer
 };
 const InputWithLabel = (props) => {
@@ -6294,7 +6294,6 @@ const BooleanInput = memo((props) => {
           value: value.toString(),
           checked: value,
           onCheckedChange: fieldProps.onChange,
-          alwaysShow: true,
           onChange: void 0,
           onBlur: void 0
         }
@@ -7354,7 +7353,7 @@ const layoutPropDefs = {
 };
 function extractLayoutProps(props) {
   const { rest: paddingRest, ...paddingProps } = extractPaddingProps(props);
-  const { position = layoutPropDefs.position.default, width = layoutPropDefs.width.default, height = layoutPropDefs.height.default, inset = layoutPropDefs.inset.default, top = layoutPropDefs.top.default, bottom = layoutPropDefs.bottom.default, left = layoutPropDefs.left.default, right = layoutPropDefs.right.default, shrink = layoutPropDefs.shrink.default, grow = layoutPropDefs.grow.default, ...rest } = paddingRest;
+  const { position = layoutPropDefs.position.default, width = layoutPropDefs.width.default, height = layoutPropDefs.height.default, inset = layoutPropDefs.inset.default, top = layoutPropDefs.top.default, bottom = layoutPropDefs.bottom.default, left = layoutPropDefs.left.default, right = layoutPropDefs.right.default, shrink = layoutPropDefs.shrink.default, grow: grow2 = layoutPropDefs.grow.default, ...rest } = paddingRest;
   return {
     ...paddingProps,
     position,
@@ -7366,7 +7365,7 @@ function extractLayoutProps(props) {
     left,
     right,
     shrink,
-    grow,
+    grow: grow2,
     rest
   };
 }
@@ -10276,15 +10275,15 @@ const FieldActions = memo((props) => {
   ] });
 });
 FieldActions.displayName = "FieldActions";
-const popoverInputsContainer = "_popoverInputsContainer_18pn8_1";
-const typeBadge = "_typeBadge_18pn8_5";
-const description = "_description_18pn8_10";
-const previewInput = "_previewInput_18pn8_14";
+const popoverInputsContainer = "_popoverInputsContainer_95i8x_1";
+const typeBadge = "_typeBadge_95i8x_5";
+const previewInput = "_previewInput_95i8x_10";
+const grow = "_grow_95i8x_14";
 const styles = {
   popoverInputsContainer,
   typeBadge,
-  description,
-  previewInput
+  previewInput,
+  grow
 };
 const FieldSettingsPopover = memo((props) => {
   const { popoverInputs, hasError } = props;
@@ -10354,6 +10353,16 @@ const FieldBuilder = memo((props) => {
     }
     conditionValue = Array.isArray((_c = initial.condition) == null ? void 0 : _c.value) ? initial.condition.value.map((v) => typeof v === "string" ? v : v.label).join(", ") : (_e = (_d = initial.condition) == null ? void 0 : _d.value) == null ? void 0 : _e.toString();
   }
+  const handleInputChangeForInput = useCallback((event) => {
+    if (event.target.parentNode instanceof HTMLElement) {
+      event.target.parentNode.dataset.replicatedValue = event.target.value;
+    }
+  }, []);
+  const handleInputChangeForTextArea = useCallback((event) => {
+    if (event.target.parentNode instanceof HTMLElement) {
+      event.target.parentNode.dataset.replicatedValue = event.target.value;
+    }
+  }, []);
   const type = initial.type;
   const fieldCls = CompleteFieldTypeToClsMapping[type];
   const [directlyShownFields, popoverFields] = useMemo(() => {
@@ -10412,7 +10421,7 @@ const FieldBuilder = memo((props) => {
   const deserializedField = useMemo(() => deserialize(initial), [initial]);
   const previewInput2 = useFieldInput(deserializedField, { formId, disabled: true, showInputOnly: true });
   return /* @__PURE__ */ jsxs(Flex, { align: "center", grow: "1", children: [
-    /* @__PURE__ */ jsxs(Flex, { direction: "column", grow: "1", children: [
+    /* @__PURE__ */ jsxs(Flex, { direction: "column", children: [
       fieldCls === FieldSection && /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "1", children: [
         directlyShownFields.length > 0 && directlyShownInputs,
         /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "2", children: [
@@ -10437,8 +10446,7 @@ const FieldBuilder = memo((props) => {
               {
                 checked: value,
                 onCheckedChange: setValue,
-                label: /* @__PURE__ */ jsx(Text, { size: "2", children: "Required field" }),
-                alwaysShow: true
+                label: /* @__PURE__ */ jsx(Text, { size: "2", children: "Required field" })
               }
             )
           }
@@ -10455,11 +10463,13 @@ const FieldBuilder = memo((props) => {
           render: ({ setValue, value }) => /* @__PURE__ */ jsx(
             Input,
             {
+              className: styles.grow,
               placeholder: `Enter a ${type === "section" ? "section" : "field"} label`,
               value,
               onChange: (event) => {
                 setValue(event.target.value);
               },
+              onInput: handleInputChangeForInput,
               maxLength: 200,
               showInputLength: false,
               variant: "ghost",
@@ -10476,13 +10486,14 @@ const FieldBuilder = memo((props) => {
           render: ({ setValue, value }) => /* @__PURE__ */ jsx(
             TextArea,
             {
-              className: styles.description,
+              className: styles.grow,
               placeholder: `Enter a ${type === "section" ? "section" : "field"} description`,
               value,
               onChange: (event) => {
                 setValue(event.target.value);
               },
-              resize: "vertical",
+              onInput: handleInputChangeForTextArea,
+              resize: "none",
               maxLength: 1e3,
               showInputLength: false,
               variant: "ghost"
@@ -10849,36 +10860,6 @@ const findSection = (fields, sectionId) => {
       return [section, i];
   }
 };
-const BasicFieldSection = memo((props) => {
-  const { field, provided } = props;
-  return /* @__PURE__ */ jsx(
-    Card,
-    {
-      ref: provided == null ? void 0 : provided.innerRef,
-      ...provided == null ? void 0 : provided.draggableProps,
-      ...provided == null ? void 0 : provided.dragHandleProps,
-      style: { ...provided == null ? void 0 : provided.draggableProps.style, height: "80px" },
-      children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "2", children: [
-        /* @__PURE__ */ jsxs(Flex, { direction: "row", gap: "2", children: [
-          /* @__PURE__ */ jsx(Text, { size: "4", children: field.label }),
-          /* @__PURE__ */ jsx(Badge, { className: styles$1.typeBadge, children: /* @__PURE__ */ jsxs(Text, { children: [
-            field.fields.length,
-            " fields"
-          ] }) })
-        ] }),
-        /* @__PURE__ */ jsx(Flex, { direction: "row", gap: "2", children: field.fields.map((child) => {
-          const childInfo = FieldTypeToClsMapping[child.type];
-          const Icon = childInfo.Icon;
-          return /* @__PURE__ */ jsx(Flex, { gap: "3", children: /* @__PURE__ */ jsxs(Badge, { className: styles$1.typeBadge, children: [
-            /* @__PURE__ */ jsx(Icon, {}),
-            /* @__PURE__ */ jsx(Text, { children: childInfo.fieldTypeName })
-          ] }) }, child.identifier);
-        }) })
-      ] })
-    }
-  );
-});
-BasicFieldSection.displayName = "BasicFieldSection";
 const FieldsEditor = memo(() => {
   const { values, setFieldValue } = useFormikContext();
   const [dropState, dispatch] = useReducer(reducer, values.fields, initializer);