fix(pagination): color of icon (#2769)

* fix(pagination): color of icon

* fix: review

* fix: ai’s review

src/packages/pagination/pagination.taro.tsx

@@ -1,9 +1,10 @@
-import React, { FunctionComponent, useMemo, ReactNode } from 'react'
+import React, { FunctionComponent, ReactNode, useMemo } from 'react'
 import classNames from 'classnames'
 import { View } from '@tarojs/components'
 import { useConfig } from '@/packages/configprovider/index.taro'
 import { usePropsValue } from '@/utils/use-props-value'
 import { BasicComponent, ComponentDefaults } from '@/utils/typings'
+import addColorForHarmony from '@/utils/add-color-for-harmony'
 
 export interface PaginationProps extends BasicComponent {
   defaultValue: number
@@ -117,7 +118,10 @@ export const Pagination: FunctionComponent<
             )}
             onClick={(e) => handleSelectPage(currentPage - 1)}
           >
-            {prev || locale.pagination.prev}
+            {addColorForHarmony(
+              prev || locale.pagination.prev,
+              currentPage === 1 ? '#c2c4cc' : '#ff0f23'
+            )}
           </View>
           {mode === 'multi' && (
             <View className={`${classPrefix}-contain`}>
@@ -154,7 +158,10 @@ export const Pagination: FunctionComponent<
             )}
             onClick={(e) => handleSelectPage(currentPage + 1)}
           >
-            {next || locale.pagination.next}
+            {addColorForHarmony(
+              next || locale.pagination.next,
+              currentPage >= pageCount ? '#c2c4cc' : '#ff0f23'
+            )}
           </View>
         </>
       )}

src/utils/add-color-for-harmony.ts

@@ -0,0 +1,23 @@
+import React, { ReactElement, ReactNode } from 'react'
+import { harmony } from './platform-taro'
+
+interface ColorProps {
+  color?: string
+}
+
+/**
+ * 为支持 Harmony 的 React 元素添加颜色属性
+ * @param maybeElement - 要处理的 React 节点
+ * @param color - 要添加的颜色值（如：'#ff0000'）
+ * @returns 处理后的 React 节点
+ */
+function addColorForHarmony(maybeElement: ReactNode, color: string) {
+  if (React.isValidElement(maybeElement) && harmony()) {
+    return React.cloneElement<ColorProps>(maybeElement as ReactElement, {
+      color,
+    })
+  }
+  return maybeElement
+}
+
+export default addColorForHarmony