@integration-app/react 2.0.3-beta.3 → 2.0.3

package/dist/esm/components/DataBuilder/Formula/case.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
@@ -12,15 +12,33 @@ import useDataBuilderField from '../field-context.mjs';
 import { Truncate } from '../../Truncate/index.mjs';
 import { ComboBoxTag } from '../../ComboBoxElements/ComboBoxTag.mjs';
 import { forwardRef } from 'react';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
-import { Button } from '../../Button/Button.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { ActionBar } from '../../DataBuilderUI/index.mjs';
 import useEventStopPropagation from '../../../hooks/useEventStopPropagation.mjs';
 import DataBuilderCondition from '../Condition/index.mjs';
 import DataBuilderFormField from '../Field.mjs';
 import { makeSubField } from '../data-field.mjs';
 import classes from './styles.module.css.mjs';
+import '../../../styled-system/css/css.mjs';
+import '../../../styled-system/helpers.mjs';
+import { sva } from '../../../styled-system/css/sva.mjs';
+import { Button } from '../../../ui-kit/button.mjs';
 
+const addCaseRecipe = sva({
+  className: "add-case",
+  slots: ["button"],
+  base: {
+    button: {
+      w: "fit-content",
+      h: "fit-content",
+      rounded: "xl",
+      color: "slate.11",
+      px: "2",
+      py: "1",
+      my: "2"
+    }
+  }
+});
 const CaseFormula = forwardRef(
   (_props, ref) => {
     return /* @__PURE__ */ jsx(ComboBoxTag, { ref, icon: SvgIconType.Array, variant: "lookup", children: /* @__PURE__ */ jsx(Truncate, { children: "Conditional value" }) });
@@ -32,6 +50,7 @@ function CaseFormulaDropdown({
   onChange
 }) {
   const { field } = useDataBuilderField();
+  const styles = addCaseRecipe();
   if (formula?.type !== DataBuilderFormulaType.CASE) {
     return /* @__PURE__ */ jsx("span", { children: "Unexpected value for Case drilldown. Something went wrong." });
   }
@@ -114,7 +133,17 @@ function CaseFormulaDropdown({
       },
       index
     )),
-    /* @__PURE__ */ jsx("div", { className: "my-4", children: /* @__PURE__ */ jsx(Button, { onClick: handleNewCase, variant: "secondary", children: "+ Add Case" }) }),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        onClick: handleNewCase,
+        variant: "outline",
+        colorPalette: "gray",
+        size: "sm",
+        className: styles.button,
+        children: "+ Add Case"
+      }
+    ),
     /* @__PURE__ */ jsx(DataBuilderFormField, { field: defaultCaseField, onChange: handleDefaultValueChange })
   ] });
 }

package/dist/esm/components/DataBuilder/Formula/concat.mjs

@@ -2,14 +2,14 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { makeDataField } from '../index.mjs';
 import DataBuilderFormField from '../Field.mjs';
 

package/dist/esm/components/DataBuilder/Formula/copy.mjs

@@ -2,17 +2,17 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { ComboBox } from '../../ComboBox/index.mjs';
+import { ComboBox } from '../../ComboBox/ComboBox.mjs';
 import { ComboBoxTag } from '../../ComboBoxElements/ComboBoxTag.mjs';
 import { TagPlaceholder } from '../../Tag/TagPlaceholder.mjs';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
 import { getValueSpecFromSchema } from '../../ComboBox/value-spec.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { forwardRef } from 'react';
 import { locatorToField, getFullNameForLocator } from '@integration-app/sdk';
 import useDataBuilderField from '../field-context.mjs';

package/dist/esm/components/DataBuilder/Formula/domainFromEmail.mjs

@@ -2,13 +2,13 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { forwardRef } from 'react';
 import { DataBuilderForm } from '../Form.mjs';
 import { makeDataField } from '../index.mjs';

package/dist/esm/components/DataBuilder/Formula/extractDate.mjs

@@ -2,13 +2,13 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { forwardRef } from 'react';
 import { DataBuilderForm } from '../Form.mjs';
 import { makeDataField } from '../index.mjs';

package/dist/esm/components/DataBuilder/Formula/extractTime.mjs

@@ -2,13 +2,13 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { forwardRef } from 'react';
 import { DataBuilderForm } from '../Form.mjs';
 import { makeDataField } from '../index.mjs';

