import { type ReactNode } from "react";
import { type Hue, type StyleProp, type ViewStyle, type TextStyle } from "../../style/index.js";
export type { Hue };
export interface ChipSkin {
    /** Container shape + padding + gap (the one, compact size). */
    base: ViewStyle;
    /** Label type. */
    labelType: TextStyle;
    /** Remove "×" glyph size. */
    removeSize: number;
    /** Remove-button hitSlop, sized so glyph + slop reaches the platform's minimum
     *  touch target (44pt iOS / 48dp Android), biased away from the label (left). */
    removeHitSlop: {
        top: number;
        bottom: number;
        left: number;
        right: number;
    };
    /** Per-side horizontal insets, for a platform that pads an icon-bearing side
     *  tighter than a text side (M3: 16dp beside text, 8dp beside an icon). The
     *  shell resolves paddingStart/End from it; omit to keep `base`'s padding. */
    sidePadding?: {
        text: number;
        icon: number;
    };
    /** M3 selected filter-chip anatomy: while selected, the chip leads with a
     *  checkmark at this size and drops its outline (skin-threaded, like the
     *  Accordion chevron). Omit on iOS/web: their selected look is the tint swap. */
    selectedCheckSize?: number;
}
export interface ChipProps {
    /** The chip label. */
    children?: ReactNode;
    /** A leading element (e.g. an `<Icon />` or a small `<Avatar />`). An `<Icon />` is
     *  auto-tinted to the chip's label color unless it sets its own color. */
    icon?: ReactNode;
    /** A trailing element (e.g. a chevron for a menu trigger). Rendered after the label. */
    trailing?: ReactNode;
    /** Makes the whole chip tappable (e.g. toggling a filter). */
    onPress?: () => void;
    /** Adds a trailing "×" remove button firing this handler. */
    onRemove?: () => void;
    /**
     * Turns the chip into a filter toggle that owns its own selected state: pressing
     * it lights up to the active tint (its color's fill, or the brand `primary` indigo
     * when the chip has no color) and back. Selection is controlled via `selected`,
     * uncontrolled via `defaultSelected`. Give it an `outline` base so the unselected
     * (border-only) and selected (filled) states read apart.
     */
    selectable?: boolean;
    /** Selected state for a selectable chip (CONTROLLED). Omit for uncontrolled use. */
    selected?: boolean;
    /** Initial selected state for an uncontrolled selectable chip. */
    defaultSelected?: boolean;
    /** Fired with the next selected state when a selectable chip is pressed. */
    onSelectedChange?: (selected: boolean) => void;
    success?: boolean;
    warning?: boolean;
    /** The danger tone. This is the name the intent axis uses across the kit (Button,
     *  AlertDialog, and every chart) and the one the design hand-off uses here too. */
    destructive?: boolean;
    /** @deprecated Use `destructive`. Kept working so existing call sites are untouched;
     *  it resolves to exactly the same hue. */
    error?: boolean;
    info?: boolean;
    neutral?: boolean;
    red?: boolean;
    orange?: boolean;
    amber?: boolean;
    yellow?: boolean;
    lime?: boolean;
    green?: boolean;
    emerald?: boolean;
    teal?: boolean;
    cyan?: boolean;
    sky?: boolean;
    blue?: boolean;
    indigo?: boolean;
    violet?: boolean;
    fuchsia?: boolean;
    purple?: boolean;
    pink?: boolean;
    rose?: boolean;
    gray?: boolean;
    secondary?: boolean;
    primary?: boolean;
    outline?: boolean;
    disabled?: boolean;
    accessibilityLabel?: string;
    /** E2E hook forwarded to the root element. */
    testID?: string;
    /** For layout composition only (not styling). */
    style?: StyleProp<ViewStyle>;
}
/** Build a Chip from a platform skin. */
export declare function createChip(skin: ChipSkin): (props: ChipProps) => import("react").JSX.Element;
//# sourceMappingURL=chip.shared.d.ts.map