ナビゲヌション
コンポヌネント

コピヌ

実際の結果を䌝える、アクセシブルなコピヌ操䜜。

倀付きず簡朔な通知

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

䜿甚箇所 Palette.

䜿い方ずむンタヌフェヌス

DemoCopyButton は、ui-button ず ui-copy-status のラむブ領域を含む span.ui-copy を描画したす。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 です。テキストは垞に実際の結果を䌝えたす。