package/dist/esm/components/DataBuilder/Formula/findAppRecordId.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
@@ -10,7 +10,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { DataBuilderFormulaType } from '@integration-app/sdk';
 import { forwardRef } from 'react';
 import { ComboBoxTag } from '../../ComboBoxElements/ComboBoxTag.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { Truncate } from '../../Truncate/index.mjs';
 import useDataBuilder from '../data-builder-context.mjs';
 import useDataBuilderField from '../field-context.mjs';

package/dist/esm/components/DataBuilder/Formula/findExternalRecordId.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
@@ -10,7 +10,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { DataBuilderFormulaType } from '@integration-app/sdk';
 import { ComboBoxTag } from '../../ComboBoxElements/ComboBoxTag.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { Truncate } from '../../Truncate/index.mjs';
 import useDataBuilderField from '../field-context.mjs';
 import useDataBuilder from '../data-builder-context.mjs';

package/dist/esm/components/DataBuilder/Formula/firstName.mjs

@@ -2,13 +2,13 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { forwardRef } from 'react';
 import { DataBuilderForm } from '../Form.mjs';
 import { makeDataField } from '../index.mjs';

package/dist/esm/components/DataBuilder/Formula/firstNotEmpty.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
@@ -10,7 +10,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { schemaWithTitle } from '@integration-app/sdk';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import useDataBuilderField from '../field-context.mjs';
 import { makeSubField } from '../data-field.mjs';
 import { DrilldownBlockContentWrapper } from '../../DataBuilderUI/index.mjs';

package/dist/esm/components/DataBuilder/Formula/index.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 

package/dist/esm/components/DataBuilder/Formula/iterate.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
@@ -11,7 +11,7 @@ import { schemaWithTitle, buildDataSchema } from '@integration-app/sdk';
 import { makeDataField } from '../index.mjs';
 import { forwardRef } from 'react';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { makeSubField } from '../data-field.mjs';
 import DataBuilderFormField from '../Field.mjs';
 import useDataBuilderField from '../field-context.mjs';

package/dist/esm/components/DataBuilder/Formula/jsonata.mjs

@@ -2,14 +2,14 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { DataBuilderForm } from '../Form.mjs';
 import { makeDataField } from '../index.mjs';
 

package/dist/esm/components/DataBuilder/Formula/lastName.mjs

@@ -2,13 +2,13 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { forwardRef } from 'react';
 import { DataBuilderForm } from '../Form.mjs';
 import { makeDataField } from '../index.mjs';

package/dist/esm/components/DataBuilder/Formula/lookup.mjs

