@membranehq/react 0.1.0

package/dist/cjs/components/DataBuilder/Nested/FieldListWrapper/FieldListWrapper.module.css.cjs

@@ -0,0 +1,18 @@
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@membranehq/react}
+ * v0.1.0
+ */
+'use client';
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styleInject = require('style-inject');
+
+var css_248z = ".FieldListWrapper-module_container__gog9U {\n\n  padding-bottom: 0.25rem;\n\n  padding-top: 0.75rem;\n\n  cursor: pointer\n}\n.FieldListWrapper-module_container__collapsed__9x5Po {\n\n  margin-top: -2.5rem;\n\n  padding-top: 2.5rem;\n\n  position: relative;\n\n  z-index: 10;\n\n  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));\n\n  --tw-gradient-from: transparent var(--tw-gradient-from-position);\n\n  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);\n\n  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);\n\n  --tw-gradient-to: #fff var(--tw-gradient-to-position);\n\n  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, transparent) 40%\n}\n.FieldListWrapper-module_button__fkFJa {\n\n  padding-left: 0px;\n\n  padding-right: 0px;\n\n  padding-top: 0.125rem;\n\n  padding-bottom: 0.125rem;\n\n  border-bottom-width: 1px;\n\n  border-color: transparent;\n\n  display: flex;\n\n  flex-direction: row;\n\n  align-items: center;\n\n  gap: 0.25rem;\n\n  --tw-text-opacity: 1;\n\n  color: rgb(13 121 194 / var(--tw-text-opacity, 1))\n}\n.FieldListWrapper-module_button__fkFJa svg {\n\n  height: 1rem;\n\n  width: 1rem\n}\n.FieldListWrapper-module_button__fkFJa:hover,\n.FieldListWrapper-module_container__gog9U:hover button {\n\n  border-style: dashed;\n\n  --tw-border-opacity: 1;\n\n  border-color: rgb(13 121 194 / var(--tw-border-opacity, 1))\n}\n";
+var classes = {"container":"FieldListWrapper-module_container__gog9U","container__collapsed":"FieldListWrapper-module_container__collapsed__9x5Po","button":"FieldListWrapper-module_button__fkFJa"};
+styleInject(css_248z);
+
+exports.default = classes;

package/dist/cjs/components/DataBuilder/Nested/FieldListWrapper/index.cjs

@@ -0,0 +1,33 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@membranehq/react}
+ * v0.1.0
+ */
+'use client';
+
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var clsx = require('clsx');
+var svgIconType = require('../../../SvgIcon/svg-icon-type.cjs');
+var FieldListWrapper_module = require('./FieldListWrapper.module.css.cjs');
+var index = require('../../../SvgIcon/index.cjs');
+
+function FieldListWrapper({
+  children,
+  onClick,
+  fieldsToShow,
+  collapsed
+}) {
+  const buttonTitle = collapsed ? `Show ${fieldsToShow} more fields` : "Collapse fields";
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    children,
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: clsx.clsx(FieldListWrapper_module.default.container, collapsed && FieldListWrapper_module.default.container__collapsed), onClick, children: /* @__PURE__ */ jsxRuntime.jsxs("button", { className: FieldListWrapper_module.default.button, children: [
+      buttonTitle,
+      /* @__PURE__ */ jsxRuntime.jsx(index.SvgIcon, { type: collapsed ? svgIconType.SvgIconType.ChevronDown : svgIconType.SvgIconType.ChevronUp })
+    ] }) })
+  ] });
+}
+
+exports.FieldListWrapper = FieldListWrapper;

package/dist/cjs/components/DataBuilder/Nested/LevelKeysConflictProvider.cjs

@@ -0,0 +1,18 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@membranehq/react}
+ * v0.1.0
+ */
+'use client';
+
+'use strict';
+
+var React = require('react');
+
+const LevelKeysConflictContext = React.createContext(/* @__PURE__ */ new Set());
+const LevelKeysConflictProvider = LevelKeysConflictContext.Provider;
+const useLevelKeysConflicts = () => React.useContext(LevelKeysConflictContext);
+
+exports.LevelKeysConflictProvider = LevelKeysConflictProvider;
+exports.useLevelKeysConflicts = useLevelKeysConflicts;

