@integry/sdk 4.7.23 → 4.7.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@integry/sdk",
-  "version": "4.7.23",
+  "version": "4.7.25",
   "description": "Integry SDK",
   "main": "dist/umd/index.umd.js",
   "module": "dist/esm/index.csm.js",

package/src/components/MultipurposeField/index.tsx

@@ -212,7 +212,7 @@ const MultipurposeField = (props: MultipurposeFieldProps) => {
   useEffect(() => {
     const textfield = inputRef.current;
     const scalarValue = Array.isArray(value) ? value[0] : value;
-    if (textfield && activityOutputDataRaw.length) {
+    if (textfield && (activityOutputDataRaw.length || tagsTree !== null)) {
       const el: any = document.getElementById(`tagify_${fieldId}`);
       if (el && el.dataset.tagifyFieldId !== fieldId) {
         el.value = getDefaultTagifyValue(value || '');

package/src/components/form/ObjectField/index.ts

@@ -28,6 +28,8 @@ interface ObjectFieldProps {
   activityOutputDataRaw: any;
   objectValue?: any;
   isDisabled?: boolean;
+  tagsTree?: any; // Optional prop for tags tree
+  showMenuOnLeft?: boolean; // Optional prop to show menu on the left
 }
 
 type Option = {
@@ -110,6 +112,8 @@ const ObjectField = (props: ObjectFieldProps) => {
     activityOutputDataRaw,
     objectValue,
     isDisabled = false,
+    tagsTree = null,
+    showMenuOnLeft = false, // Default to false
   } = props;
   const [objectArray, setObjectArray] = useState<FieldObject[]>(
     Array.isArray(objectValue) ? objectValue : [{}],
@@ -392,15 +396,19 @@ const ObjectField = (props: ObjectFieldProps) => {
                 isEditable=${true}
                 fieldId=${`${field.id}_${fieldName}`}
                 type=${fieldType}
-                isMappable=${activityOutputDataRaw &&
-                Object.entries(activityOutputDataRaw).length > 0}
-                allowTagsInText=${activityOutputDataRaw}
+                isMappable=${tagsTree
+                  ? true
+                  : activityOutputDataRaw &&
+                    Object.entries(activityOutputDataRaw).length > 0}
+                allowTagsInText=${activityOutputDataRaw || tagsTree}
                 value=${objectHasFields
                   ? (objectArray[objectIndex] || {})[
                       fieldDetails?.meta?.machine_name || ''
                     ] || ''
                   : formatValueForTextarea(objectValue)}
                 isDisabled=${isDisabled}
+                tagsTree=${tagsTree}
+                showMenuOnLeft=${showMenuOnLeft}
               ><//>
             `}
             ${fieldType === 'DYNAMIC_DROPDOWN' &&

package/src/features/common/ActionForm/index.ts

@@ -1851,6 +1851,14 @@ class ActionForm extends Component<ActionFormPropsType, ActionFormStateType> {
                                       el.default_value ||
                                       ''
                                     }
+                                    tagsTree=${
+                                      this.props.showMappingMenu
+                                        ? this.props.tagsTree
+                                        : null
+                                    }
+                                    showMenuOnLeft=${
+                                      this.props.showMenuOnLeft || false
+                                    }
                                     />
                                     </${ConfigureFieldWrapper}>
                                   </div>

package/src/index.ts

@@ -10,6 +10,7 @@ import {
   PreviewPayload,
   MarketplaceConfig,
   MultipurposeFieldType,
+  FunctionFieldType,
   ConnectedAccount,
   MarketplaceApp,
 } from '@/interfaces';
@@ -55,6 +56,7 @@ import {
   arrayToNestedJSONWithFirstValue,
 } from '@/utils/ActivityOutputUtils';
 import { ListBox } from '@/components/MultipurposeField/Dropdown';
+import { FunctionField } from '@/components/form';
 import { MultipurposeField } from './components/MultipurposeField';
 import SDKDebugContainer from './features/containers/SDKDebugContainer';
 
@@ -2005,6 +2007,55 @@ export class IntegryJS {
     }
   };
 
+  public renderFunctionField = (
+    containerId: string,
+    functionFieldProps: FunctionFieldType,
+  ) => {
+    const target = document.getElementById(containerId);
+
+    if (target) {
+      const store = createSDKStore();
+      render(
+        html`<div>
+          <${AppContext.Provider}
+            value=${{
+              apiHandler: this.apiHandler,
+              eventEmitter: this.eventEmitter,
+              isPreviewMode: false,
+            }}
+          >
+            <${Provider} store=${store} key=${this.getRandomFlowId(10)}>
+              <${FunctionField}
+                field=${functionFieldProps.field}
+                name="${functionFieldProps.field.activity_field?.machine_name ||
+                'function_field'}"
+                description=${functionFieldProps.field.description || ''}
+                label="${functionFieldProps.field.title}"
+                value=${functionFieldProps.field.default_value || []}
+                apiHandler=${this.apiHandler}
+                isArray=${!!(functionFieldProps.field.data_type === 'OBJECT[]')}
+                onChange=${(val: string) => {
+                  if (functionFieldProps.onChange) {
+                    functionFieldProps.onChange(val);
+                  }
+                }}
+                tagsTree=${functionFieldProps.tagsTree
+                  ? functionFieldProps.tagsTree
+                  : null}
+                isReadOnly=${functionFieldProps.isReadOnly}
+              />
+            <//>
+          <//>
+        </div>`,
+        target,
+      );
+    } else {
+      console.warn(
+        `Integry SDK render target with id ${containerId} was not found`,
+      );
+    }
+  };
+
   public renderFlowStep = (
     options: RenderFlowStepOptions = {
       containerId: 'integry-marketplace',

package/src/interfaces/index.ts

@@ -929,3 +929,10 @@ export interface MultipurposeFieldType {
   fieldId?: string;
   enableTagify?: boolean;
 }
+
+export interface FunctionFieldType {
+  onChange?: (val: any) => void;
+  isReadOnly?: boolean;
+  field: TemplateField;
+  tagsTree?: any;
+}