# copyFeedback

> Confirms a copy on the button that made it: the button carries `data-copied` for two seconds, so its styles can swap the copy glyph for a check, and its status region reads the confirmation out.

```ts
import { copyFeedback } from "@sdxc/ui/docs";
```

Marks its host button as copied after every successful copyToClipboard write and
writes `copiedLabel` into the `[role="status"]` element inside it, which a screen reader
announces; both clear after two seconds, and a second copy restarts the clock.

## Signature

```ts
copyFeedback(copiedLabel: string): MixinDescriptor<HTMLButtonElement>
```

Returns: A mixin descriptor for the copy button's `mix` prop.

## Parameters

| Parameter | Type | Description |
| --- | --- | --- |
| `copiedLabel` | `string` | The confirmation a screen reader announces, such as "Copied". |

## Examples

```tsx
<button commandfor="code" command={COPY_COMMAND} mix={[copyToClipboard(), copyFeedback(t("copied"))]}>
	<CopyIcon />
	<span role="status" mix={[visuallyHidden()]} />
</button>
```

## Used with it

The events, constants and types its module publishes, each imported from `@sdxc/ui/docs` too.

### COPIED_ATTRIBUTE

Attribute the button carries while it confirms a copy.

#### Signature

```ts
const COPIED_ATTRIBUTE = "data-copied"
```