@gravity-ui/uikit/build/cjs/hooks/useCollapseChildren/useCollapseChildren.d.ts

Gravity UI base styling and components

import * as React from 'react';
export interface UseCollapseChildrenProps {
    /**
     * Whether the hook is enabled
     * @default true
     */
    enabled?: boolean;
    /**
     * React ref for the container element
     */
    containerRef: React.RefObject<HTMLElement | null>;
    /**
     * React refs for elements that should not participate in calculation
     */
    preservedRefs?: Array<React.RefObject<HTMLElement | null>>;
    /**
     * The minimum count of items to be visible
     * @default 0
     */
    minCount?: number;
    /**
     * The maximum count of items to be visible
     * @default Infinity
     */
    maxCount?: number;
    /**
     * Collapse direction of items
     * @default 'end'
     */
    direction?: 'start' | 'end';
    /**
     * The distance between items
     * @default 0
     */
    gap?: number;
    /**
     * CSS-selector to pick child items in the container
     * @default '*'
     */
    childSelector?: string;
    /**
     * Custom measure function of item's width
     * @param child HTMLElement
     * @returns number
     */
    getChildWidth?: (child: HTMLElement) => number;
}
export interface UseCollapseChildrenResult {
    /**
     * Whether calculation is complete.
     * Your items should be in measurable state when it's not calculated.
     */
    calculated: boolean;
    /**
     * Trigger recalculation manually.
     */
    recalculate: () => void;
    /**
     * Number of items that can be visible in the container, excluding preserved items.
     */
    visibleCount: number;
}
export declare function useCollapseChildren({ enabled, containerRef, preservedRefs, minCount, maxCount, direction, gap, childSelector, getChildWidth, }: UseCollapseChildrenProps): UseCollapseChildrenResult;