/** Which control shape renders: a text chip, a colour dot, an image tile, or a label-plus-unit-price pack. */ export type OptionChipVariant = "chip" | "swatch" | "image-tile" | "pack"; /** md is a 44px hit; lg is 52px. */ export type OptionChipSize = "md" | "lg"; /** One selectable option. Renders role="radio"; the parent supplies the radiogroup and arrow keys. */ export interface OptionChipProps { /** Visible text for chip, pack and image-tile; the accessible name for a swatch. */ label: string; /** Controlled: sets `aria-checked` and the selected styling; clicking never toggles it. Defaults to false. */ selected?: boolean; /** Native disabled: dimmed, not focusable, onSelect never fires. */ disabled?: boolean; /** Struck through and dimmed but still focusable and announced as unavailable; onSelect still fires so a parent can re-derive. */ unavailable?: boolean; /** Draws a 1px error ring; use when the group needs a pick. */ invalid?: boolean; /** Picks the layout; `swatch` needs `swatch`, `image-tile` uses `image`, and `pack` shows `hint` as a second line. Defaults to "chip". */ variant?: OptionChipVariant; /** Any CSS colour from product data; the one place a literal colour is allowed. */ swatch?: string; /** Image source for an image-tile. */ image?: string; /** Secondary text: a corner badge on a chip ("3 left"), a second line on a pack or tile. */ hint?: string; /** Swatch only: print the colour name under the dot. */ showLabel?: boolean; /** Control scale across all variants. Defaults to "md". */ size?: OptionChipSize; /** Stretch to the parent's width, for grid layouts. */ fullWidth?: boolean; /** Fires on every click, including when already selected or `unavailable`; never when `disabled`. Does not toggle `selected`. */ onSelect?: () => void; /** Fires when the button receives focus; takes no arguments. */ onFocus?: () => void; /** Roving tabindex from the parent group; omit for a standalone chip. */ tabIndex?: number; "data-testid"?: string; }