taro-ui 3.3.2 → 3.4.0

package/rn/components/curtain/index.tsx

@@ -20,13 +20,13 @@ export default class AtCurtain extends React.Component<AtCurtainProps> {
     const curtainClass = classNames(
       {
         'at-curtain': true,
-        'at-curtain--closed': !isOpened,
+        'at-curtain--closed': !isOpened
       },
-      className,
+      className
     )
     const btnCloseClass = classNames({
       'at-curtain__btn-close': true,
-      [`at-curtain__btn-close--${closeBtnPosition}`]: closeBtnPosition,
+      [`at-curtain__btn-close--${closeBtnPosition}`]: closeBtnPosition
     })
 
     return (
@@ -63,7 +63,7 @@ AtCurtain.defaultProps = {
   isOpened: false,
   closeBtnPosition: 'bottom',
   // eslint-disable-next-line @typescript-eslint/no-empty-function
-  onClose: (): void => {},
+  onClose: (): void => {}
 }
 
 AtCurtain.propTypes = {
@@ -71,5 +71,5 @@ AtCurtain.propTypes = {
   className: PropTypes.oneOfType([PropTypes.array, PropTypes.string]),
   isOpened: PropTypes.bool,
   closeBtnPosition: PropTypes.string,
-  onClose: PropTypes.func,
+  onClose: PropTypes.func
 }

package/rn/components/flex/index.scss

@@ -1,5 +1,5 @@
-@import "../../style/mixins/index.scss";
-@import "../../style/theme/default.scss";
+@import '../../style/mixins/index.scss';
+@import '../../style/theme/default.scss';
 
 .at-row {
   @include display-flex();

package/rn/components/flex/item/index.scss

@@ -1,5 +1,5 @@
-@import "../../../style/mixins/index.scss";
-@import "../../../style/theme/default.scss";
+@import '../../../style/mixins/index.scss';
+@import '../../../style/theme/default.scss';
 
 .at-col {
   @include flex(1);

package/rn/components/grid/index.tsx

@@ -16,7 +16,7 @@ export default class AtGrid extends React.Component<AtGridProps> {
     item: AtGridItem,
     index: number,
     row: number,
-    event: CommonEvent,
+    event: CommonEvent
   ): void => {
     const { onClick, columnNum = 3 } = this.props
     if (typeof onClick === 'function') {
@@ -37,8 +37,8 @@ export default class AtGrid extends React.Component<AtGridProps> {
     const bodyClass = classNames(
       ['at-grid__flex-item', 'at-grid-item', `at-grid-item--${mode}`],
       {
-        'at-grid-item--no-border': !hasBorder,
-      },
+        'at-grid-item--no-border': !hasBorder
+      }
     )
     return (
       <View className={classNames('at-grid', this.props.className)}>
@@ -51,11 +51,11 @@ export default class AtGrid extends React.Component<AtGridProps> {
                   'at-grid-item--last': index === columnNum - 1,
                   'at-grid__flex--last-child':
                     item.length !== columnNum ||
-                    (item.length === columnNum && gridGroup.length - 1 === i),
+                    (item.length === columnNum && gridGroup.length - 1 === i)
                 })}
                 onClick={this.handleClick.bind(this, childItem, index, i)}
                 style={{
-                  width: `${100 / columnNum}%`,
+                  width: `${100 / columnNum}%`
                 }}
               >
                 <View className={`at-grid-item__content--${mode}`}></View>
@@ -63,7 +63,7 @@ export default class AtGrid extends React.Component<AtGridProps> {
                   <View
                     className={classNames(
                       'at-grid-item__content-inner',
-                      `at-grid-item__content-inner--${mode}`,
+                      `at-grid-item__content-inner--${mode}`
                     )}
                   >
                     <View className='content-inner__icon'>
@@ -71,7 +71,7 @@ export default class AtGrid extends React.Component<AtGridProps> {
                         <Image
                           className={classNames(
                             'content-inner__img',
-                            `at-grid-item__content--${mode}__img`,
+                            `at-grid-item__content--${mode}__img`
                           )}
                           src={childItem.image}
                           mode='aspectFit'
@@ -84,10 +84,10 @@ export default class AtGrid extends React.Component<AtGridProps> {
                             {},
                             {
                               color: childItem.iconInfo.color,
-                              fontSize: `${childItem.iconInfo.size || 24}px`,
+                              fontSize: `${childItem.iconInfo.size || 24}px`
                             },
                             // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                            childItem.iconInfo!.customStyle!,
+                            childItem.iconInfo!.customStyle!
                           )}
                         />
                         // <Text
@@ -115,7 +115,7 @@ export default class AtGrid extends React.Component<AtGridProps> {
                     <Text
                       className={classNames(
                         'content-inner__text',
-                        `content-inner__text--${mode}`,
+                        `content-inner__text--${mode}`
                       )}
                     >
                       {childItem.value}
@@ -135,7 +135,7 @@ AtGrid.defaultProps = {
   data: [],
   columnNum: 3,
   mode: 'square',
-  hasBorder: true,
+  hasBorder: true
 }
 
 AtGrid.propTypes = {
@@ -153,8 +153,8 @@ AtGrid.propTypes = {
         color: PropTypes.string,
         prefixClass: PropTypes.string,
         customStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
-        className: PropTypes.oneOfType([PropTypes.array, PropTypes.string]),
-      }),
-    }),
-  ),
+        className: PropTypes.oneOfType([PropTypes.array, PropTypes.string])
+      })
+    })
+  )
 }

