feat(rich-text): HTML source view in the toolbar #102

Merged

pienter merged 2 commits from task/pienter-ui__rich-text-field__source-view-toggle into main

2026-09-19 22:40:18 +00:00

pienter commented

2026-09-19 22:00:56 +00:00

Owner

Stacked on the richtext field type PR (#99).

A Source toggle as the last toolbar control, with a new code icon (Feather artwork supplied by Korneel).
Source mode swaps the editor for a monospace textarea with the HTML, one block element per line, inside the same field border and with the same label, hint, error and required ARIA. The id moves to the textarea, so error summaries still reach the field.
Edits apply on blur and on toggling back. The source goes through the editor's schema and only the normalised value reaches the model: a <table>, a <script> or target="_blank" typed there is dropped, and the textarea is rewritten to show what survived.
A round trip without edits emits nothing, so the form stays clean.
The other controls are disabled in source mode; Ctrl/Cmd+K does nothing there. No source view in read-only. No opt-out prop. No new CSS tokens.

Checks: typecheck, lint, format, tests (59), build:vue, build:storybook green. Exercised in Storybook and in the playground (blog edit, a BlockEditor section, dark theme).

Not verified: focus returning into the editor when leaving source mode (hidden automation tab stalls Tiptap's requestAnimationFrame focus), real-keypress tab order, light theme screenshot.

Stacked on the richtext field type PR (#99). - A **Source** toggle as the last toolbar control, with a new `code` icon (Feather artwork supplied by Korneel). - Source mode swaps the editor for a monospace textarea with the HTML, one block element per line, inside the same field border and with the same label, hint, error and required ARIA. The `id` moves to the textarea, so error summaries still reach the field. - Edits apply on blur and on toggling back. The source goes through the editor's schema and only the normalised value reaches the model: a `<table>`, a `<script>` or `target="_blank"` typed there is dropped, and the textarea is rewritten to show what survived. - A round trip without edits emits nothing, so the form stays clean. - The other controls are disabled in source mode; Ctrl/Cmd+K does nothing there. No source view in read-only. No opt-out prop. No new CSS tokens. Checks: typecheck, lint, format, tests (59), `build:vue`, `build:storybook` green. Exercised in Storybook and in the playground (blog edit, a BlockEditor section, dark theme). Not verified: focus returning into the editor when leaving source mode (hidden automation tab stalls Tiptap's `requestAnimationFrame` focus), real-keypress tab order, light theme screenshot.

pienter added 1 commit

2026-09-19 22:00:56 +00:00

feat(rich-text): HTML source view in the toolbar

ci / typecheck (pull_request) Successful in 32s

Details

ci / lint (pull_request) Successful in 34s

Details

ci / format (pull_request) Successful in 35s

Details

ci / release (pull_request) Has been skipped

Details

f53755696d

A Source toggle, last in the toolbar, swaps the editor for a monospace
textarea holding the HTML, one block element per line. Edits apply on blur
and on toggling back: the source goes through the editor's schema and the
model only receives the normalised value, so a table, a script or a link
target typed there is dropped. A round trip without edits emits nothing.
The other controls are disabled in source mode. Adds the `code` icon.

pienter referenced this pull request

2026-09-19 22:05:57 +00:00

feat(rich-text): drop blockquote from the formatting set #103

pienter changed target branch from task/pienter-ui__rich-text-field__richtext-field-type to main

2026-09-19 22:35:41 +00:00

pienter added 1 commit

2026-09-19 22:39:02 +00:00

Merge branch 'main' into task/pienter-ui__rich-text-field__source-view-toggle

ci / typecheck (pull_request) Successful in 30s

Details

ci / lint (pull_request) Successful in 33s

Details