A plain-text source editor using the browser's contenteditable="plaintext-only" editing surface. It keeps text, caret, native undo and composition through updates. Use cem-textarea for submitted form values and cem-workspace for an IDE layout. Source text is never executed or inserted as HTML.
This shared code editor powers the cem-demo-element playground. Explore the components gallery for related controls.
Full examples and variation matrix · Property playground · Automated stories
label | Visible fallback label; default Source code. |
|---|---|
aria-label | Separate accessible textbox name. |
content-type | Native source language; plain text by default. HTML, CEM-ML and CSS currently provide lossless coloring. |
highlight | auto or off; paint is separate from source-changing formatting. |
source-id | Optional project/resource identity; changes cancel pending paint. |
value | Initial or controlled plain source text; .value updates silently. |
readonly | Presence makes source selectable but not editable. |
disabled | Presence prevents editing and removes the tab stop. |
fit | content or fill; fill needs a definite parent height. |
describedby | ID of external help text. |
selection-request | Nonempty request identity; change to apply a range once. |
selection-start | Nonnegative UTF-16 start offset. |
selection-end | Nonnegative UTF-16 end offset. |
selection-direction | none, forward or backward. |
selection-focus | Presence explicitly focuses the requested range. |
hidden | Native presence-based visibility. |
class | Native host class and inherited token overrides. |
dir | Inherited ltr or rtl direction. |
Slots: label replaces the visible fallback with projected markup. The native editor has role=textbox and aria-multiline=true. This component is a document editor, not a form-associated control; use .value or declarative input bindings. Native semantic coloring is enabled with content-type=text/cem-ml, text/html or text/css. Coloring preserves source and native editing; highlight=off disables it. Other types stay plain.