@mpxjs/webpack-plugin 2.10.20 → 2.10.22

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

@@ -13,7 +13,7 @@
 import { useEffect, useMemo, useState, useRef, forwardRef, createElement } from 'react';
 import { Image as RNImage, View } from 'react-native';
 import { noop } from '@mpxjs/utils';
-import { SvgCssUri } from 'react-native-svg/css';
+import { LocalSvg, SvgCssUri } from 'react-native-svg/css';
 import useInnerProps, { getCustomEvent } from './getInnerListeners';
 import useNodesRef from './useNodesRef';
 import { SVG_REGEXP, useLayout, useTransformStyle, renderImage, extendObject, isAndroid } from './utils';
@@ -43,6 +43,29 @@ const isNumber = (value) => typeof value === 'number';
 const relativeCenteredSize = (viewSize, imageSize) => {
     return (viewSize - imageSize) / 2;
 };
+function normalizeImageSource(src) {
+    return typeof src === 'string' ? { uri: src } : src;
+}
+function getImageUri(src) {
+    return typeof src === 'string' ? src : RNImage.resolveAssetSource(src)?.uri || '';
+}
+function isSvgSource(src) {
+    const uri = getImageUri(src);
+    return SVG_REGEXP.test(uri);
+}
+function getImageSize(src, success, fail = noop) {
+    if (typeof src === 'string') {
+        RNImage.getSize(src, success, fail);
+        return;
+    }
+    const source = RNImage.resolveAssetSource(src);
+    if (source && source.width && source.height) {
+        success(source.width, source.height);
+    }
+    else {
+        fail();
+    }
+}
 // 获取能完全显示图片的缩放比例：长宽方向的缩放比例最小值即为能完全展示的比例
 function getFitScale(width1, height1, width2, height2) {
     return Math.min(width2 / width1, height2 / height1);
@@ -69,7 +92,7 @@ const getFixedHeight = (viewWidth, viewHeight, ratio) => {
     return !fixed ? viewHeight : fixed;
 };
 const Image = forwardRef((props, ref) => {
-    const { src = '', mode = 'scaleToFill', style = {}, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'enable-fast-image': enableFastImage, 'parent-width': parentWidth, 'parent-height': parentHeight, bindload, binderror } = props;
+    const { src = '', mode = 'scaleToFill', style = {}, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'enable-fast-image': enableFastImage, 'parent-width': parentWidth, 'parent-height': parentHeight, 'is-svg': isSvgProp, bindload, binderror } = props;
     const defaultStyle = {
         width: DEFAULT_IMAGE_WIDTH,
         height: DEFAULT_IMAGE_HEIGHT
@@ -79,7 +102,7 @@ const Image = forwardRef((props, ref) => {
     useNodesRef(props, ref, nodeRef, {
         defaultStyle
     });
-    const isSvg = SVG_REGEXP.test(src);
+    const isSvg = isSvgProp || isSvgSource(src);
     const isWidthFixMode = mode === 'widthFix';
     const isHeightFixMode = mode === 'heightFix';
     const isCropMode = cropMode.includes(mode);
@@ -270,12 +293,18 @@ const Image = forwardRef((props, ref) => {
     };
     const onImageLoad = (evt) => {
         evt.persist();
-        RNImage.getSize(src, (width, height) => {
+        const triggerLoad = (width, height) => {
             bindload(getCustomEvent('load', evt, {
                 detail: { width, height },
                 layoutRef
             }, props));
-        });
+        };
+        const { source } = evt.nativeEvent;
+        if (source && source.width && source.height) {
+            triggerLoad(source.width, source.height);
+            return;
+        }
+        getImageSize(src, triggerLoad);
     };
     const onImageError = (evt) => {
         binderror(getCustomEvent('error', evt, {
@@ -285,7 +314,7 @@ const Image = forwardRef((props, ref) => {
     };
     useEffect(() => {
         if (!isSvg && isLayoutMode) {
-            RNImage.getSize(src, (width, height) => {
+            getImageSize(src, (width, height) => {
                 state.current.imageWidth = width;
                 state.current.imageHeight = height;
                 state.current.ratio = !width ? 0 : height / width;
@@ -310,21 +339,26 @@ const Image = forwardRef((props, ref) => {
         style: extendObject({}, normalStyle, layoutStyle, isHeightFixMode ? { width: viewWidth } : {}, isWidthFixMode ? { height: viewHeight } : {})
     }), [
         'src',
-        'mode'
+        'mode',
+        'is-svg',
+        'enable-fast-image',
+        'bindload',
+        'binderror'
     ], {
         layoutRef
     });
     function renderSvgImage() {
-        return createElement(View, innerProps, createElement(SvgCssUri, {
-            uri: src,
+        const svgProps = {
             onLayout: onSvgLoad,
-            onError: binderror && onSvgError,
             style: extendObject({ transformOrigin: 'left top' }, modeStyle)
-        }));
+        };
+        return createElement(View, innerProps, typeof src === 'string'
+            ? createElement(SvgCssUri, extendObject({ uri: src, onError: binderror && onSvgError }, svgProps))
+            : createElement(LocalSvg, extendObject({ asset: src }, svgProps)));
     }
     function renderBaseImage() {
         return renderImage(extendObject({
-            source: { uri: src },
+            source: normalizeImageSource(src),
             resizeMode: resizeMode,
             onLoad: bindload && onImageLoad,
             onError: binderror && onImageError,

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

@@ -1,11 +1,15 @@
 import { Text } from 'react-native';
-import { createElement } from 'react';
-import { extendObject } from './utils';
+import { createElement, useContext } from 'react';
+import { extendObject, getDefaultAllowFontScaling } from './utils';
+import { TextPassThroughContext } from './context';
 const InlineText = (props) => {
-    const { allowFontScaling = false } = props;
-    return createElement(Text, extendObject({}, props, {
-        allowFontScaling
-    }));
+    const inheritedText = useContext(TextPassThroughContext);
+    const style = extendObject({}, inheritedText?.textStyle, props.style);
+    const mergedProps = extendObject({}, inheritedText?.pendingTextProps, props, { style });
+    const { allowFontScaling, children } = mergedProps;
+    return createElement(Text, extendObject({}, mergedProps, {
+        allowFontScaling: allowFontScaling ?? getDefaultAllowFontScaling()
+    }), children);
 };
 InlineText.displayName = 'MpxInlineText';
 export default InlineText;

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

@@ -40,7 +40,7 @@
 import { forwardRef, useRef, useState, useContext, useEffect, createElement } from 'react';
 import { TextInput } from 'react-native';
 import { warn } from '@mpxjs/utils';
-import { useUpdateEffect, useTransformStyle, useLayout, extendObject, isAndroid } from './utils';
+import { useUpdateEffect, useTransformStyle, useLayout, extendObject, isAndroid, getDefaultAllowFontScaling } from './utils';
 import useInnerProps, { getCustomEvent } from './getInnerListeners';
 import useNodesRef from './useNodesRef';
 import { FormContext, KeyboardAvoidContext } from './context';
@@ -52,7 +52,7 @@ const inputModeMap = {
     digit: 'decimal'
 };
 const Input = forwardRef((props, ref) => {
-    const { style = {}, allowFontScaling = false, type = 'text', value, password, 'placeholder-style': placeholderStyle = {}, disabled, maxlength = 140, 'cursor-spacing': cursorSpacing = 0, 'auto-focus': autoFocus, focus, 'confirm-type': confirmType = 'done', 'confirm-hold': confirmHold = false, cursor, 'cursor-color': cursorColor, 'selection-start': selectionStart = -1, 'selection-end': selectionEnd = -1, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, 'adjust-position': adjustPosition = true, 'keyboard-type': originalKeyboardType, 'hold-keyboard': holdKeyboard = false, bindinput, bindfocus, bindblur, bindconfirm, bindselectionchange, 
+    const { style = {}, allowFontScaling, type = 'text', value, password, 'placeholder-style': placeholderStyle = {}, disabled, maxlength = 140, 'cursor-spacing': cursorSpacing = 0, 'auto-focus': autoFocus, focus, 'confirm-type': confirmType = 'done', 'confirm-hold': confirmHold = false, cursor, 'cursor-color': cursorColor, 'selection-start': selectionStart = -1, 'selection-end': selectionEnd = -1, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, 'adjust-position': adjustPosition = true, 'keyboard-type': originalKeyboardType, 'hold-keyboard': holdKeyboard = false, bindinput, bindfocus, bindblur, bindconfirm, bindselectionchange, 
     // private
     multiline, 'auto-height': autoHeight, bindlinechange } = props;
     const formContext = useContext(FormContext);
@@ -290,7 +290,7 @@ const Input = forwardRef((props, ref) => {
     const innerProps = useInnerProps(extendObject({}, props, layoutProps, {
         ref: nodeRef,
         style: extendObject({}, normalStyle, layoutStyle),
-        allowFontScaling,
+        allowFontScaling: allowFontScaling ?? getDefaultAllowFontScaling(),
         inputMode: originalKeyboardType ? undefined : inputModeMap[type],
         keyboardType: originalKeyboardType,
         secureTextEntry: !!password,
@@ -315,7 +315,14 @@ const Input = forwardRef((props, ref) => {
         onContentSizeChange,
         onSubmitEditing: bindconfirm && onSubmitEditing
     }, needMultilineFix ? { numberOfLines: 1 } : {}, !!multiline && confirmType === 'return' ? {} : { enterKeyHint: confirmType }), [
+        'name',
         'type',
+        'maxlength',
+        'cursor-spacing',
+        'adjust-position',
+        'hold-keyboard',
+        'keyboard-type',
+        'auto-height',
         'password',
         'placeholder-style',
         'disabled',
@@ -326,7 +333,13 @@ const Input = forwardRef((props, ref) => {
         'cursor',
         'cursor-color',
         'selection-start',
-        'selection-end'
+        'selection-end',
+        'bindinput',
+        'bindfocus',
+        'bindblur',
+        'bindconfirm',
+        'bindselectionchange',
+        'bindlinechange'
     ], {
         layoutRef
     });

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

@@ -6,7 +6,7 @@ import { View } from 'react-native';
 import { noop, warn } from '@mpxjs/utils';
 import useInnerProps, { getCustomEvent } from './getInnerListeners';
 import useNodesRef from './useNodesRef';
-import { splitProps, splitStyle, useLayout, useTransformStyle, wrapChildren, extendObject } from './utils';
+import { splitProps, splitStyle, useLayout, useTransformStyle, wrapChildren, extendObject, useTextPassThroughValue } from './utils';
 import { LabelContext } from './context';
 import Portal from './mpx-portal';
 const Label = forwardRef((labelProps, ref) => {
@@ -23,6 +23,7 @@ const Label = forwardRef((labelProps, ref) => {
     useNodesRef(props, ref, nodeRef, { style: normalStyle });
     const { layoutRef, layoutStyle, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef });
     const { textStyle, backgroundStyle, innerStyle = {} } = splitStyle(normalStyle);
+    const textPassThrough = useTextPassThroughValue(textStyle, textProps);
     if (backgroundStyle) {
         warn('Label does not support background image-related styles!');
     }
@@ -38,14 +39,15 @@ const Label = forwardRef((labelProps, ref) => {
         ref: nodeRef,
         style: extendObject({}, innerStyle, layoutStyle),
         bindtap: onTap
-    }), [], {
+    }), [
+        'for'
+    ], {
         layoutRef
     });
     const finalComponent = createElement(View, innerProps, createElement(LabelContext.Provider, { value: contextRef }, wrapChildren(props, {
         hasVarDec,
         varContext: varContextRef.current,
-        textStyle,
-        textProps
+        textPassThrough
     })));
     if (hasPositionFixed) {
         return createElement(Portal, null, finalComponent);

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

@@ -22,7 +22,7 @@ import { StyleSheet } from 'react-native';
 import useInnerProps, { getCustomEvent } from './getInnerListeners';
 import useNodesRef from './useNodesRef';
 import { MovableAreaContext } from './context';
-import { useTransformStyle, splitProps, splitStyle, HIDDEN_STYLE, wrapChildren, flatGesture, extendObject, omit, useNavigation, useRunOnJSCallback } from './utils';
+import { useTransformStyle, splitProps, splitStyle, HIDDEN_STYLE, wrapChildren, flatGesture, extendObject, omit, useNavigation, useRunOnJSCallback, useTextPassThroughValue } from './utils';
 import { GestureDetector, Gesture } from 'react-native-gesture-handler';
 import Animated, { useSharedValue, useAnimatedStyle, runOnJS, runOnUI, withTiming, Easing } from 'react-native-reanimated';
 import { collectDataset, noop } from '@mpxjs/utils';
@@ -136,6 +136,7 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
     const prevWaitForHandlersRef = useRef(waitFor || []);
     const gestureSwitch = useRef(false);
     const { textStyle, innerStyle } = splitStyle(normalStyle);
+    const textPassThrough = useTextPassThroughValue(textStyle, textProps);
     const offsetX = useSharedValue(x);
     const offsetY = useSharedValue(y);
     const startPosition = useSharedValue({
@@ -582,12 +583,26 @@ const _MovableView = forwardRef((movableViewProps, ref) => {
         ref: nodeRef,
         onLayout: onLayout,
         style: [innerStyle, animatedStyles, layoutStyle]
-    }, rewriteCatchEvent()));
+    }, rewriteCatchEvent()), [
+        'direction',
+        'x',
+        'y',
+        'disabled',
+        'animation',
+        'damping',
+        'friction',
+        'out-of-bounds',
+        'inertia',
+        'wait-for',
+        'simultaneous-handlers',
+        'disable-event-passthrough',
+        'changeThrottleTime',
+        'bindchange'
+    ]);
     return createElement(GestureDetector, { gesture: gesture }, createElement(Animated.View, innerProps, wrapChildren(props, {
         hasVarDec,
         varContext: varContextRef.current,
-        textStyle,
-        textProps
+        textPassThrough
     })));
 });
 _MovableView.displayName = 'MpxMovableView';

package/lib/runtime/components/react/dist/mpx-picker/index.jsx

@@ -120,7 +120,17 @@ const Picker = forwardRef((props, ref) => {
     });
     const innerProps = useInnerProps(extendObject({}, props, {
         ref: nodeRef
-    }, layoutProps), [], { layoutRef });
+    }, layoutProps), [
+        'mode',
+        'value',
+        'range',
+        'disabled',
+        'bindcancel',
+        'bindchange',
+        'header-text',
+        'name',
+        'bindcolumnchange'
+    ], { layoutRef });
     useEffect(() => {
         if (range && pickerRef.current && mode === "multiSelector" /* PickerMode.MULTI_SELECTOR */) {
             pickerRef.current.updateRange?.(range);
@@ -175,7 +185,7 @@ const Picker = forwardRef((props, ref) => {
         bindchange?.(eventData);
         hide();
     };
-    const specificProps = extendObject(innerProps, {
+    const specificProps = extendObject({}, innerProps, {
         mode,
         children,
         bindchange: onChange,

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

@@ -2,7 +2,7 @@ import { View } from 'react-native';
 import React, { createElement, forwardRef, useRef } from 'react';
 import useInnerProps, { getCustomEvent } from '../getInnerListeners';
 import useNodesRef from '../useNodesRef';
-import { useLayout, splitProps, splitStyle, wrapChildren, useTransformStyle, extendObject } from '../utils';
+import { useLayout, splitProps, splitStyle, wrapChildren, useTransformStyle, extendObject, useTextPassThroughValue } from '../utils';
 import { PickerViewStyleContext } from './pickerVIewContext';
 import Portal from '../mpx-portal';
 const styles = {
@@ -31,6 +31,7 @@ const _PickerView = forwardRef((props, ref) => {
     const { layoutRef, layoutProps, layoutStyle } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef: nodeRef });
     const { textProps } = splitProps(props);
     const { textStyle } = splitStyle(normalStyle);
+    const textPassThrough = useTextPassThroughValue(textStyle, textProps);
     const onSelectChange = (columnIndex, selectedIndex) => {
         const activeValue = activeValueRef.current;
         activeValue[columnIndex] = selectedIndex;
@@ -59,7 +60,10 @@ const _PickerView = forwardRef((props, ref) => {
         'indicator-style',
         'indicator-class',
         'mask-style',
-        'mask-class'
+        'mask-class',
+        'value',
+        'bindchange',
+        'enable-wheel-animation'
     ], { layoutRef });
     const renderColumn = (child, index, columnData, initialIndex) => {
         const childProps = child?.props || {};
@@ -84,8 +88,7 @@ const _PickerView = forwardRef((props, ref) => {
         }, {
             hasVarDec,
             varContext: varContextRef.current,
-            textStyle,
-            textProps
+            textPassThrough
         });
     };
     const validateChildInitialIndex = (index, data) => {

package/lib/runtime/components/react/dist/mpx-portal/index.jsx

@@ -1,12 +1,16 @@
 import { useContext, useEffect, useRef } from 'react';
-import { PortalContext, ProviderContext, RouteContext, VarContext } from '../context';
+import { PortalContext, ProviderContext, RouteContext, VarContext, TextPassThroughContext } from '../context';
 import PortalHost, { portal } from './portal-host';
 const Portal = ({ children }) => {
     const manager = useContext(PortalContext);
     const keyRef = useRef(null);
     const { pageId } = useContext(RouteContext) || {};
     const varContext = useContext(VarContext);
+    const textPassThroughContext = useContext(TextPassThroughContext);
     const parentProvides = useContext(ProviderContext);
+    if (textPassThroughContext) {
+        children = (<TextPassThroughContext.Provider value={textPassThroughContext} key='textPassThroughWrap'>{children}</TextPassThroughContext.Provider>);
+    }
     if (varContext) {
         children = (<VarContext.Provider value={varContext} key='varContextWrap'>{children}</VarContext.Provider>);
     }

package/lib/runtime/components/react/dist/mpx-radio-group.jsx

@@ -75,7 +75,10 @@ const radioGroup = forwardRef((props, ref) => {
     const innerProps = useInnerProps(extendObject({}, props, layoutProps, {
         ref: nodeRef,
         style: extendObject({}, normalStyle, layoutStyle)
-    }), ['name'], {
+    }), [
+        'name',
+        'bindchange'
+    ], {
         layoutRef
     });
     const finalComponent = createElement(View, innerProps, createElement(RadioGroupContext.Provider, {

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

@@ -10,7 +10,7 @@ import { warn } from '@mpxjs/utils';
 import { LabelContext, RadioGroupContext } from './context';
 import useInnerProps, { getCustomEvent } from './getInnerListeners';
 import useNodesRef from './useNodesRef';
-import { splitProps, splitStyle, useLayout, useTransformStyle, wrapChildren, extendObject } from './utils';
+import { splitProps, splitStyle, useLayout, useTransformStyle, wrapChildren, extendObject, useTextPassThroughValue } from './utils';
 import Icon from './mpx-icon';
 import Portal from './mpx-portal';
 const styles = StyleSheet.create({
@@ -76,6 +76,7 @@ const Radio = forwardRef((radioProps, ref) => {
     };
     const { hasPositionFixed, hasSelfPercent, normalStyle, hasVarDec, varContextRef, setWidth, setHeight } = useTransformStyle(styleObj, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
     const { textStyle, backgroundStyle, innerStyle = {} } = splitStyle(normalStyle);
+    const textPassThrough = useTextPassThroughValue(textStyle, textProps);
     if (backgroundStyle) {
         warn('Radio does not support background image-related styles!');
     }
@@ -99,7 +100,8 @@ const Radio = forwardRef((radioProps, ref) => {
     }), [
         'value',
         'disabled',
-        'checked'
+        'checked',
+        'color'
     ], {
         layoutRef
     });
@@ -132,8 +134,7 @@ const Radio = forwardRef((radioProps, ref) => {
     })), wrapChildren(props, {
         hasVarDec,
         varContext: varContextRef.current,
-        textStyle,
-        textProps
+        textPassThrough
     }));
     if (hasPositionFixed) {
         return createElement(Portal, null, finalComponent);

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

@@ -48,7 +48,9 @@ const _RichText = forwardRef((props, ref) => {
     const innerProps = useInnerProps(extendObject({}, props, layoutProps, {
         ref: nodeRef,
         style: extendObject(normalStyle, layoutStyle)
-    }), [], {
+    }), [
+        'nodes'
+    ], {
         layoutRef
     });
     const html = typeof nodes === 'string' ? nodes : jsonToHtmlStr(nodes);

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

@@ -38,7 +38,7 @@ import Animated, { useSharedValue, withTiming, useAnimatedStyle, runOnJS } from
 import { warn, hasOwn } from '@mpxjs/utils';
 import useInnerProps, { getCustomEvent } from './getInnerListeners';
 import useNodesRef from './useNodesRef';
-import { splitProps, splitStyle, useTransformStyle, useLayout, wrapChildren, extendObject, flatGesture, HIDDEN_STYLE, useRunOnJSCallback } from './utils';
+import { splitProps, splitStyle, useTransformStyle, useLayout, wrapChildren, extendObject, flatGesture, HIDDEN_STYLE, useRunOnJSCallback, useTextPassThroughValue } from './utils';
 import { IntersectionObserverContext, ScrollViewContext } from './context';
 import Portal from './mpx-portal';
 const AnimatedScrollView = RNAnimated.createAnimatedComponent(ScrollView);
@@ -77,6 +77,7 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
     const isContentSizeChange = useRef(false);
     const { normalStyle, hasVarDec, varContextRef, hasSelfPercent, hasPositionFixed, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
     const { textStyle, innerStyle = {} } = splitStyle(normalStyle);
+    const textPassThrough = useTextPassThroughValue(textStyle, textProps);
     const scrollViewRef = useRef(null);
     const propsRef = useRef(props);
     const refresherStateRef = useRef({
@@ -644,7 +645,15 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
         'refresher-triggered',
         'refresher-enabled',
         'refresher-default-style',
+        'refresher-threshold',
         'refresher-background',
+        'scroll-into-view',
+        'enable-sticky',
+        'wait-for',
+        'simultaneous-handlers',
+        'scroll-event-throttle',
+        'scroll-into-view-offset',
+        '__selectRef',
         'children',
         'enhanced',
         'binddragstart',
@@ -653,15 +662,15 @@ const _ScrollView = forwardRef((scrollViewProps = {}, ref) => {
         'bindscroll',
         'bindscrolltoupper',
         'bindscrolltolower',
-        'bindrefresherrefresh'
+        'bindrefresherrefresh',
+        'bindscrollend'
     ], { layoutRef });
     const ScrollViewComponent = enableSticky ? AnimatedScrollView : ScrollView;
     const createScrollViewContent = () => {
         const wrappedChildren = wrapChildren(hasRefresher ? extendObject({}, props, { children: otherContent }) : props, {
             hasVarDec,
             varContext: varContextRef.current,
-            textStyle,
-            textProps
+            textPassThrough
         });
         return createElement(ScrollViewContext.Provider, { value: contextValue }, wrappedChildren);
     };

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

@@ -1,13 +1,59 @@
 import { Text } from 'react-native';
-import { createElement } from 'react';
+import { createElement, useContext } from 'react';
 import useInnerProps from './getInnerListeners';
-import { extendObject } from './utils';
+import { extendObject, getDefaultAllowFontScaling, useTextPassThroughValue, wrapChildren, isStringChildren, transformBoxSizing, splitStyle, isBoxSizingAffectingStyle } from './utils';
+import { TextPassThroughContext } from './context';
+import * as perf from '@mpxjs/perf';
 const SimpleText = (props) => {
-    const { allowFontScaling = false, children } = props;
-    const innerProps = useInnerProps(extendObject({}, props, {
-        allowFontScaling
+    let stopTotal;
+    if (__mpx_perf_framework__)
+        stopTotal = perf.scope('simple-text:render:total');
+    // ───── style 阶段 ─────
+    let stopStyle;
+    if (__mpx_perf_framework__)
+        stopStyle = perf.scope('simple-text:render:style');
+    const inheritedText = useContext(TextPassThroughContext);
+    const mergedStyle = extendObject({}, inheritedText?.textStyle, props.style);
+    let hasBoxSizingAffectingStyle = false;
+    const { textStyle = {} } = splitStyle(mergedStyle, (key) => {
+        if (!hasBoxSizingAffectingStyle && isBoxSizingAffectingStyle(key)) {
+            hasBoxSizingAffectingStyle = true;
+        }
+    });
+    const finalStyle = transformBoxSizing(mergedStyle, hasBoxSizingAffectingStyle);
+    const mergedProps = extendObject({}, inheritedText?.pendingTextProps, props);
+    const { allowFontScaling, children } = mergedProps;
+    const isStringOnly = isStringChildren(children);
+    const childTextStyle = !isStringOnly && Object.keys(textStyle).length ? textStyle : undefined;
+    const childTextPassThrough = useTextPassThroughValue(childTextStyle, undefined, {
+        inheritTextProps: false,
+        disabled: isStringOnly
+    });
+    if (__mpx_perf_framework__)
+        stopStyle();
+    // ───── innerProps 阶段 ─────
+    let stopInnerProps;
+    if (__mpx_perf_framework__)
+        stopInnerProps = perf.scope('simple-text:render:innerProps');
+    const innerProps = useInnerProps(extendObject({}, mergedProps, {
+        allowFontScaling: allowFontScaling ?? getDefaultAllowFontScaling(),
+        style: finalStyle
     }));
-    return createElement(Text, innerProps, children);
+    if (__mpx_perf_framework__)
+        stopInnerProps();
+    // ───── createElement 阶段 ─────
+    let stopCreate;
+    if (__mpx_perf_framework__)
+        stopCreate = perf.scope('simple-text:render:createElement');
+    const result = createElement(Text, innerProps, wrapChildren({ children }, {
+        hasVarDec: false,
+        textPassThrough: childTextPassThrough
+    }));
+    if (__mpx_perf_framework__)
+        stopCreate();
+    if (__mpx_perf_framework__)
+        stopTotal();
+    return result;
 };
 SimpleText.displayName = 'MpxSimpleText';
 export default SimpleText;

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

@@ -1,18 +1,48 @@
 import { View } from 'react-native';
 import { createElement } from 'react';
-import { splitProps, splitStyle, wrapChildren, extendObject } from './utils';
+import { splitProps, splitStyle, wrapChildren, extendObject, useTextPassThroughValue, transformBoxSizing, isBoxSizingAffectingStyle } from './utils';
 import useInnerProps from './getInnerListeners';
+import * as perf from '@mpxjs/perf';
 const SimpleView = (simpleViewProps) => {
+    let stopTotal;
+    if (__mpx_perf_framework__)
+        stopTotal = perf.scope('simple-view:render:total');
+    // ───── style 阶段 ─────
+    let stopStyle;
+    if (__mpx_perf_framework__)
+        stopStyle = perf.scope('simple-view:render:style');
     const { textProps, innerProps: props = {} } = splitProps(simpleViewProps);
-    const { textStyle, innerStyle = {} } = splitStyle(props.style || {});
+    let hasBoxSizingAffectingStyle = false;
+    const { textStyle, innerStyle = {} } = splitStyle(props.style || {}, (key) => {
+        if (!hasBoxSizingAffectingStyle && isBoxSizingAffectingStyle(key)) {
+            hasBoxSizingAffectingStyle = true;
+        }
+    });
+    const textPassThrough = useTextPassThroughValue(textStyle, textProps);
+    if (__mpx_perf_framework__)
+        stopStyle();
+    // ───── innerProps 阶段 ─────
+    let stopInnerProps;
+    if (__mpx_perf_framework__)
+        stopInnerProps = perf.scope('simple-view:render:innerProps');
     const innerProps = useInnerProps(extendObject({}, props, {
-        style: innerStyle
+        style: transformBoxSizing(extendObject({}, innerStyle), hasBoxSizingAffectingStyle)
     }));
-    return createElement(View, innerProps, wrapChildren(props, {
+    if (__mpx_perf_framework__)
+        stopInnerProps();
+    // ───── createElement 阶段 ─────
+    let stopCreate;
+    if (__mpx_perf_framework__)
+        stopCreate = perf.scope('simple-view:render:createElement');
+    const result = createElement(View, innerProps, wrapChildren(props, {
         hasVarDec: false,
-        textStyle: textStyle,
-        textProps
+        textPassThrough
     }));
+    if (__mpx_perf_framework__)
+        stopCreate();
+    if (__mpx_perf_framework__)
+        stopTotal();
+    return result;
 };
 SimpleView.displayName = 'MpxSimpleView';
 export default SimpleView;

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

@@ -289,7 +289,8 @@ const Slider = forwardRef((props, ref) => {
         'bindchange',
         'catchchange',
         'bindchanging',
-        'catchchanging'
+        'catchchanging',
+        'name'
     ], { layoutRef });
     const sliderContent = createElement(View, extendObject({}, innerProps, { style: containerStyle }), 
     // 轨道容器

package/lib/runtime/components/react/dist/mpx-sticky-header.jsx

@@ -2,7 +2,7 @@ import { useEffect, useRef, useContext, forwardRef, useMemo, createElement, useI
 import { Animated, StyleSheet, useAnimatedValue } from 'react-native';
 import { ScrollViewContext, StickyContext } from './context';
 import useNodesRef from './useNodesRef';
-import { splitProps, splitStyle, useTransformStyle, wrapChildren, useLayout, extendObject } from './utils';
+import { splitProps, splitStyle, useTransformStyle, wrapChildren, useLayout, extendObject, useTextPassThroughValue } from './utils';
 import { error } from '@mpxjs/utils';
 import useInnerProps, { getCustomEvent } from './getInnerListeners';
 const _StickyHeader = forwardRef((stickyHeaderProps = {}, ref) => {
@@ -17,6 +17,7 @@ const _StickyHeader = forwardRef((stickyHeaderProps = {}, ref) => {
     const { normalStyle, hasVarDec, varContextRef, hasSelfPercent, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
     const { layoutRef, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef: headerRef, onLayout });
     const { textStyle, innerStyle = {} } = splitStyle(normalStyle);
+    const textPassThrough = useTextPassThroughValue(textStyle, textProps);
     const headerTopAnimated = useAnimatedValue(0);
     // harmony animatedValue 不支持通过 _value 访问
     const headerTopRef = useRef(0);
@@ -97,12 +98,15 @@ const _StickyHeader = forwardRef((stickyHeaderProps = {}, ref) => {
             paddingBottom: padding[2] || 0,
             paddingLeft: padding[3] || 0
         })
-    }, layoutProps), [], { layoutRef });
+    }, layoutProps), [
+        'padding',
+        'offset-top',
+        'bindstickontopchange'
+    ], { layoutRef });
     return (createElement(Animated.View, innerProps, wrapChildren(props, {
         hasVarDec,
         varContext: varContextRef.current,
-        textStyle,
-        textProps
+        textPassThrough
     })));
 });
 const styles = StyleSheet.create({