@mpxjs/api-proxy 2.9.67 → 2.9.69-beta.1

package/@types/index.d.ts

@@ -110,6 +110,19 @@ export const createVideoContext: WechatMiniprogram.Wx['createVideoContext']
 export const onWindowResize: WechatMiniprogram.Wx['onWindowResize']
 export const offWindowResize: WechatMiniprogram.Wx['offWindowResize']
 export const createAnimation: WechatMiniprogram.Wx['createAnimation']
+export const hideHomeButton: WechatMiniprogram.Wx['hideHomeButton']
+export const getSetting: WechatMiniprogram.Wx['getSetting']
+export const openSetting: WechatMiniprogram.Wx['openSetting']
+export const enableAlertBeforeUnload: WechatMiniprogram.Wx['enableAlertBeforeUnload']
+export const disableAlertBeforeUnload: WechatMiniprogram.Wx['disableAlertBeforeUnload']
+export const getMenuButtonBoundingClientRect: WechatMiniprogram.Wx['getMenuButtonBoundingClientRect']
+export const getImageInfo: WechatMiniprogram.Wx['getImageInfo']
+export const vibrateShort: WechatMiniprogram.Wx['vibrateShort']
+export const vibrateLong: WechatMiniprogram.Wx['vibrateLong']
+export const getExtConfig: WechatMiniprogram.Wx['getExtConfig']
+export const getExtConfigSync: WechatMiniprogram.Wx['getExtConfigSync']
+export const openLocation: WechatMiniprogram.Wx['openLocation']
+export const chooseLocation: WechatMiniprogram.Wx['chooseLocation']
 
 declare const install: (...args: any) => any
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mpxjs/api-proxy",
-  "version": "2.9.67",
+  "version": "2.9.69-beta.1",
   "description": "convert miniprogram API at each end",
   "module": "src/index.js",
   "types": "@types/index.d.ts",
@@ -37,7 +37,7 @@
   },
   "homepage": "https://github.com/didi/mpx#readme",
   "dependencies": {
-    "@mpxjs/utils": "^2.9.67",
+    "@mpxjs/utils": "^2.9.69",
     "axios": "^1.7.3"
   },
   "peerDependencies": {
@@ -71,6 +71,5 @@
     "react-native-haptic-feedback": {
       "optional": true
     }
-  },
-  "gitHead": "b23d3850c16543c5998811b8d1d8e6ee7988c0f8"
+  }
 }

package/src/common/js/promisify.js

