import * as React from 'react'; import { StyleProp, Animated, LayoutRectangle, ViewStyle } from 'react-native'; import type { $Omit } from '../../types'; declare type Props = { /** * Whether the Menu is currently visible. */ visible: boolean; /** * The anchor to open the menu from. In most cases, it will be a button that opens the menu. */ anchor: React.ReactNode | { x: number; y: number; }; /** * Extra margin to add at the top of the menu to account for translucent status bar on Android. * If you are using Expo, we assume translucent status bar and set a height for status bar automatically. * Pass `0` or a custom value to and customize it. * This is automatically handled on iOS. */ statusBarHeight?: number; /** * Callback called when Menu is dismissed. The `visible` prop needs to be updated when this is called. */ onDismiss: () => void; /** * Accessibility label for the overlay. This is read by the screen reader when the user taps outside the menu. */ overlayAccessibilityLabel?: string; /** * Content of the `Menu`. */ children: React.ReactNode; /** * Style of menu's inner content. */ contentStyle?: StyleProp; style?: StyleProp; /** * @optional */ theme: ReactNativePaper.Theme; }; declare type Layout = $Omit<$Omit, 'y'>; declare type State = { rendered: boolean; top: number; left: number; menuLayout: Layout; anchorLayout: Layout; opacityAnimation: Animated.Value; scaleAnimation: Animated.ValueXY; }; /** * Menus display a list of choices on temporary elevated surfaces. Their placement varies based on the element that opens them. * *
* * *
* * ## Usage * ```js * import * as React from 'react'; * import { View } from 'react-native'; * import { Button, Menu, Divider, Provider } from 'react-native-paper'; * * const MyComponent = () => { * const [visible, setVisible] = React.useState(false); * * const openMenu = () => setVisible(true); * * const closeMenu = () => setVisible(false); * * return ( * * * Show menu}> * {}} title="Item 1" /> * {}} title="Item 2" /> * * {}} title="Item 3" /> * * * * ); * }; * * export default MyComponent; * ``` */ declare class Menu extends React.Component { static Item: React.ComponentType void) | undefined; style?: StyleProp; contentStyle?: StyleProp; /** * Extra margin to add at the top of the menu to account for translucent status bar on Android. * If you are using Expo, we assume translucent status bar and set a height for status bar automatically. * Pass `0` or a custom value to and customize it. * This is automatically handled on iOS. */ titleStyle?: StyleProp; theme: ReactNativePaper.Theme; testID?: string | undefined; accessibilityLabel?: string | undefined; }, "style" | "title" | "onPress" | "testID" | "accessibilityLabel" | "icon" | "disabled" | "titleStyle" | "contentStyle"> & { theme?: import("@callstack/react-theme-provider").$DeepPartial | undefined; }> & import("@callstack/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics void) | undefined; style?: StyleProp; contentStyle?: StyleProp; /** * Extra margin to add at the top of the menu to account for translucent status bar on Android. * If you are using Expo, we assume translucent status bar and set a height for status bar automatically. * Pass `0` or a custom value to and customize it. * This is automatically handled on iOS. */ titleStyle?: StyleProp; theme: ReactNativePaper.Theme; testID?: string | undefined; accessibilityLabel?: string | undefined; }> & { ({ icon, title, disabled, onPress, style, contentStyle, testID, titleStyle, accessibilityLabel, theme, }: { title: React.ReactNode; icon?: import("../Icon").IconSource | undefined; disabled?: boolean | undefined; onPress?: (() => void) | undefined; style?: StyleProp; contentStyle?: StyleProp; /** * Extra margin to add at the top of the menu to account for translucent status bar on Android. * If you are using Expo, we assume translucent status bar and set a height for status bar automatically. * Pass `0` or a custom value to and customize it. * This is automatically handled on iOS. */ titleStyle?: StyleProp; theme: ReactNativePaper.Theme; testID?: string | undefined; accessibilityLabel?: string | undefined; }): JSX.Element; displayName: string; }, {}>; static defaultProps: { statusBarHeight: any; overlayAccessibilityLabel: string; }; static getDerivedStateFromProps(nextProps: Props, prevState: State): { rendered: boolean; } | null; state: { rendered: boolean; top: number; left: number; menuLayout: { width: number; height: number; }; anchorLayout: { width: number; height: number; }; opacityAnimation: Animated.Value; scaleAnimation: Animated.ValueXY; }; componentDidUpdate(prevProps: Props): void; componentWillUnmount(): void; private anchor?; private menu?; private backHandlerSubscription; private dimensionsSubscription; private isCoordinate; private measureMenuLayout; private measureAnchorLayout; private updateVisibility; private isBrowser; private focusFirstDOMNode; private handleDismiss; private handleKeypress; private attachListeners; private removeListeners; private show; private hide; render(): JSX.Element; } declare const _default: React.ComponentType & { theme?: import("@callstack/react-theme-provider").$DeepPartial | undefined; }> & import("@callstack/react-theme-provider/typings/hoist-non-react-statics").NonReactStatics & typeof Menu, {}>; export default _default;