Components
Text
This component is used to render text in a variety of styles based on Seeds values.
By default, the Text component renders text in a span
tag. You can change this with the “as” prop. In addition, Text will inherit its font size from its parent unless a size is set with the fontSize
prop.
Hello world!
import { Text } from '@sproutsocial/racine'
Properties
Name | Type | Default | Description | Required? |
---|---|---|---|---|
fontSize | 100 200 300 400 500 600 700 800 900 1000 1100 1200 | Maps to the typeScale system prop, sets font size and line height using Seeds values | ||
breakWord | boolean | Controls the CSS word-break property | ||
truncated | boolean | Truncates text into a single line with ellipsis | ||
children | React.Node | |||
qa | Object |
Recipes
Custom font size
Hello world!
Truncated text
Supercalifragilisticexpialidocious