# 可复制的值 ClipboardText

分类：表单 · React：ClipboardText

只读的值加一个复制按钮；复制后按钮上方冒出「已复制」，图标变勾一下。

## 示例
```html
<div class="xxd-clipboard" style="width:100%;max-width:300px">
  <code>pnpm xxd new ~/js/插件-今日待办</code>
  <button class="xxd-btn" data-variant="ghost" data-icon-only data-size="sm" aria-label="复制" data-copy="pnpm xxd new ~/js/插件-今日待办"><i data-xxd-icon="Copy" data-size="14"></i></button>
</div>
```

## 属性与类名
- `data-size`：sm
- 类名：`xxd-clipboard`

## JS
```js
[data-copy="文本"] 或 [data-copy-target="#选择器"]；data-copy-done 自定义气泡文字
```

## 键盘与读屏
- 复制按钮有 aria-label；「已复制」通过 live region（role=status）读出
- 被复制的值是可选中的文字，键盘用户也能自己复制