@integry/sdk 4.6.41 → 4.6.43

package/package.json

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

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

@@ -22,10 +22,11 @@ type FunctionFieldProps = {
   field: Record<string, any>;
   apiHandler?: any;
   isArray?: boolean; // New prop for array support
+  tagsTree?: any;
 };
 
 const FunctionField = (props: FunctionFieldProps) => {
-  const { value, label, description, field, isArray = false } = props;
+  const { value, label, description, field, isArray = false, tagsTree } = props;
   const [isOpen, setIsOpen] = useState(false);
   const [editingIndex, setEditingIndex] = useState<number | null>(null);
   const [selectedFunction, setSelectedFunction] = useState<string>('');
@@ -100,9 +101,7 @@ const FunctionField = (props: FunctionFieldProps) => {
     const response: any[] = [];
 
     Object.entries(properties).forEach(([key, property]) => {
-      if (property.meta?.ui?.is_visible) {
-        response.push({ key, ...property });
-      }
+      response.push({ key, ...property });
     });
 
     return response;
@@ -674,6 +673,9 @@ const FunctionField = (props: FunctionFieldProps) => {
                                 functionArguments=${userFilledData}
                                 connectedAccountId=${connectedAccountId}
                                 customSaveCallback=${handleCustomaSave}
+                                variables=${tagsTree}
+                                showMappingMenu=${true}
+                                forceShowAllFields=${true}
                               />
                             </div>
                           `

package/src/components/form/FunctionField/styles.module.scss

@@ -13,15 +13,16 @@
 .functionFieldAddBtn {
   padding: 5px 10px;
   background-color: white;
-  border: 1px solid #d1d5db;
-  border-radius: 0.375rem;
-  font-size: 0.875rem;
+  border: 1px solid #4250f0;
+  border-radius: 4px;
+  font-size: 0.675rem;
   font-weight: 500;
-  color: #374151;
+  color: #4250f0;
   cursor: pointer;
 
   &:hover {
-    background-color: #f3f4f6;
+    background-color: #4250f0;
+    color: white;
   }
 }
 
@@ -50,7 +51,7 @@
   cursor: pointer;
   font-size: 0.875rem;
   padding: 0.25rem 0.5rem;
-  border-radius: 0.25rem;
+  border-radius: 4px;
 
   &:hover {
     background-color: #e5e7eb;
@@ -244,15 +245,15 @@
 .functionFieldCancelBtn {
   padding: 0.5rem 1rem;
   background-color: white;
-  border: 1px solid #d1d5db;
-  border-radius: 0.375rem;
+  border-radius: 4px;
   font-size: 0.875rem;
   font-weight: 500;
   color: #374151;
   cursor: pointer;
+  border: none;
 
   &:hover {
-    background-color: #f3f4f6;
+    background-color: #f4f4f5;
   }
 }
 
@@ -260,11 +261,12 @@
   padding: 0.5rem 1rem;
   background-color: #4250f0;
   border: 1px solid transparent;
-  border-radius: 0.375rem;
+  border-radius: 4px;
   font-size: 0.875rem;
   font-weight: 500;
   color: white;
   cursor: pointer;
+  width: 80px;
 
   &:hover {
     background-color: #2563eb;
@@ -445,7 +447,7 @@
   cursor: pointer;
   font-size: 0.75rem;
   padding: 0.3rem 0.75rem;
-  border-radius: 0.25rem;
+  border-radius: 4px;
   font-weight: 500;
 
   &:hover {

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

@@ -2158,6 +2158,9 @@ class ActionForm extends Component<ActionFormPropsType, ActionFormStateType> {
                                         this.props.verifyStepValidity(step.id);
                                       }
                                     }}
+                                    tagsTree=${this.props.showMappingMenu
+                                      ? this.props.tagsTree
+                                      : null}
                                   />
                                 `;
 

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

@@ -31,6 +31,8 @@ interface FunctionFormPropsType extends StoreType {
   onClose: (response: any) => void;
   apiHandler: any;
   customSaveCallback?: (response: any) => void; // Optional callback: Helps the implementor to implement their own save button
+  showMappingMenu?: boolean; // Optional prop to show mapping menu
+  forceShowAllFields?: boolean; // Optional prop to show all fields including hidden fields
 }
 
 interface ActionFormStateType {
@@ -329,9 +331,11 @@ class FunctionForm extends Component<
     }
 
     if (this.props.customSaveCallback) {
+      const currentDataState = this.onSubmit({}, true);
+      const updatedDataState = { ...currentDataState, [fieldId]: value };
       this.props.customSaveCallback({
         hasInvalidFields,
-        data: this.onSubmit({}, true),
+        data: updatedDataState,
       });
     }
   };
@@ -509,7 +513,7 @@ class FunctionForm extends Component<
         value: option.value,
       }));
 
