x-ui-design 0.9.66 → 0.9.68

package/dist/esm/types/components/Popover/Popover.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
 import { PopoverProps } from "../../types/popover";
 import './style.css';
-declare const Popover: ({ prefixCls, content, children, trigger, placement, open, visible, title, style, overlayClassName, overlayStyle, overlayPopupStyle, onVisibleChange, getPopupContainer }: PopoverProps) => React.JSX.Element;
+declare const Popover: ({ prefixCls, content, children, trigger, placement, open, visible, title, style, overlayClassName, overlayStyle, onVisibleChange, getPopupContainer }: PopoverProps) => React.JSX.Element;
 export default Popover;

package/dist/esm/types/hooks/usePopupPosition.d.ts

@@ -8,9 +8,8 @@ type TPopupPosition = {
     placement?: Placement;
     popupContainer?: HTMLElement | null;
     useTargetWidth?: boolean;
-    overlayPopupStyle?: CSSProperties;
 };
-export declare const usePopupPosition: ({ open, setOpen, popupRef, targetRef, placement, popupContainer, useTargetWidth, overlayPopupStyle }: TPopupPosition) => {
+export declare const usePopupPosition: ({ open, setOpen, popupRef, targetRef, placement, popupContainer, useTargetWidth, }: TPopupPosition) => {
     _placement: Placement;
     popupStyle: CSSProperties;
 };

package/dist/esm/types/types/popover.d.ts

@@ -8,10 +8,8 @@ export type PopoverProps = DefaultProps & {
     open?: boolean;
     overlayStyle?: CSSProperties;
     overlayClassName?: string;
-    overlayPopupStyle?: CSSProperties;
     title?: string | ReactNode;
     visible?: boolean;
-    listenPopoverPositions?: CSSProperties;
     placementPositionOffset?: number;
     onVisibleChange?: ((open: boolean) => void) | undefined;
     getPopupContainer?: ((node: HTMLElement) => HTMLElement) | undefined;

package/dist/index.esm.js

@@ -2627,8 +2627,7 @@ const usePopupPosition = ({
   targetRef,
   placement,
   popupContainer,
-  useTargetWidth,
-  overlayPopupStyle = {}
+  useTargetWidth
 }) => {
   const [_placement, _setPlacement] = useState(placement ?? "bottomLeft");
   const [popupPosition, setPopupPosition] = useState({});
@@ -2664,7 +2663,7 @@ const usePopupPosition = ({
       }
       const popupRect = popupRef.current?.getBoundingClientRect();
       if (popupRect) {
-        if (popupRect?.width < OFFSET) {
+        if (popupRect?.width < OFFSET || !targetRef.current) {
           setOpen(false);
           setPopupPosition({});
           const timeout = setTimeout(() => {
@@ -2721,69 +2720,65 @@ const usePopupPosition = ({
         });
       }
     });
-    if (Object.keys(overlayPopupStyle).length) {
-      setPopupPosition(overlayPopupStyle);
-    } else {
-      promisePopupPlacment.then(({
-        container,
-        positions,
-        newPlacement
-      }) => {
-        const _calculation = () => {
-          switch (newPlacement) {
-            case "bottom":
-              setPopupPosition({
-                top: positions.top + container.height,
-                left: positions.left + (container.width || 0) / 2 - (popupRef.current?.offsetWidth || 0) / 2
-              });
-              break;
-            case "bottomLeft":
-              setPopupPosition({
-                top: positions.top + container.height,
-                left: positions.left
-              });
-              break;
-            case "bottomRight":
-              setPopupPosition({
-                top: positions.top + container.height,
-                left: positions.left + (container.width || 0) - (popupRef.current?.offsetWidth || 0)
-              });
-              break;
-            case "top":
-              setPopupPosition({
-                top: positions.top - (popupRef.current?.clientHeight || 0) - OFFSET * 2,
-                left: positions.left + (container.width || 0) / 2 - (popupRef.current?.offsetWidth || 0) / 2
-              });
-              break;
-            case "topLeft":
-              setPopupPosition({
-                top: positions.top - (popupRef.current?.clientHeight || 0) - OFFSET * 2,
-                left: positions.left
-              });
-              break;
-            case "topRight":
-              setPopupPosition({
-                top: positions.top - (popupRef.current?.clientHeight || 0) - OFFSET * 2,
-                left: positions.left + (container.width || 0) - (popupRef.current?.offsetWidth || 0)
-              });
-              break;
-            case "left":
-              setPopupPosition({
-                top: positions.top - OFFSET,
-                left: positions.left - (popupRef.current?.offsetWidth || 0) - OFFSET
-              });
-              break;
-            case "right":
-              setPopupPosition({
-                top: positions.top - OFFSET,
-                left: positions.left + container.width + OFFSET
-              });
-              break;
-          }
-        };
-        _calculation();
-      });
-    }
+    promisePopupPlacment.then(({
+      container,
+      positions,
+      newPlacement
+    }) => {
+      const _calculation = () => {
+        switch (newPlacement) {
+          case "bottom":
+            setPopupPosition({
+              top: positions.top + container.height,
+              left: positions.left + (container.width || 0) / 2 - (popupRef.current?.offsetWidth || 0) / 2
+            });
+            break;
+          case "bottomLeft":
+            setPopupPosition({
+              top: positions.top + container.height,
+              left: positions.left
+            });
+            break;
+          case "bottomRight":
+            setPopupPosition({
+              top: positions.top + container.height,
+              left: positions.left + (container.width || 0) - (popupRef.current?.offsetWidth || 0)
+            });
+            break;
+          case "top":
+            setPopupPosition({
+              top: positions.top - (popupRef.current?.clientHeight || 0) - OFFSET * 2,
+              left: positions.left + (container.width || 0) / 2 - (popupRef.current?.offsetWidth || 0) / 2
+            });
+            break;
+          case "topLeft":
+            setPopupPosition({
+              top: positions.top - (popupRef.current?.clientHeight || 0) - OFFSET * 2,
+              left: positions.left
+            });
+            break;
+          case "topRight":
+            setPopupPosition({
+              top: positions.top - (popupRef.current?.clientHeight || 0) - OFFSET * 2,
+              left: positions.left + (container.width || 0) - (popupRef.current?.offsetWidth || 0)
+            });
+            break;
+          case "left":
+            setPopupPosition({
+              top: positions.top - OFFSET,
+              left: positions.left - (popupRef.current?.offsetWidth || 0) - OFFSET
+            });
+            break;
+          case "right":
+            setPopupPosition({
+              top: positions.top - OFFSET,
+              left: positions.left + container.width + OFFSET
+            });
+            break;
+        }
+      };
+      _calculation();
+    });
   }, [targetRef, popupContainer, popupRef, useTargetWidth, inBody, _placement, setOpen]);
   useEffect(() => {
     if (!open) {
@@ -2811,7 +2806,6 @@ const usePopupPosition = ({
     popupStyle: {
       zIndex: 10000,
       position: "absolute",
-      // transition: '1s ease',
       opacity: Object.keys(popupPosition).length ? 1 : 0,
       ...popupPosition
     }
@@ -5675,7 +5669,6 @@ const Popover = ({
   style = {},
   overlayClassName = '',
   overlayStyle = {},
-  overlayPopupStyle = {},
   onVisibleChange,
   getPopupContainer
 }) => {
@@ -5692,7 +5685,6 @@ const Popover = ({
     placement,
     open: isOpen,
     setOpen: setInnerOpen,
-    overlayPopupStyle,
     popupContainer: getPopupContainer?.(targetRef.current)
   });
   useEffect(() => {