@integry/sdk 4.5.23 → 4.5.24

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@integry/sdk",
-  "version": "4.5.23",
+  "version": "4.5.24",
   "description": "Integry SDK",
   "main": "dist/umd/index.umd.js",
   "module": "dist/esm/index.csm.js",
@@ -54,6 +54,7 @@
     "@testing-library/preact": "^2.0.1",
     "@testing-library/user-event": "^14.6.1",
     "@types/jest": "^26.0.23",
+    "@types/react-dom": "^19.0.4",
     "@types/yaireo__tagify": "^4.18.0",
     "@typescript-eslint/eslint-plugin": "^4.20.0",
     "@typescript-eslint/parser": "^4.20.0",

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

@@ -8,7 +8,7 @@ import { isScrolledIntoView } from '@/utils/common';
 import { searchJSON } from '@/utils/searchJson';
 import { Input } from '@/components/Input';
 import { createElement } from 'preact/compat';
-import { createPortal } from 'preact/compat';
+import { createRoot } from 'react-dom/client';
 import { TagOptions } from '../TagOptions';
 import { ThreeDotLoader } from '../../ThreeDotLoader';
 import styles from './styles.module.scss';
@@ -221,17 +221,21 @@ const FieldDropdown = (props: FieldMenuProps) => {
   }
 
   const PortalWrapper = () => {
-    const containerRef = useRef<HTMLDivElement>(null);
+    const reactRoot = useRef<HTMLDivElement>(null);
 
     useEffect(() => {
-      if (containerRef.current) {
-        createPortal(tagsComponentRender, containerRef.current);
+      if (reactRoot.current) {
+        const root = createRoot(reactRoot.current);
+        root.render(tagsComponentRender);
       }
     }, []);
 
-    return html`<div ref=${containerRef}></div>`;
+    return html`<div ref=${reactRoot}></div>`;
   };
 
+  // eslint-disable-next-line no-console
+  console.log(PortalWrapper);
+
   return html` <div
     class=${`${styles.tagMenu} ${enableSearch ? styles.tagMenuWithSearch : ''}`}
     style=${parentContainer && tagMenyStyleRef?.current