Rich text editor

A contenteditable editor with a toolbar.

import { BuiRichTextEditor } from 'ng-blatui';

<bui-rich-text-editor [(value)]="html" />

Prefilled

<!-- seed the model with initial HTML -->
<bui-rich-text-editor [(value)]="html" />
// html = signal('<h3>Welcome</h3><p>Starts <strong>prefilled</strong>.</p>')

API reference

Inputs

Prop	Type	Default	Description
`placeholder`	`string`	`'Write something…'`	Placeholder text shown while the editor is empty.
`ariaLabel`	`string`	`'Rich text editor'`	Accessible label for the editable region.
`formattingLabel`	`string`	—	Accessible label override for the formatting toolbar.
`name`	`string`	`''`	Name attribute associated with the editor for form submission.

Two-way models

Bind with [(name)], or one-way as an input.

Prop	Type	Default	Description
`value`	`string`	`''`	Editor contents as HTML. Two-way bindable with `[(value)]`.

Every ng-blatui component also accepts a class input to merge extra Tailwind classes onto the host.