Add rich-text alignment controls (left/center/right)

Shared RichTextEditor gains @tiptap/extension-text-align for heading and
paragraph nodes, serializing alignment as inline text-align on the block
node so it round-trips through save/reload. Fixed once at the shared
component so it also flows into the upcoming rich_text and two_column
page blocks.

Server sanitize allowlist now permits `style` on p/h1-h6, constrained by
allowedStyles to text-align (left/right/center/justify) only; all other
CSS properties and values are stripped.

Step 1 of the CMS Page Builder spec.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-07-09 20:21:17 -05:00
parent d7fc2dccb7
commit 6180e8a071
4 changed files with 60 additions and 0 deletions

View File

@@ -18,6 +18,19 @@ const OPTIONS = {
span: ['data-wiki-slug'], // marks internal wiki links (used from Phase 3)
th: ['colspan', 'rowspan'],
td: ['colspan', 'rowspan'],
// Block alignment from the rich-text editor. `style` is only honored for the
// properties/values whitelisted in allowedStyles below — everything else in
// the style attribute is stripped.
p: ['style'],
h1: ['style'], h2: ['style'], h3: ['style'],
h4: ['style'], h5: ['style'], h6: ['style'],
},
// Restrict inline styles to text-align (left/right/center/justify) only. Any
// other CSS property, or an unlisted value, is discarded.
allowedStyles: {
'*': {
'text-align': [/^(left|right|center|justify)$/],
},
},
// http/https for links and images, mailto for links, plus relative URLs so
// uploaded images (/uploads/...) and internal links (/wiki/...) pass through.