@mpxjs/webpack-plugin 2.10.14-beta.4 → 2.10.14-beta.6
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/platform/template/wx/component-config/index.js +3 -1
- package/lib/platform/template/wx/component-config/nav-container.js +27 -0
- package/lib/runtime/components/ali/mpx-nav-container.mpx +3 -0
- package/lib/runtime/components/react/context.ts +17 -6
- package/lib/runtime/components/react/dist/context.d.ts +78 -0
- package/lib/runtime/components/react/dist/context.js +1 -0
- package/lib/runtime/components/react/dist/event.config.d.ts +7 -0
- package/lib/runtime/components/react/dist/getInnerListeners.d.ts +7 -0
- package/lib/runtime/components/react/dist/mpx-async-suspense.d.ts +12 -0
- package/lib/runtime/components/react/dist/mpx-button.d.ts +68 -0
- package/lib/runtime/components/react/dist/mpx-canvas/Bus.d.ts +23 -0
- package/lib/runtime/components/react/dist/mpx-canvas/CanvasGradient.d.ts +7 -0
- package/lib/runtime/components/react/dist/mpx-canvas/CanvasRenderingContext2D.d.ts +6 -0
- package/lib/runtime/components/react/dist/mpx-canvas/Image.d.ts +20 -0
- package/lib/runtime/components/react/dist/mpx-canvas/ImageData.d.ts +8 -0
- package/lib/runtime/components/react/dist/mpx-canvas/constructorsRegistry.d.ts +10 -0
- package/lib/runtime/components/react/dist/mpx-canvas/html.d.ts +2 -0
- package/lib/runtime/components/react/dist/mpx-canvas/index.d.ts +32 -0
- package/lib/runtime/components/react/dist/mpx-canvas/utils.d.ts +52 -0
- package/lib/runtime/components/react/dist/mpx-checkbox-group.d.ts +20 -0
- package/lib/runtime/components/react/dist/mpx-checkbox.d.ts +32 -0
- package/lib/runtime/components/react/dist/mpx-form.d.ts +27 -0
- package/lib/runtime/components/react/dist/mpx-icon/index.d.ts +18 -0
- package/lib/runtime/components/react/dist/mpx-image.d.ts +21 -0
- package/lib/runtime/components/react/dist/mpx-inline-text.d.ts +7 -0
- package/lib/runtime/components/react/dist/mpx-input.d.ts +49 -0
- package/lib/runtime/components/react/dist/mpx-input.jsx +28 -9
- package/lib/runtime/components/react/dist/mpx-keyboard-avoiding-view.d.ts +12 -0
- package/lib/runtime/components/react/dist/mpx-keyboard-avoiding-view.jsx +52 -51
- package/lib/runtime/components/react/dist/mpx-label.d.ts +20 -0
- package/lib/runtime/components/react/dist/mpx-movable-area.d.ts +20 -0
- package/lib/runtime/components/react/dist/mpx-movable-view.d.ts +63 -0
- package/lib/runtime/components/react/dist/mpx-nav-container.d.ts +9 -0
- package/lib/runtime/components/react/dist/mpx-nav-container.jsx +23 -0
- package/lib/runtime/components/react/dist/mpx-navigator.d.ts +9 -0
- package/lib/runtime/components/react/dist/mpx-picker/date.d.ts +6 -0
- package/lib/runtime/components/react/dist/mpx-picker/dateData.d.ts +7 -0
- package/lib/runtime/components/react/dist/mpx-picker/index.d.ts +6 -0
- package/lib/runtime/components/react/dist/mpx-picker/multiSelector.d.ts +6 -0
- package/lib/runtime/components/react/dist/mpx-picker/region.d.ts +6 -0
- package/lib/runtime/components/react/dist/mpx-picker/regionData.d.ts +2 -0
- package/lib/runtime/components/react/dist/mpx-picker/selector.d.ts +6 -0
- package/lib/runtime/components/react/dist/mpx-picker/time.d.ts +6 -0
- package/lib/runtime/components/react/dist/mpx-picker/type.d.ts +106 -0
- package/lib/runtime/components/react/dist/mpx-picker-view/index.d.ts +31 -0
- package/lib/runtime/components/react/dist/mpx-picker-view/pickerVIewContext.d.ts +8 -0
- package/lib/runtime/components/react/dist/mpx-picker-view-column/index.d.ts +22 -0
- package/lib/runtime/components/react/dist/mpx-picker-view-column/pickerViewColumnItem.d.ts +14 -0
- package/lib/runtime/components/react/dist/mpx-picker-view-column/pickerViewFaces.d.ts +16 -0
- package/lib/runtime/components/react/dist/mpx-picker-view-column/pickerViewIndicator.d.ts +12 -0
- package/lib/runtime/components/react/dist/mpx-picker-view-column/pickerViewMask.d.ts +11 -0
- package/lib/runtime/components/react/dist/mpx-popup/index.d.ts +22 -0
- package/lib/runtime/components/react/dist/mpx-popup/popupBase.d.ts +16 -0
- package/lib/runtime/components/react/dist/mpx-portal/index.d.ts +15 -0
- package/lib/runtime/components/react/dist/mpx-portal/portal-host.d.ts +29 -0
- package/lib/runtime/components/react/dist/mpx-portal/portal-manager.d.ts +9 -0
- package/lib/runtime/components/react/dist/mpx-radio-group.d.ts +20 -0
- package/lib/runtime/components/react/dist/mpx-radio.d.ts +26 -0
- package/lib/runtime/components/react/dist/mpx-rich-text/html.d.ts +1 -0
- package/lib/runtime/components/react/dist/mpx-rich-text/index.d.ts +24 -0
- package/lib/runtime/components/react/dist/mpx-root-portal.d.ts +14 -0
- package/lib/runtime/components/react/dist/mpx-scroll-view.d.ts +54 -0
- package/lib/runtime/components/react/dist/mpx-simple-text.d.ts +7 -0
- package/lib/runtime/components/react/dist/mpx-simple-view.d.ts +7 -0
- package/lib/runtime/components/react/dist/mpx-sticky-header.d.ts +17 -0
- package/lib/runtime/components/react/dist/mpx-sticky-section.d.ts +15 -0
- package/lib/runtime/components/react/dist/mpx-swiper-item.d.ts +18 -0
- package/lib/runtime/components/react/dist/mpx-swiper.d.ts +52 -0
- package/lib/runtime/components/react/dist/mpx-switch.d.ts +26 -0
- package/lib/runtime/components/react/dist/mpx-text.d.ts +21 -0
- package/lib/runtime/components/react/dist/mpx-textarea.d.ts +7 -0
- package/lib/runtime/components/react/dist/mpx-video.d.ts +101 -0
- package/lib/runtime/components/react/dist/mpx-view.d.ts +34 -0
- package/lib/runtime/components/react/dist/mpx-web-view.d.ts +22 -0
- package/lib/runtime/components/react/dist/nav.d.ts +8 -0
- package/lib/runtime/components/react/dist/nav.jsx +137 -0
- package/lib/runtime/components/react/dist/parser.d.ts +39 -0
- package/lib/runtime/components/react/dist/useAnimationHooks.d.ts +32 -0
- package/lib/runtime/components/react/dist/useNavShared.d.ts +2 -0
- package/lib/runtime/components/react/dist/useNavShared.js +6 -0
- package/lib/runtime/components/react/dist/useNodesRef.d.ts +11 -0
- package/lib/runtime/components/react/dist/utils.d.ts +122 -0
- package/lib/runtime/components/react/mpx-input.tsx +35 -16
- package/lib/runtime/components/react/mpx-keyboard-avoiding-view.tsx +58 -59
- package/lib/runtime/components/react/mpx-nav-container.tsx +33 -0
- package/lib/runtime/components/react/nav.tsx +163 -0
- package/lib/runtime/components/react/types/common.d.ts +19 -0
- package/lib/runtime/components/react/useNavShared.ts +8 -0
- package/lib/runtime/components/web/mpx-nav-container.vue +13 -0
- package/lib/runtime/components/wx/mpx-nav-container.mpx +9 -0
- package/lib/utils/dom-tag-config.js +2 -2
- package/package.json +1 -1
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { TextInput, TextStyle, ViewStyle, NativeSyntheticEvent, TextInputTextInputEventData, TextInputKeyPressEventData, TextInputContentSizeChangeEventData, FlexStyle, TextInputSelectionChangeEventData, TextInputFocusEventData, TextInputSubmitEditingEventData } from 'react-native';
|
|
3
|
+
import { HandlerRef } from './useNodesRef';
|
|
4
|
+
type InputStyle = Omit<TextStyle & ViewStyle & Pick<FlexStyle, 'minHeight'>, 'borderLeftWidth' | 'borderTopWidth' | 'borderRightWidth' | 'borderBottomWidth' | 'borderTopLeftRadius' | 'borderTopRightRadius' | 'borderBottomRightRadius' | 'borderBottomLeftRadius'>;
|
|
5
|
+
type Type = 'text' | 'number' | 'idcard' | 'digit';
|
|
6
|
+
type ConfirmType = 'done' | 'send' | 'search' | 'next' | 'go' | 'return';
|
|
7
|
+
export interface InputProps {
|
|
8
|
+
name?: string;
|
|
9
|
+
style?: InputStyle & Record<string, any>;
|
|
10
|
+
value?: string | number;
|
|
11
|
+
type?: Type;
|
|
12
|
+
password?: boolean;
|
|
13
|
+
placeholder?: string;
|
|
14
|
+
disabled?: boolean;
|
|
15
|
+
'cursor-spacing'?: number;
|
|
16
|
+
maxlength?: number;
|
|
17
|
+
'auto-focus'?: boolean;
|
|
18
|
+
focus?: boolean;
|
|
19
|
+
'confirm-type'?: ConfirmType;
|
|
20
|
+
'confirm-hold'?: boolean;
|
|
21
|
+
cursor?: number;
|
|
22
|
+
'cursor-color'?: string;
|
|
23
|
+
'selection-start'?: number;
|
|
24
|
+
'selection-end'?: number;
|
|
25
|
+
'placeholder-style'?: {
|
|
26
|
+
color?: string;
|
|
27
|
+
};
|
|
28
|
+
'enable-offset'?: boolean;
|
|
29
|
+
'enable-var'?: boolean;
|
|
30
|
+
'external-var-context'?: Record<string, any>;
|
|
31
|
+
'parent-font-size'?: number;
|
|
32
|
+
'parent-width'?: number;
|
|
33
|
+
'parent-height'?: number;
|
|
34
|
+
'adjust-position': boolean;
|
|
35
|
+
bindinput?: (evt: NativeSyntheticEvent<TextInputTextInputEventData> | unknown) => void;
|
|
36
|
+
bindfocus?: (evt: NativeSyntheticEvent<TextInputFocusEventData> | unknown) => void;
|
|
37
|
+
bindblur?: (evt: NativeSyntheticEvent<TextInputFocusEventData> | unknown) => void;
|
|
38
|
+
bindconfirm?: (evt: NativeSyntheticEvent<TextInputSubmitEditingEventData | TextInputKeyPressEventData> | unknown) => void;
|
|
39
|
+
bindselectionchange?: (evt: NativeSyntheticEvent<TextInputSelectionChangeEventData> | unknown) => void;
|
|
40
|
+
}
|
|
41
|
+
export interface PrivateInputProps {
|
|
42
|
+
allowFontScaling?: boolean;
|
|
43
|
+
multiline?: boolean;
|
|
44
|
+
'auto-height'?: boolean;
|
|
45
|
+
bindlinechange?: (evt: NativeSyntheticEvent<TextInputContentSizeChangeEventData> | unknown) => void;
|
|
46
|
+
}
|
|
47
|
+
type FinalInputProps = InputProps & PrivateInputProps;
|
|
48
|
+
declare const Input: import("react").ForwardRefExoticComponent<InputProps & PrivateInputProps & import("react").RefAttributes<HandlerRef<TextInput, FinalInputProps>>>;
|
|
49
|
+
export default Input;
|
|
@@ -144,8 +144,8 @@ const Input = forwardRef((props, ref) => {
|
|
|
144
144
|
}
|
|
145
145
|
};
|
|
146
146
|
const setKeyboardAvoidContext = () => {
|
|
147
|
-
if (
|
|
148
|
-
keyboardAvoid.current = { cursorSpacing, ref: nodeRef };
|
|
147
|
+
if (keyboardAvoid) {
|
|
148
|
+
keyboardAvoid.current = { cursorSpacing, ref: nodeRef, adjustPosition };
|
|
149
149
|
}
|
|
150
150
|
};
|
|
151
151
|
const onTouchStart = () => {
|
|
@@ -156,13 +156,32 @@ const Input = forwardRef((props, ref) => {
|
|
|
156
156
|
evt.nativeEvent.origin = 'input';
|
|
157
157
|
};
|
|
158
158
|
const onFocus = (evt) => {
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
159
|
+
if (!keyboardAvoid?.current) {
|
|
160
|
+
setKeyboardAvoidContext();
|
|
161
|
+
}
|
|
162
|
+
if (bindfocus && keyboardAvoid?.current) {
|
|
163
|
+
const focusAction = () => {
|
|
164
|
+
bindfocus(getCustomEvent('focus', evt, {
|
|
165
|
+
detail: {
|
|
166
|
+
value: tmpValue.current || '',
|
|
167
|
+
height: keyboardAvoid.current?.keyboardHeight,
|
|
168
|
+
},
|
|
169
|
+
layoutRef
|
|
170
|
+
}, props));
|
|
171
|
+
if (keyboardAvoid.current?.onKeyboardShow) {
|
|
172
|
+
keyboardAvoid.current.onKeyboardShow = undefined;
|
|
173
|
+
}
|
|
174
|
+
};
|
|
175
|
+
if (keyboardAvoid.current.keyboardHeight) {
|
|
176
|
+
// iOS: keyboard 获取高度时机 keyboardWillShow 在 input focus 之前,可以立即执行
|
|
177
|
+
focusAction();
|
|
178
|
+
}
|
|
179
|
+
else {
|
|
180
|
+
// Android,Harmony: keyboard 获取高度时机 keyboardDidShow 在 input focus 之后,需要延迟回调
|
|
181
|
+
evt.persist();
|
|
182
|
+
keyboardAvoid.current.onKeyboardShow = focusAction;
|
|
183
|
+
}
|
|
184
|
+
}
|
|
166
185
|
};
|
|
167
186
|
const onBlur = (evt) => {
|
|
168
187
|
bindblur && bindblur(getCustomEvent('blur', evt, {
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React, { ReactNode } from 'react';
|
|
2
|
+
import { ViewStyle } from 'react-native';
|
|
3
|
+
type KeyboardAvoidViewProps = {
|
|
4
|
+
children?: ReactNode;
|
|
5
|
+
style?: ViewStyle;
|
|
6
|
+
contentContainerStyle?: ViewStyle;
|
|
7
|
+
};
|
|
8
|
+
declare const KeyboardAvoidingView: {
|
|
9
|
+
({ children, style, contentContainerStyle }: KeyboardAvoidViewProps): React.JSX.Element;
|
|
10
|
+
displayName: string;
|
|
11
|
+
};
|
|
12
|
+
export default KeyboardAvoidingView;
|
|
@@ -2,7 +2,7 @@ import React, { useContext, useEffect, useRef } from 'react';
|
|
|
2
2
|
import { Keyboard, View } from 'react-native';
|
|
3
3
|
import Animated, { useSharedValue, useAnimatedStyle, withTiming, Easing, cancelAnimation } from 'react-native-reanimated';
|
|
4
4
|
import { KeyboardAvoidContext } from './context';
|
|
5
|
-
import { isIOS } from './utils';
|
|
5
|
+
import { isAndroid, isIOS } from './utils';
|
|
6
6
|
const KeyboardAvoidingView = ({ children, style, contentContainerStyle }) => {
|
|
7
7
|
const duration = isIOS ? 250 : 300;
|
|
8
8
|
const easing = isIOS ? Easing.inOut(Easing.ease) : Easing.out(Easing.quad);
|
|
@@ -15,7 +15,8 @@ const KeyboardAvoidingView = ({ children, style, contentContainerStyle }) => {
|
|
|
15
15
|
const isShow = useRef(false);
|
|
16
16
|
const timerRef = useRef(null);
|
|
17
17
|
const animatedStyle = useAnimatedStyle(() => ({
|
|
18
|
-
|
|
18
|
+
// translate/position top可能会导致底部渲染区域缺失
|
|
19
|
+
marginTop: -offset.value,
|
|
19
20
|
flexBasis: basic.value
|
|
20
21
|
}));
|
|
21
22
|
const resetKeyboard = () => {
|
|
@@ -25,6 +26,11 @@ const KeyboardAvoidingView = ({ children, style, contentContainerStyle }) => {
|
|
|
25
26
|
isShow.current = false;
|
|
26
27
|
timerRef.current && clearTimeout(timerRef.current);
|
|
27
28
|
if (keyboardAvoid?.current) {
|
|
29
|
+
const inputRef = keyboardAvoid.current.ref?.current;
|
|
30
|
+
if (inputRef && inputRef.isFocused()) {
|
|
31
|
+
// 修复 Android 点击键盘收起按钮时当前 input 没触发失焦的问题
|
|
32
|
+
inputRef.blur();
|
|
33
|
+
}
|
|
28
34
|
keyboardAvoid.current = null;
|
|
29
35
|
}
|
|
30
36
|
cancelAnimation(offset);
|
|
@@ -38,59 +44,59 @@ const KeyboardAvoidingView = ({ children, style, contentContainerStyle }) => {
|
|
|
38
44
|
};
|
|
39
45
|
useEffect(() => {
|
|
40
46
|
let subscriptions = [];
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
47
|
+
function keybaordAvoding(evt, ios = false) {
|
|
48
|
+
if (!keyboardAvoid?.current || isShow.current) {
|
|
49
|
+
return;
|
|
50
|
+
}
|
|
51
|
+
isShow.current = true;
|
|
52
|
+
if (ios) {
|
|
53
|
+
timerRef.current && clearTimeout(timerRef.current);
|
|
54
|
+
}
|
|
55
|
+
const { endCoordinates } = evt;
|
|
56
|
+
const { ref, cursorSpacing = 0, adjustPosition, onKeyboardShow } = keyboardAvoid.current;
|
|
57
|
+
keyboardAvoid.current.keyboardHeight = endCoordinates.height;
|
|
58
|
+
onKeyboardShow?.();
|
|
59
|
+
if (adjustPosition) {
|
|
60
|
+
// 默认沿用旧版本逻辑,在 android 原生关闭键盘避让的情况下应该将该配置设置为 false,走 mpx 的键盘避让逻辑,否则bundle内的所有input都会无法避让键盘
|
|
61
|
+
const enableNativeKeyboardAvoiding = mpxGlobal?.__mpx?.config?.rnConfig?.enableNativeKeyboardAvoiding ?? true;
|
|
62
|
+
const callback = () => {
|
|
63
|
+
ref?.current?.measure((x, y, width, height, pageX, pageY) => {
|
|
64
|
+
function calculateOffset() {
|
|
65
|
+
// enableNativeKeyboardAvoding 默认开启
|
|
66
|
+
if (enableNativeKeyboardAvoiding && isAndroid) {
|
|
67
|
+
const aboveOffset = offset.value + pageY + height - endCoordinates.screenY;
|
|
68
|
+
const aboveValue = -aboveOffset >= cursorSpacing ? 0 : aboveOffset + cursorSpacing;
|
|
69
|
+
const belowValue = Math.min(endCoordinates.height, aboveOffset + cursorSpacing);
|
|
70
|
+
return aboveOffset > 0 ? belowValue : aboveValue;
|
|
71
|
+
}
|
|
53
72
|
const aboveOffset = offset.value + pageY + height - endCoordinates.screenY;
|
|
54
73
|
const aboveValue = -aboveOffset >= cursorSpacing ? 0 : aboveOffset + cursorSpacing;
|
|
55
74
|
const belowValue = Math.min(endCoordinates.height, aboveOffset + cursorSpacing);
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
offset.value = withTiming(value, { duration, easing }, (finished) => {
|
|
59
|
-
if (finished) {
|
|
60
|
-
// Set flexBasic after animation to trigger re-layout and reset layout information
|
|
61
|
-
basic.value = '99.99%';
|
|
62
|
-
}
|
|
63
|
-
});
|
|
64
|
-
});
|
|
65
|
-
});
|
|
66
|
-
}),
|
|
67
|
-
Keyboard.addListener('keyboardWillHide', resetKeyboard)
|
|
68
|
-
];
|
|
69
|
-
}
|
|
70
|
-
else {
|
|
71
|
-
subscriptions = [
|
|
72
|
-
Keyboard.addListener('keyboardDidShow', (evt) => {
|
|
73
|
-
if (!keyboardAvoid?.current || isShow.current) {
|
|
74
|
-
return;
|
|
75
|
-
}
|
|
76
|
-
isShow.current = true;
|
|
77
|
-
const { endCoordinates } = evt;
|
|
78
|
-
const { ref, cursorSpacing = 0 } = keyboardAvoid.current;
|
|
79
|
-
ref?.current?.measure((x, y, width, height, pageX, pageY) => {
|
|
80
|
-
const aboveOffset = pageY + height - endCoordinates.screenY;
|
|
81
|
-
const belowOffset = endCoordinates.height - aboveOffset;
|
|
82
|
-
const aboveValue = -aboveOffset >= cursorSpacing ? 0 : aboveOffset + cursorSpacing;
|
|
83
|
-
const belowValue = Math.min(belowOffset, cursorSpacing);
|
|
84
|
-
const value = aboveOffset > 0 ? belowValue : aboveValue;
|
|
75
|
+
return aboveOffset > 0 ? belowValue : aboveValue;
|
|
76
|
+
}
|
|
85
77
|
cancelAnimation(offset);
|
|
86
|
-
offset.value = withTiming(
|
|
78
|
+
offset.value = withTiming(calculateOffset(), { duration, easing }, finished => {
|
|
87
79
|
if (finished) {
|
|
88
80
|
// Set flexBasic after animation to trigger re-layout and reset layout information
|
|
89
81
|
basic.value = '99.99%';
|
|
90
82
|
}
|
|
91
83
|
});
|
|
92
84
|
});
|
|
85
|
+
};
|
|
86
|
+
(isIOS ? () => (timerRef.current = setTimeout(callback)) : callback)();
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
if (isIOS) {
|
|
90
|
+
subscriptions = [
|
|
91
|
+
Keyboard.addListener('keyboardWillShow', (evt) => {
|
|
92
|
+
keybaordAvoding(evt, true);
|
|
93
93
|
}),
|
|
94
|
+
Keyboard.addListener('keyboardWillHide', resetKeyboard)
|
|
95
|
+
];
|
|
96
|
+
}
|
|
97
|
+
else {
|
|
98
|
+
subscriptions = [
|
|
99
|
+
Keyboard.addListener('keyboardDidShow', keybaordAvoding),
|
|
94
100
|
Keyboard.addListener('keyboardDidHide', resetKeyboard)
|
|
95
101
|
];
|
|
96
102
|
}
|
|
@@ -99,13 +105,8 @@ const KeyboardAvoidingView = ({ children, style, contentContainerStyle }) => {
|
|
|
99
105
|
timerRef.current && clearTimeout(timerRef.current);
|
|
100
106
|
};
|
|
101
107
|
}, [keyboardAvoid]);
|
|
102
|
-
return (<View style={style} onTouchEnd={onTouchEnd}>
|
|
103
|
-
<Animated.View style={[
|
|
104
|
-
contentContainerStyle,
|
|
105
|
-
animatedStyle
|
|
106
|
-
]}>
|
|
107
|
-
{children}
|
|
108
|
-
</Animated.View>
|
|
108
|
+
return (<View style={style} onTouchEnd={onTouchEnd} onTouchMove={onTouchEnd}>
|
|
109
|
+
<Animated.View style={[contentContainerStyle, animatedStyle]}>{children}</Animated.View>
|
|
109
110
|
</View>);
|
|
110
111
|
};
|
|
111
112
|
KeyboardAvoidingView.displayName = 'MpxKeyboardAvoidingView';
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* ✘ for
|
|
3
|
+
*/
|
|
4
|
+
import { ReactNode } from 'react';
|
|
5
|
+
import { View, ViewStyle, NativeSyntheticEvent } from 'react-native';
|
|
6
|
+
import { HandlerRef } from './useNodesRef';
|
|
7
|
+
export interface LabelProps {
|
|
8
|
+
for?: string;
|
|
9
|
+
style?: ViewStyle & Record<string, any>;
|
|
10
|
+
'enable-offset'?: boolean;
|
|
11
|
+
'enable-var'?: boolean;
|
|
12
|
+
'external-var-context'?: Record<string, any>;
|
|
13
|
+
'parent-font-size'?: number;
|
|
14
|
+
'parent-width'?: number;
|
|
15
|
+
'parent-height'?: number;
|
|
16
|
+
children: ReactNode;
|
|
17
|
+
bindtap?: (evt: NativeSyntheticEvent<TouchEvent> | unknown) => void;
|
|
18
|
+
}
|
|
19
|
+
declare const Label: import("react").ForwardRefExoticComponent<LabelProps & import("react").RefAttributes<HandlerRef<View, LabelProps>>>;
|
|
20
|
+
export default Label;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* ✘ scale-area
|
|
3
|
+
*/
|
|
4
|
+
import { View } from 'react-native';
|
|
5
|
+
import { ReactNode } from 'react';
|
|
6
|
+
import { HandlerRef } from './useNodesRef';
|
|
7
|
+
interface MovableAreaProps {
|
|
8
|
+
style?: Record<string, any>;
|
|
9
|
+
children: ReactNode;
|
|
10
|
+
width?: number;
|
|
11
|
+
height?: number;
|
|
12
|
+
'enable-offset'?: boolean;
|
|
13
|
+
'enable-var'?: boolean;
|
|
14
|
+
'external-var-context'?: Record<string, any>;
|
|
15
|
+
'parent-font-size'?: number;
|
|
16
|
+
'parent-width'?: number;
|
|
17
|
+
'parent-height'?: number;
|
|
18
|
+
}
|
|
19
|
+
declare const _MovableArea: import("react").ForwardRefExoticComponent<MovableAreaProps & import("react").RefAttributes<HandlerRef<View, MovableAreaProps>>>;
|
|
20
|
+
export default _MovableArea;
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* ✔ direction
|
|
3
|
+
* ✔ inertia
|
|
4
|
+
* ✔ out-of-bounds
|
|
5
|
+
* ✔ x
|
|
6
|
+
* ✔ y
|
|
7
|
+
* ✘ damping
|
|
8
|
+
* ✘ friction
|
|
9
|
+
* ✔ disabled
|
|
10
|
+
* ✘ scale
|
|
11
|
+
* ✘ scale-min
|
|
12
|
+
* ✘ scale-max
|
|
13
|
+
* ✘ scale-value
|
|
14
|
+
* ✔ animation
|
|
15
|
+
* ✔ bindchange
|
|
16
|
+
* ✘ bindscale
|
|
17
|
+
* ✔ htouchmove
|
|
18
|
+
* ✔ vtouchmove
|
|
19
|
+
*/
|
|
20
|
+
import { ReactNode } from 'react';
|
|
21
|
+
import { View, LayoutChangeEvent } from 'react-native';
|
|
22
|
+
import { HandlerRef } from './useNodesRef';
|
|
23
|
+
import { GestureHandler } from './utils';
|
|
24
|
+
import { GestureTouchEvent } from 'react-native-gesture-handler';
|
|
25
|
+
interface MovableViewProps {
|
|
26
|
+
children: ReactNode;
|
|
27
|
+
style?: Record<string, any>;
|
|
28
|
+
direction: 'all' | 'vertical' | 'horizontal' | 'none';
|
|
29
|
+
x?: number;
|
|
30
|
+
y?: number;
|
|
31
|
+
disabled?: boolean;
|
|
32
|
+
animation?: boolean;
|
|
33
|
+
id?: string;
|
|
34
|
+
changeThrottleTime?: number;
|
|
35
|
+
bindchange?: (event: unknown) => void;
|
|
36
|
+
bindtouchstart?: (event: GestureTouchEvent) => void;
|
|
37
|
+
catchtouchstart?: (event: GestureTouchEvent) => void;
|
|
38
|
+
bindtouchmove?: (event: GestureTouchEvent) => void;
|
|
39
|
+
catchtouchmove?: (event: GestureTouchEvent) => void;
|
|
40
|
+
catchtouchend?: (event: GestureTouchEvent) => void;
|
|
41
|
+
bindtouchend?: (event: GestureTouchEvent) => void;
|
|
42
|
+
bindhtouchmove?: (event: GestureTouchEvent) => void;
|
|
43
|
+
bindvtouchmove?: (event: GestureTouchEvent) => void;
|
|
44
|
+
catchhtouchmove?: (event: GestureTouchEvent) => void;
|
|
45
|
+
catchvtouchmove?: (event: GestureTouchEvent) => void;
|
|
46
|
+
bindlongpress?: (event: GestureTouchEvent) => void;
|
|
47
|
+
catchlongpress?: (event: GestureTouchEvent) => void;
|
|
48
|
+
bindtap?: (event: GestureTouchEvent) => void;
|
|
49
|
+
catchtap?: (event: GestureTouchEvent) => void;
|
|
50
|
+
onLayout?: (event: LayoutChangeEvent) => void;
|
|
51
|
+
'out-of-bounds'?: boolean;
|
|
52
|
+
'wait-for'?: Array<GestureHandler>;
|
|
53
|
+
'simultaneous-handlers'?: Array<GestureHandler>;
|
|
54
|
+
inertia?: boolean;
|
|
55
|
+
'enable-var'?: boolean;
|
|
56
|
+
'external-var-context'?: Record<string, any>;
|
|
57
|
+
'parent-font-size'?: number;
|
|
58
|
+
'parent-width'?: number;
|
|
59
|
+
'parent-height'?: number;
|
|
60
|
+
'disable-event-passthrough'?: boolean;
|
|
61
|
+
}
|
|
62
|
+
declare const _MovableView: import("react").ForwardRefExoticComponent<MovableViewProps & import("react").RefAttributes<HandlerRef<View, MovableViewProps>>>;
|
|
63
|
+
export default _MovableView;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
interface MpxNavContainerProps {
|
|
3
|
+
children?: React.ReactNode;
|
|
4
|
+
}
|
|
5
|
+
export default function MpxNavContainer(props: MpxNavContainerProps): import("react").ReactNode;
|
|
6
|
+
export declare function NavSharedProvider({ children }: {
|
|
7
|
+
children?: React.ReactNode;
|
|
8
|
+
}): import("react").JSX.Element;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import { useNavShared } from './useNavShared';
|
|
2
|
+
import { NavSharedContext } from './context';
|
|
3
|
+
import { useLayoutEffect, useMemo, useState } from 'react';
|
|
4
|
+
import { isAndroid } from './utils';
|
|
5
|
+
export default function MpxNavContainer(props) {
|
|
6
|
+
const [, setCustomNav] = useNavShared();
|
|
7
|
+
useLayoutEffect(() => {
|
|
8
|
+
if (!isAndroid)
|
|
9
|
+
return;
|
|
10
|
+
if (props.children) {
|
|
11
|
+
setCustomNav(props.children);
|
|
12
|
+
}
|
|
13
|
+
return () => {
|
|
14
|
+
setCustomNav(undefined);
|
|
15
|
+
};
|
|
16
|
+
}, [props.children]);
|
|
17
|
+
return isAndroid ? null : props.children;
|
|
18
|
+
}
|
|
19
|
+
export function NavSharedProvider({ children }) {
|
|
20
|
+
const [customNav, setCustomNav] = useState();
|
|
21
|
+
const value = useMemo(() => ({ customNav, setCustomNav }), [customNav]);
|
|
22
|
+
return <NavSharedContext.Provider value={value}>{children}</NavSharedContext.Provider>;
|
|
23
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { _ViewProps } from './mpx-view';
|
|
3
|
+
interface _NavigatorProps extends _ViewProps {
|
|
4
|
+
['open-type']: 'navigate' | 'redirect' | 'switchTab' | 'reLaunch' | 'navigateBack';
|
|
5
|
+
url: string;
|
|
6
|
+
delta: number;
|
|
7
|
+
}
|
|
8
|
+
declare const _Navigator: import("react").ForwardRefExoticComponent<_NavigatorProps & import("react").RefAttributes<any>>;
|
|
9
|
+
export default _Navigator;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import { DateProps } from './type';
|
|
4
|
+
import { HandlerRef } from '../useNodesRef';
|
|
5
|
+
declare const PickerDate: React.ForwardRefExoticComponent<Omit<DateProps, "ref"> & React.RefAttributes<HandlerRef<View, DateProps>>>;
|
|
6
|
+
export default PickerDate;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export declare const wrapDate: (union?: string) => (num: number) => string;
|
|
2
|
+
export declare const START_YEAR = 1900;
|
|
3
|
+
export declare const END_YEAR = 2099;
|
|
4
|
+
export declare const years: string[];
|
|
5
|
+
export declare const months: string[];
|
|
6
|
+
export declare const daysInMonthLength: (year: number, month: number) => 30 | 28 | 29 | 31;
|
|
7
|
+
export declare const daysInMonth: (year: number, month: number) => string[];
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import { HandlerRef } from '../useNodesRef';
|
|
4
|
+
import { PickerProps } from './type';
|
|
5
|
+
declare const Picker: React.ForwardRefExoticComponent<(Omit<import("./type").DateProps, "ref"> | Omit<import("./type").SelectorProps, "ref"> | Omit<import("./type").MultiSelectorProps, "ref"> | Omit<import("./type").TimeProps, "ref"> | Omit<import("./type").RegionProps, "ref">) & React.RefAttributes<HandlerRef<View, PickerProps>>>;
|
|
6
|
+
export default Picker;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import { MultiSelectorProps } from './type';
|
|
4
|
+
import { HandlerRef } from '../useNodesRef';
|
|
5
|
+
declare const PickerMultiSelector: React.ForwardRefExoticComponent<Omit<MultiSelectorProps, "ref"> & React.RefAttributes<HandlerRef<View, MultiSelectorProps>>>;
|
|
6
|
+
export default PickerMultiSelector;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import { RegionProps } from './type';
|
|
4
|
+
import { HandlerRef } from '../useNodesRef';
|
|
5
|
+
declare const PickerRegion: React.ForwardRefExoticComponent<Omit<RegionProps, "ref"> & React.RefAttributes<HandlerRef<View, RegionProps>>>;
|
|
6
|
+
export default PickerRegion;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import { SelectorProps } from './type';
|
|
4
|
+
import { HandlerRef } from '../useNodesRef';
|
|
5
|
+
declare const PickerSelector: React.ForwardRefExoticComponent<Omit<SelectorProps, "ref"> & React.RefAttributes<HandlerRef<View, SelectorProps>>>;
|
|
6
|
+
export default PickerSelector;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { View } from 'react-native';
|
|
3
|
+
import { TimeProps } from './type';
|
|
4
|
+
import { HandlerRef } from '../useNodesRef';
|
|
5
|
+
declare const PickerTime: React.ForwardRefExoticComponent<Omit<TimeProps, "ref"> & React.RefAttributes<HandlerRef<View, TimeProps>>>;
|
|
6
|
+
export default PickerTime;
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export declare const enum PickerMode {
|
|
3
|
+
SELECTOR = "selector",
|
|
4
|
+
MULTI_SELECTOR = "multiSelector",
|
|
5
|
+
TIME = "time",
|
|
6
|
+
DATE = "date",
|
|
7
|
+
REGION = "region"
|
|
8
|
+
}
|
|
9
|
+
export type PickerValue = number;
|
|
10
|
+
export type Obj = Record<string, any>;
|
|
11
|
+
export type RangeItem = Obj | number | string;
|
|
12
|
+
export type TimeValue = `${number}-${number}-${number}` | '';
|
|
13
|
+
/** 通用属性 */
|
|
14
|
+
export interface BasePickerProps {
|
|
15
|
+
/** --- 小程序属性 --- */
|
|
16
|
+
/** 选择器类型, 默认值 selector */
|
|
17
|
+
mode?: PickerMode;
|
|
18
|
+
/** 是否禁用, 默认值 false */
|
|
19
|
+
disabled?: boolean;
|
|
20
|
+
/** 点击取消按钮时触发 */
|
|
21
|
+
bindcancel?: Function;
|
|
22
|
+
/** 头部标题 */
|
|
23
|
+
'header-text'?: string;
|
|
24
|
+
/** --- 内部组件属性 --- */
|
|
25
|
+
/** 作为表单组件时的名称 */
|
|
26
|
+
name?: string;
|
|
27
|
+
style?: Record<string, any>;
|
|
28
|
+
children?: React.ReactNode;
|
|
29
|
+
range?: RangeItem[];
|
|
30
|
+
ref?: any;
|
|
31
|
+
}
|
|
32
|
+
export interface SelectorProps extends BasePickerProps {
|
|
33
|
+
mode: PickerMode.SELECTOR;
|
|
34
|
+
/** 默认值 0 */
|
|
35
|
+
value?: number;
|
|
36
|
+
/** 默认值 [] */
|
|
37
|
+
range?: RangeItem[];
|
|
38
|
+
'range-key'?: string;
|
|
39
|
+
/** 点击确认按钮后触发 change 事件, event.detail = {value} */
|
|
40
|
+
bindchange?: Function;
|
|
41
|
+
}
|
|
42
|
+
export interface MultiSelectorProps extends BasePickerProps {
|
|
43
|
+
mode: PickerMode.MULTI_SELECTOR;
|
|
44
|
+
/** 默认值 [] */
|
|
45
|
+
value?: number[];
|
|
46
|
+
range?: RangeItem[];
|
|
47
|
+
'range-key'?: string;
|
|
48
|
+
bindchange?: Function;
|
|
49
|
+
bindcolumnchange?: Function;
|
|
50
|
+
}
|
|
51
|
+
export interface TimeProps extends BasePickerProps {
|
|
52
|
+
mode: PickerMode.TIME;
|
|
53
|
+
/** 表示选中的时间,格式为"hh:mm" */
|
|
54
|
+
value?: string;
|
|
55
|
+
start?: string;
|
|
56
|
+
end?: string;
|
|
57
|
+
bindchange?: Function;
|
|
58
|
+
}
|
|
59
|
+
export interface DateProps extends BasePickerProps {
|
|
60
|
+
mode: PickerMode.DATE;
|
|
61
|
+
/** 默认值 '' */
|
|
62
|
+
value?: TimeValue;
|
|
63
|
+
start?: TimeValue;
|
|
64
|
+
end?: TimeValue;
|
|
65
|
+
/** 有效值 year,month,day,表示选择器的粒度 */
|
|
66
|
+
fields?: 'day' | 'month' | 'year';
|
|
67
|
+
bindchange?: Function;
|
|
68
|
+
}
|
|
69
|
+
export interface RegionProps extends BasePickerProps {
|
|
70
|
+
mode: PickerMode.REGION;
|
|
71
|
+
/** 表示选中的省市区,默认选中每一列的第一个值, 默认值 [] */
|
|
72
|
+
value?: string[];
|
|
73
|
+
/** 默认值 region */
|
|
74
|
+
level?: 'province' | 'city' | 'region' | 'sub-district';
|
|
75
|
+
/** 可为每一列的顶部添加一个自定义的项 */
|
|
76
|
+
'custom-item'?: string;
|
|
77
|
+
/** value 改变时触发 change 事件, event.detail = {value, code, postcode},
|
|
78
|
+
* 其中字段 code 是统计用区划代码, postcode 是邮政编码 */
|
|
79
|
+
bindchange?: Function;
|
|
80
|
+
}
|
|
81
|
+
export interface RegionObj {
|
|
82
|
+
value: string;
|
|
83
|
+
code: string;
|
|
84
|
+
postcode?: string;
|
|
85
|
+
children?: RegionObj[];
|
|
86
|
+
}
|
|
87
|
+
export interface PickerData {
|
|
88
|
+
value: string;
|
|
89
|
+
label: string;
|
|
90
|
+
children?: Object[];
|
|
91
|
+
}
|
|
92
|
+
export interface EventType {
|
|
93
|
+
detail: {
|
|
94
|
+
value: PickerValue[];
|
|
95
|
+
};
|
|
96
|
+
}
|
|
97
|
+
export interface LayoutType {
|
|
98
|
+
nativeEvent: {
|
|
99
|
+
layout: Obj;
|
|
100
|
+
};
|
|
101
|
+
}
|
|
102
|
+
export interface FormType {
|
|
103
|
+
name: string;
|
|
104
|
+
}
|
|
105
|
+
export type PickerProps = SelectorProps | MultiSelectorProps | TimeProps | DateProps | RegionProps;
|
|
106
|
+
export type LanguageCode = 'zh-CN' | 'en-US';
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { View } from 'react-native';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { HandlerRef } from '../useNodesRef';
|
|
4
|
+
import type { AnyFunc } from '../types/common';
|
|
5
|
+
/**
|
|
6
|
+
* ✔ value
|
|
7
|
+
* ✔ bindchange
|
|
8
|
+
* ✘ bindpickstart
|
|
9
|
+
* ✘ bindpickend
|
|
10
|
+
* ✔ mask-class
|
|
11
|
+
* ✔ indicator-style: 优先级indicator-style.height > pick-view-column中的子元素设置的height
|
|
12
|
+
* WebView Only:
|
|
13
|
+
* ✔ indicator-class
|
|
14
|
+
* ✔ mask-style
|
|
15
|
+
* ✘ immediate-change
|
|
16
|
+
*/
|
|
17
|
+
interface PickerViewProps {
|
|
18
|
+
children: React.ReactNode;
|
|
19
|
+
value?: Array<number>;
|
|
20
|
+
bindchange?: AnyFunc;
|
|
21
|
+
style?: {
|
|
22
|
+
[key: string]: any;
|
|
23
|
+
};
|
|
24
|
+
'indicator-style'?: Record<string, any>;
|
|
25
|
+
'mask-style'?: Record<string, any>;
|
|
26
|
+
'enable-var'?: boolean;
|
|
27
|
+
'external-var-context'?: Record<string, any>;
|
|
28
|
+
'enable-offset'?: boolean;
|
|
29
|
+
}
|
|
30
|
+
declare const _PickerView: React.ForwardRefExoticComponent<PickerViewProps & React.RefAttributes<HandlerRef<View, PickerViewProps>>>;
|
|
31
|
+
export default _PickerView;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { SharedValue } from 'react-native-reanimated';
|
|
3
|
+
type ContextValue = SharedValue<number>;
|
|
4
|
+
export declare const PickerViewColumnAnimationContext: import("react").Context<ContextValue | undefined>;
|
|
5
|
+
export declare const usePickerViewColumnAnimationContext: () => ContextValue;
|
|
6
|
+
export declare const PickerViewStyleContext: import("react").Context<Record<string, any> | undefined>;
|
|
7
|
+
export declare const usePickerViewStyleContext: () => Record<string, any> | undefined;
|
|
8
|
+
export {};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ScrollView, View } from 'react-native';
|
|
3
|
+
import { HandlerRef } from '../useNodesRef';
|
|
4
|
+
interface ColumnProps {
|
|
5
|
+
columnIndex: number;
|
|
6
|
+
columnData: React.ReactNode[];
|
|
7
|
+
initialIndex: number;
|
|
8
|
+
onSelectChange: Function;
|
|
9
|
+
style: {
|
|
10
|
+
[key: string]: any;
|
|
11
|
+
};
|
|
12
|
+
'enable-var'?: boolean;
|
|
13
|
+
'external-var-context'?: Record<string, any>;
|
|
14
|
+
wrapperStyle: {
|
|
15
|
+
height: number;
|
|
16
|
+
itemHeight: number;
|
|
17
|
+
};
|
|
18
|
+
pickerMaskStyle: Record<string, any>;
|
|
19
|
+
pickerIndicatorStyle: Record<string, any>;
|
|
20
|
+
}
|
|
21
|
+
declare const _PickerViewColumn: React.ForwardRefExoticComponent<ColumnProps & React.RefAttributes<HandlerRef<ScrollView & View, ColumnProps>>>;
|
|
22
|
+
export default _PickerViewColumn;
|