@integry/sdk 4.5.27 → 4.5.29

package/package.json

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

package/src/components/MultipurposeField/TagMenu/index.ts

@@ -8,6 +8,7 @@ import { isScrolledIntoView } from '@/utils/common';
 import { searchJSON } from '@/utils/searchJson';
 import { Input } from '@/components/Input';
 import { createElement } from 'preact/compat';
+import ReactCompat from 'preact/compat';
 import { TagOptions } from '../TagOptions';
 import { ThreeDotLoader } from '../../ThreeDotLoader';
 import styles from './styles.module.scss';
@@ -212,12 +213,19 @@ const FieldDropdown = (props: FieldMenuProps) => {
     }
   }
 
-  let tagsComponentRender: any = null;
-  if (tagsComponent) {
-    tagsComponentRender = createElement(tagsComponent, {
-      onSelect: () => alert('Selected!'),
-    });
-  }
+  const convertReactToPreact = (
+    ReactComponent: any,
+    propsLocal = {},
+    mountNode: any,
+  ) => {
+    const PreactComponent = ReactCompat.createElement(
+      ReactComponent,
+      propsLocal,
+    );
+    ReactCompat.render(PreactComponent, mountNode);
+  };
+
+  const mountNode = document.getElementById('x-integry-container');
 
   return html` <div
     class=${`${styles.tagMenu} ${enableSearch ? styles.tagMenuWithSearch : ''}`}
@@ -344,7 +352,13 @@ const FieldDropdown = (props: FieldMenuProps) => {
           </div>`
         : html` <div className="${styles.mappedFieldMenu}">
             ${tagsComponent
-              ? html`<div>${tagsComponentRender}</div>`
+              ? html`<div>
+                  ${convertReactToPreact(
+                    tagsComponent,
+                    { onSelect: '' },
+                    mountNode,
+                  )}
+                </div>`
               : html`${Object.keys(
                   !isEditable ? searchJSON(tags, searchValue) : tags,
                 ).length > 0

package/src/index.ts

@@ -2018,7 +2018,7 @@ export class IntegryJS {
                 isReadOnly="${false}"
                 selectedAuthId="${options.connectedAccountId}"
                 accountConnected=${true}
-                tagsComponent=${TestComponent}
+                tagsComponent=${options.tagsComponent}
                 onFieldChangeCallback=${options.onFieldChangeCallback}
                 tagsTree=${options.tagsTree}
               />