@office-iss/react-native-win32 0.0.0-canary.287 → 0.0.0-canary.289
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/.flowconfig +6 -2
- package/CHANGELOG.json +63 -1
- package/CHANGELOG.md +24 -4
- package/Libraries/Alert/Alert.d.ts +4 -1
- package/Libraries/Alert/Alert.js +3 -0
- package/Libraries/{Modal/ModalInjection.js → Alert/RCTAlertManager.js.flow} +7 -4
- package/Libraries/Animated/Animated.js +8 -37
- package/Libraries/Animated/Animated.js.flow +15 -0
- package/Libraries/Animated/AnimatedExports.js +47 -0
- package/Libraries/Animated/AnimatedExports.js.flow +48 -0
- package/Libraries/Animated/Easing.js +13 -15
- package/Libraries/Animated/createAnimatedComponent.js +24 -12
- package/Libraries/Animated/nodes/AnimatedNode.js +2 -1
- package/Libraries/Animated/nodes/AnimatedProps.js +18 -1
- package/Libraries/Animated/nodes/AnimatedValue.js +6 -2
- package/Libraries/Animated/useAnimatedValue.js +1 -3
- package/Libraries/Blob/URL.js +23 -10
- package/Libraries/Blob/URLSearchParams.js.flow +23 -0
- package/Libraries/Components/AccessibilityInfo/AccessibilityInfo.js +1 -1
- package/Libraries/Components/AccessibilityInfo/AccessibilityInfo.win32.js +1 -1
- package/Libraries/Components/AccessibilityInfo/legacySendAccessibilityEvent.js.flow +20 -0
- package/Libraries/Components/ActivityIndicator/ActivityIndicator.js +8 -8
- package/Libraries/Components/Button.js +2 -2
- package/Libraries/Components/Button.win32.js +2 -2
- package/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.android.js +14 -100
- package/Libraries/Components/DrawerAndroid/DrawerLayoutAndroid.js +64 -4
- package/Libraries/Components/DrawerAndroid/DrawerLayoutAndroidTypes.js +138 -0
- package/Libraries/Components/Keyboard/KeyboardAvoidingView.js +7 -4
- package/Libraries/Components/LayoutConformance/LayoutConformance.js +6 -4
- package/Libraries/Components/LayoutConformance/LayoutConformanceNativeComponent.js +1 -1
- package/Libraries/Components/Pressable/Pressable.js +18 -63
- package/Libraries/Components/Pressable/Pressable.win32.js +19 -65
- package/Libraries/Components/Pressable/useAndroidRippleForView.js +2 -2
- package/Libraries/Components/ProgressBarAndroid/ProgressBarAndroid.android.js +4 -46
- package/Libraries/Components/ProgressBarAndroid/ProgressBarAndroid.js +10 -4
- package/Libraries/Components/ProgressBarAndroid/ProgressBarAndroidTypes.js +54 -0
- package/Libraries/Components/RefreshControl/RefreshControl.js +10 -7
- package/Libraries/Components/RefreshControl/__mocks__/RefreshControlMock.js +2 -1
- package/Libraries/Components/SafeAreaView/SafeAreaView.js +1 -1
- package/Libraries/Components/SafeAreaView/SafeAreaView.win32.js +1 -1
- package/Libraries/Components/ScrollView/AndroidHorizontalScrollViewNativeComponent.js +2 -4
- package/Libraries/Components/ScrollView/ScrollContentViewNativeComponent.js +2 -4
- package/Libraries/Components/ScrollView/ScrollView.js +43 -59
- package/Libraries/Components/ScrollView/ScrollViewCommands.js +1 -1
- package/Libraries/Components/ScrollView/ScrollViewNativeComponent.js +2 -4
- package/Libraries/Components/ScrollView/ScrollViewStickyHeader.js +6 -7
- package/Libraries/Components/StatusBar/StatusBar.js +33 -22
- package/Libraries/Components/Switch/Switch.js +70 -41
- package/Libraries/Components/TextInput/AndroidTextInputNativeComponent.js +2 -4
- package/Libraries/Components/TextInput/RCTMultilineTextInputNativeComponent.js +2 -4
- package/Libraries/Components/TextInput/RCTSingelineTextInputNativeComponent.js +2 -4
- package/Libraries/Components/TextInput/RCTTextInputViewConfig.js +1 -0
- package/Libraries/Components/TextInput/Tests/TextInputTest.d.ts +2 -1
- package/Libraries/Components/TextInput/Tests/TextInputTest.js.map +1 -1
- package/Libraries/Components/TextInput/TextInput.d.ts +6 -0
- package/Libraries/Components/TextInput/TextInput.flow.js +45 -14
- package/Libraries/Components/TextInput/TextInput.js +121 -136
- package/Libraries/Components/TextInput/TextInput.win32.js +122 -137
- package/Libraries/Components/TextInput/TextInputState.js +2 -18
- package/Libraries/Components/TextInput/TextInputState.win32.js +2 -18
- package/Libraries/Components/TextInput/Win32TextInputNativeComponent.js +1 -1
- package/Libraries/Components/Touchable/Tests/TouchableWin32Test.d.ts +2 -1
- package/Libraries/Components/Touchable/Tests/TouchableWin32Test.js.map +1 -1
- package/Libraries/Components/Touchable/Touchable.js +7 -7
- package/Libraries/Components/Touchable/Touchable.win32.js +7 -7
- package/Libraries/Components/Touchable/TouchableBounce.js +1 -1
- package/Libraries/Components/Touchable/TouchableHighlight.js +35 -14
- package/Libraries/Components/Touchable/TouchableNativeFeedback.js +95 -47
- package/Libraries/Components/Touchable/TouchableNativeFeedback.win32.js +248 -43
- package/Libraries/Components/Touchable/TouchableOpacity.js +52 -10
- package/Libraries/Components/Touchable/TouchableWithoutFeedback.js +112 -59
- package/Libraries/Components/View/View.js +1 -1
- package/Libraries/Components/View/View.win32.js +1 -1
- package/Libraries/Components/View/ViewNativeComponent.js +2 -4
- package/Libraries/Components/View/ViewPropTypes.js +15 -12
- package/Libraries/Components/View/ViewPropTypes.win32.js +74 -71
- package/Libraries/Core/ReactNativeVersion.js +2 -2
- package/Libraries/Core/setUpReactDevTools.js +2 -0
- package/Libraries/Debugging/DebuggingOverlayRegistry.js +10 -7
- package/Libraries/Image/Image.android.js +1 -1
- package/Libraries/Image/Image.js.flow +27 -0
- package/Libraries/Image/ImageBackground.js +1 -1
- package/Libraries/Image/ImageProps.js +97 -30
- package/Libraries/Image/ImageTypes.flow.js +16 -6
- package/Libraries/Image/ImageViewNativeComponent.js +3 -5
- package/Libraries/Image/Tests/ImageWin32Test.d.ts +2 -1
- package/Libraries/Image/Tests/ImageWin32Test.js.map +1 -1
- package/Libraries/Image/TextInlineImageNativeComponent.js +2 -4
- package/Libraries/Interaction/InteractionManager.js +9 -1
- package/Libraries/Interaction/PanResponder.js +11 -11
- package/Libraries/Interaction/TaskQueue.js +3 -2
- package/Libraries/Lists/FlatList.js +8 -7
- package/Libraries/LogBox/LogBox.js +1 -1
- package/Libraries/Modal/Modal.js +30 -4
- package/Libraries/NativeComponent/BaseViewConfig.js.flow +14 -0
- package/Libraries/NativeComponent/NativeComponentRegistry.js +1 -1
- package/Libraries/Network/RCTNetworking.js.flow +44 -0
- package/Libraries/Network/XMLHttpRequest_new.js +3 -0
- package/Libraries/Network/XMLHttpRequest_old.js +3 -0
- package/Libraries/Pressability/HoverState.js +1 -0
- package/Libraries/Pressability/HoverState.win32.js +1 -0
- package/Libraries/Pressability/Pressability.js +2 -2
- package/Libraries/Pressability/Pressability.win32.js +3 -3
- package/Libraries/ReactNative/AppRegistry.flow.js +49 -0
- package/Libraries/ReactNative/AppRegistry.js +2 -322
- package/Libraries/ReactNative/AppRegistry.js.flow +23 -0
- package/Libraries/ReactNative/AppRegistryImpl.js +316 -0
- package/Libraries/ReactNative/FabricUIManager.js +5 -3
- package/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricHostComponent.js +7 -5
- package/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricPublicInstance.js +1 -4
- package/Libraries/ReactNative/RendererImplementation.js +3 -5
- package/Libraries/ReactNative/requireNativeComponent.js +1 -1
- package/Libraries/ReactPrivate/ReactNativePrivateInterface.js +12 -0
- package/Libraries/Renderer/shims/ReactNativeTypes.js +39 -91
- package/Libraries/StyleSheet/PlatformColorValueTypes.js.flow +22 -0
- package/Libraries/StyleSheet/PlatformColorValueTypesIOS.js +6 -0
- package/Libraries/StyleSheet/StyleSheet.js +5 -197
- package/Libraries/StyleSheet/StyleSheet.js.flow +166 -0
- package/Libraries/StyleSheet/{StyleSheet.win32.js → StyleSheetExports.js} +2 -151
- package/Libraries/StyleSheet/StyleSheetExports.js.flow +110 -0
- package/Libraries/StyleSheet/StyleSheetTypes.js +42 -18
- package/Libraries/Text/Text.d.ts +1 -1
- package/Libraries/Text/Text.js +3 -1
- package/Libraries/Text/Text.win32.js +3 -1
- package/Libraries/Text/TextNativeComponent.js +1 -1
- package/Libraries/Text/TextNativeComponent.win32.js +1 -1
- package/Libraries/Text/TextProps.js +124 -84
- package/Libraries/Text/TextProps.win32.js +124 -84
- package/Libraries/Types/CodegenTypesNamespace.d.ts +45 -0
- package/Libraries/Types/CodegenTypesNamespace.js +14 -0
- package/Libraries/Types/CoreEventTypes.js +1 -1
- package/Libraries/Types/CoreEventTypes.win32.js +1 -1
- package/Libraries/Types/ReactDevToolsTypes.js +4 -8
- package/Libraries/Utilities/BackHandler.js.flow +25 -0
- package/Libraries/Utilities/DevSettings.js +14 -0
- package/Libraries/Utilities/Dimensions.js +5 -0
- package/Libraries/Utilities/Dimensions.win32.js +5 -0
- package/{flow/Position.js → Libraries/Utilities/Platform.js.flow} +3 -6
- package/Libraries/Utilities/PlatformTypes.js +97 -7
- package/Libraries/Utilities/codegenNativeCommands.d.ts +18 -0
- package/Libraries/Utilities/codegenNativeComponent.d.ts +26 -0
- package/Libraries/Utilities/codegenNativeComponent.js +1 -1
- package/Libraries/__flowtests__/ReactNativeTypes-flowtest.js +2 -4
- package/Libraries/vendor/emitter/EventEmitter.js +6 -2
- package/flow/global.js +1 -0
- package/flow/jest.js +4 -2
- package/index.js +47 -43
- package/index.win32.js +63 -59
- package/overrides.json +27 -35
- package/package.json +18 -18
- package/src/private/animated/NativeAnimatedHelper.js +18 -7
- package/src/private/animated/NativeAnimatedHelper.win32.js +18 -7
- package/src/private/animated/createAnimatedPropsHook.js +34 -15
- package/src/private/components/HScrollViewNativeComponents.js +1 -1
- package/src/private/components/VScrollViewNativeComponents.js +1 -1
- package/src/private/featureflags/ReactNativeFeatureFlags.js +24 -36
- package/src/private/featureflags/ReactNativeFeatureFlagsBase.js +9 -1
- package/src/private/featureflags/specs/NativeReactNativeFeatureFlags.js +4 -4
- package/src/private/inspector/getInspectorDataForViewAtPoint.js +2 -4
- package/src/private/setup/setUpDOM.js +36 -1
- package/src/private/specs_DEPRECATED/components/ActivityIndicatorViewNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/AndroidDrawerLayoutNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/AndroidHorizontalScrollContentViewNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/AndroidSwipeRefreshLayoutNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/AndroidSwitchNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/DebuggingOverlayNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/ProgressBarAndroidNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/PullToRefreshViewNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/RCTInputAccessoryViewNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/RCTModalHostViewNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/RCTSafeAreaViewNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/SwitchNativeComponent.js +1 -1
- package/src/private/specs_DEPRECATED/components/UnimplementedNativeViewNativeComponent.js +1 -1
- package/src/private/types/HostComponent.js +16 -0
- package/src/private/types/HostInstance.js +50 -0
- package/src/private/webapis/dom/nodes/ReactNativeDocument.js +1 -0
- package/src/private/webapis/dom/nodes/ReactNativeElement.js +40 -32
- package/src/private/webapis/dom/nodes/ReadOnlyCharacterData.js +1 -1
- package/src/private/webapis/dom/nodes/ReadOnlyElement.js +1 -1
- package/src/private/webapis/dom/nodes/ReadOnlyNode.js +6 -19
- package/src/private/webapis/dom/nodes/internals/NodeInternals.js +6 -0
- package/src/private/webapis/intersectionobserver/IntersectionObserver.js +4 -4
- package/src/private/webapis/mutationobserver/MutationObserver.js +9 -9
- package/src/private/webapis/performance/PerformanceObserver.js +6 -6
- package/src/types/globals.d.ts +628 -0
- package/src/types/third_party/event-target-shim.d.ts +392 -0
- package/src-win/Libraries/Components/TextInput/Tests/TextInputTest.tsx +7 -7
- package/src-win/Libraries/Components/Touchable/Tests/TouchableWin32Test.tsx +3 -3
- package/src-win/Libraries/Image/Tests/ImageWin32Test.tsx +1 -1
- package/src-win/Libraries/Text/Text.d.ts +1 -1
- package/types/index.d.ts +5 -52
- package/types/modules/globals.d.ts +0 -599
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TouchableWin32Test.js","sourceRoot":"","sources":["../../../../src-win/Libraries/Components/Touchable/Tests/TouchableWin32Test.tsx"],"names":[],"mappings":"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","sourcesContent":["'use strict';\n\nimport React from 'react'\nimport {NativeSyntheticEvent, StyleSheet, Text, ViewStyle } from 'react-native';\nimport {Insets} from 'react-native/types/public/Insets';\nimport { ViewWin32 } from '../../View/ViewWin32';\nimport { IViewWin32Props, IKeyboardEvent } from '../../View/ViewPropTypes';\nimport { TouchableWin32 } from '../TouchableWin32';\nimport { IPressEvent, IRenderChild } from '../TouchableWin32.Types';\nimport { ITouchableWin32State } from '../TouchableWin32.Props';\n\n/**\n * Styles used across both examples\n */\nconst styles = StyleSheet.create({\n largeContainer: {\n height: 200,\n width: 600,\n justifyContent: 'space-between',\n alignItems: 'center',\n flexDirection: 'row',\n },\n smallContainer: {\n height: 90,\n width: 90,\n justifyContent: 'center',\n alignContent: 'center',\n },\n highlight: {\n height: 150,\n width: 150,\n justifyContent: 'space-around',\n alignContent: 'center',\n alignItems: 'center',\n flexDirection: 'row',\n },\n outerTouch: {\n height: 150,\n width: 150,\n justifyContent: 'space-around',\n alignContent: 'center',\n alignItems: 'center',\n flexDirection: 'row',\n },\n innerTouch: {\n height: 90,\n width: 90,\n alignItems: 'center',\n justifyContent: 'center',\n },\n});\n\n/**\n * Constant press rect offset, used to demonstrate press geometry\n */\nconst PRESS_RETENTION_OFFSET: Insets = {\n top: 100,\n left: 100,\n right: 100,\n bottom: 100,\n};\n\ninterface ITouchableWin32WithoutFeedbackProps extends IViewWin32Props {\n delayLongPress?: number;\n delayPressIn?: number;\n delayPressOut?: number;\n onPress?: (e: IPressEvent) => void;\n onPressIn?: (e: IPressEvent) => void;\n onPressOut?: (e: IPressEvent) => void;\n onLongPress?: (e: IPressEvent) => void;\n pressRetentionOffset?: Insets;\n rejectResponderTermination?: boolean;\n}\n\ninterface ITouchableWin32WithoutFeedbackState {\n isFocused: boolean;\n}\n\n/**\n * Example implementation of TouchableWithoutFeedback - not meant for use outside these examples\n * This is mainly there to show the ability to respond to touches without providing visual feedback,\n * though we do show a red border on focus to know where starts start and end and whether press rect\n * offsets are respected.\n */\nclass TouchableWin32WithoutFeedback extends React.Component<ITouchableWin32WithoutFeedbackProps, ITouchableWin32WithoutFeedbackState> {\n constructor(props) {\n super(props);\n\n this.state = { isFocused: false };\n }\n\n public render() {\n return (\n <TouchableWin32\n focusable\n rejectResponderTermination={true}\n disabled={false}\n touchableHandleActivePressIn={this._touchableHandleActivePressIn}\n touchableHandleActivePressOut={this._touchableHandleActivePressOut}\n touchableHandlePress={this._touchableHandlePress}\n touchableHandleLongPress={this._touchableHandleLongPress}\n touchableGetHighlightDelayMS={this._touchableGetHighlightDelayMS}\n touchableGetPressRectOffset={this._touchableGetPressRectOffset}\n touchableGetLongPressDelayMS={this._touchableGetLongPressDelayMS}\n touchableGetPressOutDelayMS={this._touchableGetPressOutDelayMS}\n touchableGetHitSlop={this._touchableGetHitSlop}\n onFocus={this._onFocus}\n onBlur={this._onBlur}\n renderStyle={this._generateStyle}\n >\n {React.Children.only(this.props.children)}\n </TouchableWin32>\n );\n }\n\n private readonly _touchableHandlePress = (e: IPressEvent) => {\n this.props.onPress && this.props.onPress(e);\n };\n\n private readonly _touchableHandleActivePressIn = (e: IPressEvent) => {\n this.props.onPressIn && this.props.onPressIn(e);\n };\n\n private readonly _touchableHandleActivePressOut = (e: IPressEvent) => {\n this.props.onPressOut && this.props.onPressOut(e);\n };\n\n private readonly _touchableHandleLongPress = (e: IPressEvent) => {\n this.props.onLongPress && this.props.onLongPress(e);\n };\n\n private readonly _touchableGetPressRectOffset = (): Insets => {\n return this.props.pressRetentionOffset || PRESS_RETENTION_OFFSET;\n };\n\n private readonly _touchableGetHitSlop = (): Insets => {\n return this.props.hitSlop as Insets;\n };\n\n private readonly _touchableGetHighlightDelayMS = (): number => {\n return this.props.delayPressIn || 0;\n };\n\n private readonly _touchableGetLongPressDelayMS = (): number => {\n return this.props.delayLongPress === 0 ? 0 : this.props.delayLongPress || 500;\n };\n\n private readonly _touchableGetPressOutDelayMS = (): number => {\n return this.props.delayPressOut || 0;\n };\n\n private readonly _onFocus = () => {\n this.setState({ isFocused: true });\n };\n\n private readonly _onBlur = () => {\n this.setState({ isFocused: false });\n };\n\n /**\n * The generated style uses hard-coded border width values\n */\n private readonly _generateStyle = (state: ITouchableWin32State): ViewStyle => {\n const finalStyle: ViewStyle = {\n borderWidth: state.isFocused ? 5 : 0,\n borderColor: 'red',\n };\n return Object.assign({}, this.props.style, finalStyle);\n };\n}\n\ninterface ITouchableWin32HighlightProps extends Omit <IViewWin32Props, 'children'> {\n delayLongPress?: number;\n delayLongPressIn?: number;\n delayPressOut?: number;\n onPress?: (e: IPressEvent) => void;\n onPressIn?: (e: IPressEvent) => void;\n onPressOut?: (e: IPressEvent) => void;\n onLongPress?: (e: IPressEvent) => void;\n onKeyPress?: (e: IKeyboardEvent) => void;\n onKeyPressDown?: (e: IKeyboardEvent) => void;\n pressRetentionOffset?: Insets;\n rejectResponderTermination?: boolean;\n underlayColor?: string;\n children?: IRenderChild<ITouchableWin32State>;\n}\n\ninterface ITouchableWin32HighlightComponentProps extends ITouchableWin32HighlightProps {\n // Used as an imperative handle to the TouchableWin32 interface - primarily for focus()\n innerRef?: React.Ref<TouchableWin32>;\n}\n\n/**\n * Example implementation of TouchableHighlight - not meant for use outside these examples\n * The main difference between a full TouchableHighlight implementation and this example is that\n * TouchableHighlight should manipulate the opacity of the wrapped view to display the underlay color.\n * This example merely uses hard coded color values to distinguish between different control states\n */\nclass TouchableWin32HighlightComponent extends React.Component<ITouchableWin32HighlightComponentProps, {}> {\n\n public render() {\n return (\n <TouchableWin32\n focusable\n rejectResponderTermination={this.props.rejectResponderTermination}\n disabled={false}\n touchableHandleActivePressIn={this._touchableHandleActivePressIn}\n touchableHandleActivePressOut={this._touchableHandleActivePressOut}\n touchableHandlePress={this._touchableHandlePress}\n touchableHandleLongPress={this._touchableHandleLongPress}\n touchableGetHighlightDelayMS={this._touchableGetHighlightDelayMS}\n touchableGetPressRectOffset={this._touchableGetPressRectOffset}\n touchableGetLongPressDelayMS={this._touchableGetLongPressDelayMS}\n touchableGetPressOutDelayMS={this._touchableGetPressOutDelayMS}\n touchableGetHitSlop={this._touchableGetHitSlop}\n touchableHandleKeyPress={this._touchableHandleKeyPress}\n touchableHandleKeyPressDown={this._touchableHandleKeyPressDown}\n onFocus={this._onFocus}\n onBlur={this._onBlur}\n onMouseEnter={this._mouseEnter}\n onMouseLeave={this._mouseLeave}\n renderStyle={this._generateStyle}\n children={this.props.children}\n ref={this.props.innerRef}\n />\n );\n }\n\n private readonly _touchableHandlePress = (e: IPressEvent) => {\n this.props.onPress && this.props.onPress(e);\n this.setState({ isPressed: false });\n };\n private readonly _touchableHandleActivePressIn = (e: IPressEvent) => {\n this.props.onPressIn && this.props.onPressIn(e);\n this.setState({ isPressed: true });\n };\n private readonly _touchableHandleActivePressOut = (e: IPressEvent) => {\n this.props.onPressOut && this.props.onPressOut(e);\n this.setState({ isPressed: false });\n };\n private readonly _touchableHandleLongPress = (e: IPressEvent) => {\n this.props.onLongPress && this.props.onLongPress(e);\n };\n private readonly _touchableGetPressRectOffset = (): Insets => {\n return this.props.pressRetentionOffset || PRESS_RETENTION_OFFSET;\n };\n private readonly _touchableGetHitSlop = (): Insets => {\n return { left: 100, right: 100, top: 100, bottom: 100 };\n };\n private readonly _touchableGetHighlightDelayMS = (): number => {\n return this.props.delayLongPressIn || 0;\n };\n private readonly _touchableGetLongPressDelayMS = (): number => {\n return this.props.delayLongPress || 500;\n };\n private readonly _touchableGetPressOutDelayMS = (): number => {\n return this.props.delayPressOut || 0;\n };\n private readonly _touchableHandleKeyPress = (ev: IKeyboardEvent) => {\n this.props.onKeyPress && this.props.onKeyPress(ev);\n }\n private readonly _touchableHandleKeyPressDown = (ev: IKeyboardEvent) => {\n this.props.onKeyPressDown && this.props.onKeyPressDown(ev);\n }\n private readonly _mouseEnter = (mouseEvent): void => {\n this.props.onMouseEnter && this.props.onMouseEnter(mouseEvent);\n this.setState({ isMouseIn: true });\n };\n private readonly _mouseLeave = (mouseEvent): void => {\n this.props.onMouseLeave && this.props.onMouseLeave(mouseEvent);\n this.setState({ isMouseIn: false });\n };\n private readonly _onFocus = (ev: NativeSyntheticEvent<{}>): void => {\n this.props.onFocus && this.props.onFocus(ev);\n this.setState({ isFocused: true });\n };\n private readonly _onBlur = (ev: NativeSyntheticEvent<{}>): void => {\n this.props.onBlur && this.props.onBlur(ev);\n this.setState({ isFocused: false });\n };\n\n /**\n * The generated style uses hard-coded color values,\n * though it is trivial to pass these values as props.\n * This is an example of a render style (one that is a\n * function passed on to TouchableWin32 and resolved according\n * to the internal state of TouchableWin32).\n */\n private readonly _generateStyle = (state: ITouchableWin32State): ViewStyle => {\n const finalStyle: ViewStyle = {};\n finalStyle.borderColor = state.isFocused ? 'red' : 'blue';\n finalStyle.borderWidth = state.isFocused ? 10 : 5;\n if (state.isHovered) {\n if (state.isPressed) {\n finalStyle.backgroundColor = 'black';\n } else {\n finalStyle.backgroundColor = 'gray';\n }\n } else {\n if (state.isPressed) {\n finalStyle.backgroundColor = 'green';\n } else {\n finalStyle.backgroundColor = 'white';\n }\n }\n return Object.assign({}, this.props.style, finalStyle);\n };\n}\n\n// Demonstrating ref forwarding - forwarding a ref using an innerRef prop on a class component\nconst TouchableWin32Highlight = React.forwardRef<TouchableWin32, ITouchableWin32HighlightProps>(\n (props, ref) => {\n return (\n <TouchableWin32HighlightComponent innerRef={ref} {...props} />\n );\n }\n);\n\n/**\n * Both examples merely track number of presses\n */\ninterface IExampleState {\n numberOfPresses: number;\n}\n\n/**\n * TouchableHighlightExamples\n */\nclass TouchableWithoutFeedbackExample extends React.Component<{}, IExampleState> {\n constructor(props) {\n super(props);\n this.state = { numberOfPresses: 0 };\n }\n\n public render() {\n return (\n <ViewWin32 style={styles.largeContainer}>\n <TouchableWin32WithoutFeedback style={styles.outerTouch} onPress={this._onPress}>\n <ViewWin32>\n <Text>Press me</Text>\n </ViewWin32>\n </TouchableWin32WithoutFeedback>\n\n <TouchableWin32WithoutFeedback style={styles.outerTouch} onPress={this._onPress}>\n <ViewWin32 style={styles.smallContainer}>\n <TouchableWin32WithoutFeedback style={styles.innerTouch} onPress={this._onPress}>\n <ViewWin32>\n <Text>You can also have nested Touchables</Text>\n </ViewWin32>\n </TouchableWin32WithoutFeedback>\n </ViewWin32>\n </TouchableWin32WithoutFeedback>\n <Text>{'Number of Recognized Presses: ' + this.state.numberOfPresses}</Text>\n </ViewWin32>\n );\n }\n\n private readonly _onPress = () => {\n this.setState({ numberOfPresses: this.state.numberOfPresses + 1 });\n };\n}\n\n/**\n * TouchableHighlightExamples\n */\nclass TouchableHighlightExample extends React.Component<{}, IExampleState> {\n constructor(props) {\n super(props);\n this.state = { numberOfPresses: 0 };\n }\n\n public render() {\n return (\n <ViewWin32 style={styles.largeContainer}>\n <TouchableWin32Highlight style={styles.outerTouch} onPress={this._onPress}>\n <ViewWin32>\n <Text>Press me</Text>\n </ViewWin32>\n </TouchableWin32Highlight>\n\n <TouchableWin32Highlight style={styles.outerTouch} onPress={this._onPress}>\n <ViewWin32 style={styles.smallContainer}>\n <TouchableWin32Highlight style={styles.innerTouch} onPress={this._onPress} children={this._getChildrenOfInnerTouchable} />\n </ViewWin32>\n </TouchableWin32Highlight>\n <Text style={{ color: 'red' }} textStyle=\"None\">\n {'Number of Recognized Presses: ' + this.state.numberOfPresses}\n </Text>\n </ViewWin32>\n );\n }\n\n /**\n * This is primarily to demonstrate render children as a function\n * of state, here we change text color depending on interaction state.\n */\n private readonly _getChildrenOfInnerTouchable = (state: ITouchableWin32State) => {\n return (\n <ViewWin32\n style={{\n borderColor: state.isFocused ? 'green' : 'pink',\n borderWidth: state.isHovered ? 10 : 5,\n height: 70,\n width: 70,\n }}\n >\n <Text\n style={{\n color: this._pickColor(state.isHovered, state.isPressed),\n fontSize: state.isFocused ? 8 : 10,\n }}\n textStyle=\"None\"\n >\n Press Me!\n </Text>\n </ViewWin32>\n );\n };\n\n private _pickColor(hovered: boolean, pressed: boolean) {\n if (hovered) {\n if (pressed) {\n return 'white';\n } else {\n return 'red';\n }\n } else {\n if (pressed) {\n return 'purple';\n } else {\n return 'black';\n }\n }\n }\n\n private readonly _onPress = () => {\n this.setState({ numberOfPresses: this.state.numberOfPresses + 1 });\n };\n}\n\nconst TouchableFocusExample = () => {\n const [focused, setFocused] = React.useState(false);\n const focusableRef = React.useRef<TouchableWin32>(null);\n\n // onPress callback\n const focusOnPress = React.useCallback(() => {\n focusableRef.current && focusableRef.current.focus();\n focused || setFocused(true);\n }, [focused]);\n\n // onFocus and onBlur callbacks\n const onFocus = React.useCallback(() => {\n setFocused(true);\n }, []);\n const onBlur = React.useCallback(() => {\n setFocused(false);\n }, []);\n\n return (\n <ViewWin32 style={styles.largeContainer}>\n <TouchableWin32Highlight onPress={focusOnPress}>\n <Text>Press me to focus my friend</Text>\n </TouchableWin32Highlight>\n\n <TouchableWin32Highlight\n ref={focusableRef}\n onFocus={onFocus}\n onBlur={onBlur}\n >\n <Text>{'Focused: ' + focused}</Text>\n </TouchableWin32Highlight>\n </ViewWin32>\n );\n}\n\nexport const displayName = 'TouchableWin32 Examples';\nexport const title = 'TouchableWin32';\nexport const description = 'Demonstration of touchable + focus + hover behavior all in one component';\n\nexport const examples = [\n {\n title: 'TouchableWithoutFeedback Example',\n description: 'A simple example implementation of without feedback behavior',\n render(): JSX.Element {\n return <TouchableWithoutFeedbackExample />;\n },\n },\n {\n title: 'TouchableHighlight Example',\n description: 'A simple example implementation of highlight behavior',\n render(): JSX.Element {\n return <TouchableHighlightExample />;\n },\n },\n {\n title: 'Imperative Focus on TouchableWin32 Example',\n description: 'A simple example implementation of imperative focus behavior',\n render(): JSX.Element {\n return <TouchableFocusExample />;\n },\n }\n];\n"]}
|
|
1
|
+
{"version":3,"file":"TouchableWin32Test.js","sourceRoot":"","sources":["../../../../src-win/Libraries/Components/Touchable/Tests/TouchableWin32Test.tsx"],"names":[],"mappings":"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","sourcesContent":["'use strict';\n\nimport React from 'react'\nimport {NativeSyntheticEvent, StyleSheet, Text, ViewStyle } from 'react-native';\nimport {Insets} from 'react-native/types/public/Insets';\nimport { ViewWin32 } from '../../View/ViewWin32';\nimport { IViewWin32Props, IKeyboardEvent } from '../../View/ViewPropTypes';\nimport { TouchableWin32 } from '../TouchableWin32';\nimport { IPressEvent, IRenderChild } from '../TouchableWin32.Types';\nimport { ITouchableWin32State } from '../TouchableWin32.Props';\n\n/**\n * Styles used across both examples\n */\nconst styles = StyleSheet.create({\n largeContainer: {\n height: 200,\n width: 600,\n justifyContent: 'space-between',\n alignItems: 'center',\n flexDirection: 'row',\n },\n smallContainer: {\n height: 90,\n width: 90,\n justifyContent: 'center',\n alignContent: 'center',\n },\n highlight: {\n height: 150,\n width: 150,\n justifyContent: 'space-around',\n alignContent: 'center',\n alignItems: 'center',\n flexDirection: 'row',\n },\n outerTouch: {\n height: 150,\n width: 150,\n justifyContent: 'space-around',\n alignContent: 'center',\n alignItems: 'center',\n flexDirection: 'row',\n },\n innerTouch: {\n height: 90,\n width: 90,\n alignItems: 'center',\n justifyContent: 'center',\n },\n});\n\n/**\n * Constant press rect offset, used to demonstrate press geometry\n */\nconst PRESS_RETENTION_OFFSET: Insets = {\n top: 100,\n left: 100,\n right: 100,\n bottom: 100,\n};\n\ninterface ITouchableWin32WithoutFeedbackProps extends IViewWin32Props {\n delayLongPress?: number;\n delayPressIn?: number;\n delayPressOut?: number;\n onPress?: (e: IPressEvent) => void;\n onPressIn?: (e: IPressEvent) => void;\n onPressOut?: (e: IPressEvent) => void;\n onLongPress?: (e: IPressEvent) => void;\n pressRetentionOffset?: Insets;\n rejectResponderTermination?: boolean;\n}\n\ninterface ITouchableWin32WithoutFeedbackState {\n isFocused: boolean;\n}\n\n/**\n * Example implementation of TouchableWithoutFeedback - not meant for use outside these examples\n * This is mainly there to show the ability to respond to touches without providing visual feedback,\n * though we do show a red border on focus to know where starts start and end and whether press rect\n * offsets are respected.\n */\nclass TouchableWin32WithoutFeedback extends React.Component<ITouchableWin32WithoutFeedbackProps, ITouchableWin32WithoutFeedbackState> {\n constructor(props) {\n super(props);\n\n this.state = { isFocused: false };\n }\n\n public render() {\n return (\n <TouchableWin32\n focusable\n rejectResponderTermination={true}\n disabled={false}\n touchableHandleActivePressIn={this._touchableHandleActivePressIn}\n touchableHandleActivePressOut={this._touchableHandleActivePressOut}\n touchableHandlePress={this._touchableHandlePress}\n touchableHandleLongPress={this._touchableHandleLongPress}\n touchableGetHighlightDelayMS={this._touchableGetHighlightDelayMS}\n touchableGetPressRectOffset={this._touchableGetPressRectOffset}\n touchableGetLongPressDelayMS={this._touchableGetLongPressDelayMS}\n touchableGetPressOutDelayMS={this._touchableGetPressOutDelayMS}\n touchableGetHitSlop={this._touchableGetHitSlop}\n onFocus={this._onFocus}\n onBlur={this._onBlur}\n renderStyle={this._generateStyle}\n >\n {React.Children.only(this.props.children)}\n </TouchableWin32>\n );\n }\n\n private readonly _touchableHandlePress = (e: IPressEvent) => {\n this.props.onPress && this.props.onPress(e);\n };\n\n private readonly _touchableHandleActivePressIn = (e: IPressEvent) => {\n this.props.onPressIn && this.props.onPressIn(e);\n };\n\n private readonly _touchableHandleActivePressOut = (e: IPressEvent) => {\n this.props.onPressOut && this.props.onPressOut(e);\n };\n\n private readonly _touchableHandleLongPress = (e: IPressEvent) => {\n this.props.onLongPress && this.props.onLongPress(e);\n };\n\n private readonly _touchableGetPressRectOffset = (): Insets => {\n return this.props.pressRetentionOffset || PRESS_RETENTION_OFFSET;\n };\n\n private readonly _touchableGetHitSlop = (): Insets => {\n return this.props.hitSlop as Insets;\n };\n\n private readonly _touchableGetHighlightDelayMS = (): number => {\n return this.props.delayPressIn || 0;\n };\n\n private readonly _touchableGetLongPressDelayMS = (): number => {\n return this.props.delayLongPress === 0 ? 0 : this.props.delayLongPress || 500;\n };\n\n private readonly _touchableGetPressOutDelayMS = (): number => {\n return this.props.delayPressOut || 0;\n };\n\n private readonly _onFocus = () => {\n this.setState({ isFocused: true });\n };\n\n private readonly _onBlur = () => {\n this.setState({ isFocused: false });\n };\n\n /**\n * The generated style uses hard-coded border width values\n */\n private readonly _generateStyle = (state: ITouchableWin32State): ViewStyle => {\n const finalStyle: ViewStyle = {\n borderWidth: state.isFocused ? 5 : 0,\n borderColor: 'red',\n };\n return Object.assign({}, this.props.style, finalStyle);\n };\n}\n\ninterface ITouchableWin32HighlightProps extends Omit <IViewWin32Props, 'children'> {\n delayLongPress?: number;\n delayLongPressIn?: number;\n delayPressOut?: number;\n onPress?: (e: IPressEvent) => void;\n onPressIn?: (e: IPressEvent) => void;\n onPressOut?: (e: IPressEvent) => void;\n onLongPress?: (e: IPressEvent) => void;\n onKeyPress?: (e: IKeyboardEvent) => void;\n onKeyPressDown?: (e: IKeyboardEvent) => void;\n pressRetentionOffset?: Insets;\n rejectResponderTermination?: boolean;\n underlayColor?: string;\n children?: IRenderChild<ITouchableWin32State>;\n}\n\ninterface ITouchableWin32HighlightComponentProps extends ITouchableWin32HighlightProps {\n // Used as an imperative handle to the TouchableWin32 interface - primarily for focus()\n innerRef?: React.Ref<TouchableWin32>;\n}\n\n/**\n * Example implementation of TouchableHighlight - not meant for use outside these examples\n * The main difference between a full TouchableHighlight implementation and this example is that\n * TouchableHighlight should manipulate the opacity of the wrapped view to display the underlay color.\n * This example merely uses hard coded color values to distinguish between different control states\n */\nclass TouchableWin32HighlightComponent extends React.Component<ITouchableWin32HighlightComponentProps, {}> {\n\n public render() {\n return (\n <TouchableWin32\n focusable\n rejectResponderTermination={this.props.rejectResponderTermination}\n disabled={false}\n touchableHandleActivePressIn={this._touchableHandleActivePressIn}\n touchableHandleActivePressOut={this._touchableHandleActivePressOut}\n touchableHandlePress={this._touchableHandlePress}\n touchableHandleLongPress={this._touchableHandleLongPress}\n touchableGetHighlightDelayMS={this._touchableGetHighlightDelayMS}\n touchableGetPressRectOffset={this._touchableGetPressRectOffset}\n touchableGetLongPressDelayMS={this._touchableGetLongPressDelayMS}\n touchableGetPressOutDelayMS={this._touchableGetPressOutDelayMS}\n touchableGetHitSlop={this._touchableGetHitSlop}\n touchableHandleKeyPress={this._touchableHandleKeyPress}\n touchableHandleKeyPressDown={this._touchableHandleKeyPressDown}\n onFocus={this._onFocus}\n onBlur={this._onBlur}\n onMouseEnter={this._mouseEnter}\n onMouseLeave={this._mouseLeave}\n renderStyle={this._generateStyle}\n children={this.props.children}\n ref={this.props.innerRef}\n />\n );\n }\n\n private readonly _touchableHandlePress = (e: IPressEvent) => {\n this.props.onPress && this.props.onPress(e);\n this.setState({ isPressed: false });\n };\n private readonly _touchableHandleActivePressIn = (e: IPressEvent) => {\n this.props.onPressIn && this.props.onPressIn(e);\n this.setState({ isPressed: true });\n };\n private readonly _touchableHandleActivePressOut = (e: IPressEvent) => {\n this.props.onPressOut && this.props.onPressOut(e);\n this.setState({ isPressed: false });\n };\n private readonly _touchableHandleLongPress = (e: IPressEvent) => {\n this.props.onLongPress && this.props.onLongPress(e);\n };\n private readonly _touchableGetPressRectOffset = (): Insets => {\n return this.props.pressRetentionOffset || PRESS_RETENTION_OFFSET;\n };\n private readonly _touchableGetHitSlop = (): Insets => {\n return { left: 100, right: 100, top: 100, bottom: 100 };\n };\n private readonly _touchableGetHighlightDelayMS = (): number => {\n return this.props.delayLongPressIn || 0;\n };\n private readonly _touchableGetLongPressDelayMS = (): number => {\n return this.props.delayLongPress || 500;\n };\n private readonly _touchableGetPressOutDelayMS = (): number => {\n return this.props.delayPressOut || 0;\n };\n private readonly _touchableHandleKeyPress = (ev: IKeyboardEvent) => {\n this.props.onKeyPress && this.props.onKeyPress(ev);\n }\n private readonly _touchableHandleKeyPressDown = (ev: IKeyboardEvent) => {\n this.props.onKeyPressDown && this.props.onKeyPressDown(ev);\n }\n private readonly _mouseEnter = (mouseEvent): void => {\n this.props.onMouseEnter && this.props.onMouseEnter(mouseEvent);\n this.setState({ isMouseIn: true });\n };\n private readonly _mouseLeave = (mouseEvent): void => {\n this.props.onMouseLeave && this.props.onMouseLeave(mouseEvent);\n this.setState({ isMouseIn: false });\n };\n private readonly _onFocus = (ev: NativeSyntheticEvent<{}>): void => {\n this.props.onFocus && this.props.onFocus(ev);\n this.setState({ isFocused: true });\n };\n private readonly _onBlur = (ev: NativeSyntheticEvent<{}>): void => {\n this.props.onBlur && this.props.onBlur(ev);\n this.setState({ isFocused: false });\n };\n\n /**\n * The generated style uses hard-coded color values,\n * though it is trivial to pass these values as props.\n * This is an example of a render style (one that is a\n * function passed on to TouchableWin32 and resolved according\n * to the internal state of TouchableWin32).\n */\n private readonly _generateStyle = (state: ITouchableWin32State): ViewStyle => {\n const finalStyle: ViewStyle = {};\n finalStyle.borderColor = state.isFocused ? 'red' : 'blue';\n finalStyle.borderWidth = state.isFocused ? 10 : 5;\n if (state.isHovered) {\n if (state.isPressed) {\n finalStyle.backgroundColor = 'black';\n } else {\n finalStyle.backgroundColor = 'gray';\n }\n } else {\n if (state.isPressed) {\n finalStyle.backgroundColor = 'green';\n } else {\n finalStyle.backgroundColor = 'white';\n }\n }\n return Object.assign({}, this.props.style, finalStyle);\n };\n}\n\n// Demonstrating ref forwarding - forwarding a ref using an innerRef prop on a class component\nconst TouchableWin32Highlight = React.forwardRef<TouchableWin32, ITouchableWin32HighlightProps>(\n (props, ref) => {\n return (\n <TouchableWin32HighlightComponent innerRef={ref} {...props} />\n );\n }\n);\n\n/**\n * Both examples merely track number of presses\n */\ninterface IExampleState {\n numberOfPresses: number;\n}\n\n/**\n * TouchableHighlightExamples\n */\nclass TouchableWithoutFeedbackExample extends React.Component<{}, IExampleState> {\n constructor(props) {\n super(props);\n this.state = { numberOfPresses: 0 };\n }\n\n public render() {\n return (\n <ViewWin32 style={styles.largeContainer}>\n <TouchableWin32WithoutFeedback style={styles.outerTouch} onPress={this._onPress}>\n <ViewWin32>\n <Text>Press me</Text>\n </ViewWin32>\n </TouchableWin32WithoutFeedback>\n\n <TouchableWin32WithoutFeedback style={styles.outerTouch} onPress={this._onPress}>\n <ViewWin32 style={styles.smallContainer}>\n <TouchableWin32WithoutFeedback style={styles.innerTouch} onPress={this._onPress}>\n <ViewWin32>\n <Text>You can also have nested Touchables</Text>\n </ViewWin32>\n </TouchableWin32WithoutFeedback>\n </ViewWin32>\n </TouchableWin32WithoutFeedback>\n <Text>{'Number of Recognized Presses: ' + this.state.numberOfPresses}</Text>\n </ViewWin32>\n );\n }\n\n private readonly _onPress = () => {\n this.setState({ numberOfPresses: this.state.numberOfPresses + 1 });\n };\n}\n\n/**\n * TouchableHighlightExamples\n */\nclass TouchableHighlightExample extends React.Component<{}, IExampleState> {\n constructor(props) {\n super(props);\n this.state = { numberOfPresses: 0 };\n }\n\n public render() {\n return (\n <ViewWin32 style={styles.largeContainer}>\n <TouchableWin32Highlight style={styles.outerTouch} onPress={this._onPress}>\n <ViewWin32>\n <Text>Press me</Text>\n </ViewWin32>\n </TouchableWin32Highlight>\n\n <TouchableWin32Highlight style={styles.outerTouch} onPress={this._onPress}>\n <ViewWin32 style={styles.smallContainer}>\n <TouchableWin32Highlight style={styles.innerTouch} onPress={this._onPress} children={this._getChildrenOfInnerTouchable} />\n </ViewWin32>\n </TouchableWin32Highlight>\n <Text style={{ color: 'red' }} textStyle=\"None\">\n {'Number of Recognized Presses: ' + this.state.numberOfPresses}\n </Text>\n </ViewWin32>\n );\n }\n\n /**\n * This is primarily to demonstrate render children as a function\n * of state, here we change text color depending on interaction state.\n */\n private readonly _getChildrenOfInnerTouchable = (state: ITouchableWin32State) => {\n return (\n <ViewWin32\n style={{\n borderColor: state.isFocused ? 'green' : 'pink',\n borderWidth: state.isHovered ? 10 : 5,\n height: 70,\n width: 70,\n }}\n >\n <Text\n style={{\n color: this._pickColor(state.isHovered, state.isPressed),\n fontSize: state.isFocused ? 8 : 10,\n }}\n textStyle=\"None\"\n >\n Press Me!\n </Text>\n </ViewWin32>\n );\n };\n\n private _pickColor(hovered: boolean, pressed: boolean) {\n if (hovered) {\n if (pressed) {\n return 'white';\n } else {\n return 'red';\n }\n } else {\n if (pressed) {\n return 'purple';\n } else {\n return 'black';\n }\n }\n }\n\n private readonly _onPress = () => {\n this.setState({ numberOfPresses: this.state.numberOfPresses + 1 });\n };\n}\n\nconst TouchableFocusExample = () => {\n const [focused, setFocused] = React.useState(false);\n const focusableRef = React.useRef<TouchableWin32>(null);\n\n // onPress callback\n const focusOnPress = React.useCallback(() => {\n focusableRef.current && focusableRef.current.focus();\n focused || setFocused(true);\n }, [focused]);\n\n // onFocus and onBlur callbacks\n const onFocus = React.useCallback(() => {\n setFocused(true);\n }, []);\n const onBlur = React.useCallback(() => {\n setFocused(false);\n }, []);\n\n return (\n <ViewWin32 style={styles.largeContainer}>\n <TouchableWin32Highlight onPress={focusOnPress}>\n <Text>Press me to focus my friend</Text>\n </TouchableWin32Highlight>\n\n <TouchableWin32Highlight\n ref={focusableRef}\n onFocus={onFocus}\n onBlur={onBlur}\n >\n <Text>{'Focused: ' + focused}</Text>\n </TouchableWin32Highlight>\n </ViewWin32>\n );\n}\n\nexport const displayName = 'TouchableWin32 Examples';\nexport const title = 'TouchableWin32';\nexport const description = 'Demonstration of touchable + focus + hover behavior all in one component';\n\nexport const examples = [\n {\n title: 'TouchableWithoutFeedback Example',\n description: 'A simple example implementation of without feedback behavior',\n render() {\n return <TouchableWithoutFeedbackExample />;\n },\n },\n {\n title: 'TouchableHighlight Example',\n description: 'A simple example implementation of highlight behavior',\n render() {\n return <TouchableHighlightExample />;\n },\n },\n {\n title: 'Imperative Focus on TouchableWin32 Example',\n description: 'A simple example implementation of imperative focus behavior',\n render() {\n return <TouchableFocusExample />;\n },\n }\n];\n"]}
|
|
@@ -370,7 +370,7 @@ const LONG_PRESS_ALLOWED_MOVEMENT = 10;
|
|
|
370
370
|
*
|
|
371
371
|
* @lends Touchable.prototype
|
|
372
372
|
*/
|
|
373
|
-
const
|
|
373
|
+
const TouchableMixinImpl = {
|
|
374
374
|
componentDidMount: function () {
|
|
375
375
|
if (!Platform.isTV) {
|
|
376
376
|
return;
|
|
@@ -946,12 +946,12 @@ const {
|
|
|
946
946
|
touchableHandleFocus,
|
|
947
947
|
touchableHandleBlur,
|
|
948
948
|
...TouchableMixinWithoutDefaultFocusAndBlur
|
|
949
|
-
} =
|
|
950
|
-
|
|
949
|
+
} = TouchableMixinImpl;
|
|
950
|
+
TouchableMixinImpl.withoutDefaultFocusAndBlur =
|
|
951
951
|
TouchableMixinWithoutDefaultFocusAndBlur;
|
|
952
952
|
|
|
953
|
-
const
|
|
954
|
-
Mixin:
|
|
953
|
+
const TouchableImpl = {
|
|
954
|
+
Mixin: TouchableMixinImpl,
|
|
955
955
|
/**
|
|
956
956
|
* Renders a debugging overlay to visualize touch target with hitSlop (might not work on Android).
|
|
957
957
|
*/
|
|
@@ -960,7 +960,7 @@ const Touchable = {
|
|
|
960
960
|
hitSlop,
|
|
961
961
|
}: {
|
|
962
962
|
color: ColorValue,
|
|
963
|
-
hitSlop
|
|
963
|
+
hitSlop?: EdgeInsetsProp,
|
|
964
964
|
...
|
|
965
965
|
}): null | React.Node => {
|
|
966
966
|
if (__DEV__) {
|
|
@@ -970,4 +970,4 @@ const Touchable = {
|
|
|
970
970
|
},
|
|
971
971
|
};
|
|
972
972
|
|
|
973
|
-
export default
|
|
973
|
+
export default TouchableImpl;
|
|
@@ -375,7 +375,7 @@ const LONG_PRESS_ALLOWED_MOVEMENT = 10;
|
|
|
375
375
|
*
|
|
376
376
|
* @lends Touchable.prototype
|
|
377
377
|
*/
|
|
378
|
-
const
|
|
378
|
+
const TouchableMixinImpl = {
|
|
379
379
|
componentDidMount: function () {
|
|
380
380
|
if (!Platform.isTV) {
|
|
381
381
|
return;
|
|
@@ -951,12 +951,12 @@ const {
|
|
|
951
951
|
touchableHandleFocus,
|
|
952
952
|
touchableHandleBlur,
|
|
953
953
|
...TouchableMixinWithoutDefaultFocusAndBlur
|
|
954
|
-
} =
|
|
955
|
-
|
|
954
|
+
} = TouchableMixinImpl;
|
|
955
|
+
TouchableMixinImpl.withoutDefaultFocusAndBlur =
|
|
956
956
|
TouchableMixinWithoutDefaultFocusAndBlur;
|
|
957
957
|
|
|
958
|
-
const
|
|
959
|
-
Mixin:
|
|
958
|
+
const TouchableImpl = {
|
|
959
|
+
Mixin: TouchableMixinImpl,
|
|
960
960
|
/**
|
|
961
961
|
* Renders a debugging overlay to visualize touch target with hitSlop (might not work on Android).
|
|
962
962
|
*/
|
|
@@ -965,7 +965,7 @@ const Touchable = {
|
|
|
965
965
|
hitSlop,
|
|
966
966
|
}: {
|
|
967
967
|
color: ColorValue,
|
|
968
|
-
hitSlop
|
|
968
|
+
hitSlop?: EdgeInsetsProp,
|
|
969
969
|
...
|
|
970
970
|
}): null | React.Node => {
|
|
971
971
|
if (__DEV__) {
|
|
@@ -975,4 +975,4 @@ const Touchable = {
|
|
|
975
975
|
},
|
|
976
976
|
};
|
|
977
977
|
|
|
978
|
-
export default
|
|
978
|
+
export default TouchableImpl;
|
|
@@ -214,7 +214,7 @@ class TouchableBounce extends React.Component<Props, State> {
|
|
|
214
214
|
}
|
|
215
215
|
}
|
|
216
216
|
|
|
217
|
-
export default (React.forwardRef((props, hostRef) => (
|
|
217
|
+
export default (React.forwardRef((props, hostRef: React.RefSetter<mixed>) => (
|
|
218
218
|
<TouchableBounce {...props} hostRef={hostRef} />
|
|
219
219
|
)): component(
|
|
220
220
|
ref: React.RefSetter<mixed>,
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
*/
|
|
10
10
|
|
|
11
11
|
import type {ColorValue} from '../../StyleSheet/StyleSheet';
|
|
12
|
-
import
|
|
12
|
+
import type {TouchableWithoutFeedbackProps} from './TouchableWithoutFeedback';
|
|
13
13
|
|
|
14
14
|
import View from '../../Components/View/View';
|
|
15
15
|
import Pressability, {
|
|
@@ -32,21 +32,39 @@ type IOSProps = $ReadOnly<{
|
|
|
32
32
|
hasTVPreferredFocus?: ?boolean,
|
|
33
33
|
}>;
|
|
34
34
|
|
|
35
|
-
type
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
35
|
+
type TouchableHighlightBaseProps = $ReadOnly<{
|
|
36
|
+
/**
|
|
37
|
+
* Determines what the opacity of the wrapped view should be when touch is active.
|
|
38
|
+
*/
|
|
40
39
|
activeOpacity?: ?number,
|
|
40
|
+
/**
|
|
41
|
+
* The color of the underlay that will show through when the touch is active.
|
|
42
|
+
*/
|
|
41
43
|
underlayColor?: ?ColorValue,
|
|
44
|
+
/**
|
|
45
|
+
* @see https://reactnative.dev/docs/view#style
|
|
46
|
+
*/
|
|
42
47
|
style?: ?ViewStyleProp,
|
|
48
|
+
/**
|
|
49
|
+
* Called immediately after the underlay is shown
|
|
50
|
+
*/
|
|
43
51
|
onShowUnderlay?: ?() => void,
|
|
52
|
+
/**
|
|
53
|
+
* Called immediately after the underlay is hidden
|
|
54
|
+
*/
|
|
44
55
|
onHideUnderlay?: ?() => void,
|
|
45
56
|
testOnly_pressed?: ?boolean,
|
|
46
57
|
|
|
47
58
|
hostRef: React.RefSetter<React.ElementRef<typeof View>>,
|
|
48
59
|
}>;
|
|
49
60
|
|
|
61
|
+
type TouchableHighlightProps = $ReadOnly<{
|
|
62
|
+
...TouchableWithoutFeedbackProps,
|
|
63
|
+
...AndroidProps,
|
|
64
|
+
...IOSProps,
|
|
65
|
+
...TouchableHighlightBaseProps,
|
|
66
|
+
}>;
|
|
67
|
+
|
|
50
68
|
type ExtraStyles = $ReadOnly<{
|
|
51
69
|
child: ViewStyleProp,
|
|
52
70
|
underlay: ViewStyleProp,
|
|
@@ -153,7 +171,10 @@ type State = $ReadOnly<{
|
|
|
153
171
|
* ```
|
|
154
172
|
*
|
|
155
173
|
*/
|
|
156
|
-
class
|
|
174
|
+
class TouchableHighlightImpl extends React.Component<
|
|
175
|
+
TouchableHighlightProps,
|
|
176
|
+
State,
|
|
177
|
+
> {
|
|
157
178
|
_hideTimeout: ?TimeoutID;
|
|
158
179
|
_isMounted: boolean = false;
|
|
159
180
|
|
|
@@ -368,7 +389,7 @@ class TouchableHighlight extends React.Component<Props, State> {
|
|
|
368
389
|
this.state.pressability.configure(this._createPressabilityConfig());
|
|
369
390
|
}
|
|
370
391
|
|
|
371
|
-
componentDidUpdate(prevProps:
|
|
392
|
+
componentDidUpdate(prevProps: TouchableHighlightProps, prevState: State) {
|
|
372
393
|
this.state.pressability.configure(this._createPressabilityConfig());
|
|
373
394
|
}
|
|
374
395
|
|
|
@@ -381,13 +402,13 @@ class TouchableHighlight extends React.Component<Props, State> {
|
|
|
381
402
|
}
|
|
382
403
|
}
|
|
383
404
|
|
|
384
|
-
const
|
|
385
|
-
ref
|
|
386
|
-
...props: $ReadOnly<$Diff<
|
|
405
|
+
const TouchableHighlight: component(
|
|
406
|
+
ref?: React.RefSetter<React.ElementRef<typeof View>>,
|
|
407
|
+
...props: $ReadOnly<$Diff<TouchableHighlightProps, {+hostRef: mixed}>>
|
|
387
408
|
) = React.forwardRef((props, hostRef) => (
|
|
388
|
-
<
|
|
409
|
+
<TouchableHighlightImpl {...props} hostRef={hostRef} />
|
|
389
410
|
));
|
|
390
411
|
|
|
391
|
-
|
|
412
|
+
TouchableHighlight.displayName = 'TouchableHighlight';
|
|
392
413
|
|
|
393
|
-
export default
|
|
414
|
+
export default TouchableHighlight;
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
*/
|
|
10
10
|
|
|
11
11
|
import type {GestureResponderEvent} from '../../Types/CoreEventTypes';
|
|
12
|
-
import
|
|
12
|
+
import type {TouchableWithoutFeedbackProps} from './TouchableWithoutFeedback';
|
|
13
13
|
|
|
14
14
|
import View from '../../Components/View/View';
|
|
15
15
|
import Pressability, {
|
|
@@ -23,61 +23,82 @@ import {Commands} from '../View/ViewNativeComponent';
|
|
|
23
23
|
import invariant from 'invariant';
|
|
24
24
|
import * as React from 'react';
|
|
25
25
|
|
|
26
|
-
type
|
|
27
|
-
...React.ElementConfig<TouchableWithoutFeedback>,
|
|
28
|
-
|
|
26
|
+
type TVProps = {
|
|
29
27
|
/**
|
|
30
|
-
*
|
|
31
|
-
*
|
|
32
|
-
*
|
|
33
|
-
* methods to generate that dictionary.
|
|
34
|
-
*/
|
|
35
|
-
background?: ?(
|
|
36
|
-
| $ReadOnly<{
|
|
37
|
-
type: 'ThemeAttrAndroid',
|
|
38
|
-
attribute:
|
|
39
|
-
| 'selectableItemBackground'
|
|
40
|
-
| 'selectableItemBackgroundBorderless',
|
|
41
|
-
rippleRadius: ?number,
|
|
42
|
-
}>
|
|
43
|
-
| $ReadOnly<{
|
|
44
|
-
type: 'RippleAndroid',
|
|
45
|
-
color: ?number,
|
|
46
|
-
borderless: boolean,
|
|
47
|
-
rippleRadius: ?number,
|
|
48
|
-
}>
|
|
49
|
-
),
|
|
50
|
-
|
|
51
|
-
/**
|
|
52
|
-
* TV preferred focus (see documentation for the View component).
|
|
28
|
+
* *(Apple TV only)* TV preferred focus (see documentation for the View component).
|
|
29
|
+
*
|
|
30
|
+
* @platform ios
|
|
53
31
|
*/
|
|
54
32
|
hasTVPreferredFocus?: ?boolean,
|
|
55
33
|
|
|
56
34
|
/**
|
|
57
|
-
*
|
|
35
|
+
* Designates the next view to receive focus when the user navigates down. See the Android documentation.
|
|
36
|
+
*
|
|
37
|
+
* @platform android
|
|
58
38
|
*/
|
|
59
39
|
nextFocusDown?: ?number,
|
|
60
40
|
|
|
61
41
|
/**
|
|
62
|
-
*
|
|
42
|
+
* Designates the next view to receive focus when the user navigates forward. See the Android documentation.
|
|
43
|
+
*
|
|
44
|
+
* @platform android
|
|
63
45
|
*/
|
|
64
46
|
nextFocusForward?: ?number,
|
|
65
47
|
|
|
66
48
|
/**
|
|
67
|
-
*
|
|
49
|
+
* Designates the next view to receive focus when the user navigates left. See the Android documentation.
|
|
50
|
+
*
|
|
51
|
+
* @platform android
|
|
68
52
|
*/
|
|
69
53
|
nextFocusLeft?: ?number,
|
|
70
54
|
|
|
71
55
|
/**
|
|
72
|
-
*
|
|
56
|
+
* Designates the next view to receive focus when the user navigates right. See the Android documentation.
|
|
57
|
+
*
|
|
58
|
+
* @platform android
|
|
73
59
|
*/
|
|
74
60
|
nextFocusRight?: ?number,
|
|
75
61
|
|
|
76
62
|
/**
|
|
77
|
-
*
|
|
63
|
+
* Designates the next view to receive focus when the user navigates up. See the Android documentation.
|
|
64
|
+
*
|
|
65
|
+
* @platform android
|
|
78
66
|
*/
|
|
79
67
|
nextFocusUp?: ?number,
|
|
68
|
+
};
|
|
80
69
|
|
|
70
|
+
export type TouchableNativeFeedbackProps = $ReadOnly<{
|
|
71
|
+
...TouchableWithoutFeedbackProps,
|
|
72
|
+
...TVProps,
|
|
73
|
+
/**
|
|
74
|
+
* Determines the type of background drawable that's going to be used to display feedback.
|
|
75
|
+
* It takes an object with type property and extra data depending on the type.
|
|
76
|
+
* It's recommended to use one of the following static methods to generate that dictionary:
|
|
77
|
+
* 1) TouchableNativeFeedback.SelectableBackground() - will create object that represents android theme's
|
|
78
|
+
* default background for selectable elements (?android:attr/selectableItemBackground)
|
|
79
|
+
* 2) TouchableNativeFeedback.SelectableBackgroundBorderless() - will create object that represent android
|
|
80
|
+
* theme's default background for borderless selectable elements
|
|
81
|
+
* (?android:attr/selectableItemBackgroundBorderless). Available on android API level 21+
|
|
82
|
+
* 3) TouchableNativeFeedback.Ripple(color, borderless) - will create object that represents ripple drawable
|
|
83
|
+
* with specified color (as a string). If property borderless evaluates to true the ripple will render
|
|
84
|
+
* outside of the view bounds (see native actionbar buttons as an example of that behavior). This background
|
|
85
|
+
* type is available on Android API level 21+
|
|
86
|
+
*/
|
|
87
|
+
background?: ?(
|
|
88
|
+
| $ReadOnly<{
|
|
89
|
+
type: 'ThemeAttrAndroid',
|
|
90
|
+
attribute:
|
|
91
|
+
| 'selectableItemBackground'
|
|
92
|
+
| 'selectableItemBackgroundBorderless',
|
|
93
|
+
rippleRadius: ?number,
|
|
94
|
+
}>
|
|
95
|
+
| $ReadOnly<{
|
|
96
|
+
type: 'RippleAndroid',
|
|
97
|
+
color: ?number,
|
|
98
|
+
borderless: boolean,
|
|
99
|
+
rippleRadius: ?number,
|
|
100
|
+
}>
|
|
101
|
+
),
|
|
81
102
|
/**
|
|
82
103
|
* Set to true to add the ripple effect to the foreground of the view, instead
|
|
83
104
|
* of the background. This is useful if one of your child views has a
|
|
@@ -95,50 +116,74 @@ type State = $ReadOnly<{
|
|
|
95
116
|
pressability: Pressability,
|
|
96
117
|
}>;
|
|
97
118
|
|
|
98
|
-
|
|
119
|
+
/**
|
|
120
|
+
* A wrapper for making views respond properly to touches (Android only).
|
|
121
|
+
* On Android this component uses native state drawable to display touch feedback.
|
|
122
|
+
* At the moment it only supports having a single View instance as a child node,
|
|
123
|
+
* as it's implemented by replacing that View with another instance of RCTView node with some additional properties set.
|
|
124
|
+
*
|
|
125
|
+
* Background drawable of native feedback touchable can be customized with background property.
|
|
126
|
+
*
|
|
127
|
+
* @see https://reactnative.dev/docs/touchablenativefeedback#content
|
|
128
|
+
*/
|
|
129
|
+
class TouchableNativeFeedback extends React.Component<
|
|
130
|
+
TouchableNativeFeedbackProps,
|
|
131
|
+
State,
|
|
132
|
+
> {
|
|
99
133
|
/**
|
|
100
|
-
* Creates
|
|
101
|
-
*
|
|
134
|
+
* Creates an object that represents android theme's default background for
|
|
135
|
+
* selectable elements (?android:attr/selectableItemBackground).
|
|
136
|
+
*
|
|
137
|
+
* @param rippleRadius The radius of ripple effect
|
|
102
138
|
*/
|
|
103
|
-
static SelectableBackground: (rippleRadius
|
|
139
|
+
static SelectableBackground: (rippleRadius?: ?number) => $ReadOnly<{
|
|
104
140
|
attribute: 'selectableItemBackground',
|
|
105
141
|
type: 'ThemeAttrAndroid',
|
|
106
142
|
rippleRadius: ?number,
|
|
107
|
-
}> = (rippleRadius
|
|
143
|
+
}> = (rippleRadius?: ?number) => ({
|
|
108
144
|
type: 'ThemeAttrAndroid',
|
|
109
145
|
attribute: 'selectableItemBackground',
|
|
110
146
|
rippleRadius,
|
|
111
147
|
});
|
|
112
148
|
|
|
113
149
|
/**
|
|
114
|
-
* Creates
|
|
115
|
-
*
|
|
150
|
+
* Creates an object that represent android theme's default background for borderless
|
|
151
|
+
* selectable elements (?android:attr/selectableItemBackgroundBorderless).
|
|
152
|
+
* Available on android API level 21+.
|
|
153
|
+
*
|
|
154
|
+
* @param rippleRadius The radius of ripple effect
|
|
116
155
|
*/
|
|
117
|
-
static SelectableBackgroundBorderless: (rippleRadius
|
|
156
|
+
static SelectableBackgroundBorderless: (rippleRadius?: ?number) => $ReadOnly<{
|
|
118
157
|
attribute: 'selectableItemBackgroundBorderless',
|
|
119
158
|
type: 'ThemeAttrAndroid',
|
|
120
159
|
rippleRadius: ?number,
|
|
121
|
-
}> = (rippleRadius
|
|
160
|
+
}> = (rippleRadius?: ?number) => ({
|
|
122
161
|
type: 'ThemeAttrAndroid',
|
|
123
162
|
attribute: 'selectableItemBackgroundBorderless',
|
|
124
163
|
rippleRadius,
|
|
125
164
|
});
|
|
126
165
|
|
|
127
166
|
/**
|
|
128
|
-
* Creates
|
|
129
|
-
*
|
|
130
|
-
* of the view bounds
|
|
167
|
+
* Creates an object that represents ripple drawable with specified color (as a
|
|
168
|
+
* string). If property `borderless` evaluates to true the ripple will
|
|
169
|
+
* render outside of the view bounds (see native actionbar buttons as an
|
|
170
|
+
* example of that behavior). This background type is available on Android
|
|
171
|
+
* API level 21+.
|
|
172
|
+
*
|
|
173
|
+
* @param color The ripple color
|
|
174
|
+
* @param borderless If the ripple can render outside it's bounds
|
|
175
|
+
* @param rippleRadius The radius of ripple effect
|
|
131
176
|
*/
|
|
132
177
|
static Ripple: (
|
|
133
178
|
color: string,
|
|
134
179
|
borderless: boolean,
|
|
135
|
-
rippleRadius
|
|
180
|
+
rippleRadius?: ?number,
|
|
136
181
|
) => $ReadOnly<{
|
|
137
182
|
borderless: boolean,
|
|
138
183
|
color: ?number,
|
|
139
184
|
rippleRadius: ?number,
|
|
140
185
|
type: 'RippleAndroid',
|
|
141
|
-
}> = (color: string, borderless: boolean, rippleRadius
|
|
186
|
+
}> = (color: string, borderless: boolean, rippleRadius?: ?number) => {
|
|
142
187
|
const processedColor = processColor(color);
|
|
143
188
|
invariant(
|
|
144
189
|
processedColor == null || typeof processedColor === 'number',
|
|
@@ -336,7 +381,10 @@ class TouchableNativeFeedback extends React.Component<Props, State> {
|
|
|
336
381
|
);
|
|
337
382
|
}
|
|
338
383
|
|
|
339
|
-
componentDidUpdate(
|
|
384
|
+
componentDidUpdate(
|
|
385
|
+
prevProps: TouchableNativeFeedbackProps,
|
|
386
|
+
prevState: State,
|
|
387
|
+
) {
|
|
340
388
|
this.state.pressability.configure(this._createPressabilityConfig());
|
|
341
389
|
}
|
|
342
390
|
|