office-ui-fabric-react
Version:
Reusable React components for building experiences for Office 365.
54 lines (53 loc) • 2.09 kB
TypeScript
/// <reference types="react" />
import { BaseComponent, IPoint, IRectangle } from '../../Utilities';
import { IMarqueeSelectionProps } from './MarqueeSelection.types';
export interface IMarqueeSelectionState {
dragOrigin?: IPoint;
dragRect?: IRectangle;
}
/**
* MarqueeSelection component abstracts managing a draggable rectangle which sets items selected/not selected.
* Elements which have data-selectable-index attributes are queried and measured once to determine if they
* fall within the bounds of the rectangle. The measure is memoized during the drag as a performance optimization
* so if the items change sizes while dragging, that could cause incorrect results.
*/
export declare class MarqueeSelection extends BaseComponent<IMarqueeSelectionProps, IMarqueeSelectionState> {
static defaultProps: {
rootTagName: string;
rootProps: {};
isEnabled: boolean;
};
private _root;
private _dragOrigin;
private _rootRect;
private _lastMouseEvent;
private _autoScroll;
private _selectedIndicies;
private _preservedIndicies;
private _itemRectCache;
private _scrollableParent;
private _scrollableSurface;
private _scrollTop;
private _isTouch;
constructor(props: IMarqueeSelectionProps);
componentDidMount(): void;
componentWillUnmount(): void;
render(): JSX.Element;
/** Determine if the mouse event occured on a scrollbar of the target element. */
private _isMouseEventOnScrollbar(ev);
private _onMouseDown(ev);
private _onTouchStart(ev);
private _onPointerDown(ev);
private _getRootRect();
private _onAsyncMouseMove(ev);
private _onMouseMove(ev);
private _onMouseUp(ev);
private _isPointInRectangle(rectangle, point);
/**
* We do not want to start the marquee if we're trying to marquee
* from within an existing marquee selection.
*/
private _isDragStartInSelection(ev);
private _isInSelectionToggle(ev);
private _evaluateSelection(dragRect, rootRect);
}