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

package/lib/runtime/components/react/dist/mpx-scroll-view.jsx

@@ -33,12 +33,12 @@
  */
 import { ScrollView } from 'react-native-gesture-handler';
 import { RefreshControl } from 'react-native';
-import { useRef, useState, useEffect, forwardRef, useContext } from 'react';
+import { useRef, useState, useEffect, forwardRef, useContext, createElement } from 'react';
 import { useAnimatedRef } from 'react-native-reanimated';
 import { warn } from '@mpxjs/utils';
 import useInnerProps, { getCustomEvent } from './getInnerListeners';
 import useNodesRef from './useNodesRef';
-import { splitProps, splitStyle, useTransformStyle, useLayout, wrapChildren, flatGesture } from './utils';
+import { splitProps, splitStyle, useTransformStyle, useLayout, wrapChildren, extendObject, flatGesture } from './utils';
 import { IntersectionObserverContext } from './context';
 const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     const { textProps, innerProps: props = {} } = splitProps(scrollViewProps);
@@ -60,11 +60,12 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     const hasCallScrollToLower = useRef(false);
     const initialTimeout = useRef(null);
     const intersectionObservers = useContext(IntersectionObserverContext);
-    const snapScrollIntoView = useRef('');
+    const firstScrollIntoViewChange = useRef(false);
     const { normalStyle, hasVarDec, varContextRef, hasSelfPercent, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
-    const { textStyle, innerStyle } = splitStyle(normalStyle);
+    const { textStyle, innerStyle = {} } = splitStyle(normalStyle);
     const scrollViewRef = useAnimatedRef();
     useNodesRef(props, ref, scrollViewRef, {
+        style: normalStyle,
         scrollOffset: scrollOptions,
         node: {
             scrollEnabled: scrollX || scrollY,
@@ -97,19 +98,25 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
         }
     }, [refresherTriggered]);
     useEffect(() => {
-        if (scrollIntoView && __selectRef && snapScrollIntoView.current !== scrollIntoView) {
-            snapScrollIntoView.current = scrollIntoView || '';
-            setTimeout(() => {
-                const refs = __selectRef(`#${scrollIntoView}`, 'node');
-                if (refs) {
-                    const { nodeRef } = refs.getNodeInstance();
-                    nodeRef.current?.measureLayout(scrollViewRef.current, (left, top) => {
-                        scrollToOffset(left, top);
-                    });
-                }
-            });
+        if (scrollIntoView && __selectRef) {
+            if (!firstScrollIntoViewChange.current) {
+                setTimeout(handleScrollIntoView);
+            }
+            else {
+                handleScrollIntoView();
+            }
         }
+        firstScrollIntoViewChange.current = true;
     }, [scrollIntoView]);
+    function handleScrollIntoView() {
+        const refs = __selectRef(`#${scrollIntoView}`, 'node');
+        if (!refs)
+            return;
+        const { nodeRef } = refs.getNodeInstance();
+        nodeRef.current?.measureLayout(scrollViewRef.current, (left, top) => {
+            scrollToOffset(left, top);
+        });
+    }
     function selectLength(size) {
         return !scrollX ? size.height : size.width;
     }
@@ -164,14 +171,13 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
         const visibleLength = selectLength(e.nativeEvent.layoutMeasurement);
         const contentLength = selectLength(e.nativeEvent.contentSize);
         const offset = selectOffset(e.nativeEvent.contentOffset);
-        scrollOptions.current = {
-            ...scrollOptions.current,
+        extendObject(scrollOptions.current, {
             contentLength,
             offset,
             scrollLeft: position.scrollLeft,
             scrollTop: position.scrollTop,
             visibleLength
-        };
+        });
     }
     function onScroll(e) {
         const { bindscroll } = props;
@@ -272,8 +278,8 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
         const { x: scrollLeft, y: scrollTop } = e.nativeEvent.contentOffset;
         updateScrollOptions(e, { scrollLeft, scrollTop });
     }
-    let scrollAdditionalProps = {
-        style: { ...innerStyle, ...layoutStyle },
+    const scrollAdditionalProps = extendObject({
+        style: extendObject({}, innerStyle, layoutStyle),
         pinchGestureEnabled: false,
         horizontal: scrollX && !scrollY,
         scrollEventThrottle: scrollEventThrottle,
@@ -284,22 +290,18 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
         ref: scrollViewRef,
         onScroll: onScroll,
         onContentSizeChange: onContentSizeChange,
-        bindtouchstart: ((enhanced && binddragstart) || bindtouchstart) ? onScrollTouchStart : undefined,
-        bindtouchmove: ((enhanced && binddragging) || bindtouchend) ? onScrollTouchMove : undefined,
-        bindtouchend: ((enhanced && binddragend) || bindtouchend) ? onScrollTouchEnd : undefined,
+        bindtouchstart: ((enhanced && binddragstart) || bindtouchstart) && onScrollTouchStart,
+        bindtouchmove: ((enhanced && binddragging) || bindtouchend) && onScrollTouchMove,
+        bindtouchend: ((enhanced && binddragend) || bindtouchend) && onScrollTouchEnd,
         onScrollBeginDrag: onScrollDrag,
         onScrollEndDrag: onScrollDrag,
-        onMomentumScrollEnd: onScrollEnd,
-        ...layoutProps,
-        ...(simultaneousHandlers ? { simultaneousHandlers } : {}),
-        ...(waitForHandlers ? { waitFor: waitForHandlers } : {})
-    };
+        onMomentumScrollEnd: onScrollEnd
+    }, (simultaneousHandlers ? { simultaneousHandlers } : {}), (waitForHandlers ? { waitFor: waitForHandlers } : {}), layoutProps);
     if (enhanced) {
-        scrollAdditionalProps = {
-            ...scrollAdditionalProps,
+        Object.assign(scrollAdditionalProps, {
             bounces,
             pagingEnabled
-        };
+        });
     }
     const innerProps = useInnerProps(props, scrollAdditionalProps, [
         'id',
@@ -332,16 +334,20 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
         black: ['#000'],
         white: ['#fff']
     };
-    return (<ScrollView {...innerProps} refreshControl={refresherEnabled
-            ? (<RefreshControl progressBackgroundColor={refresherBackground} refreshing={refreshing} onRefresh={onRefresh} {...(refresherDefaultStyle && refresherDefaultStyle !== 'none' ? { colors: refreshColor[refresherDefaultStyle] } : {})}/>)
-            : undefined}>
-       {wrapChildren(props, {
-            hasVarDec,
-            varContext: varContextRef.current,
-            textStyle,
-            textProps
-        })}
-    </ScrollView>);
+    return createElement(ScrollView, extendObject({}, innerProps, {
+        refreshControl: refresherEnabled
+            ? createElement(RefreshControl, extendObject({
+                progressBackgroundColor: refresherBackground,
+                refreshing: refreshing,
+                onRefresh: onRefresh
+            }, (refresherDefaultStyle && refresherDefaultStyle !== 'none' ? { colors: refreshColor[refresherDefaultStyle] } : null)))
+            : undefined
+    }), wrapChildren(props, {
+        hasVarDec,
+        varContext: varContextRef.current,
+        textStyle,
+        textProps
+    }));
 });
 _ScrollView.displayName = 'MpxScrollView';
 export default _ScrollView;

