UNPKG

3.48 kBTypeScriptView Raw
1import * as React from 'react';
2import { PickOptional } from '../../helpers/typeUtils';
3export declare enum DataListWrapModifier {
4 nowrap = "nowrap",
5 truncate = "truncate",
6 breakWord = "breakWord"
7}
8export interface DataListProps extends Omit<React.HTMLProps<HTMLUListElement>, 'onDragStart' | 'ref'> {
9 /** Content rendered inside the DataList list */
10 children?: React.ReactNode;
11 /** Additional classes added to the DataList list */
12 className?: string;
13 /** Adds accessible text to the DataList list */
14 'aria-label': string;
15 /** Optional callback to make DataList selectable, fired when DataListItem selected */
16 onSelectDataListItem?: (id: string) => void;
17 /** @deprecated Optional callback to make DataList draggable, fired when dragging ends */
18 onDragFinish?: (newItemOrder: string[]) => void;
19 /** @deprecated Optional informational callback for dragging, fired when dragging starts */
20 onDragStart?: (id: string) => void;
21 /** @deprecated Optional informational callback for dragging, fired when an item moves */
22 onDragMove?: (oldIndex: number, newIndex: number) => void;
23 /** @deprecated Optional informational callback for dragging, fired when dragging is cancelled */
24 onDragCancel?: () => void;
25 /** Id of DataList item currently selected */
26 selectedDataListItemId?: string;
27 /** Flag indicating if DataList should have compact styling */
28 isCompact?: boolean;
29 /** Specifies the grid breakpoints */
30 gridBreakpoint?: 'none' | 'always' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
31 /** Determines which wrapping modifier to apply to the DataList */
32 wrapModifier?: DataListWrapModifier | 'nowrap' | 'truncate' | 'breakWord';
33 /** @deprecated Order of items in a draggable DataList */
34 itemOrder?: string[];
35}
36interface DataListState {
37 draggedItemId: string;
38 draggingToItemIndex: number;
39 dragging: boolean;
40 tempItemOrder: string[];
41}
42interface DataListContextProps {
43 isSelectable: boolean;
44 selectedDataListItemId: string;
45 updateSelectedDataListItem: (id: string) => void;
46 isDraggable: boolean;
47 dragStart: (e: React.DragEvent) => void;
48 dragEnd: (e: React.DragEvent) => void;
49 drop: (e: React.DragEvent) => void;
50 dragKeyHandler: (e: React.KeyboardEvent) => void;
51}
52export declare const DataListContext: React.Context<Partial<DataListContextProps>>;
53export declare class DataList extends React.Component<DataListProps, DataListState> {
54 static displayName: string;
55 static defaultProps: PickOptional<DataListProps>;
56 dragFinished: boolean;
57 html5DragDrop: boolean;
58 arrayCopy: React.ReactElement[];
59 ref: React.RefObject<HTMLUListElement>;
60 state: DataListState;
61 constructor(props: DataListProps);
62 componentDidUpdate(oldProps: DataListProps): void;
63 getIndex: (id: string) => number;
64 move: (itemOrder: string[]) => void;
65 dragStart0: (el: HTMLElement) => void;
66 dragStart: (evt: React.DragEvent) => void;
67 onDragCancel: () => void;
68 dragLeave: (evt: React.DragEvent) => void;
69 dragEnd0: (el: HTMLElement) => void;
70 dragEnd: (evt: React.DragEvent) => void;
71 isValidDrop: (evt: React.DragEvent) => boolean;
72 drop: (evt: React.DragEvent) => void;
73 dragOver0: (id: string) => void;
74 dragOver: (evt: React.DragEvent) => string | null;
75 handleDragButtonKeys: (evt: React.KeyboardEvent) => void;
76 render(): JSX.Element;
77}
78export {};
79//# sourceMappingURL=DataList.d.ts.map
\No newline at end of file