复制
提供无障碍复制操作,并如实报告结果。
数值与精简反馈
使用于 Palette.
用法与接口
DemoCopyButton 会渲染 span.ui-copy,其中包含 ui-button 和 ui-copy-status 实时通知区域。label 为辅助技术提供操作名称;feedback="compact" 报告“Copied”,而非复制的值。在 DemoCopyGroup 中,按钮共用同一状态区域,且不再生成外层元素。
<DemoCopyButton value="var(--color-blue-60)" label="Copy the blue 60 variable">Copy variable</DemoCopyButton><span class="ui-copy"> <button type="button" class="ui-button" data-size="sm" aria-label="Copy the blue 60 variable">…Copy variable</button> <span class="ui-copy-status" role="status" data-result="success">Copied var(--color-blue-60)</span></span>data-result 为 success 或 error,文字始终说明实际发生的结果。