@mpxjs/webpack-plugin 2.9.59 → 2.9.62

package/lib/platform/template/wx/component-config/checkbox-group.js

@@ -6,6 +6,14 @@ module.exports = function () {
     web (tag, { el }) {
       el.isBuiltIn = true
       return 'mpx-checkbox-group'
+    },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-checkbox-group'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-checkbox-group'
     }
   }
 }

package/lib/platform/template/wx/component-config/checkbox.js

@@ -7,6 +7,14 @@ module.exports = function () {
       el.isBuiltIn = true
       return 'mpx-checkbox'
     },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-checkbox'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-checkbox'
+    },
     event: [
       {
         test: 'tap',

package/lib/platform/template/wx/component-config/cover-image.js

@@ -2,6 +2,8 @@ const TAG_NAME = 'cover-image'
 
 module.exports = function ({ print }) {
   const aliEventLog = print({ platform: 'ali', tag: TAG_NAME, isError: false, type: 'event' })
+  const iosPropLog = print({ platform: 'ios', tag: TAG_NAME, isError: false })
+  const androidPropLog = print({ platform: 'android', tag: TAG_NAME, isError: false })
   return {
     test: TAG_NAME,
     web (tag, { el }) {
@@ -11,12 +13,25 @@ module.exports = function ({ print }) {
     tt () {
       return 'image'
     },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-image'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-image'
+    },
     props: [
       {
         test: 'use-built-in',
         web (prop, { el }) {
           el.isBuiltIn = true
         }
+      },
+      {
+        test: /^(referrer-policy)$/,
+        ios: iosPropLog,
+        android: androidPropLog
       }
     ],
     event: [

package/lib/platform/template/wx/component-config/cover-view.js

@@ -4,6 +4,7 @@ module.exports = function ({ print }) {
   const aliPropLog = print({ platform: 'ali', tag: TAG_NAME, isError: false })
   const baiduValueLogError = print({ platform: 'baidu', tag: TAG_NAME, isError: true, type: 'value' })
   const webPropLog = print({ platform: 'web', tag: TAG_NAME, isError: false })
+
   return {
     test: TAG_NAME,
     web (tag, { el }) {
@@ -19,6 +20,14 @@ module.exports = function ({ print }) {
     tt () {
       return 'view'
     },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-view'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-view'
+    },
     props: [
       {
         test: 'scroll-top',

package/lib/platform/template/wx/component-config/form.js

@@ -7,6 +7,8 @@ module.exports = function ({ print }) {
   const jdPropLog = print({ platform: 'jd', tag: TAG_NAME, isError: false })
   const webPropLog = print({ platform: 'web', tag: TAG_NAME, isError: false })
   const qaPropLog = print({ platform: 'qa', tag: TAG_NAME, isError: false })
+  const iosPropLog = print({ platform: 'ios', tag: TAG_NAME, isError: false })
+  const androidPropLog = print({ platform: 'android', tag: TAG_NAME, isError: false })
 
   return {
     test: TAG_NAME,
@@ -15,6 +17,14 @@ module.exports = function ({ print }) {
       el.isBuiltIn = true
       return 'mpx-form'
     },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-form'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-form'
+    },
     props: [
       {
         test: /^(report-submit-timeout)$/,
@@ -26,7 +36,9 @@ module.exports = function ({ print }) {
       {
         test: /^(report-submit|report-submit-timeout)$/,
         web: webPropLog,
-        qa: qaPropLog
+        qa: qaPropLog,
+        ios: iosPropLog,
+        android: androidPropLog
       }
     ]
   }

package/lib/platform/template/wx/component-config/icon.js

@@ -6,6 +6,14 @@ module.exports = function () {
     web (tag, { el }) {
       el.isBuiltIn = true
       return 'mpx-icon'
+    },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-icon'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-icon'
     }
   }
 }

package/lib/platform/template/wx/component-config/index.js

@@ -37,9 +37,11 @@ const unsupported = require('./unsupported')
 const video = require('./video')
 const view = require('./view')
 const webView = require('./web-view')
+const label = require('./label')
 const wxs = require('./wxs')
 const component = require('./component')
 const fixComponentName = require('./fix-component-name')
+const rootPortal = require('./root-portal')
 
 module.exports = function getComponentConfigs ({ warn, error }) {
   /**
@@ -121,6 +123,8 @@ module.exports = function getComponentConfigs ({ warn, error }) {
     livePlayer({ print }),
     livePusher({ print }),
     hyphenTagName({ print }),
-    component()
+    label({ print }),
+    component(),
+    rootPortal({ print })
   ]
 }

package/lib/platform/template/wx/component-config/label.js

@@ -0,0 +1,15 @@
+const TAG_NAME = 'label'
+
+module.exports = function () {
+  return {
+    test: TAG_NAME,
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-label'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-label'
+    }
+  }
+}

package/lib/platform/template/wx/component-config/movable-area.js

@@ -1,11 +1,28 @@
 const TAG_NAME = 'movable-area'
 
 module.exports = function ({ print }) {
+  const androidPropLog = print({ platform: 'android', tag: TAG_NAME, isError: false })
+  const iosPropLog = print({ platform: 'ios', tag: TAG_NAME, isError: false })
   return {
     test: TAG_NAME,
     web (tag, { el }) {
       el.isBuiltIn = true
       return 'mpx-movable-area'
-    }
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-movable-area'
+    },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-movable-area'
+    },
+    props: [
+      {
+        test: /^(scale-area)$/,
+        ios: iosPropLog,
+        android: androidPropLog
+      }
+    ]
   }
 }

package/lib/platform/template/wx/component-config/movable-view.js

@@ -3,16 +3,33 @@ const TAG_NAME = 'movable-view'
 module.exports = function ({ print }) {
   const aliEventLog = print({ platform: 'ali', tag: TAG_NAME, isError: false, type: 'event' })
   const qaPropLog = print({ platform: 'qa', tag: TAG_NAME, isError: false })
+  const androidPropLog = print({ platform: 'android', tag: TAG_NAME, isError: false })
+  const iosPropLog = print({ platform: 'ios', tag: TAG_NAME, isError: false })
   return {
     test: TAG_NAME,
     web (tag, { el }) {
       el.isBuiltIn = true
       return 'mpx-movable-view'
     },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-movable-view'
+    },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-movable-view'
+    },
     props: [
       {
         test: /^(out-of-bounds)$/,
-        ali: qaPropLog
+        ali: qaPropLog,
+        ios: iosPropLog,
+        android: androidPropLog
+      },
+      {
+        test: /^(inertia|damping|animation)$/,
+        ios: iosPropLog,
+        android: androidPropLog
       }
     ],
     event: [

package/lib/platform/template/wx/component-config/navigator.js

@@ -28,6 +28,14 @@ module.exports = function ({ print }) {
       el.isBuiltIn = true
       return 'mpx-navigator'
     },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-navigator'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-navigator'
+    },
     props: [
       {
         test: /^(target|delta|app-id|path|extra-data|version|hover-stop-propagation)$/,

package/lib/platform/template/wx/component-config/picker-view-column.js

@@ -6,6 +6,14 @@ module.exports = function () {
     web (tag, { el }) {
       el.isBuiltIn = true
       return 'mpx-picker-view-column'
+    },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-picker-view-column'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-picker-view-column'
     }
   }
 }

package/lib/platform/template/wx/component-config/picker-view.js

@@ -6,6 +6,10 @@ module.exports = function ({ print }) {
   const ttPropLog = print({ platform: 'bytedance', tag: TAG_NAME, isError: false })
   const ttEventLog = print({ platform: 'bytedance', tag: TAG_NAME, isError: false, type: 'event' })
   const jdEventLog = print({ platform: 'jd', tag: TAG_NAME, isError: false, type: 'event' })
+  const iosPropLog = print({ platform: 'ios', tag: TAG_NAME, isError: false })
+  const iosEventLog = print({ platform: 'ios', tag: TAG_NAME, isError: false, type: 'event' })
+  const androidPropLog = print({ platform: 'android', tag: TAG_NAME, isError: false })
+  const androidEventLog = print({ platform: 'android', tag: TAG_NAME, isError: false, type: 'event' })
 
   return {
     test: TAG_NAME,
@@ -13,10 +17,20 @@ module.exports = function ({ print }) {
       el.isBuiltIn = true
       return 'mpx-picker-view'
     },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-picker-view'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-picker-view'
+    },
     props: [
       {
         test: /^(indicator-class|mask-class)$/,
-        tt: ttPropLog
+        tt: ttPropLog,
+        ios: iosPropLog,
+        android: androidPropLog
       }
     ],
     event: [
@@ -25,7 +39,9 @@ module.exports = function ({ print }) {
         ali: aliEventLog,
         swan: baiduEventLog,
         tt: ttEventLog,
-        jd: jdEventLog
+        jd: jdEventLog,
+        ios: iosEventLog,
+        android: androidEventLog
       }
     ]
   }

package/lib/platform/template/wx/component-config/picker.js

@@ -8,12 +8,23 @@ module.exports = function ({ print }) {
   const ttPropLog = print({ platform: 'bytedance', tag: TAG_NAME, isError: false })
   const baiduPropLog = print({ platform: 'baidu', tag: TAG_NAME, isError: false })
   const qaPropLog = print({ platform: 'qa', tag: TAG_NAME, isError: false })
+  const iosPropLog = print({ platform: 'ios', tag: TAG_NAME, isError: false })
+  const androidPropLog = print({ platform: 'android', tag: TAG_NAME, isError: false })
+
   return {
     test: TAG_NAME,
     web (tag, { el }) {
       el.isBuiltIn = true
       return 'mpx-picker'
     },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-picker'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-picker'
+    },
     props: [
       {
         test: 'mode',
@@ -30,7 +41,9 @@ module.exports = function ({ print }) {
         swan: baiduPropLog,
         ali: aliPropLog,
         jd: jdPropLog,
-        qa: qaPropLog
+        qa: qaPropLog,
+        ios: iosPropLog,
+        android: androidPropLog
       }
     ],
     event: [

package/lib/platform/template/wx/component-config/radio-group.js

@@ -6,6 +6,14 @@ module.exports = function () {
     web (tag, { el }) {
       el.isBuiltIn = true
       return 'mpx-radio-group'
+    },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-radio-group'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-radio-group'
     }
   }
 }

package/lib/platform/template/wx/component-config/radio.js

@@ -7,6 +7,14 @@ module.exports = function () {
       el.isBuiltIn = true
       return 'mpx-radio'
     },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-radio'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-radio'
+    },
     event: [
       {
         test: 'tap',

package/lib/platform/template/wx/component-config/root-portal.js

@@ -0,0 +1,15 @@
+const TAG_NAME = 'root-portal'
+
+module.exports = function ({ print }) {
+  return {
+    test: TAG_NAME,
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-root-portal'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-root-portal'
+    }
+  }
+}

package/lib/platform/template/wx/component-config/switch.js

@@ -10,6 +10,14 @@ module.exports = function ({ print }) {
       el.isBuiltIn = true
       return 'mpx-switch'
     },
+    ios (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-switch'
+    },
+    android (tag, { el }) {
+      el.isBuiltIn = true
+      return 'mpx-switch'
+    },
     props: [
       {
         test: /^type$/,

package/lib/platform/template/wx/component-config/unsupported.js

@@ -11,9 +11,7 @@ const JD_UNSUPPORTED_TAG_NAME_ARR = ['functional-page-navigator', 'live-pusher',
 // 快应用不支持的标签集合
 const QA_UNSUPPORTED_TAG_NAME_ARR = ['movable-view', 'movable-area', 'open-data', 'official-account', 'editor', 'functional-page-navigator', 'live-player', 'live-pusher', 'ad', 'cover-image']
 // RN不支持的标签集合
-const RN_UNSUPPORTED_TAG_NAME_ARR = ['movable-view', 'movable-area', 'open-data', 'official-account', 'editor', 'functional-page-navigator', 'live-player', 'live-pusher', 'ad', 'cover-image',
-  'checkbox', 'checkbox-group', 'radio', 'radio-group', 'switch', 'movable-area', 'movable-view', 'icon', 'progress', 'rich-text', 'form', 'label', 'picker', 'picker-view', 'picker-view-column', 'slider',
-  'audio', 'camera', 'video', 'canvas', 'cover-image', 'cover-view', 'match-media', 'page-container', 'root-portal', 'editor', 'keyboard-accessory', 'navigator', 'map']
+const RN_UNSUPPORTED_TAG_NAME_ARR = ['open-data', 'official-account', 'editor', 'functional-page-navigator', 'live-player', 'live-pusher', 'ad', 'progress', 'rich-text', 'slider', 'audio', 'camera', 'video', 'canvas', 'match-media', 'page-container', 'editor', 'keyboard-accessory', 'map']
 
 /**
  * @param {function(object): function} print

package/lib/react/processScript.js

@@ -28,12 +28,14 @@ import { NavigationContainer, createNavigationContainerRef, StackActions } from
 import { createNativeStackNavigator } from '@react-navigation/native-stack'
 import { Provider } from '@ant-design/react-native'
 import { SafeAreaProvider, useSafeAreaInsets } from 'react-native-safe-area-context'
+import { GestureHandlerRootView } from 'react-native-gesture-handler'
 
 global.__navigationHelper = {
   NavigationContainer: NavigationContainer,
   createNavigationContainerRef: createNavigationContainerRef,
   createNativeStackNavigator: createNativeStackNavigator,
   StackActions: StackActions,
+  GestureHandlerRootView: GestureHandlerRootView,
   Provider: Provider,
   SafeAreaProvider: SafeAreaProvider,
   useSafeAreaInsets: useSafeAreaInsets

package/lib/runtime/components/react/context.ts

@@ -0,0 +1,38 @@
+import { createContext, Dispatch, MutableRefObject, SetStateAction } from 'react';
+import { NativeSyntheticEvent } from 'react-native'
+
+export type LabelContextValue = MutableRefObject<{
+  triggerChange: (evt: NativeSyntheticEvent<TouchEvent>) => void
+}>
+
+export interface GroupValue {
+  [key: string]: { checked: boolean; setValue: Dispatch<SetStateAction<boolean>> }
+}
+
+export interface GroupContextValue {
+  groupValue: GroupValue
+  notifyChange: (evt: NativeSyntheticEvent<TouchEvent>) => void
+}
+
+export interface FormFieldValue {
+  getValue: () => any;
+  resetValue: ({ newVal, type }: { newVal?: any; type?: string }) => void;
+}
+
+export interface FormContextValue {
+  formValuesMap: Map<string, FormFieldValue>;
+  submit: () => void;
+  reset: () => void;
+}
+
+export const MovableAreaContext = createContext({ width: 0, height: 0 })
+
+export const FormContext = createContext<FormContextValue | null>(null)
+
+export const CheckboxGroupContext = createContext<GroupContextValue | null>(null)
+
+export const RadioGroupContext = createContext<GroupContextValue | null>(null)
+
+export const LabelContext = createContext<LabelContextValue | null>(null)
+
+export const PickerContext = createContext(null)

package/lib/runtime/components/react/dist/context.js

@@ -0,0 +1,7 @@
+import { createContext } from 'react';
+export const MovableAreaContext = createContext({ width: 0, height: 0 });
+export const FormContext = createContext(null);
+export const CheckboxGroupContext = createContext(null);
+export const RadioGroupContext = createContext(null);
+export const LabelContext = createContext(null);
+export const PickerContext = createContext(null);

package/lib/runtime/components/react/dist/getInnerListeners.js

@@ -65,7 +65,10 @@ export const getCustomEvent = (type = '', oe = {}, { detail = {}, layoutRef }, p
             dataset: getDataSet(props),
             offsetLeft: layoutRef?.current?.offsetLeft || 0,
             offsetTop: layoutRef?.current?.offsetTop || 0
-        }
+        },
+        persist: oe.persist,
+        stopPropagation: oe.stopPropagation,
+        preventDefault: oe.preventDefault
     };
 };
 const useInnerProps = (props = {}, additionalProps = {}, removeProps = [], rawConfig) => {
@@ -87,7 +90,7 @@ const useInnerProps = (props = {}, additionalProps = {}, removeProps = [], rawCo
     });
     const propsRef = useRef({});
     const eventConfig = {};
-    const config = rawConfig || {};
+    const config = rawConfig || { layoutRef: { current: {} }, disableTouch: false, disableTap: false };
     propsRef.current = { ...props, ...additionalProps };
     for (const key in eventConfigMap) {
         if (propsRef.current[key]) {
@@ -108,6 +111,17 @@ const useInnerProps = (props = {}, additionalProps = {}, removeProps = [], rawCo
             }
         });
     }
+    function checkIsNeedPress(e, type) {
+        const tapDetailInfo = ref.current.mpxPressInfo.detail || { x: 0, y: 0 };
+        const nativeEvent = e.nativeEvent;
+        const currentPageX = nativeEvent.changedTouches[0].pageX;
+        const currentPageY = nativeEvent.changedTouches[0].pageY;
+        if (Math.abs(currentPageX - tapDetailInfo.x) > 1 || Math.abs(currentPageY - tapDetailInfo.y) > 1) {
+            ref.current.needPress[type] = false;
+            ref.current.startTimer[type] && clearTimeout(ref.current.startTimer[type]);
+            ref.current.startTimer[type] = null;
+        }
+    }
     function handleTouchstart(e, type) {
         e.persist();
         const bubbleTouchEvent = ['catchtouchstart', 'bindtouchstart'];
@@ -135,19 +149,13 @@ const useInnerProps = (props = {}, additionalProps = {}, removeProps = [], rawCo
     function handleTouchmove(e, type) {
         const bubbleTouchEvent = ['catchtouchmove', 'bindtouchmove'];
         const captureTouchEvent = ['capture-catchtouchmove', 'capture-bindtouchmove'];
-        const tapDetailInfo = ref.current.mpxPressInfo.detail || { x: 0, y: 0 };
-        const nativeEvent = e.nativeEvent;
-        const currentPageX = nativeEvent.changedTouches[0].pageX;
-        const currentPageY = nativeEvent.changedTouches[0].pageY;
         const currentTouchEvent = type === 'bubble' ? bubbleTouchEvent : captureTouchEvent;
-        if (Math.abs(currentPageX - tapDetailInfo.x) > 1 || Math.abs(currentPageY - tapDetailInfo.y) > 1) {
-            ref.current.needPress[type] = false;
-            ref.current.startTimer[type] && clearTimeout(ref.current.startTimer[type]);
-            ref.current.startTimer[type] = null;
-        }
         handleEmitEvent(currentTouchEvent, 'touchmove', e);
+        checkIsNeedPress(e, type);
     }
     function handleTouchend(e, type) {
+        // move event may not be triggered
+        checkIsNeedPress(e, type);
         const bubbleTouchEvent = ['catchtouchend', 'bindtouchend'];
         const bubbleTapEvent = ['catchtap', 'bindtap'];
         const captureTouchEvent = ['capture-catchtouchend', 'capture-bindtouchend'];
@@ -158,6 +166,9 @@ const useInnerProps = (props = {}, additionalProps = {}, removeProps = [], rawCo
         ref.current.startTimer[type] = null;
         handleEmitEvent(currentTouchEvent, 'touchend', e);
         if (ref.current.needPress[type]) {
+            if (type === 'bubble' && config.disableTap) {
+                return;
+            }
             handleEmitEvent(currentTapEvent, 'tap', e);
         }
     }