@mpxjs/webpack-plugin 2.10.20 → 2.10.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (92) hide show
  1. package/lib/index.js +13 -1
  2. package/lib/parser.js +1 -1
  3. package/lib/platform/style/wx/index.js +78 -30
  4. package/lib/platform/template/wx/component-config/block.js +2 -1
  5. package/lib/platform/template/wx/component-config/unsupported.js +1 -1
  6. package/lib/react/processTemplate.js +23 -10
  7. package/lib/react/style-helper.js +1 -1
  8. package/lib/react/template-loader.js +15 -2
  9. package/lib/runtime/components/react/context.ts +8 -1
  10. package/lib/runtime/components/react/dist/context.d.ts +6 -1
  11. package/lib/runtime/components/react/dist/context.js +1 -0
  12. package/lib/runtime/components/react/dist/getInnerListeners.js +1 -0
  13. package/lib/runtime/components/react/dist/mpx-button.d.ts +1 -1
  14. package/lib/runtime/components/react/dist/mpx-button.jsx +6 -5
  15. package/lib/runtime/components/react/dist/mpx-camera.jsx +1 -0
  16. package/lib/runtime/components/react/dist/mpx-canvas/index.jsx +4 -1
  17. package/lib/runtime/components/react/dist/mpx-checkbox-group.jsx +2 -1
  18. package/lib/runtime/components/react/dist/mpx-checkbox.jsx +6 -4
  19. package/lib/runtime/components/react/dist/mpx-form.jsx +3 -3
  20. package/lib/runtime/components/react/dist/mpx-icon/index.jsx +5 -1
  21. package/lib/runtime/components/react/dist/mpx-image.d.ts +3 -2
  22. package/lib/runtime/components/react/dist/mpx-image.jsx +46 -12
  23. package/lib/runtime/components/react/dist/mpx-inline-text.jsx +10 -6
  24. package/lib/runtime/components/react/dist/mpx-input.jsx +17 -4
  25. package/lib/runtime/components/react/dist/mpx-label.jsx +6 -4
  26. package/lib/runtime/components/react/dist/mpx-movable-view.jsx +19 -4
  27. package/lib/runtime/components/react/dist/mpx-picker/index.jsx +12 -2
  28. package/lib/runtime/components/react/dist/mpx-picker-view/index.jsx +7 -4
  29. package/lib/runtime/components/react/dist/mpx-portal/index.jsx +5 -1
  30. package/lib/runtime/components/react/dist/mpx-radio-group.jsx +4 -1
  31. package/lib/runtime/components/react/dist/mpx-radio.jsx +5 -4
  32. package/lib/runtime/components/react/dist/mpx-rich-text/index.jsx +3 -1
  33. package/lib/runtime/components/react/dist/mpx-scroll-view.jsx +13 -4
  34. package/lib/runtime/components/react/dist/mpx-simple-text.jsx +52 -6
  35. package/lib/runtime/components/react/dist/mpx-simple-view.jsx +36 -6
  36. package/lib/runtime/components/react/dist/mpx-slider.jsx +2 -1
  37. package/lib/runtime/components/react/dist/mpx-sticky-header.jsx +8 -4
  38. package/lib/runtime/components/react/dist/mpx-sticky-section.jsx +6 -4
  39. package/lib/runtime/components/react/dist/mpx-swiper-item.jsx +7 -4
  40. package/lib/runtime/components/react/dist/mpx-swiper.jsx +15 -4
  41. package/lib/runtime/components/react/dist/mpx-switch.jsx +4 -1
  42. package/lib/runtime/components/react/dist/mpx-text.jsx +57 -12
  43. package/lib/runtime/components/react/dist/mpx-video.d.ts +2 -1
  44. package/lib/runtime/components/react/dist/mpx-video.jsx +10 -4
  45. package/lib/runtime/components/react/dist/mpx-view.jsx +42 -7
  46. package/lib/runtime/components/react/dist/utils.d.ts +21 -11
  47. package/lib/runtime/components/react/dist/utils.jsx +102 -33
  48. package/lib/runtime/components/react/getInnerListeners.ts +1 -0
  49. package/lib/runtime/components/react/mpx-button.tsx +6 -5
  50. package/lib/runtime/components/react/mpx-camera.tsx +1 -0
  51. package/lib/runtime/components/react/mpx-canvas/index.tsx +4 -1
  52. package/lib/runtime/components/react/mpx-checkbox-group.tsx +2 -1
  53. package/lib/runtime/components/react/mpx-checkbox.tsx +6 -4
  54. package/lib/runtime/components/react/mpx-form.tsx +3 -3
  55. package/lib/runtime/components/react/mpx-icon/index.tsx +5 -1
  56. package/lib/runtime/components/react/mpx-image.tsx +58 -19
  57. package/lib/runtime/components/react/mpx-inline-text.tsx +12 -7
  58. package/lib/runtime/components/react/mpx-input.tsx +17 -4
  59. package/lib/runtime/components/react/mpx-label.tsx +6 -4
  60. package/lib/runtime/components/react/mpx-movable-view.tsx +20 -4
  61. package/lib/runtime/components/react/mpx-picker/index.tsx +12 -2
  62. package/lib/runtime/components/react/mpx-picker-view/index.tsx +8 -4
  63. package/lib/runtime/components/react/mpx-portal/index.tsx +5 -1
  64. package/lib/runtime/components/react/mpx-radio-group.tsx +4 -1
  65. package/lib/runtime/components/react/mpx-radio.tsx +5 -4
  66. package/lib/runtime/components/react/mpx-rich-text/index.tsx +3 -1
  67. package/lib/runtime/components/react/mpx-scroll-view.tsx +13 -4
  68. package/lib/runtime/components/react/mpx-simple-text.tsx +55 -8
  69. package/lib/runtime/components/react/mpx-simple-view.tsx +30 -6
  70. package/lib/runtime/components/react/mpx-slider.tsx +2 -1
  71. package/lib/runtime/components/react/mpx-sticky-header.tsx +8 -4
  72. package/lib/runtime/components/react/mpx-sticky-section.tsx +6 -4
  73. package/lib/runtime/components/react/mpx-swiper-item.tsx +7 -4
  74. package/lib/runtime/components/react/mpx-swiper.tsx +16 -4
  75. package/lib/runtime/components/react/mpx-switch.tsx +4 -1
  76. package/lib/runtime/components/react/mpx-text.tsx +55 -15
  77. package/lib/runtime/components/react/mpx-video.tsx +11 -5
  78. package/lib/runtime/components/react/mpx-view.tsx +35 -7
  79. package/lib/runtime/components/react/types/global.d.ts +4 -0
  80. package/lib/runtime/components/react/utils.tsx +123 -43
  81. package/lib/runtime/optionProcessorReact.js +5 -0
  82. package/lib/script-setup-compiler/index.js +1 -1
  83. package/lib/style-compiler/plugins/trans-special.js +1 -1
  84. package/lib/template-compiler/compiler.js +37 -14
  85. package/lib/utils/gen-component-tag.js +1 -5
  86. package/lib/utils/normalize-perf-options.js +47 -0
  87. package/lib/web/index.js +1 -0
  88. package/lib/web/processMainScript.js +3 -7
  89. package/lib/web/processScript.js +3 -6
  90. package/lib/web/processStyles.js +12 -3
  91. package/lib/wxml/loader.js +1 -1
  92. package/package.json +7 -5