@@ -70,14 +70,22 @@ function promisify (listObj, whiteList, customBlackList) {
     result[key] = function (...args) {
       const obj = args[0] || {}
       // 不需要转换 or 用户已定义回调，则不处理
-      if (!promisifyFilter(key) || obj.success || obj.fail) {
+      if (!promisifyFilter(key)) {
         return listObj[key].apply(ENV_OBJ, args)
       } else { // 其他情况进行转换
         if (!args[0]) args.unshift(obj)
         let returned
         const promise = new Promise((resolve, reject) => {
-          obj.success = resolve
-          obj.fail = reject
+          const originSuccess = obj.success
+          const originFail = obj.fail
+          obj.success = function (res) {
+            originSuccess && originSuccess.call(this, res)
+            resolve(res)
+          }
+          obj.fail = function (e) {
+            originFail && originFail.call(this, e)
+            reject(e)
+          }
           returned = listObj[key].apply(ENV_OBJ, args)
         })
         promise.__returned = returned

package/src/platform/api/action-sheet/rnActionSheet.jsx

@@ -1,38 +1,17 @@
-import { View, TouchableHighlight, Text, StyleSheet, Button, Animated } from 'react-native'
+import { View, Text, StyleSheet } from 'react-native'
 import { successHandle, failHandle } from '../../../common/js'
 import { Portal } from '@ant-design/react-native'
+import { getWindowInfo } from '../system/rnSystem'
+import Animated, {
+  useSharedValue,
+  useAnimatedStyle,
+  withTiming
+} from 'react-native-reanimated'
 function showActionSheet (options = {}) {
   const { alertText, itemList = [], itemColor = '#000000', success, fail, complete } = options
-  let actionSheetKey
-  const slideAnim = new Animated.Value(500)
-  const slideIn = () => {
-    // Will change fadeAnim value to 1 in 5 seconds
-    Animated.timing(slideAnim, {
-      toValue: 0,
-      duration: 200,
-      useNativeDriver: true,
-    }).start()
-  }
-  const slideOut = () => {
-    // Will change fadeAnim value to 1 in 5 seconds
-    Animated.timing(slideAnim, {
-      toValue: 500,
-      duration: 200,
-      useNativeDriver: true,
-    }).start(() => {
-    })
-  }
-  if (itemList.length === 0 || itemList.length > 6) {
-    const result = {
-      errMsg: 'showActionSheet:fail parameter error: itemList should not be large than 6'
-    }
-    if (itemList.length === 0) {
-      result.errno = 1001
-      result.errMsg = 'showActionSheet:fail parameter error: parameter.itemList should have at least 1 item;'
-    }
-    failHandle(result, fail, complete)
-    return
-  }
+  const windowInfo = getWindowInfo()
+  const bottom = windowInfo.screenHeight - windowInfo.safeArea.bottom
+  let actionSheetKey = null
   const styles = StyleSheet.create({
     actionActionMask: {
       left: 0,
@@ -44,16 +23,14 @@ function showActionSheet (options = {}) {
       zIndex: 1000
     },
     actionSheetContent: {
-      left: 0,
-      right: 0,
-      position: 'absolute',
-      bottom: 0,
       backgroundColor: '#ffffff',
       borderTopLeftRadius: 10,
       borderTopRightRadius: 10,
-      transform: [{
-        translateY: -500
-      }]
+      position: 'absolute',
+      bottom: 0,
+      left: 0,
+      right: 0,
+      paddingBottom: bottom
     },
     itemStyle: {
       paddingTop: 15,
@@ -73,53 +50,64 @@ function showActionSheet (options = {}) {
       paddingBottom: 10
     }
   })
-  const remove = function () {
-    if (actionSheetKey) {
-      slideOut()
-      setTimeout(() => {
-        Portal.remove(actionSheetKey)
-        actionSheetKey = null
-      }, 200)
+  function ActionSheet () {
+    const offset = useSharedValue(1000);
+
+    const animatedStyles = useAnimatedStyle(() => ({
+      transform: [{ translateY: offset.value }],
+    }))
+
+    const slideOut = () => {
+      // Will change fadeAnim value to 1 in 5 seconds
+      offset.value = withTiming(1000)
     }
-  }
-  const selectAction = function (index) {
-    const result = {
-      errMsg: 'showActionSheet:ok',
-      tapIndex: index
+
+    offset.value = withTiming(0)
+
+    const selectAction = function (index, e) {
+      e.stopPropagation()
+      const result = {
+        errMsg: 'showActionSheet:ok',
+        tapIndex: index
+      }
+      successHandle(result, success, complete)
+      remove()
     }
-    successHandle(result, success, complete)
-    remove()
-  }
-  const cancelAction = function () {
-    const result = {
-      errMsg: 'showActionSheet:fail cancel'
+
+    const remove = function () {
+      if (actionSheetKey) {
+        slideOut()
+        setTimeout(() => {
+          Portal.remove(actionSheetKey)
+          actionSheetKey = null
+        }, 200)
+      }
     }
-    failHandle(result, fail, complete)
-    remove()
-  }
-  let alertTextList = []
-  if (alertText) {
-    alertTextList = [alertText]
+
+    const cancelAction = function (e) {
+      e.stopPropagation()
+      const result = {
+        errMsg: 'showActionSheet:fail cancel'
+      }
+      failHandle(result, fail, complete)
+      remove()
+    }
+    return (
+      <View onTouchEnd={cancelAction} style={styles.actionActionMask}>
+        <Animated.View style={[styles.actionSheetContent, animatedStyles]}>
+          { alertText ? <View style={ styles.itemStyle }><Text style={[styles.itemTextStyle, { color: '#666666' }]}>{alertText}</Text></View> : null }
+          { itemList.map((item, index) => <View key={index} onTouchEnd={(e) => selectAction(index, e)} style={ [styles.itemStyle, itemList.length -1 === index ? {
+            borderBottomWidth: 6,
+            borderBottomStyle: 'solid',
+            borderBottomColor: '#f7f7f7'
+          } : {}] }><Text style={[styles.itemTextStyle, { color: itemColor }]}>{item}</Text></View>) }
+          <View style={styles.buttonStyle} onTouchEnd={cancelAction}><Text style={{ color: "#000000", width: "100%", textAlign: "center" }}>取消</Text></View>
+        </Animated.View>
+      </View>
+    )
   }
-  const ActionSheetView = <TouchableHighlight underlayColor="rgba(0,0,0,0.6)" onPress={cancelAction} style={styles.actionActionMask}>
-    <Animated.View
-      style={[
-        styles.actionSheetContent,
-        {
-          transform: [{translateY: slideAnim}]
-        }
-      ]}>
-      { alertTextList.map((item, index) => <View key={index} style={ styles.itemStyle }><Text style={[styles.itemTextStyle, { color: '#666666' }]}>{item}</Text></View>) }
-      { itemList.map((item, index) => <TouchableHighlight key={index} underlayColor="#ececec" onPress={() => selectAction(index)} style={ [styles.itemStyle, itemList.length -1 === index ? {
-        borderBottomWidth: 6,
-        borderBottomStyle: 'solid',
-        borderBottomColor: '#f7f7f7'
-      } : {}] }><Text style={[styles.itemTextStyle, { color: itemColor }]}>{item}</Text></TouchableHighlight>) }
-      <View style={styles.buttonStyle}><Button color={'#000000'} title={'取消'} onPress={cancelAction}></Button></View>
-    </Animated.View>
-  </TouchableHighlight>
-  actionSheetKey = Portal.add(ActionSheetView)
-  slideIn()
+  
+  actionSheetKey = Portal.add(<ActionSheet/>)
 }
 
 export {

package/src/platform/api/app/index.web.js

@@ -3,8 +3,27 @@ import { isBrowser, isReact } from '@mpxjs/utils'
 global.__mpxAppCbs = global.__mpxAppCbs || {
   show: [],
   hide: [],
-  error: []
+  error: [],
+  rejection: []
+}
+
+function off (cbs, cb) {
+  if (cb) {
+    const idx = cbs.indexOf(cb)
+    if (idx > -1) cbs.splice(idx, 1)
+  } else {
+    cbs.length = 0
+  }
+}
+
+function onUnhandledRejection (callback) {
+  if (isBrowser || isReact) {
+    global.__mpxAppCbs.rejection.push(callback)
+  }
+}
 
+function offUnhandledRejection (callback) {
+  off(global.__mpxAppCbs.rejection, callback)
 }
 
 function onError (callback) {
@@ -14,9 +33,7 @@ function onError (callback) {
 }
 
 function offError (callback) {
-  const cbs = global.__mpxAppCbs.error
-  const index = cbs.indexOf(callback)
-  if (index > -1) cbs.splice(index, 1)
+  off(global.__mpxAppCbs.error, callback)
 }
 
 function onAppShow (callback) {
@@ -26,9 +43,7 @@ function onAppShow (callback) {
 }
 
 function offAppShow (callback) {
-  const cbs = global.__mpxAppCbs.show
-  const index = cbs.indexOf(callback)
-  if (index > -1) cbs.splice(index, 1)
+  off(global.__mpxAppCbs.show, callback)
 }
 
 function onAppHide (callback) {
@@ -38,9 +53,7 @@ function onAppHide (callback) {
 }
 
 function offAppHide (callback) {
-  const cbs = global.__mpxAppCbs.hide
-  const index = cbs.indexOf(callback)
-  if (index > -1) cbs.splice(index, 1)
+  off(global.__mpxAppCbs.hide, callback)
 }
 
 export {
@@ -49,5 +62,7 @@ export {
   offAppShow,
   offAppHide,
   onError,
-  offError
+  offError,
+  onUnhandledRejection,
+  offUnhandledRejection
 }

package/src/platform/api/create-intersection-observer/rnIntersectionObserver.js

@@ -12,10 +12,14 @@ class RNIntersectionObserver {
   constructor (component, options, intersectionCtx) {
     this.id = idCount++
     this.component = component
-    this.options = options
-    this.thresholds = options.thresholds.sort((a, b) => a - b) || [0]
-    this.initialRatio = options.initialRatio || 0
-    this.observeAll = options.observeAll || false
+    this.options = Object.assign({
+      thresholds: [0],
+      initialRatio: 0,
+      observeAll: false
+    }, options || {})
+    this.thresholds = this.options.thresholds.sort((a, b) => a - b) || [0]
+    this.initialRatio = this.options.initialRatio
+    this.observeAll = this.options.observeAll
 
     // 组件上挂载对应的observers，用于在组件销毁的时候进行批量disconnect
     this.component._intersectionObservers = this.component.__intersectionObservers || []
@@ -26,7 +30,7 @@ class RNIntersectionObserver {
     this.margins = DefaultMargin
     this.callback = noop
 
-    this.throttleMeasure = this.getThrottleMeasure(options.throttleTime || 100)
+    this.throttleMeasure = this.getThrottleMeasure(this.options.throttleTime || 100)
 
     // 记录上一次相交的比例
     this.previousIntersectionRatio = []
@@ -65,7 +69,7 @@ class RNIntersectionObserver {
 
   observe (selector, callback) {
     if (this.observerRefs) {
-      console.error('"observe" call can be only called once in IntersectionObserver')
+      console.warn('"observe" call can be only called once in IntersectionObserver')
       return
     }
     let targetRef = null
@@ -75,7 +79,7 @@ class RNIntersectionObserver {
       targetRef = this.component.__selectRef(selector, 'node')
     }
     if (!targetRef || targetRef.length === 0) {
-      console.error('intersection observer target not found')
+      console.warn('intersection observer target not found')
       return
     }
     this.observerRefs = isArray(targetRef) ? targetRef : [targetRef]
@@ -85,9 +89,9 @@ class RNIntersectionObserver {
 
   _getWindowRect () {
     if (this.windowRect) return this.windowRect
-    const navigation = getFocusedNavigation()
+    const navigation = getFocusedNavigation() || {}
     const screen = Dimensions.get('screen')
-    const navigationLayout = navigation.layout || {
+    const navigationLayout = navigation.layout  || {
       x: 0,
       y: 0,
       width: screen.width,
@@ -96,7 +100,7 @@ class RNIntersectionObserver {
 
     const windowRect = {
       top: navigationLayout.y + this.margins.top,
-      left: navigationLayout.x + this.margins.left,
+      left: this.margins.left,
       right: navigationLayout.width - this.margins.right,
       bottom: navigationLayout.y + navigationLayout.height - this.margins.bottom
     }

package/src/platform/api/create-selector-query/rnNodesRef.js

@@ -84,12 +84,7 @@ const getComputedStyle = (config = []) => {
   return wrapFn((nodeInstance, resolve) => {
     config = new Set(config)
     const res = {}
-    const styles = nodeInstance.props.current.style || {}
-    const defaultStyle = nodeInstance.instance.defaultStyle || {}
-    const computedStyle = {
-      ...defaultStyle,
-      ...styles
-    }
+    const computedStyle = nodeInstance.instance.style || {}
     config.forEach((key) => {
       const humpKey = dash2hump(key)
       // 取 style 的 key 是根据传入的 key 来设置，传什么设置什么 key，只不过取值需要做兼容

package/src/platform/api/image/index.ali.js

@@ -30,7 +30,10 @@ function compressImage (options = {}) {
   return ENV_OBJ.compressImage(opts)
 }
 
+const getImageInfo = ENV_OBJ.getImageInfo
+
 export {
   previewImage,
-  compressImage
+  compressImage,
+  getImageInfo
 }

package/src/platform/api/image/index.ios.js

@@ -0,0 +1,45 @@
+import { envError, defineUnsupportedProps, successHandle, failHandle } from '../../../common/js'
+import { Image } from 'react-native'
+
+const previewImage = envError('previewImage')
+
+const compressImage = envError('compressImage')
+
+const getImageInfo = function (options = {}) {
+  const { src, success, fail, complete } = options
+  if (src === undefined) {
+    const result = {
+      errMsg: 'getImageInfo:fail parameter error: parameter.src should be String instead of Undefined;',
+      errno: 1001
+    }
+    failHandle(result, fail, complete)
+    return
+  }
+  if (src === '') {
+    const result = {
+      errMsg: 'getImageInfo:fail image not found'
+    }
+    failHandle(result, fail, complete)
+    return
+  }
+  Image.getSize(src, (width, height) => {
+    const result = {
+      errMsg: 'getImageInfo:ok',
+      width,
+      height
+    }
+    defineUnsupportedProps(result, ['path', 'orientation', 'type'])
+    successHandle(result, success, complete)
+  }, (err) => {
+    const result = {
+      errMsg: 'getImageInfo:fail download image fail. reason: ' + err
+    }
+    failHandle(result, fail, complete)
+  })
+}
+
+export {
+  previewImage,
+  compressImage,
+  getImageInfo
+}

package/src/platform/api/image/index.js

@@ -4,7 +4,10 @@ const previewImage = ENV_OBJ.previewImage || envError('previewImage')
 
 const compressImage = ENV_OBJ.compressImage || envError('compressImage')
 
+const getImageInfo = ENV_OBJ.getImageInfo || envError('getImageInfo')
+
 export {
   previewImage,
-  compressImage
+  compressImage,
+  getImageInfo
 }

package/src/platform/api/image/index.web.js

@@ -1,5 +1,5 @@
 import Preview from './Preview'
-import { isBrowser, throwSSRWarning, envError } from '../../../common/js'
+import { isBrowser, throwSSRWarning, envError, defineUnsupportedProps, successHandle, failHandle } from '../../../common/js'
 
 let preview = null
 
@@ -15,9 +15,53 @@ const previewImage = (options) => {
   if (!preview) preview = new Preview()
   preview.show(options)
 }
+
 const compressImage = envError('compressImage')
 
+const getImageInfo = function (options = {}) {
+  const { src, success, fail, complete } = options
+
+  if (src === undefined) {
+    const result = {
+      errMsg: 'getImageInfo:fail parameter error: parameter.src should be String instead of Undefined;',
+      errno: 1001
+    }
+    failHandle(result, fail, complete)
+    return
+  }
+  if (src === '') {
+    const result = {
+      errMsg: 'getImageInfo:fail image not found'
+    }
+    failHandle(result, fail, complete)
+    return
+  }
+
+  const img = new Image()
+  img.src = src
+
+  img.onload = function () {
+    const width = img.width
+    const height = img.height
+    const result = {
+      errMsg: 'getImageInfo:ok',
+      width,
+      height
+    }
+    defineUnsupportedProps(result, ['path', 'orientation', 'type'])
+    successHandle(result, success, complete)
+  }
+
+  img.onerror = function () {
+    const result = {
+      errMsg: 'getImageInfo:fail download image fail. '
+    }
+    failHandle(result, fail, complete)
+  }
+}
+
 export {
   previewImage,
-  compressImage
+  compressImage,
+  getImageInfo
 }

package/src/platform/api/modal/rnModal.jsx

@@ -17,7 +17,7 @@ const showModal = function (options = {}) {
     fail,
     complete
   } = options
-  const modalWidth = width - 60
+  const modalWidth = width * 0.8
   const styles = StyleSheet.create({
     modalTask: {
       left: 0,
@@ -53,7 +53,8 @@ const showModal = function (options = {}) {
       lineHeight: 26,
       color: '#808080',
       paddingLeft: 20,
-      paddingRight: 20
+      paddingRight: 20,
+      textAlign: 'center'
     },
     modalBtnBox: {
       borderTopWidth: StyleSheet.hairlineWidth,
@@ -67,8 +68,8 @@ const showModal = function (options = {}) {
     modalBtn: {
       flex: 1,
       textAlign: 'center',
-      paddingTop: 10,
-      paddingBottom: 10,
+      paddingTop: width * 0.04,
+      paddingBottom: width * 0.04,
     },
     modalButton: {
       width: '100%',
@@ -88,9 +89,8 @@ const showModal = function (options = {}) {
   let editableContent = []
   let modalButton = [{
     text: confirmText,
-    confirmColor,
     type: 'confirm',
-    color: 'rgb(87, 107, 149)'
+    color: confirmColor
   }]
   let contentText = content
   const onChangeText = function (text) {
@@ -128,10 +128,9 @@ const showModal = function (options = {}) {
   if (showCancel) {
     modalButton.unshift({
       text: cancelText,
-      cancelColor,
       type: 'cancel',
       style: styles.cancelStyle,
-      color: '#000000'
+      color: cancelColor
     })
   }
   ModalView = <View style={styles.modalTask}>

package/src/platform/api/next-tick/index.ios.js

@@ -1 +1,7 @@
-export * from './index.ali'
+function nextTick (fn) {
+  Promise.resolve().then(fn)
+}
+
+export {
+  nextTick
+}

package/src/platform/api/request/index.web.js

@@ -107,10 +107,9 @@ function request (options = { url: '' }) {
       errMsg: `request:fail ${err}`,
       statusCode: response.status,
       header: response.headers,
-      data: response.data,
-      stack: realError.stack,
-      ...realError
+      data: response.data
     }
+    Object.assign(res, realError)
     failHandle(res, fail, complete)
   })
 

package/src/platform/api/route/index.ios.js

@@ -1,5 +1,6 @@
 import { successHandle, failHandle } from '../../../common/js'
 import { parseUrlQuery as parseUrl } from '@mpxjs/utils'
+import { nextTick } from '../next-tick'
 
 function getBasePath (navigation) {
   if (navigation) {
@@ -75,14 +76,23 @@ function navigateBack (options = {}) {
   const navigation = Object.values(global.__mpxPagesMap || {})[0]?.[1]
   const navigationHelper = global.__navigationHelper
   if (navigation && navigationHelper) {
-    navigation.pop(options.delta || 1)
-    navigationHelper.lastSuccessCallback = () => {
-      const res = { errMsg: 'navigateBack:ok' }
-      successHandle(res, options.success, options.complete)
-    }
-    navigationHelper.lastFailCallback = (msg) => {
-      const res = { errMsg: `navigateBack:fail ${msg}` }
-      failHandle(res, options.fail, options.complete)
+    const delta = options.delta || 1
+    const routeLength = navigation.getState().routes.length
+    if (delta >= routeLength && global.__mpx?.config.rnConfig.onAppBack?.(delta - routeLength + 1)) {
+      nextTick(() => {
+        const res = { errMsg: 'navigateBack:ok' }
+        successHandle(res, options.success, options.complete)
+      })
+    } else {
+      navigation.pop(delta)
+      navigationHelper.lastSuccessCallback = () => {
+        const res = { errMsg: 'navigateBack:ok' }
+        successHandle(res, options.success, options.complete)
+      }
+      navigationHelper.lastFailCallback = (msg) => {
+        const res = { errMsg: `navigateBack:fail ${msg}` }
+        failHandle(res, options.fail, options.complete)
+      }
     }
   }
 }

package/src/platform/api/set-navigation-bar/index.ali.js

@@ -17,7 +17,12 @@ function setNavigationBarColor (options = {}) {
   return ENV_OBJ.setNavigationBar(options)
 }
 
+function hideHomeButton (options = {}) {
+  return ENV_OBJ.hideBackHome(options)
+}
+
 export {
   setNavigationBarTitle,
-  setNavigationBarColor
+  setNavigationBarColor,
+  hideHomeButton
 }