From ec58a78c22a201a792dc469a34ef511a6da641fa Mon Sep 17 00:00:00 2001
From: luciob <lucio.bordonaro@gmail.com>
Date: Mon, 5 Dec 2022 17:16:38 +0100
Subject: [PATCH] =?UTF-8?q?fix:=20=F0=9F=90=9B=20[Popper]=20Mismatch=20bet?=
 =?UTF-8?q?ween=20MUIPopper=20type:=20React=2017=20vs=2018?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Select/components/Popper/index.tsx        | 22 +++++++++++++++++--
 1 file changed, 20 insertions(+), 2 deletions(-)

diff --git a/src/components/Select/components/Popper/index.tsx b/src/components/Select/components/Popper/index.tsx
index 3dbb6e09..1861a546 100644
--- a/src/components/Select/components/Popper/index.tsx
+++ b/src/components/Select/components/Popper/index.tsx
@@ -1,4 +1,4 @@
-import React, { FC, useMemo } from "react";
+import React, { CSSProperties, FC, useMemo } from "react";
 import { Popper as MUIPopper, PopperProps as MUIPopperProps } from "@mui/material";
 
 interface ISelectPopper {
@@ -12,10 +12,28 @@ const SelectPopper: FC<ISelectPopper> = ({ forwarded, popperWidth }) => {
   const width = useMemo(() => {
     const anchorElRef = anchorEl as any;
     const anchorElWidth = anchorElRef ? anchorElRef.clientWidth : null;
+
     return !!popperWidth && popperWidth > anchorElWidth ? popperWidth : anchorElWidth;
   }, [popperWidth, anchorEl]);
 
-  return <MUIPopper {...forwarded} placement="bottom-start" style={{ width }} />;
+  const style = useMemo(
+    (): CSSProperties => ({
+      width,
+    }),
+    [width]
+  );
+
+  return (
+    <MUIPopper
+      {...forwarded}
+      placement="bottom-start"
+      style={style}
+      // React 17.x vs React 18.x mismatch
+      // See: https://github.com/mui/material-ui/issues/35287
+      onResize={undefined}
+      onResizeCapture={undefined}
+    />
+  );
 };
 
 export default SelectPopper;