@integration-app/react 2.0.3-beta.1 → 2.0.3-beta.2

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

@@ -0,0 +1,228 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var reactUsePromise = require('../../../_modules/react-use-promise.cjs');
+var sdk = require('@integration-app/sdk');
+var index$2 = require('../FieldValue/index.cjs');
+var index = require('../../DataBuilderUI/index.cjs');
+var index$1 = require('../../SvgIcon/index.cjs');
+var FieldDelete = require('../FieldDelete.cjs');
+var dataField = require('../data-field.cjs');
+var index$3 = require('./FieldControlPanel/index.cjs');
+var integrationAppClientContext = require('../../../contexts/integration-app-client-context.cjs');
+var integrationAppConnectionContext = require('../../../contexts/integration-app-connection-context.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] = reactUsePromise.default(
+    () => loadSchemaRecords(field.schema, client, connectionId),
+    [JSON.stringify(field.schema)]
+  );
+  const [valueRecords, valueRecordsError] = reactUsePromise.default(
+    () => loadSchemaRecords(valueSchema, client, connectionId),
+    [JSON.stringify(valueSchema)]
+  );
+  if (fieldRecordsError || valueRecordsError) {
+    return /* @__PURE__ */ jsxRuntime.jsx("p", { children: (fieldRecordsError || valueRecordsError).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(index.NestedLevel, { level: field.level + 1, children: /* @__PURE__ */ jsxRuntime.jsxs(index.Row, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(index.Cell.Name, { children: /* @__PURE__ */ jsxRuntime.jsx(index.Title, { children: valueRecord.name ?? valueRecord.id }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(index.Cell.Icon, { type: index$1.SvgIconType.ValueMapping }),
+      /* @__PURE__ */ jsxRuntime.jsx(index.Cell.Combobox, { grow: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+        index$2.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$3.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(index.NestedLevel, { level: field.level + 1, children: /* @__PURE__ */ jsxRuntime.jsxs(index.Row, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(index.Cell.Combobox, { grow: true, width: "49%", children: /* @__PURE__ */ jsxRuntime.jsx(
+      index$2.default,
+      {
+        field: fromField,
+        onChange: (value) => handleFromChange(value)
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx(index.Cell.Icon, { type: index$1.SvgIconType.ValueMapping }),
+    /* @__PURE__ */ jsxRuntime.jsx(index.Cell.Combobox, { grow: true, width: "49%", children: /* @__PURE__ */ jsxRuntime.jsx(
+      index$2.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/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var sdk = require('@integration-app/sdk');
+var fieldContext = require('./field-context.cjs');
+var ArrayItems = require('./Nested/ArrayItems.cjs');
+var ObjectFields = require('./Nested/ObjectFields.cjs');
+var NoSchema = require('./Nested/NoSchema.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/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'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;

package/dist/cjs/components/DataBuilder/data-field.cjs

@@ -0,0 +1,308 @@
+"use strict";
+/*
+ * Integration App React package
+ * {@link https://www.npmjs.com/package/@integration-app/react}
+ * v2.0.3-beta.2
+ */
+'use client';
+
+'use strict';
+
+var sdk = require('@integration-app/sdk');
+var jsConvertCase = require('js-convert-case');
+
+function getFieldSchemaOptions(field) {
+  if (field?.schema?.type) {
+    if (Array.isArray(field.schema.type)) {
+      return field.schema.type.map((type) => ({ type }));
+    } else {
+      return [field.schema];
+    }
+  } else if (Array.isArray(field?.schema?.anyOf)) {
+    const options = [];
+    for (const anyOfSchema of field?.schema?.anyOf ?? []) {
+      options.push(...getFieldSchemaOptions({ ...field, schema: anyOfSchema }));
+    }
+    return options;
+  } else {
+    return [
+      {
+        type: "string"
+      },
+      {
+        type: "number"
+      },
+      {
+        type: "boolean"
+      },
+      {
+        type: "object"
+      },
+      {
+        type: "array"
+      }
+    ];
+  }
+}
+const DEFAULT_FALLBACK_SCHEMA = { type: "string" };
+function getFieldSchemaFromValue(field) {
+  if (!field?.value) {
+    return void 0;
+  }
+  const options = getFieldSchemaOptions(field);
+  const schemaFromValue2 = sdk.getSchemaFromValue(field.value, field.variablesSchema);
+  const option = options.find((o) => o.type === schemaFromValue2?.type);
+  return option ?? options?.[0] ?? schemaFromValue2;
+}
+function getDefaultFieldSchemaOption(field) {
+  if (field?.value) {
+    return getFieldSchemaFromValue(field);
+  }
+  const options = getFieldSchemaOptions(field);
+  return options?.[0] ?? DEFAULT_FALLBACK_SCHEMA;
+}
+function schemaFromValue(value, variablesSchema) {
+  const schemaType = schemaTypeFromValue(value, variablesSchema);
+  return schemaType ? { type: schemaType } : {};
+}
+function schemaTypeFromValue(value, variablesSchema) {
+  if (sdk.isFormula(value)) {
+    const formula = sdk.getFormula(value);
+    if (formula.type === sdk.DataBuilderFormulaType.VAR) {
+      const schema = sdk.getSchemaByLocator(
+        variablesSchema,
+        formula.locator
+      );
+      return schema?.type ?? "string";
+    } else if (formula.type == sdk.DataBuilderFormulaType.PLAIN) {
+      return schemaTypeFromValue(formula.value);
+    } else {
+      return "string";
+    }
+  } else {
+    switch (typeof value) {
+      case "object":
+        if (Array.isArray(value)) {
+          return "array";
+        } else {
+          return "object";
+        }
+      case "boolean":
+        return "boolean";
+      case "bigint":
+      case "number":
+        return "number";
+      default:
+        return "string";
+    }
+  }
+}
+function extractFieldSubFields(field) {
+  let subfields = [];
+  const schema = getDefaultFieldSchemaOption(field);
+  if (!schema?.type) {
+    subfields = getSubfieldsFromValue(field);
+  } else if (schema?.type === "object") {
+    const subfieldsFromObjectSchema = getSubfieldsFromObjectSchema(field);
+    const subfieldsFromValue = getSubfieldsFromValue(field);
+    subfields = mergeSubfieldsFromObjectSchemaAndValues(
+      subfieldsFromObjectSchema,
+      subfieldsFromValue
+    );
+    subfields = subfields.length > 0 ? [
+      ...subfields.slice(0, -1),
+      { ...subfields.slice(-1)[0], isLastChild: true }
+    ] : subfields;
+  } else if (schema?.type === "array") {
+    if (Array.isArray(field.value)) {
+      subfields = getSubfieldsFromValue(field);
+    }
+  }
+  return subfields;
+}
+function mergeSubfieldsFromObjectSchemaAndValues(subfieldsFromObjectSchema, subfieldsFromValue) {
+  function getSubfieldKey(field) {
+    return field.key ?? "root";
+  }
+  if (subfieldsFromValue.length === 0) {
+    return subfieldsFromObjectSchema;
+  }
+  const subfieldMap = /* @__PURE__ */ new Map();
+  subfieldsFromObjectSchema.forEach((field) => {
+    subfieldMap.set(getSubfieldKey(field), field);
+  });
+  subfieldsFromValue.forEach((field) => {
+    const fieldKey = getSubfieldKey(field);
+    const primaryField = subfieldMap.get(fieldKey);
+    if (primaryField) {
+      subfieldMap.set(fieldKey, { ...primaryField, value: field.value });
+    } else {
+      subfieldMap.set(fieldKey, field);
+    }
+  });
+  return Object.values(Object.fromEntries(subfieldMap.entries()));
+}
+function makeSubField(field, overrides) {
+  const childFieldData = {
+    key: overrides?.key,
+    schema: overrides?.schema,
+    level: field.level + 1,
+    // default behavior
+    optionFactories: field.optionFactories,
+    variablesSchema: field.variablesSchema,
+    exampleVariables: field.exampleVariables,
+    iconUri: field.iconUri,
+    dynamicSchema: field.dynamicSchema,
+    dynamicSchemaVariables: field.dynamicSchemaVariables
+  };
+  if (overrides) {
+    Object.entries(overrides).forEach(([key, value]) => {
+      childFieldData[key] = value;
+    });
+  }
+  childFieldData.subFields = extractFieldSubFields(childFieldData);
+  return childFieldData;
+}
+function getSubfieldsFromObjectSchema(field) {
+  const fields = [];
+  const schema = getDefaultFieldSchemaOption(field);
+  if (schema?.properties) {
+    Object.entries(schema.properties).forEach(([key, value]) => {
+      const isRequired = schema.required && schema.required.includes(key);
+      fields.push(
+        makeSubField(field, {
+          key,
+          valueLocator: sdk.makeObjectPropertyLocator(field.valueLocator, key),
+          isRequired,
+          isDeletable: !isRequired,
+          isInSchema: !value?.isImplied,
+          hasSiblings: countObjectFieldProperties(field) > 1,
+          schema: value,
+          value: field.value ? field.value[key] : void 0,
+          level: getLevelForNestedFields(field)
+        })
+      );
+    });
+  }
+  return fields;
+}
+function fieldLabel(field) {
+  return field.schema?.title ?? jsConvertCase.toHeaderCase(field.key ?? "");
+}
+function getSubfieldsFromValue(field) {
+  const fields = [];
+  if (Array.isArray(field.value)) {
+    return field.value.map((item, idx) => {
+      const dynamicSchemaVariables = structuredClone(
+        field.dynamicSchemaVariables
+      );
+      const valueLocatorForDynamicSchema = field?.valueLocator?.replace(/\[\d+\]/g, "") ?? "";
+      sdk.setValueAtLocator(
+        dynamicSchemaVariables,
+        valueLocatorForDynamicSchema,
+        item
+      );
+      const currentEvaluatedSchema = sdk.buildData(
+        field.dynamicSchema,
+        sdk.buildData(dynamicSchemaVariables)
+      );
+      const valueLocator = `${field.valueLocator}[${idx}]`;
+      const schema = sdk.getSchemaByLocator(currentEvaluatedSchema, valueLocator);
+      return makeSubField(field, {
+        key: `item_${idx + 1}`,
+        valueLocator,
+        isInSchema: !schema?.isImplied,
+        hasSiblings: field.value.length > 0,
+        isLastChild: idx === field.value.length,
+        schema,
+        value: item,
+        isDeletable: true,
+        dynamicSchemaVariables
+      });
+    });
+  } else if (typeof field.value == "object" && field.value !== null && !sdk.isFormula(field.value)) {
+    Object.entries(field.value).forEach(([key, value]) => {
+      if (value === void 0) {
+        return;
+      }
+      if (!field.schema || !field.schema.properties || !(key in field.schema.properties)) {
+        fields.push(
+          /* FIXME: strictNullCheck temporary fix */
+          // @ts-expect-error TS(2345): Argument of type 'IDataBuilderField' is not assign... Remove this comment to see the full error message
+          makeSubField(field, {
+            key,
+            valueLocator: `${field.valueLocator}.${key}`,
+            isRequired: false,
+            hasSiblings: countObjectFieldProperties(field) > 1,
+            isInSchema: false,
+            isDeletable: true,
+            schema: void 0,
+            value,
+            level: getLevelForNestedFields(field)
+          })
+        );
+      }
+    });
+  }
+  return fields;
+}
+function isFieldVisible(field) {
+  if (field.schema?.type === "object" || field.schema?.type === "array") {
+    if ((field.isInSchema || field.level === 1) && !field.schema?.title && !field.hasSiblings && !field.key) {
+      return false;
+    }
+  }
+  return true;
+}
+function countObjectFieldProperties(field) {
+  const fieldKeys = [];
+  if (typeof field.value === "object" && field.value !== null) {
+    fieldKeys.push(...Object.keys(field.value));
+  }
+  if (field.schema && field.schema.properties) {
+    fieldKeys.push(...Object.keys(field.schema.properties ?? {}));
+  }
+  return new Set(fieldKeys).size;
+}
+function getLevelForNestedFields(field) {
+  return isFieldVisible(field) ? field.level + 1 : field.level;
+}
+function isObjectAllowedAdditionalProperties(field) {
+  if (field.schema?.type !== "object") {
+    return true;
+  }
+  if (Object.keys(field.schema.properties ?? {}).length === 0) {
+    return true;
+  }
+  return !!field.schema?.additionalProperties;
+}
+function getFieldValueProps(field) {
+  const isEmpty = field.value === null || field.value === void 0;
+  const isRequired = field.isRequired;
+  return {
+    isEmpty,
+    isRequired
+  };
+}
+function schemaIsScalarArray(schema) {
+  return schema?.type === "array" && schema.items && sdk.schemaIsScalar(schema.items);
+}
+function isRootField(field) {
+  return field.level === 1 && !isFieldVisible(field);
+}
+const DEFAULT_FIELD_KEY = "";
+
+exports.DEFAULT_FIELD_KEY = DEFAULT_FIELD_KEY;
+exports.extractFieldSubFields = extractFieldSubFields;
+exports.fieldLabel = fieldLabel;
+exports.getDefaultFieldSchemaOption = getDefaultFieldSchemaOption;
+exports.getFieldSchemaFromValue = getFieldSchemaFromValue;
+exports.getFieldSchemaOptions = getFieldSchemaOptions;
+exports.getFieldValueProps = getFieldValueProps;
+exports.getLevelForNestedFields = getLevelForNestedFields;
+exports.isFieldVisible = isFieldVisible;
+exports.isObjectAllowedAdditionalProperties = isObjectAllowedAdditionalProperties;
+exports.isRootField = isRootField;
+exports.makeSubField = makeSubField;
+exports.schemaFromValue = schemaFromValue;
+exports.schemaIsScalarArray = schemaIsScalarArray;