x-ui-design 0.9.66 → 0.9.67

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, listenPopoverPositions, onVisibleChange, getPopupContainer }: PopoverProps) => React.JSX.Element;
 export default Popover;

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

@@ -8,9 +8,9 @@ type TPopupPosition = {
     placement?: Placement;
     popupContainer?: HTMLElement | null;
     useTargetWidth?: boolean;
-    overlayPopupStyle?: CSSProperties;
+    listenPopoverPositions?: 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, listenPopoverPositions }: TPopupPosition) => {
     _placement: Placement;
     popupStyle: CSSProperties;
 };

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

@@ -8,10 +8,9 @@ export type PopoverProps = DefaultProps & {
     open?: boolean;
     overlayStyle?: CSSProperties;
     overlayClassName?: string;
-    overlayPopupStyle?: CSSProperties;
+    listenPopoverPositions?: 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

@@ -2628,7 +2628,7 @@ const usePopupPosition = ({
   placement,
   popupContainer,
   useTargetWidth,
-  overlayPopupStyle = {}
+  listenPopoverPositions
 }) => {
   const [_placement, _setPlacement] = useState(placement ?? "bottomLeft");
   const [popupPosition, setPopupPosition] = useState({});
@@ -2721,69 +2721,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) {
@@ -2805,7 +2801,7 @@ const usePopupPosition = ({
       controller.abort();
       setPopupPosition({});
     };
-  }, [open, targetRef, calculatePosition]);
+  }, [open, targetRef, listenPopoverPositions, calculatePosition]);
   return {
     _placement,
     popupStyle: {
@@ -5675,7 +5671,7 @@ const Popover = ({
   style = {},
   overlayClassName = '',
   overlayStyle = {},
-  overlayPopupStyle = {},
+  listenPopoverPositions,
   onVisibleChange,
   getPopupContainer
 }) => {
@@ -5692,7 +5688,7 @@ const Popover = ({
     placement,
     open: isOpen,
     setOpen: setInnerOpen,
-    overlayPopupStyle,
+    listenPopoverPositions,
     popupContainer: getPopupContainer?.(targetRef.current)
   });
   useEffect(() => {