Skip to content

Task(1039584):Fix Documentation Issues in WPF Smart Text Editor Markdown Files #2352

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
MonikaTheerthagiri wants to merge 2 commits into
base: development
Choose a base branch
from
Open

Task(1039584):Fix Documentation Issues in WPF Smart Text Editor Markdown Files #2352

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
7f91c24
Committing the updated SmartTextEditor UG content
MonikaTheerthagiri Jul 8, 2026
1763627
Committing the correction of CI status
MonikaTheerthagiri Jul 8, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
76 changes: 59 additions & 17 deletions wpf/SmartTextEditor/commands.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,37 +7,79 @@ control: SfSmartTextEditor
documentation: ug
---

# Commands in WPF AI-Powered Text Editor (SfSmartTextEditor)
# TextChangedCommand in WPF Smart Text Editor (SfSmartTextEditor)

The AI-Powered Text Editor provides the `TextChangedCommand` command, is triggered whenever the text in the smart text editor changes.
The WPF Smart Text Editor provides the `TextChangedCommand` command, which is triggered whenever the text in the editor changes. This page documents the `TextChangedCommand` and the set of supported commands; refer to the [SfSmartTextEditor API reference](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.SmartComponents.html) for the complete and version-specific list.

### TextChangedCommand

The `SfSmartTextEditor` includes a built-in property called `TextChangedCommand`, which is triggered whenever the text in the smart text editor changes. This event can be invoked through the `TextChangedCommand`.
The `SfSmartTextEditor` includes a built-in command called `TextChangedCommand`, which is triggered whenever the text in the editor changes. You can invoke this command through the `TextChangedCommand` property.

N> The exact parameter passed to the command's `Execute` and `CanExecute` methods (for example, the new text, the old text, or a `TextChangedEventArgs`-like object) depends on the installed Syncfusion version. Refer to the `SfSmartTextEditor` API reference for the precise `ICommand` contract.

## Supported commands

The following command is documented on this page:

- `TextChangedCommand` — Raised whenever the text in the editor changes.

