fix: Tabs the prop "tabBarFixed" supports passing in specific fixed…

… values
arco-design · Aug 25, 2023 · ae3158f · ae3158f
1 parent b1881b2
commit ae3158f
Show file tree

Hide file tree

Showing 9 changed files with 39 additions and 16 deletions.
diff --git a/packages/arcodesign/components/load-more/README.en-US.md b/packages/arcodesign/components/load-more/README.en-US.md
@@ -12,6 +12,7 @@ Pull-up loading component, supports `scroll` and `click` two trigger loading met
 |----------|-------------|------|------|
 |style|Custom stylesheet|CSSProperties|-|
 |className|Custom classname|string|-|
+|disabled|Whether to disable the loading capability|boolean|-|
 |beforeReadyArea|Content when the component is loaded but not yet enabled|ReactNode|null|
 |loadingArea|Content in loading state|ReactNode|"Trying to load..."|
 |noMoreArea|Content with no more data|ReactNode|"No more data"|

diff --git a/packages/arcodesign/components/load-more/README.md b/packages/arcodesign/components/load-more/README.md
@@ -12,6 +12,7 @@
 |----------|-------------|------|------|
 |style|自定义样式|CSSProperties|-|
 |className|自定义类名|string|-|
+|disabled|是否禁用加载能力|boolean|-|
 |beforeReadyArea|组件加载但尚未启用状态下的内容|ReactNode|null|
 |loadingArea|加载中状态下的内容|ReactNode|"正在努力加载中..."|
 |noMoreArea|无更多数据状态下的内容|ReactNode|"没有更多数据了"|

diff --git a/packages/arcodesign/components/load-more/__ast__/index.ast.json b/packages/arcodesign/components/load-more/__ast__/index.ast.json
@@ -44,6 +44,23 @@
                 "name": "string"
             }
         },
