TextLink
a
の代わりに使用するコンポーネントです。前後にアイコンを差し込めます。またリンクであることを表すために下線を強制します。
デザインパターン
特別なテキストリンク
特定の役割を示すためにアイコンを使います。これはテキストが異なっていても、同じ挙動であることを示すためです。
新規ウィンドウで開くテキストリンク
新規ウィンドウ(新規タブ)で開くテキストリンクには、テキストの右側に 新規ウィンドウ アイコン(FaUpRightFromSquareIcon
)を必ず配置します。リンク先がSmartHRの内部ページ、外部サイトに関わらず表示します。
ヘルプセンターを開くテキストリンク
ヘルプセンターを開くテキストリンクには、テキストの左側に ヘルプセンター アイコン(FaCircleQuestionIcon
)を配置することを推奨します。詳細はヘルプページへの動線を参照してください。
Props
onClick
(e: MouseEvent<Element, MouseEvent>) => void
リンクをクリックした時に発火するコールバック関数
prefix
stringnumberfalsetrueReactElement<any, string | JSXElementConstructor<any>>Iterable<ReactNode>ReactPortal
テキストの前に表示するアイコン
suffix
stringnumberfalsetrueReactElement<any, string | JSXElementConstructor<any>>Iterable<ReactNode>ReactPortal
テキストの後ろに表示するアイコン