import { Component, CSSProperties, HTMLAttributes, LegacyRef, MouseEvent, MouseEventHandler, ReactNode, TouchEvent, TouchEventHandler } from 'react'; import { defaultItemRenderer } from './defaultItemRenderer'; import { Id, ItemContext, TimelineItemBase, TimelineKeys } from '../types/main'; import { TimelineContextType } from '../timeline/TimelineStateContext'; export type ResizeEdge = 'left' | 'right'; type OnSelect = (itemId: string | null, clickType: 'click' | 'touch', event: MouseEvent | TouchEvent) => void; export type ItemProps> = { canvasTimeStart: number; canvasTimeEnd: number; canvasWidth: number; minResizeWidth?: number; order: { index: number; }; dragSnap?: number; itemProps?: HTMLAttributes; onDrag: (itemId: string, dragTime: number, newGroupOrder: number) => void; onDrop: (itemId: string, dragTime: number, newGroupOrder: number) => void; onResizing: (itemId: string, time: number, resizeEdge: ResizeEdge | null) => void; onResized: (itemId: string, time: number, resizeEdge: ResizeEdge | null, delta: number) => void; moveResizeValidator?: (action: 'move' | 'resize', item: TimelineItemBase, time: number, resizeEdge?: ResizeEdge | null) => number; itemRenderer?: (props: ItemRendererProps) => ReactNode; selected: boolean; canChangeGroup?: boolean; canMove?: boolean; canSelect?: boolean; dimensions?: ItemContext['dimensions']; useResizeHandle?: boolean; canResizeLeft: any; canResizeRight: any; keys: TimelineKeys; item: CustomItem; onSelect: OnSelect; onContextMenu?: (i: Id, e: MouseEvent) => void; groupTops: any; onItemDoubleClick: (i: Id, e: MouseEvent) => void; scrollRef: HTMLElement | null; }; type DragProps = { offset: number; x: number; y: number; }; interface ItemState { interactMounted: boolean; dragging: boolean; dragStart: null | DragProps; preDragPosition: { x: number; y: number; } | null; dragTime: null | number; dragGroupDelta: null | number; resizing: boolean; resizeEdge: null | 'left' | 'right'; resizeStart: null | number; resizeTime: null | number; } export type GetItemPropsParams = HTMLAttributes & { leftClassName?: string; rightClassName?: string; leftStyle?: CSSProperties; rightStyle?: CSSProperties; }; export interface ItemRendererProps> { item: CustomItem; timelineContext: TimelineContextType; itemContext: ItemContext; getItemProps: (params: GetItemPropsParams) => HTMLAttributes & { key: string; ref: LegacyRef; }; getResizeProps: GetResizeProps; } type GetResizePropsDirection = { ref: LegacyRef; className: string; style: CSSProperties; }; export type GetResizeProps = (params?: GetItemPropsParams) => { right: GetResizePropsDirection; left: GetResizePropsDirection; }; export default class Item> extends Component, ItemState> { static defaultProps: { selected: boolean; itemRenderer: typeof defaultItemRenderer; }; context: TimelineContextType; static contextType: import("react").Context; state: ItemState; private itemId; private itemTitle; private itemDivTitle?; private itemTimeStart?; private itemTimeEnd?; private itemRef; private dragLeft?; private dragRight?; private startedClicking; private startedTouching; private dragInProgress; constructor(props: ItemProps); shouldComponentUpdate(nextProps: ItemProps, nextState: ItemState): boolean; cacheDataFromProps(props: ItemProps): void; getTimeRatio(): number; dragTimeSnap(dragTime: number, considerOffset?: boolean): number; resizeTimeSnap(dragTime: number): number; dragTime(e: MouseEvent): number; timeFor(e: MouseEvent): number; dragGroupDelta(e: MouseEvent): number; resizeTimeDelta(e: MouseEvent, resizeEdge: ResizeEdge | null): number; mountInteract(): void; canResizeLeft(props?: Readonly>): boolean; canResizeRight(props?: Readonly>): boolean; canMove(props?: Readonly>): boolean; fireInteractEvent: (itemInteraction: boolean) => void; componentDidUpdate(prevProps: ItemProps): void; onMouseDown: MouseEventHandler; onMouseUp: MouseEventHandler; onTouchStart: TouchEventHandler; onTouchEnd: TouchEventHandler; handleDoubleClick: MouseEventHandler; handleContextMenu: MouseEventHandler; actualClick(e: MouseEvent | TouchEvent, clickType: 'click' | 'touch'): void; getDragLeftRef: (el: HTMLElement) => HTMLElement; getDragRightRef: (el: HTMLElement) => HTMLElement; getItemProps: (props?: GetItemPropsParams) => { key: string; ref: import("react").RefObject; title: string | undefined; className: string; onMouseDown: (event: MouseEvent, ...args: any) => void; onMouseUp: (event: MouseEvent, ...args: any) => void; onTouchStart: (event: TouchEvent, ...args: any) => void; onTouchEnd: (event: TouchEvent, ...args: any) => void; onDoubleClick: (event: MouseEvent, ...args: any) => void; onContextMenu: (event: MouseEvent, ...args: any) => void; style: any; }; getResizeProps: (props?: GetItemPropsParams) => ReturnType; getItemStyle(props: GetItemPropsParams): any; render(): string | number | boolean | Iterable | import("react/jsx-runtime").JSX.Element | null | undefined; } export {};