Code Editor

Provides a configurable text editor control with syntax highlighting, code completion, and advanced editing features for use in the Grooper web client.

Remarks

The Code Editor control is an interactive, web-based text editor designed for editing code, scripts, and structured text within the Grooper interface. It offers a rich set of features for both basic and advanced editing tasks, including syntax highlighting, code completion, and customizable appearance. The control is suitable for editing regular expressions, scripts, configuration files, and other code-based content in Grooper.

UI Components

• Text Editing Area:
  • The main editor surface supports multi-line editing, selection, and navigation.
  • Syntax highlighting is applied based on the selected language or format.
  • Code completion popups provide context-aware suggestions.
• Context Menu:
  • Right-click to access editing commands such as Cut, Copy, Paste, Undo, Redo, Comment, and Uncomment.
  • Menu items are grouped by function (e.g., Clipboard, History, RegEx).
• Toolbar (optional):
  • May include buttons for toggling word wrap, control character visibility, and other editor settings.
• Status Bar (optional):
  • Displays information such as cursor position, tab size, and current mode.

Interactive Features

• Syntax Highlighting:
  • Automatically colors code elements for supported languages (e.g., RegEx, C#, XML).
  • Customizable via the Highlighter property.
• Code Completion:
  • Provides auto-complete suggestions as you type, triggered by specific characters or keyboard shortcuts.
  • Configurable via the Provider property.
• Editing Commands:
  • Full support for undo/redo, cut/copy/paste, and commenting/uncommenting code.
  • Context menu and keyboard shortcuts for rapid access.
• Configurable Appearance:
  • Word wrap, control character visibility, and tab size can be adjusted.
  • Editor appearance is styled via CSS and can be customized per user/session.
• Accessibility:
  • Keyboard navigation and screen reader support for most actions.

Keyboard Shortcuts

• Ctrl + A: Select all text
• Ctrl + Shift + Space: Show code completion list
• Alt + W: Toggle word wrap
• Alt + S: Toggle control character visibility
• Alt + Backspace: Undo last edit
• Alt + K: Comment selection (if supported)
• Alt + Shift + K: Uncomment selection (if supported)
• Tab / Shift + Tab: Indent or unindent lines (if AcceptsTab is enabled)

Usage Guidance

Use the Code Editor control whenever users need to edit code, scripts, or structured text in Grooper. Configure syntax highlighting and code completion for the target language or format. Enable or disable editing features as needed for your workflow. Leverage context menu commands and keyboard shortcuts for efficient editing.

• For regular expression editing, enable RegEx-specific commands and highlighting.
• For script editing, configure the appropriate completion provider and highlighter.
• Use the ReadOnly property to present code in a non-editable, view-only mode.

Accessibility

• Supports keyboard navigation and screen reader accessibility.
• All major editing actions are available via keyboard shortcuts and context menu.

For more information, see the documentation for Code Editor, Context Menu, and related controls.

Context Menu Commands

Command	Shortcut	Description
file_copy Copy	Ctrl+C	Copies the current selection to the clipboard.
~/Resource/GetIcon?typeName=blank Create Group	Ctrl+G	Creates a regex group around the selected content in the Code Editor.
content_cut Cut	Ctrl+X	Cuts the current selection and copies it to the clipboard.
~/Resource/GetIcon?typeName=blank End Required Mode	Ctrl+Shift+R	Inserts a regex option to disable required mode in a fuzzy regular expression.
content_paste Paste	Ctrl+V	Pastes the clipboard content at the current cursor position.
redo Redo	Ctrl+Shift+Z	Redoes the last undone edit in the Code Editor.
~/Resource/GetIcon?typeName=blank Start Required Mode	Ctrl+R	Inserts a regex option to enable required mode in a fuzzy regular expression.
undo Undo	Ctrl+Z	Undoes the last edit in the Code Editor.

Child Controls

Name	Type		Summary
Context Menu	Context Menu	►	Displays menu commands related to text editing. Overview The Context Menu provides quick access to editing commands and options within the Code Editor. It appears when you right-click inside the editor, offering grouped commands for clipboard operations, undo/redo, commenting, and more. Usage Guidance Use the Context Menu to perform editing actions quickly without leaving the editor. Right-click to open the menu and select the desired command. Keyboard shortcuts and menu icons help you work efficiently. Clipboard commands (Cut, Copy, Paste) are available for text manipulation. Undo and Redo allow you to revert or repeat changes. Comment and Uncomment commands are available for supported languages. RegEx-specific commands appear when editing regular expressions.

Used By

Query HelperQuery EditorAI HelperCMIS Repository SearcherBatch Process Step - XSLT EditorNDJSON EditorText EditorInstance SearcherOCR ViewerCode Property Editor