@wordpress/components
Version:
UI components for WordPress.
75 lines • 1.85 kB
TypeScript
/**
* External dependencies
*/
import type { PopoverStateReturn } from 'reakit';
import type { CSSProperties, FunctionComponentElement, ReactNode } from 'react';
/**
* Internal dependencies
*/
import type { PopperProps } from '../utils/types';
export declare type PopoverContext = {
popover?: PopoverStateReturn;
label?: string;
};
export declare type Props = PopperProps & {
state?: PopoverStateReturn;
label?: string;
/**
* Determines if `Popover` has animations.
*/
animated?: boolean;
/**
* The duration of `Popover` animations.
*
* @default 160
*/
animationDuration?: boolean;
/**
* ID that will serve as a base for all the items IDs.
*
* @see https://reakit.io/docs/popover/#usepopoverstate
*/
baseId?: string;
/**
* Content to render within the `Popover` floating label.
*/
content?: ReactNode;
/**
* Renders `Elevation` styles for the `Popover`.
*
* @default 5
*/
elevation?: number;
/**
* Max-width for the `Popover` element.
*/
maxWidth?: CSSProperties['maxWidth'];
/**
* Callback for when the `visible` state changes.
*/
onVisibleChange?: (...args: any) => void;
/**
* Element that triggers the `visible` state of `Popover` when clicked.
*
* @example
* ```jsx
* <Popover trigger={<Button>Greet</Button>}>
* <Text>Hi! I'm Olaf!</Text>
* </Popover>
* ```
*/
trigger: FunctionComponentElement<any>;
/**
* Whether `Popover` is visible.
*
* @default false
*
* @see https://reakit.io/docs/popover/#usepopoverstate
*/
visible?: boolean;
};
export declare type ContentProps = {
elevation?: number;
maxWidth?: CSSProperties['maxWidth'];
};
//# sourceMappingURL=types.d.ts.map