@@ -1,7 +1,7 @@
1
1
  import { useRef, forwardRef, createElement, useCallback, useMemo } from 'react';
2
2
  import { View } from 'react-native';
3
3
  import useNodesRef from './useNodesRef';
4
- import { splitProps, splitStyle, useTransformStyle, wrapChildren, useLayout, extendObject } from './utils';
4
+ import { splitProps, splitStyle, useTransformStyle, wrapChildren, useLayout, extendObject, useTextPassThroughValue } from './utils';
5
5
  import { StickyContext } from './context';
6
6
  import useInnerProps from './getInnerListeners';
7
7
  const _StickySection = forwardRef((stickySectionProps = {}, ref) => {
@@ -11,6 +11,7 @@ const _StickySection = forwardRef((stickySectionProps = {}, ref) => {
11
11
  const { normalStyle, hasVarDec, varContextRef, hasSelfPercent, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight });
12
12
  const { layoutRef, layoutProps, layoutStyle } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef: sectionRef, onLayout });
13
13
  const { textStyle, innerStyle = {} } = splitStyle(normalStyle);
14
+ const textPassThrough = useTextPassThroughValue(textStyle, textProps);
14
15
  const stickyHeaders = useRef(new Map());
15
16
  const registerStickyHeader = useCallback((item) => {
16
17
  stickyHeaders.current.set(item.id, item);
@@ -33,12 +34,13 @@ const _StickySection = forwardRef((stickySectionProps = {}, ref) => {
33
34
  const innerProps = useInnerProps(extendObject({}, props, {
34
35
  style: extendObject(innerStyle, layoutStyle),
35
36
  ref: sectionRef
36
- }, layoutProps), [], { layoutRef });
37
+ }, layoutProps), [
38
+ 'offset-top'
39
+ ], { layoutRef });
37
40
  return (createElement(View, innerProps, createElement(StickyContext.Provider, { value: contextValue }, wrapChildren(props, {
38
41
  hasVarDec,
39
42
  varContext: varContextRef.current,
40
- textStyle,
41
- textProps
43
+ textPassThrough
42
44
  }))));
43
45
  });
