Skip to main content


The Text component allows the user to edit plain text.


Here's the Typescript interface for the props of the Text component:

interface TextProps {
propName: string
renderBlock: React.FC
placeholder: string
multiline?: boolean
softLineBreak?: boolean

Properties definition

propNameThe prop of the Brick component corresponding to this text.
renderBlockA React functional component used to render the text.
Typically it wraps the children.
placeholderThe placeholder to show when the text is empty.
multilineDefault: false. If set to true allows multiline text.
softLineBreakDefault: false. If set to true allows soft line breaks.

Usage example

renderBlock={(props: any) => (
<p className="text-xl font-extrabold" {...props.attributes}>