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 = ({ 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 ; + const style = useMemo( + (): CSSProperties => ({ + width, + }), + [width] + ); + + return ( + + ); }; export default SelectPopper;