44
46
  _StickySection.displayName = 'MpxStickySection';
@@ -2,7 +2,7 @@ import Animated, { useAnimatedStyle, interpolate } from 'react-native-reanimated
2
2
  import { forwardRef, useRef, useContext, createElement } from 'react';
3
3
  import useInnerProps from './getInnerListeners';
4
4
  import useNodesRef from './useNodesRef'; // 引入辅助函数
5
- import { useTransformStyle, splitStyle, splitProps, wrapChildren, useLayout, extendObject, isHarmony } from './utils';
5
+ import { useTransformStyle, splitStyle, splitProps, wrapChildren, useLayout, extendObject, isHarmony, useTextPassThroughValue } from './utils';
6
6
  import { SwiperContext } from './context';
7
7
  const _SwiperItem = forwardRef((props, ref) => {
8
8
  const { 'enable-var': enableVar, 'external-var-context': externalVarContext, style, customStyle, itemIndex } = props;
@@ -15,6 +15,7 @@ const _SwiperItem = forwardRef((props, ref) => {
15
15
  const nodeRef = useRef(null);
16
16
  const { normalStyle, hasVarDec, varContextRef, hasSelfPercent, setWidth, setHeight } = useTransformStyle(style, { enableVar, externalVarContext });
17
17
  const { textStyle, innerStyle } = splitStyle(normalStyle);
18
+ const textPassThrough = useTextPassThroughValue(textStyle, textProps);
18
19
  useNodesRef(props, ref, nodeRef, {
19
20
  style: normalStyle
20
21
  });
@@ -26,7 +27,10 @@ const _SwiperItem = forwardRef((props, ref) => {
26
27
  }), [
27
28
  'children',
28
29
  'enable-offset',
29
- 'style'
30
+ 'style',
31
+ 'item-id',
32
+ 'customStyle',
33
+ 'itemIndex'
30
34
  ], { layoutRef });
31
35
  const itemAnimatedStyle = useAnimatedStyle(() => {
32
36
  if (!step.value && !isHarmony)
@@ -52,8 +56,7 @@ const _SwiperItem = forwardRef((props, ref) => {
52
56
  return createElement(Animated.View, mergeProps, wrapChildren(props, {
53
57
  hasVarDec,
54
58
  varContext: varContextRef.current,
55
- textStyle,
56
- textProps
59
+ textPassThrough
57
60
  }));
58
61
  });
59
62
  _SwiperItem.displayName = 'MpxSwiperItem';
@@ -4,7 +4,7 @@ import Animated, { useAnimatedStyle, useSharedValue, withTiming, Easing, runOnJS
4
4
  import React, { forwardRef, useRef, useEffect, useMemo, createElement } from 'react';
5
5
  import useInnerProps, { getCustomEvent } from './getInnerListeners';
6
6
  import useNodesRef from './useNodesRef'; // 引入辅助函数
7
- import { useTransformStyle, splitStyle, splitProps, useLayout, wrapChildren, extendObject, flatGesture, useRunOnJSCallback } from './utils';
7
+ import { useTransformStyle, splitStyle, splitProps, useLayout, wrapChildren, extendObject, flatGesture, useRunOnJSCallback, useTextPassThroughValue } from './utils';
8
8
  import { SwiperContext } from './context';
9
9
  import Portal from './mpx-portal';
10
10
  /**
@@ -92,6 +92,7 @@ const SwiperWrapper = forwardRef((props, ref) => {
92
92
  });
93
93
  const { textStyle } = splitStyle(normalStyle);
94
94
  const { textProps } = splitProps(props);
95
+ const textPassThrough = useTextPassThroughValue(textStyle, textProps);
95
96
  const preMargin = props['previous-margin'] ? global.__formatValue(props['previous-margin']) : 0;
96
97
  const nextMargin = props['next-margin'] ? global.__formatValue(props['next-margin']) : 0;
97
98
  const preMarginShared = useSharedValue(preMargin);
@@ -158,6 +159,10 @@ const SwiperWrapper = forwardRef((props, ref) => {
158
159
  'indicator-dots',
159
160
  'indicator-color',
160
161
  'indicator-width',
162
+ 'indicator-height',
163
+ 'indicator-radius',
164
+ 'indicator-spacing',
165
+ 'indicator-margin',
161
166
  'indicator-active-color',
162
167
  'previous-margin',
163
168
  'vertical',
@@ -167,7 +172,14 @@ const SwiperWrapper = forwardRef((props, ref) => {
167
172
  'autoplay',
168
173
  'circular',
169
174
  'interval',
170
- 'easing-function'
175
+ 'easing-function',
176
+ 'current',
177
+ 'duration',
178
+ 'scale',
179
+ 'disableGesture',
180
+ 'wait-for',
181
+ 'simultaneous-handlers',
182
+ 'bindchange'
171
183
  ], { layoutRef: layoutRef });
172
184
  function onWrapperLayout(e) {
173
185
  const { width, height } = e.nativeEvent.layout;
@@ -810,8 +822,7 @@ const SwiperWrapper = forwardRef((props, ref) => {
810
822
  }, {
811
823
  hasVarDec,
812
824
  varContext: varContextRef.current,
813
- textStyle,
814
- textProps
825
+ textPassThrough
815
826
  }));
816
827
  const renderChildrens = showPagination ? [animateComponent, renderPagination()] : animateComponent;
817
828
  finalComponent = createElement(View, mergeProps, renderChildrens);
@@ -75,7 +75,10 @@ const _Switch = forwardRef((props, ref) => {
75
75
  'checked',
76
76
  'disabled',
77
77
  'type',
78
- 'color'
78
+ 'color',
79
+ 'name',
80
+ 'bindchange',
81
+ 'catchchange'
79
82
  ], { layoutRef });
80
83
  if (type === 'checkbox') {
81
84
  return createElement(CheckBox, extendObject({}, innerProps, {
@@ -4,11 +4,13 @@
4
4
  * ✔ decode
5
5
  */
6
6
  import { Text } from 'react-native';
7
- import { useRef, forwardRef, createElement, Children } from 'react';
7
+ import { useRef, forwardRef, createElement, Children, useContext } from 'react';
8
8
  import Portal from './mpx-portal';
9
9
  import useInnerProps from './getInnerListeners';
10
10
  import useNodesRef from './useNodesRef'; // 引入辅助函数
11
- import { useTransformStyle, wrapChildren, extendObject } from './utils';
11
+ import { useTransformStyle, wrapChildren, extendObject, getDefaultAllowFontScaling, useTextPassThroughValue, isStringChildren, splitStyle } from './utils';
12
+ import { TextPassThroughContext } from './context';
13
+ import * as perf from '@mpxjs/perf';
12
14
  const decodeMap = {
13
15
  '&lt;': '<',
14
16
  '&gt;': '>',
@@ -34,37 +36,80 @@ function getDecodedChildren(children) {
34
36
  });
35
37
  }
36
38
  const _Text = forwardRef((props, ref) => {
37
- const { style = {}, allowFontScaling = false, selectable, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'user-select': userSelect, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, decode } = props;
38
- const { normalStyle, hasVarDec, varContextRef, hasPositionFixed } = useTransformStyle(style, {
39
+ let stopTotal;
40
+ if (__mpx_perf_framework__)
41
+ stopTotal = perf.scope('text:render:total');
42
+ // ───── props 阶段 ─────
43
+ let stopProps;
44
+ if (__mpx_perf_framework__)
45
+ stopProps = perf.scope('text:render:props');
46
+ const inheritedText = useContext(TextPassThroughContext);
47
+ const mergedProps = extendObject({}, inheritedText?.pendingTextProps, props);
48
+ const { style: currentStyle = {}, allowFontScaling, selectable, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'user-select': userSelect, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, decode } = mergedProps;
49
+ if (__mpx_perf_framework__)
50
+ stopProps();
51
+ // ───── style 阶段 ─────
52
+ let stopStyle;
53
+ if (__mpx_perf_framework__)
54
+ stopStyle = perf.scope('text:render:style');
55
+ const { normalStyle, hasVarDec, varContextRef, hasPositionFixed } = useTransformStyle(currentStyle, {
39
56
  enableVar,
40
57
  externalVarContext,
41
58
  parentFontSize,
42
59
  parentWidth,
43
60
  parentHeight
44
61
  });
62
+ const finalStyle = extendObject({}, inheritedText?.textStyle, normalStyle);
45
63
  const nodeRef = useRef(null);
46
- useNodesRef(props, ref, nodeRef, {
47
- style: normalStyle
64
+ useNodesRef(mergedProps, ref, nodeRef, {
65
+ style: finalStyle
48
66
  });
49
- const innerProps = useInnerProps(extendObject({}, props, {
67
+ const children = decode ? getDecodedChildren(mergedProps.children) : mergedProps.children;
68
+ const isStringOnly = isStringChildren(children);
69
+ let childTextStyle;
70
+ if (!isStringOnly) {
71
+ const { textStyle = {} } = splitStyle(finalStyle);
72
+ childTextStyle = Object.keys(textStyle).length ? textStyle : undefined;
73
+ }
74
+ const textPassThrough = useTextPassThroughValue(childTextStyle, undefined, {
75
+ inheritTextProps: false,
76
+ disabled: isStringOnly
77
+ });
78
+ if (__mpx_perf_framework__)
79
+ stopStyle();
80
+ // ───── innerProps 阶段 ─────
81
+ let stopInnerProps;
82
+ if (__mpx_perf_framework__)
83
+ stopInnerProps = perf.scope('text:render:innerProps');
84
+ const innerProps = useInnerProps(extendObject({}, mergedProps, {
50
85
  ref: nodeRef,
51
- style: normalStyle,
86
+ style: finalStyle,
52
87
  selectable: !!selectable || !!userSelect,
53
- allowFontScaling
88
+ allowFontScaling: allowFontScaling ?? getDefaultAllowFontScaling()
54
89
  }), [
55
90
  'user-select',
56
91
  'decode'
57
92
  ]);
58
- const children = decode ? getDecodedChildren(props.children) : props.children;
59
- let finalComponent = createElement(Text, innerProps, wrapChildren(extendObject({}, props, {
93
+ if (__mpx_perf_framework__)
94
+ stopInnerProps();
95
+ // ───── createElement 阶段 ─────
96
+ let stopCreate;
97
+ if (__mpx_perf_framework__)
98
+ stopCreate = perf.scope('text:render:createElement');
99
+ let finalComponent = createElement(Text, innerProps, wrapChildren(extendObject({}, mergedProps, {
60
100
  children
61
101
  }), {
62
102
  hasVarDec,
63
- varContext: varContextRef.current
103
+ varContext: varContextRef.current,
104
+ textPassThrough
64
105
  }));
65
106
  if (hasPositionFixed) {
66
107
  finalComponent = createElement(Portal, null, finalComponent);
67
108
  }
109
+ if (__mpx_perf_framework__)
110
+ stopCreate();
111
+ if (__mpx_perf_framework__)
112
+ stopTotal();
68
113
  return finalComponent;
69
114
  });
70
115
  _Text.displayName = 'MpxText';
@@ -63,10 +63,11 @@
63
63
  * ✘ bindcastinginterrupt
64
64
  */
65
65
  /// <reference types="react" />
66
+ import { ReactVideoSourceProperties } from 'react-native-video';
66
67
  import { View, ViewStyle } from 'react-native';
67
68
  import { HandlerRef } from './useNodesRef';
68
69
  interface VideoProps {
69
- src: string;
70
+ src: string | ReactVideoSourceProperties | number;
70
71
  autoplay?: boolean;
71
72
  loop?: boolean;
72
73
  muted?: boolean;
@@ -197,10 +197,8 @@ const MpxVideo = forwardRef((videoProps, ref) => {
197
197
  function requestFullScreen() {
198
198
  videoRef.current && videoRef.current.setFullScreen(true);
199
199
  }
200
- const source = {
201
- uri: src
202
- };
203
- if (isDrm) {
200
+ const source = typeof src === 'string' ? { uri: src } : (typeof src === 'number' ? src : extendObject({}, src));
201
+ if (isDrm && source && typeof source !== 'number') {
204
202
  source.drm = {
205
203
  type: DRMType.FAIRPLAY,
206
204
  certificateUrl: __mpx_mode__ !== 'ios' ? provisionUrl : certificateUrl,
@@ -233,6 +231,14 @@ const MpxVideo = forwardRef((videoProps, ref) => {
233
231
  'src',
234
232
  'autoplay',
235
233
  'loop',
234
+ 'initial-time',
235
+ 'object-fit',
236
+ 'is-drm',
237
+ 'provision-url',
238
+ 'certificate-url',
239
+ 'license-url',
240
+ 'preferred-peak-bit-rate',
241
+ 'enable-auto-rotation',
236
242
  'bindplay',
237
243
  'bindpause',
238
244
  'bindended',
@@ -10,8 +10,9 @@ import useInnerProps from './getInnerListeners';
10
10
  import Animated from 'react-native-reanimated';
11
11
  import useAnimationHooks from './animationHooks/index';
12
12
  import useNodesRef from './useNodesRef';
13
- import { parseUrl, PERCENT_REGEX, splitStyle, splitProps, useTransformStyle, wrapChildren, useLayout, renderImage, pickStyle, extendObject, useHover } from './utils';
13
+ import { parseUrl, PERCENT_REGEX, splitStyle, splitProps, useTransformStyle, wrapChildren, useLayout, renderImage, pickStyle, extendObject, useHover, useTextPassThroughValue } from './utils';
14
14
  import { error, isFunction } from '@mpxjs/utils';
15
+ import * as perf from '@mpxjs/perf';
15
16
  import LinearGradient from 'react-native-linear-gradient';
16
17
  import { GestureDetector } from 'react-native-gesture-handler';
17
18
  import Portal from './mpx-portal';
@@ -551,12 +552,11 @@ function useWrapImage(imageStyle, innerStyle, enableFastImage) {
551
552
  const backgroundProps = extendObject({ key: 'backgroundImage' }, needLayout ? { onLayout } : {}, { style: extendObject({}, inheritStyle(innerStyle), StyleSheet.absoluteFillObject, { overflow: 'hidden' }) });
552
553
  return createElement(View, backgroundProps, show && type === 'linear' && createElement(LinearGradient, extendObject({ useAngle: true }, imageStyleToProps(preImageInfo, sizeInfo.current, layoutInfo.current))), show && type === 'image' && renderImage(imageStyleToProps(preImageInfo, sizeInfo.current, layoutInfo.current), enableFastImage));
553
554
  }
554
- function wrapWithChildren(props, { hasVarDec, enableBackground, textStyle, backgroundStyle, varContext, textProps, innerStyle, enableFastImage }) {
555
+ function wrapWithChildren(props, { hasVarDec, enableBackground, backgroundStyle, varContext, textPassThrough, innerStyle, enableFastImage }) {
555
556
  const children = wrapChildren(props, {
556
557
  hasVarDec,
557
558
  varContext,
558
- textStyle,
559
- textProps
559
+ textPassThrough
560
560
  });
561
561
  return [
562
562
  // eslint-disable-next-line react-hooks/rules-of-hooks
@@ -565,6 +565,14 @@ function wrapWithChildren(props, { hasVarDec, enableBackground, textStyle, backg
565
565
  ];
566
566
  }
567
567
  const _View = forwardRef((viewProps, ref) => {
568
+ // 性能探针 - total
569
+ let stopTotal;
570
+ if (__mpx_perf_framework__)
571
+ stopTotal = perf.scope('view:render:total');
572
+ // ───── props 阶段 ─────
573
+ let stopProps;
574
+ if (__mpx_perf_framework__)
575
+ stopProps = perf.scope('view:render:props');
568
576
  const { textProps, innerProps: props = {} } = splitProps(viewProps);
569
577
  let { style = {}, 'hover-style': hoverStyle, 'hover-start-time': hoverStartTime = 50, 'hover-stay-time': hoverStayTime = 400, 'enable-var': enableVar, 'external-var-context': externalVarContext, 'enable-background': enableBackground, 'enable-fast-image': enableFastImage, 'enable-animation': enableAnimation, 'parent-font-size': parentFontSize, 'parent-width': parentWidth, 'parent-height': parentHeight, animation, catchtransitionend, bindtransitionend } = props;
570
578
  // 默认样式
@@ -579,6 +587,12 @@ const _View = forwardRef((viewProps, ref) => {
579
587
  const enableHover = !!hoverStyle;
580
588
  const { isHover, gesture } = useHover({ enableHover, hoverStartTime, hoverStayTime });
581
589
  const styleObj = extendObject({}, defaultStyle, style, isHover ? hoverStyle : {});
590
+ if (__mpx_perf_framework__)
591
+ stopProps();
592
+ // ───── style 阶段 ─────
593
+ let stopStyle;
594
+ if (__mpx_perf_framework__)
595
+ stopStyle = perf.scope('view:render:style');
582
596
  const { normalStyle, hasSelfPercent, hasPositionFixed, hasVarDec, varContextRef, setWidth, setHeight } = useTransformStyle(styleObj, {
583
597
  enableVar,
584
598
  externalVarContext,
@@ -587,6 +601,7 @@ const _View = forwardRef((viewProps, ref) => {
587
601
  parentHeight
588
602
  });
589
603
  const { textStyle, backgroundStyle, innerStyle = {} } = splitStyle(normalStyle);
604
+ const textPassThrough = useTextPassThroughValue(textStyle, textProps);
590
605
  enableBackground = enableBackground || !!backgroundStyle;
591
606
  const enableBackgroundRef = useRef(enableBackground);
592
607
  if (enableBackgroundRef.current !== enableBackground) {
@@ -610,24 +625,40 @@ const _View = forwardRef((viewProps, ref) => {
610
625
  style: viewStyle,
611
626
  transitionend
612
627
  });
628
+ if (__mpx_perf_framework__)
629
+ stopStyle();
630
+ // ───── innerProps 阶段 ─────
631
+ let stopInnerProps;
632
+ if (__mpx_perf_framework__)
633
+ stopInnerProps = perf.scope('view:render:innerProps');
613
634
  const innerProps = useInnerProps(extendObject({}, props, layoutProps, {
614
635
  ref: nodeRef,
615
636
  style: enableStyleAnimation ? [viewStyle, animationStyle] : viewStyle
616
637
  }), [
638
+ 'animation',
617
639
  'hover-start-time',
618
640
  'hover-stay-time',
619
641
  'hover-style',
620
- 'hover-class'
642
+ 'hover-class',
643
+ 'enable-fast-image',
644
+ 'enable-animation',
645
+ 'bindtransitionend',
646
+ 'catchtransitionend'
621
647
  ], {
622
648
  layoutRef
623
649
  });
650
+ if (__mpx_perf_framework__)
651
+ stopInnerProps();
652
+ // ───── createElement 阶段 ─────
653
+ let stopCreate;
654
+ if (__mpx_perf_framework__)
655
+ stopCreate = perf.scope('view:render:createElement');
624
656
  const childNode = wrapWithChildren(props, {
625
657
  hasVarDec,
626
658
  enableBackground: enableBackgroundRef.current,
627
- textStyle,
628
659
  backgroundStyle,
629
660
  varContext: varContextRef.current,
630
- textProps,
661
+ textPassThrough,
631
662
  innerStyle,
632
663
  enableFastImage
633
664
  });
@@ -640,6 +671,10 @@ const _View = forwardRef((viewProps, ref) => {
640
671
  if (hasPositionFixed) {
641
672
  finalComponent = createElement(Portal, null, finalComponent);
642
673
  }
674
+ if (__mpx_perf_framework__)
675
+ stopCreate();
676
+ if (__mpx_perf_framework__)
677
+ stopTotal();
643
678
  return finalComponent;
644
679
  });
645
680
  _View.displayName = 'MpxView';
@@ -1,17 +1,20 @@
1
1
  import { ReactNode, ReactElement, Dispatch, SetStateAction, MutableRefObject } from 'react';
2
- import { LayoutChangeEvent, TextStyle, ImageProps } from 'react-native';
3
- import type { FastImageProps } from '@d11/react-native-fast-image';
2
+ import { LayoutChangeEvent, TextStyle, ImageProps, Image } from 'react-native';
3
+ import { TextPassThroughContextValue } from './context';
4
4
  import type { AnyFunc } from './types/common';
5
- export declare const TEXT_STYLE_REGEX: RegExp;
5
+ export declare const TEXT_STYLE_MAP: Record<string, boolean>;
6
6
  export declare const PERCENT_REGEX: RegExp;
7
7
  export declare const URL_REGEX: RegExp;
8
8
  export declare const SVG_REGEXP: RegExp;
9
- export declare const BACKGROUND_REGEX: RegExp;
10
- export declare const TEXT_PROPS_REGEX: RegExp;
9
+ export declare const BACKGROUND_STYLE_MAP: Record<string, boolean>;
10
+ export declare const TEXT_PROPS_MAP: Record<string, boolean>;
11
11
  export declare const DEFAULT_FONT_SIZE = 16;
12
12
  export declare const HIDDEN_STYLE: {
13
13
  opacity: number;
14
14
  };
15
+ export declare const DEFAULT_BOX_SIZING_STYLE: {
16
+ boxSizing: string;
17
+ };
15
18
  export declare const isIOS: boolean;
16
19
  export declare const isAndroid: boolean;
17
20
  export declare const isHarmony: boolean;
@@ -21,6 +24,9 @@ export declare const extendObject: {
21
24
  <T_2 extends {}, U_2, V_1, W>(target: T_2, source1: U_2, source2: V_1, source3: W): T_2 & U_2 & V_1 & W;
22
25
  (target: object, ...sources: any[]): any;
23
26
  };
27
+ export declare function getDefaultAllowFontScaling(): boolean;
28
+ export declare function transformBoxSizing(style?: Record<string, any>, hasBoxSizingAffectingStyle?: boolean): Record<string, any>;
29
+ export declare function isBoxSizingAffectingStyle(key: string): boolean;
24
30
  export declare function useNavigation(): Record<string, any> | undefined;
25
31
  export declare function omit<T, K extends string>(obj: T, fields: K[]): Omit<T, K>;
26
32
  /**
@@ -30,10 +36,10 @@ export declare const useUpdateEffect: (effect: any, deps: any) => void;
30
36
  export declare const parseUrl: (cssUrl?: string) => string | undefined;
31
37
  export declare const getRestProps: (transferProps?: any, originProps?: any, deletePropsKey?: any) => any;
32
38
  export declare function isText(ele: ReactNode): ele is ReactElement;
33
- export declare function every(children: ReactNode, callback: (children: ReactNode) => boolean): boolean;
39
+ export declare function isStringChildren(children: ReactNode): boolean;
34
40
  type GroupData<T> = Record<string, Partial<T>>;
35
41
  export declare function groupBy<T extends Record<string, any>>(obj: T, callback: (key: string, val: T[keyof T]) => string, group?: GroupData<T>): GroupData<T>;
36
- export declare function splitStyle<T extends Record<string, any>>(styleObj: T): {
42
+ export declare function splitStyle<T extends Record<string, any>>(styleObj: T, sideEffect?: (key: string, val: T[keyof T]) => void): {
37
43
  textStyle?: Partial<T>;
38
44
  backgroundStyle?: Partial<T>;
39
45
  innerStyle?: Partial<T>;
@@ -84,10 +90,14 @@ export declare const useLayout: ({ props, hasSelfPercent, setWidth, setHeight, o
84
90
  export interface WrapChildrenConfig {
85
91
  hasVarDec: boolean;
86
92
  varContext?: Record<string, any>;
87
- textStyle?: TextStyle;
88
- textProps?: Record<string, any>;
93
+ textPassThrough?: TextPassThroughContextValue | null;
94
+ }
95
+ export interface TextPassThroughValueOptions {
96
+ inheritTextProps?: boolean;
97
+ disabled?: boolean;
89
98
  }
90
- export declare function wrapChildren(props: Record<string, any> | undefined, { hasVarDec, varContext, textStyle, textProps }: WrapChildrenConfig): any;
99
+ export declare function useTextPassThroughValue(textStyle?: TextStyle, textProps?: Record<string, any>, { inheritTextProps, disabled }?: TextPassThroughValueOptions): TextPassThroughContextValue | null;
100
+ export declare function wrapChildren(props: Record<string, any> | undefined, { hasVarDec, varContext, textPassThrough }: WrapChildrenConfig): any;
91
101
  export declare const debounce: <T extends AnyFunc>(func: T, delay: number) => ((...args: Parameters<T>) => void) & {
92
102
  clear: () => void;
93
103
  };
@@ -106,7 +116,7 @@ export interface GestureHandler {
106
116
  }
107
117
  export declare function flatGesture(gestures?: Array<GestureHandler>): any[];
108
118
  export declare function getCurrentPage(pageId: number | null | undefined): any;
109
- export declare function renderImage(imageProps: ImageProps | FastImageProps, enableFastImage?: boolean): ReactElement<ImageProps | FastImageProps, string | import("react").JSXElementConstructor<any>>;
119
+ export declare function renderImage(imageProps: ImageProps, enableFastImage?: boolean): import("react").CElement<ImageProps, Image>;
110
120
  export declare function pickStyle(styleObj: Record<string, any> | undefined, pickedKeys: Array<string>, callback?: (key: string, val: number | string) => number | string): Record<string, any>;
111
121
  export declare function useHover({ enableHover, hoverStartTime, hoverStayTime, disabled }: {
112
122
  enableHover: boolean;