元件

複製

提供無障礙複製操作，並確實回報結果。

數值與精簡回饋

Value feedback repeats what was copied; compact feedback suits a specimen that already shows it.

使用於 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，文字始終說明實際發生的結果。