@abdellatifui/react 3.1.82 → 3.1.83

package/dist/nextgen.d.ts

@@ -504,10 +504,16 @@ export declare interface MenuButtonProps extends ButtonProps {
     }>;
 }
 
-export declare const Model: default_2.ForwardRefExoticComponent<ModelProps_2 & default_2.RefAttributes<HTMLDivElement>>;
+export declare const Model: default_2.ForwardRefExoticComponent<ModelProps_2 & default_2.RefAttributes<ModelHandle>>;
 
 export declare const ModelContext: Context<    {}>;
 
+declare interface ModelHandle {
+    open: () => void;
+    close: () => void;
+    readonly isOpen: boolean;
+}
+
 export declare interface ModelProps extends ContainerProps {
     isOpen: boolean;
     onClose: () => void;

package/dist/nextgen.js

@@ -16333,29 +16333,33 @@ const Model = forwardRef((props, ref) => {
     hideOnContextMenu,
     blur = false
   } = props;
-  function handleClose() {
+  const handleClose = useCallback(() => {
     setOpen(false);
-  }
-  function hanldeOpen() {
+  }, []);
+  const hanldeOpen = useCallback(() => {
     setOpen(true);
-  }
+  }, []);
+  useImperativeHandle(ref, () => ({
+    open: hanldeOpen,
+    close: handleClose,
+    get isOpen() {
+      return open;
+    }
+  }), [handleClose, hanldeOpen, open]);
   useEffect(() => {
-    if (ref.current) {
-      ref.current.open = hanldeOpen;
-      ref.current.close = handleClose;
-      ref.open = hanldeOpen;
-      ref.close = handleClose;
-      ref.current.isOpen = open;
-      if (open == true && !inline) {
-        setTimeout(() => {
-          const element = $(`#${id}`);
-          const element2 = document.getElementById(id);
-          const boundires = element2.getBoundingClientRect();
-          element.css("top", -boundires.y + "px");
-        }, 10);
-      }
+    if (!open || inline) {
+      return;
     }
-  }, [open, ref, id]);
+    const element = document.getElementById(id);
+    if (!element) {
+      return;
+    }
+    const frame = window.requestAnimationFrame(() => {
+      const boundaries = element.getBoundingClientRect();
+      element.style.top = `${-boundaries.y}px`;
+    });
+    return () => window.cancelAnimationFrame(frame);
+  }, [id, inline, open]);
   function handleWrapperClose(e) {
     if (e.target.classList.contains("custom-click-away") && bodyClick) {
       setOpen(false);
@@ -26545,3 +26549,4 @@ export {
   useStore,
   useVariable
 };
+//# sourceMappingURL=nextgen.js.map