@mpxjs/webpack-plugin 2.9.67 → 2.9.69-beta.0

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

@@ -1,27 +1,33 @@
-import { useRef } from 'react';
-import { omit } from './utils';
+import { useRef, useMemo } from 'react';
+import { hasOwn, collectDataset } from '@mpxjs/utils';
+import { omit, extendObject } from './utils';
 import eventConfigMap from './event.config';
 const getTouchEvent = (type, event, props, config) => {
     const nativeEvent = event.nativeEvent;
     const { timestamp, pageX, pageY, touches, changedTouches } = nativeEvent;
     const { id } = props;
     const { layoutRef } = config;
-    return {
-        ...event,
+    const currentTarget = extendObject({}, event.currentTarget, {
+        id: id || '',
+        dataset: collectDataset(props),
+        offsetLeft: layoutRef?.current?.offsetLeft || 0,
+        offsetTop: layoutRef?.current?.offsetTop || 0
+    });
+    const pendingProps = event._targetInst?.pendingProps || {};
+    const target = extendObject({}, event.target, {
+        id: pendingProps.parentId || pendingProps.nativeID || '',
+        dataset: collectDataset(pendingProps)
+    });
+    return extendObject({}, event, {
         type,
         timeStamp: timestamp,
-        currentTarget: {
-            ...(event.currentTarget || {}),
-            id: id || '',
-            dataset: getDataSet(props),
-            offsetLeft: layoutRef?.current?.offsetLeft || 0,
-            offsetTop: layoutRef?.current?.offsetTop || 0
-        },
+        currentTarget,
+        target,
         detail: {
             x: pageX,
             y: pageY
         },
-        touches: touches.map(item => {
+        touches: touches.map((item) => {
             return {
                 identifier: item.identifier,
                 pageX: item.pageX,
@@ -30,7 +36,7 @@ const getTouchEvent = (type, event, props, config) => {
                 clientY: item.locationY
             };
         }),
-        changedTouches: changedTouches.map(item => {
+        changedTouches: changedTouches.map((item) => {
             return {
                 identifier: item.identifier,
                 pageX: item.pageX,
@@ -42,35 +48,150 @@ const getTouchEvent = (type, event, props, config) => {
         persist: event.persist,
         stopPropagation: event.stopPropagation,
         preventDefault: event.preventDefault
-    };
-};
-export const getDataSet = (props) => {
-    const result = {};
-    for (const key in props) {
-        if (key.indexOf('data-') === 0) {
-            const newKey = key.substr(5);
-            result[newKey] = props[key];
-        }
-    }
-    return result;
+    });
 };
 export const getCustomEvent = (type = '', oe = {}, { detail = {}, layoutRef }, props = {}) => {
-    return {
-        ...oe,
+    const targetInfo = extendObject({}, oe.target, {
+        id: props.id || '',
+        dataset: collectDataset(props),
+        offsetLeft: layoutRef?.current?.offsetLeft || 0,
+        offsetTop: layoutRef?.current?.offsetTop || 0
+    });
+    return extendObject({}, oe, {
         type,
         detail,
-        target: {
-            ...(oe.target || {}),
-            id: props.id || '',
-            dataset: getDataSet(props),
-            offsetLeft: layoutRef?.current?.offsetLeft || 0,
-            offsetTop: layoutRef?.current?.offsetTop || 0
-        },
+        target: targetInfo,
         persist: oe.persist,
         stopPropagation: oe.stopPropagation,
         preventDefault: oe.preventDefault
-    };
+    });
 };
+function handleEmitEvent(events, type, oe, propsRef, config) {
+    events.forEach((event) => {
+        if (propsRef.current[event]) {
+            const match = /^(catch|capture-catch):?(.*?)(?:\.(.*))?$/.exec(event);
+            if (match) {
+                oe.stopPropagation();
+            }
+            propsRef.current[event](getTouchEvent(type, oe, propsRef.current, config));
+        }
+    });
+}
+function checkIsNeedPress(e, type, ref) {
+    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, ref, propsRef, config) {
+    e.persist();
+    const bubbleTouchEvent = ['catchtouchstart', 'bindtouchstart'];
+    const bubblePressEvent = ['catchlongpress', 'bindlongpress'];
+    const captureTouchEvent = [
+        'capture-catchtouchstart',
+        'capture-bindtouchstart'
+    ];
+    const capturePressEvent = [
+        'capture-catchlongpress',
+        'capture-bindlongpress'
+    ];
+    ref.current.startTimer[type] = null;
+    ref.current.needPress[type] = true;
+    const nativeEvent = e.nativeEvent;
+    ref.current.mpxPressInfo.detail = {
+        x: nativeEvent.changedTouches[0].pageX,
+        y: nativeEvent.changedTouches[0].pageY
+    };
+    const currentTouchEvent = type === 'bubble' ? bubbleTouchEvent : captureTouchEvent;
+    const currentPressEvent = type === 'bubble' ? bubblePressEvent : capturePressEvent;
+    handleEmitEvent(currentTouchEvent, 'touchstart', e, propsRef, config);
+    const { catchlongpress, bindlongpress, 'capture-catchlongpress': captureCatchlongpress, 'capture-bindlongpress': captureBindlongpress } = propsRef.current;
+    if (catchlongpress ||
+        bindlongpress ||
+        captureCatchlongpress ||
+        captureBindlongpress) {
+        ref.current.startTimer[type] = setTimeout(() => {
+            ref.current.needPress[type] = false;
+            handleEmitEvent(currentPressEvent, 'longpress', e, propsRef, config);
+        }, 350);
+    }
+}
+function handleTouchmove(e, type, ref, propsRef, config) {
+    const bubbleTouchEvent = ['catchtouchmove', 'bindtouchmove'];
+    const captureTouchEvent = [
+        'capture-catchtouchmove',
+        'capture-bindtouchmove'
+    ];
+    const currentTouchEvent = type === 'bubble' ? bubbleTouchEvent : captureTouchEvent;
+    handleEmitEvent(currentTouchEvent, 'touchmove', e, propsRef, config);
+    checkIsNeedPress(e, type, ref);
+}
+function handleTouchend(e, type, ref, propsRef, config) {
+    // move event may not be triggered
+    checkIsNeedPress(e, type, ref);
+    const bubbleTouchEvent = ['catchtouchend', 'bindtouchend'];
+    const bubbleTapEvent = ['catchtap', 'bindtap'];
+    const captureTouchEvent = [
+        'capture-catchtouchend',
+        'capture-bindtouchend'
+    ];
+    const captureTapEvent = ['capture-catchtap', 'capture-bindtap'];
+    const currentTouchEvent = type === 'bubble' ? bubbleTouchEvent : captureTouchEvent;
+    const currentTapEvent = type === 'bubble' ? bubbleTapEvent : captureTapEvent;
+    ref.current.startTimer[type] &&
+        clearTimeout(ref.current.startTimer[type]);
+    ref.current.startTimer[type] = null;
+    handleEmitEvent(currentTouchEvent, 'touchend', e, propsRef, config);
+    if (ref.current.needPress[type]) {
+        if (type === 'bubble' && config.disableTap) {
+            return;
+        }
+        handleEmitEvent(currentTapEvent, 'tap', e, propsRef, config);
+    }
+}
+function handleTouchcancel(e, type, ref, propsRef, config) {
+    const bubbleTouchEvent = ['catchtouchcancel', 'bindtouchcancel'];
+    const captureTouchEvent = [
+        'capture-catchtouchcancel',
+        'capture-bindtouchcancel'
+    ];
+    const currentTouchEvent = type === 'bubble' ? bubbleTouchEvent : captureTouchEvent;
+    ref.current.startTimer[type] &&
+        clearTimeout(ref.current.startTimer[type]);
+    ref.current.startTimer[type] = null;
+    handleEmitEvent(currentTouchEvent, 'touchcancel', e, propsRef, config);
+}
+function createTouchEventHandler(eventName, type) {
+    return (e, ref, propsRef, config) => {
+        const handlerMap = {
+            onTouchStart: handleTouchstart,
+            onTouchMove: handleTouchmove,
+            onTouchEnd: handleTouchend,
+            onTouchCancel: handleTouchcancel
+        };
+        const handler = handlerMap[eventName];
+        if (handler) {
+            handler(e, type, ref, propsRef, config);
+        }
+    };
+}
+const touchEventList = [
+    { eventName: 'onTouchStart', handler: createTouchEventHandler('onTouchStart', 'bubble') },
+    { eventName: 'onTouchMove', handler: createTouchEventHandler('onTouchMove', 'bubble') },
+    { eventName: 'onTouchEnd', handler: createTouchEventHandler('onTouchEnd', 'bubble') },
+    { eventName: 'onTouchCancel', handler: createTouchEventHandler('onTouchCancel', 'bubble') },
+    { eventName: 'onTouchStartCapture', handler: createTouchEventHandler('onTouchStart', 'capture') },
+    { eventName: 'onTouchMoveCapture', handler: createTouchEventHandler('onTouchMove', 'capture') },
+    { eventName: 'onTouchEndCapture', handler: createTouchEventHandler('onTouchEnd', 'capture') },
+    { eventName: 'onTouchCancelCapture', handler: createTouchEventHandler('onTouchCancel', 'capture') }
+];
 const useInnerProps = (props = {}, additionalProps = {}, userRemoveProps = [], rawConfig) => {
     const ref = useRef({
         startTimer: {
@@ -90,7 +211,11 @@ const useInnerProps = (props = {}, additionalProps = {}, userRemoveProps = [], r
     });
     const propsRef = useRef({});
     const eventConfig = {};
-    const config = rawConfig || { layoutRef: { current: {} }, disableTouch: false, disableTap: false };
+    const config = rawConfig || {
+        layoutRef: { current: {} },
+        disableTouch: false,
+        disableTap: false
+    };
     const removeProps = [
         'children',
         'enable-background',
@@ -102,151 +227,35 @@ const useInnerProps = (props = {}, additionalProps = {}, userRemoveProps = [], r
         'parent-height',
         ...userRemoveProps
     ];
-    propsRef.current = { ...props, ...additionalProps };
+    propsRef.current = extendObject({}, props, additionalProps);
+    let hashEventKey = '';
+    const rawEventKeys = [];
     for (const key in eventConfigMap) {
-        if (propsRef.current[key]) {
-            eventConfig[key] = eventConfigMap[key];
+        if (hasOwn(propsRef.current, key)) {
+            eventConfig[key] = eventConfigMap[key].events;
+            hashEventKey = hashEventKey + eventConfigMap[key].bitFlag;
+            rawEventKeys.push(key);
         }
     }
-    if (!(Object.keys(eventConfig).length) || config.disableTouch) {
+    if (!rawEventKeys.length || config.disableTouch) {
         return omit(propsRef.current, removeProps);
     }
-    function handleEmitEvent(events, type, oe) {
-        events.forEach(event => {
-            if (propsRef.current[event]) {
-                const match = /^(catch|capture-catch):?(.*?)(?:\.(.*))?$/.exec(event);
-                if (match) {
-                    oe.stopPropagation();
-                }
-                propsRef.current[event](getTouchEvent(type, oe, propsRef.current, config));
+    const events = useMemo(() => {
+        const transformedEventKeys = rawEventKeys.reduce((acc, key) => {
+            if (propsRef.current[key]) {
+                return acc.concat(eventConfig[key]);
             }
-        });
-    }
-    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'];
-        const bubblePressEvent = ['catchlongpress', 'bindlongpress'];
-        const captureTouchEvent = ['capture-catchtouchstart', 'capture-bindtouchstart'];
-        const capturePressEvent = ['capture-catchlongpress', 'capture-bindlongpress'];
-        ref.current.startTimer[type] = null;
-        ref.current.needPress[type] = true;
-        const nativeEvent = e.nativeEvent;
-        ref.current.mpxPressInfo.detail = {
-            x: nativeEvent.changedTouches[0].pageX,
-            y: nativeEvent.changedTouches[0].pageY
-        };
-        const currentTouchEvent = type === 'bubble' ? bubbleTouchEvent : captureTouchEvent;
-        const currentPressEvent = type === 'bubble' ? bubblePressEvent : capturePressEvent;
-        handleEmitEvent(currentTouchEvent, 'touchstart', e);
-        const { catchlongpress, bindlongpress, 'capture-catchlongpress': captureCatchlongpress, 'capture-bindlongpress': captureBindlongpress } = propsRef.current;
-        if (catchlongpress || bindlongpress || captureCatchlongpress || captureBindlongpress) {
-            ref.current.startTimer[type] = setTimeout(() => {
-                ref.current.needPress[type] = false;
-                handleEmitEvent(currentPressEvent, 'longpress', e);
-            }, 350);
-        }
-    }
-    function handleTouchmove(e, type) {
-        const bubbleTouchEvent = ['catchtouchmove', 'bindtouchmove'];
-        const captureTouchEvent = ['capture-catchtouchmove', 'capture-bindtouchmove'];
-        const currentTouchEvent = type === 'bubble' ? bubbleTouchEvent : captureTouchEvent;
-        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'];
-        const captureTapEvent = ['capture-catchtap', 'capture-bindtap'];
-        const currentTouchEvent = type === 'bubble' ? bubbleTouchEvent : captureTouchEvent;
-        const currentTapEvent = type === 'bubble' ? bubbleTapEvent : captureTapEvent;
-        ref.current.startTimer[type] && clearTimeout(ref.current.startTimer[type]);
-        ref.current.startTimer[type] = null;
-        handleEmitEvent(currentTouchEvent, 'touchend', e);
-        if (ref.current.needPress[type]) {
-            if (type === 'bubble' && config.disableTap) {
-                return;
+            return acc;
+        }, []);
+        const finalEventKeys = [...new Set(transformedEventKeys)];
+        const events = {};
+        touchEventList.forEach((item) => {
+            if (finalEventKeys.includes(item.eventName)) {
+                events[item.eventName] = (e) => item.handler(e, ref, propsRef, config);
             }
-            handleEmitEvent(currentTapEvent, 'tap', e);
-        }
-    }
-    function handleTouchcancel(e, type) {
-        const bubbleTouchEvent = ['catchtouchcancel', 'bindtouchcancel'];
-        const captureTouchEvent = ['capture-catchtouchcancel', 'capture-bindtouchcancel'];
-        const currentTouchEvent = type === 'bubble' ? bubbleTouchEvent : captureTouchEvent;
-        ref.current.startTimer[type] && clearTimeout(ref.current.startTimer[type]);
-        ref.current.startTimer[type] = null;
-        handleEmitEvent(currentTouchEvent, 'touchcancel', e);
-    }
-    const touchEventList = [{
-            eventName: 'onTouchStart',
-            handler: (e) => {
-                handleTouchstart(e, 'bubble');
-            }
-        }, {
-            eventName: 'onTouchMove',
-            handler: (e) => {
-                handleTouchmove(e, 'bubble');
-            }
-        }, {
-            eventName: 'onTouchEnd',
-            handler: (e) => {
-                handleTouchend(e, 'bubble');
-            }
-        }, {
-            eventName: 'onTouchCancel',
-            handler: (e) => {
-                handleTouchcancel(e, 'bubble');
-            }
-        }, {
-            eventName: 'onTouchStartCapture',
-            handler: (e) => {
-                handleTouchstart(e, 'capture');
-            }
-        }, {
-            eventName: 'onTouchMoveCapture',
-            handler: (e) => {
-                handleTouchmove(e, 'capture');
-            }
-        }, {
-            eventName: 'onTouchEndCapture',
-            handler: (e) => {
-                handleTouchend(e, 'capture');
-            }
-        }, {
-            eventName: 'onTouchCancelCapture',
-            handler: (e) => {
-                handleTouchcancel(e, 'capture');
-            }
-        }];
-    const events = {};
-    const transformedEventKeys = [];
-    for (const key in eventConfig) {
-        transformedEventKeys.push(...eventConfig[key]);
-    }
-    const finalEventKeys = [...new Set(transformedEventKeys)];
-    touchEventList.forEach(item => {
-        if (finalEventKeys.includes(item.eventName)) {
-            events[item.eventName] = item.handler;
-        }
-    });
-    const rawEventKeys = Object.keys(eventConfig);
-    return {
-        ...events,
-        ...omit(propsRef.current, [...rawEventKeys, ...removeProps])
-    };
+        });
+        return events;
+    }, [hashEventKey]);
+    return extendObject({}, events, omit(propsRef.current, [...rawEventKeys, ...removeProps]));
 };
 export default useInnerProps;

package/lib/runtime/components/react/dist/mpx-button.jsx

@@ -34,13 +34,13 @@
  * ✘ bindagreeprivacyauthorization
  * ✔ bindtap
  */
-import { useEffect, useRef, useState, forwardRef, useContext } from 'react';
+import { createElement, useEffect, useRef, useState, forwardRef, useContext } from 'react';
 import { View, StyleSheet, Animated, Easing } from 'react-native';
 import { warn } from '@mpxjs/utils';
-import { splitProps, splitStyle, useLayout, useTransformStyle, wrapChildren } from './utils';
+import { getCurrentPage, splitProps, splitStyle, useLayout, useTransformStyle, wrapChildren, extendObject } from './utils';
 import useInnerProps, { getCustomEvent } from './getInnerListeners';
 import useNodesRef from './useNodesRef';
-import { FormContext } from './context';
+import { RouteContext, FormContext } from './context';
 const LOADING_IMAGE_URI = 'data:image/png;base64,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';
 const TypeColorMap = {
     default: ['#F8F8F8', '#DEDEDE', '35,35,35', '#F7F7F7'],
@@ -78,6 +78,8 @@ const styles = StyleSheet.create({
     }
 });
 const getOpenTypeEvent = (openType) => {
+    if (!openType)
+        return;
     if (!global.__mpx?.config?.rnConfig) {
         warn('Environment not supported');
         return;
@@ -94,6 +96,11 @@ const getOpenTypeEvent = (openType) => {
     }
     return event;
 };
+const timer = (data, time = 3000) => new Promise((resolve) => {
+    setTimeout(() => {
+        resolve(data);
+    }, time);
+});
 const Loading = ({ alone = false }) => {
     const image = useRef(new Animated.Value(0)).current;
     const rotate = image.interpolate({
@@ -113,16 +120,16 @@ const Loading = ({ alone = false }) => {
             animation.stop();
         };
     }, []);
-    const loadingStyle = {
-        ...styles.loading,
+    const loadingStyle = extendObject({}, styles.loading, {
         transform: [{ rotate }],
         marginRight: alone ? 0 : 5
-    };
+    });
     return <Animated.Image testID="loading" style={loadingStyle} source={{ uri: LOADING_IMAGE_URI }}/>;
 };
 const Button = forwardRef((buttonProps, ref) => {
     const { textProps, innerProps: props = {} } = splitProps(buttonProps);
     const { size = 'default', type = 'default', plain = false, disabled = false, loading = false, 'hover-class': hoverClass, 'hover-style': hoverStyle = {}, 'hover-start-time': hoverStartTime = 20, 'hover-stay-time': hoverStayTime = 70, 'open-type': openType, 'form-type': formType, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, style = {}, children, bindgetuserinfo, bindtap, bindtouchstart, bindtouchend } = props;
+    const pageId = useContext(RouteContext);
     const formContext = useContext(FormContext);
     let submitFn;
     let resetFn;
@@ -159,44 +166,56 @@ const Button = forwardRef((buttonProps, ref) => {
         borderColor: plain ? plainBorderColor : normalBorderColor,
         backgroundColor: plain ? 'transparent' : normalBackgroundColor
     };
-    const defaultViewStyle = {
-        ...styles.button,
-        ...(isMiniSize && styles.buttonMini),
-        ...viewStyle
-    };
-    const defaultTextStyle = {
-        ...styles.text,
-        ...(isMiniSize && styles.textMini),
-        color: plain ? plainTextColor : normalTextColor
-    };
-    const defaultStyle = {
-        ...defaultViewStyle,
-        ...defaultTextStyle
-    };
-    const styleObj = {
-        ...defaultStyle,
-        ...style,
-        ...(applyHoverEffect && hoverStyle)
-    };
+    const defaultViewStyle = extendObject({}, styles.button, isMiniSize ? styles.buttonMini : null, viewStyle);
+    const defaultTextStyle = extendObject({}, styles.text, isMiniSize ? styles.textMini : {}, { color: plain ? plainTextColor : normalTextColor });
+    const defaultStyle = extendObject({}, defaultViewStyle, defaultTextStyle);
+    const styleObj = extendObject({}, defaultStyle, style, applyHoverEffect ? hoverStyle : {});
     const { hasSelfPercent, normalStyle, hasVarDec, varContextRef, setWidth, setHeight } = useTransformStyle(styleObj, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
     const nodeRef = useRef(null);
-    useNodesRef(props, ref, nodeRef, { defaultStyle });
+    useNodesRef(props, ref, nodeRef, { style: normalStyle });
     const { layoutRef, layoutStyle, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef });
-    const { textStyle, backgroundStyle, innerStyle } = splitStyle(normalStyle);
+    const { textStyle, backgroundStyle, innerStyle = {} } = splitStyle(normalStyle);
     if (backgroundStyle) {
         warn('Button does not support background image-related styles!');
     }
     const handleOpenTypeEvent = (evt) => {
-        if (!openType)
-            return;
         const handleEvent = getOpenTypeEvent(openType);
+        if (!handleEvent)
+            return;
         if (openType === 'share') {
-            handleEvent && handleEvent({
+            const currentPage = getCurrentPage(pageId);
+            const event = {
                 from: 'button',
-                target: getCustomEvent('tap', evt, { layoutRef }, props).target
-            });
+                target: getCustomEvent('tap', evt, { layoutRef }, props).target,
+                webViewUrl: currentPage?.__webViewUrl
+            };
+            if (currentPage) {
+                const defaultMessage = {
+                    title: global.__mpx.config.rnConfig.projectName || 'AwesomeProject',
+                    path: currentPage.route || ''
+                };
+                if (currentPage.onShareAppMessage) {
+                    const { promise, ...message } = currentPage.onShareAppMessage(event) || {};
+                    if (promise) {
+                        Promise.race([Promise.resolve(promise), timer(message)])
+                            .then((msg) => {
+                            handleEvent(Object.assign({}, defaultMessage, msg));
+                        });
+                    }
+                    else {
+                        handleEvent(Object.assign({}, defaultMessage, message));
+                    }
+                }
+                else {
+                    handleEvent(defaultMessage);
+                }
+            }
+            else {
+                warn('Current page not found');
+                // Todo handleEvent(event)
+            }
         }
-        if (openType === 'getUserInfo' && handleEvent && bindgetuserinfo) {
+        if (openType === 'getUserInfo' && bindgetuserinfo) {
             Promise.resolve(handleEvent)
                 .then((userInfo) => {
                 if (typeof userInfo === 'object') {
@@ -246,26 +265,35 @@ const Button = forwardRef((buttonProps, ref) => {
         handleOpenTypeEvent(evt);
         handleFormTypeFn();
     };
-    const innerProps = useInnerProps(props, {
+    const innerProps = useInnerProps(props, extendObject({
         ref: nodeRef,
-        style: { ...innerStyle, ...layoutStyle },
-        ...layoutProps,
-        bindtouchstart: onTouchStart,
-        bindtouchend: onTouchEnd,
-        bindtap: onTap
-    }, [], {
+        style: extendObject({}, innerStyle, layoutStyle)
+    }, layoutProps, {
+        bindtouchstart: (bindtouchstart || !disabled) && onTouchStart,
+        bindtouchend: (bindtouchend || !disabled) && onTouchEnd,
+        bindtap: !disabled && onTap
+    }), [
+        'disabled',
+        'size',
+        'type',
+        'plain',
+        'loading',
+        'hover-class',
+        'hover-style',
+        'hover-start-time',
+        'hover-stay-time',
+        'open-type',
+        'form-type'
+    ], {
         layoutRef,
         disableTap: disabled
     });
-    return (<View {...innerProps}>
-      {loading && <Loading alone={!children}/>}
-      {wrapChildren(props, {
-            hasVarDec,
-            varContext: varContextRef.current,
-            textStyle,
-            textProps
-        })}
-    </View>);
+    return createElement(View, innerProps, loading && createElement(Loading, { alone: !children }), wrapChildren(props, {
+        hasVarDec,
+        varContext: varContextRef.current,
+        textStyle,
+        textProps
+    }));
 });
 Button.displayName = 'MpxButton';
 export default Button;

package/lib/runtime/components/react/dist/mpx-canvas/Bus.js

@@ -0,0 +1,60 @@
+import { warn } from '@mpxjs/utils';
+export default class Bus {
+    _paused = false;
+    _messageListeners = {};
+    _queue = [];
+    _send;
+    _timeoutId = null;
+    constructor(send) {
+        this._send = send;
+    }
+    post(message) {
+        return new Promise((resolve) => {
+            if (message.type !== 'set' && message.id) {
+                this._messageListeners[message.id] = resolve;
+            }
+            if (!this._paused) {
+                this._queue.push(message);
+                this.startBatching();
+            }
+            else {
+                this._queue.push(message);
+            }
+        });
+    }
+    handle(message) {
+        if (!message.id)
+            return;
+        const handler = this._messageListeners[message.id];
+        delete this._messageListeners[message.id];
+        if (handler) {
+            handler(message);
+        }
+        else {
+            warn(`Received unexpected message: ${message}`);
+        }
+    }
+    pause() {
+        this._paused = true;
+    }
+    resume() {
+        this._paused = false;
+        this._send(this._queue);
+        this._queue = [];
+    }
+    startBatching() {
+        if (this._timeoutId)
+            return;
+        this._timeoutId = setTimeout(() => {
+            this._send(this._queue);
+            this._queue = [];
+            this._timeoutId = null;
+        }, 16);
+    }
+    clearBatchingTimeout() {
+        if (this._timeoutId) {
+            clearTimeout(this._timeoutId);
+            this._timeoutId = null;
+        }
+    }
+}