@designcrowd/library.brand-page 6.0.19 → 6.0.20

package/src/metadata-builder/helpers/rte.helpers.ts

@@ -1,4 +1,4 @@
-import type { RichTextValue, TextStyleDeclaration } from '../../brand-page';
+import type { TextStyleDeclaration } from '../../brand-page';
 import { getRTEColor } from '../../brand-page-maker/utils';
 import { useExternalRichTextEditor } from '../../brand-page-maker/composables/rich-text-editor/useRichTextEditor';
 import { getRenderText } from '../../brand-page/utils';
@@ -11,21 +11,16 @@ import {
 
 export const applyStyleToRTEText = (
   externalEditor: Editor,
-  contentText: RichTextValue,
+  contentText: string,
   newContentStyle: TextStyleDeclaration,
 ) => {
   if (!contentText) {
     return contentText;
   }
 
-  // BP-5787: operate natively on the Tiptap doc. setContent accepts a JSON
-  // document or an HTML string; the style is applied via editor commands and
-  // the result is returned as JSON — no HTML round-trip.
-  const content =
-    typeof contentText === 'string' &&
-    contentText.includes(ESCAPED_NEWLINE_CHARACTER)
-      ? getRenderText(contentText)
-      : contentText;
+  const content = contentText.includes(ESCAPED_NEWLINE_CHARACTER)
+    ? getRenderText(contentText)
+    : contentText;
 
   externalEditor.commands.setContent(content);
 
@@ -82,8 +77,9 @@ export const applyStyleToRTEText = (
       : chain.unsetItalic();
 
   chain.run();
+  const html = externalEditor.getHTML();
 
-  return externalEditor.getJSON();
+  return html;
 };
 
 /**

package/src/shared/content-settings/components/GenericTextInput.mixin.ts

@@ -175,23 +175,7 @@ export default defineComponent({
     },
   },
   watch: {
-    value(newVal: string | undefined, oldVal: string | undefined) {
-      // BP-5787: RTE values are Tiptap JSON objects. The parent (TextItemsField)
-      // re-clones its items array (cloneDeep) on ANY change — including a sibling
-      // field's style sync — yielding a NEW object reference with identical text
-      // content. For objects Vue fires this watcher on reference change, so that
-      // spurious re-clone would overwrite `_value` and clobber an in-flight edit
-      // (a mark applied but not yet debounced to the store), silently dropping
-      // the user's formatting. Strings never hit this (same content = same
-      // reference = no fire), so mirror that: ignore re-clones whose content is
-      // unchanged from the previous prop value.
-      if (
-        this.showRichTextEditor &&
-        JSON.stringify(newVal) === JSON.stringify(oldVal)
-      ) {
-        return;
-      }
-
+    value(newVal: string | undefined) {
       this._value = newVal;
 
       if (this.showRichTextEditor) {

package/src/shared/content-settings/components/content-settings-item/ContentSettingsItemField.mixin.ts

@@ -21,9 +21,6 @@ import {
   replaceTextInRTE,
   RTE_ALLOWED_SECTION_TYPES,
   isRTEManagedStyleField,
-  isTiptapDocument,
-  renderRteToHtml,
-  toRteJson,
 } from '@brand-page-maker/utils';
 import { isDefaultContentText } from '@shared/content-settings/utils';
 import { useUiLogoSettingsStore } from '../../../logo-settings/store';
@@ -324,20 +321,10 @@ export default defineComponent({
       this.isToggled = isToggled;
     },
     onUseGeneratedText(generatedText: string) {
-      let formattedText: unknown = generatedText;
+      let formattedText = generatedText;
 
-      // BP-5787: preserve the field's formatting when dropping in AI text.
-      // replaceTextInRTE is HTML-based, so JSON is rendered/parsed around it
-      // (cold AI path, shared editor); string fields use it directly.
-      if (this.showRichTextEditor) {
-        if (isTiptapDocument(this.value)) {
-          formattedText =
-            toRteJson(
-              replaceTextInRTE(renderRteToHtml(this.value), generatedText),
-            ) ?? generatedText;
-        } else if (typeof this.value === 'string') {
-          formattedText = replaceTextInRTE(this.value, generatedText);
-        }
+      if (this.showRichTextEditor && typeof this.value === 'string') {
+        formattedText = replaceTextInRTE(this.value, generatedText);
       }
 
       this.contentSettingsStore.updateItemValue({

package/src/utils/minify-brand-page-metadata.ts

@@ -10,7 +10,7 @@ import {
 } from '../brand-page/models';
 import type { Content, ContentType } from '../brand-page/models/content.model';
 import type { TextStyleDeclaration } from '../brand-page/models/styles.model';
-import { hasRTEContent, isTiptapDocument } from '../brand-page-maker/utils';
+import { hasRTEContent } from '../brand-page-maker/utils';
 import { useExternalRichTextEditor } from '../brand-page-maker/composables/rich-text-editor/useRichTextEditor';
 import type { Editor, JSONContent } from '@tiptap/vue-3';
 import {
@@ -106,9 +106,6 @@ const convertText = (
   value: unknown,
   editor: Editor,
 ): RichTextValue | undefined => {
-  // Already Tiptap JSON (BP-5787 storage) — keep as-is.
-  if (isTiptapDocument(value)) return value;
-
   if (typeof value !== 'string' || !value) return undefined;
 
   if (hasRTEContent(value)) {

package/lib/src/brand-page/utils/migration/migration-19.d.ts

@@ -1,2 +0,0 @@
-import type { MigrationData } from '../migration.util';
-export declare const migration19: (migrationResult: MigrationData) => Promise<MigrationData>;

package/lib/src/brand-page/utils/migration/migration-19.js

@@ -1,71 +0,0 @@
-import { hasRTEContent } from '../../../brand-page-maker/utils';
-import { useExternalRichTextEditor } from '../../../brand-page-maker/composables/rich-text-editor/useRichTextEditor';
-/**
- * BP-5787 — migrate existing inline-HTML RTE content to Tiptap JSON.
- *
- * The editor now emits, and the renderer now reads, Tiptap JSON. Existing
- * published/saved sites still hold RTE fields as HTML strings. This converts
- * them on load:
- *   - maker: the loaded model is JSON, so the next save persists JSON.
- *   - web-renderer: lazy migrate-on-read — old sites render from JSON without
- *     needing a re-save.
- *
- * Runs on EVERY load (runAlways) so it also normalises content the AI section
- * builders still emit as HTML — there is no need to change those builders or
- * widen the content model types.
- *
- * Scope: only HTML-RTE strings (hasRTEContent) are converted. Plain strings,
- * numbers, and already-JSON docs are left untouched, so the migration is
- * idempotent (re-running on JSON content is a no-op — non-string values are
- * skipped). Nested RTE inside item arrays (textItems, testimonials, images…)
- * is handled by recursing into arrays; style objects are intentionally not
- * descended into (they never hold RTE content).
- */
-const convertRteStringsToJson = (value, editor) => {
-    if (Array.isArray(value)) {
-        value.forEach((item) => convertRteStringsToJson(item, editor));
-        return;
-    }
-    if (!value || typeof value !== 'object')
-        return;
-    const record = value;
-    Object.keys(record).forEach((key) => {
-        const field = record[key];
-        if (typeof field === 'string' && hasRTEContent(field)) {
-            editor.commands.setContent(field);
-            record[key] = editor.getJSON();
-        }
-        else if (Array.isArray(field)) {
-            convertRteStringsToJson(field, editor);
-        }
-    });
-};
-export const migration19 = async (migrationResult) => {
-    const { brandPageModel } = migrationResult;
-    // HTML→JSON parsing needs a DOM (Tiptap's editor). In a DOM-less context
-    // (pure-node SSR or unit tests) we can't parse HTML, so we leave the RTE
-    // fields as HTML strings — the renderer and the fraud/translation extractors
-    // all dual-read HTML, so this is safe. Conversion happens wherever a DOM is
-    // available (the browser editor, jsdom).
-    if (typeof window === 'undefined' || typeof document === 'undefined') {
-        return migrationResult;
-    }
-    let externalEditor;
-    try {
-        externalEditor = useExternalRichTextEditor().externalEditor;
-    }
-    catch {
-        return migrationResult;
-    }
-    try {
-        for (const page of brandPageModel.pages) {
-            for (const content of page.contents) {
-                convertRteStringsToJson(content, externalEditor);
-            }
-        }
-    }
-    finally {
-        externalEditor.destroy();
-    }
-    return migrationResult;
-};

package/lib/src/brand-page-maker/__fixtures__/complex-rte.fixture.d.ts

@@ -1,22 +0,0 @@
-/**
- * BP-5787 — golden-master fixture for the RTE HTML→JSON migration.
- *
- * A single rich-text value that exercises every mark/node the editor can emit,
- * so one snapshot guards the whole serialisation surface. Captured as a baseline
- * on the current HTML pipeline; after the migration the JSON pipeline must
- * reproduce byte-identical rendered output (see rte-render-parity.test.ts).
- *
- * Coverage:
- *  - block nodes: heading (h2), paragraph, text-align (center / right)
- *  - inline marks: bold, italic, underline, strike
- *  - textStyle attrs: fontFamily, fontSize (em), letterSpacing (em), lineHeight (unitless)
- *  - colour: theme TOKEN ref (var(--logo-text-color)) AND a literal hex (#FF0000)
- *  - highlight (background colour via <mark>)
- *  - links: internal (target=_self) and external (target=_blank rel=noopener)
- */
-export declare const COMPLEX_RTE_HTML = "<h2 style=\"text-align: center\"><span style=\"color: var(--logo-text-color)\">Themed heading</span></h2><p><strong>bold</strong> <em>italic</em> <u>underline</u> <s>strike</s> <span style=\"font-family: Montserrat; font-size: 1.5em; letter-spacing: 0.05em; line-height: 1.4\">styled span</span> <mark data-color=\"#ffe08a\" style=\"background-color: #ffe08a\">highlight</mark> <span style=\"color: #FF0000\">literal hex</span> <a target=\"_self\" href=\"/about\">internal link</a> <a target=\"_blank\" rel=\"noopener noreferrer nofollow\" href=\"https://example.com\">external link</a></p><p style=\"text-align: right\">second paragraph, right-aligned</p>";
-/**
- * The theme-token CSS variable that MUST survive the HTML→JSON round-trip
- * (BP-5787 stores token refs instead of flattening them to rgb()).
- */
-export declare const THEME_TOKEN_REF = "var(--logo-text-color)";

package/lib/src/brand-page-maker/__fixtures__/complex-rte.fixture.js

@@ -1,22 +0,0 @@
-/**
- * BP-5787 — golden-master fixture for the RTE HTML→JSON migration.
- *
- * A single rich-text value that exercises every mark/node the editor can emit,
- * so one snapshot guards the whole serialisation surface. Captured as a baseline
- * on the current HTML pipeline; after the migration the JSON pipeline must
- * reproduce byte-identical rendered output (see rte-render-parity.test.ts).
- *
- * Coverage:
- *  - block nodes: heading (h2), paragraph, text-align (center / right)
- *  - inline marks: bold, italic, underline, strike
- *  - textStyle attrs: fontFamily, fontSize (em), letterSpacing (em), lineHeight (unitless)
- *  - colour: theme TOKEN ref (var(--logo-text-color)) AND a literal hex (#FF0000)
- *  - highlight (background colour via <mark>)
- *  - links: internal (target=_self) and external (target=_blank rel=noopener)
- */
-export const COMPLEX_RTE_HTML = `<h2 style="text-align: center"><span style="color: var(--logo-text-color)">Themed heading</span></h2><p><strong>bold</strong> <em>italic</em> <u>underline</u> <s>strike</s> <span style="font-family: Montserrat; font-size: 1.5em; letter-spacing: 0.05em; line-height: 1.4">styled span</span> <mark data-color="#ffe08a" style="background-color: #ffe08a">highlight</mark> <span style="color: #FF0000">literal hex</span> <a target="_self" href="/about">internal link</a> <a target="_blank" rel="noopener noreferrer nofollow" href="https://example.com">external link</a></p><p style="text-align: right">second paragraph, right-aligned</p>`;
-/**
- * The theme-token CSS variable that MUST survive the HTML→JSON round-trip
- * (BP-5787 stores token refs instead of flattening them to rgb()).
- */
-export const THEME_TOKEN_REF = 'var(--logo-text-color)';

package/lib/src/brand-page-maker/composables/rich-text-editor/extensions/FontFamily.d.ts

@@ -1,14 +0,0 @@
-/**
- * BP-5787 — font-family with quote-stripping parse.
- *
- * The stock extension stores whatever `element.style.fontFamily` returns. For
- * multi-word families (e.g. "Open Sans", "Playwrite AU") the browser quotes the
- * value, so parsing HTML — pasting RTE-styled text between editors, or the
- * HTML→JSON migration — yields a value that still contains the quote chars
- * (`"Open Sans"`). That value then (a) no longer matches the font list and,
- * worse, (b) is dropped by the native RTE sanitiser (`sanitizeRteJson`), whose
- * `isSafeCssValue` rejects any value containing `"` `'` `;` — so the font is
- * silently lost. Mirror the FontSize/LetterSpacing extensions and strip the
- * quotes on parse so the stored value is always the bare family name.
- */
-export declare const FontFamily: import("@tiptap/core").Extension<import("@tiptap/extension-font-family").FontFamilyOptions, any>;

package/lib/src/brand-page-maker/composables/rich-text-editor/extensions/FontFamily.js

@@ -1,39 +0,0 @@
-import TiptapFontFamily from '@tiptap/extension-font-family';
-/**
- * BP-5787 — font-family with quote-stripping parse.
- *
- * The stock extension stores whatever `element.style.fontFamily` returns. For
- * multi-word families (e.g. "Open Sans", "Playwrite AU") the browser quotes the
- * value, so parsing HTML — pasting RTE-styled text between editors, or the
- * HTML→JSON migration — yields a value that still contains the quote chars
- * (`"Open Sans"`). That value then (a) no longer matches the font list and,
- * worse, (b) is dropped by the native RTE sanitiser (`sanitizeRteJson`), whose
- * `isSafeCssValue` rejects any value containing `"` `'` `;` — so the font is
- * silently lost. Mirror the FontSize/LetterSpacing extensions and strip the
- * quotes on parse so the stored value is always the bare family name.
- */
-export const FontFamily = TiptapFontFamily.extend({
-    addGlobalAttributes() {
-        return [
-            {
-                types: this.options.types,
-                attributes: {
-                    fontFamily: {
-                        default: null,
-                        // Strip quotes only — keep '' for an absent value so the stored
-                        // JSON shape matches the other textStyle attrs (FontSize etc.).
-                        parseHTML: (element) => element.style.fontFamily?.replace(/['"]+/g, ''),
-                        renderHTML: (attributes) => {
-                            if (!attributes.fontFamily) {
-                                return {};
-                            }
-                            return {
-                                style: `font-family: ${attributes.fontFamily}`,
-                            };
-                        },
-                    },
-                },
-            },
-        ];
-    },
-});

package/lib/src/brand-page-maker/composables/rich-text-editor/getRteExtensions.d.ts

@@ -1,28 +0,0 @@
-import type { Extensions } from '@tiptap/vue-3';
-/**
- * Single source of truth for the Tiptap extension set (BP-5787).
- *
- * The live editor, the headless serialiser (useExternalRichTextEditor), and
- * the upcoming render-from-JSON path must all use the SAME extensions, or
- * rendered output drifts from what the user authored. This factory removes the
- * previous duplication while preserving each consumer's exact configuration.
- *
- * Known, intentional differences are parameterised:
- *  - `restrictStarterKit` — the live editor disables list/hr/code nodes.
- *  - `includeLinkRel` — the headless/render path emits rel="noopener noreferrer";
- *    the live editing surface does not.
- *  - `editing` — only the live editor carries the Placeholder + MaxLength plugins
- *    (neither affects serialised output; they are editing-time only).
- */
-export interface RteExtensionOptions {
-    /** Disable StarterKit nodes the editor doesn't use (lists, hr, code). */
-    restrictStarterKit?: boolean;
-    /** Emit rel="noopener noreferrer" on link HTMLAttributes (render path). */
-    includeLinkRel?: boolean;
-    /** When present, add the live-editing-only plugins (Placeholder, MaxLength). */
-    editing?: {
-        placeholder?: string;
-        maxLength?: number;
-    };
-}
-export declare const getRteExtensions: (options?: RteExtensionOptions) => Extensions;

package/lib/src/brand-page-maker/composables/rich-text-editor/getRteExtensions.js

@@ -1,66 +0,0 @@
-import StarterKit from '@tiptap/starter-kit';
-import Underline from '@tiptap/extension-underline';
-import TextStyle from '@tiptap/extension-text-style';
-import TextAlign from '@tiptap/extension-text-align';
-import ColorExtension from '@tiptap/extension-color';
-import Highlight from '@tiptap/extension-highlight';
-import Placeholder from '@tiptap/extension-placeholder';
-import Link from '@tiptap/extension-link';
-import { FontFamily } from './extensions/FontFamily';
-import { FontSize } from './extensions/FontSize';
-import { LetterSpacing } from './extensions/LetterSpacing';
-import { LineHeight } from './extensions/LineHeight';
-import { MaxLength } from './extensions/MaxLength';
-import { AutoLink } from './extensions/AutoLink';
-import { isHrefPageId } from './hyperlink';
-export const getRteExtensions = (options = {}) => {
-    const { restrictStarterKit = false, includeLinkRel = false, editing, } = options;
-    const extensions = [
-        restrictStarterKit
-            ? StarterKit.configure({
-                bulletList: false,
-                orderedList: false,
-                listItem: false,
-                horizontalRule: false,
-                codeBlock: false,
-                code: false,
-            })
-            : StarterKit,
-        Underline,
-        TextStyle.configure({ mergeNestedSpanStyles: true }),
-        TextAlign.configure({
-            types: ['heading', 'paragraph'],
-        }),
-        FontFamily.configure({
-            types: ['textStyle'],
-        }),
-        FontSize,
-        LetterSpacing,
-        LineHeight,
-        ColorExtension.configure({
-            types: ['textStyle'],
-        }),
-        Highlight.configure({
-            multicolor: true,
-        }),
-    ];
-    // Live-editing-only plugins sit between Highlight and Link (original order).
-    if (editing) {
-        extensions.push(Placeholder.configure({ placeholder: editing.placeholder }), MaxLength.configure({ maxLength: editing.maxLength }));
-    }
-    extensions.push(Link.configure({
-        openOnClick: false,
-        defaultProtocol: 'https',
-        autolink: true,
-        HTMLAttributes: (attrs) => {
-            const href = attrs.href;
-            const isExternal = href && (href.startsWith('http://') || href.startsWith('https://'));
-            return {
-                ...(includeLinkRel && { rel: 'noopener noreferrer' }),
-                target: isExternal ? '_blank' : null,
-            };
-        },
-        isAllowedUri: (url, ctx) => ctx.defaultValidate(url) || isHrefPageId(url),
-    }), AutoLink);
-    return extensions;
-};

package/lib/src/brand-page-maker/utils/rte-render.util.d.ts

@@ -1,33 +0,0 @@
-import { type JSONContent } from '@tiptap/vue-3';
-import { isTiptapDocument, getRteJsonPlainText } from './rich-text-editor.util';
-export { isTiptapDocument, getRteJsonPlainText };
-/**
- * BP-5787 — the boundary plumbing for storing RTE as Tiptap JSON.
- *
- * An RTE field is either a legacy inline-HTML string (pre-migration, or a
- * not-yet-migrated published site) or a Tiptap JSON document (post-migration).
- * These helpers let every consumer treat the two uniformly:
- *
- *   - isTiptapDocument — the canonical discriminator (object with type 'doc').
- *   - renderRteToHtml  — render either form to final HTML for display.
- *   - toRteJson        — normalise either form to JSON for storage.
- *
- *   - renderRteToHtml uses a DOM-less serialiser (works on the server).
- *   - toRteJson uses a headless editor to PARSE HTML → JSON, so it only runs
- *     where a DOM exists (browser, or jsdom in tests); the server never parses
- *     HTML (migration-18 is DOM-guarded, translation/fraud walk JSON directly).
- */
-export type RichTextValue = string | JSONContent;
-/**
- * Render an RTE value to final HTML. Legacy HTML strings pass through untouched
- * (they are already HTML); Tiptap JSON is serialised by a DOM-less pure
- * function (rte-serializer) — no editor, no DOM — so it works on the server
- * (SSR/publish), not just the browser, and is cheap enough to run per render.
- */
-export declare const renderRteToHtml: (value: RichTextValue | null | undefined) => string;
-/**
- * Normalise an RTE value to a Tiptap JSON document. HTML strings are parsed
- * via the headless editor; documents pass through unchanged. Returns
- * undefined for empty/blank input so callers can omit empty fields.
- */
-export declare const toRteJson: (value: RichTextValue | null | undefined) => JSONContent | undefined;

package/lib/src/brand-page-maker/utils/rte-render.util.js

@@ -1,50 +0,0 @@
-import { Editor } from '@tiptap/vue-3';
-import { getRteExtensions } from '../composables/rich-text-editor/getRteExtensions';
-import { isTiptapDocument, getRteJsonPlainText } from './rich-text-editor.util';
-import { serializeRteJsonToHtml } from './rte-serializer';
-export { isTiptapDocument, getRteJsonPlainText };
-/**
- * Run a function with a short-lived headless editor (created then destroyed).
- * Used only by toRteJson (HTML → JSON parsing), which needs a real DOM. Not
- * used by the render path, which is DOM-less.
- */
-const withHeadlessEditor = (fn) => {
-    const editor = new Editor({
-        editable: false,
-        extensions: getRteExtensions({ includeLinkRel: true }),
-    });
-    try {
-        return fn(editor);
-    }
-    finally {
-        editor.destroy();
-    }
-};
-/**
- * Render an RTE value to final HTML. Legacy HTML strings pass through untouched
- * (they are already HTML); Tiptap JSON is serialised by a DOM-less pure
- * function (rte-serializer) — no editor, no DOM — so it works on the server
- * (SSR/publish), not just the browser, and is cheap enough to run per render.
- */
-export const renderRteToHtml = (value) => {
-    if (value == null || value === '')
-        return '';
-    if (typeof value === 'string')
-        return value;
-    return serializeRteJsonToHtml(value);
-};
-/**
- * Normalise an RTE value to a Tiptap JSON document. HTML strings are parsed
- * via the headless editor; documents pass through unchanged. Returns
- * undefined for empty/blank input so callers can omit empty fields.
- */
-export const toRteJson = (value) => {
-    if (value == null || value === '')
-        return undefined;
-    if (isTiptapDocument(value))
-        return value;
-    return withHeadlessEditor((editor) => {
-        editor.commands.setContent(value);
-        return editor.getJSON();
-    });
-};

package/lib/src/brand-page-maker/utils/rte-sanitize.util.d.ts

@@ -1,6 +0,0 @@
-import type { JSONContent } from '@tiptap/vue-3';
-/**
- * Sanitise a Tiptap JSON document (returns a new clean doc). Returns a minimal
- * empty doc if the input isn't a usable document.
- */
-export declare const sanitizeRteJson: (doc: unknown) => JSONContent;

package/lib/src/brand-page-maker/utils/rte-sanitize.util.js

@@ -1,158 +0,0 @@
-import { validateAndSanitizeHref } from './rich-text-editor.util';
-/**
- * BP-5787 — native JSON sanitiser for RTE content.
- *
- * Operates directly on the Tiptap document tree: no editor instantiation, no
- * HTML round-trip, no DOMPurify. This is the hot path (runs on every editor
- * update and on the server sanitise gate), so it is a single, allocation-light
- * recursive walk.
- *
- * Security model (mirrors the HTML allowlist it replaces):
- *  - only allow-listed node and mark types survive; everything else is dropped;
- *  - textStyle / highlight attrs are restricted to known keys whose values must
- *    be "safe CSS values" (no quotes/angle-brackets/extra declarations/url()/
- *    expression()), preventing CSS-injection when the value is later rendered
- *    into a `style="…"` attribute;
- *  - link hrefs go through the same validateAndSanitizeHref used by the HTML
- *    sanitiser; unsafe links lose their href (and the mark);
- *  - heading levels are clamped to 1–6.
- */
-// ProseMirror node types the editor schema can legitimately produce.
-const ALLOWED_NODE_TYPES = new Set([
-    'doc',
-    'paragraph',
-    'heading',
-    'text',
-    'hardBreak',
-    'bulletList',
-    'orderedList',
-    'listItem',
-    'blockquote',
-    'codeBlock',
-    'horizontalRule',
-]);
-// Inline mark types the editor produces (strong/em/u/s/code/span/mark/a).
-const ALLOWED_MARK_TYPES = new Set([
-    'bold',
-    'italic',
-    'underline',
-    'strike',
-    'code',
-    'textStyle',
-    'highlight',
-    'link',
-]);
-// textStyle attrs map to the allow-listed CSS properties (font-weight →
-// bold mark, text-decoration → underline/strike, text-align → node attr,
-// background-color → highlight, so they are intentionally not here).
-const ALLOWED_TEXT_STYLE_ATTRS = new Set([
-    'color',
-    'fontFamily',
-    'fontSize',
-    'letterSpacing',
-    'lineHeight',
-]);
-/**
- * A safe CSS value is a short string free of characters that could inject an
- * extra declaration or escape the attribute, and free of the url()/expression()
- * vectors. Legitimate values — `rgb(255, 0, 0)`, `#FF0000`,
- * `var(--logo-text-color)`, `Open Sans`, `1.5em` — all pass.
- */
-const isSafeCssValue = (value) => typeof value === 'string' &&
-    value.length > 0 &&
-    value.length <= 200 &&
-    !/[<>"';]/.test(value) &&
-    !/url\s*\(/i.test(value) &&
-    !/expression\s*\(/i.test(value);
-const sanitizeTextStyleAttrs = (attrs) => {
-    const clean = {};
-    for (const key of Object.keys(attrs)) {
-        if (!ALLOWED_TEXT_STYLE_ATTRS.has(key))
-            continue;
-        const value = attrs[key];
-        // Tiptap emits '' for unset textStyle slots — preserve them.
-        if (value === '' || value == null) {
-            clean[key] = '';
-        }
-        else if (isSafeCssValue(value)) {
-            clean[key] = value;
-        }
-        // else: drop the unsafe value
-    }
-    return Object.keys(clean).length ? clean : null;
-};
-const sanitizeMark = (mark) => {
-    const type = mark?.type;
-    if (!type || !ALLOWED_MARK_TYPES.has(type))
-        return null;
-    const attrs = mark.attrs;
-    if (type === 'link') {
-        const href = typeof attrs?.href === 'string'
-            ? validateAndSanitizeHref(attrs.href)
-            : null;
-        if (!href)
-            return null; // drop links with unsafe/empty href
-        const cleanAttrs = { href };
-        if (attrs?.target != null)
-            cleanAttrs.target = attrs.target;
-        if (attrs?.rel != null)
-            cleanAttrs.rel = attrs.rel;
-        return { type, attrs: cleanAttrs };
-    }
-    if (type === 'textStyle') {
-        const clean = attrs ? sanitizeTextStyleAttrs(attrs) : null;
-        return clean ? { type, attrs: clean } : null;
-    }
-    if (type === 'highlight') {
-        return isSafeCssValue(attrs?.color)
-            ? { type, attrs: { color: attrs.color } }
-            : { type };
-    }
-    // Plain marks (bold/italic/underline/strike/code) carry no attrs.
-    return { type };
-};
-const ALIGN_VALUES = new Set(['left', 'center', 'right', 'justify']);
-const sanitizeNode = (node) => {
-    const type = node?.type;
-    if (!type || !ALLOWED_NODE_TYPES.has(type))
-        return null;
-    const clean = { type };
-    const attrs = {};
-    if (type === 'heading') {
-        const level = Number(node.attrs?.level);
-        attrs.level = level >= 1 && level <= 6 ? level : 1;
-    }
-    if (type === 'heading' || type === 'paragraph') {
-        const align = node.attrs?.textAlign;
-        if (typeof align === 'string' && ALIGN_VALUES.has(align)) {
-            attrs.textAlign = align;
-        }
-    }
-    if (Object.keys(attrs).length)
-        clean.attrs = attrs;
-    if (typeof node.text === 'string')
-        clean.text = node.text;
-    if (Array.isArray(node.marks)) {
-        const marks = node.marks
-            .map((m) => sanitizeMark(m))
-            .filter(Boolean);
-        if (marks && marks.length)
-            clean.marks = marks;
-    }
-    if (Array.isArray(node.content)) {
-        const content = node.content
-            .map(sanitizeNode)
-            .filter(Boolean);
-        if (content.length)
-            clean.content = content;
-    }
-    return clean;
-};
-/**
- * Sanitise a Tiptap JSON document (returns a new clean doc). Returns a minimal
- * empty doc if the input isn't a usable document.
- */
-export const sanitizeRteJson = (doc) => {
-    const clean = doc && typeof doc === 'object' ? sanitizeNode(doc) : null;
-    return clean && clean.type === 'doc' ? clean : { type: 'doc', content: [] };
-};

package/lib/src/brand-page-maker/utils/rte-serializer.d.ts

@@ -1,5 +0,0 @@
-import type { JSONContent } from '@tiptap/vue-3';
-/**
- * Serialise a Tiptap JSON document to HTML without an editor/DOM.
- */
-export declare const serializeRteJsonToHtml: (doc: JSONContent) => string;