Merge branch 'fix-drn' of github.com:didi/mpx into fix-drn

didi · Dec 24, 2024 · 2bdd1e6 · 2bdd1e6
2 parents c4ac7f8 + d68fce7
commit 2bdd1e6
Show file tree

Hide file tree

Showing 16 changed files with 319 additions and 312 deletions.
diff --git a/examples/mpx-webview/H5/webviewbridge.min.js b/examples/mpx-webview/H5/webviewbridge.min.js
diff --git a/packages/api-proxy/src/platform/api/action-sheet/rnActionSheet.jsx b/packages/api-proxy/src/platform/api/action-sheet/rnActionSheet.jsx
@@ -1,4 +1,4 @@
-import { View, TouchableHighlight, Text, StyleSheet, TouchableOpacity } 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'
@@ -64,7 +64,8 @@ function showActionSheet (options = {}) {
 
     offset.value = withTiming(0)
 
-    const selectAction = function (index) {
+    const selectAction = function (index, e) {
+      e.stopPropagation()
       const result = {
         errMsg: 'showActionSheet:ok',
         tapIndex: index
@@ -83,26 +84,26 @@ function showActionSheet (options = {}) {
       }
     }
 
-    const cancelAction = function () {
+    const cancelAction = function (e) {
+      e.stopPropagation()
       const result = {
         errMsg: 'showActionSheet:fail cancel'
       }
       failHandle(result, fail, complete)
       remove()
     }
     return (
-      <TouchableHighlight underlayColor="rgba(0,0,0,0.6)" activeOpacity={1} onPress={cancelAction} style={styles.actionActionMask}>
-        {/* pointerEvents="none" 解决安卓下选项需要点两次被触发的问题 */}
-        <Animated.View style={[styles.actionSheetContent, animatedStyles]} pointerEvents="none">
+      <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) => <TouchableHighlight key={index} underlayColor="#ececec" onPress={() => selectAction(index)} style={ [styles.itemStyle, itemList.length -1 === index ? {
+          { 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></TouchableHighlight>) }
-          <View style={styles.buttonStyle}><TouchableOpacity onPress={cancelAction}><Text style={{ color: "#000000", width: "100%", textAlign: "center" }}>取消</Text></TouchableOpacity></View>
+          } : {}] }><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>
-      </TouchableHighlight>
+      </View>
     )
   }
 

diff --git a/packages/webpack-plugin/lib/platform/style/wx/index.js b/packages/webpack-plugin/lib/platform/style/wx/index.js
@@ -108,32 +108,6 @@ module.exports = function getSpec ({ warn, error }) {
     }
     return result
   }
-  // 解析 translateY(10px) 这种结构
-  // 括号外作为key返回，括号内作为val返回
-  const parseValueFromParentheses = (values) => {
-    let i = -1
-    const len = values.length
-    let stack = 0
-    let start = 0
-    let key = ''
-    let val = ''
-    while (++i < len) {
-      const char = values[i]
-      if (char === '(') {
-        if (stack === 0) {
-          start = i
-          key = values.substring(0, start)
-        }
-        stack++
-      } else if (char === ')') {
-        stack--
-        if (stack === 0) {
-          val = values.substring(start + 1, i)
-        }
-      }
-    }
-    return { key, val }
-  }
   // const getDefaultValueFromVar = (str) => {
   //   const totalVarExp = /^var\((.+)\)$/
   //   if (!totalVarExp.test(str)) return str