package/dist/cjs/components/DataBuilder/Nested/NoSchema.cjs

@@ -0,0 +1,31 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@membranehq/react}
+ * v0.1.0
+ */
+'use client';
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var sdk = require('@membranehq/sdk');
+var ArrayItems = require('./ArrayItems.cjs');
+var ObjectFields = require('./ObjectFields.cjs');
+
+function DataBuilderFormNestedNoSchema({
+  field,
+  onChange
+}) {
+  if (Array.isArray(field.value)) {
+    return /* @__PURE__ */ jsxRuntime.jsx(ArrayItems.default, { field, onChange });
+  } else if (typeof field.value === "object" && field.value !== null && !sdk.isFormula(field.value)) {
+    return /* @__PURE__ */ jsxRuntime.jsx(ObjectFields.default, { field, onChange });
+  } else {
+    return null;
+  }
+}
+
+exports.default = DataBuilderFormNestedNoSchema;

package/dist/cjs/components/DataBuilder/Nested/ObjectFields.cjs

@@ -0,0 +1,206 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@membranehq/react}
+ * v0.1.0
+ */
+'use client';
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var dataField = require('../data-field.cjs');
+var DataBuilderFormField = require('../DataBuilderFormField.cjs');
+var index = require('./FieldControlPanel/index.cjs');
+var index$1 = require('./FieldListWrapper/index.cjs');
+var dataBuilderContext = require('../data-builder-context.cjs');
+var LevelKeysConflictProvider = require('./LevelKeysConflictProvider.cjs');
+
+const MIN_FIELDS_VISIBLE_BY_DEFAULT = 7;
+function DataBuilderFormNestedObjectFields({
+  field,
+  onChange
+}) {
+  const { showNullValueFields, hideReadOnlyFields } = dataBuilderContext.default();
+  const [conflictedKeys, setConflictedKeys] = React.useState(/* @__PURE__ */ new Set());
+  const [fieldToShowKeys, setFieldToShowKeys] = React.useState(getInitialFieldsToShow(field));
+  React.useEffect(() => {
+    if (field?.subFields) {
+      setFieldToShowKeys(getInitialFieldsToShow(field));
+    }
+  }, [field?.subFields?.length]);
+  function handleNewValue(newValue) {
+    if (Object.keys(newValue ?? {}).length > 0) {
+      onChange(newValue);
+    } else {
+      onChange(void 0);
+    }
+  }
+  function handleKeyConflict(oldKey = "", newKey = "") {
+    if (newKey in field.value && oldKey !== newKey) {
+      const conflictedSet2 = new Set(conflictedKeys);
+      conflictedSet2.add(oldKey);
+      setConflictedKeys(conflictedSet2);
+      return true;
+    }
+    const conflictedSet = new Set(conflictedKeys);
+    conflictedSet.delete(oldKey);
+    setConflictedKeys(conflictedSet);
+    return false;
+  }
+  function positionSafeKeyChange(oldKey = "", newKey = "") {
+    const newProperties = {};
+    for (const [key, value] of Object.entries(field.value)) {
+      if (key === oldKey) {
+        newProperties[newKey] = value;
+      } else {
+        newProperties[key] = value;
+      }
+    }
+    handleNewValue(newProperties);
+  }
+  function handlePropertyKeyChange(oldKey, newKey) {
+    if (handleKeyConflict(oldKey, newKey)) return;
+    positionSafeKeyChange(oldKey, newKey);
+    if (!newKey) return;
+    setFieldToShowKeys(fieldToShowKeys.map((key) => key === oldKey ? newKey : key));
+  }
+  function handlePropertyValueChange(key, value) {
+    const newProperties = { ...field.value };
+    newProperties[key] = value;
+    handleNewValue(newProperties);
+  }
+  function handleAddProperty(fieldKey = dataField.DEFAULT_FIELD_KEY) {
+    handleNewValue({
+      ...field.value || {},
+      [fieldKey]: null
+    });
+    setFieldToShowKeys([...fieldToShowKeys, fieldKey]);
+  }
+  function handleDeleteProperty(propertyField) {
+    const newValue = { ...field.value || {} };
+    delete newValue[propertyField.key];
+    handleNewValue(newValue);
+    setFieldToShowKeys(fieldToShowKeys.filter((x) => x !== propertyField.key));
+  }
+  function isFieldHidden(field2) {
+    return hideReadOnlyFields && field2?.schema?.readOnly;
+  }
+  function isFieldDisplayedByDefault(field2) {
+    const isFieldRequired = field2?.isRequired;
+    const isFieldFilled = !!field2?.value || showNullValueFields && field2?.value === null;
+    const isFieldToShow = field2?.key !== void 0 ? fieldToShowKeys.includes(field2.key) : false;
+    return isFieldRequired || isFieldFilled || isFieldToShow;
+  }
+  function sortFieldByFieldToShowKey(fieldA, fieldB) {
+    const fieldAIndex = fieldToShowKeys.indexOf(fieldA.key);
+    const fieldBIndex = fieldToShowKeys.indexOf(fieldB.key);
+    if (fieldAIndex !== -1 && fieldBIndex !== -1) {
+      if (fieldAIndex === -1 || fieldAIndex < fieldBIndex) return -1;
+      if (fieldBIndex === -1 || fieldAIndex > fieldBIndex) return 1;
+    }
+    return 0;
+  }
+  const baseFields = (field?.subFields ?? []).filter((f) => !isFieldHidden(f)).filter(isFieldDisplayedByDefault).sort(sortFieldByFieldToShowKey);
+  const additionalFields = (field?.subFields ?? []).filter((f) => !isFieldHidden(f)).filter((x) => !isFieldDisplayedByDefault(x));
+  return /* @__PURE__ */ jsxRuntime.jsx(LevelKeysConflictProvider.LevelKeysConflictProvider, { value: conflictedKeys, children: /* @__PURE__ */ jsxRuntime.jsx(
+    FieldListCollapsible,
+    {
+      field,
+      baseFields,
+      additionalFields,
+      onChange: handlePropertyValueChange,
+      onKeyChange: handlePropertyKeyChange,
+      onDelete: handleDeleteProperty,
+      onAdd: handleAddProperty
+    }
+  ) });
+}
+function getInitialFieldsToShow(field) {
+  const subFields = field?.subFields ?? [];
+  const getKeysFromSubFields = (subFields2) => {
+    return subFields2.map((x) => x.key).filter((x) => x !== void 0);
+  };
+  const requiredFieldKeys = getKeysFromSubFields(subFields.filter((x) => x.isRequired));
+  const fieldsWithValueKeys = getKeysFromSubFields(subFields.filter((x) => x.value !== void 0));
+  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 (dataField.isRootField(field) && amountFieldsToShow === 0) {
+    return getKeysFromSubFields(subFields);
+  }
+  return allUniqueFields;
+}
+function FieldListCollapsible({
+  field,
+  baseFields,
+  additionalFields,
+  onChange,
+  onKeyChange,
+  onDelete,
+  onAdd
+}) {
+  const { collapsedDataBuilder, initialVisibleFieldCount } = dataBuilderContext.default();
+  const isRoot = field.level === 1;
+  const showCollapseWrapper = isRoot && collapsedDataBuilder && baseFields.length > initialVisibleFieldCount;
+  const [collapsed, setCollapsed] = React.useState(isRoot);
+  function toggleCollapsed() {
+    setCollapsed(!collapsed);
+  }
+  if (!isRoot || !showCollapseWrapper) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        BaseFieldsList,
+        {
+          baseFields,
+          onChange,
+          onKeyChange,
+          onAdd,
+          onDelete
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(index.DataBuilderFieldControlPanel, { field, onAdd, additionalFields })
+    ] });
+  }
+  const renderedFields = collapsed ? baseFields.slice(0, initialVisibleFieldCount) : baseFields;
+  const fieldsToShow = baseFields.length - initialVisibleFieldCount;
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs(index$1.FieldListWrapper, { collapsed, onClick: toggleCollapsed, fieldsToShow, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      BaseFieldsList,
+      {
+        baseFields: renderedFields,
+        onChange,
+        onKeyChange,
+        onAdd,
+        onDelete
+      }
+    ),
+    !collapsed && /* @__PURE__ */ jsxRuntime.jsx(index.DataBuilderFieldControlPanel, { field, onAdd, additionalFields })
+  ] }) });
+}
+function BaseFieldsList({
+  baseFields,
+  onChange,
+  onKeyChange,
+  onDelete,
+  onAdd
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: baseFields.map((field, idx) => /* @__PURE__ */ jsxRuntime.jsx(
+    DataBuilderFormField.DataBuilderFormField,
+    {
+      field,
+      onChange: (value) => onChange(field.key, value),
+      onKeyChange: (newKey) => onKeyChange(field.key, newKey),
+      onDelete: () => onDelete(field),
+      onEnter: onAdd
+    },
+    idx
+  )) });
+}
+
+exports.default = DataBuilderFormNestedObjectFields;