+        "disabled": {
+            "defaultValue": null,
+            "description": "是否禁用加载能力\n@en Whether to disable the loading capability",
+            "name": "disabled",
+            "tags": {
+                "en": "Whether to disable the loading capability"
+            },
+            "descWithTags": "是否禁用加载能力",
+            "parent": {
+                "fileName": "arcom-github/packages/arcodesign/components/load-more/index.tsx",
+                "name": "LoadMoreProps"
+            },
+            "required": false,
+            "type": {
+                "name": "boolean"
+            }
+        },
         "beforeReadyArea": {
             "defaultValue": {
                 "value": "null"

diff --git a/packages/arcodesign/components/load-more/index.tsx b/packages/arcodesign/components/load-more/index.tsx
@@ -14,6 +14,7 @@ import {
     getValidScrollContainer,
     defaultLocale,
     ILocale,
+    cls,
 } from '@arco-design/mobile-utils';
 import { ContextLayout } from '../context-provider';
 import { useLatestRef, useUpdateEffect } from '../_helpers';
@@ -348,7 +349,9 @@ const LoadMore = forwardRef((props: LoadMoreProps, ref: Ref<LoadMoreRef>) => {
         <ContextLayout>
             {({ prefixCls, locale = defaultLocale }) => (
                 <div
-                    className={`${prefixCls}-load-more status-${nowStatus} ${className}`}
+                    className={cls(`${prefixCls}-load-more status-${nowStatus}`, className, {
+                        [`${prefixCls}-load-more-disabled`]: disabled,
+                    })}
                     ref={domRef}
                     style={style}
                     onClick={handleClick}

diff --git a/packages/arcodesign/components/tabs/README.en-US.md b/packages/arcodesign/components/tabs/README.en-US.md
@@ -20,7 +20,7 @@ Used to let the user switch between different views. In order to optimize the re
 |tabBarPosition|Tabbar position|"top" \| "bottom" \| "left" \| "right"|"top"|
 |tabBarArrange|Tabbar arrangement, tabBar is valid when it is in the top or bottom position, start is left, center is centered, and end is right|"start" \| "center" \| "end"|"center"|
 |tabBarScroll|Whether to scroll to the left when the TabBar exceeds the screen|boolean|true|
-|tabBarFixed|Whether the TabBar is fixed on the top|boolean|-|
+|tabBarFixed|Whether the TabBar is fixed on the top or bottom (including placeholder), a specific fixed value can be passed in|boolean \| Record\<"top" \| "bottom", number\>|-|
 |tabBarExtra|TabBar extra render content|ReactNode|-|
 |tabBarScrollBezier|The bezier curve value that changes when the tabBar is scrolled|\[number, number, number, number\]|[0.34, 0.69, 0.1, 1]|
 |tabBarScrollDuration|TabBar scrolling transition duration, in ms|number|300|
@@ -132,7 +132,7 @@ string | { [x: string]: any; title: ReactNode; }
 |tabBarPosition|Tabbar position|"top" \| "bottom" \| "left" \| "right"|"top"|
 |tabBarArrange|Tabbar arrangement, tabBar is valid when it is in the top or bottom position, start is left, center is centered, and end is right|"start" \| "center" \| "end"|"center"|
 |tabBarScroll|Whether to scroll to the left when the TabBar exceeds the screen|boolean|true|
-|tabBarFixed|Whether the TabBar is fixed on the top|boolean|-|
+|tabBarFixed|Whether the TabBar is fixed on the top or bottom (including placeholder), a specific fixed value can be passed in|boolean \| Record\<"top" \| "bottom", number\>|-|
 |tabBarExtra|TabBar extra render content|ReactNode|-|
 |tabBarScrollBezier|The bezier curve value that changes when the tabBar is scrolled|\[number, number, number, number\]|[0.34, 0.69, 0.1, 1]|
 |tabBarScrollDuration|TabBar scrolling transition duration, in ms|number|300|

diff --git a/packages/arcodesign/components/tabs/README.md b/packages/arcodesign/components/tabs/README.md
@@ -20,7 +20,7 @@
 |tabBarPosition|TabBar位置|"top" \| "bottom" \| "left" \| "right"|"top"|
 |tabBarArrange|TabBar排列方式，tabBar在top或bottom位置时有效，start为靠左，center为居中，end为靠右|"start" \| "center" \| "end"|"center"|
 |tabBarScroll|是否TabBar超出屏幕时靠左滚动排列|boolean|true|
-|tabBarFixed|TabBar是否顶部固定|boolean|-|
+|tabBarFixed|TabBar是否顶部/底部固定（含 placeholder），可传入具体固定的值|boolean \| Record\<"top" \| "bottom", number\>|-|
 |tabBarExtra|tabBar额外渲染内容|ReactNode|-|
 |tabBarScrollBezier|tabBar滚动时变化的bezier曲线值|\[number, number, number, number\]|[0.34, 0.69, 0.1, 1]|
 |tabBarScrollDuration|tabBar滚动过渡时长，单位ms|number|300|
@@ -132,7 +132,7 @@ string | { [x: string]: any; title: ReactNode; }
 |tabBarPosition|TabBar位置|"top" \| "bottom" \| "left" \| "right"|"top"|
 |tabBarArrange|TabBar排列方式，tabBar在top或bottom位置时有效，start为靠左，center为居中，end为靠右|"start" \| "center" \| "end"|"center"|
 |tabBarScroll|是否TabBar超出屏幕时靠左滚动排列|boolean|true|
-|tabBarFixed|TabBar是否顶部固定|boolean|-|
+|tabBarFixed|TabBar是否顶部/底部固定（含 placeholder），可传入具体固定的值|boolean \| Record\<"top" \| "bottom", number\>|-|
 |tabBarExtra|tabBar额外渲染内容|ReactNode|-|
 |tabBarScrollBezier|tabBar滚动时变化的bezier曲线值|\[number, number, number, number\]|[0.34, 0.69, 0.1, 1]|
 |tabBarScrollDuration|tabBar滚动过渡时长，单位ms|number|300|

diff --git a/packages/arcodesign/components/tabs/__ast__/index.ast.json b/packages/arcodesign/components/tabs/__ast__/index.ast.json
@@ -221,19 +221,19 @@
         },
         "tabBarFixed": {
             "defaultValue": null,
-            "description": "TabBar是否顶部固定\n@en Whether the TabBar is fixed on the top",
+            "description": "TabBar是否顶部/底部固定（含 placeholder），可传入具体固定的值\n@en Whether the TabBar is fixed on the top or bottom (including placeholder), a specific fixed value can be passed in",
             "name": "tabBarFixed",
             "tags": {
-                "en": "Whether the TabBar is fixed on the top"
+                "en": "Whether the TabBar is fixed on the top or bottom (including placeholder), a specific fixed value can be passed in"
             },
-            "descWithTags": "TabBar是否顶部固定",
+            "descWithTags": "TabBar是否顶部/底部固定（含 placeholder），可传入具体固定的值",
             "parent": {
                 "fileName": "arcom-github/packages/arcodesign/components/tabs/type.ts",
                 "name": "TabsProps"
             },
             "required": false,
             "type": {
-                "name": "boolean"
+                "name": "boolean | Record<\"top\" | \"bottom\", number>"
             }
         },
         "tabBarExtra": {
@@ -1805,15 +1805,15 @@
             "tabBarFixed": {
                 "name": "tabBarFixed",
                 "required": false,
-                "description": "TabBar是否顶部固定\n@en Whether the TabBar is fixed on the top",
+                "description": "TabBar是否顶部/底部固定（含 placeholder），可传入具体固定的值\n@en Whether the TabBar is fixed on the top or bottom (including placeholder), a specific fixed value can be passed in",
                 "defaultValue": null,
                 "type": {
-                    "name": "boolean"
+                    "name": "boolean | Record<\"top\" | \"bottom\", number>"
                 },
                 "tags": {
-                    "en": "Whether the TabBar is fixed on the top"
+                    "en": "Whether the TabBar is fixed on the top or bottom (including placeholder), a specific fixed value can be passed in"
                 },
-                "descWithTags": "TabBar是否顶部固定"
+                "descWithTags": "TabBar是否顶部/底部固定（含 placeholder），可传入具体固定的值"
             },
             "tabBarExtra": {
                 "name": "tabBarExtra",

diff --git a/packages/arcodesign/components/tabs/tab-cell.tsx b/packages/arcodesign/components/tabs/tab-cell.tsx
@@ -380,6 +380,7 @@ const TabCell = forwardRef((props: TabCellProps, ref: Ref<TabCellRef>) => {
                     { fixed: tabBarFixed },
                     { 'has-divider': hasDivider },
                 )}
+                style={typeof tabBarFixed === 'object' ? tabBarFixed : {}}
             >
                 <div
                     className={cls(

diff --git a/packages/arcodesign/components/tabs/type.ts b/packages/arcodesign/components/tabs/type.ts
@@ -78,10 +78,10 @@ export interface TabsProps {
      */
     tabBarScroll?: boolean;
     /**
-     * TabBar是否顶部固定
-     * @en Whether the TabBar is fixed on the top
+     * TabBar是否顶部/底部固定（含 placeholder），可传入具体固定的值
+     * @en Whether the TabBar is fixed on the top or bottom (including placeholder), a specific fixed value can be passed in
      */
-    tabBarFixed?: boolean;
+    tabBarFixed?: boolean | Record<'top' | 'bottom', number>;
     /**
      * tabBar额外渲染内容
      * @en TabBar extra render content