Text
テキストを表示するためのコンポーネントです。タイポグラフィのデザイントークンを使用しています。
使用上の注意
入れ子にしたときの出力要素に注意する
デフォルトの出力要素は<span>
になるため、入れ子にしたときにValidなHTMLになるように注意してください。
種類
フォントサイズ
size
propsで指定できます。値はタイポグラフィのフォントサイズのデザイントークンを参照してください。
ウェイト
weight
propsで指定できます。
強調、イタリック体
emphasis
props、italic
propsで指定できます。
色
color
propsで指定できます。値は色の文字のデザイントークンを参照してください。
行送り
leading
propsで指定できます。値は行送りのデザイントークンを参照してください。
折り返し
whiteSpace
propsで指定できます。
見出しスタイル
styleType
propsで指定できます。
Headingの種類に合わせた見た目(フォントサイズ、ウェイト、色)を提供しますが、見出しとして使う場合はTextではなくHeadingを使用してください。
Props
size
"XXS""XS""S""M""L""XL""XXL"
weight
"normal""bold"
italic
falsetrue
leading
"NONE""TIGHT""NORMAL""LOOSE"
whiteSpace
"pre""normal""nowrap""pre-line""pre-wrap"
emphasis
falsetrue
強調するかどうかの真偽値。指定すると em 要素になる
styleType
"screenTitle""sectionTitle""blockTitle""subBlockTitle""subSubBlockTitle"
見た目の種類