import React, { type ComponentProps } from 'react';
import type { CommonComponentProps, MarginModifierProp, ModifierClassProp } from '../types';
import type { GetRef } from '../utils/refs';
import type { BuiltInTooltipConfig } from './tooltip/types';
import { Chip } from './chip';
type FilterBase = {
    id: string;
    title: string;
};
/**
 * A compound component that displays a labeled group of removable filter chips.
 * Combines a tooltip-enabled label with a list of interactive or static chips.
 *
 * ## Purpose
 * Designed for filtering interfaces where users need to see applied filters
 * and optionally remove them. The component provides visual grouping with
 * a descriptive label and consistent chip styling.
 *
 * ## Type Safety
 * The component automatically infers the filter type from the `filters` prop
 * while ensuring each filter has required `id` and `title` properties for proper
 * rendering and key management. The full filter type is preserved in callbacks.
 *
 * ## Interaction Modes
 *
 * **Static Mode**: When `onRemoveFilterChip` is not provided, chips are
 * display-only with no interaction capabilities.
 *
 * **Interactive Mode**: When `onRemoveFilterChip` is provided, each chip
 * becomes clickable with a remove icon, hover states, and proper button
 * semantics. The `chipsDisabled` prop can temporarily disable interactions.
 *
 * ## Chip Behavior
 * All chips inherit the modern variant styling and use consistent colors
 * (gray-50 background, gray-800 text). Individual chip truncation and
 * tooltips are controlled via `chipMaxCharacters` and `chipTooltipConfig`.
 *
 * @example
 * ```tsx
 * // Static display mode
 * <FilterChip
 *   label="Applied Filters"
 *   icon={<FilterIcon />}
 *   filters={[
 *     { id: '1', title: 'Active Users' },
 *     { id: '2', title: 'Last 30 Days' }
 *   ]}
 *   tooltipConfig={{ tooltipContent: "Current filter criteria" }}
 *   getRef={containerRef}
 * />
 *
 * // Interactive mode with removal
 * <FilterChip
 *   label="Active Filters"
 *   filters={appliedFilters}
 *   onRemoveFilterChip={(filter) => removeFilter(filter.id)}
 *   chipsDisabled={isLoading}
 *   chipMaxCharacters={25}
 *   tooltipConfig={{ tooltipContent: "Click chips to remove" }}
 *   getRef={containerRef}
 * />
 * ```
 */
interface FilterChipProps<T extends FilterBase = FilterBase> extends CommonComponentProps, MarginModifierProp, ModifierClassProp {
    chipMaxCharacters?: ComponentProps<typeof Chip>['maxCharacters'];
    chipTooltipConfig?: ComponentProps<typeof Chip>['tooltipConfig'];
    chipsDisabled?: boolean;
    filters: T[];
    getRef: GetRef<HTMLDivElement>;
    icon?: React.ReactNode;
    label: string;
    onRemoveFilterChip?: (filter: T, event: React.MouseEvent) => unknown;
    tooltipConfig: BuiltInTooltipConfig;
}
export declare function FilterChip<T extends FilterBase = FilterBase>({ _modifierClass, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledby, 'aria-describedby': ariaDescribedby, chipMaxCharacters, chipTooltipConfig, chipsDisabled, filters, getRef, icon, label, margin, onRemoveFilterChip, tooltipConfig, ...rest }: FilterChipProps<T>): React.JSX.Element;
export {};