package/rn/components/icon/index.tsx

@@ -34,13 +34,13 @@ export default class AtIcon extends React.Component<AtIconProps> {
       width: _fontSize,
       height: _fontSize,
       // tips: 字体转换的 svg 需要沿着 Y 轴旋转 180 度
-      transform: [{ rotateY: '180deg' }],
+      transform: [{ rotateY: '180deg' }]
     }
 
     return React.createElement(ICONS[value] || ((): any => null), {
       // 图标色值优先级
       fill: color || (customStyle as any).color || inputStyle.color || '',
-      style: Object.assign({}, inputStyle, customStyle, _style),
+      style: Object.assign({}, inputStyle, customStyle, _style)
     })
   }
 }
@@ -52,7 +52,7 @@ AtIcon.defaultProps = {
   prefixClass: 'at-icon',
   value: '',
   color: '',
-  size: '',
+  size: ''
 }
 
 AtIcon.propTypes = {
@@ -62,5 +62,5 @@ AtIcon.propTypes = {
   value: PropTypes.string,
   color: PropTypes.string,
   size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  onClick: PropTypes.func,
+  onClick: PropTypes.func
 }

package/rn/components/image-picker/index.tsx

@@ -16,7 +16,7 @@ interface MatrixFile extends Partial<File> {
 const generateMatrix = (
   files: MatrixFile[],
   col: number,
-  showAddBtn: boolean,
+  showAddBtn: boolean
 ): MatrixFile[][] => {
   const matrix: Array<MatrixFile>[] = []
   const length = showAddBtn ? files.length + 1 : files.length
@@ -70,7 +70,7 @@ export default class AtImagePicker extends React.Component<AtImagePickerProps> {
       .then(res => {
         const targetFiles = res.tempFilePaths.map((path, i) => ({
           url: path,
-          file: res[filePathName][i],
+          file: res[filePathName][i]
         }))
         const newFiles = files.concat(targetFiles)
         this.props.onChange(newFiles, 'add')
@@ -99,7 +99,7 @@ export default class AtImagePicker extends React.Component<AtImagePickerProps> {
       files,
       mode,
       length = 4,
-      showAddBtn = true,
+      showAddBtn = true
     } = this.props
     const rowLength = length <= 0 ? 1 : length
     // 行数
@@ -145,7 +145,7 @@ export default class AtImagePicker extends React.Component<AtImagePickerProps> {
                     </View>
                   )}
                 </View>
-              ),
+              )
             )}
           </View>
         ))}
@@ -163,7 +163,7 @@ AtImagePicker.defaultProps = {
   multiple: false,
   length: 4,
   // eslint-disable-next-line @typescript-eslint/no-empty-function
-  onChange: (): void => {},
+  onChange: (): void => {}
 }
 
 AtImagePicker.propTypes = {
@@ -183,7 +183,7 @@ AtImagePicker.propTypes = {
     'top left',
     'top right',
     'bottom left',
-    'bottom right',
+    'bottom right'
   ]),
   showAddBtn: PropTypes.bool,
   multiple: PropTypes.bool,
@@ -193,5 +193,5 @@ AtImagePicker.propTypes = {
   onFail: PropTypes.func,
   count: PropTypes.number,
   sizeType: PropTypes.array,
-  sourceType: PropTypes.array,
+  sourceType: PropTypes.array
 }

package/rn/components/pagination/index.tsx

@@ -31,7 +31,7 @@ export default class AtPagination extends React.Component<
     this.state = {
       currentPage: current || 1,
       maxPage,
-      pickerRange: createPickerRange(maxPage),
+      pickerRange: createPickerRange(maxPage)
     }
   }
 
