mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Summary: *Pressable* is a component which is intended to replace the Touchable* components such as *TouchableWithoutFeedback* and *TouchableOpacity*. The motivation is to make it easier to create custom visual touch feedback so that React Native apps are not easily identified by the “signature opacity fade” touch feedback. We see this component as eventually deprecating all of the existing Touchable components. Changelog: [Added][General] New <Pressable> Component to make it easier to create touchable elements Reviewed By: yungsters Differential Revision: D19674480 fbshipit-source-id: 765d657f023caea459f02da25376e4d5a2efff8b
254 lines
6.2 KiB
JavaScript
254 lines
6.2 KiB
JavaScript
/**
|
|
* Copyright (c) Facebook, Inc. and its affiliates.
|
|
*
|
|
* This source code is licensed under the MIT license found in the
|
|
* LICENSE file in the root directory of this source tree.
|
|
*
|
|
* @format
|
|
* @flow
|
|
*/
|
|
|
|
'use strict';
|
|
|
|
import type {RNTesterExample} from '../types/RNTesterTypes';
|
|
|
|
const ComponentExamples: Array<RNTesterExample> = [
|
|
{
|
|
key: 'ActivityIndicatorExample',
|
|
module: require('../examples/ActivityIndicator/ActivityIndicatorExample'),
|
|
},
|
|
{
|
|
key: 'ButtonExample',
|
|
module: require('../examples/Button/ButtonExample'),
|
|
},
|
|
{
|
|
key: 'CheckBoxExample',
|
|
module: require('../examples/CheckBox/CheckBoxExample'),
|
|
},
|
|
{
|
|
key: 'FlatListExample',
|
|
module: require('../examples/FlatList/FlatListExample'),
|
|
},
|
|
{
|
|
key: 'ImageExample',
|
|
module: require('../examples/Image/ImageExample'),
|
|
},
|
|
{
|
|
key: 'JSResponderHandlerExample',
|
|
module: require('../examples/JSResponderHandlerExample/JSResponderHandlerExample'),
|
|
},
|
|
{
|
|
key: 'KeyboardAvoidingViewExample',
|
|
module: require('../examples/KeyboardAvoidingView/KeyboardAvoidingViewExample'),
|
|
},
|
|
{
|
|
key: 'ModalExample',
|
|
module: require('../examples/Modal/ModalExample'),
|
|
},
|
|
{
|
|
key: 'MultiColumnExample',
|
|
module: require('../examples/MultiColumn/MultiColumnExample'),
|
|
},
|
|
{
|
|
key: 'NewAppScreenExample',
|
|
module: require('../examples/NewAppScreen/NewAppScreenExample'),
|
|
},
|
|
{
|
|
key: 'PickerExample',
|
|
module: require('../examples/Picker/PickerExample'),
|
|
},
|
|
{
|
|
key: 'PressableExample',
|
|
module: require('../examples/Pressable/PressableExample'),
|
|
},
|
|
{
|
|
key: 'ProgressBarAndroidExample',
|
|
module: require('../examples/ProgressBarAndroid/ProgressBarAndroidExample'),
|
|
},
|
|
{
|
|
key: 'RefreshControlExample',
|
|
module: require('../examples/RefreshControl/RefreshControlExample'),
|
|
},
|
|
{
|
|
key: 'ScrollViewExample',
|
|
module: require('../examples/ScrollView/ScrollViewExample'),
|
|
},
|
|
{
|
|
key: 'ScrollViewSimpleExample',
|
|
module: require('../examples/ScrollView/ScrollViewSimpleExample'),
|
|
},
|
|
{
|
|
key: 'ScrollViewAnimatedExample',
|
|
module: require('../examples/ScrollView/ScrollViewAnimatedExample'),
|
|
},
|
|
{
|
|
key: 'SectionListExample',
|
|
module: require('../examples/SectionList/SectionListExample'),
|
|
},
|
|
{
|
|
key: 'SliderExample',
|
|
module: require('../examples/Slider/SliderExample'),
|
|
},
|
|
{
|
|
key: 'StatusBarExample',
|
|
module: require('../examples/StatusBar/StatusBarExample'),
|
|
},
|
|
{
|
|
key: 'SwitchExample',
|
|
module: require('../examples/Switch/SwitchExample'),
|
|
},
|
|
{
|
|
key: 'TextExample',
|
|
module: require('../examples/Text/TextExample'),
|
|
},
|
|
{
|
|
key: 'TextInputExample',
|
|
module: require('../examples/TextInput/TextInputExample'),
|
|
},
|
|
{
|
|
key: 'TouchableExample',
|
|
module: require('../examples/Touchable/TouchableExample'),
|
|
},
|
|
{
|
|
key: 'ViewExample',
|
|
module: require('../examples/View/ViewExample'),
|
|
},
|
|
];
|
|
|
|
const APIExamples: Array<RNTesterExample> = [
|
|
{
|
|
key: 'AccessibilityExample',
|
|
module: require('../examples/Accessibility/AccessibilityExample'),
|
|
},
|
|
{
|
|
key: 'AccessibilityAndroidExample',
|
|
module: require('../examples/Accessibility/AccessibilityAndroidExample'),
|
|
},
|
|
{
|
|
key: 'AlertExample',
|
|
module: require('../examples/Alert/AlertExample').AlertExample,
|
|
},
|
|
{
|
|
key: 'AnimatedExample',
|
|
module: require('../examples/Animated/AnimatedExample'),
|
|
},
|
|
{
|
|
key: 'Animation - GratuitousAnimation',
|
|
module: require('../examples/Animated/AnimatedGratuitousApp/AnExApp'),
|
|
},
|
|
{
|
|
key: 'AppearanceExample',
|
|
module: require('../examples/Appearance/AppearanceExample'),
|
|
},
|
|
{
|
|
key: 'AppStateExample',
|
|
module: require('../examples/AppState/AppStateExample'),
|
|
},
|
|
{
|
|
key: 'BorderExample',
|
|
module: require('../examples/Border/BorderExample'),
|
|
},
|
|
{
|
|
key: 'ClipboardExample',
|
|
module: require('../examples/Clipboard/ClipboardExample'),
|
|
},
|
|
{
|
|
key: 'CrashExample',
|
|
module: require('../examples/Crash/CrashExample'),
|
|
},
|
|
{
|
|
key: 'DatePickerAndroidExample',
|
|
module: require('../examples/DatePicker/DatePickerAndroidExample'),
|
|
},
|
|
{
|
|
key: 'DevSettings',
|
|
module: require('../examples/DevSettings/DevSettingsExample'),
|
|
},
|
|
{
|
|
key: 'Dimensions',
|
|
module: require('../examples/Dimensions/DimensionsExample'),
|
|
},
|
|
{
|
|
key: 'LayoutEventsExample',
|
|
module: require('../examples/Layout/LayoutEventsExample'),
|
|
},
|
|
{
|
|
key: 'LinkingExample',
|
|
module: require('../examples/Linking/LinkingExample'),
|
|
},
|
|
{
|
|
key: 'LayoutAnimationExample',
|
|
module: require('../examples/Layout/LayoutAnimationExample'),
|
|
},
|
|
{
|
|
key: 'LayoutExample',
|
|
module: require('../examples/Layout/LayoutExample'),
|
|
},
|
|
{
|
|
key: 'NativeAnimationsExample',
|
|
module: require('../examples/NativeAnimation/NativeAnimationsExample'),
|
|
},
|
|
{
|
|
key: 'OrientationChangeExample',
|
|
module: require('../examples/OrientationChange/OrientationChangeExample'),
|
|
},
|
|
{
|
|
key: 'PanResponderExample',
|
|
module: require('../examples/PanResponder/PanResponderExample'),
|
|
},
|
|
{
|
|
key: 'PermissionsExampleAndroid',
|
|
module: require('../examples/PermissionsAndroid/PermissionsExample'),
|
|
},
|
|
{
|
|
key: 'PointerEventsExample',
|
|
module: require('../examples/PointerEvents/PointerEventsExample'),
|
|
},
|
|
{
|
|
key: 'RTLExample',
|
|
module: require('../examples/RTL/RTLExample'),
|
|
},
|
|
{
|
|
key: 'ShareExample',
|
|
module: require('../examples/Share/ShareExample'),
|
|
},
|
|
{
|
|
key: 'TimerExample',
|
|
module: require('../examples/Timer/TimerExample'),
|
|
},
|
|
{
|
|
key: 'ToastAndroidExample',
|
|
module: require('../examples/ToastAndroid/ToastAndroidExample'),
|
|
},
|
|
{
|
|
key: 'TransformExample',
|
|
module: require('../examples/Transform/TransformExample'),
|
|
},
|
|
{
|
|
key: 'VibrationExample',
|
|
module: require('../examples/Vibration/VibrationExample'),
|
|
},
|
|
{
|
|
key: 'WebSocketExample',
|
|
module: require('../examples/WebSocket/WebSocketExample'),
|
|
},
|
|
{
|
|
key: 'XHRExample',
|
|
module: require('../examples/XHR/XHRExample'),
|
|
},
|
|
];
|
|
|
|
const Modules: any = {};
|
|
|
|
APIExamples.concat(ComponentExamples).forEach(Example => {
|
|
Modules[Example.key] = Example.module;
|
|
});
|
|
|
|
const RNTesterList = {
|
|
APIExamples,
|
|
ComponentExamples,
|
|
Modules,
|
|
};
|
|
|
|
module.exports = RNTesterList;
|