UNPKG

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