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

package/package.json

@@ -1,9 +1,11 @@
 {
   "name": "@tarojs/taro-rn",
-  "version": "4.0.1",
+  "version": "4.0.3-alpha.0",
   "description": "Taro RN framework",
+  "author": "O2Team",
+  "license": "MIT",
   "main": "dist/index.js",
-  "typings": "types/index.d.ts",
+  "types": "types/index.d.ts",
   "files": [
     "dist",
     "src",
@@ -18,84 +20,83 @@
   "keywords": [
     "taro"
   ],
-  "author": "O2Team",
-  "license": "MIT",
+  "engines": {
+    "node": ">= 18"
+  },
   "dependencies": {
-    "@bam.tech/react-native-image-resizer": "~3.0.4",
-    "@react-native-async-storage/async-storage": "~1.17.7",
-    "@react-native-camera-roll/camera-roll": "~5.0.4",
-    "@react-native-clipboard/clipboard": "~1.11.1",
-    "@react-native-community/geolocation": "~3.0.2",
-    "@react-native-community/netinfo": "~9.3.0",
-    "babel-preset-expo": "~9.2.1",
-    "base64-js": "^1.3.0",
-    "deprecated-react-native-prop-types": "^2.3.0",
-    "expo-av": "~13.0.0",
-    "expo-barcode-scanner": "~12.0.0",
-    "expo-brightness": "~11.0.0",
-    "expo-camera": "~13.0.0",
-    "expo-file-system": "~15.1.1",
-    "expo-image-picker": "~14.0.0",
-    "expo-keep-awake": "~11.0.1",
-    "expo-location": "~15.0.1",
-    "expo-sensors": "~12.0.1",
-    "nullthrows": "^1.1.1",
+    "@bam.tech/react-native-image-resizer": "3.0.9",
+    "@react-native-async-storage/async-storage": "1.23.1",
+    "@react-native-camera-roll/camera-roll": "7.7.0",
+    "@react-native-clipboard/clipboard": "1.14.1",
+    "@react-native-community/geolocation": "3.2.1",
+    "@react-native-community/netinfo": "11.3.2",
+    "base64-js": "^1.5.1",
+    "deprecated-react-native-prop-types": "^5.0.0",
+    "expo-av": "~13.10.0",
+    "expo-barcode-scanner": "~13.0.1",
+    "expo-brightness": "~12.0.1",
+    "expo-camera": "~15.0.8",
+    "expo-file-system": "~17.0.1",
+    "expo-image-picker": "~15.0.4",
+    "expo-keep-awake": "~13.0.1",
+    "expo-location": "~17.0.1",
+    "expo-sensors": "~13.0.6",
     "prop-types": "^15.8.1",
-    "react-native-device-info": "~10.3.0",
-    "react-native-image-zoom-viewer": "^3.0.1",
-    "react-native-root-siblings": "^4.1.1",
-    "react-native-root-toast": "^3.0.1",
-    "react-native-safe-area-context": "~4.4.1",
-    "react-native-stylekit": "^1.0.0",
-    "react-native-syan-image-picker": "0.5.3",
-    "@tarojs/runtime-rn": "4.0.1"
+    "react-native-device-info": "11.1.0",
+    "react-native-image-zoom-viewer": "3.0.1",
+    "react-native-root-siblings": "5.0.1",
+    "react-native-safe-area-context": "4.10.1",
+    "@tarojs/runtime-rn": "4.0.3-alpha.0",
+    "@tarojs/taro": "4.0.3-alpha.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.14.5",
-    "@babel/preset-env": "^7.14.5",
-    "@jest/globals": "^26.6.2",
-    "@testing-library/jest-native": "^4.0.4",
-    "@testing-library/react-native": "^11.5.0",
-    "@types/jest": "^27.4.1",
-    "@types/react-native": "^0.69.8",
-    "expo": "~47.0.3",
-    "expo-modules-core": "~1.0.2",
-    "fbjs-scripts": "^3.0.1",
-    "jest": "^26.4.2",
-    "jest-cli": "^26.4.2",
-    "jest-environment-node": "^26.0.0",
-    "jest-expo": "^47.0.0",
-    "metro-react-native-babel-preset": "^0.72.1",
+    "@babel/core": "^7.24.4",
+    "@babel/parser": "^7.24.4",
+    "@babel/preset-env": "^7.24.4",
+    "@babel/traverse": "^7.24.4",
+    "@react-native/babel-preset": "^0.73.18",
+    "@testing-library/jest-native": "^5.4.2",
+    "@testing-library/react-native": "^12.4.1",
+    "cpy-cli": "^5.0.0",
+    "dpdm": "^3.14.0",
+    "expo": "~51.0.5",
+    "jest-expo": "^51.0.1",
     "mock-socket": "^7.1.0",
-    "react": "18.1.0",
-    "react-native": "^0.70.5",
-    "react-test-renderer": "18.1.0"
+    "react": "^18.2.0",
+    "react-native": "^0.72.3"
   },
   "peerDependencies": {
-    "@bam.tech/react-native-image-resizer": "~3.0.4",
-    "@react-native-async-storage/async-storage": "~1.17.7",
-    "@react-native-camera-roll/camera-roll": "~5.0.4",
-    "@react-native-clipboard/clipboard": "~1.11.1",
-    "@react-native-community/geolocation": "~3.0.2",
-    "@react-native-community/netinfo": "~9.3.0",
-    "expo-av": "~13.0.0",
-    "expo-barcode-scanner": "~12.0.0",
-    "expo-brightness": "~11.0.0",
-    "expo-camera": "~13.0.0",
-    "expo-file-system": "~15.1.1",
-    "expo-image-picker": "~14.0.0",
-    "expo-keep-awake": "~11.0.1",
-    "expo-location": "~15.0.1",
-    "expo-sensors": "~12.0.1",
-    "react-native-device-info": "~10.3.0",
-    "react-native-safe-area-context": "~4.4.1",
-    "react-native-syan-image-picker": "0.5.3"
+    "@bam.tech/react-native-image-resizer": ">= 3.0.0",
+    "@react-native-async-storage/async-storage": ">= 1.21.0",
+    "@react-native-camera-roll/camera-roll": ">= 7.2.0",
+    "@react-native-clipboard/clipboard": ">= 1.13.0",
+    "@react-native-community/geolocation": ">= 3.2.0",
+    "@react-native-community/netinfo": ">= 11.2.0",
+    "expo": ">= 51",
+    "expo-av": ">= 13.10.0",
+    "expo-barcode-scanner": ">= 13",
+    "expo-brightness": ">= 12",
+    "expo-camera": ">= 15",
+    "expo-file-system": ">= 17",
+    "expo-image-picker": ">= 15",
+    "expo-keep-awake": ">= 13",
+    "expo-location": ">= 17",
+    "expo-sensors": ">= 13",
+    "react": ">= 18",
+    "react-native": ">= 0.63.0",
+    "react-native-device-info": ">= 11",
+    "react-native-image-zoom-viewer": ">= 3",
+    "react-native-root-siblings": ">= 5",
+    "react-native-safe-area-context": ">= 4.8.0"
   },
   "scripts": {
+    "prod": "pnpm run build",
     "assets": "cpy 'src/**/*.png' '!src/__tests__/*' dist",
-    "build": "rimraf ./dist && tsc && pnpm run assets && pnpm run script",
+    "prebuild": "pnpm run clean",
+    "clean": "rimraf --impl=move-remove ./dist apiList.js libList.js",
+    "build": "tsc && pnpm run assets && pnpm run script",
     "dev": "pnpm run assets && tsc --watch",
-    "lint": "eslint .",
+    "lint": "eslint src script __tests__ --ext .js,.jsx.ts,.tsx",
     "test": "jest --silent",
     "test:ci": "jest --ci -i --coverage --silent",
     "test:coverage": "jest --coverage",

package/src/api/index.ts

@@ -1,44 +1,44 @@
 export {
   Current,
-  getCurrentInstance,
-  useDidShow,
-  useDidHide,
-  useLoad,
-  useReady,
-  useUnload,
-  useLaunch,
-  usePageNotFound,
-  useRouter,
-  usePullDownRefresh,
-  useReachBottom,
-  usePageScroll,
-  useTabItemTap,
-  useResize,
   eventCenter,
   Events,
+  getApp,
+  getCurrentInstance,
+  getCurrentPages,
+  hideNavigationBarLoading,
+  hideTabBar,
+  hideTabBarRedDot,
+  navigateBack,
   navigateTo,
+  pageScrollTo,
+  pxTransform,
   redirectTo,
-  navigateBack,
-  switchTab,
   reLaunch,
-  showTabBar,
-  hideTabBar,
-  showTabBarRedDot,
-  hideTabBarRedDot,
-  setTabBarBadge,
   removeTabBarBadge,
-  setTabBarItem,
-  setNavigationBarTitle,
+  setBackgroundColor,
+  setBackgroundTextStyle,
   setNavigationBarColor,
-  showNavigationBarLoading,
-  hideNavigationBarLoading,
+  setNavigationBarTitle,
+  setTabBarBadge,
+  setTabBarItem,
   setTabBarStyle,
-  getApp,
-  pxTransform,
+  showNavigationBarLoading,
+  showTabBar,
+  showTabBarRedDot,
   startPullDownRefresh,
   stopPullDownRefresh,
-  pageScrollTo,
-  setBackgroundColor,
-  setBackgroundTextStyle,
-  getCurrentPages
+  switchTab,
+  useDidHide,
+  useDidShow,
+  useLaunch,
+  useLoad,
+  usePageNotFound,
+  usePageScroll,
+  usePullDownRefresh,
+  useReachBottom,
+  useReady,
+  useResize,
+  useRouter,
+  useTabItemTap,
+  useUnload
 } from '@tarojs/runtime-rn'

package/src/lib/ENV_TYPE/index.ts

@@ -9,4 +9,4 @@ export const ENV_TYPE = {
   RN: 'RN',
   HARMONY: 'HARMONY',
   QUICKAPP: 'QUICKAPP'
-}
+}

package/src/lib/Mask.tsx

@@ -1,7 +1,7 @@
-import React from 'react'
+import { ViewPropTypes } from 'deprecated-react-native-prop-types'
 import PropTypes from 'prop-types'
+import React from 'react'
 import { StyleSheet, TouchableWithoutFeedback, View } from 'react-native'
-import { ViewPropTypes } from 'deprecated-react-native-prop-types'
 
 const styles = StyleSheet.create({
   mask: {

package/src/lib/Popup.tsx

@@ -1,8 +1,8 @@
+import { ViewPropTypes } from 'deprecated-react-native-prop-types'
+import PropTypes from 'prop-types'
 import React, { Component } from 'react'
+import { Animated, Dimensions, Easing, Modal, StyleSheet, View } from 'react-native'
 
-import PropTypes from 'prop-types'
-import { Modal, View, StyleSheet, Dimensions, Animated, Easing } from 'react-native'
-import { ViewPropTypes } from 'deprecated-react-native-prop-types'
 import { Mask } from './Mask'
 
 const { width, height } = Dimensions.get('window')
@@ -17,7 +17,7 @@ const styles = StyleSheet.create({
 })
 
 interface Props {
-  visible?: boolean;
+  visible?: boolean
 }
 
 class Popup extends Component<any, any> {
@@ -32,14 +32,14 @@ class Popup extends Component<any, any> {
 
   height
   popup
-
-  constructor (props:Props) {
+  timer
+  constructor(props: Props) {
     super(props)
     this.state = { visible: props.visible ?? false, translateY: new Animated.Value(height) }
     this.handleLayout = this.handleLayout.bind(this)
   }
 
-  UNSAFE_componentWillReceiveProps (nextProp:Props):void {
+  UNSAFE_componentWillReceiveProps (nextProp: Props): void {
     if (this.props.visible !== nextProp.visible) {
       if (nextProp.visible) {
         this.setState({ visible: true })
@@ -54,20 +54,27 @@ class Popup extends Component<any, any> {
     }
   }
 
-  handleLayout ():void {
-    this.popup.measure((_x, _y, _w, h) => {
-      this.height = h
-      this.setState({ translateY: new Animated.Value(h) })
-      Animated.timing(this.state.translateY, {
-        toValue: 0,
-        duration: 300,
-        easing: (Easing as any).easeInOut,
-        useNativeDriver: true
-      }).start()
-    })
+  componentWillUnmount (): void {
+    this.timer && clearTimeout(this.timer)
+  }
+
+  handleLayout (): void {
+    this.timer = setTimeout(() => {
+      this.popup?.measure((_x, _y, _w, h) => {
+        this.height = h
+        this.setState({ translateY: new Animated.Value(h) }, () => {
+          Animated.timing(this.state.translateY, {
+            toValue: 0,
+            duration: 300,
+            easing: (Easing as any).easeInOut,
+            useNativeDriver: true
+          }).start()
+        })
+      })
+    },) // 处理鸿蒙系统handleLayout 回调 this.popup为空的情况
   }
 
-  render ():JSX.Element {
+  render (): JSX.Element {
     const {
       style,
       maskStyle,

package/src/lib/StyleSheet.ts

@@ -1,4 +1,4 @@
-import { StyleSheet, Platform } from 'react-native'
+import { Platform, StyleSheet } from 'react-native'
 
 interface Styles {
   [propName: string]: any

package/src/lib/accelerometer.ts

@@ -1,4 +1,5 @@
 import { Accelerometer } from 'expo-sensors'
+
 import { createCallbackManager, errorHandler, successHandler } from '../utils'
 
 const _cbManager = createCallbackManager()
@@ -68,8 +69,8 @@ function stopAccelerometer(opts: Taro.stopAccelerometer.Option = {}): Promise<Ta
 }
 
 export {
-  onAccelerometerChange,
   offAccelerometerChange,
+  onAccelerometerChange,
   startAccelerometer,
   stopAccelerometer
 }

package/src/lib/arrayBufferToBase64/index.ts

@@ -3,4 +3,4 @@ import { fromByteArray } from 'base64-js'
 export function arrayBufferToBase64(arrayBuffer: ArrayBuffer): string {
   const buffer = new Uint8Array(arrayBuffer)
   return fromByteArray(buffer)
-}
+}

package/src/lib/base64ToArrayBuffer/index.ts

@@ -2,4 +2,4 @@ import { toByteArray } from 'base64-js'
 
 export function base64ToArrayBuffer(base64: string): ArrayBuffer {
   return toByteArray(base64)
-}
+}

package/src/lib/chooseImage/index.ts

@@ -1,157 +1,5 @@
-import SYImagePicker from 'react-native-syan-image-picker'
+import { chooseMedia, MEDIA_TYPE } from '../media'
 
-import { shouldBeObject } from '../../utils'
-import { showActionSheet } from '../showActionSheet'
-
-const res = { errMsg: 'chooseImage:ok' }
-const defaultOptions = {
-  count: 9,
-  sizeType: ['original', 'compressed'],
-  sourceType: ['album', 'camera']
-}
-
-function getRes(images) {
-  const tempFilePaths: string[] = []
-  const tempFiles: any[] = []
-  images.forEach((item: any) => {
-    tempFilePaths.push(item.uri)
-    tempFiles.push({
-      path: item.uri,
-      size: item.size
-    })
-  })
-  return { tempFilePaths, tempFiles }
-}
-
-function openCamera(options: Taro.chooseImage.Option): Promise<Taro.chooseImage.SuccessCallbackResult> {
-  const { success, fail, complete } = options
-  return new Promise((resolve, reject) => {
-    SYImagePicker.openCamera({
-      compressFocusAlpha: true
-    }, (err, photo: any) => {
-      if (err) {
-        const res = {
-          errMsg: err
-        }
-        fail?.(res)
-        complete?.(res)
-        reject(res)
-      } else {
-        try {
-          const data = Object.assign({}, getRes(photo), res)
-          success?.(data)
-          complete?.(data)
-          resolve(data)
-        } catch (error) {
-          // 错误
-          reject(error)
-        }
-      }
-    })
-  })
-}
-
-// NOTE: 调用此函数会改变图片的像素尺寸
-function openPicker(options: Taro.chooseImage.Option): Promise<Taro.chooseImage.SuccessCallbackResult> {
-  const { count: imageCount, sizeType = [],success, complete, fail } = options
-  return new Promise((resolve, reject) => {
-    // NOTE：react-native-syan-image-picker 暂不支持 Android 端压缩
-    SYImagePicker.showImagePicker({
-      compressFocusAlpha: true,
-      imageCount,
-      quality: sizeType[0] === 'compressed' ? 70 : 90,
-    }, (err, photos: any) => {
-      if (err) {
-        const res = {
-          errMsg: err
-        }
-        fail?.(res)
-        complete?.(res)
-        reject(res)
-      } else {
-        try {
-          const data = Object.assign({}, getRes(photos), res)
-          success?.(data)
-          complete?.(data)
-          resolve(data)
-        } catch (error) {
-          reject(error)
-        }
-      }
-    })
-  })
-}
-
-/**
- * @description Display the image picker.
- * @param options
- * @returns {Promise}
- */
-function showImagePicker(options: Taro.chooseImage.Option):Promise<Taro.chooseImage.SuccessCallbackResult> {
-  const { fail, complete } = options
-  return new Promise((resolve, reject) => {
-    showActionSheet({
-      itemList: ['拍照', '从手机相册选择'],
-      success(res) {
-        console.log(res.tapIndex)
-        if (res.tapIndex === 0) {
-          // 不添加 setTimeout 会有一定概率卡死，肯能是与 sibling.destroy() 冲突
-          setTimeout(() => {
-            openCamera(options).then(res => {
-              resolve(res)
-            }).catch(e => {
-              fail?.({ errMsg: `chooseImage:${e.message}` })
-              complete?.({ errMsg: `chooseImage:${e.message}` })
-              reject(new Error(`chooseImage:${e.message}`))
-            })
-          }, 100)
-        }
-        if (res.tapIndex === 1) {
-          setTimeout(() => {
-            openPicker(options).then(res => {
-              resolve(res)
-            }).catch(e => {
-              fail?.({ errMsg: `chooseImage:${e.message}` })
-              complete?.({ errMsg: `chooseImage:${e.message}` })
-              reject(new Error(`chooseImage:${e.message}`))
-            })
-          }, 100)
-        }
-      },
-      fail(res) {
-        console.log('error: ', res.errMsg)
-      }
-    })
-  })
-}
-
-/**
- * @deprecated
- * @description 从本地相册选择图片或使用相机拍照。
- *  sizeType ❌
- * @param options
- * @returns {Promise<*>}
- */
-export function chooseImage(options: Taro.chooseImage.Option): Promise<Taro.chooseImage.SuccessCallbackResult> {
-  // options must be an Object
-  const isObject = shouldBeObject(options)
-  if (!isObject.res) {
-    const res = { errMsg: `chooseImage${isObject.msg}` }
-    console.error(res.errMsg)
-    return Promise.reject(res)
-  }
-
-  options = Object.assign({}, defaultOptions, options)
-  const { sourceType } = options
-
-  switch (JSON.stringify(sourceType)) {
-    case '[\'camera\']':
-    case '["camera"]':
-      return openCamera(options)
-    case '[\'album\']':
-    case '["album"]':
-      return openPicker(options)
-    default:
-      return showImagePicker(options)
-  }
+export function chooseImage(opts: Taro.chooseImage.Option): Promise<any> {
+  return chooseMedia(opts, MEDIA_TYPE.Images)
 }

package/src/lib/chooseMedia/index.ts

@@ -0,0 +1,15 @@
+import { chooseMedia as _chooseMedia, MEDIA_TYPE } from '../media'
+
+export function chooseMedia (opts: Taro.chooseMedia.Option): Promise<any> {
+  if (opts.mediaType?.length === 1) {
+    if (opts.mediaType[0] === 'video') {
+      return _chooseMedia(opts, MEDIA_TYPE.Videos)
+    } else if (opts.mediaType[0] === 'image') {
+      return _chooseMedia(opts, MEDIA_TYPE.Images)
+    } else {
+      return _chooseMedia(opts, MEDIA_TYPE.All)
+    }
+  } else {
+    return _chooseMedia(opts, MEDIA_TYPE.All)
+  }
+}

package/src/lib/chooseVideo/index.ts

@@ -1,60 +1,5 @@
 import { chooseMedia, MEDIA_TYPE } from '../media'
-import { showActionSheet } from '../showActionSheet'
 
-/**
- * 拍摄视频或从手机相册中选视频。
- * @param {Object} opts
- * @param {Array} [opts.sourceType=['album', 'camera']] ✔
- * @param {boolean} [opts.compressed=true] ✔
- * @param {number} [opts.maxDuration=60] - 拍摄视频最长拍摄时间，单位秒 ✖
- * @param {string} [opts.camera='back'] - 默认拉起的是前置或者后置摄像头。✖
- * @returns {Promise<*>}
- */
 export function chooseVideo(opts: Taro.chooseVideo.Option): Promise<any> {
-  const { sourceType, compressed } = opts
-  opts = Object.assign(opts, { sizeType: compressed ? ['compressed'] : [] })
-  switch (JSON.stringify(sourceType)) {
-    case '[\'camera\']':
-    case '["camera"]':
-      return chooseMedia({...opts, sourceType: ['camera']}, MEDIA_TYPE.VIDEOS)
-    case '[\'album\']':
-    case '["album"]':
-      return chooseMedia({...opts, sourceType: ['album']}, MEDIA_TYPE.VIDEOS)
-    default:
-      return showVideoPicker(opts)
-  }
-}
-
-/**
- * 视频选择器
- * @param options
- * @returns {Promise}
- */
-function showVideoPicker(options: Taro.chooseVideo.Option):any {
-  const { fail, complete } = options
-  return new Promise((resolve, reject) => { 
-    showActionSheet({
-      itemList: ['拍摄', '从手机相册选择'],
-      success: function (res) {
-        if (res.tapIndex === 0) {
-          resolve(chooseMedia({...options, sourceType: ['camera']}, MEDIA_TYPE.VIDEOS))
-        }
-        if (res.tapIndex === 1) {
-          resolve(chooseMedia({...options, sourceType: ['album']}, MEDIA_TYPE.VIDEOS))
-        }
-      },
-      fail: function () {
-        const res = { errMsg: 'chooseVideo:fail cancel' }
-        reject(res)
-      }
-    }).catch(err => {
-      console.log('error: ', err.errMsg)
-      if (/showActionSheet:fail cancel/.test(err.errMsg)) {
-        const res = { errMsg: 'chooseVideo:fail cancel' }
-        fail?.(res)
-        complete?.(res)
-        reject(res)
-      }
-    })
-  })
+  return chooseMedia(opts, MEDIA_TYPE.Videos)
 }

package/src/lib/clearStorage/index.ts

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

package/src/lib/clearStorageSync/index.ts

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

package/src/lib/compressImage/index.ts

@@ -1,5 +1,6 @@
 import ImageResizer, { ResizeFormat } from '@bam.tech/react-native-image-resizer'
 import { Image } from 'react-native'
+
 import { errorHandler, successHandler } from '../../utils'
 
 /**

package/src/lib/connectSocket/socketTask.ts

@@ -1,13 +1,11 @@
-interface SocketTask {
-  ws: WebSocket;
-  _destroyWhenClose: () => void;
+class SocketTask {
+  ws: WebSocket
+  _destroyWhenClose: () => void
   closeDetail: {
-    code: number;
-    reason: string;
-  };
-}
+    code: number
+    reason: string
+  }
 
-class SocketTask {
   constructor (url: string, protocols: string[] | undefined) {
     if (protocols) {
       // eslint-disable-next-line no-undef
@@ -105,7 +103,7 @@ class SocketTask {
   onError (func?: Taro.SocketTask.OnErrorCallback): void {
     this.ws.onerror = () => {
       func && func({
-        errMsg: "There was an error with your websocket.",
+        errMsg: 'There was an error with your websocket.',
       })
     }
   }