wijjit.elements.input.code_editor.CodeEditor

class wijjit.elements.input.code_editor.CodeEditor(id=None, classes=None, tab_index=None, value='', language='python', theme='monokai', filename_hint=None, width=60, height=20, show_line_numbers=True, wrap_mode='none', show_scrollbar=True, border_style='single', capture_tab=True, tab_width=4)[source]

Text editor with syntax highlighting support.

CodeEditor extends TextArea with syntax highlighting powered by Pygments. It supports 500+ programming languages, multiple color themes, and efficient incremental tokenization for large files.

Parameters:

id (str, optional) – Element identifier
value (str, optional) – Initial source code content
language (str, optional) – Programming language (e.g., “python”, “javascript”, “rust”). Use “auto” for automatic detection, or None to disable highlighting.
theme (str, optional) – Color theme name (default: “monokai”). Available: “monokai”, “dracula”, “github-light”, “nord”
filename_hint (str, optional) – Filename hint for auto-detection (e.g., “main.py”)
width (int, optional) – Display width in columns (default: 60)
height (int, optional) – Display height in rows (default: 20)
show_line_numbers (bool, optional) – Whether to show line numbers (default: True)
wrap_mode ({"none", "soft"}, optional) – Line wrapping mode (default: “none”)
show_scrollbar (bool, optional) – Whether to show vertical scrollbar (default: True)
border_style (str or None, optional) – Border style: “single”, “double”, “rounded”, or None (default: “single”)
capture_tab (bool, optional) – Whether Tab inserts an indent instead of moving focus (default: True, unlike TextArea). Shift+Tab still moves focus backward, so the editor can always be left.
tab_width (int, optional) – Number of spaces one Tab inserts (default: 4)
classes (str | list[str] | set[str] | None)
tab_index (int | None)

Variables:

highlighter (SyntaxHighlighter) – Syntax highlighting manager
show_line_numbers (bool) – Whether line numbers are displayed
line_number_width (int) – Width reserved for line numbers (calculated from content)

Examples

Create a Python code editor:

>>> editor = CodeEditor(
...     language="python",
...     theme="monokai",
...     value="def hello():\n    print('Hello!')"
... )

Create an auto-detecting editor:

>>> editor = CodeEditor(
...     language="auto",
...     filename_hint="script.js"
... )

Notes

Performance considerations: - Initial tokenization takes ~150ms for 1000 lines - Cached token lookup is instant (~0.04ms for viewport) - Small edits trigger debounced incremental re-tokenization - Large operations (paste, undo) trigger full re-tokenization

__init__(id=None, classes=None, tab_index=None, value='', language='python', theme='monokai', filename_hint=None, width=60, height=20, show_line_numbers=True, wrap_mode='none', show_scrollbar=True, border_style='single', capture_tab=True, tab_width=4)[source]

Parameters:

id (str | None)
classes (str | list[str] | set[str] | None)
tab_index (int | None)
value (str)
language (str | None)
theme (str)
filename_hint (str | None)
width (int)
height (int)
show_line_numbers (bool)
wrap_mode (Literal['none', 'soft'])
show_scrollbar (bool)
border_style (Literal['single', 'double', 'rounded'] | None)
capture_tab (bool)
tab_width (int)

Return type:

None

Methods

`__init__`([id, classes, tab_index, value, ...])
`add_class`(class_name)	Add a CSS class to this element.
`apply_props`(props)	Apply props from a VNode, skipping ephemeral props.
`get_ephemeral_state`()	Get ephemeral_state for reconciliation.
`get_hardware_cursor_position`()	Absolute screen cell where the hardware terminal cursor should park.
`get_height_for_width`(width)	Return the height this element needs when laid out at `width`.
`get_intrinsic_size`()	Get the intrinsic size of the text area, including borders.
`get_value`()	Get the full text content.
`handle_key`(key)	Handle keyboard input, recording undo history around any edit.
`handle_mouse`(event)	Handle mouse input.
`has_class`(class_name)	Check if element has a CSS class.
`on_blur`()	Called when element loses focus.
`on_focus`()	Called when element gains focus.
`on_hover_enter`()	Called when mouse enters element.
`on_hover_exit`()	Called when mouse exits element.
`on_mount`()	Called when element is first added to the element tree.
`on_unmount`()	Called when element is removed from the element tree.
`on_update`(changed_props)	Handle prop updates during reconciliation.
`redo`()	Re-apply the most recently undone edit.
`remove_class`(class_name)	Remove a CSS class from this element.
`render_signature`()	Hashable/comparable capture of everything `render_to()` reads.
`render_to`(ctx)	Render code editor using cell-based rendering.
`restore_ephemeral_state`(state)	Restore ephemeral state after reconciliation.
`restore_scroll_position_x`(position)	Restore horizontal scroll position from saved state.
`rewrap_content`([new_width])	Explicitly re-wrap all content to a new width.
`set_bounds`(bounds)	Set bounds and dynamically resize if needed.
`set_language`(language)	Set the syntax highlighting language.
`set_theme`(theme)	Set the color theme.
`set_value`(text)	Set the editor content and trigger tokenization.
`toggle_class`(class_name)	Toggle a CSS class on this element.
`undo`()	Revert the most recent edit.

Attributes

`captures_tab`	Whether Tab inserts an indent here instead of moving focus.
`language`	Get the current syntax highlighting language.
`parent_frame`	Get the parent Frame if this element is inside a scrollable frame.
`scroll_position_x`	Get the current horizontal scroll position.
`supports_dynamic_sizing`	Whether this TextArea supports dynamic sizing.
`theme`	Get the current color theme.
`value`	Full text content as a single newline-joined string.

__deepcopy__(memo)[source]

Create a deep copy, excluding unpicklable objects.

Parameters:: memo (dict) – Memoization dictionary for deepcopy
Returns:: Deep copy of this editor
Return type:: CodeEditor

set_value(text)[source]

Set the editor content and trigger tokenization.

Parameters:: text (str) – Source code content
Return type:: None

set_language(language)[source]

Set the syntax highlighting language.

Parameters:: language (str or None) – Language name (e.g., “python”), “auto”, or None to disable
Return type:: None

set_theme(theme)[source]

Set the color theme.

Parameters:: theme (str) – Theme name (e.g., “monokai”, “dracula”)
Return type:: None

property language: str | None

Get the current syntax highlighting language.

Returns:: Current language name, or None if highlighting is disabled
Return type:: str or None

property theme: str

Get the current color theme.

Returns:: Current theme name
Return type:: str

render_to(ctx)[source]

Render code editor using cell-based rendering.

Parameters:: ctx (PaintContext) – Paint context with buffer, style resolver, and bounds
Return type:: None

Notes

Extends TextArea rendering to add: - Syntax highlighting via cached tokens - Line numbers (optional) - Theme-based token coloring