Text
Primitive typographic component
import { Text } from 'degen'
name | type | default | description |
---|---|---|---|
align | ConditionalStyle<Values<("left" | "right" | "center")[], { defaultClass: string; conditions: { xs: string; sm: string; md: string; lg: string; xl: string; }; }>> | - | - |
as | "label" | "div" | "code" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span" | div | - |
color | ConditionalStyle<Values<MapLeafNodes<{ background: string; backgroundSecondary: string; backgroundTertiary: string; foreground: string; foregroundSecondary: string; foregroundSecondaryHover: string; foregroundTertiary: string; ... 19 more ...; transparent: string; }, CSSVarFunction> & MapLeafNodes<...>, { ...; }>> | text | - |
ellipsis | boolean | - | - |
font | "mono" | "sans" | sans | - |
letterSpacing | ConditionalStyle<Values<MapLeafNodes<{ '-0.02': string; '-0.015': string; '-0.01': string; normal: string; '0.03': string; }, CSSVarFunction>, { defaultClass: string; conditions: { xs: string; sm: string; md: string; lg: string; xl: string; }; }>> | - | - |
lineHeight | ConditionalStyle<Values<MapLeafNodes<{ normal: string; none: string; '1.25': string; '1.375': string; '1.5': string; '1.625': string; '2': string; }, CSSVarFunction>, { defaultClass: string; conditions: { ...; }; }>> | - | - |
ref | Ref<HTMLElement> | - | Allows getting a ref to the component instance.
Once the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref).
@see https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom |
size | ConditionalStyle<Values<{ inherit: "inherit"; headingOne: CSSVarFunction; headingTwo: CSSVarFunction; headingThree: CSSVarFunction; extraLarge: CSSVarFunction; ... 5 more ...; root: CSSVarFunction; }, { ...; }>> | - | - |
transform | "capitalize" | "lowercase" | "uppercase" | - | - |
underline | boolean | - | - |
variant | "large" | "small" | "extraLarge" | "label" | "base" | - | - |
weight | ConditionalStyle<Values<MapLeafNodes<{ light: string; normal: string; medium: string; semiBold: string; bold: string; }, CSSVarFunction>, { defaultClass: string; conditions: { ...; }; }>> | - | - |
whiteSpace | "inherit" | "initial" | "normal" | "nowrap" | "pre" | "pre-line" | "pre-wrap" | - | - |
wordBreak | "break-word" | - | - |