@@ -404,55 +378,61 @@ module.exports = function getSpec ({ warn, error }) {
     const values = parseValues(value)
     const transform = []
     values.forEach(item => {
-      let { key, val } = parseValueFromParentheses(item)
-      switch (key) {
-        case 'translateX':
-        case 'translateY':
-        case 'scaleX':
-        case 'scaleY':
-        case 'rotateX':
-        case 'rotateY':
-        case 'rotateZ':
-        case 'rotate':
-        case 'skewX':
-        case 'skewY':
-        case 'perspective':
-          // 单个值处理
-          transform.push({ [key]: val })
-          break
-        case 'matrix':
-        case 'matrix3d':
-          transform.push({ [key]: parseValues(val, ',').map(val => +val) })
-          break
-        case 'translate':
-        case 'scale':
-        case 'skew':
-        case 'rotate3d': // x y z angle
-        case 'translate3d': // x y 支持 z不支持
-        case 'scale3d': // x y 支持 z不支持
-        {
-          // 2 个以上的值处理
-          key = key.replace('3d', '')
-          const vals = parseValues(val, ',').splice(0, key === 'rotate' ? 4 : 3)
-          // scale(.5) === scaleX(.5) scaleY(.5)
-          if (vals.length === 1 && key === 'scale') {
-            vals.push(vals[0])
-          }
-          const xyz = ['X', 'Y', 'Z']
-          transform.push(...vals.map((v, index) => {
-            if (key !== 'rotate' && index > 1) {
-              unsupportedPropError({ prop: `${key}Z`, value, selector }, { mode })
+      const match = item.match(/([/\w]+)\((.+)\)/)
+      if (match && match.length >= 3) {
+        let key = match[1]
+        const val = match[2]
+        switch (key) {
+          case 'translateX':
+          case 'translateY':
+          case 'scaleX':
+          case 'scaleY':
+          case 'rotateX':
+          case 'rotateY':
+          case 'rotateZ':
+          case 'rotate':
+          case 'skewX':
+          case 'skewY':
+          case 'perspective':
+            // 单个值处理
+            transform.push({ [key]: val })
+            break
+          case 'matrix':
+          case 'matrix3d':
+            transform.push({ [key]: parseValues(val, ',').map(val => +val) })
+            break
+          case 'translate':
+          case 'scale':
+          case 'skew':
+          case 'rotate3d': // x y z angle
+          case 'translate3d': // x y 支持 z不支持
+          case 'scale3d': // x y 支持 z不支持
+          {
+            // 2 个以上的值处理
+            key = key.replace('3d', '')
+            const vals = parseValues(val, ',').splice(0, key === 'rotate' ? 4 : 3)
+            // scale(.5) === scaleX(.5) scaleY(.5)
+            if (vals.length === 1 && key === 'scale') {
+              vals.push(vals[0])
             }
-            return { [`${key}${xyz[index] || ''}`]: v.trim() }
-          }))
-          break
+            const xyz = ['X', 'Y', 'Z']
+            transform.push(...vals.map((v, index) => {
+              if (key !== 'rotate' && index > 1) {
+                unsupportedPropError({ prop: `${key}Z`, value, selector }, { mode })
+              }
+              return { [`${key}${xyz[index] || ''}`]: v.trim() }
+            }))
+            break
+          }
+          case 'translateZ':
+          case 'scaleZ':
+          default:
+            // 不支持的属性处理
+            unsupportedPropError({ prop, value, selector }, { mode })
+            break
         }
-        case 'translateZ':
-        case 'scaleZ':
-        default:
-          // 不支持的属性处理
-          unsupportedPropError({ prop, value, selector }, { mode })
-          break
+      } else {
+        error(`Property [${prop}] is invalid in ${selector}, received [${value}], please check again!`)
       }
     })
     return {

diff --git a/packages/webpack-plugin/lib/runtime/components/react/context.ts b/packages/webpack-plugin/lib/runtime/components/react/context.ts
@@ -55,6 +55,8 @@ export const IntersectionObserverContext = createContext<IntersectionObserver |
 
 export const RouteContext = createContext<number | null>(null)
 
+export const SwiperContext = createContext({})
+
 export const KeyboardAvoidContext = createContext<KeyboardAvoidContextValue | null>(null)
 
 export const ScrollViewContext = createContext<ScrollViewContextValue>({ gestureRef: null })
diff --git a/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column.tsx b/packages/webpack-plugin/lib/runtime/components/react/mpx-picker-view-column.tsx
@@ -172,6 +172,7 @@ const _PickerViewColumn = forwardRef<HandlerRef<ScrollView & View, ColumnProps>,
 
   const onItemLayout = (e: LayoutChangeEvent) => {
     const { height: rawH } = e.nativeEvent.layout
+    // console.log('[mpx-picker-view-column], onItemLayout --->', 'columnIndex=', columnIndex, 'width=', width)
     if (rawH && itemRawH !== rawH) {
       setItemRawH(rawH)
     }