@tarojs/taro-rn 4.0.1 → 4.0.3-alpha.0

package/src/lib/openUrl/index.d.ts

@@ -1,24 +1,25 @@
 declare namespace Taro {
-	namespace OpenUrl {
-		interface Option {
-			/** 跳转链接 */
-			url: string
-			/** 接口调用结束的回调函数（调用成功、失败都会执行） */
-			complete?: (res: TaroGeneral.CallbackResult) => void
-			/** 接口调用失败的回调函数 */
-			fail?: (res: TaroGeneral.CallbackResult) => void
-			/** 接口调用成功的回调函数 */
-			success?: (res: TaroGeneral.CallbackResult) => void
-		}
-	}
-	/**
-	 * 由于 Expo 不支持原生的 SDK，所以无法通过集成原生的 SDK 的方式使用微信/支付宝支付。
-	 * 所以 RN 端提供了 `Taro.openUrl({url:''})`的 API 打开手机浏览器，然后走 [手机网站支付](https://docs.open.alipay.com/203/105288/) 的流程。
-	 * @param {Object} opts
-	 * @param {string} [opts.url] 跳转链接
-	 * @param {function} [opts.success] 接口调用成功的回调函数
-	 * @param {function} [opts.fail] 接口调用失败的回调函数
-	 * @param {function} [opts.complete] 接口调用结束的回调函数（调用成功、失败都会执行）
-	 */
-	function openUrl<T>(opts: Taro.OpenUrl.Option): Promise<T>
+  namespace OpenUrl {
+    interface Option {
+      /** 跳转链接 */
+      url: string
+      /** 接口调用结束的回调函数（调用成功、失败都会执行） */
+      complete?: (res: TaroGeneral.CallbackResult) => void
+      /** 接口调用失败的回调函数 */
+      fail?: (res: TaroGeneral.CallbackResult) => void
+      /** 接口调用成功的回调函数 */
+      success?: (res: TaroGeneral.CallbackResult) => void
+    }
+  }
+
+  /**
+   * 由于 Expo 不支持原生的 SDK，所以无法通过集成原生的 SDK 的方式使用微信/支付宝支付。
+   * 所以 RN 端提供了 `Taro.openUrl({url:''})`的 API 打开手机浏览器，然后走 [手机网站支付](https://docs.open.alipay.com/203/105288/) 的流程。
+   * @param {Object} opts
+   * @param {string} [opts.url] 跳转链接
+   * @param {function} [opts.success] 接口调用成功的回调函数
+   * @param {function} [opts.fail] 接口调用失败的回调函数
+   * @param {function} [opts.complete] 接口调用结束的回调函数（调用成功、失败都会执行）
+   */
+  function openUrl<T>(opts: Taro.OpenUrl.Option): Promise<T>
 }

package/src/lib/openUrl/index.ts

@@ -1,5 +1,6 @@
 import { Linking } from 'react-native'
