copiedLabel | LocalizedMessage | — | Label while the value is copied. Announced to assistive technology when it appears. |
errorLabel | LocalizedMessage | — | Label when the clipboard refused the value. Announced to assistive technology when it appears. |
label | LocalizedMessage | — | Label at rest. With {@link CopyButtonVariant.Icon} it is the accessible name and is never drawn. |
value | string | — | The text to put on the clipboard. Data, not copy, so it is a plain string. |
active | boolean | — | Non-toggle pressed or transient current marker; hosts write the pressed state key through stateAttributes (data-pressed).
A toggle host (Button toggle variant) uses aria-pressed and styles with [aria-pressed="true"] without also writing data-pressed for that toggle state (ADR 0001 rule 1).
Link "current" within a set uses aria-current, not active. |
aria-controls | string | — | Id of the element controlled by this control. |
aria-current | boolean | "time" | "false" | "true" | "page" | "step" | "location" | "date" | — | Whether this item is current within a set. |
aria-describedby | string | — | Id of the element that describes this control. |
aria-description | LocalizedMessage | — | Accessible description when it cannot be referenced by id. |
aria-expanded | boolean | — | Whether the controlled region is expanded. |
aria-haspopup | boolean | "dialog" | "menu" | "false" | "true" | "listbox" | "tree" | "grid" | — | Type of popup triggered by this control, if any. |
aria-label | LocalizedMessage | — | Accessible name when the visible label is insufficient. |
aria-labelledby | string | — | Id of the element that names this control. |
disabled | boolean | — | Inert state per host: native disabled on a button; on Link, ADR 0006 link host (no href, aria-disabled="true", tabIndex={0}).
Never tabIndex={-1}. |
fullSpan | boolean | false | When true, the outline button fills its parent's inline size.
Icon variant is icon-only; fill is not available. |
id | string | — | Element id for ARIA relationships. |
marquee | boolean | false | With truncate, fades a clipped label out at its end and slides it into view while the pointer is over the button
or keyboard focus is on it, so the whole name can be read. It is the same label as a Sidebar item's, and it shows
its full text in its own tooltip. There is no fade or slide when the label fits, and no slide when motion is
reduced or off. A tooltip set on the button replaces the label's tooltip. |
onCopy | ((value: string) => void) | — | Called after the value is on the clipboard.
@param value - The value that was copied |
onCopyError | ((error: unknown) => void) | — | Called when neither the Clipboard API nor the fallback could copy the value. The button shows its error state.
@param error - What the clipboard rejected with, or an error describing the failed fallback |
preventFocusOnPress | boolean | false | When true, mousedown does not move focus to the button (field adornments). |
ref | Ref<HTMLButtonElement> | — | Ref to the rendered button. |
shape | ButtonShape | — | Corner shape. Defaults to {@link ButtonShape.Control}. |
size | ButtonSize | — | Control size. Defaults to {@link ButtonSize.Large}. |
softFill | ButtonSoftFill | ButtonSoftFill.Outline | Fill for {@link ButtonVariant.Soft}. {@link ButtonSoftFill.Outline} is the default secondary (Neutral, bordered,
transparent). {@link ButtonSoftFill.Filled} keeps the tinted Neutral Soft fill for segmented selections and other
cases that need a filled surface. |
tooltip | LocalizedMessage | DisplayValue | — | Short text shown in a Tooltip while the pointer hovers the button or a navigation key focuses it. Button
composes Tooltip's trigger, content and root, so it behaves like Tooltip > TooltipTrigger > Button and also works
while disabled (pointer only) and on toggle buttons. A labelled button points aria-describedby at the tooltip.
An icon-only button does not: label already names it, so the tooltip is visual only and never read twice.
Adding or removing the prop after mount remounts the button. |
truncate | boolean | false | When true, a label wider than the button's available inline size is cut with an ellipsis instead of widening or
wrapping the button. The leading and trailing content keep their size; only the label gives up room. Pair it with a
parent or a width that limits the button, because a button with nothing to limit it never overflows. |
type | "button" | "submit" | "reset" | — | Native button type. Defaults to button. |
variant | CopyButtonVariant | — | Outline shows a label; {@link CopyButtonVariant.Icon} is icon-only. |