fix: 适配td

src/packages/address/address.scss

@@ -67,10 +67,10 @@
       font-size: 12px;
       border-radius: 4px;
       margin-bottom: 7px;
-      /* #ifdef harmony*/
+      /* #ifdef harmony dynamic*/
       margin-right: 6px;
       /* #endif */
-      /* #ifndef harmony*/
+      /* #ifndef harmony dynamic*/
       margin-right: 7px;
       /* #endif */
       background-color: $color-background-sunken;

src/packages/avatar/avatar.taro.tsx

@@ -10,14 +10,14 @@
 import { User } from '@nutui/icons-react-taro'
 import { AvatarContext } from '@/packages/avatargroup/context'
 import { ComponentDefaults } from '@/utils/typings'
-import { harmony } from '@/utils/taro/platform'
+import { harmony, td } from '@/utils/taro/platform'
 import AvatarGroup from '@/packages/avatargroup/index.taro'
 import { pxTransform } from '@/utils/taro/px-transform'
 import { TaroAvatarProps } from '@/types'
 
 const defaultProps = {
   ...ComponentDefaults,
-  size: harmony() ? '40' : '',
+  size: harmony() || td() ? '40' : '',
   shape: 'round',
   icon: '',
   background: '#eee',
@@ -104,7 +104,7 @@
     ) {
       setShowMax(true)
     }
   }, [avatarIndex, groupCount])
 
   const errorEvent = () => {
     onError && onError()

src/packages/avatar/demos/taro/demo4.tsx

@@ -1,20 +1,21 @@
 import React from 'react'
-import { Avatar, Cell, harmony } from '@nutui/nutui-react-taro'
+import { Avatar, Cell, harmony, td } from '@nutui/nutui-react-taro'
 import { User } from '@nutui/icons-react-taro'
 
 const Demo4 = () => {
   const styles = { marginRight: 30 }
+  const variableDisabled = harmony() || td()
   return (
     <Cell className="cell-avatar">
       <Avatar
         color="#ffffff"
-        background={`${harmony() ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
+        background={`${variableDisabled ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
         icon={<User />}
         style={styles}
       />
       <Avatar
-        color={`${harmony() ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
-        background={`${harmony() ? '#ffebf1' : 'var(--nutui-color-primary-light-pressed)'}`}
+        color={`${variableDisabled ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
+        background={`${variableDisabled ? '#ffebf1' : 'var(--nutui-color-primary-light-pressed)'}`}
       >
         U
       </Avatar>

src/packages/avatar/demos/taro/demo6.tsx

@@ -1,17 +1,18 @@
 import React from 'react'
-import { Avatar, Cell, harmony } from '@nutui/nutui-react-taro'
+import { Avatar, Cell, harmony, td } from '@nutui/nutui-react-taro'
 import { User } from '@nutui/icons-react-taro'
 
 const Demo6 = () => {
+  const variableDisabled = harmony() || td()
   return (
     <>
       <Cell>
         <Avatar.Group gap="-4">
           <Avatar src="https://img12.360buyimg.com/imagetools/jfs/t1/196430/38/8105/14329/60c806a4Ed506298a/e6de9fb7b8490f38.png" />
           <Avatar icon={<User />} />
           <Avatar
-            color={`${harmony() ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
-            background={`${harmony() ? '#ffd6e1' : 'var(--nutui-brand-2)'}`}
+            color={`${variableDisabled ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
+            background={`${variableDisabled ? '#ffd6e1' : 'var(--nutui-brand-2)'}`}
           >
             U
           </Avatar>
@@ -22,8 +23,8 @@ const Demo6 = () => {
           <Avatar src="https://img12.360buyimg.com/imagetools/jfs/t1/196430/38/8105/14329/60c806a4Ed506298a/e6de9fb7b8490f38.png" />
           <Avatar icon={<User />} />
           <Avatar
-            color={`${harmony() ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
-            background={`${harmony() ? '#ffd6e1' : 'var(--nutui-brand-2)'}`}
+            color={`${variableDisabled ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
+            background={`${variableDisabled ? '#ffd6e1' : 'var(--nutui-brand-2)'}`}
           >
             U
           </Avatar>

src/packages/avatar/demos/taro/demo7.tsx

@@ -1,16 +1,17 @@
 import React from 'react'
-import { Avatar, Cell, harmony } from '@nutui/nutui-react-taro'
+import { Avatar, Cell, harmony, td } from '@nutui/nutui-react-taro'
 import { User } from '@nutui/icons-react-taro'
 
 const Demo7 = () => {
+  const variableDisabled = harmony() || td()
   return (
     <Cell className="cell-avatar">
       <Avatar.Group max="3" level="right" maxContent="...">
         <Avatar src="https://img12.360buyimg.com/imagetools/jfs/t1/196430/38/8105/14329/60c806a4Ed506298a/e6de9fb7b8490f38.png" />
         <Avatar icon={<User />} />
         <Avatar
-          color={`${harmony() ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
-          background={`${harmony() ? '#ffd6e1' : 'var(--nutui-brand-2)'}`}
+          color={`${variableDisabled ? '#ff0f23' : 'var(--nutui-color-primary)'}`}
+          background={`${variableDisabled ? '#ffd6e1' : 'var(--nutui-brand-2)'}`}
         >
           U
         </Avatar>

src/packages/button/button.scss

@@ -2,10 +2,10 @@
   position: relative;
   display: flex;
   display: inline-block;
-  /* #ifdef harmony*/
+  /* #ifdef harmony dynamic*/
   width: 80px;
   /* #endif */
-  /* #ifndef harmony*/
+  /* #ifndef harmony dynamic*/
   width: auto;
   /* #endif */
   flex-direction: row;
@@ -72,7 +72,7 @@
     flex-direction: row;
     align-items: center;
     justify-content: center;
-    /* #ifndef harmony */
+    /* #ifndef harmony dynamic*/
     background: initial;
     /* #endif */
     .nut-icon {

src/packages/collapseitem/collapseitem.scss

@@ -38,10 +38,10 @@
       left: 16px;
       bottom: 0;
       border-bottom: $collapse-item-header-border-bottom;
-      /* #ifdef harmony */
+      /* #ifdef harmony dynamic*/
       transform: scale(1, 1);
       /* #endif */
-      /* #ifndef harmony */
+      /* #ifndef harmony dynamic*/
       transform: scale(1, 0.5);
       /* #endif */
     }

src/packages/dialog/dialog.scss

@@ -8,7 +8,7 @@
   align-items: center;
   width: $dialog-width;
   min-width: $dialog-min-width;
-  /* #ifndef harmony*/
+  /* #ifndef harmony dynamic*/
   max-height: 67%;
   /* #endif */
   min-height: $dialog-min-height;

src/packages/icon/demos/h5/demo6.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import { IconFontConfig, IconFont } from '@nutui/icons-react'
-import { Cell, Toast, camelCase } from '@nutui/nutui-react'
+import { Cell, Toast } from '@nutui/nutui-react'
+import { camelCase } from '../camel-case'
 
 const generateCopyText = (name: string) => {
   return `<${camelCase(name, { pascalCase: true })} />`

src/packages/icon/demos/h5/demo7.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import { IconFontConfig, IconFont } from '@nutui/icons-react'
-import { Cell, Toast, camelCase } from '@nutui/nutui-react'
+import { Cell, Toast } from '@nutui/nutui-react'
+import { camelCase } from '../camel-case'
 
 const generateAMCopyText = (icon: any) => {
   return `<${camelCase(icon.name, {

src/packages/icon/demos/taro/demo6.tsx

@@ -1,7 +1,8 @@
 import React, { useState } from 'react'
 import * as iconfonts from '@nutui/icons-react-taro'
-import { Cell, Toast, camelCase } from '@nutui/nutui-react-taro'
+import { Cell, Toast } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
+import { camelCase } from '../camel-case'
 
 const Demo6 = () => {
   const generateCopyText = (name: string) => {

src/packages/icon/demos/taro/demo7.tsx

@@ -1,7 +1,8 @@
 import React, { useState } from 'react'
 import * as iconfonts from '@nutui/icons-react-taro'
-import { Cell, Toast, camelCase } from '@nutui/nutui-react-taro'
+import { Cell, Toast } from '@nutui/nutui-react-taro'
 import { View } from '@tarojs/components'
+import { camelCase } from '../camel-case'
 
 const Demo7 = () => {
   const generateAMCopyText = (icon: any) => {

src/packages/indicator/demo.taro.tsx

@@ -44,19 +44,14 @@ const IndicatorDemo = () => {
       <ScrollView className={`demo ${Taro.getEnv() === 'WEB' ? 'web' : ''}`}>
         <View className="h2">{translated.basic}</View>
         <Demo1 />
-
         <View className="h2">{translated.white}</View>
         <Demo5 />
-
         <View className="h2">{translated.type}</View>
         <Demo6 />
-
         <View className="h2">{translated.customNode}</View>
         <Demo2 />
-
         <View className="h2">{translated.custom}</View>
         <Demo3 />
-
         <View className="h2">{translated.vertical}</View>
         <Demo4 />
       </ScrollView>

src/packages/indicator/demos/taro/demo4.tsx

@@ -46,15 +46,7 @@ const Demo4 = () => {
         />
       </Cell>
       <Cell style={{ background: '#C2C4CC' }}>
-        <Indicator
-          total={6}
-          current={2}
-          direction="vertical"
-          color="default"
-          style={{
-            marginLeft: pxTransform(50),
-          }}
-        />
+        <Indicator total={6} current={2} direction="vertical" color="default" />
       </Cell>
     </>
   )

src/packages/loading/loading.taro.tsx

@@ -20,10 +20,7 @@ const defaultProps = {
   type: 'circular',
   direction: 'horizontal',
 } as TaroLoadingProps
-const defaultLottieProps = {
-  loop: true,
-  autoplay: true,
-}
+
 export const Loading = React.forwardRef<LoadingRef, Partial<TaroLoadingProps>>(
   (props, ref) => {
     const { className, style, children, direction, icon, ...rest } = {

src/packages/numberkeyboard/numberkeyboard.scss

@@ -50,10 +50,10 @@
     &-wrapper {
       position: relative;
       flex: 1;
-      /* #ifdef harmony */
+      /* #ifdef harmony dynamic*/
       width: 33%;
       /* #endif */
-      /* #ifndef harmony */
+      /* #ifndef harmony dynamic*/
       flex-basis: 33%;
       /* #endif */
       box-sizing: border-box;

src/packages/pagination/demos/taro/demo5.tsx

@@ -1,5 +1,5 @@
 import React, { useState } from 'react'
-import { View } from '@tarojs/components'
+import { Text } from '@tarojs/components'
 import { Pagination } from '@nutui/nutui-react-taro'
 import { ArrowLeft, ArrowRight } from '@nutui/icons-react-taro'
 
@@ -11,9 +11,9 @@ const Demo5 = () => {
   }
   const itemRender = (page: any, current: number) => {
     return (
-      <View style={{ color: current === page.number ? '#fff' : '#ff0f23' }}>
+      <Text style={{ color: current === page.number ? '#fff' : '#ff0f23' }}>
         {page.number === 3 ? 'hot' : page.text}
-      </View>
+      </Text>
     )
   }
   return (

src/packages/pagination/pagination.taro.tsx

@@ -1,6 +1,6 @@
 import React, { FunctionComponent } from 'react'
 import classNames from 'classnames'
-import { View } from '@tarojs/components'
+import { View, Text } from '@tarojs/components'
 import { useConfig } from '@/packages/configprovider/index.taro'
 import { usePropsValue } from '@/hooks/use-props-value'
 import { ComponentDefaults } from '@/utils/typings'
@@ -134,9 +134,9 @@ export const Pagination: FunctionComponent<
       )}
       {mode === 'lite' && (
         <View className={`${classPrefix}-lite`}>
-          <View className={`${classPrefix}-lite-active`}>{current}</View>
-          <View className={`${classPrefix}-lite-spliterator`}>/</View>
-          <View className={`${classPrefix}-lite-default`}>{pageCount}</View>
+          <Text className={`${classPrefix}-lite-active`}>{current}</Text>
+          <Text className={`${classPrefix}-lite-spliterator`}>/</Text>
+          <Text className={`${classPrefix}-lite-default`}>{pageCount}</Text>
         </View>
       )}
     </View>

src/packages/skeleton/demos/taro/demo4.tsx

@@ -1,11 +1,12 @@
 import React from 'react'
 import { Cell, Skeleton, pxTransform } from '@nutui/nutui-react-taro'
+import { View } from '@tarojs/components'
 
 const Demo4 = () => {
   return (
     <Cell>
       <Skeleton width={pxTransform(132)} height={pxTransform(132)} />
-      <div
+      <View
         style={{
           display: 'flex',
           flexGrow: 1,
@@ -16,7 +17,7 @@ const Demo4 = () => {
         <Skeleton size="large" style={{ marginBottom: pxTransform(5) }} />
         <Skeleton width="30%" style={{ marginBottom: pxTransform(5) }} />
         <Skeleton width="80%" size="small" rows={3} />
-      </div>
+      </View>
     </Cell>
   )
 }

src/packages/steps/steps.scss

@@ -181,7 +181,7 @@
 
   // 纵向滚动条
   &-vertical {
-    /* #ifdef harmony*/
+    /* #ifdef harmony dynamic*/
     flex: 1;
     min-width: 0;
     /* #endif */

src/packages/tabbaritem/tabbaritem.scss

@@ -13,10 +13,10 @@
     width: 24px;
     height: 24px;
     font-size: 24px;
-    /* #ifdef harmony*/
+    /* #ifdef harmony dynamic*/
     color: $tabbar-inactive-color;
     /* #endif*/
-    /* #ifndef harmony*/
+    /* #ifndef harmony dynamic*/
     color: inherit;
     /* #endif*/
   }
@@ -54,10 +54,10 @@
 
     .nut-tabbar-item-text,
     .nut-icon {
-      /* #ifdef harmony*/
+      /* #ifdef harmony dynamic*/
       color: $tabbar-active-color;
       /* #endif*/
-      /* #ifndef harmony*/
+      /* #ifndef harmony dynamic*/
       color: inherit;
       /* #endif*/
     }

src/packages/tabs/tabs.scss

@@ -214,10 +214,10 @@
 .nut-tabs-vertical {
   .nut-tabs-ellipsis {
     white-space: break-spaces;
-    /* #ifdef harmony */
+    /* #ifdef harmony dynamic*/
     padding-left: 12px;
     /* #endif */
-    /* #ifndef harmony */
+    /* #ifndef harmony dynamic*/
     padding-left: 6px;
     /* #endif */
     width: 90px;

src/packages/toast/toast.scss

@@ -28,10 +28,10 @@
   }
 
   &-overlay-default-taro {
-    /* #ifdef harmony */
+    /* #ifdef harmony dynamic*/
     background-color: rgba(0, 0, 0, 0);
     /* #endif */
-    /* #ifndef harmony */
+    /* #ifndef harmony dynamic*/
     --nutui-overlay-bg-color: rgba(0, 0, 0, 0);
     /* #endif */
   }

src/utils/index.taro.ts

@@ -1,6 +1,5 @@
 export * from './taro/add-color-for-harmony'
 export * from './bound'
-export * from './camel-case'
 export * from './can-use-dom'
 export * from './clamp'
 export * from './date'

src/utils/index.ts

@@ -1,5 +1,4 @@
 export * from './bound'
-export * from './camel-case'
 export * from './can-use-dom'
 export * from './clamp'
 export * from './date'

src/utils/taro/platform.ts

@@ -12,3 +12,7 @@ export const web = () => {
 export const miniprogram = () => {
   return ['mini'].includes(getEnv().toLowerCase())
 }
+
+export const td = () => {
+  return ['dynamic'].includes(getEnv().toLowerCase())
+}