OverviewHistoryStatsSecurity
npx skills add ...
Documentation
SKILL.md
npx skills add syncfusion/wpf-ui-components-skills --skill syncfusion-wpf-smart-text-editor
Implements Syncfusion WPF Smart Text Editor (SfSmartTextEditor), an AI-powered multiline input control with intelligent text completion. Use this when implementing smart text editors, AI-powered text input, or predictive text suggestions in WPF applications. The control provides context-aware typing assistance through integration with AI services including Azure OpenAI, OpenAI, Ollama, Claude, Gemini, Groq, and DeepSeek. Features include dual suggestion display modes (inline/popup), custom phrase libraries for offline suggestions, full text customization, and comprehensive command handling for workflow integration.
npx skills add syncfusion/wpf-ui-components-skills --skill syncfusion-wpf-smart-text-editor
Use this skill when users need to:
The Smart Text Editor (SfSmartTextEditor) is ideal for scenarios requiring intelligent typing assistance, branded response templates, and AI-enhanced user input.
The Syncfusion WPF Smart Text Editor is a multiline input control that uses predictive suggestions to speed up typing. It integrates with AI inference services for context-aware completions and provides inline or popup suggestion display modes. Key capabilities include:
Core Features:
Supported AI Providers:
📄 Read: references/getting-started.md
When to read: Starting a new Smart Text Editor implementation, setting up the development environment, or adding the control to an existing WPF project.
📄 Read: references/suggestion-display-modes.md
When to read: User needs to configure how suggestions appear, switch between display modes, or optimize for desktop vs touch devices.
📄 Read: references/customization.md
When to read: Customizing appearance to match application themes, changing text styles, configuring placeholders, or setting character limits.
📄 Read: references/commands.md
When to read: Implementing text change notifications, MVVM command patterns, or custom event handling logic.
📄 Read: references/ai-service-configuration.md
When to read: Configuring Azure OpenAI, OpenAI, or Ollama for AI-powered suggestions. Use this for official/built-in AI provider setup.
Scenario: Customer support application with branded responses.
Scenario: Email client with custom theme and popup suggestions.
Scenario: Track text changes for auto-save or validation.
Scenario: App that works without AI connectivity.
Note: If no AI service is configured, the editor automatically falls back to UserPhrases for suggestions.
| Property | Type | Description | Default |
|---|---|---|---|
Text | string | Gets or sets the text content | "" |
Placeholder | string | Placeholder text when editor is empty | null |
UserRole | string | Describes who is typing and intent (shapes AI suggestions) | null |
UserPhrases | List<string> | Custom phrase library for offline suggestions | null |
SuggestionDisplayMode | SuggestionDisplayMode | Display mode: Inline or Popup | Inline |
MaxLength | int | Maximum character limit | 0 (unlimited) |
TextChangedCommand | ICommand | Command triggered when text changes | null |
Style | Style | Text style (FontSize, Foreground, etc.) | Default |
PlaceholderStyle | Style | Placeholder styling | Default |
SuggestionInlineStyle | Style | Inline suggestion text style | Default |
SuggestionPopupStyle | Style | Popup suggestion background style | Default |
SuggestionDisplayMode="Inline"SuggestionDisplayMode="Popup"AzureOpenAIClient in App.xaml.csMaxLength propertyTextChangedCommand to ViewModelUserPhrases without AI serviceStyle, PlaceholderStyle, SuggestionInlineStyleNext Steps:
<syncfusion:SfSmartTextEditor
Placeholder="Compose your email..."
UserRole="Professional email author"
SuggestionDisplayMode="Popup"
MaxLength="5000">
<syncfusion:SfSmartTextEditor.Style>
<Style TargetType="{x:Type syncfusion:SfSmartTextEditor}">
<Setter Property="FontSize" Value="14"/>
<Setter Property="Foreground" Value="#333333"/>
<Setter Property="FontFamily" Value="Segoe UI"/>
</Style>
</syncfusion:SfSmartTextEditor.Style>
<syncfusion:SfSmartTextEditor.SuggestionPopupStyle>
<Style TargetType="syncfusion:SuggestionPopup">
<Setter Property="Background" Value="#0078D4"/>
<Setter Property="Foreground" Value="White"/>
</Style>
</syncfusion:SfSmartTextEditor.SuggestionPopupStyle>
</syncfusion:SfSmartTextEditor><syncfusion:SfSmartTextEditor
x:Name="smartTextEditor"
TextChangedCommand="{Binding TextChangedCommand}"
Placeholder="Start typing..."/>public class EditorViewModel : INotifyPropertyChanged
{
public ICommand TextChangedCommand { get; }
public EditorViewModel()
{
TextChangedCommand = new RelayCommand(OnTextChanged);
}
private void OnTextChanged()
{
// Auto-save, validation, or tracking logic
Debug.WriteLine("Text changed - triggering auto-save");
}
}<syncfusion:SfSmartTextEditor
Placeholder="Type your message..."
UserRole="Sales representative responding to leads">
<syncfusion:SfSmartTextEditor.UserPhrases>
<sys:String>Thank you for your interest in our products.</sys:String>
<sys:String>I'd be happy to schedule a demo.</sys:String>
<sys:String>Our pricing starts at $99 per month.</sys:String>
<sys:String>Let me connect you with our solutions team.</sys:String>
<sys:String>Feel free to reach out with any questions.</sys:String>
</syncfusion:SfSmartTextEditor.UserPhrases>
</syncfusion:SfSmartTextEditor>