-      if (!field.isVisible) {
+      if (!field.isVisible && !this.props.forceShowAllFields) {
         return null;
       }
 
@@ -551,6 +555,9 @@ class FunctionForm extends Component<
                   allowTagsInText=${this.props.variables}
                   fieldId=${field.id}
                   isArray=${field.dataType === 'array'}
+                  tagsTree=${this.props.showMappingMenu
+                    ? this.props.variables
+                    : null}
                 ><//>
               <//>
             </div>
@@ -591,6 +598,9 @@ class FunctionForm extends Component<
                   isMappable=${this.props.variables &&
                   Object.entries(this.props.variables).length > 0}
                   allowTagsInText=${this.props.variables}
+                  tagsTree=${this.props.showMappingMenu
+                    ? this.props.variables
+                    : null}
                 ><//>
               <//>
             </div>
@@ -598,6 +608,7 @@ class FunctionForm extends Component<
           break;
         case 'DYNAMIC_DROPDOWN':
         case 'STATIC_DROPDOWN':
+        case 'CHECKBOX':
           isDynamic = field.type === 'DYNAMIC_DROPDOWN';
           fieldElement = html`
             <div class="${styles.functionFieldWrap} integry-action-field-wrap">
@@ -626,6 +637,8 @@ class FunctionForm extends Component<
                   type=${`${fieldType}`}
                   isEditable=${field.type === 'DYNAMIC_DROPDOWN'}
                   isSearchable=${true}
+                  isMappable=${this.props.showMappingMenu &&
+                  field.type !== 'DYNAMIC_DROPDOWN'}
                   appName=${`${appName}`}
                   isMultiSelect=${field.isMultiSelect}
                   onChange=${(val: any, stopChangePropagation = false) => {
@@ -644,43 +657,15 @@ class FunctionForm extends Component<
                     this.state.dynamicFieldDataState,
                   )}
                   selectedAuthId=${`${connectedAccount}`}
+                  tagsTree=${this.props.showMappingMenu
+                    ? this.props.variables
+                    : null}
                 ><//>
               <//>
             </div>
           `;
           break;
-        case 'CHECKBOX':
-          fieldElement = html`
-            <div class="${styles.functionFieldWrap} integry-action-field-wrap">
-              <${ConfigureFieldWrapper} field=${field}>
-                <${CheckboxGroup}
-                  fieldId=${field.id}
-                  title=${field.title}
-                  description=${field.description}
-                  placeholder=${field.placeholder}
-                  value=${this.state.dynamicFieldDataState[field.id]}
-                  isRequired=${field.is_required}
-                  dataSrcEndpoint=${null}
-                  isDynamic=${false}
-                  initialOptions=${options.filter(
-                    (option: Option) => option.id === '1',
-                  )}
-                  onChange=${(val: any) => {
-                    this.onFieldChange(
-                      field.id,
-                      val,
-                      field.dataType,
-                      false,
-                      parentFieldId,
-                    );
-                  }}
-                >
-                <//>
-              <//>
-            </div>
-          `;
 
-          break;
         case 'CUSTOM_FIELDS':
           if (!field.endpointURL) {
             break;