import React from 'react';
import { type AriaTagGroupProps } from 'react-aria';
import { Item } from '@react-stately/collections';
import type { Key } from '@react-types/shared';
export type TagGroupSize = 'sm' | 'md';
export interface TagGroupProps<T extends object> extends Omit<AriaTagGroupProps<T>, 'selectionMode' | 'selectionBehavior' | 'selectedKeys' | 'defaultSelectedKeys' | 'onSelectionChange' | 'disallowEmptySelection' | 'shouldSelectOnPressUp' | 'escapeKeyBehavior' | 'onAction' | 'errorMessage'> {
    /**
     * Called with the keys of the tags to remove — from a tag's × button, or
     * Delete / Backspace on a focused tag. Pass it and every tag shows a remove
     * button; leave it out and the tags are read-only labels. The group does
     * not remove anything itself: drop the keys from your own list.
     */
    onRemove?: (keys: Set<Key>) => void;
    /** Figma's `Size`. Set once here, so every tag in a group matches. */
    size?: TagGroupSize;
    /**
     * Shown in place of the tags when there are none — "No filters applied".
     * Without it an empty group renders nothing but its label.
     */
    emptyLabel?: React.ReactNode;
    className?: string;
}
/**
 * TagGroup — labels a person applied and can take away: active filters, the
 * labels on a record, the recipients of a message.
 *
 * NOT A BADGE
 *
 * A Badge reports a state the system decided — Failing, Paid. A Tag is a
 * choice someone made, which is why it is removable and why it is neutral:
 * colouring tags by intent would make "Status: Failing" as a filter look like
 * the agent is failing.
 *
 * WHAT REACT ARIA GIVES IT
 *
 * `useTagGroup` makes the group one tab stop with arrow keys between tags, a
 * remove button per tag named "Remove <tag>", and Delete / Backspace to remove
 * the focused one. When a tag goes, focus moves to its neighbour. The one case
 * React Aria leaves open is the last tag: focus would fall to <body>, so the
 * group takes it instead and reads out `emptyLabel`.
 *
 * No selection: a chip that toggles on and off is a SegmentedControl or a
 * Checkbox, which already say "selected" the way a screen reader expects.
 */
export declare function TagGroup<T extends object>(props: TagGroupProps<T>): React.JSX.Element;
/**
 * One tag. The children are its label; `key` is what `onRemove` hands back.
 * Give it `textValue` when the children are not plain text.
 */
export { Item as Tag };
//# sourceMappingURL=TagGroup.d.ts.map