Class RichTextEditorCustomToolbarItem

A class used for configuring the custom toolbar item properties in the SfRichTextEditor. This allows the addition of user-defined tools within the editor's toolbar.

Inheritance
object
ComponentBase
OwningComponentBase
SfOwningComponentBase
RichTextEditorCustomToolbarItem
Implements
Inherited Members
Namespace: Syncfusion.Blazor.RichTextEditor
Assembly: Syncfusion.Blazor.dll
Syntax
public class RichTextEditorCustomToolbarItem : SfOwningComponentBase, IComponent, IHandleEvent, IHandleAfterRender, IDisposable
Examples

In the following example, insert the horizontal line using the custom tool option.

@using Syncfusion.Blazor.RichTextEditor;
<SfRichTextEditor @ref="RTEInstance">
    <RichTextEditorToolbarSettings Items="@Tools">
        <RichTextEditorCustomToolbarItems>
            <RichTextEditorCustomToolbarItem Name="Symbol">
                 <Template>
                    <button class="e-btn e-tbar-btn" @onclick="ClickHandler">
                         <div class="e-tbar-btn-text" style="font-weight: 500;">__</div>
                    </button>
                 </Template>
            </RichTextEditorCustomToolbarItem>
        </RichTextEditorCustomToolbarItems>
    </RichTextEditorToolbarSettings>
</SfRichTextEditor>
@code {
    SfRichTextEditor RTEInstance;
    private List<ToolbarItemModel> Tools = new List<ToolbarItemModel>()
    {
        new ToolbarItemModel() { Name = "Symbol", TooltipText = "Insert horizontal line" }
    };
    private async Task ClickHandler() {
        await this.RTEInstance.ExecuteCommandAsync(CommandName.InsertHTML, "<hr>");
    };
}

Constructors

RichTextEditorCustomToolbarItem()

Declaration
public RichTextEditorCustomToolbarItem()

Properties

Name

Gets or sets the custom tool name. This property is used to define the custom tool's identifier within the toolbar.

Declaration
[Parameter]
public string? Name { get; set; }
Property Value
Type Description
string

Accepts a string value representing the name of the custom tool. The default value is String.Empty.
Remarks

This name serves as the identifier for the custom toolbar item. Users should provide a unique and descriptive name.

Template

Gets or sets the template to customize the toolbar item. This allows users to define their own HTML structure for the toolbar item.

Declaration
[Parameter]
public RenderFragment? Template { get; set; }
Property Value
Type Description
RenderFragment

A RenderFragment that defines the template content. The default value is null.
Remarks

The template provides customization flexibility for designing the toolbar item according to specific requirements.

Methods

Dispose(bool)

Dispose unmanaged resources in the Syncfusion Blazor component.

Declaration
protected override void Dispose(bool disposing)
Parameters
Type Name Description
bool disposing

Boolean value to dispose the object.
Overrides

OnInitializedAsync()

Method invoked when the component is ready to start.

Declaration
protected override Task OnInitializedAsync()
Returns
Type Description
Task

A System.Threading.Tasks.Task representing any asynchronous operation.
Overrides

Implements