fixed tooltip warnings after antd upgrade

raheeliftikhar5 · raheeliftikhar5 · commit fb9eb33c9c01 · 2025-02-17T13:22:28.000+05:00
diff --git a/client/packages/lowcoder-design/src/components/control.tsx b/client/packages/lowcoder-design/src/components/control.tsx
@@ -159,7 +159,9 @@ export const ControlPropertyViewWrapper = (
           <ToolTipLabel
             title={tooltip}
             label={label}
-            overlayInnerStyle={labelTooltipOverlayInnerStyle}
+            styles={{
+              body: labelTooltipOverlayInnerStyle,
+            }}
           />
         </LabelWrapper>
       )}
diff --git a/client/packages/lowcoder-design/src/components/iconSelect/index.tsx b/client/packages/lowcoder-design/src/components/iconSelect/index.tsx
@@ -363,10 +363,12 @@ export const IconSelectBase = (props: {
       onOpenChange={setVisible}
       getPopupContainer={parent ? () => parent : undefined}
       // hide the original background when dragging the popover is allowed
-      overlayInnerStyle={{
-        border: "none",
-        boxShadow: "none",
-        background: "transparent",
+      styles={{
+        body: {
+          border: "none",
+          boxShadow: "none",
+          background: "transparent",
+        }
       }}
       // when dragging is allowed, always re-location to avoid the popover exceeds the screen
       destroyTooltipOnHide
diff --git a/client/packages/lowcoder-design/src/components/popover.tsx b/client/packages/lowcoder-design/src/components/popover.tsx
@@ -64,7 +64,6 @@ const SimplePopover = (props: {
   );
   return (
     <Popover
-      overlayInnerStyle={{padding: 0}}
       align={{
         offset: [-12, 0, 0, 0],
       }}
@@ -74,7 +73,10 @@ const SimplePopover = (props: {
       open={visible}
       onOpenChange={setVisible}
       placement="left"
-      overlayStyle={{ width: "310px" }}
+      styles={{
+        root: { width: "310px" },
+        body: { padding: 0 }
+      }}
     >
       {props.children}
     </Popover>
@@ -101,16 +103,18 @@ const CustomPopover = (props: {
   );
   return (
     <Popover
-      overlayInnerStyle={{padding: 0}}
       content={contentWithBox}
       trigger="click"
       open={visible}
       onOpenChange={setVisible}
       placement={props.type === "query" ? "top" : "left"}
-      overlayStyle={{ width: "310px" }}
       align={{
         offset: [-12, 0, 0, 0],
       }}
+      styles={{
+        root: { width: "310px" },
+        body: { padding: 0 }
+      }}
     >
       {props.children}
     </Popover>
@@ -167,8 +171,10 @@ const EditPopover = (props: EditPopoverProps) => {
   return (
     <Popover
       arrow={false}
-      overlayStyle={{paddingTop: '15px'}}
-      overlayInnerStyle={{padding: 0}}
+      styles={{
+        root: { paddingTop: '15px' },
+        body: { padding: 0 }
+      }}
       content={() => (
         <>
           <Wedge />
diff --git a/client/packages/lowcoder-design/src/components/shapeSelect/index.tsx b/client/packages/lowcoder-design/src/components/shapeSelect/index.tsx
@@ -444,10 +444,12 @@ export const ShapeSelectBase = (props: {
       onOpenChange={setVisible}
       getPopupContainer={parent ? () => parent : undefined}
       // hide the original background when dragging the popover is allowed
-      overlayInnerStyle={{
-        border: "none",
-        boxShadow: "none",
-        background: "transparent",
+      styles={{
+        body: {
+          border: "none",
+          boxShadow: "none",
+          background: "transparent",
+        }
       }}
       // when dragging is allowed, always re-location to avoid the popover exceeds the screen
       destroyTooltipOnHide
diff --git a/client/packages/lowcoder-design/src/components/toolTip.tsx b/client/packages/lowcoder-design/src/components/toolTip.tsx
@@ -155,7 +155,7 @@ export const UnderlineCss = css`
 `;
 
 function Tooltip(props: TooltipProps) {
-  return <AntdTooltip color="#2c2c2c2" overlayInnerStyle={overlayInnerCss} {...props} />;
+  return <AntdTooltip color="#2c2c2c2" styles={{ body: overlayInnerCss }} {...props} />;
 }
 
 const Label = styled.div<{ $border?: boolean }>`
@@ -181,7 +181,9 @@ function ToolTipLabel(
     <AntdTooltip
       color="#2c2c2c"
       title={title && <TooltipTitleWrapper><>{title}</></TooltipTitleWrapper>}
-      overlayInnerStyle={{ maxWidth: "232px", whiteSpace: "break-spaces" }}
+      styles={{
+        body: { maxWidth: "232px", whiteSpace: "break-spaces" }
+      }}
       arrow={{
         pointAtCenter: true
       }}
diff --git a/client/packages/lowcoder/src/comps/comps/tableComp/tableToolbarComp.tsx b/client/packages/lowcoder/src/comps/comps/tableComp/tableToolbarComp.tsx
@@ -686,8 +686,10 @@ function ToolbarPopover(props: {
   return (
     <Popover
       open={visible}
-      overlayStyle={{ pointerEvents: "auto" }}
-      overlayInnerStyle={{ padding: '0' }}
+      styles={{
+        root: { pointerEvents: "auto" },
+        body: {padding: '0'}
+      }}
       content={
         <div
           ref={popOverRef}
