テキストリンクTextLink
Experimental

本文中のリンクを表示し、新しいタブで開くリンクには外部リンクアイコンを自動で併記します。

状態とバリエーション

同じサイト内や同じタブで移動する通常のテキストリンクです。外部タブアイコンは表示しません。

target="_blank" のリンクには外部タブアイコンを必ず併記します。

注釈や補足テキスト内で、本文になじませたいリンクに使います。

リンク先のタイトルや説明を HoverCard で合成するバリエーションです。タップでも概要を開き、カード内のボタンで遷移を確認できます。

表は横にスクロールできます

プロパティ	型	初期値	説明
href	string	-	リンク先です。
target	HTMLAttributeAnchorTarget	-	`_blank` の場合は外部タブアイコンを自動で表示します。
variant	"default" \| "muted"	"default"	本文中の強調度に合わせた見た目です。
external	boolean	false	新しいタブではない外部リンクにも外部リンクアイコンを表示します。
newTabLabel	string	"opens in a new tab"	新しいタブで開くことを支援技術に伝える非表示の補足ラベルです。表示される説明が必要な場合は HoverCard や Tooltip と合成します。
children	ReactNode	-	リンクテキストです。