package/lib/runtime/components/react/dist/mpx-simple-text.jsx

@@ -0,0 +1,11 @@
+import { Text } from 'react-native';
+import { createElement } from 'react';
+import { extendObject } from './utils';
+const _Text2 = (props) => {
+    const { allowFontScaling = false } = props;
+    return createElement(Text, extendObject({}, props, {
+        allowFontScaling
+    }));
+};
+_Text2.displayName = 'MpxSimpleText';
+export default _Text2;

package/lib/runtime/components/react/dist/mpx-swiper-item.jsx

@@ -4,12 +4,14 @@ import useInnerProps from './getInnerListeners';
 import useNodesRef from './useNodesRef'; // 引入辅助函数
 import { useTransformStyle, splitStyle, splitProps, wrapChildren, useLayout } from './utils';
 const _SwiperItem = forwardRef((props, ref) => {
-    const { 'enable-offset': enableOffset, 'enable-var': enableVar, 'external-var-context': externalVarContext, style } = props;
+    const { 'enable-var': enableVar, 'external-var-context': externalVarContext, style } = props;
     const { textProps } = splitProps(props);
     const nodeRef = useRef(null);
-    useNodesRef(props, ref, nodeRef, {});
     const { normalStyle, hasVarDec, varContextRef, hasSelfPercent, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext });
     const { textStyle, innerStyle } = splitStyle(normalStyle);
+    useNodesRef(props, ref, nodeRef, {
+        style: normalStyle
+    });
     const { 
     // 存储layout布局信息
     layoutRef, layoutProps, layoutStyle } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef: nodeRef });