Home > @tridion-sites/extensions > TextProps
Signature:
export interface TextProps extends ColorProps, TooltipProps
Extends: ColorProps, TooltipProps
| Property | Modifiers | Type | Description |
|---|---|---|---|
| alignment? | TextAlignment | (Optional) The alignment of the text in the container. | |
| breakWord? | boolean | (Optional) Determines whether the text should break words if they exceed the container width. Note that it can be used in combination with multiLine: true only, since single line text is truncated by default. |
|
| children? | ReactNode | (Optional) The content to be rendered inside the Text component. | |
| compact? | boolean | (Optional) Determines whether the Text component should have compact spacing. If set to true, the line height of the text will be reduced. |
|
| direction? | TextDirection | (Optional) The direction of the text. | |
| multiLine? | boolean | (Optional) Allow text to flow over multiple lines. By default it’s a single line text with truncation enabled. | |
| notSelectable? | boolean | (Optional) Option to make text non-selectable by the user. | |
| tag? | TextTag | (Optional) The HTML tag to be used for rendering the Text component. Overrides default tag defined by type. |
|
| type? | TextType | <p>(Optional) Preset that consist of specific styling (size, weight, etc) and HTML tag.</p><p>- heading1 - usually represents a top-level heading or title. It is styled as a large and prominent text. By default <h1> HTML tag is used. - heading2 - a secondary-level heading. It is styled as a slightly smaller text compared to heading1. By default <h2> HTML tag is used. - heading3 - a tertiary-level heading. It is styled as a smaller text compared to heading2. By default <h3> HTML tag is used. - default - default style for regular text. It is styled as a standard paragraph text. By default <div> HTML tag used. - defaultBold - the default style for bold text. It is styled similarly to default but with added font-weight. By default <div> HTML tag is used. - small - a smaller size for text. It is typically used for captions, footnotes, or other smaller pieces of text. By default <div> HTML tag is used. - smallBold - a smaller size for bold text. It combines the smaller size of ‘small’ with the added font-weight. By default <div> HTML tag is used.</p> |
|
| underline? | boolean | (Optional) Determines whether the text should have an underline. | |
| uppercase? | boolean | (Optional) Determines whether the text should be displayed in uppercase. |