fix: FloatButton support rtl (ant-design#40990)

RedJue · Apr 4, 2023 · c08e7e4 · c08e7e4
1 parent d3950eb
commit c08e7e4
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 4 deletions.
diff --git a/components/float-button/FloatButton.tsx b/components/float-button/FloatButton.tsx
@@ -2,17 +2,17 @@ import classNames from 'classnames';
 import React, { useContext, useMemo } from 'react';
 import type { ConfigConsumerProps } from '../config-provider';
 import { ConfigContext } from '../config-provider';
-import useStyle from './style';
 import Tooltip from '../tooltip';
+import warning from '../_util/warning';
+import FloatButtonGroupContext from './context';
 import Content from './FloatButtonContent';
 import type {
   CompoundedComponent,
   FloatButtonContentProps,
   FloatButtonProps,
   FloatButtonShape,
 } from './interface';
-import FloatButtonGroupContext from './context';
-import warning from '../_util/warning';
+import useStyle from './style';
 
 export const floatButtonPrefixCls = 'float-btn';
 
@@ -56,7 +56,7 @@ const FloatButton: React.ForwardRefRenderFunction<
   );
 
   const buttonNode = (
-    <Tooltip title={tooltip} placement="left">
+    <Tooltip title={tooltip} placement={direction === 'rtl' ? 'right' : 'left'}>
       <div className={`${prefixCls}-body`}>
         <Content {...contentProps} />
       </div>

diff --git a/components/float-button/style/index.ts b/components/float-button/style/index.ts
@@ -237,6 +237,9 @@ const sharedFloatButtonStyle: GenerateStyle<FloatButtonToken, CSSObject> = (toke
         },
       },
     },
+    [`${componentCls}-rtl`]: {
+      direction: 'rtl',
+    },
     [`${componentCls}-circle`]: {
       height: floatButtonSize,
       borderRadius: '50%',