diff --git a/Libraries/Components/Button.flow.js b/Libraries/Components/Button.flow.js new file mode 100644 index 00000000000000..614c36af83f1e8 --- /dev/null +++ b/Libraries/Components/Button.flow.js @@ -0,0 +1,261 @@ +/** + * Copyright (c) Meta Platforms, Inc. and 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 + * @generate-docs + */ + +'use strict'; + +import * as React from 'react'; +import {type ColorValue} from '../StyleSheet/StyleSheet'; + +import type { + AccessibilityState, + AccessibilityActionEvent, + AccessibilityActionInfo, +} from './View/ViewAccessibility'; +import type {PressEvent} from '../Types/CoreEventTypes'; + +type ButtonProps = $ReadOnly<{| + /** + Text to display inside the button. On Android the given title will be + converted to the uppercased form. + */ + title: string, + + /** + Handler to be called when the user taps the button. The first function + argument is an event in form of [PressEvent](pressevent). + */ + onPress: (event?: PressEvent) => mixed, + + /** + If `true`, doesn't play system sound on touch. + + @platform android + + @default false + */ + touchSoundDisabled?: ?boolean, + + /** + Color of the text (iOS), or background color of the button (Android). + + @default {@platform android} '#2196F3' + @default {@platform ios} '#007AFF' + */ + color?: ?ColorValue, + + /** + TV preferred focus. + + @platform tv + + @default false + */ + hasTVPreferredFocus?: ?boolean, + + /** + Designates the next view to receive focus when the user navigates down. See + the [Android documentation][android:nextFocusDown]. + + [android:nextFocusDown]: + https://developer.android.com/reference/android/view/View.html#attr_android:nextFocusDown + + @platform android, tv + */ + nextFocusDown?: ?number, + + /** + Designates the next view to receive focus when the user navigates forward. + See the [Android documentation][android:nextFocusForward]. + + [android:nextFocusForward]: + https://developer.android.com/reference/android/view/View.html#attr_android:nextFocusForward + + @platform android, tv + */ + nextFocusForward?: ?number, + + /** + Designates the next view to receive focus when the user navigates left. See + the [Android documentation][android:nextFocusLeft]. + + [android:nextFocusLeft]: + https://developer.android.com/reference/android/view/View.html#attr_android:nextFocusLeft + + @platform android, tv + */ + nextFocusLeft?: ?number, + + /** + Designates the next view to receive focus when the user navigates right. See + the [Android documentation][android:nextFocusRight]. + + [android:nextFocusRight]: + https://developer.android.com/reference/android/view/View.html#attr_android:nextFocusRight + + @platform android, tv + */ + nextFocusRight?: ?number, + + /** + Designates the next view to receive focus when the user navigates up. See + the [Android documentation][android:nextFocusUp]. + + [android:nextFocusUp]: + https://developer.android.com/reference/android/view/View.html#attr_android:nextFocusUp + + @platform android, tv + */ + nextFocusUp?: ?number, + + /** + Text to display for blindness accessibility features. + */ + accessibilityLabel?: ?string, + + /** + If `true`, disable all interactions for this component. + + @default false + */ + disabled?: ?boolean, + + /** + Used to locate this view in end-to-end tests. + */ + testID?: ?string, + + /** + * Accessibility props. + */ + accessible?: ?boolean, + accessibilityActions?: ?$ReadOnlyArray, + onAccessibilityAction?: ?(event: AccessibilityActionEvent) => mixed, + accessibilityState?: ?AccessibilityState, + + /** + * [Android] Controlling if a view fires accessibility events and if it is reported to accessibility services. + */ + importantForAccessibility?: ?('auto' | 'yes' | 'no' | 'no-hide-descendants'), + accessibilityHint?: ?string, + accessibilityLanguage?: ?Stringish, +|}>; + +/** + A basic button component that should render nicely on any platform. Supports a + minimal level of customization. + + If this button doesn't look right for your app, you can build your own button + using [TouchableOpacity](touchableopacity) or + [TouchableWithoutFeedback](touchablewithoutfeedback). For inspiration, look at + the [source code for this button component][button:source]. Or, take a look at + the [wide variety of button components built by the community] + [button:examples]. + + [button:source]: + https://github.com/facebook/react-native/blob/HEAD/Libraries/Components/Button.js + + [button:examples]: + https://js.coach/?menu%5Bcollections%5D=React%20Native&page=1&query=button + + ```jsx +