Merge pull request #494 from hy916/dev

ChenlingasMx · web-flow · commit 81e30926208b · 2023-02-16T09:15:26.000+08:00
fix:优化组件和文档添加测试用例
diff --git a/packages/core/src/Calendar/index.tsx b/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',
diff --git a/packages/core/src/NoticeBar/index.tsx b/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>
diff --git a/packages/core/src/Picker/README.md b/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
-}
-```
diff --git a/packages/core/src/SwipeAction/README.md b/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 = [
diff --git a/test-ci/src/__tests__/noticeBar.tsx b/test-ci/src/__tests__/noticeBar.tsx
@@ -44,30 +44,30 @@ describe('NoticeBar', () => {
     expect(component.props.style).toMatchObject({ fontSize: 12 });
   });
 
-  // it('onPress', () => {
-  //   const fn = jest.fn();
-  //   const { getByTestId } = render(<NoticeBar onPress={fn}>onPress</NoticeBar>);
-  //   const component = getByTestId('RNE__NoticeBar__wrap');
-  //   fireEvent(component, 'press');
-  //   expect(fn).toHaveBeenCalled();
-  // });
+  it('textStyle', () => {
+    const { UNSAFE_getByType } = render(<NoticeBar textStyle={{ fontSize: 20 }} />);
+    const component = UNSAFE_getByType(Marquee);
+    expect(component.props.style[1].fontSize).toBe(20);
+  });
+
+  it('onPress events', () => {
+    const fn = jest.fn();
+    const { getByTestId } = render(<NoticeBar mode="link" onPress={fn}>onPress</NoticeBar>);
+    const component = getByTestId('RNE__NoticeBar__link');
+    fireEvent(component, 'press');
+    expect(fn).toHaveBeenCalled();
+  });
 
-  // it('action', () => {
-  //   const { getByText } = render(<NoticeBar action={<Text>去看看</Text>} />);
-  //   expect(getByText('去看看')).toBeTruthy();
-  // });
+  it('action', () => {
+    const { getByText } = render(<NoticeBar mode="closable" action={<Text>去看看</Text>} />);
+    expect(getByText('去看看')).toBeTruthy();
+  });
 
-  // it('style', () => {
-  //   const { getByTestId } = render(<NoticeBar style={{ height: 50 }} />);
-  //   const component = getByTestId('RNE__NoticeBar__wrap');
-  //   const styles = toObject(component.props.style);
-  //   expect(styles.height).toBe(50);
-  // });
+  it('style', () => {
+    const { getByTestId } = render(<NoticeBar mode="closable" style={{ height: 50 }} />);
+    const component = getByTestId('RNE__NoticeBar__style');
+    const styles = toObject(component.props.style);
+    expect(styles.height).toBe(50);
+  });
 
-  // it('textStyle', () => {
-  //   const { getByTestId } = render(<NoticeBar textStyle={{ fontSize: 20 }} />);
-  //   const component = getByTestId('RNE__NoticeBar__div');
-  //   const styles = toObject(component.props.style);
-  //   expect(styles.fontSize).toBe(20);
-  // });
 });
diff --git a/website/src/component/Preview/index.js b/website/src/component/Preview/index.js
@@ -28,12 +28,7 @@ const Markdown = styled(MarkdownPreview)`
 const getBooleanValue = (param, field, defaultValue) => {
   if (Reflect.has(param, field)) {
     const newValue = Reflect.get(param, field);
-    if (newValue === 'true') {
-      return true;
-    }
-    if (newValue === 'false') {
-      return false;
-    }
+    return newValue === 'true';
   }
   return defaultValue;
 };