package/dist/cjs/components/DataBuilder/Nested/ValueMapping.cjs

@@ -0,0 +1,198 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@membranehq/react}
+ * v0.1.0
+ */
+'use client';
+
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var sdk = require('@membranehq/sdk');
+var svgIconType = require('../../SvgIcon/svg-icon-type.cjs');
+var integrationAppClientContext = require('../../../contexts/integration-app-client-context.cjs');
+var integrationAppConnectionContext = require('../../../contexts/integration-app-connection-context.cjs');
+var usePromise = require('../../../hooks/usePromise.cjs');
+require('../../DataBuilderUI/FieldControlPanel/index.cjs');
+require('../../DataBuilderUI/ActionBar.cjs');
+var Cell = require('../../DataBuilderUI/Cell.cjs');
+var NestedLevel = require('../../DataBuilderUI/NestedLevel.cjs');
+var Row = require('../../DataBuilderUI/Row.cjs');
+var Title = require('../../DataBuilderUI/Title.cjs');
+var dataField = require('../data-field.cjs');
+var FieldDelete = require('../FieldDelete.cjs');
+var index = require('../FieldValue/index.cjs');
+var index$1 = require('./FieldControlPanel/index.cjs');
+
+const MAX_EXPANDED_VALUES = 20;
+function ValueMapping({ field, onChange }) {
+  const { client } = integrationAppClientContext.useIntegrationAppClient();
+  const { connectionId } = integrationAppConnectionContext.useIntegrationAppConnection();
+  const formula = sdk.getFormula(field.value);
+  if (formula?.type !== sdk.DataBuilderFormulaType.MAP) {
+    return null;
+  }
+  const valueSchema = sdk.buildDataSchema(formula?.args?.value, field.variablesSchema);
+  const [fieldRecords, fieldRecordsError] = usePromise.usePromise(
+    () => loadSchemaRecords(field.schema, client, connectionId),
+    [JSON.stringify(field.schema)]
+  );
+  const [valueRecords, valueRecordsError] = usePromise.usePromise(
+    () => loadSchemaRecords(valueSchema, client, connectionId),
+    [JSON.stringify(valueSchema)]
+  );
+  if (fieldRecordsError || valueRecordsError) {
+    return /* @__PURE__ */ jsxRuntime.jsx("p", { children: (fieldRecordsError || valueRecordsError || "Unknown error").toString() });
+  }
+  if (!fieldRecords || !valueRecords) {
+    return /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Loading..." });
+  }
+  let autoExpandedValues = valueRecords;
+  if (autoExpandedValues.length === 0 || autoExpandedValues.length > MAX_EXPANDED_VALUES) {
+    autoExpandedValues = null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: autoExpandedValues ? /* @__PURE__ */ jsxRuntime.jsx(
+    AutoExpandedMapping,
+    {
+      valueRecords: autoExpandedValues,
+      fieldRecords,
+      field,
+      onChange
+    }
+  ) : /* @__PURE__ */ jsxRuntime.jsx(CustomMapping, { field, valueSchema, onChange }) });
+}
+function AutoExpandedMapping({ valueRecords, field, fieldRecords, onChange }) {
+  const mapping = field.value?.$map?.mapping ?? [];
+  function handleMappingChange(fromRecord, toValue) {
+    const newMapping = JSON.parse(JSON.stringify(mapping));
+    let idx = newMapping.findIndex((m) => m.from === fromRecord.id);
+    if (idx === -1) {
+      idx = newMapping.length;
+    }
+    newMapping[idx] = {
+      from: fromRecord.id,
+      to: toValue
+    };
+    onChange(newMapping);
+  }
+  const fieldOptionsSchema = {
+    type: field.schema?.type
+  };
+  if (fieldRecords?.length) {
+    fieldOptionsSchema.referenceRecords = fieldRecords;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: valueRecords.map((valueRecord, idx) => {
+    const subField = dataField.makeSubField(field, {
+      schema: fieldOptionsSchema,
+      value: mapping.find((m) => m.from === valueRecord.id)?.to,
+      optionFactories: [],
+      variablesSchema: []
+    });
+    return /* @__PURE__ */ jsxRuntime.jsx(NestedLevel.NestedLevel, { level: field.level + 1, children: /* @__PURE__ */ jsxRuntime.jsxs(Row.Row, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Cell.Cell, { type: "name", span: "grow", children: /* @__PURE__ */ jsxRuntime.jsx(Title.Title, { childrenWrap: true, children: valueRecord.name ?? valueRecord.id }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(Cell.Cell, { type: "icon", icon: svgIconType.SvgIconType.ValueMapping }),
+      /* @__PURE__ */ jsxRuntime.jsx(Cell.Cell, { type: "combobox", span: "grow", children: /* @__PURE__ */ jsxRuntime.jsx(index.default, { field: subField, onChange: (value) => handleMappingChange(valueRecord, value) }) })
+    ] }) }, idx);
+  }) });
+}
+function CustomMapping({ field, valueSchema, onChange }) {
+  const mapping = field.value?.$map?.mapping ?? [];
+  function handleMappingItemChange(idx, value) {
+    const newMapping = JSON.parse(JSON.stringify(mapping));
+    newMapping[idx] = value;
+    onChange(newMapping);
+  }
+  function handleAddMapping() {
+    const newMapping = JSON.parse(JSON.stringify(mapping));
+    newMapping.push({});
+    onChange(newMapping);
+  }
+  function handleRemoveMapping(idx) {
+    const newMapping = JSON.parse(JSON.stringify(mapping));
+    newMapping.splice(idx, 1);
+    onChange(newMapping);
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    mapping.map((mappingItem, idx) => /* @__PURE__ */ jsxRuntime.jsx(
+      MappingListItem,
+      {
+        field,
+        item: mappingItem,
+        idx,
+        valueSchema,
+        onChange: (value) => handleMappingItemChange(idx, value),
+        onDelete: () => handleRemoveMapping(idx)
+      },
+      idx
+    )),
+    /* @__PURE__ */ jsxRuntime.jsx(index$1.DataBuilderFieldControlPanel, { field, addFieldLabel: "Add Mapping", onAdd: handleAddMapping })
+  ] });
+}
+function MappingListItem({
+  field,
+  item,
+  idx,
+  valueSchema,
+  onChange,
+  onDelete
+}) {
+  const fromField = dataField.makeSubField(field, {
+    valueLocator: `${field.valueLocator}.$map.mapping[${idx}].from`,
+    schema: valueSchema,
+    value: item?.from,
+    optionFactories: [],
+    variablesSchema: null
+  });
+  const toField = dataField.makeSubField(field, {
+    valueLocator: `${field.valueLocator}.$map.mapping[${idx}].to`,
+    schema: field.schema,
+    value: item?.to,
+    optionFactories: [],
+    variablesSchema: null
+  });
+  function handleFromChange(value) {
+    onChange({
+      ...item ?? {},
+      from: value
+    });
+  }
+  function handleToChange(value) {
+    onChange({
+      ...item ?? {},
+      to: value
+    });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(NestedLevel.NestedLevel, { level: field.level + 1, children: /* @__PURE__ */ jsxRuntime.jsxs(Row.Row, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Cell.Cell, { type: "combobox", span: "grow", children: /* @__PURE__ */ jsxRuntime.jsx(index.default, { field: fromField, onChange: (value) => handleFromChange(value) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(Cell.Cell, { type: "icon", icon: svgIconType.SvgIconType.ValueMapping }),
+    /* @__PURE__ */ jsxRuntime.jsx(Cell.Cell, { type: "combobox", span: "grow", children: /* @__PURE__ */ jsxRuntime.jsx(index.default, { field: toField, onChange: (value) => handleToChange(value) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(FieldDelete.FieldDelete, { onClick: onDelete })
+  ] }) });
+}
+async function loadSchemaRecords(schema, client, connectionId) {
+  if (!schema) {
+    return [];
+  }
+  if (schema.enum) {
+    return schema.enum.map((value) => ({
+      id: value
+    }));
+  } else if (schema.referenceRecords) {
+    return schema.referenceRecords;
+  } else if (sdk.getReferenceCollectionPathForSchema(schema) && client && connectionId) {
+    const listResponse = await client.connection(connectionId).request(
+      sdk.makeDataLocationOperationPath(
+        /* FIXME: strictNullCheck temporary fix */
+        // @ts-expect-error TS(2345): Argument of type 'string | undefined' is not... Remove this comment to see the full error message
+        sdk.getReferenceCollectionPathForSchema(schema),
+        "list"
+      )
+    );
+    return listResponse.records;
+  } else {
+    return [];
+  }
+}
+
+exports.ValueMapping = ValueMapping;

package/dist/cjs/components/DataBuilder/Nested.cjs

@@ -0,0 +1,32 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@membranehq/react}
+ * v0.1.0
+ */
+'use client';
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var sdk = require('@membranehq/sdk');
+var fieldContext = require('./field-context.cjs');
+var ArrayItems = require('./Nested/ArrayItems.cjs');
+var NoSchema = require('./Nested/NoSchema.cjs');
+var ObjectFields = require('./Nested/ObjectFields.cjs');
+
+function DataBuilderFormNested({
+  field,
+  onChange
+}) {
+  const { localSchema } = fieldContext.default();
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    !localSchema?.type && /* @__PURE__ */ jsxRuntime.jsx(NoSchema.default, { field, onChange }),
+    localSchema?.type == "object" && !sdk.isFormula(field.value) && /* @__PURE__ */ jsxRuntime.jsx(ObjectFields.default, { field, onChange }),
+    localSchema?.type == "array" && /* @__PURE__ */ jsxRuntime.jsx(ArrayItems.default, { field, onChange })
+  ] });
+}
+
+exports.default = DataBuilderFormNested;

package/dist/cjs/components/DataBuilder/data-builder-context.cjs

@@ -0,0 +1,69 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@membranehq/react}
+ * v0.1.0
+ */
+'use client';
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+
+const FIELDS_TO_SHOW = 5;
+function useDataBuilder() {
+  return React.useContext(DataBuilderContext);
+}
+const DataBuilderContext = React.createContext({
+  drilldownStack: [],
+  isAdminMode: false,
+  isReadOnly: false,
+  showNullValueFields: false,
+  hideReadOnlyFields: false,
+  frozenFieldsLocators: [],
+  errorFieldsLocators: [],
+  editableVariablesSchemaLocators: [],
+  collapsedDataBuilder: false,
+  initialVisibleFieldCount: FIELDS_TO_SHOW
+});
+DataBuilderContext.displayName = "DataBuilderContext";
+const DataBuilderProvider = ({
+  topLevelField,
+  isAdminMode = false,
+  children,
+  errorFieldsLocators = [],
+  frozenFieldsLocators = [],
+  editableVariablesSchemaLocators = [],
+  onAddVariable,
+  readOnly = false,
+  showNullValueFields = false,
+  hideReadOnlyFields = false,
+  collapsedDataBuilder = false,
+  initialVisibleFieldCount = FIELDS_TO_SHOW
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    DataBuilderContext.Provider,
+    {
+      value: {
+        topLevelField,
+        isAdminMode,
+        isReadOnly: readOnly,
+        errorFieldsLocators,
+        frozenFieldsLocators,
+        showNullValueFields,
+        hideReadOnlyFields: !!hideReadOnlyFields,
+        editableVariablesSchemaLocators,
+        onAddVariable,
+        initialVisibleFieldCount,
+        collapsedDataBuilder
+      },
+      children
+    }
+  );
+};
+
+exports.DataBuilderProvider = DataBuilderProvider;
+exports.default = useDataBuilder;