@@ -2,16 +2,17 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { ComboBoxTag } from '../../ComboBoxElements/ComboBoxTag.mjs';
-import { Tag } from '../../Tag/index.mjs';
+import { Tag } from '../../Tag/Tag.mjs';
+import '../../Tag/TagPlaceholder.mjs';
 import { Truncate } from '../../Truncate/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 
 const LookupFormula = forwardRef((props, ref) => {
   const { formula } = props;

package/dist/esm/components/DataBuilder/Formula/map.mjs

@@ -2,14 +2,14 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import useDataBuilderField from '../field-context.mjs';
 import { ValueMapping } from '../Nested/ValueMapping.mjs';
 import { DataBuilderForm } from '../Form.mjs';

package/dist/esm/components/DataBuilder/Formula/mergeObjects.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
@@ -10,7 +10,7 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { forwardRef } from 'react';
 import { schemaWithTitle } from '@integration-app/sdk';
 import { Formula, Variable, VariableSvgIcon } from '../../Formula/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { DrilldownBlockContentWrapper } from '../../DataBuilderUI/index.mjs';
 import DataBuilderFormField from '../Field.mjs';
 import useDataBuilderField from '../field-context.mjs';

package/dist/esm/components/DataBuilder/Formula/noUi.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 

package/dist/esm/components/DataBuilder/Formula/record.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 

package/dist/esm/components/DataBuilder/Formula/styles.module.css.mjs

@@ -1,7 +1,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 

package/dist/esm/components/DataBuilder/Formula/tpl.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 

package/dist/esm/components/DataBuilder/Formula/var.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
@@ -11,7 +11,8 @@ import { forwardRef, Fragment as Fragment$1 } from 'react';
 import clsx from 'clsx';
 import { getIconUriForLocator, getNameComponentsForLocator, getFullNameForLocator } from '@integration-app/sdk';
 import { ComboBoxTag } from '../../ComboBoxElements/ComboBoxTag.mjs';
-import { Tag } from '../../Tag/index.mjs';
+import { Tag } from '../../Tag/Tag.mjs';
+import '../../Tag/TagPlaceholder.mjs';
 import { SegmentSeparator } from '../../Tag/SegmentSeparator.mjs';
 import classes from './styles.module.css.mjs';
 

package/dist/esm/components/DataBuilder/Nested/ArrayItems.mjs

@@ -2,13 +2,13 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { NestedLevel, Row, Cell } from '../../DataBuilderUI/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { DataBuilderFieldProvider } from '../field-context.mjs';
 import { FieldDelete } from '../FieldDelete.mjs';
 import DataBuilderFormFieldValue from '../FieldValue/index.mjs';

package/dist/esm/components/DataBuilder/Nested/FieldControlPanel/AddingFieldSelector.mjs

@@ -2,15 +2,15 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { getFullNameForLocator } from '@integration-app/sdk';
 import { Row, Cell } from '../../../DataBuilderUI/index.mjs';
-import { ComboBox } from '../../../ComboBox/index.mjs';
-import { SvgIconType } from '../../../SvgIcon/index.mjs';
+import { ComboBox } from '../../../ComboBox/ComboBox.mjs';
+import { SvgIconType } from '../../../SvgIcon/svg-icon-type.mjs';
 import { TagPlaceholder } from '../../../Tag/TagPlaceholder.mjs';
 import { isObjectAllowedAdditionalProperties, fieldLabel } from '../../data-field.mjs';
 

package/dist/esm/components/DataBuilder/Nested/FieldControlPanel/ControlPanel.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
@@ -11,11 +11,13 @@ import { useState, Fragment as Fragment$1 } from 'react';
 import { Truncate } from '../../../Truncate/index.mjs';
 import { isFieldVisible, isObjectAllowedAdditionalProperties, DEFAULT_FIELD_KEY } from '../../data-field.mjs';
 import useEventStopPropagation from '../../../../hooks/useEventStopPropagation.mjs';
-import { SvgIcon, SvgIconType } from '../../../SvgIcon/index.mjs';
+import { SvgIcon } from '../../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../../SvgIcon/svg-icon-type.mjs';
 import useDataBuilderField from '../../field-context.mjs';
 import { useDataBuilderFieldCanUseVarFromVariables } from '../../hooks.mjs';
 import { AddingFieldSelector } from './AddingFieldSelector.mjs';
 import '../../../DataBuilderUI/index.mjs';
+import useDataBuilder from '../../data-builder-context.mjs';
 import { FieldControlPanel } from '../../../DataBuilderUI/FieldControlPanel/index.mjs';
 
 function ControlPanel({
@@ -26,8 +28,9 @@ function ControlPanel({
 }) {
   const fieldIsVisible = isFieldVisible(field);
   const [showFieldSelector, setShowFieldSelector] = useState(false);
+  const { isReadOnly } = useDataBuilder();
   const fieldCanUseVarFromVariables = useDataBuilderFieldCanUseVarFromVariables();
-  const showAddFieldButtonGroup = isObjectAllowedAdditionalProperties(field) || additionalFields.length > 0;
+  const showAddFieldButtonGroup = (isObjectAllowedAdditionalProperties(field) || additionalFields.length > 0) && !isReadOnly;
   const showUseFromVariablesButtonGroup = fieldIsVisible && fieldCanUseVarFromVariables;
   if (showFieldSelector) {
     return /* @__PURE__ */ jsx(

package/dist/esm/components/DataBuilder/Nested/FieldControlPanel/ControlPanelForNonObjectRootField.mjs

@@ -2,13 +2,14 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsx, jsxs } from 'react/jsx-runtime';
 import useEventStopPropagation from '../../../../hooks/useEventStopPropagation.mjs';
-import { SvgIcon, SvgIconType } from '../../../SvgIcon/index.mjs';
+import { SvgIcon } from '../../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../../SvgIcon/svg-icon-type.mjs';
 import { DEFAULT_FIELD_KEY } from '../../data-field.mjs';
 import '../../../DataBuilderUI/index.mjs';
 import { FieldControlPanel } from '../../../DataBuilderUI/FieldControlPanel/index.mjs';

package/dist/esm/components/DataBuilder/Nested/FieldControlPanel/index.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 

package/dist/esm/components/DataBuilder/Nested/FieldListWrapper/FieldListWrapper.module.css.mjs

@@ -1,7 +1,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 

package/dist/esm/components/DataBuilder/Nested/FieldListWrapper/index.mjs

@@ -2,14 +2,15 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
 import classes from './FieldListWrapper.module.css.mjs';
-import { SvgIcon, SvgIconType } from '../../../SvgIcon/index.mjs';
+import { SvgIcon } from '../../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../../SvgIcon/svg-icon-type.mjs';
 
 function FieldListWrapper({
   children,

package/dist/esm/components/DataBuilder/Nested/NoSchema.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 

package/dist/esm/components/DataBuilder/Nested/ObjectFields.mjs

@@ -2,18 +2,19 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
 import { DEFAULT_FIELD_KEY, isRootField } from '../data-field.mjs';
 import DataBuilderFormField from '../Field.mjs';
 import { DataBuilderFieldControlPanel } from './FieldControlPanel/index.mjs';
 import { FieldListWrapper } from './FieldListWrapper/index.mjs';
 import useDataBuilder from '../data-builder-context.mjs';
 
+const MIN_FIELDS_VISIBLE_BY_DEFAULT = 7;
 function DataBuilderFormNestedObjectFields({
   field,
   onChange
@@ -22,6 +23,11 @@ function DataBuilderFormNestedObjectFields({
   const [fieldToShowKeys, setFieldToShowKeys] = useState(
     getInitialFieldsToShow(field)
   );
+  useEffect(() => {
+    if (field?.subFields) {
+      setFieldToShowKeys(getInitialFieldsToShow(field));
+    }
+  }, [field?.subFields?.length]);
   function handleNewValue(newValue) {
     if (Object.keys(newValue ?? {}).length > 0) {
       onChange(newValue);
@@ -105,11 +111,21 @@ function getInitialFieldsToShow(field) {
   const fieldsWithValueKeys = getKeysFromSubFields(
     subFields.filter((x) => x.value !== void 0)
   );
-  const amountFieldsToShow = requiredFieldKeys.length + fieldsWithValueKeys.length;
+  const minimalVisibleSetOfFields = getKeysFromSubFields(
+    subFields.filter((_, index) => index < MIN_FIELDS_VISIBLE_BY_DEFAULT)
+  );
+  const allUniqueFields = [
+    .../* @__PURE__ */ new Set([
+      ...requiredFieldKeys,
+      ...fieldsWithValueKeys,
+      ...minimalVisibleSetOfFields
+    ])
+  ];
+  const amountFieldsToShow = allUniqueFields.length;
   if (isRootField(field) && amountFieldsToShow === 0) {
     return getKeysFromSubFields(subFields);
   }
-  return [...requiredFieldKeys, ...fieldsWithValueKeys];
+  return allUniqueFields;
 }
 function FieldListCollapsible({
   field,

package/dist/esm/components/DataBuilder/Nested/ValueMapping.mjs

@@ -2,7 +2,7 @@
 /*
  * Integration App React package
  * {@link https://www.npmjs.com/package/@integration-app/react}
- * v2.0.3-beta.3
+ * v2.0.3
  */
 'use client';
 
@@ -11,7 +11,7 @@ import usePromise from '../../../_modules/react-use-promise.mjs';
 import { getFormula, DataBuilderFormulaType, buildDataSchema, getReferenceCollectionPathForSchema, makeDataLocationOperationPath } from '@integration-app/sdk';
 import DataBuilderFormFieldValue from '../FieldValue/index.mjs';
 import { NestedLevel, Row, Cell, Title } from '../../DataBuilderUI/index.mjs';
-import { SvgIconType } from '../../SvgIcon/index.mjs';
+import { SvgIconType } from '../../SvgIcon/svg-icon-type.mjs';
 import { FieldDelete } from '../FieldDelete.mjs';
 import { makeSubField } from '../data-field.mjs';
 import { DataBuilderFieldControlPanel } from './FieldControlPanel/index.mjs';
@@ -39,7 +39,7 @@ function ValueMapping({ field, onChange }) {
     [JSON.stringify(valueSchema)]
   );
   if (fieldRecordsError || valueRecordsError) {
-    return /* @__PURE__ */ jsx("p", { children: (fieldRecordsError || valueRecordsError).toString() });
+    return /* @__PURE__ */ jsx("p", { children: (fieldRecordsError || valueRecordsError || "Unknown error").toString() });
   }
   if (!fieldRecords || !valueRecords) {
     return /* @__PURE__ */ jsx("p", { children: "Loading..." });