-import { successHandler, errorHandler } from '../../utils'
+
+import { errorHandler, successHandler } from '../../utils'
 
 export async function openUrl <T>(opts: Taro.OpenUrl.Option): Promise<T> {
   const { url, success, fail, complete } = opts || {} as Taro.OpenUrl.Option

package/src/lib/permission.ts

@@ -1,5 +1,4 @@
-import { Linking, AppState, NativeEventSubscription } from 'react-native';
-import { getCameraPermissionsAsync, getMicrophonePermissionsAsync, requestCameraPermissionsAsync, requestMicrophonePermissionsAsync } from 'expo-camera'
+import { Camera } from 'expo-camera'
 import { getMediaLibraryPermissionsAsync, requestMediaLibraryPermissionsAsync } from 'expo-image-picker'
 import {
   getForegroundPermissionsAsync,
@@ -7,7 +6,16 @@ import {
   requestForegroundPermissionsAsync,
   // requestBackgroundPermissionsAsync
 } from 'expo-location'
-import { errorHandler, successHandler } from '../utils';
+import { AppState, Linking, NativeEventSubscription } from 'react-native'
+
+import { errorHandler, successHandler } from '../utils'
+
+const {
+  getCameraPermissionsAsync,
+  getMicrophonePermissionsAsync,
+  requestCameraPermissionsAsync,
+  requestMicrophonePermissionsAsync
+} = Camera
 
 const scopeMap = {
   'scope.userLocation': [getForegroundPermissionsAsync, requestForegroundPermissionsAsync],
@@ -27,7 +35,7 @@ let stateListener // 缓存监听函数
 let appStateSubscription: NativeEventSubscription | undefined
 
 const getAuthSetting = async () => {
-  let auths = {}
+  const auths = {}
 
   await Promise.all(Object.keys(scopeMap).map(async key => {
     const { granted } = await scopeMap[key][0]()
@@ -47,7 +55,7 @@ const handleAppStateChange = async (_nextAppState, resolve, reject, opts) => {
       res.errMsg = 'openSetting:ok'
       success?.(res)
       complete?.(res)
-  
+
       appStateSubscription?.remove()
       resolve(res)
     } catch (error) {
@@ -59,39 +67,39 @@ const handleAppStateChange = async (_nextAppState, resolve, reject, opts) => {
     }
   }
   // AppState.currentState = nextAppState;
-};
+}
 
 export async function authorize(opts: Taro.authorize.Option): Promise<TaroGeneral.CallbackResult> {
   const { scope, success, fail, complete } = opts
   const res: any = {}
 
-    try {
-      const { granted } = await scopeMap[scope][1]()
-      if (granted) {
-        res.errMsg = 'authorize:ok'
-        return successHandler(success, complete)(res)
-      } else {
-        res.errMsg = 'authorize:denied/undetermined'
-        return errorHandler(fail, complete)(res)
-      }
-    } catch (error) {
-      res.errMsg = 'authorize:fail'
+  try {
+    const { granted } = await scopeMap[scope][1]()
+    if (granted) {
+      res.errMsg = 'authorize:ok'
+      return successHandler(success, complete)(res)
+    } else {
+      res.errMsg = 'authorize:denied/undetermined'
       return errorHandler(fail, complete)(res)
     }
+  } catch (error) {
+    res.errMsg = 'authorize:fail'
+    return errorHandler(fail, complete)(res)
+  }
 }
 
 export async function getSetting(opts: Taro.getSetting.Option = {}): Promise<Taro.getSetting.SuccessCallbackResult> {
   const { success, fail, complete } = opts
   const res: any = {}
 
-    try {
-      res.authSetting = await getAuthSetting()
-      res.errMsg = 'getSetting:ok'
-      return successHandler(success, complete)(res)
-    } catch (error) {
-      res.errMsg = 'getSetting:fail'
-      return errorHandler(fail, complete)(res)
-    }
+  try {
+    res.authSetting = await getAuthSetting()
+    res.errMsg = 'getSetting:ok'
+    return successHandler(success, complete)(res)
+  } catch (error) {
+    res.errMsg = 'getSetting:fail'
+    return errorHandler(fail, complete)(res)
+  }
 }
 
 export function openSetting(opts: Taro.openSetting.Option = {}): Promise<Taro.openSetting.SuccessCallbackResult> {

package/src/lib/previewImage/index.tsx

@@ -1,9 +1,10 @@
 import React from 'react'
-import { View, ActivityIndicator, StyleSheet, Alert, Modal } from 'react-native'
-import RootSiblings from 'react-native-root-siblings'
+import { ActivityIndicator, Alert, Modal, StyleSheet, View } from 'react-native'
 import ImageViewer from 'react-native-image-zoom-viewer'
-import { saveMedia } from '../media'
+import RootSiblings from 'react-native-root-siblings'
+
 import { downloadFile } from '../file'
+import { saveMedia } from '../media'
 
 const styles = StyleSheet.create({
   mask: {

package/src/lib/removeStorageSync/index.ts

@@ -1 +1 @@
-export { removeStorageSync } from '../unsupportedApi'
+export { removeStorageSync } from '../unsupportedApi'

package/src/lib/request/index.ts

@@ -1,4 +1,4 @@
-import { errorHandler, successHandler } from "../../utils"
+import { errorHandler, successHandler } from '../../utils'
 
 function serializeParams(params) {
   if (!params) {
@@ -53,7 +53,7 @@ function _request<T = any>(options: Taro.request.Option): Taro.RequestTask<T> {
   params.method = method
   let controller
   // eslint-disable-next-line no-undef
-  if (typeof(AbortController) !== 'undefined' ) {
+  if (typeof (AbortController) !== 'undefined') {
     // eslint-disable-next-line no-undef
     controller = new AbortController()
     const signal = controller.signal

package/src/lib/scanCode/index.tsx

@@ -1,12 +1,13 @@
-import { initialWindowMetrics } from 'react-native-safe-area-context'
-import { Camera } from 'expo-camera'
 import { BarCodeScanner, requestPermissionsAsync } from 'expo-barcode-scanner'
-import { BackHandler, Image, TouchableOpacity, StyleSheet, View, Dimensions, Platform, StatusBar } from 'react-native'
-import iconClose from './icon_close.png'
-import iconPic from './icon_pic.png'
+import { BarcodeType, CameraView } from 'expo-camera'
+import React from 'react'
+import { BackHandler, Dimensions, Image, Platform, StatusBar, StyleSheet, TouchableOpacity, View } from 'react-native'
 import RootSiblings from 'react-native-root-siblings'
+import { initialWindowMetrics } from 'react-native-safe-area-context'
+
 import { chooseMedia, MEDIA_TYPE } from '../media'
-import React from 'react'
+import iconClose from './icon_close.png'
+import iconPic from './icon_pic.png'
 
 export let scannerView
 
@@ -47,13 +48,15 @@ function findKey (value:string, data, compare = (a, b) => a === b):string {
 
 const { width, height } = Dimensions.get('screen')
 
-function getBarCodeTypes(types:string[]):string[] {
-  const result:string[] = []
+function getBarCodeTypes(types:string[]): BarcodeType[] {
+  const result: BarcodeType[] = []
+
   for (const t of types) {
     result.push(...typeMap[t].map(type => {
       return BarCodeType[type]
     }))
   }
+
   return result.filter(r => !!r)
 }
 
@@ -143,25 +146,25 @@ function scanFromPhoto(callback, errorCallBack) {
         })
       }
     }
-  }, MEDIA_TYPE.IMAGES).catch(errorCallBack)
+  }, MEDIA_TYPE.Images).catch(errorCallBack)
 }
 
 export async function scanCode(option: Taro.scanCode.Option = {}): Promise<Taro.scanCode.SuccessCallbackResult> {
   const { success, fail, complete, onlyFromCamera, scanType = ['barCode', 'qrCode'] } = option
-  const { granted } = await requestPermissionsAsync();
+  const { granted } = await requestPermissionsAsync()
   if (!granted) {
     const res = { errMsg: 'Permissions denied!' }
     fail?.(res)
     complete?.(res)
     return Promise.reject(res)
   }
-  const barCodeTypes = getBarCodeTypes(scanType)
+  const barcodeTypes = getBarCodeTypes(scanType)
   return new Promise((resolve, reject) => {
     scannerView = new RootSiblings(
       (<View style={[styles.container]}>
         <StatusBar backgroundColor="rgba(0, 0, 0, 0)" translucent hidden={Platform.OS === 'ios'} />
-        <Camera
-          onBarCodeScanned={({ type, data }: {type: string, data: string}) => {
+        <CameraView
+          onBarcodeScanned={({ type, data }: {type: string, data: string}) => {
             const res = {
               charSet: 'UTF-8', // todo
               path: '', // todo
@@ -175,11 +178,10 @@ export async function scanCode(option: Taro.scanCode.Option = {}): Promise<Taro.
             hide(scannerView)
             resolve(res)
           }}
-          barCodeScannerSettings={{
-            barCodeTypes,
+          barcodeScannerSettings={{
+            barcodeTypes,
           }}
           style={{ width, height }}
-          ratio='16:9'
         />
         <TouchableOpacity accessibilityLabel="Close" style={styles.closeIcon} onPress={() => hide(scannerView)}>
           {safeViewWrapper(<Image source={iconClose} style={styles.closeImg}/>)}

package/src/lib/screen.ts

@@ -1,4 +1,5 @@
 import * as Brightness from 'expo-brightness'
+
 import { errorHandler, shouldBeObject, successHandler } from '../utils'
 
 /**

package/src/lib/setClipboardData/index.ts

@@ -1,6 +1,7 @@
 import Clipboard from '@react-native-clipboard/clipboard'
+
+import { errorHandler, successHandler } from '../../utils'
 import { showToast } from '../showModal/toast'
-import { successHandler, errorHandler } from '../../utils'
 
 export function setClipboardData(opts: Taro.setClipboardData.Option): Promise<Taro.setClipboardData.Promised> {
   const { data, success, fail, complete } = opts
@@ -18,7 +19,7 @@ export function setClipboardData(opts: Taro.setClipboardData.Option): Promise<Ta
     data,
   }
   showToast({
-    icon: "none",
+    icon: 'none',
     title: '内容已复制'
   })
   return successHandler(success, complete)(res)

package/src/lib/setKeepScreenOn/index.ts

@@ -1,5 +1,6 @@
 import { activateKeepAwake, deactivateKeepAwake } from 'expo-keep-awake'
-import { successHandler, errorHandler } from '../../utils'
+
+import { errorHandler, successHandler } from '../../utils'
 
 /**
  * keepScreenOn

package/src/lib/setStorage/index.ts

@@ -1,4 +1,5 @@
 import AsyncStorage from '@react-native-async-storage/async-storage'
+
 import { errorHandler, successHandler } from '../../utils'
 
 export async function setStorage(option: Taro.setStorage.Option): Promise<TaroGeneral.CallbackResult> {

package/src/lib/setStorageSync/index.ts

@@ -1 +1 @@
-export { setStorageSync } from '../unsupportedApi'
+export { setStorageSync } from '../unsupportedApi'

package/src/lib/showActionSheet/ActionSheet.tsx

@@ -1,19 +1,20 @@
-import React from 'react'
+import { ViewPropTypes } from 'deprecated-react-native-prop-types'
 import PropTypes from 'prop-types'
+import React from 'react'
 import {
-  View,
+  Platform,
+  StyleSheet,
   Text,
   TouchableHighlight,
-  StyleSheet,
-  Platform
+  View
 } from 'react-native'
-import { ViewPropTypes } from 'deprecated-react-native-prop-types'
-import { initialWindowMetrics } from 'react-native-safe-area-context';
+import { initialWindowMetrics } from 'react-native-safe-area-context'
+
 import { Popup } from '../Popup'
 import V from '../variable'
 
 const styles = StyleSheet.create({
-  iosActionsheet: {
+  actionsheet: {
     backgroundColor: V.weuiBgColorDefault
   },
   androidActionsheetWrapper: {
@@ -21,11 +22,6 @@ const styles = StyleSheet.create({
     alignItems: 'center',
     justifyContent: 'center'
   },
-  androidActionsheet: {
-    width: 274,
-    backgroundColor: V.weuiBgColorDefault,
-    borderRadius: V.weuiActionSheetAndroidBorderRadius
-  },
   actionsheetMenu: {
     backgroundColor: '#fff'
   },
@@ -36,29 +32,23 @@ const styles = StyleSheet.create({
   actionsheetCell: {
     borderTopWidth: StyleSheet.hairlineWidth,
     borderColor: V.weuiCellBorderColor,
-    borderStyle: 'solid'
-  },
-  iosActionsheetCell: {
+    borderStyle: 'solid',
     paddingTop: 10,
-    paddingBottom: 10
-  },
-  androidActionsheetCell: {
-    paddingTop: 13,
-    paddingBottom: 13,
+    paddingBottom: 10,
     paddingLeft: 24,
     paddingRight: 24
   },
+
   firstActionsheetCell: {
     borderTopWidth: 0
   },
-  iosActionsheetCellText: {
+  actionSheetCellText: {
     textAlign: 'center',
     fontSize: 18,
     marginTop: ((18 * V.baseLineHeight) - 18) / 2,
     marginBottom: ((18 * V.baseLineHeight) - 18) / 2
   },
   androidActionsheetCellText: {
-    textAlign: 'center',
     fontSize: 16,
     marginTop: ((16 * 1.4) - 16) / 2,
     marginBottom: ((16 * 1.4) - 16) / 2
@@ -105,7 +95,6 @@ const Index: React.FC<any> = ({
         underlayColor={underlayColor}
         style={[
           styles.actionsheetCell,
-          styles[`${_type}ActionsheetCell`],
           idx === 0 ? styles.firstActionsheetCell : {},
           btnStyle
         ]}
@@ -113,6 +102,8 @@ const Index: React.FC<any> = ({
       >
         <Text
           style={[
+
+            styles.actionSheetCellText,
             styles[`${_type}ActionsheetCellText`],
             styles[`${btnType}ActionsheetCellText`],
             textStyle
@@ -128,7 +119,6 @@ const Index: React.FC<any> = ({
         underlayColor={underlayColor}
         style={[
           styles.actionsheetCell,
-          styles[`${_type}ActionsheetCell`],
           idx === 0 ? styles.firstActionsheetCell : {},
           btnStyle
         ]}
@@ -136,6 +126,7 @@ const Index: React.FC<any> = ({
       >
         <Text
           style={[
+            styles.actionSheetCellText,
             styles[`${_type}ActionsheetCellText`],
             styles[`${btnType}ActionsheetCellText`],
             textStyle
@@ -145,29 +136,29 @@ const Index: React.FC<any> = ({
     )
 
   return <Popup
-      visible={visible}
-      style={[styles.iosActionsheet, style]}
-      maskStyle={maskStyle}
-      onShow={onShow}
-      onClose={onClose}
-    >
-      {menus.length
-        ? <View style={[styles.actionsheetMenu]}>
-          {_renderMenuItems()}
-        </View>
-        : false}
-      {actions.length
-        ? <View style={[styles.actionsheetAction]}>
-          {_renderActions()}
-        </View>
-        : false}
-      <View style={{paddingBottom: Math.max(initialWindowMetrics?.insets.bottom || 0, 16), backgroundColor: '#fff'}}></View>
-    </Popup>
+    visible={visible}
+    style={[styles.actionsheet, style]}
+    maskStyle={maskStyle}
+    onShow={onShow}
+    onClose={onClose}
+  >
+    {menus.length
+      ? <View style={[styles.actionsheetMenu]}>
+        {_renderMenuItems()}
+      </View>
+      : false}
+    {actions.length
+      ? <View style={[styles.actionsheetAction]}>
+        {_renderActions()}
+      </View>
+      : false}
+    <View style={{ paddingBottom: Math.max(initialWindowMetrics?.insets.bottom || 0, 16), backgroundColor: '#fff' }}></View>
+  </Popup>
 }
 
 Index.propTypes = {
   autoDectect: PropTypes.bool,
-  type: PropTypes.oneOf(['ios', 'android']),
+  type: PropTypes.oneOf(['ios', 'android', 'harmony']),
   menus: PropTypes.any,
   actions: PropTypes.any,
   visible: PropTypes.bool,

package/src/lib/showActionSheet/index.tsx

@@ -1,5 +1,6 @@
 import React from 'react'
 import RootSiblings from 'react-native-root-siblings'
+
 import ActionSheet from './ActionSheet'
 
 function showActionSheet (obj: Taro.showActionSheet.Option): Promise<Taro.showActionSheet.SuccessCallbackResult> {
@@ -20,9 +21,13 @@ function showActionSheet (obj: Taro.showActionSheet.Option): Promise<Taro.showAc
       sibling && sibling.destroy()
       sibling = undefined
       const res = { tapIndex, errMsg: 'showActionSheet:ok' }
-      success?.(res)
-      complete?.(res)
-      resolve(res)
+      // fix: iOS 无法打开相册
+      // https://github.com/expo/expo/issues/25705
+      setTimeout(() => {
+        success?.(res)
+        complete?.(res)
+        resolve(res)
+      }, 1)
     }
 
     function onFail () {
@@ -38,7 +43,7 @@ function showActionSheet (obj: Taro.showActionSheet.Option): Promise<Taro.showAc
       <ActionSheet
         autoDectect={autoDectect}
         type={type}
-        visible={false}
+        visible={true}
         onClose={onFail}
         menus={
           itemList.map((item, index) => {
@@ -46,7 +51,7 @@ function showActionSheet (obj: Taro.showActionSheet.Option): Promise<Taro.showAc
               type: 'default',
               label: item,
               textStyle: { color: itemColor },
-              onPress: onSuccess.bind(this, index)
+              onPress: () => onSuccess(index)
             }
           }) as any
         }
@@ -55,41 +60,11 @@ function showActionSheet (obj: Taro.showActionSheet.Option): Promise<Taro.showAc
             type: 'default',
             label: '取消',
             textStyle: { color: itemColor },
-            onPress: onFail.bind(this)
+            onPress: onFail
           }
         ] as any}
       />
     )
-
-    // hack 的做法。不推荐
-    setTimeout(() => {
-      sibling.update(
-        <ActionSheet
-          autoDectect={autoDectect}
-          type={type}
-          visible
-          onClose={onFail}
-          menus={
-            itemList.map((item, index) => {
-              return {
-                type: 'default',
-                label: item,
-                textStyle: { color: itemColor },
-                onPress: onSuccess.bind(this, index)
-              }
-            }) as any
-          }
-          actions={[
-            {
-              type: 'default',
-              label: '取消',
-              textStyle: { color: itemColor },
-              onPress: onFail.bind(this)
-            }
-          ] as any}
-        />
-      )
-    }, 100)
   })
 }