ClassButtonTool
Base class for Editor toolbar tools that render as clickable buttons to execute editor commands. Provides common properties for button appearance, behavior, and command execution. Use derived classes for specific formatting operations or extend this class for custom button tools.
Definition
Namespace:Telerik.Blazor.Components.Editor
Assembly:Telerik.Blazor.dll
Syntax:
public class ButtonTool : IEditorCommandTool, IEditorToolInheritance: objectButtonTool
Derived Classes:
Implements:
Constructors
ButtonTool()
Declaration
public ButtonTool()Properties
ChildContent
Sets custom content to display inside the button instead of or alongside the icon. Use for text labels, custom icons, or complex button content like dropdowns. When specified, this content takes precedence over simple icon display. Useful for creating descriptive buttons or tools with multiple elements.
Declaration
public RenderFragment ChildContent { get; set; }Property Value
Class
Sets additional CSS classes to apply to the button for custom styling. Use to override default button appearance or add application-specific styles. Combine with Telerik CSS framework classes for consistent theming. Example: "custom-highlight" or "k-button-primary" for different button styles.
CommandName
Sets the editor command that will be executed when the button is clicked. Use predefined commands from EditorCommands or specify custom command names. The command determines what editing operation is performed, such as "bold", "italic", or "insertImage". Required for proper tool functionality and editor state management.
Declaration
public string CommandName { get; set; }Property Value
Implements
Enabled
Controls whether the button accepts user interaction and can execute its command. When set to false, the button appears disabled and cannot be clicked. Use to conditionally enable tools based on editor state, user permissions, or content context. Many tools automatically manage their enabled state based on editor selection and content. Default value is true.
Icon
Sets the icon displayed in the button using Telerik SVG icons or custom icon sources. Use enumeration values for consistent Telerik icons like . Supports custom icons through CSS classes, image URLs, or other icon font systems. Essential for creating recognizable toolbar buttons that users can quickly identify. See Icons Documentation for available options.
OnClick
Fires when the user clicks the button, allowing for custom handling before or after command execution. Use to implement additional logic like validation, analytics tracking, or custom behavior. Called in addition to the standard editor command execution defined by CommandName. Useful for extending built-in tools with application-specific functionality.
Declaration
public EventCallback<MouseEventArgs> OnClick { get; set; }Property Value
Title
Sets the tooltip text that appears when users hover over the button. Use descriptive text that explains the button's function, especially for icon-only buttons. Improves accessibility and user experience by providing context for the tool's purpose. Example: "Make text bold" or "Insert image into content".