office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
64 lines (63 loc) • 2.4 kB
TypeScript
/// <reference types="react" />
import * as React from 'react';
import { ISelection } from '../../utilities/selection/interfaces';
import { ITheme, IStyle } from '../../Styling';
import { IRefObject, IStyleFunction } from '../../Utilities';
export interface IMarqueeSelection {
}
export interface IMarqueeSelectionProps extends React.HTMLAttributes<HTMLDivElement> {
/**
* Optional callback to access the IMarqueeSelection interface. Use this instead of ref for accessing
* the public methods and properties of the component.
*/
componentRef?: IRefObject<IMarqueeSelection>;
/**
* The selection object to interact with when updating selection changes.
*/
selection: ISelection;
/**
* Optional props to mix into the root DIV element.
*/
rootProps?: React.HTMLAttributes<HTMLDivElement>;
/**
* Optional callback that is called, when the mouse down event occurs, in order to determine
* if we should start a marquee selection. If true is returned, we will cancel the mousedown
* event to prevent upstream mousedown handlers from executing.
*/
onShouldStartSelection?: (ev: MouseEvent) => boolean;
/**
* Optional flag to control the enabled state of marquee selection. This allows you to render
* it and have events all ready to go, but conditionally disable it. That way transitioning
* between enabled/disabled generate no difference in the DOM.
* @default true
*/
isEnabled?: boolean;
/**
* Optional flag to restrict the drag rect to the root element, instead of allowing the drag
* rect to start outside of the root element boundaries.
* @default false
*/
isDraggingConstrainedToRoot?: boolean;
/**
* Additional CSS class(es) to apply to the MarqueeSelection.
*/
className?: string;
/**
* Theme (provided through customization.)
*/
theme?: ITheme;
/**
* Call to provide customized styling that will layer on top of the variant rules.
*/
styles?: IStyleFunction<IMarqueeSelectionStyleProps, IMarqueeSelectionStyles>;
}
export interface IMarqueeSelectionStyleProps {
theme: ITheme;
className?: string;
}
export interface IMarqueeSelectionStyles {
root?: IStyle;
dragMask?: IStyle;
box?: IStyle;
boxFill?: IStyle;
}