Merge branch 'dev' of https://github.com/uiwjs/react-native-uiw into dev

Author: ChenlingasMx

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/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/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
-}
-```

packages/core/src/SpeedDial/README.md

@@ -24,7 +24,7 @@ function Demo() {
         children={[
           {
             icon: 'plus',
-            title: <Text>'Add'</Text>,
+            title: <Text>Add</Text>,
             onPress:()=>console.log('Add')
           },
           {
@@ -47,57 +47,28 @@ function Demo() {
 export default Demo
 ```
 
+### Props
 
-### SpeedDial Props
+| 参数 | 说明 | 类型 | 默认值|
+|------|------|-----|------|
+| `icon` | 显示的图标 | `string` | `plus` \| `close` |
+| `style` | 盒子样式  | `string` | - |
+| `bottom` | 初始距离下边位置 | `number` | 350 |
+| `right` | 初始距离右边位置 | `number`  | 40 |
+| `children` | 展开显示的标记 | Array<`SpeedDialItemProps`> | - |
+| `isDrag` | 是否支持拖拽 | `boolean` | `false` |
+| `transitionDuration` | 动画时间 | `number` | 200 |
+| `onOpen` | 打开时触发  | Function | - |
+| `onClose` | 关闭时触发 | Function | - |
 
-```ts
-import { ViewStyle,ViewProps } from 'react-native';
-import { icoType,SpeedDialItemProps } from '@uiw/react-native';
-
-export interface SpeedDialProps extends ViewProps {
-  /** 显示的图标 [默认显示, 展开显示] */
-  icon?: icoType,
-  /** 盒子样式 */
-  style?: ViewStyle,
-  /** 初始距离下边位置 */
-  bottom?: number,   //
-  /** 初始距离右边位置 */
-  right?: number,   //
-  /** 展开显示的标记 */
-  children?: Array<SpeedDialItemProps>,
-  /** 是否支持拖拽 */
-  isDrag?: boolean,
-  /** 动画时间 */
-  transitionDuration?: number,
-  /**
-  * 打开时触发
-  */
-  onOpen?: Function,
-  /**
-  * 关闭时触发
-  */
-  onClose?: Function,
-}
-```
 
+### SpeedDialItemProps
 
-### SpeedDialItem Props
+| 参数 | 说明 | 类型 | 默认值|
+|------|------|-----|------|
+| `icon` | 右边显示的图标 | `string` | - |
+| `title` | 左边文字  | `JSX.Element` \| `string` \| `number` | - |
+| `titleStyle` | 左边文字盒子样式 | ViewStyle | - |
+| `iconStyle` | 右边图标盒子样式 | ViewStyle  | - |
+| `onPress` | 点击右边时触发 | Function | - |
 
-```ts
-import { TabsItemIconTypes,IconsName } from '@uiw/react-native';
-
-export interface SpeedDialItemProps {
-  /** 右边 显示的图标 */
-  icon: TabsItemIconTypes,
-  /** 左边文字 */
-  title: JSX.Element | string | number,
-  /** 左边文字盒子样式 */
-  titleStyle?: ViewStyle,
-  /** 右边图标盒子样式 */
-  iconStyle?: ViewStyle,
-  /**
-   * 点击右边时触发
-   */
-  onPress?: Function,
-}
-```

packages/core/src/SwipeAction/README.md

@@ -101,6 +101,36 @@ import React,{ useRef } from 'react';
 import {SwipeAction} from '@uiw/react-native';
 import { View,Text } from 'react-native'
 
+function Demo() {
+  const ref = useRef()
+  const right = [
+    {
+      text: '查看',
+      color: 'orange',
+      x: 250,
+    },
+    {
+      text: '删除',
+      color: 'red',
+      x: 250,
+    },
+  ];
+  return (
+    <SwipeAction ref={ref} buttonWidth={60} right={right}>
+      <View><Text>滑动</Text></View>
+    </SwipeAction>
+  );
+}
+export default Demo;
+```
+
+### 禁用
+
+```jsx
+import React,{ useRef } from 'react';
+import {SwipeAction} from '@uiw/react-native';
+import { View,Text } from 'react-native'
+
 function Demo() {
   const ref = useRef()
   const right = [

packages/core/src/TextArea/README.md

@@ -112,6 +112,29 @@ function Demo() {
 export default Demo
 ```
 
+### 根据内容自动调整高度
+
+```jsx  mdx:preview
+import React, { useState } from 'react';
+import TextArea from '@uiw/react-native/lib/TextArea';
+
+function Demo() {
+  const [value, setValue] = useState('')
+
+  return (
+    <TextArea
+      value={value}
+      onChange={(value) => {
+        setValue(value);
+      }}
+      placeholder='请输入'
+      autoSize
+    />
+  )
+}
+export default Demo
+```
+
 ### 自定义输入框样式
 ```jsx  mdx:preview
 import React, { useState } from 'react';