@@ -64,7 +64,7 @@ export default class AtPagination extends React.Component<
     if (maxPage !== this.state.maxPage) {
       this.setState({
         maxPage,
-        pickerRange: createPickerRange(maxPage),
+        pickerRange: createPickerRange(maxPage)
       })
     }
     if (typeof current === 'number' && current !== this.state.currentPage) {
@@ -86,11 +86,11 @@ export default class AtPagination extends React.Component<
     const {
       icon,
       // pickerSelect,
-      customStyle,
+      customStyle
     } = this.props
     const {
       currentPage,
-      maxPage,
+      maxPage
       // pickerRange,
     } = this.state
 
@@ -100,7 +100,7 @@ export default class AtPagination extends React.Component<
     const nextDisabled = maxPage === MIN_MAXPAGE || currentPage === maxPage
 
     const classObject = {
-      'at-pagination--icon': icon,
+      'at-pagination--icon': icon
     }
 
     return (
@@ -175,7 +175,7 @@ AtPagination.defaultProps = {
   total: 0,
   pageSize: 20,
   icon: false,
-  customStyle: {},
+  customStyle: {}
 }
 
 AtPagination.propTypes = {
@@ -184,5 +184,5 @@ AtPagination.propTypes = {
   pageSize: PropTypes.number,
   icon: PropTypes.bool,
   customStyle: PropTypes.oneOfType([PropTypes.object, PropTypes.string]),
-  onPageChange: PropTypes.func,
+  onPageChange: PropTypes.func
 }

package/rn/components/progress/index.tsx

@@ -38,14 +38,14 @@ export default class AtProgress extends React.Component<AtProgressProps> {
     const rootClass = classNames(
       'at-progress',
       {
-        [`at-progress--${status}`]: !!status,
+        [`at-progress--${status}`]: !!status
       },
-      this.props.className,
+      this.props.className
     )
 
     const iconClass = classNames('at-progress__at-icon', {
       'at-progress__at-icon--error': status === 'error',
-      'at-progress__at-icon--success': status === 'success',
+      'at-progress__at-icon--success': status === 'success'
     })
 
     return (
@@ -77,7 +77,7 @@ export default class AtProgress extends React.Component<AtProgressProps> {
 }
 
 AtProgress.defaultProps = {
-  color: '#78A4F4',
+  color: '#78A4F4'
 }
 
 AtProgress.propTypes = {
@@ -85,5 +85,5 @@ AtProgress.propTypes = {
   status: PropTypes.string,
   percent: PropTypes.number,
   strokeWidth: PropTypes.number,
-  isHidePercent: PropTypes.bool,
+  isHidePercent: PropTypes.bool
 }

package/rn/components/radio/index.tsx

@@ -26,21 +26,21 @@ export default class AtRadio extends React.Component<AtRadioProps<any>> {
             onClick={this.handleClick.bind(this, option)}
             className={classNames({
               'at-radio__option': true,
-              'at-radio__option--disabled': option.disabled,
+              'at-radio__option--disabled': option.disabled
             })}
           >
             <View
               className={classNames({
                 'at-radio__option-wrap': true,
                 'at-radio__option-wrap--without-border':
-                  !border || options.length === index + 1,
+                  !border || options.length === index + 1
               })}
             >
               <View className='at-radio__option-container'>
                 <View
                   className={classNames({
                     'at-radio__title': true,
-                    'at-radio__title--disabled': option.disabled,
+                    'at-radio__title--disabled': option.disabled
                   })}
                 >
                   {option.label}
@@ -51,7 +51,7 @@ export default class AtRadio extends React.Component<AtRadioProps<any>> {
                       value='check'
                       className={classNames({
                         'at-radio__icon': true,
-                        'at-radio__at-icon': true,
+                        'at-radio__at-icon': true
                       })}
                     />
                   )}
@@ -61,7 +61,7 @@ export default class AtRadio extends React.Component<AtRadioProps<any>> {
                 <View
                   className={classNames({
                     'at-radio__desc': true,
-                    'at-radio__desc--disabled': option.disabled,
+                    'at-radio__desc--disabled': option.disabled
                   })}
                 >
                   {option.desc}
@@ -82,7 +82,7 @@ AtRadio.defaultProps = {
   border: true,
   options: [],
   // eslint-disable-next-line @typescript-eslint/no-empty-function
-  onClick: (): void => {},
+  onClick: (): void => {}
 }
 
 AtRadio.propTypes = {
@@ -90,5 +90,5 @@ AtRadio.propTypes = {
   className: PropTypes.oneOfType([PropTypes.array, PropTypes.string]),
   value: PropTypes.string,
   options: PropTypes.array,
-  onClick: PropTypes.func,
+  onClick: PropTypes.func
 }

package/rn/components/rate/index.tsx

@@ -22,11 +22,11 @@ export default class AtRate extends React.Component<AtRateProps> {
       value = 0,
       max = 5,
       size,
-      margin = 5,
+      margin = 5
     } = this.props
 
     const iconStyle = {
-      marginRight: Taro.pxTransform(margin),
+      marginRight: Taro.pxTransform(margin)
     }
     // const starIconStyle = {
     //   fontSize: size ? `${size}px` : ''
@@ -88,7 +88,7 @@ AtRate.defaultProps = {
   size: 20,
   value: 0,
   max: 5,
-  margin: 5,
+  margin: 5
 }
 
 AtRate.propTypes = {
@@ -98,5 +98,5 @@ AtRate.propTypes = {
   value: PropTypes.number,
   max: PropTypes.number,
   margin: PropTypes.number,
-  onChange: PropTypes.func,
+  onChange: PropTypes.func
 }

package/rn/components/segmented-control/index.tsx

@@ -25,15 +25,15 @@ export default class AtSegmentedControl extends React.Component<AtSegmentedContr
       selectedColor,
       current,
       color,
-      fontSize = 28,
+      fontSize = 28
     } = this.props
 
     const rootStyle: Record<string, string> = {}
     const itemStyle: Record<string, string> = {
-      fontSize: Taro.pxTransform(fontSize),
+      fontSize: Taro.pxTransform(fontSize)
     }
     const selectedItemStyle: Record<string, string> = {
-      fontSize: Taro.pxTransform(fontSize),
+      fontSize: Taro.pxTransform(fontSize)
     }
 
     if (selectedColor) {
@@ -55,9 +55,9 @@ export default class AtSegmentedControl extends React.Component<AtSegmentedContr
     const rootCls = classNames(
       'at-segmented-control',
       {
-        'at-segmented-control--disabled': disabled,
+        'at-segmented-control--disabled': disabled
       },
-      className,
+      className
     )
 
     return (
@@ -66,7 +66,7 @@ export default class AtSegmentedControl extends React.Component<AtSegmentedContr
           <View
             className={classNames('at-segmented-control__item', {
               'at-segmented-control__item--active': current === i,
-              'at-segmented-control__item--plus': i > 0,
+              'at-segmented-control__item--plus': i > 0
             })}
             style={current === i ? selectedItemStyle : itemStyle}
             key={value}
@@ -90,7 +90,7 @@ AtSegmentedControl.defaultProps = {
   selectedColor: '',
   values: [],
   // eslint-disable-next-line @typescript-eslint/no-empty-function
-  onClick: (): void => {},
+  onClick: (): void => {}
 }
 
 AtSegmentedControl.propTypes = {
@@ -101,5 +101,5 @@ AtSegmentedControl.propTypes = {
   fontSize: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
   disabled: PropTypes.bool,
   values: PropTypes.array,
-  onClick: PropTypes.func,
+  onClick: PropTypes.func
 }

package/rn/components/slider/index.tsx

@@ -16,14 +16,14 @@ export default class AtSlider extends React.Component<
     super(props)
     const { value = 0, min = 0, max = 100 } = props
     this.state = {
-      _value: AtSlider.clampNumber(value, min, max),
+      _value: AtSlider.clampNumber(value, min, max)
     }
   }
 
   protected static clampNumber(
     value: number,
     lower: number,
-    upper: number,
+    upper: number
   ): number {
     return Math.max(lower, Math.min(upper, value))
   }
@@ -47,7 +47,7 @@ export default class AtSlider extends React.Component<
   public UNSAFE_componentWillReceiveProps(props: AtSliderProps): void {
     const { value = 0, min = 0, max = 100 } = props
     this.setState({
-      _value: AtSlider.clampNumber(value, min, max),
+      _value: AtSlider.clampNumber(value, min, max)
     })
   }
 
@@ -64,23 +64,23 @@ export default class AtSlider extends React.Component<
       backgroundColor,
       blockSize,
       blockColor,
-      showValue,
+      showValue
     } = this.props
 
     return (
       <View
         className={classNames(
           {
-            'at-slider': true,
+            'at-slider': true
           },
-          className,
+          className
         )}
         style={customStyle}
       >
         <View
           className={classNames({
             'at-slider__inner': true,
-            'at-slider__inner--disabled': disabled,
+            'at-slider__inner--disabled': disabled
           })}
         >
           <Slider
@@ -115,7 +115,7 @@ AtSlider.defaultProps = {
   backgroundColor: '#e9e9e9',
   blockSize: 28,
   blockColor: '#ffffff',
-  showValue: false,
+  showValue: false
 }
 
 AtSlider.propTypes = {
@@ -132,5 +132,5 @@ AtSlider.propTypes = {
   blockColor: PropTypes.string,
   showValue: PropTypes.bool,
   onChange: PropTypes.func,
-  onChanging: PropTypes.func,
+  onChanging: PropTypes.func
 }

package/rn/components/steps/index.tsx

@@ -1,4 +1,4 @@
-/* eslint-disable @typescript-eslint/ban-ts-ignore */
+/* eslint-disable @typescript-eslint/ban-ts-comment */
 import classNames from 'classnames'
 import PropTypes, { InferProps } from 'prop-types'
 import React from 'react'
@@ -30,7 +30,7 @@ export default class AtSteps extends React.Component<AtStepsProps> {
                 className={classNames({
                   'at-steps__item': true,
                   'at-steps__item--active': active,
-                  'at-steps__item--inactive': inactive,
+                  'at-steps__item--inactive': inactive
                 })}
                 onClick={this.handleClick.bind(this, i)}
               >
@@ -53,7 +53,7 @@ export default class AtSteps extends React.Component<AtStepsProps> {
                         'at-steps__single-icon': true,
                         'at-steps__single-icon--success':
                           item.status === 'success',
-                        'at-steps__single-icon--error': item.status === 'error',
+                        'at-steps__single-icon--error': item.status === 'error'
                       })}
                       value={
                         item.status === 'success'
@@ -64,7 +64,7 @@ export default class AtSteps extends React.Component<AtStepsProps> {
                   ) : (
                     <View
                       className={classNames('at-steps__circular', {
-                        'at-steps__circular--active': active,
+                        'at-steps__circular--active': active
                       })}
                     >
                       {item.icon ? (
@@ -72,7 +72,7 @@ export default class AtSteps extends React.Component<AtStepsProps> {
                           className={classNames('at-icon', {
                             'at-steps__circle-icon': true,
                             'at-steps__circle-icon--active': active,
-                            'at-steps__circle-icon--inactive': inactive,
+                            'at-steps__circle-icon--inactive': inactive
                           })}
                           value={item.icon.value}
                         />
@@ -81,7 +81,7 @@ export default class AtSteps extends React.Component<AtStepsProps> {
                           className={classNames({
                             'at-steps__num': true,
                             'at-steps__item--text__active': active,
-                            'at-steps__item--inactive': inactive,
+                            'at-steps__item--inactive': inactive
                           })}
                         >
                           {i + 1}
@@ -121,7 +121,7 @@ AtSteps.defaultProps = {
   current: 0,
   items: [],
   // eslint-disable-next-line @typescript-eslint/no-empty-function
-  onChange: (): void => {},
+  onChange: (): void => {}
 }
 
 AtSteps.propTypes = {
@@ -129,5 +129,5 @@ AtSteps.propTypes = {
   className: PropTypes.oneOfType([PropTypes.array, PropTypes.string]),
   current: PropTypes.number,
   items: PropTypes.array,
-  onChange: PropTypes.func,
+  onChange: PropTypes.func
 }

package/rn/components/swipe-action/options/index.tsx

@@ -3,9 +3,7 @@ import React from 'react'
 import { View } from '@tarojs/components'
 import { AtSwipeActionOptionsProps } from '../../../../types/swipe-action'
 
-export default class AtSwipeActionOptions extends React.Component<
-  AtSwipeActionOptionsProps
-> {
+export default class AtSwipeActionOptions extends React.Component<AtSwipeActionOptionsProps> {
   public render(): JSX.Element {
     const rootClass = classNames(
       'at-swipe-action__options',

package/rn/components/switch/index.tsx

@@ -16,15 +16,8 @@ export default class AtSwitch extends React.Component<AtSwitchProps> {
   }
 
   public render(): JSX.Element {
-    const {
-      customStyle,
-      className,
-      disabled,
-      border,
-      title,
-      checked,
-      color
-    } = this.props
+    const { customStyle, className, disabled, border, title, checked, color } =
+      this.props
 
     const rootCls = classNames(
       'at-switch',