N> The set of commands supported by the control, including the parameter types and any additional commands such as suggestion-accepted events, depends on the installed Syncfusion version. Refer to the [SfSmartTextEditor API reference](https://help.syncfusion.com/cr/wpf/Syncfusion.UI.Xaml.SmartComponents.html) for the complete and version-specific list.

## Version compatibility

The command infrastructure described in this page is available in the `Syncfusion.SfSmartComponents.WPF` package. The specific command names, parameter types, and available members may differ between Syncfusion versions. Refer to the release notes for your installed version.

## Setting up the project to use `TextChangedCommand`

Before you wire up `TextChangedCommand` in your view, complete the following steps:

1. Add a reference to the `Syncfusion.SfSmartComponents.WPF` assembly in your WPF project (the same NuGet package installed in the Getting Started walkthrough).
2. In your XAML page, declare the `Syncfusion.UI.Xaml.SmartComponents` namespace.so the `SfSmartTextEditor` element and its `TextChangedCommand` property resolve.
3. If you bind `TextChangedCommand` to a property on a view model or code-behind class, make sure the binding source (the `DataContext`) exposes a property of type `System.Windows.Input.ICommand` named `TextChangedCommand` (or matching the binding path you use in XAML). Add the `using System.Windows.Input;` directive in the C# file that defines the command property.
4. If you are using a third-party `ICommand` implementation such as `RelayCommand` or `DelegateCommand`, install the corresponding NuGet package (for example, `CommunityToolkit.Mvvm`) and add the required `using` directive for that namespace. The `Command` type referenced in the sample below is a placeholder — substitute it with the `ICommand` implementation available in your project.

{% tabs %}
{% highlight xaml tabtitle="MainPage.xaml" hl_lines="2" %}
{% highlight xaml tabtitle="MainPage.xaml" hl_lines="8" %}

<smarttexteditor:SfSmartTextEditor x:Name="smarttexteditor"
TextChangedCommand="TextChangedCommand">
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:smarttexteditor="clr-namespace:Syncfusion.UI.Xaml.SmartComponents;assembly=Syncfusion.SfSmartComponents.Wpf"
xmlns:local="clr-namespace:WpfApplication1">
<Window.DataContext>
<local:SmartTextEditorViewModel/>
<local:MainWindow/>
</Window.DataContext>
</smarttexteditor:SfSmartTextEditor>
<Grid>
<smarttexteditor:SfSmartTextEditor x:Name="smartTextEditor"
TextChangedCommand="{Binding TextChangedCommand}"/>
</Grid>
</Window>

{% endhighlight %}
{% highlight c# tabtitle="MainPage.xaml.cs" hl_lines="3,6,8" %}
{% highlight c# tabtitle="MainPage.xaml.cs" %}

public class SmartTextEditorViewModel
using System.Windows;
using System.Windows.Input;
using Syncfusion.UI.Xaml.SmartComponents;

namespace WpfApplication1
{
public ICommand TextChangedCommand { get; set; }
public SmartTextEditorViewModel()
public partial class MainWindow : Window
{
TextChangedCommand = new Command(TextChangedCommand);
}
private void TextChangedCommand()
{
// To do your requirement here.
public MainWindow()
{
InitializeComponent();
// Use a concrete ICommand implementation such as RelayCommand.
// Substitute "RelayCommand" with the ICommand implementation available in your project
// (for example, CommunityToolkit.Mvvm's RelayCommand, Prism's DelegateCommand, or your own).
TextChangedCommand = new RelayCommand(OnTextChanged);
}

public ICommand TextChangedCommand { get; set; }

private void OnTextChanged(object parameter)
{
// To do your requirement here.
}
}
}

Expand Down
40 changes: 26 additions & 14 deletions wpf/SmartTextEditor/customization.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ documentation: ug
This section explains how to change the AI-Powered Text Editor’s appearance and suggestion behavior. You can set text styles, placeholder options, and customize how suggestions are shown.

## Text customization
Set or bind the smart text editor’s text using the `Text` property. You can use this to preloaded content or bind it to a field in your view model for data binding.
Set or bind the WPF Smart Text Editor’s text using the `Text` property. You can use this to set preloaded content or bind it to a field in your view model for data binding.

{% tabs %}
{% highlight xaml tabtitle="XAML" %}
Expand Down Expand Up @@ -80,7 +80,9 @@ Add a helpful placeholder to guide users and use `PlaceholderStyle` to make the

## Suggestion text color

Customize the color of the suggestion text using the `SuggestionInlineStyle` property to match your theme and improves readability.
Customize the color of the suggestion text using the `SuggestionInlineStyle` property to match your theme and improve readability.

N> The `SuggestionInlineStyle` property accepts a `Style` whose `TargetType` is the suggestion text element (commonly `TextBlock`). The settable properties depend on the target element. Common setters include `FontSize`, `FontFamily`, `FontWeight`, `Foreground`, and `Background`. The full list of supported style setters depends on the installed Syncfusion version; refer to the API reference for the complete contract.

{% tabs %}
{% highlight xaml tabtitle="XAML" %}
Expand All @@ -100,28 +102,34 @@ Customize the color of the suggestion text using the `SuggestionInlineStyle` pro
![Suggestion Text Color in WPF Smart Text Editor.](images/customization/wpf-smarttexteditor-inline-textcolor.gif)

## Suggestion popup background
Change the background color of the suggestion popup using the `SuggestionPopupStyle` property in Popup mode to align with your app's design.
Change the background color of the suggestion popup using the `SuggestionPopupStyle` property in Popup mode. This helps the suggestion align with your app's design.

{% tabs %}
{% highlight xaml tabtitle="XAML" %}

<smartTextEditor:SfSmartTextEditor SuggestionDisplayMode="Popup">
<smartTextEditor:SfSmartTextEditor.SuggestionPopupStyle>
<Style TargetType="smartTextEditor:SuggestionPopup">
<Setter Property="Foreground" Value="White" />
<Setter Property="Background" Value="#0078D4" />
<Setter Property="FontSize" Value="16"/>
</Style>
</smartTextEditor:SfSmartTextEditor.SuggestionPopupStyle>
</smartTextEditor:SfSmartTextEditor>
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:smartTextEditor="clr-namespace:Syncfusion.UI.Xaml.SmartComponents;assembly=Syncfusion.SfSmartComponents.Wpf">
<smartTextEditor:SfSmartTextEditor SuggestionDisplayMode="Popup">
<smartTextEditor:SfSmartTextEditor.SuggestionPopupStyle>
<Style TargetType="smartTextEditor:SuggestionPopup">
<Setter Property="Foreground" Value="White" />
<Setter Property="Background" Value="#0078D4" />
<Setter Property="FontSize" Value="16"/>
</Style>
</smartTextEditor:SfSmartTextEditor.SuggestionPopupStyle>
</smartTextEditor:SfSmartTextEditor>
</Window>

{% endhighlight %}
{% endtabs %}

![Customization in WPF Smart Text Editor.](images/customization/wpf-smarttexteditor-customization.gif)

## Maximum input length
Set a limit on the number of characters the user can enter in the smart text editor using the `MaxLength` property.
Set a limit on the number of characters the user can enter in the WPF Smart Text Editor using the `MaxLength` property.

N> The default value, the behavior when the limit is reached (for example, prevents further input versus silently truncates), and the minimum allowed value of `MaxLength` depend on the installed Syncfusion version. Refer to the API reference for the exact contract, and choose a positive integer appropriate for your scenario.

{% tabs %}
{% highlight xaml tabtitle="XAML" %}
Expand All @@ -138,4 +146,8 @@ var smarttexteditor = new SfSmartTextEditor
};

{% endhighlight %}
{% endtabs %}
{% endtabs %}

## Version compatibility

The properties documented on this page (`Text`, `Style`, `Placeholder`, `PlaceholderStyle`, `SuggestionInlineStyle`, `SuggestionPopupStyle`, `SuggestionDisplayMode`, `MaxLength`, and related members) are available in the `Syncfusion.SfSmartComponents.WPF` package. The exact property names, types, and supported values may differ between Syncfusion versions. Refer to the release notes for your installed version.
Loading