Merge branch 'dev'

Author: ChenlingasMx

.github/workflows/ci.yml

@@ -20,6 +20,7 @@ jobs:
 
       - run: yarn install
       - run: npm run build
+      - run: npm run test
       - run: npm run doc
       - run: rm -rf packages/docs/doc
       - run: mkdir -p packages/docs/doc

.github/workflows/pull_request.yml

@@ -17,6 +17,7 @@ jobs:
 
       - run: yarn install
       - run: npm run build
+      - run: npm run test
       - run: npm run doc
       - run: rm -rf packages/docs/doc
       - run: mkdir -p packages/docs/doc

example/examples/src/routes/TextArea/index.tsx

@@ -14,6 +14,7 @@ export default class TextAreaView extends Component<TextAreaProps> {
     value1: '只读状态不可输入',
     value3: '自定义输入框样式',
     value4: '',
+    value5: '',
   };
 
   render() {
@@ -35,6 +36,16 @@ export default class TextAreaView extends Component<TextAreaProps> {
                 placeholder="默认提示语"
               />
             </Card>
+            <Card title="根据内容自动调整高度" style={styles.card}>
+              <TextArea
+                onChange={(value5: string) => {
+                  this.setState({value5});
+                }}
+                value={this.state.value5}
+                placeholder="默认提示语"
+                autoSize
+              />
+            </Card>
             <Card title="展示字数" style={styles.card}>
               <TextArea
                 onChange={(value4: string) => {

packages/core/src/Avatar/index.tsx

@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React from 'react';
 import { View, ViewProps, Image, ImageProps, StyleSheet } from 'react-native';
 
 const styles = StyleSheet.create({
@@ -36,31 +36,23 @@ export interface AvatarProps extends ViewProps {
   shape?: 'circle' | 'square';
 }
 
-export default class Avatar extends Component<AvatarProps> {
-  static defaultProps: AvatarProps = {
-    src: defaultImage,
-    shape: 'square',
-    rounded: 3,
-    size: 40,
-  };
-  render() {
-    const { style, src, size, shape, rounded, imageProps, ...otherProps } = this.props;
-    return (
-      <View
-        style={[
-          styles.defalut,
-          style,
-          { width: size, height: size },
-          { borderRadius: shape === 'circle' ? size! / 2 : rounded },
-        ]}
-        {...otherProps}
-      >
-        <Image
-          style={{ width: size, height: size }}
-          source={typeof src === 'number' ? src : { uri: src as string }}
-          {...imageProps}
-        />
-      </View>
-    );
-  }
+export default function Avatar(props: AvatarProps) {
+  const { style, src = defaultImage, size = 40, shape = 'square', rounded = 3, imageProps, ...otherProps } = props;
+  return (
+    <View
+      style={[
+        styles.defalut,
+        style,
+        { width: size, height: size },
+        { borderRadius: shape === 'circle' ? size! / 2 : rounded },
+      ]}
+      {...otherProps}
+    >
+      <Image
+        style={{ width: size, height: size }}
+        source={typeof src === 'number' ? src : { uri: src as string }}
+        {...imageProps}
+      />
+    </View>
+  );
 }

packages/core/src/Calendar/index.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from 'react';
-import { View, Text, ViewProps, StyleSheet, TouchableOpacity, Dimensions, Platform } from 'react-native';
+import { View, Text, ViewProps, TextProps, StyleSheet, TouchableOpacity, Dimensions, Platform } from 'react-native';
 import Icon from '../Icon';
 import Ellipsis from '../Ellipsis';
 import { getMonths, getWeeksArray, daysArrProps, getType, getNameLen } from './utils';
@@ -112,7 +112,7 @@ const Calendar = (props: CalendarProps) => {
 
       let nameLen = getNameLen(day.lunarHolidays);
       let lineHeight =
-        lunarHoliday === true && Platform.OS === 'ios' ? 0 : lunarHoliday === true ? MainWidth < 1000 ? 18 : 55 : MainWidth < 1000 ? MainWidth / 7 - 4.5 : MainWidth / 14.5;
+        lunarHoliday === true && Platform.OS === 'ios' ? 0 : lunarHoliday === true ? 18 : MainWidth / 7 - 4.5;
       let paddingTop = lunarHoliday === true ? 4 : 0;
       let colorType = '';
       if (day.colorType === '') {
@@ -211,9 +211,9 @@ const Calendar = (props: CalendarProps) => {
     setCurrentMonth(toMonth);
     setCurrentDays(toDays);
   };
-  // const goCurrentDay = (day: number) => {
-  //   setCurrentDays(day);
-  // };
+  const goCurrentDay = (day: number) => {
+    setCurrentDays(day);
+  };
 
   return (
     <View style={{ flex: 1, position: 'relative' }}>
@@ -298,10 +298,10 @@ const styles = StyleSheet.create({
   },
   calendarWeekdays: {
     flexDirection: 'row',
-    justifyContent: 'space-around',
+    justifyContent: 'space-between',
     alignItems: 'center',
-    paddingHorizontal: MainWidth < 1000 ? MainWidth / 7 - 33 : MainWidth / 30,
-    paddingTop: 12,
+    paddingHorizontal: MainWidth / 7 - 33,
+    paddingTop: 10,
   },
   calendarWedText: {
     color: '#616161',
@@ -312,12 +312,12 @@ const styles = StyleSheet.create({
   },
   weekDay: {
     flexDirection: 'row',
-    paddingHorizontal: 22,
+    paddingHorizontal: 2,
   },
   dateBase: {
-    marginHorizontal: 8,
-    width: MainWidth < 1000 ? MainWidth / 7 - 4.5 : MainWidth / 14,
-    height: MainHeight < 300 ? MainWidth / 7 - 4.5 : MainWidth / 14,
+    marginHorizontal: 2,
+    width: MainWidth / 7 - 4.5,
+    height: MainWidth / 7 - 4.5,
     ...Platform.select({
       ios: {},
       android: {
@@ -327,15 +327,15 @@ const styles = StyleSheet.create({
   },
   currentMonth: {
     backgroundColor: '#329BCB',
-    borderRadius: 60,
+    borderRadius: 50,
   },
   selectMonth: {
     borderWidth: 1,
     borderColor: '#329BCB',
-    borderRadius: 60,
+    borderRadius: 50,
   },
   otherMonth: {
-    borderRadius: 60,
+    borderRadius: 50,
   },
   dayText: {
     textAlign: 'center',

packages/core/src/CardCollapse/README.md

@@ -56,44 +56,14 @@ export default Demo
 
 ### Props
 
-```ts
-type CardCollapseProps = ViewProps & {
-  /**
-    * 是否折叠
-    */
-  isCollapsed: boolean;
-  /**
-   * 渲染的内容
-   */
-  children: JSX.Element | JSX.Element[]
-  /**
-   * 外层样式
-   */
-  containerStyle?: StyleProp<ViewStyle>;
-  /**
-   * 内容样式
-   */
-  contentContainerStyle?: StyleProp<ViewStyle>;
-  /**
-   * 卡片圆角
-   */
-  itemBorderRadius?: number;
-  /**
-   * 点击卡片回调
-   */
-  onItemPress?: (index: number) => void;
-  /**
-   * 卡片折叠回调（值是未来折叠状态）
-   */
-  onCollapseWillChange?: (changed: boolean) => void;
-  /**
-   * 卡片折叠回调（值是目前状态）
-   */
-  onCollapseChanged?: (changed: boolean) => void;
-  /**
-   * 卡片是否可以点击
-   */
-  disablePresses?: boolean;
-};
-```
-
+| 参数 | 说明 | 类型 | 默认值 |
+|------|------|-----|------|
+| `isCollapsed` | 是否折叠 | `boolean` | - |
+| `children` | 渲染的内容 | `JSX.Element, JSX.Element[]` | - |
+| `containerStyle` | 外层样式 | `StyleProp<ViewStyle>` | - |
+| `contentContainerStyle` | 内容样式 | `StyleProp<ViewStyle>` | - |
+| `itemBorderRadius` | 卡片圆角 | `number` | - |
+| `onItemPress` | 点击卡片回调 | (`index: number) => void` | - |
+| `onCollapseWillChange` | 卡片折叠回调（值是未来折叠状态） | `(changed: boolean) => void` | - |
+| `onCollapseChanged` | 卡片折叠回调（值是目前状态） | `(changed: boolean) => void` | - |
+| `disablePresses` | 卡片是否可以点击 | `boolean` | - |

packages/core/src/ImageViewer/README.md

@@ -62,15 +62,11 @@ export default Demo
 
 ### props
 
-```ts
-export interface ImageViewerProps extends ViewProps {
-  /** 图片宽度 */
-  width?: number,
-  /** 图片高度 */
-  height?: number,
-  /** 图像源（远程URL或本地文件资源 */
-  src?: string | number;
-  /** 默认展示第几张图片 */
-  defaultIndex: number
-}
-```
+组件继承 [`ViewProps`](https://reactnative.dev/docs/view)
+
+| 参数 | 说明 | 类型 | 默认值 |
+|------|------|-----|------|
+| `width` | 图片宽度 | `number` | - |
+| `height` | 图片高度 | `number` | - |
+| `src` | 图像源（远程URL或本地文件资源) | `'string' \| 'number'` | - |
+| `defaultIndex` | 默认展示第几张图片 | `number` | - |

packages/core/src/NoticeBar/index.tsx

@@ -40,7 +40,7 @@ const NoticeBar = (props: NoticeBarProps) => {
     operationDom = <View style={styles.actionWrap}>{action ? action : <Text style={[styles.link]}>∟</Text>}</View>;
   }
   const main = (
-    <View style={[styles.notice, style]}>
+    <View style={[styles.notice, style]} testID="RNE__NoticeBar__style">
       {icon && <View style={styles.left15}>{icon}</View>}
       <View style={[styles.container, icon ? styles.left6 : styles.left15]}>
         <Marquee style={[styles.content, textStyle]} text={children} {...marqueeProps} />
@@ -54,7 +54,7 @@ const NoticeBar = (props: NoticeBarProps) => {
         mode === 'closable' ? (
           main
         ) : (
-          <TouchableWithoutFeedback onPress={onPress}>{main}</TouchableWithoutFeedback>
+          <TouchableWithoutFeedback onPress={onPress} testID="RNE__NoticeBar__link" >{main}</TouchableWithoutFeedback>
         )
       ) : null}
     </View>

packages/core/src/Picker/README.md

@@ -61,45 +61,16 @@ function Demo() {
 export default Demo
 ```
 
-
-
 ### Props
 
-```ts
-import { StyleProp, TextStyle, ViewStyle } from 'react-native';
-
-export interface PickerData {
-  label?: string,
-  render?: (key: string, record: PickerData, index: number)=>React.ReactNode,
-  [key: string]: any
-}
+属性 | 说明 | 类型 | 默认值
+----|-----|------|------
+| lines   | 显示行数   | number |  3  |
+| rowKey    | 在开始位置设置图标  |  string | - |
+| data   | 需要渲染的数据   | Array |  -  |
+| containerStyle   | item 容器样式   | obj |  -  |
+| textStyle    | 容器的文本样式  | TextStyle | -  |
+| value | 选中当前项的下标   | number | -  |
+| onChange | value 改变时触发       | fn | -  |
+| readonly | 是否只读  | fn | -  |
 
-export interface PickerProps {
-  /** 显示几行, 默认 3 */
-  lines?: number,
-  /** 指定需要显示的 key, 默认使用 data 的 label 属性 */
-  rowKey?: string,
-  /** 需要渲染的数据 */
-  data?: Array<PickerData>,
-  /** item 容器样式 */
-  containerStyle?: {
-    /** 激活的容器样式 */
-    actived?: StyleProp<ViewStyle>,
-    /** 未激活的容器样式 */
-    unactived?: StyleProp<ViewStyle>,
-  },
-  /** 容器的文本样式 */
-  textStyle?: {
-    /** 激活的文本样式 */
-    actived?: StyleProp<TextStyle>,
-    /** 未激活的文本样式 */
-    unactived?: StyleProp<TextStyle>,
-  },
-  /** 选中当前项的下标 */
-  value?: number,
-  /** value 改变时触发 */
-  onChange?: (value: number)=>unknown,
-  /** 是否只读 不能点击不能滑动但可以通过value控制 */
-  readonly?: boolean
-}
-```