Text

Kurulum

Paket

@bigbang/ui

İçe aktarma

import { Text } from '@bigbang/ui';

Kaynak

Text.tsx

Storybook

Text · Playground

Text, @bigbang/ui paketindedir. Kurulum ve stil dosyaları Button ile aynıdır; ayrıntılar için Button kod sekmesine bakın.

import { Text } from '@bigbang/ui';

<Text size="sm" tone="subtle" truncate={2} title="...">
  ...
</Text>;

Özellikler

size

Açıklama

Gövde boyutu: 12, 14 ve 16 px. lg yalnızca normal kalınlıktadır.

Tür

'sm' | 'md' | 'lg'

Varsayılan

'md'

weight

Açıklama

medium, metni aynı boyuttaki etiket stilinde çizer; alan değerleri ve satır içi vurgu için.

Tür

'regular' | 'medium'

Varsayılan

'regular'

tone

Açıklama

Metin rengi. Durum tonları kelimeleri renklendirir ama anlamı tek başına taşımaz; metin ya da bir ikon da söyler.

Tür

'default' | 'subtle' | 'subtlest' | 'inverse' | 'danger' | 'success' | 'warning' | 'info'

Varsayılan

'default'

truncate

Açıklama

Metni bir satırdan (true) ya da verilen satır sayısından (2-6) sonra üç noktayla keser. Tam metni başka bir yolla verin, ör. tooltip ya da ayrıntı sayfası.

Tür

boolean | 1 | 2 | 3 | 4 | 5 | 6

numeric

Açıklama

Tablo rakamları: rakamlar sütunda hizalanır, değer değişirken kaymaz.

Tür

boolean

Varsayılan

false

render

Açıklama

Başka bir öğe olarak çizer, ör. <p>, <label>, <strong>, <time>. Varsayılan <span>.

Tür

ReactElement | ComponentRenderFn<HTMLProps, {}>

className

Açıklama

Yalnızca yerleşim için: dış boşluk, hiza, genişlik. Boyutu ya da rengi değiştirmek için kullanmayın.

Tür

string

children

Açıklama

Metin.

Tür

ReactNode

Yerel <span> öznitelikleri (id, title, aria-*) doğrudan iletilir.

Veri öznitelikleri

• data-component="text": kök öğe üzerinde.