UNPKG

office-ui-fabric-react

Version:

Reusable React components for building experiences for Office 365.

1 lines 3.31 kB
define([], function() { return "import * as React from 'react';\r\nimport { Callout } from './Callout';\r\nimport { CalloutContent } from './CalloutContent';\r\nimport { DirectionalHint } from '../../common/DirectionalHint';\r\nimport { IRectangle } from '../../common/IRectangle';\r\nimport { IPoint } from '../../common/IPoint';\r\n\r\nexport interface ICalloutProps extends React.Props<Callout | CalloutContent> {\r\n\r\n /**\r\n * The target that the Callout should try to position itself based on.\r\n * It can be either an HTMLElement a querySelector string of a valid HTMLElement\r\n * or a MouseEvent. If MouseEvent is given then the origin point of the event will be used.\r\n */\r\n target?: HTMLElement | string | MouseEvent;\r\n\r\n /**\r\n * The element that the Callout should be positioned based on.\r\n * @deprecated at version 0.72.1 and will no longer exist after 1.0 use target instead\r\n */\r\n targetElement?: HTMLElement;\r\n\r\n /**\r\n * How the element should be positioned\r\n * @default DirectionalHint.BottomAutoEdge\r\n */\r\n directionalHint?: DirectionalHint;\r\n\r\n /**\r\n * The gap between the Callout and the target\r\n * @default 16\r\n */\r\n gapSpace?: number;\r\n\r\n /**\r\n * The width of the beak.\r\n * @default 16\r\n */\r\n beakWidth?: number;\r\n\r\n /**\r\n * The bounding rectangle for which the contextual menu can appear in.\r\n */\r\n bounds?: IRectangle;\r\n\r\n /**\r\n * If true use a point rather than rectangle to position the Callout.\r\n * For example it can be used to position based on a click.\r\n */\r\n useTargetPoint?: boolean;\r\n\r\n /**\r\n * Point used to position the Callout\r\n */\r\n targetPoint?: IPoint;\r\n\r\n /**\r\n * If true then the beak is visible. If false it will not be shown.\r\n * @default false\r\n */\r\n isBeakVisible?: boolean;\r\n\r\n /**\r\n * If true the position returned will have the menu element cover the target.\r\n * If false then it will position next to the target;\r\n * @default false\r\n */\r\n coverTarget?: boolean;\r\n\r\n /**\r\n * @deprecated\r\n * Deprecated at v0.59.1, to be removed at >= v1.0.0. Pass in a beakWidth to dictate size.\r\n */\r\n beakStyle?: string;\r\n\r\n /**\r\n * CSS class to apply to the callout.\r\n * @default null\r\n */\r\n className?: string;\r\n\r\n /**\r\n * Optional callback when the layer content has mounted.\r\n */\r\n onLayerMounted?: () => void;\r\n\r\n /**\r\n * Optional callback that is called once the callout has been correctly positioned.\r\n */\r\n onPositioned?: () => void;\r\n\r\n /**\r\n * Callback when the Callout tries to close.\r\n */\r\n onDismiss?: (ev?: any) => void;\r\n\r\n /**\r\n * If true do not render on a new layer. If false render on a new layer.\r\n */\r\n doNotLayer?: boolean;\r\n\r\n /**\r\n * If true then the callout will attempt to focus the first focusable element that it contains.\r\n * If it doesn't find an element, no focus will be set and the method will return false.\r\n * This means that it's the contents responsibility to either set focus or have\r\n * focusable items.\r\n * @returns True if focus was set, false if it was not.\r\n */\r\n setInitialFocus?: boolean;\r\n}\r\n"; });