feat(backtop): rtl (jdf2e#2051)

Co-authored-by: xiaoyatong <[email protected]>
Alex-huxiyang · Mar 18, 2024 · aa3b385 · aa3b385
1 parent 4a6fe09
commit aa3b385
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 5 deletions.
diff --git a/src/packages/backtop/backtop.taro.tsx b/src/packages/backtop/backtop.taro.tsx
@@ -4,6 +4,7 @@ import { usePageScroll, pageScrollTo } from '@tarojs/taro'
 import { Top } from '@nutui/icons-react-taro'
 import classNames from 'classnames'
 import { BasicComponent, ComponentDefaults } from '@/utils/typings'
+import { useRtl } from '@/packages/configprovider/index.taro'
 
 export interface BackTopProps extends BasicComponent {
   threshold: number
@@ -22,6 +23,7 @@ const defaultProps = {
 export const BackTop: FunctionComponent<
   Partial<BackTopProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick'>
 > = (props) => {
+  const rtl = useRtl()
   const { children, threshold, zIndex, className, duration, style, onClick } = {
     ...defaultProps,
     ...props,
@@ -53,7 +55,7 @@ export const BackTop: FunctionComponent<
           ...style,
         }
       : {
-          right: '10px',
+          [rtl ? 'left' : 'right']: '10px',
           bottom: '20px',
           zIndex,
         }

diff --git a/src/packages/backtop/backtop.tsx b/src/packages/backtop/backtop.tsx
@@ -4,6 +4,7 @@ import { Top } from '@nutui/icons-react'
 import classNames from 'classnames'
 import { BasicComponent, ComponentDefaults } from '@/utils/typings'
 import requestAniFrame from '@/utils/raf'
+import { useRtl } from '@/packages/configprovider'
 
 declare const window: any
 
@@ -26,6 +27,7 @@ const defaultProps = {
 export const BackTop: FunctionComponent<
   Partial<BackTopProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick'>
 > = (props) => {
+  const rtl = useRtl()
   const {
     children,
     target,
@@ -121,7 +123,7 @@ export const BackTop: FunctionComponent<
           ...style,
         }
       : {
-          right: '10px',
+          [rtl ? 'left' : 'right']: '10px',
           bottom: '20px',
           zIndex,
         }

diff --git a/src/packages/badge/badge.taro.tsx b/src/packages/badge/badge.taro.tsx
@@ -1,11 +1,9 @@
 import React, { CSSProperties, FunctionComponent, ReactNode } from 'react'
 import classNames from 'classnames'
-
 import { BasicComponent, ComponentDefaults } from '@/utils/typings'
 import { useRtl } from '@/packages/configprovider/index.taro'
 
 export type BadgeFill = 'solid' | 'outline'
-
 export interface BadgeProps extends BasicComponent {
   value: ReactNode
   dot: boolean

diff --git a/src/packages/badge/badge.tsx b/src/packages/badge/badge.tsx
@@ -1,6 +1,5 @@
 import React, { CSSProperties, FunctionComponent, ReactNode } from 'react'
 import classNames from 'classnames'
-
 import { BasicComponent, ComponentDefaults } from '@/utils/typings'
 import { useRtl } from '@/packages/configprovider'