1 | import * as React from "react";
|
2 | import { Boundary, Props } from "../../common";
|
3 | export interface OverflowListProps<T> extends Props {
|
4 | /**
|
5 | * Whether to force the overflowRenderer to always be called, even if there are zero items
|
6 | * overflowing. This may be useful, for example, if your overflow renderer contains a Popover
|
7 | * which you do not want to close as the list is resized.
|
8 | *
|
9 | * @default false
|
10 | */
|
11 | alwaysRenderOverflow?: boolean;
|
12 | /**
|
13 | * Which direction the items should collapse from: start or end of the
|
14 | * children. This also determines whether `overflowRenderer` appears before
|
15 | * (`START`) or after (`END`) the visible items.
|
16 | *
|
17 | * @default Boundary.START
|
18 | */
|
19 | collapseFrom?: Boundary;
|
20 | /**
|
21 | * All items to display in the list. Items that do not fit in the container
|
22 | * will be rendered in the overflow instead.
|
23 | */
|
24 | items: readonly T[];
|
25 | /**
|
26 | * The minimum number of visible items that should never collapse into the
|
27 | * overflow menu, regardless of DOM dimensions.
|
28 | *
|
29 | * @default 0
|
30 | */
|
31 | minVisibleItems?: number;
|
32 | /**
|
33 | * If `true`, all parent DOM elements of the container will also be
|
34 | * observed. If changes to a parent's size is detected, the overflow will be
|
35 | * recalculated.
|
36 | *
|
37 | * Only enable this prop if the overflow should be recalculated when a
|
38 | * parent element resizes in a way that does not also cause the
|
39 | * `OverflowList` to resize.
|
40 | *
|
41 | * @default false
|
42 | */
|
43 | observeParents?: boolean;
|
44 | /**
|
45 | * Callback invoked when the overflowed items change. This is called once
|
46 | * after the DOM has settled, rather that on every intermediate change. It
|
47 | * is not invoked if resizing produces an unchanged overflow state.
|
48 | */
|
49 | onOverflow?: (overflowItems: T[]) => void;
|
50 | /**
|
51 | * Callback invoked to render the overflowed items. Unlike
|
52 | * `visibleItemRenderer`, this prop is invoked once with all items that do
|
53 | * not fit in the container.
|
54 | *
|
55 | * Typical use cases for this prop will put overflowed items in a dropdown
|
56 | * menu or display a "+X items" label.
|
57 | */
|
58 | overflowRenderer: (overflowItems: T[]) => React.ReactNode;
|
59 | /** CSS properties to apply to the root element. */
|
60 | style?: React.CSSProperties;
|
61 | /**
|
62 | * HTML tag name for the container element.
|
63 | *
|
64 | * @default "div"
|
65 | */
|
66 | tagName?: keyof JSX.IntrinsicElements;
|
67 | /**
|
68 | * Callback invoked to render each visible item.
|
69 | * Remember to set a `key` on the rendered element!
|
70 | */
|
71 | visibleItemRenderer: (item: T, index: number) => React.ReactChild;
|
72 | }
|
73 | export interface OverflowListState<T> {
|
74 | /** Whether repartitioning is still active. An overflow can take several frames to settle. */
|
75 | repartitioning: boolean;
|
76 | /** Length of last overflow to dedupe `onOverflow` calls during smooth resizing. */
|
77 | lastOverflowCount: number;
|
78 | overflow: readonly T[];
|
79 | visible: readonly T[];
|
80 | /** Pointer for the binary search algorithm used to find the finished non-overflowing state */
|
81 | chopSize: number;
|
82 | lastChopSize: number | null;
|
83 | }
|
84 | /**
|
85 | * Overflow list component.
|
86 | *
|
87 | * @see https://blueprintjs.com/docs/#core/components/overflow-list
|
88 | */
|
89 | export declare class OverflowList<T> extends React.Component<OverflowListProps<T>, OverflowListState<T>> {
|
90 | static displayName: string;
|
91 | static defaultProps: Partial<OverflowListProps<any>>;
|
92 | static ofType<U>(): new (props: OverflowListProps<U>) => OverflowList<U>;
|
93 | state: OverflowListState<T>;
|
94 | private spacer;
|
95 | componentDidMount(): void;
|
96 | shouldComponentUpdate(nextProps: OverflowListProps<T>, nextState: OverflowListState<T>): boolean;
|
97 | componentDidUpdate(prevProps: OverflowListProps<T>, prevState: OverflowListState<T>): void;
|
98 | render(): JSX.Element;
|
99 | private maybeRenderOverflow;
|
100 | private resize;
|
101 | private repartition;
|
102 | private defaultChopSize;
|
103 | private isFirstPartitionCycle;
|
104 | }
|