@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.
- package/lib/index.js +13 -1
- package/lib/parser.js +1 -1
- package/lib/platform/style/wx/index.js +78 -30
- package/lib/platform/template/wx/component-config/block.js +2 -1
- package/lib/platform/template/wx/component-config/unsupported.js +1 -1
- package/lib/react/processTemplate.js +23 -10
- package/lib/react/style-helper.js +1 -1
- package/lib/react/template-loader.js +15 -2
- package/lib/runtime/components/react/context.ts +8 -1
- package/lib/runtime/components/react/dist/context.d.ts +6 -1
- package/lib/runtime/components/react/dist/context.js +1 -0
- package/lib/runtime/components/react/dist/getInnerListeners.js +1 -0
- package/lib/runtime/components/react/dist/mpx-button.d.ts +1 -1
- package/lib/runtime/components/react/dist/mpx-button.jsx +6 -5
- package/lib/runtime/components/react/dist/mpx-camera.jsx +1 -0
- package/lib/runtime/components/react/dist/mpx-canvas/index.jsx +4 -1
- package/lib/runtime/components/react/dist/mpx-checkbox-group.jsx +2 -1
- package/lib/runtime/components/react/dist/mpx-checkbox.jsx +6 -4
- package/lib/runtime/components/react/dist/mpx-form.jsx +3 -3
- package/lib/runtime/components/react/dist/mpx-icon/index.jsx +5 -1
- package/lib/runtime/components/react/dist/mpx-image.d.ts +3 -2
- package/lib/runtime/components/react/dist/mpx-image.jsx +46 -12
- package/lib/runtime/components/react/dist/mpx-inline-text.jsx +10 -6
- package/lib/runtime/components/react/dist/mpx-input.jsx +17 -4
- package/lib/runtime/components/react/dist/mpx-label.jsx +6 -4
- package/lib/runtime/components/react/dist/mpx-movable-view.jsx +19 -4
- package/lib/runtime/components/react/dist/mpx-picker/index.jsx +12 -2
- package/lib/runtime/components/react/dist/mpx-picker-view/index.jsx +7 -4
- package/lib/runtime/components/react/dist/mpx-portal/index.jsx +5 -1
- package/lib/runtime/components/react/dist/mpx-radio-group.jsx +4 -1
- package/lib/runtime/components/react/dist/mpx-radio.jsx +5 -4
- package/lib/runtime/components/react/dist/mpx-rich-text/index.jsx +3 -1
- package/lib/runtime/components/react/dist/mpx-scroll-view.jsx +13 -4
- package/lib/runtime/components/react/dist/mpx-simple-text.jsx +52 -6
- package/lib/runtime/components/react/dist/mpx-simple-view.jsx +36 -6
- package/lib/runtime/components/react/dist/mpx-slider.jsx +2 -1
- package/lib/runtime/components/react/dist/mpx-sticky-header.jsx +8 -4
- package/lib/runtime/components/react/dist/mpx-sticky-section.jsx +6 -4
- package/lib/runtime/components/react/dist/mpx-swiper-item.jsx +7 -4
- package/lib/runtime/components/react/dist/mpx-swiper.jsx +15 -4
- package/lib/runtime/components/react/dist/mpx-switch.jsx +4 -1
- package/lib/runtime/components/react/dist/mpx-text.jsx +57 -12
- package/lib/runtime/components/react/dist/mpx-video.d.ts +2 -1
- package/lib/runtime/components/react/dist/mpx-video.jsx +10 -4
- package/lib/runtime/components/react/dist/mpx-view.jsx +42 -7
- package/lib/runtime/components/react/dist/utils.d.ts +21 -11
- package/lib/runtime/components/react/dist/utils.jsx +102 -33
- package/lib/runtime/components/react/getInnerListeners.ts +1 -0
- package/lib/runtime/components/react/mpx-button.tsx +6 -5
- package/lib/runtime/components/react/mpx-camera.tsx +1 -0
- package/lib/runtime/components/react/mpx-canvas/index.tsx +4 -1
- package/lib/runtime/components/react/mpx-checkbox-group.tsx +2 -1
- package/lib/runtime/components/react/mpx-checkbox.tsx +6 -4
- package/lib/runtime/components/react/mpx-form.tsx +3 -3
- package/lib/runtime/components/react/mpx-icon/index.tsx +5 -1
- package/lib/runtime/components/react/mpx-image.tsx +58 -19
- package/lib/runtime/components/react/mpx-inline-text.tsx +12 -7
- package/lib/runtime/components/react/mpx-input.tsx +17 -4
- package/lib/runtime/components/react/mpx-label.tsx +6 -4
- package/lib/runtime/components/react/mpx-movable-view.tsx +20 -4
- package/lib/runtime/components/react/mpx-picker/index.tsx +12 -2
- package/lib/runtime/components/react/mpx-picker-view/index.tsx +8 -4
- package/lib/runtime/components/react/mpx-portal/index.tsx +5 -1
- package/lib/runtime/components/react/mpx-radio-group.tsx +4 -1
- package/lib/runtime/components/react/mpx-radio.tsx +5 -4
- package/lib/runtime/components/react/mpx-rich-text/index.tsx +3 -1
- package/lib/runtime/components/react/mpx-scroll-view.tsx +13 -4
- package/lib/runtime/components/react/mpx-simple-text.tsx +55 -8
- package/lib/runtime/components/react/mpx-simple-view.tsx +30 -6
- package/lib/runtime/components/react/mpx-slider.tsx +2 -1
- package/lib/runtime/components/react/mpx-sticky-header.tsx +8 -4
- package/lib/runtime/components/react/mpx-sticky-section.tsx +6 -4
- package/lib/runtime/components/react/mpx-swiper-item.tsx +7 -4
- package/lib/runtime/components/react/mpx-swiper.tsx +16 -4
- package/lib/runtime/components/react/mpx-switch.tsx +4 -1
- package/lib/runtime/components/react/mpx-text.tsx +55 -15
- package/lib/runtime/components/react/mpx-video.tsx +11 -5
- package/lib/runtime/components/react/mpx-view.tsx +35 -7
- package/lib/runtime/components/react/types/global.d.ts +4 -0
- package/lib/runtime/components/react/utils.tsx +123 -43
- package/lib/runtime/optionProcessorReact.js +5 -0
- package/lib/script-setup-compiler/index.js +1 -1
- package/lib/style-compiler/plugins/trans-special.js +1 -1
- package/lib/template-compiler/compiler.js +37 -14
- package/lib/utils/gen-component-tag.js +1 -5
- package/lib/utils/normalize-perf-options.js +47 -0
- package/lib/web/index.js +1 -0
- package/lib/web/processMainScript.js +3 -7
- package/lib/web/processScript.js +3 -6
- package/lib/web/processStyles.js +12 -3
- package/lib/wxml/loader.js +1 -1
- package/package.json +7 -5
|
@@ -6,7 +6,7 @@ import { View, ViewStyle, NativeSyntheticEvent } from 'react-native'
|
|
|
6
6
|
import { noop, warn } from '@mpxjs/utils'
|
|
7
7
|
import useInnerProps, { getCustomEvent } from './getInnerListeners'
|
|
8
8
|
import useNodesRef, { HandlerRef } from './useNodesRef'
|
|
9
|
-
import { splitProps, splitStyle, useLayout, useTransformStyle, wrapChildren, extendObject } from './utils'
|
|
9
|
+
import { splitProps, splitStyle, useLayout, useTransformStyle, wrapChildren, extendObject, useTextPassThroughValue } from './utils'
|
|
10
10
|
import { LabelContext, LabelContextValue } from './context'
|
|
11
11
|
import Portal from './mpx-portal'
|
|
12
12
|
|
|
@@ -61,6 +61,7 @@ const Label = forwardRef<HandlerRef<View, LabelProps>, LabelProps>(
|
|
|
61
61
|
const { layoutRef, layoutStyle, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef })
|
|
62
62
|
|
|
63
63
|
const { textStyle, backgroundStyle, innerStyle = {} } = splitStyle(normalStyle)
|
|
64
|
+
const textPassThrough = useTextPassThroughValue(textStyle, textProps)
|
|
64
65
|
|
|
65
66
|
if (backgroundStyle) {
|
|
66
67
|
warn('Label does not support background image-related styles!')
|
|
@@ -87,7 +88,9 @@ const Label = forwardRef<HandlerRef<View, LabelProps>, LabelProps>(
|
|
|
87
88
|
bindtap: onTap
|
|
88
89
|
}
|
|
89
90
|
),
|
|
90
|
-
[
|
|
91
|
+
[
|
|
92
|
+
'for'
|
|
93
|
+
],
|
|
91
94
|
{
|
|
92
95
|
layoutRef
|
|
93
96
|
}
|
|
@@ -101,8 +104,7 @@ const Label = forwardRef<HandlerRef<View, LabelProps>, LabelProps>(
|
|
|
101
104
|
{
|
|
102
105
|
hasVarDec,
|
|
103
106
|
varContext: varContextRef.current,
|
|
104
|
-
|
|
105
|
-
textProps
|
|
107
|
+
textPassThrough
|
|
106
108
|
}
|
|
107
109
|
)
|
|
108
110
|
))
|
|
@@ -22,7 +22,7 @@ import { StyleSheet, View, LayoutChangeEvent } from 'react-native'
|
|
|
22
22
|
import useInnerProps, { getCustomEvent } from './getInnerListeners'
|
|
23
23
|
import useNodesRef, { HandlerRef } from './useNodesRef'
|
|
24
24
|
import { MovableAreaContext } from './context'
|
|
25
|
-
import { useTransformStyle, splitProps, splitStyle, HIDDEN_STYLE, wrapChildren, GestureHandler, flatGesture, extendObject, omit, useNavigation, useRunOnJSCallback } from './utils'
|
|
25
|
+
import { useTransformStyle, splitProps, splitStyle, HIDDEN_STYLE, wrapChildren, GestureHandler, flatGesture, extendObject, omit, useNavigation, useRunOnJSCallback, useTextPassThroughValue } from './utils'
|
|
26
26
|
import { GestureDetector, Gesture, GestureTouchEvent, GestureStateChangeEvent, PanGestureHandlerEventPayload, PanGesture } from 'react-native-gesture-handler'
|
|
27
27
|
import Animated, {
|
|
28
28
|
useSharedValue,
|
|
@@ -251,6 +251,7 @@ const _MovableView = forwardRef<HandlerRef<View, MovableViewProps>, MovableViewP
|
|
|
251
251
|
const prevWaitForHandlersRef = useRef<Array<GestureHandler>>(waitFor || [])
|
|
252
252
|
const gestureSwitch = useRef(false)
|
|
253
253
|
const { textStyle, innerStyle } = splitStyle(normalStyle)
|
|
254
|
+
const textPassThrough = useTextPassThroughValue(textStyle, textProps)
|
|
254
255
|
|
|
255
256
|
const offsetX = useSharedValue(x)
|
|
256
257
|
const offsetY = useSharedValue(y)
|
|
@@ -745,7 +746,23 @@ const _MovableView = forwardRef<HandlerRef<View, MovableViewProps>, MovableViewP
|
|
|
745
746
|
style: [innerStyle, animatedStyles, layoutStyle]
|
|
746
747
|
},
|
|
747
748
|
rewriteCatchEvent()
|
|
748
|
-
)
|
|
749
|
+
),
|
|
750
|
+
[
|
|
751
|
+
'direction',
|
|
752
|
+
'x',
|
|
753
|
+
'y',
|
|
754
|
+
'disabled',
|
|
755
|
+
'animation',
|
|
756
|
+
'damping',
|
|
757
|
+
'friction',
|
|
758
|
+
'out-of-bounds',
|
|
759
|
+
'inertia',
|
|
760
|
+
'wait-for',
|
|
761
|
+
'simultaneous-handlers',
|
|
762
|
+
'disable-event-passthrough',
|
|
763
|
+
'changeThrottleTime',
|
|
764
|
+
'bindchange'
|
|
765
|
+
]
|
|
749
766
|
)
|
|
750
767
|
|
|
751
768
|
return createElement(GestureDetector, { gesture: gesture }, createElement(
|
|
@@ -756,8 +773,7 @@ const _MovableView = forwardRef<HandlerRef<View, MovableViewProps>, MovableViewP
|
|
|
756
773
|
{
|
|
757
774
|
hasVarDec,
|
|
758
775
|
varContext: varContextRef.current,
|
|
759
|
-
|
|
760
|
-
textProps
|
|
776
|
+
textPassThrough
|
|
761
777
|
}
|
|
762
778
|
)
|
|
763
779
|
))
|
|
@@ -147,7 +147,17 @@ const Picker = forwardRef<HandlerRef<View, PickerProps>, PickerProps>(
|
|
|
147
147
|
},
|
|
148
148
|
layoutProps
|
|
149
149
|
),
|
|
150
|
-
[
|
|
150
|
+
[
|
|
151
|
+
'mode',
|
|
152
|
+
'value',
|
|
153
|
+
'range',
|
|
154
|
+
'disabled',
|
|
155
|
+
'bindcancel',
|
|
156
|
+
'bindchange',
|
|
157
|
+
'header-text',
|
|
158
|
+
'name',
|
|
159
|
+
'bindcolumnchange'
|
|
160
|
+
],
|
|
151
161
|
{ layoutRef }
|
|
152
162
|
)
|
|
153
163
|
|
|
@@ -218,7 +228,7 @@ const Picker = forwardRef<HandlerRef<View, PickerProps>, PickerProps>(
|
|
|
218
228
|
hide()
|
|
219
229
|
}
|
|
220
230
|
|
|
221
|
-
const specificProps = extendObject(innerProps, {
|
|
231
|
+
const specificProps = extendObject({}, innerProps, {
|
|
222
232
|
mode,
|
|
223
233
|
children,
|
|
224
234
|
bindchange: onChange,
|
|
@@ -8,7 +8,8 @@ import {
|
|
|
8
8
|
splitStyle,
|
|
9
9
|
wrapChildren,
|
|
10
10
|
useTransformStyle,
|
|
11
|
-
extendObject
|
|
11
|
+
extendObject,
|
|
12
|
+
useTextPassThroughValue
|
|
12
13
|
} from '../utils'
|
|
13
14
|
import { PickerViewStyleContext } from './pickerVIewContext'
|
|
14
15
|
import Portal from '../mpx-portal'
|
|
@@ -104,6 +105,7 @@ const _PickerView = forwardRef<HandlerRef<View, PickerViewProps>, PickerViewProp
|
|
|
104
105
|
} = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef: nodeRef })
|
|
105
106
|
const { textProps } = splitProps(props)
|
|
106
107
|
const { textStyle } = splitStyle(normalStyle)
|
|
108
|
+
const textPassThrough = useTextPassThroughValue(textStyle, textProps)
|
|
107
109
|
|
|
108
110
|
const onSelectChange = (columnIndex: number, selectedIndex: number) => {
|
|
109
111
|
const activeValue = activeValueRef.current
|
|
@@ -156,7 +158,10 @@ const _PickerView = forwardRef<HandlerRef<View, PickerViewProps>, PickerViewProp
|
|
|
156
158
|
'indicator-style',
|
|
157
159
|
'indicator-class',
|
|
158
160
|
'mask-style',
|
|
159
|
-
'mask-class'
|
|
161
|
+
'mask-class',
|
|
162
|
+
'value',
|
|
163
|
+
'bindchange',
|
|
164
|
+
'enable-wheel-animation'
|
|
160
165
|
],
|
|
161
166
|
{ layoutRef }
|
|
162
167
|
)
|
|
@@ -190,8 +195,7 @@ const _PickerView = forwardRef<HandlerRef<View, PickerViewProps>, PickerViewProp
|
|
|
190
195
|
{
|
|
191
196
|
hasVarDec,
|
|
192
197
|
varContext: varContextRef.current,
|
|
193
|
-
|
|
194
|
-
textProps
|
|
198
|
+
textPassThrough
|
|
195
199
|
}
|
|
196
200
|
)
|
|
197
201
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ReactNode, useContext, useEffect, useRef } from 'react'
|
|
2
|
-
import { PortalContext, ProviderContext, RouteContext, VarContext } from '../context'
|
|
2
|
+
import { PortalContext, ProviderContext, RouteContext, VarContext, TextPassThroughContext } from '../context'
|
|
3
3
|
import PortalHost, { portal } from './portal-host'
|
|
4
4
|
|
|
5
5
|
export type PortalProps = {
|
|
@@ -11,8 +11,12 @@ const Portal = ({ children }: PortalProps): null => {
|
|
|
11
11
|
const keyRef = useRef<any>(null)
|
|
12
12
|
const { pageId } = useContext(RouteContext) || {}
|
|
13
13
|
const varContext = useContext(VarContext)
|
|
14
|
+
const textPassThroughContext = useContext(TextPassThroughContext)
|
|
14
15
|
const parentProvides = useContext(ProviderContext)
|
|
15
16
|
|
|
17
|
+
if (textPassThroughContext) {
|
|
18
|
+
children = (<TextPassThroughContext.Provider value={textPassThroughContext} key='textPassThroughWrap'>{children}</TextPassThroughContext.Provider>)
|
|
19
|
+
}
|
|
16
20
|
if (varContext) {
|
|
17
21
|
children = (<VarContext.Provider value={varContext} key='varContextWrap'>{children}</VarContext.Provider>)
|
|
18
22
|
}
|
|
@@ -10,7 +10,7 @@ import { warn } from '@mpxjs/utils'
|
|
|
10
10
|
import { LabelContext, RadioGroupContext } from './context'
|
|
11
11
|
import useInnerProps, { getCustomEvent } from './getInnerListeners'
|
|
12
12
|
import useNodesRef, { HandlerRef } from './useNodesRef'
|
|
13
|
-
import { splitProps, splitStyle, useLayout, useTransformStyle, wrapChildren, extendObject } from './utils'
|
|
13
|
+
import { splitProps, splitStyle, useLayout, useTransformStyle, wrapChildren, extendObject, useTextPassThroughValue } from './utils'
|
|
14
14
|
import Icon from './mpx-icon'
|
|
15
15
|
import Portal from './mpx-portal'
|
|
16
16
|
|
|
@@ -128,6 +128,7 @@ const Radio = forwardRef<HandlerRef<View, RadioProps>, RadioProps>(
|
|
|
128
128
|
} = useTransformStyle(styleObj, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight })
|
|
129
129
|
|
|
130
130
|
const { textStyle, backgroundStyle, innerStyle = {} } = splitStyle(normalStyle)
|
|
131
|
+
const textPassThrough = useTextPassThroughValue(textStyle, textProps)
|
|
131
132
|
|
|
132
133
|
if (backgroundStyle) {
|
|
133
134
|
warn('Radio does not support background image-related styles!')
|
|
@@ -164,7 +165,8 @@ const Radio = forwardRef<HandlerRef<View, RadioProps>, RadioProps>(
|
|
|
164
165
|
[
|
|
165
166
|
'value',
|
|
166
167
|
'disabled',
|
|
167
|
-
'checked'
|
|
168
|
+
'checked',
|
|
169
|
+
'color'
|
|
168
170
|
],
|
|
169
171
|
{
|
|
170
172
|
layoutRef
|
|
@@ -210,8 +212,7 @@ const Radio = forwardRef<HandlerRef<View, RadioProps>, RadioProps>(
|
|
|
210
212
|
{
|
|
211
213
|
hasVarDec,
|
|
212
214
|
varContext: varContextRef.current,
|
|
213
|
-
|
|
214
|
-
textProps
|
|
215
|
+
textPassThrough
|
|
215
216
|
}
|
|
216
217
|
)
|
|
217
218
|
)
|
|
@@ -38,7 +38,7 @@ import Animated, { useSharedValue, withTiming, useAnimatedStyle, runOnJS } from
|
|
|
38
38
|
import { warn, hasOwn } from '@mpxjs/utils'
|
|
39
39
|
import useInnerProps, { getCustomEvent } from './getInnerListeners'
|
|
40
40
|
import useNodesRef, { HandlerRef } from './useNodesRef'
|
|
41
|
-
import { splitProps, splitStyle, useTransformStyle, useLayout, wrapChildren, extendObject, flatGesture, GestureHandler, HIDDEN_STYLE, useRunOnJSCallback } from './utils'
|
|
41
|
+
import { splitProps, splitStyle, useTransformStyle, useLayout, wrapChildren, extendObject, flatGesture, GestureHandler, HIDDEN_STYLE, useRunOnJSCallback, useTextPassThroughValue } from './utils'
|
|
42
42
|
import { IntersectionObserverContext, ScrollViewContext } from './context'
|
|
43
43
|
import Portal from './mpx-portal'
|
|
44
44
|
|
|
@@ -203,6 +203,7 @@ const _ScrollView = forwardRef<HandlerRef<ScrollView & View, ScrollViewProps>, S
|
|
|
203
203
|
} = useTransformStyle(style, { enableVar, externalVarContext, parentFontSize, parentWidth, parentHeight })
|
|
204
204
|
|
|
205
205
|
const { textStyle, innerStyle = {} } = splitStyle(normalStyle)
|
|
206
|
+
const textPassThrough = useTextPassThroughValue(textStyle, textProps)
|
|
206
207
|
|
|
207
208
|
const scrollViewRef = useRef<ScrollView>(null)
|
|
208
209
|
|
|
@@ -855,7 +856,15 @@ const _ScrollView = forwardRef<HandlerRef<ScrollView & View, ScrollViewProps>, S
|
|
|
855
856
|
'refresher-triggered',
|
|
856
857
|
'refresher-enabled',
|
|
857
858
|
'refresher-default-style',
|
|
859
|
+
'refresher-threshold',
|
|
858
860
|
'refresher-background',
|
|
861
|
+
'scroll-into-view',
|
|
862
|
+
'enable-sticky',
|
|
863
|
+
'wait-for',
|
|
864
|
+
'simultaneous-handlers',
|
|
865
|
+
'scroll-event-throttle',
|
|
866
|
+
'scroll-into-view-offset',
|
|
867
|
+
'__selectRef',
|
|
859
868
|
'children',
|
|
860
869
|
'enhanced',
|
|
861
870
|
'binddragstart',
|
|
@@ -864,7 +873,8 @@ const _ScrollView = forwardRef<HandlerRef<ScrollView & View, ScrollViewProps>, S
|
|
|
864
873
|
'bindscroll',
|
|
865
874
|
'bindscrolltoupper',
|
|
866
875
|
'bindscrolltolower',
|
|
867
|
-
'bindrefresherrefresh'
|
|
876
|
+
'bindrefresherrefresh',
|
|
877
|
+
'bindscrollend'
|
|
868
878
|
], { layoutRef })
|
|
869
879
|
|
|
870
880
|
const ScrollViewComponent = enableSticky ? AnimatedScrollView : ScrollView
|
|
@@ -874,8 +884,7 @@ const _ScrollView = forwardRef<HandlerRef<ScrollView & View, ScrollViewProps>, S
|
|
|
874
884
|
{
|
|
875
885
|
hasVarDec,
|
|
876
886
|
varContext: varContextRef.current,
|
|
877
|
-
|
|
878
|
-
textProps
|
|
887
|
+
textPassThrough
|
|
879
888
|
})
|
|
880
889
|
return createElement(ScrollViewContext.Provider, { value: contextValue }, wrappedChildren)
|
|
881
890
|
}
|
|
@@ -1,25 +1,72 @@
|
|
|
1
|
-
import { Text, TextProps } from 'react-native'
|
|
2
|
-
import { JSX, createElement } from 'react'
|
|
1
|
+
import { Text, TextStyle, TextProps } from 'react-native'
|
|
2
|
+
import { JSX, createElement, useContext } from 'react'
|
|
3
3
|
import useInnerProps from './getInnerListeners'
|
|
4
|
-
import { extendObject } from './utils'
|
|
4
|
+
import { extendObject, getDefaultAllowFontScaling, useTextPassThroughValue, wrapChildren, isStringChildren, transformBoxSizing, splitStyle, isBoxSizingAffectingStyle } from './utils'
|
|
5
|
+
import { TextPassThroughContext } from './context'
|
|
6
|
+
import * as perf from '@mpxjs/perf'
|
|
5
7
|
|
|
6
8
|
const SimpleText = (props: TextProps): JSX.Element => {
|
|
9
|
+
let stopTotal: (() => void) | undefined
|
|
10
|
+
if (__mpx_perf_framework__) stopTotal = perf.scope('simple-text:render:total')
|
|
11
|
+
|
|
12
|
+
// ───── style 阶段 ─────
|
|
13
|
+
let stopStyle: (() => void) | undefined
|
|
14
|
+
if (__mpx_perf_framework__) stopStyle = perf.scope('simple-text:render:style')
|
|
15
|
+
const inheritedText = useContext(TextPassThroughContext)
|
|
16
|
+
const mergedStyle = extendObject({}, inheritedText?.textStyle, props.style)
|
|
17
|
+
let hasBoxSizingAffectingStyle = false
|
|
18
|
+
const { textStyle = {} } = splitStyle(mergedStyle, (key) => {
|
|
19
|
+
if (!hasBoxSizingAffectingStyle && isBoxSizingAffectingStyle(key)) {
|
|
20
|
+
hasBoxSizingAffectingStyle = true
|
|
21
|
+
}
|
|
22
|
+
})
|
|
23
|
+
const finalStyle = transformBoxSizing(mergedStyle, hasBoxSizingAffectingStyle)
|
|
24
|
+
const mergedProps = extendObject({}, inheritedText?.pendingTextProps, props)
|
|
7
25
|
const {
|
|
8
|
-
allowFontScaling
|
|
26
|
+
allowFontScaling,
|
|
9
27
|
children
|
|
10
|
-
} =
|
|
28
|
+
} = mergedProps
|
|
29
|
+
const isStringOnly = isStringChildren(children)
|
|
30
|
+
const childTextStyle: TextStyle | undefined = !isStringOnly && Object.keys(textStyle).length ? textStyle : undefined
|
|
31
|
+
const childTextPassThrough = useTextPassThroughValue(
|
|
32
|
+
childTextStyle,
|
|
33
|
+
undefined,
|
|
34
|
+
{
|
|
35
|
+
inheritTextProps: false,
|
|
36
|
+
disabled: isStringOnly
|
|
37
|
+
}
|
|
38
|
+
)
|
|
39
|
+
if (__mpx_perf_framework__) stopStyle!()
|
|
11
40
|
|
|
41
|
+
// ───── innerProps 阶段 ─────
|
|
42
|
+
let stopInnerProps: (() => void) | undefined
|
|
43
|
+
if (__mpx_perf_framework__) stopInnerProps = perf.scope('simple-text:render:innerProps')
|
|
12
44
|
const innerProps = useInnerProps(
|
|
13
45
|
extendObject(
|
|
14
46
|
{},
|
|
15
|
-
|
|
47
|
+
mergedProps,
|
|
16
48
|
{
|
|
17
|
-
allowFontScaling
|
|
49
|
+
allowFontScaling: allowFontScaling ?? getDefaultAllowFontScaling(),
|
|
50
|
+
style: finalStyle
|
|
18
51
|
}
|
|
19
52
|
)
|
|
20
53
|
)
|
|
54
|
+
if (__mpx_perf_framework__) stopInnerProps!()
|
|
55
|
+
|
|
56
|
+
// ───── createElement 阶段 ─────
|
|
57
|
+
let stopCreate: (() => void) | undefined
|
|
58
|
+
if (__mpx_perf_framework__) stopCreate = perf.scope('simple-text:render:createElement')
|
|
59
|
+
const result = createElement(Text, innerProps, wrapChildren(
|
|
60
|
+
{ children },
|
|
61
|
+
{
|
|
62
|
+
hasVarDec: false,
|
|
63
|
+
textPassThrough: childTextPassThrough
|
|
64
|
+
}
|
|
65
|
+
))
|
|
66
|
+
if (__mpx_perf_framework__) stopCreate!()
|
|
21
67
|
|
|
22
|
-
|
|
68
|
+
if (__mpx_perf_framework__) stopTotal!()
|
|
69
|
+
return result
|
|
23
70
|
}
|
|
24
71
|
|
|
25
72
|
SimpleText.displayName = 'MpxSimpleText'
|
|
@@ -1,31 +1,55 @@
|
|
|
1
1
|
import { View, ViewProps, TextStyle } from 'react-native'
|
|
2
2
|
import { createElement } from 'react'
|
|
3
|
-
import { splitProps, splitStyle, wrapChildren, extendObject } from './utils'
|
|
3
|
+
import { splitProps, splitStyle, wrapChildren, extendObject, useTextPassThroughValue, transformBoxSizing, isBoxSizingAffectingStyle } from './utils'
|
|
4
4
|
import useInnerProps from './getInnerListeners'
|
|
5
|
+
import * as perf from '@mpxjs/perf'
|
|
5
6
|
|
|
6
7
|
const SimpleView = (simpleViewProps: ViewProps): JSX.Element => {
|
|
8
|
+
let stopTotal: (() => void) | undefined
|
|
9
|
+
if (__mpx_perf_framework__) stopTotal = perf.scope('simple-view:render:total')
|
|
10
|
+
|
|
11
|
+
// ───── style 阶段 ─────
|
|
12
|
+
let stopStyle: (() => void) | undefined
|
|
13
|
+
if (__mpx_perf_framework__) stopStyle = perf.scope('simple-view:render:style')
|
|
7
14
|
const { textProps, innerProps: props = {} } = splitProps(simpleViewProps)
|
|
8
15
|
|
|
9
|
-
|
|
16
|
+
let hasBoxSizingAffectingStyle = false
|
|
17
|
+
const { textStyle, innerStyle = {} } = splitStyle(props.style || {}, (key) => {
|
|
18
|
+
if (!hasBoxSizingAffectingStyle && isBoxSizingAffectingStyle(key)) {
|
|
19
|
+
hasBoxSizingAffectingStyle = true
|
|
20
|
+
}
|
|
21
|
+
})
|
|
22
|
+
const textPassThrough = useTextPassThroughValue(textStyle as TextStyle, textProps)
|
|
23
|
+
if (__mpx_perf_framework__) stopStyle!()
|
|
10
24
|
|
|
25
|
+
// ───── innerProps 阶段 ─────
|
|
26
|
+
let stopInnerProps: (() => void) | undefined
|
|
27
|
+
if (__mpx_perf_framework__) stopInnerProps = perf.scope('simple-view:render:innerProps')
|
|
11
28
|
const innerProps = useInnerProps(
|
|
12
29
|
extendObject(
|
|
13
30
|
{},
|
|
14
31
|
props,
|
|
15
32
|
{
|
|
16
|
-
style: innerStyle
|
|
33
|
+
style: transformBoxSizing(extendObject({}, innerStyle), hasBoxSizingAffectingStyle)
|
|
17
34
|
}
|
|
18
35
|
)
|
|
19
36
|
)
|
|
37
|
+
if (__mpx_perf_framework__) stopInnerProps!()
|
|
20
38
|
|
|
21
|
-
|
|
39
|
+
// ───── createElement 阶段 ─────
|
|
40
|
+
let stopCreate: (() => void) | undefined
|
|
41
|
+
if (__mpx_perf_framework__) stopCreate = perf.scope('simple-view:render:createElement')
|
|
42
|
+
const result = createElement(View, innerProps, wrapChildren(
|
|
22
43
|
props,
|
|
23
44
|
{
|
|
24
45
|
hasVarDec: false,
|
|
25
|
-
|
|
26
|
-
textProps
|
|
46
|
+
textPassThrough
|
|
27
47
|
}
|
|
28
48
|
))
|
|
49
|
+
if (__mpx_perf_framework__) stopCreate!()
|
|
50
|
+
|
|
51
|
+
if (__mpx_perf_framework__) stopTotal!()
|
|
52
|
+
return result
|
|
29
53
|
}
|
|
30
54
|
|
|
31
55
|
SimpleView.displayName = 'MpxSimpleView'
|
|
@@ -2,7 +2,7 @@ import { useEffect, useRef, useContext, forwardRef, useMemo, createElement, Reac
|
|
|
2
2
|
import { Animated, StyleSheet, View, NativeSyntheticEvent, ViewStyle, LayoutChangeEvent, useAnimatedValue } from 'react-native'
|
|
3
3
|
import { ScrollViewContext, StickyContext } from './context'
|
|
4
4
|
import useNodesRef, { HandlerRef } from './useNodesRef'
|
|
5
|
-
import { splitProps, splitStyle, useTransformStyle, wrapChildren, useLayout, extendObject } from './utils'
|
|
5
|
+
import { splitProps, splitStyle, useTransformStyle, wrapChildren, useLayout, extendObject, useTextPassThroughValue } from './utils'
|
|
6
6
|
import { error } from '@mpxjs/utils'
|
|
7
7
|
import useInnerProps, { getCustomEvent } from './getInnerListeners'
|
|
8
8
|
|
|
@@ -52,6 +52,7 @@ const _StickyHeader = forwardRef<HandlerRef<View, StickyHeaderProps>, StickyHead
|
|
|
52
52
|
const { layoutRef, layoutProps } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef: headerRef, onLayout })
|
|
53
53
|
|
|
54
54
|
const { textStyle, innerStyle = {} } = splitStyle(normalStyle)
|
|
55
|
+
const textPassThrough = useTextPassThroughValue(textStyle, textProps)
|
|
55
56
|
|
|
56
57
|
const headerTopAnimated = useAnimatedValue(0)
|
|
57
58
|
// harmony animatedValue 不支持通过 _value 访问
|
|
@@ -149,7 +150,11 @@ const _StickyHeader = forwardRef<HandlerRef<View, StickyHeaderProps>, StickyHead
|
|
|
149
150
|
paddingBottom: padding[2] || 0,
|
|
150
151
|
paddingLeft: padding[3] || 0
|
|
151
152
|
})
|
|
152
|
-
}, layoutProps), [
|
|
153
|
+
}, layoutProps), [
|
|
154
|
+
'padding',
|
|
155
|
+
'offset-top',
|
|
156
|
+
'bindstickontopchange'
|
|
157
|
+
], { layoutRef })
|
|
153
158
|
|
|
154
159
|
return (
|
|
155
160
|
createElement(
|
|
@@ -160,8 +165,7 @@ const _StickyHeader = forwardRef<HandlerRef<View, StickyHeaderProps>, StickyHead
|
|
|
160
165
|
{
|
|
161
166
|
hasVarDec,
|
|
162
167
|
varContext: varContextRef.current,
|
|
163
|
-
|
|
164
|
-
textProps
|
|
168
|
+
textPassThrough
|
|
165
169
|
}
|
|
166
170
|
)
|
|
167
171
|
)
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
import { useRef, forwardRef, createElement, ReactNode, useCallback, useMemo } from 'react'
|
|
3
3
|
import { View, ViewStyle } from 'react-native'
|
|
4
4
|
import useNodesRef, { HandlerRef } from './useNodesRef'
|
|
5
|
-
import { splitProps, splitStyle, useTransformStyle, wrapChildren, useLayout, extendObject } from './utils'
|
|
5
|
+
import { splitProps, splitStyle, useTransformStyle, wrapChildren, useLayout, extendObject, useTextPassThroughValue } from './utils'
|
|
6
6
|
import { StickyContext } from './context'
|
|
7
7
|
import useInnerProps from './getInnerListeners'
|
|
8
8
|
|
|
@@ -41,6 +41,7 @@ const _StickySection = forwardRef<HandlerRef<View, StickySectionProps>, StickySe
|
|
|
41
41
|
const { layoutRef, layoutProps, layoutStyle } = useLayout({ props, hasSelfPercent, setWidth, setHeight, nodeRef: sectionRef, onLayout })
|
|
42
42
|
|
|
43
43
|
const { textStyle, innerStyle = {} } = splitStyle(normalStyle)
|
|
44
|
+
const textPassThrough = useTextPassThroughValue(textStyle, textProps)
|
|
44
45
|
|
|
45
46
|
const stickyHeaders = useRef<Map<string, any>>(new Map())
|
|
46
47
|
|
|
@@ -70,7 +71,9 @@ const _StickySection = forwardRef<HandlerRef<View, StickySectionProps>, StickySe
|
|
|
70
71
|
const innerProps = useInnerProps(extendObject({}, props, {
|
|
71
72
|
style: extendObject(innerStyle, layoutStyle),
|
|
72
73
|
ref: sectionRef
|
|
73
|
-
}, layoutProps), [
|
|
74
|
+
}, layoutProps), [
|
|
75
|
+
'offset-top'
|
|
76
|
+
], { layoutRef })
|
|
74
77
|
|
|
75
78
|
return (
|
|
76
79
|
createElement(
|
|
@@ -84,8 +87,7 @@ const _StickySection = forwardRef<HandlerRef<View, StickySectionProps>, StickySe
|
|
|
84
87
|
{
|
|
85
88
|
hasVarDec,
|
|
86
89
|
varContext: varContextRef.current,
|
|
87
|
-
|
|
88
|
-
textProps
|
|
90
|
+
textPassThrough
|
|
89
91
|
}
|
|
90
92
|
)
|
|
91
93
|
))
|
|
@@ -3,7 +3,7 @@ import Animated, { useAnimatedStyle, interpolate, SharedValue } from 'react-nati
|
|
|
3
3
|
import { ReactNode, forwardRef, useRef, useContext, createElement } from 'react'
|
|
4
4
|
import useInnerProps from './getInnerListeners'
|
|
5
5
|
import useNodesRef, { HandlerRef } from './useNodesRef' // 引入辅助函数
|
|
6
|
-
import { useTransformStyle, splitStyle, splitProps, wrapChildren, useLayout, extendObject, isHarmony } from './utils'
|
|
6
|
+
import { useTransformStyle, splitStyle, splitProps, wrapChildren, useLayout, extendObject, isHarmony, useTextPassThroughValue } from './utils'
|
|
7
7
|
import { SwiperContext } from './context'
|
|
8
8
|
|
|
9
9
|
interface SwiperItemProps {
|
|
@@ -53,6 +53,7 @@ const _SwiperItem = forwardRef<HandlerRef<View, SwiperItemProps>, SwiperItemProp
|
|
|
53
53
|
setHeight
|
|
54
54
|
} = useTransformStyle(style, { enableVar, externalVarContext })
|
|
55
55
|
const { textStyle, innerStyle } = splitStyle(normalStyle)
|
|
56
|
+
const textPassThrough = useTextPassThroughValue(textStyle, textProps)
|
|
56
57
|
useNodesRef(props, ref, nodeRef, {
|
|
57
58
|
style: normalStyle
|
|
58
59
|
})
|
|
@@ -76,7 +77,10 @@ const _SwiperItem = forwardRef<HandlerRef<View, SwiperItemProps>, SwiperItemProp
|
|
|
76
77
|
[
|
|
77
78
|
'children',
|
|
78
79
|
'enable-offset',
|
|
79
|
-
'style'
|
|
80
|
+
'style',
|
|
81
|
+
'item-id',
|
|
82
|
+
'customStyle',
|
|
83
|
+
'itemIndex'
|
|
80
84
|
],
|
|
81
85
|
{ layoutRef })
|
|
82
86
|
const itemAnimatedStyle = useAnimatedStyle(() => {
|
|
@@ -102,8 +106,7 @@ const _SwiperItem = forwardRef<HandlerRef<View, SwiperItemProps>, SwiperItemProp
|
|
|
102
106
|
return createElement(Animated.View, mergeProps, wrapChildren(props, {
|
|
103
107
|
hasVarDec,
|
|
104
108
|
varContext: varContextRef.current,
|
|
105
|
-
|
|
106
|
-
textProps
|
|
109
|
+
textPassThrough
|
|
107
110
|
}))
|
|
108
111
|
})
|
|
109
112
|
|
|
@@ -5,7 +5,7 @@ import Animated, { useAnimatedStyle, useSharedValue, withTiming, Easing, runOnJS
|
|
|
5
5
|
import React, { JSX, forwardRef, useRef, useEffect, ReactNode, ReactElement, useMemo, createElement } from 'react'
|
|
6
6
|
import useInnerProps, { getCustomEvent } from './getInnerListeners'
|
|
7
7
|
import useNodesRef, { HandlerRef } from './useNodesRef' // 引入辅助函数
|
|
8
|
-
import { useTransformStyle, splitStyle, splitProps, useLayout, wrapChildren, extendObject, GestureHandler, flatGesture, useRunOnJSCallback } from './utils'
|
|
8
|
+
import { useTransformStyle, splitStyle, splitProps, useLayout, wrapChildren, extendObject, GestureHandler, flatGesture, useRunOnJSCallback, useTextPassThroughValue } from './utils'
|
|
9
9
|
import { SwiperContext } from './context'
|
|
10
10
|
import Portal from './mpx-portal'
|
|
11
11
|
/**
|
|
@@ -199,6 +199,7 @@ const SwiperWrapper = forwardRef<HandlerRef<View, SwiperProps>, SwiperProps>((pr
|
|
|
199
199
|
})
|
|
200
200
|
const { textStyle } = splitStyle(normalStyle)
|
|
201
201
|
const { textProps } = splitProps(props)
|
|
202
|
+
const textPassThrough = useTextPassThroughValue(textStyle, textProps)
|
|
202
203
|
const preMargin = props['previous-margin'] ? global.__formatValue(props['previous-margin']) as number : 0
|
|
203
204
|
const nextMargin = props['next-margin'] ? global.__formatValue(props['next-margin']) as number : 0
|
|
204
205
|
const preMarginShared = useSharedValue(preMargin)
|
|
@@ -278,6 +279,10 @@ const SwiperWrapper = forwardRef<HandlerRef<View, SwiperProps>, SwiperProps>((pr
|
|
|
278
279
|
'indicator-dots',
|
|
279
280
|
'indicator-color',
|
|
280
281
|
'indicator-width',
|
|
282
|
+
'indicator-height',
|
|
283
|
+
'indicator-radius',
|
|
284
|
+
'indicator-spacing',
|
|
285
|
+
'indicator-margin',
|
|
281
286
|
'indicator-active-color',
|
|
282
287
|
'previous-margin',
|
|
283
288
|
'vertical',
|
|
@@ -287,7 +292,15 @@ const SwiperWrapper = forwardRef<HandlerRef<View, SwiperProps>, SwiperProps>((pr
|
|
|
287
292
|
'autoplay',
|
|
288
293
|
'circular',
|
|
289
294
|
'interval',
|
|
290
|
-
'easing-function'
|
|
295
|
+
'easing-function',
|
|
296
|
+
'current',
|
|
297
|
+
'duration',
|
|
298
|
+
'scale',
|
|
299
|
+
'disableGesture',
|
|
300
|
+
'wait-for',
|
|
301
|
+
'simultaneous-handlers',
|
|
302
|
+
'bindchange'
|
|
303
|
+
|
|
291
304
|
], { layoutRef: layoutRef })
|
|
292
305
|
|
|
293
306
|
function onWrapperLayout (e: LayoutChangeEvent) {
|
|
@@ -922,8 +935,7 @@ const SwiperWrapper = forwardRef<HandlerRef<View, SwiperProps>, SwiperProps>((pr
|
|
|
922
935
|
}, {
|
|
923
936
|
hasVarDec,
|
|
924
937
|
varContext: varContextRef.current,
|
|
925
|
-
|
|
926
|
-
textProps
|
|
938
|
+
textPassThrough
|
|
927
939
|
}))
|
|
928
940
|
const renderChildrens = showPagination ? [animateComponent, renderPagination()] : animateComponent
|
|
929
941
|
finalComponent = createElement(View, mergeProps, renderChildrens)
|