lucid-ui
Version:
A UI component library from Xandr.
102 lines • 4.01 kB
TypeScript
import React from 'react';
import PropTypes from 'prop-types';
import { StandardProps, Overwrite } from '../../util/component-types';
export interface IDragCaptureZonePropsRaw extends StandardProps {
/** Called as the user drags the mouse. */
onDrag: ({ dX, dY, pageX, pageY, }: {
dX: number;
dY: number;
pageX: number;
pageY: number;
}, { event, props, }: {
event: MouseEvent | TouchEvent;
props: IDragCaptureZoneProps;
}) => void;
/** Called when the user releases the mouse button after having dragged. */
onDragEnd: ({ dX, dY, pageX, pageY, }: {
dX: number;
dY: number;
pageX: number;
pageY: number;
}, { event, props, }: {
event: MouseEvent | TouchEvent;
props: IDragCaptureZoneProps;
}) => void;
/** Called when the user presses the mouse button down while over the component. */
onDragStart: ({ dX, dY, pageX, pageY, }: {
dX: number;
dY: number;
pageX: number;
pageY: number;
}, { event, props, }: {
event: React.MouseEvent<HTMLDivElement, MouseEvent> | React.TouchEvent<HTMLDivElement>;
props: IDragCaptureZoneProps;
}) => void;
/** Called when the drag event is canceled due to user interaction.
* For example: if a system alert pops up during a touch event. */
onDragCancel: ({ event, props, }: {
event: MouseEvent | TouchEvent;
props: IDragCaptureZoneProps;
}) => void;
}
export declare type IDragCaptureZoneProps = Overwrite<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, IDragCaptureZonePropsRaw>;
interface IDragCaptureZoneState {
pageX: number;
pageY: number;
}
declare class DragCaptureZone extends React.Component<IDragCaptureZoneProps, IDragCaptureZoneState, {}> {
static displayName: string;
static peek: {
description: string;
categories: string[];
};
static propTypes: {
/**
Appended to the component-specific class names set on the root element.
*/
className: PropTypes.Requireable<string>;
/**
Called as the user drags the mouse. Signature:
\`({ dx, dy, pageX, pageY }, { event, props }) => {}\`
*/
onDrag: PropTypes.Requireable<(...args: any[]) => any>;
/**
Called when the user releases the mouse button after having dragged.
Signature: \`({ dx, dy, pageX, pageY }, { event, props }) => {}\`
*/
onDragEnd: PropTypes.Requireable<(...args: any[]) => any>;
/**
Called when the user presses the mouse button down while over the
component. Signature:
\`({ dx, dy, pageX, pageY }, { event, props }) => {}\`
*/
onDragStart: PropTypes.Requireable<(...args: any[]) => any>;
/**
Called when the drag event is canceled due to user interaction. For
example: if a system alert pops up during a touch event. Signature:
\`({ event, props }) => {}\`
*/
onDragCancel: PropTypes.Requireable<(...args: any[]) => any>;
};
private elementRef;
state: {
pageX: number;
pageY: number;
};
static defaultProps: {
onDrag: (...args: any[]) => void;
onDragEnd: (...args: any[]) => void;
onDragStart: (...args: any[]) => void;
onDragCancel: (...args: any[]) => void;
};
handleDrag: (event: MouseEvent | TouchEvent) => void;
handleMouseDragStart: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
handleTouchDragStart: (event: React.TouchEvent<HTMLDivElement>) => void;
handleDragEnd: (event: MouseEvent | TouchEvent) => void;
handleDragCancel: (event: MouseEvent | TouchEvent) => void;
componentDidMount(): void;
componentWillUnmount(): void;
render(): React.ReactNode;
}
export default DragCaptureZone;
//# sourceMappingURL=DragCaptureZone.d.ts.map