@designcrowd/library.brand-page 6.0.26-json-prereq-2 → 6.0.27-websitev2-dev-1

package/src/metadata-builder/builders/global-font-propagation.test.ts

@@ -0,0 +1,269 @@
+import { describe, it, expect } from 'vitest';
+import type { BrandPageModel, Content } from '../../brand-page/models';
+import type { UpdateGlobalStylesArguments } from '../parsers/ai-toolcall-parser';
+import { BUILDER_TYPES } from '../models';
+import { GlobalStylesBuilder } from './global-styles-builder';
+import {
+  collectChangedFontFamilies,
+  propagateFontFamiliesToContents,
+} from './global-font-propagation';
+
+/**
+ * BP-5780 ISSUE-01: an AI global font change only reached preset-bound content.
+ * Template-authored sections carry detached `*Style` objects and inline RTE
+ * `font-family` marks that override the preset at render, so "use a serif font"
+ * produced a confident reply and a pixel-identical page. Propagation must align
+ * detached styles and rewrite inline marks for every changed category.
+ */
+
+const RTE_TITLE =
+  '<p><span style="font-family: Playfair Display">Bloom</span></p>';
+
+// Injectable stand-in for the Tiptap rewrite — tags the string so tests can
+// assert exactly which fields were rewritten and with which family.
+const fakeApplyFont = (text: string, fontFamily: string) =>
+  `${text}::rewritten(${fontFamily})`;
+
+const makeModel = (contents: Partial<Content>[]): BrandPageModel =>
+  ({
+    styles: { textStyles: { textStyleOptions: {} } },
+    pages: [{ id: 'p1', contents }],
+  }) as unknown as BrandPageModel;
+
+describe('collectChangedFontFamilies', () => {
+  it('extracts per-category families from textStyleOptions', () => {
+    const changed = collectChangedFontFamilies({
+      textStyleOptions: {
+        titles: { style: { fontFamily: 'EB Garamond' } },
+        headings: { style: { fontFamily: 'EB Garamond' } },
+        buttons: { style: { fontFamily: 'Inter' } },
+      },
+    } as UpdateGlobalStylesArguments['textStyles']);
+
+    expect(changed).toEqual({
+      titles: 'EB Garamond',
+      headings: 'EB Garamond',
+      buttons: 'Inter',
+    });
+  });
+
+  it('falls back textFontFamily → paragraphs when no explicit paragraphs entry', () => {
+    const changed = collectChangedFontFamilies({
+      textFontFamily: 'Inter',
+    } as UpdateGlobalStylesArguments['textStyles']);
+
+    expect(changed).toEqual({ paragraphs: 'Inter' });
+  });
+
+  it('returns empty for calls that change no fonts', () => {
+    expect(collectChangedFontFamilies(undefined)).toEqual({});
+    expect(
+      collectChangedFontFamilies({
+        style: { color: '#111111' },
+      } as UpdateGlobalStylesArguments['textStyles']),
+    ).toEqual({});
+  });
+});
+
+describe('propagateFontFamiliesToContents', () => {
+  it('aligns detached styles and rewrites RTE marks for the changed category', () => {
+    const content = {
+      id: 'c1',
+      type: 'about-section',
+      title: RTE_TITLE,
+      titleStyle: { fontFamily: 'Playfair Display' },
+    } as unknown as Content;
+    const model = makeModel([content]);
+
+    propagateFontFamiliesToContents(
+      model,
+      { headings: 'EB Garamond' },
+      fakeApplyFont,
+    );
+
+    const c = model.pages[0].contents[0] as unknown as Record<string, unknown>;
+
+    expect((c.titleStyle as Record<string, unknown>).fontFamily).toBe(
+      'EB Garamond',
+    );
+    expect(c.title).toBe(`${RTE_TITLE}::rewritten(EB Garamond)`);
+  });
+
+  it('banner-section titles follow the titles category, not headings', () => {
+    const content = {
+      id: 'c1',
+      type: 'banner-section',
+      title: RTE_TITLE,
+      titleStyle: { fontFamily: 'Playfair Display' },
+    } as unknown as Content;
+    const model = makeModel([content]);
+
+    propagateFontFamiliesToContents(
+      model,
+      { titles: 'Lexend Deca', headings: 'EB Garamond' },
+      fakeApplyFont,
+    );
+
+    const c = model.pages[0].contents[0] as unknown as Record<string, unknown>;
+
+    expect((c.titleStyle as Record<string, unknown>).fontFamily).toBe(
+      'Lexend Deca',
+    );
+    expect(c.title).toBe(`${RTE_TITLE}::rewritten(Lexend Deca)`);
+  });
+
+  it('preset-bound styles stay preset-bound; only their RTE marks are rewritten', () => {
+    const content = {
+      id: 'c1',
+      type: 'about-section',
+      title: RTE_TITLE,
+      titleStyle: { textStyleType: 'headings' },
+    } as unknown as Content;
+    const model = makeModel([content]);
+
+    propagateFontFamiliesToContents(
+      model,
+      { headings: 'EB Garamond' },
+      fakeApplyFont,
+    );
+
+    const c = model.pages[0].contents[0] as unknown as Record<string, unknown>;
+    const style = c.titleStyle as unknown as Record<string, unknown>;
+
+    expect(style.textStyleType).toBe('headings');
+    expect(style.fontFamily).toBeUndefined();
+    expect(c.title).toBe(`${RTE_TITLE}::rewritten(EB Garamond)`);
+  });
+
+  it('walks items arrays (per-item text fields and styles)', () => {
+    const itemText = '<p>Live music</p>';
+    const content = {
+      id: 'c1',
+      type: 'shapes-section',
+      items: [
+        {
+          heading: itemText,
+          headingStyle: { fontFamily: 'Playfair Display' },
+          text: itemText,
+        },
+      ],
+    } as unknown as Content;
+    const model = makeModel([content]);
+
+    propagateFontFamiliesToContents(
+      model,
+      { headings: 'EB Garamond', paragraphs: 'Inter' },
+      fakeApplyFont,
+    );
+
+    const item = (
+      model.pages[0].contents[0] as unknown as Record<string, unknown>
+    ).items as Record<string, unknown>[];
+
+    expect((item[0].headingStyle as Record<string, unknown>).fontFamily).toBe(
+      'EB Garamond',
+    );
+    expect(item[0].heading).toBe(`${itemText}::rewritten(EB Garamond)`);
+    expect(item[0].text).toBe(`${itemText}::rewritten(Inter)`);
+  });
+
+  it('leaves fields alone when their category did not change', () => {
+    const content = {
+      id: 'c1',
+      type: 'about-section',
+      title: RTE_TITLE,
+      titleStyle: { fontFamily: 'Playfair Display' },
+      description: RTE_TITLE,
+      descriptionStyle: { fontFamily: 'Lato' },
+    } as unknown as Content;
+    const model = makeModel([content]);
+
+    propagateFontFamiliesToContents(
+      model,
+      { paragraphs: 'Inter' },
+      fakeApplyFont,
+    );
+
+    const c = model.pages[0].contents[0] as unknown as Record<string, unknown>;
+
+    expect((c.titleStyle as Record<string, unknown>).fontFamily).toBe(
+      'Playfair Display',
+    );
+    expect(c.title).toBe(RTE_TITLE);
+    expect((c.descriptionStyle as Record<string, unknown>).fontFamily).toBe(
+      'Inter',
+    );
+    expect(c.description).toBe(`${RTE_TITLE}::rewritten(Inter)`);
+  });
+
+  it('non-RTE plain text fields are not rewritten (style still aligned)', () => {
+    const content = {
+      id: 'c1',
+      type: 'about-section',
+      title: 'Plain title',
+      titleStyle: { fontFamily: 'Playfair Display' },
+    } as unknown as Content;
+    const model = makeModel([content]);
+
+    propagateFontFamiliesToContents(
+      model,
+      { headings: 'EB Garamond' },
+      fakeApplyFont,
+    );
+
+    const c = model.pages[0].contents[0] as unknown as Record<string, unknown>;
+
+    expect(c.title).toBe('Plain title');
+    expect((c.titleStyle as Record<string, unknown>).fontFamily).toBe(
+      'EB Garamond',
+    );
+  });
+});
+
+describe('GlobalStylesBuilder font propagation wiring', () => {
+  it('buildAsync propagates changed category families into existing detached styles', async () => {
+    const content = {
+      id: 'c1',
+      type: 'about-section',
+      title: 'Plain title', // plain text — the builder path must not need the RTE editor here
+      titleStyle: { fontFamily: 'Playfair Display' },
+    } as unknown as Content;
+    const model = {
+      styles: {
+        textStyles: {
+          textStyleOptions: {
+            headings: { style: { fontFamily: 'Lato' }, isModified: false },
+          },
+        },
+        buttonStyles: { style: {} },
+        backgroundStyles: { style: {} },
+      },
+      pages: [{ id: 'p1', contents: [content] }],
+    } as unknown as BrandPageModel;
+
+    const builder = new GlobalStylesBuilder({
+      id: 'g1',
+      type: BUILDER_TYPES.UPDATE_GLOBAL_STYLES,
+      payload: {
+        textStyles: {
+          textStyleOptions: {
+            headings: { style: { fontFamily: 'EB Garamond' } },
+          },
+        },
+      } as UpdateGlobalStylesArguments,
+    });
+
+    const result = await builder.buildAsync(model);
+
+    expect(result.errors).toBeUndefined();
+    // Preset updated (pre-existing behaviour)…
+    expect(
+      model.styles.textStyles.textStyleOptions.headings.style.fontFamily,
+    ).toBe('EB Garamond');
+    // …AND the detached section style now follows (the fix).
+    expect(
+      (model.pages[0].contents[0] as unknown as Record<string, unknown>)
+        .titleStyle,
+    ).toMatchObject({ fontFamily: 'EB Garamond' });
+  });
+});

package/src/metadata-builder/builders/global-font-propagation.ts

@@ -0,0 +1,205 @@
+import type { BrandPageModel, Content } from '../../brand-page/models';
+import type { TextStyleDeclaration } from '../../brand-page/models';
+import { hasRTEContent } from '../../brand-page-maker/utils';
+import { useExternalRichTextEditor } from '../../brand-page-maker/composables/rich-text-editor/useRichTextEditor';
+import { applyStyleToRTEText } from '../helpers/rte.helpers';
+import type { UpdateGlobalStylesArguments } from '../parsers/ai-toolcall-parser';
+
+/**
+ * Propagation of AI global font-family changes into existing section content.
+ *
+ * A `tool_update_global_styles` call merges new per-category font families into
+ * `styles.textStyles.textStyleOptions` — but only content whose style is still
+ * bound to a preset (`textStyleType`) follows that change. Template-authored
+ * content carries detached `*Style` objects AND inline `font-family` marks in
+ * its RTE HTML, both of which override the preset at render time, so a global
+ * font change was invisible on most templates (BP-5780 ISSUE-01).
+ *
+ * This module walks every page's contents and, for each text field whose
+ * resolved category received a new family, aligns the detached style object and
+ * rewrites the RTE HTML's inline font-family marks. Preset-bound styles are NOT
+ * detached — they already follow the preset; only their RTE inline marks are
+ * rewritten (the marks would otherwise still win over the preset).
+ */
+
+export type GlobalFontCategory =
+  | 'titles'
+  | 'headings'
+  | 'paragraphs'
+  | 'buttons';
+
+/**
+ * Default category per text field when its style is detached (no `textStyleType`).
+ * Mirrors the AI service's slot→category stamping (titles←h1, headings←h2-h4,
+ * paragraphs←body, buttons←button). `title` upgrades to `titles` on banner
+ * sections (the hero headline) via `resolveFieldCategory`.
+ */
+const FIELD_DEFAULT_CATEGORY: Record<string, GlobalFontCategory> = {
+  title: 'headings',
+  heading: 'headings',
+  name: 'headings',
+  description: 'paragraphs',
+  paragraph: 'paragraphs',
+  text: 'paragraphs',
+  testimonial: 'paragraphs',
+  position: 'paragraphs',
+  question: 'headings',
+  answer: 'paragraphs',
+  buttonText: 'buttons',
+  successMessage: 'paragraphs',
+};
+
+const CATEGORIES: readonly GlobalFontCategory[] = [
+  'titles',
+  'headings',
+  'paragraphs',
+  'buttons',
+];
+
+const isPlainObject = (v: unknown): v is Record<string, unknown> =>
+  !!v && typeof v === 'object' && !Array.isArray(v);
+
+/** Extract the per-category families this AI call actually changes. */
+export const collectChangedFontFamilies = (
+  textStyles: UpdateGlobalStylesArguments['textStyles'],
+): Partial<Record<GlobalFontCategory, string>> => {
+  const changed: Partial<Record<GlobalFontCategory, string>> = {};
+
+  if (!textStyles) return changed;
+
+  for (const category of CATEGORIES) {
+    const family = textStyles.textStyleOptions?.[category]?.style?.fontFamily;
+
+    if (typeof family === 'string' && family.trim()) {
+      changed[category] = family;
+    }
+  }
+
+  // Base text family covers paragraphs when no explicit paragraphs entry came in.
+  if (
+    !changed.paragraphs &&
+    typeof textStyles.textFontFamily === 'string' &&
+    textStyles.textFontFamily.trim()
+  ) {
+    changed.paragraphs = textStyles.textFontFamily;
+  }
+
+  return changed;
+};
+
+const resolveFieldCategory = (
+  fieldName: string,
+  style: unknown,
+  content: Content,
+): GlobalFontCategory | undefined => {
+  const preset = isPlainObject(style)
+    ? (style.textStyleType as GlobalFontCategory | undefined)
+    : undefined;
+
+  if (preset && CATEGORIES.includes(preset)) return preset;
+
+  if (fieldName === 'title' && content.type === 'banner-section') {
+    return 'titles';
+  }
+
+  return FIELD_DEFAULT_CATEGORY[fieldName];
+};
+
+/** `testimonialsStyle` → `testimonial`, `titleStyle` → `title`. */
+const styleKeyToFieldName = (styleKey: string): string => {
+  const base = styleKey.slice(0, -'Style'.length);
+
+  return base.endsWith('s') && !(base in FIELD_DEFAULT_CATEGORY)
+    ? base.slice(0, -1)
+    : base;
+};
+
+export type ApplyFontToRTE = (text: string, fontFamily: string) => string;
+
+const walkRecord = (
+  record: Record<string, unknown>,
+  content: Content,
+  changed: Partial<Record<GlobalFontCategory, string>>,
+  applyFont: ApplyFontToRTE,
+): void => {
+  for (const [key, value] of Object.entries(record)) {
+    if (key.endsWith('Style') && isPlainObject(value)) {
+      // Detached style objects carry their own fontFamily override — align it.
+      // Preset-bound styles keep following the preset (never detach here).
+      const category = resolveFieldCategory(
+        styleKeyToFieldName(key),
+        value,
+        content,
+      );
+      const family = category ? changed[category] : undefined;
+
+      if (family && !value.textStyleType) {
+        (value as TextStyleDeclaration).fontFamily =
+          family as TextStyleDeclaration['fontFamily'];
+      }
+    } else if (
+      key in FIELD_DEFAULT_CATEGORY &&
+      typeof value === 'string' &&
+      hasRTEContent(value)
+    ) {
+      // Inline RTE marks override every style layer at render — rewrite them.
+      const category = resolveFieldCategory(
+        key,
+        record[`${key}Style`],
+        content,
+      );
+      const family = category ? changed[category] : undefined;
+
+      if (family) {
+        record[key] = applyFont(value, family);
+      }
+    } else if (Array.isArray(value)) {
+      for (const item of value) {
+        if (isPlainObject(item)) {
+          walkRecord(item, content, changed, applyFont);
+        }
+      }
+    }
+  }
+};
+
+/**
+ * Walk every page's contents and propagate the changed families.
+ * `applyFont` is injectable for tests; the default rewrites inline marks via
+ * the external Tiptap editor.
+ */
+export const propagateFontFamiliesToContents = (
+  model: BrandPageModel,
+  changed: Partial<Record<GlobalFontCategory, string>>,
+  applyFont?: ApplyFontToRTE,
+): void => {
+  if (!Object.keys(changed).length) return;
+
+  let editor:
+    | ReturnType<typeof useExternalRichTextEditor>['externalEditor']
+    | undefined;
+  const apply: ApplyFontToRTE =
+    applyFont ??
+    ((text, fontFamily) => {
+      editor = editor ?? useExternalRichTextEditor().externalEditor;
+
+      return applyStyleToRTEText(editor, text, {
+        fontFamily,
+      } as TextStyleDeclaration);
+    });
+
+  try {
+    for (const page of model.pages) {
+      for (const content of page.contents) {
+        walkRecord(
+          content as unknown as Record<string, unknown>,
+          content,
+          changed,
+          apply,
+        );
+      }
+    }
+  } finally {
+    editor?.destroy();
+  }
+};

package/src/metadata-builder/builders/global-styles-builder.ts

@@ -14,6 +14,10 @@ import {
   GLOBAL_STYLE_CHECKS,
   TEXT_STYLE_OPTION_KEYS,
 } from './section-rules/global-styles.rules';
+import {
+  collectChangedFontFamilies,
+  propagateFontFamiliesToContents,
+} from './global-font-propagation';
 
 export class GlobalStylesBuilder extends BaseMetadataBuilder<UpdateGlobalStylesArguments> {
   constructor(
@@ -54,6 +58,23 @@ export class GlobalStylesBuilder extends BaseMetadataBuilder<UpdateGlobalStylesA
 
     if (args.textStyles) {
       this.applyTextStyles(model, args.textStyles);
+
+      // A category font change only reaches preset-bound content by itself;
+      // detached section styles and inline RTE font marks would still render
+      // the old family. Propagate so the change is actually visible (BP-5780).
+      const changedFamilies = collectChangedFontFamilies(args.textStyles);
+
+      if (Object.keys(changedFamilies).length) {
+        try {
+          propagateFontFamiliesToContents(model, changedFamilies);
+        } catch (error) {
+          this.log({
+            message:
+              'Global font propagation to existing contents failed — presets still updated',
+            error,
+          });
+        }
+      }
     }
 
     if (args.buttonStyles) {

package/src/metadata-builder/builders/section-builders/about-section-builder.ts

@@ -3,6 +3,7 @@ import type {
   BrandPageModel,
   TextStyleDeclaration,
 } from '../../../brand-page/models';
+import { tiptapJsonToHtml } from '../../helpers/rte.helpers';
 import type { BuilderResult } from '../../models';
 import {
   isTiptapDocument,
@@ -53,7 +54,7 @@ export class AboutSectionBuilder extends BaseSectionBuilder<AboutSectionContent>
 
     if (aboutArgs.title !== undefined) {
       if (isTiptapDocument(aboutArgs.title)) {
-        resolved.content.title = aboutArgs.title;
+        resolved.content.title = tiptapJsonToHtml(aboutArgs.title);
         resolved.content.titleStyle = resolveGlobalPresetIntoStyle(
           resolved.content.titleStyle,
           textStyleOptions,
@@ -65,7 +66,7 @@ export class AboutSectionBuilder extends BaseSectionBuilder<AboutSectionContent>
 
     if (aboutArgs.paragraph !== undefined) {
       if (isTiptapDocument(aboutArgs.paragraph)) {
-        resolved.content.paragraph = aboutArgs.paragraph;
+        resolved.content.paragraph = tiptapJsonToHtml(aboutArgs.paragraph);
         resolved.content.paragraphStyle = resolveGlobalPresetIntoStyle(
           resolved.content.paragraphStyle,
           textStyleOptions,

package/src/metadata-builder/builders/section-builders/banner-section-builder.ts

@@ -3,6 +3,7 @@ import type {
   BrandPageModel,
   TextStyleDeclaration,
 } from '../../../brand-page/models';
+import { tiptapJsonToHtml } from '../../helpers/rte.helpers';
 import type { BuilderResult } from '../../models';
 import {
   isTiptapDocument,
@@ -90,7 +91,7 @@ export class BannerSectionBuilder extends BaseSectionBuilder<BannerSectionConten
 
     if (bannerArgs.title !== undefined) {
       if (isTiptapDocument(bannerArgs.title)) {
-        resolved.content.title = bannerArgs.title;
+        resolved.content.title = tiptapJsonToHtml(bannerArgs.title);
         resolved.content.titleStyle = resolveGlobalPresetIntoStyle(
           resolved.content.titleStyle,
           textStyleOptions,
@@ -102,7 +103,7 @@ export class BannerSectionBuilder extends BaseSectionBuilder<BannerSectionConten
 
     if (bannerArgs.description !== undefined) {
       if (isTiptapDocument(bannerArgs.description)) {
-        resolved.content.description = bannerArgs.description;
+        resolved.content.description = tiptapJsonToHtml(bannerArgs.description);
         resolved.content.descriptionStyle = resolveGlobalPresetIntoStyle(
           resolved.content.descriptionStyle,
           textStyleOptions,

package/src/metadata-builder/builders/section-builders/booking-section-builder.ts

@@ -3,6 +3,7 @@ import type {
   BrandPageModel,
   TextStyleDeclaration,
 } from '../../../brand-page/models';
+import { tiptapJsonToHtml } from '../../helpers/rte.helpers';
 import type { BuilderResult } from '../../models';
 import {
   isTiptapDocument,
@@ -50,7 +51,7 @@ export class BookingSectionBuilder extends BaseSectionBuilder<BookingSectionCont
 
     if (bookingArgs.title !== undefined) {
       if (isTiptapDocument(bookingArgs.title)) {
-        resolved.content.title = bookingArgs.title;
+        resolved.content.title = tiptapJsonToHtml(bookingArgs.title);
         resolved.content.titleStyle = resolveGlobalPresetIntoStyle(
           resolved.content.titleStyle,
           textStyleOptions,
@@ -62,7 +63,9 @@ export class BookingSectionBuilder extends BaseSectionBuilder<BookingSectionCont
 
     if (bookingArgs.description !== undefined) {
       if (isTiptapDocument(bookingArgs.description)) {
-        resolved.content.description = bookingArgs.description;
+        resolved.content.description = tiptapJsonToHtml(
+          bookingArgs.description,
+        );
         resolved.content.descriptionStyle = resolveGlobalPresetIntoStyle(
           resolved.content.descriptionStyle,
           textStyleOptions,

package/src/metadata-builder/builders/section-builders/contact-form-builder.ts

@@ -3,6 +3,7 @@ import type {
   BrandPageModel,
   TextStyleDeclaration,
 } from '../../../brand-page/models';
+import { tiptapJsonToHtml } from '../../helpers/rte.helpers';
 import {
   isTiptapDocument,
   type ContactFormSectionArguments,
@@ -49,7 +50,7 @@ export class ContactFormBuilder extends BaseSectionBuilder<ContactFormContent> {
 
     if (args.title !== undefined) {
       if (isTiptapDocument(args.title)) {
-        content.title = args.title;
+        content.title = tiptapJsonToHtml(args.title);
         content.titleStyle = resolveGlobalPresetIntoStyle(
           content.titleStyle,
           textStyleOptions,
@@ -61,7 +62,7 @@ export class ContactFormBuilder extends BaseSectionBuilder<ContactFormContent> {
 
     if (args.description !== undefined) {
       if (isTiptapDocument(args.description)) {
-        content.description = args.description;
+        content.description = tiptapJsonToHtml(args.description);
         content.descriptionStyle = resolveGlobalPresetIntoStyle(
           content.descriptionStyle,
           textStyleOptions,
@@ -73,7 +74,7 @@ export class ContactFormBuilder extends BaseSectionBuilder<ContactFormContent> {
 
     if (args.success_message !== undefined) {
       if (isTiptapDocument(args.success_message)) {
-        content.successMessage = args.success_message;
+        content.successMessage = tiptapJsonToHtml(args.success_message);
         content.successMessageStyle = resolveGlobalPresetIntoStyle(
           content.successMessageStyle,
           textStyleOptions,

package/src/metadata-builder/builders/section-builders/images-section-builder.ts

@@ -3,6 +3,7 @@ import type {
   BrandPageModel,
   TextStyleDeclaration,
 } from '../../../brand-page/models';
+import { tiptapJsonToHtml } from '../../helpers/rte.helpers';
 import type { BuilderResult } from '../../models';
 import {
   isTiptapDocument,
@@ -141,7 +142,7 @@ export class ImagesSectionBuilder extends BaseSectionBuilder<ImagesSectionConten
 
     if (args.title !== undefined) {
       if (isTiptapDocument(args.title)) {
-        content.title = args.title;
+        content.title = tiptapJsonToHtml(args.title);
         content.titleStyle = resolveGlobalPresetIntoStyle(
           content.titleStyle,
           textStyleOptions,
@@ -153,7 +154,7 @@ export class ImagesSectionBuilder extends BaseSectionBuilder<ImagesSectionConten
 
     if (args.description !== undefined) {
       if (isTiptapDocument(args.description)) {
-        content.description = args.description;
+        content.description = tiptapJsonToHtml(args.description);
         content.descriptionStyle = resolveGlobalPresetIntoStyle(
           content.descriptionStyle,
           textStyleOptions,

package/src/metadata-builder/builders/section-builders/index.ts

@@ -5,6 +5,7 @@ export {
 
 export { BannerSectionBuilder } from './banner-section-builder';
 export { BookingSectionBuilder } from './booking-section-builder';
+export { SupportMeBuilder } from './support-me-builder';
 export { AboutSectionBuilder } from './about-section-builder';
 export { ContactFormBuilder } from './contact-form-builder';
 export { DividerSectionBuilder } from './divider-section-builder';

package/src/metadata-builder/builders/section-builders/mailing-list-builder.ts

@@ -4,6 +4,7 @@ import type {
   MailingListContent,
   TextStyleDeclaration,
 } from '../../../brand-page/models';
+import { tiptapJsonToHtml } from '../../helpers/rte.helpers';
 import {
   isTiptapDocument,
   type MailingListSectionArguments,
@@ -49,7 +50,7 @@ export class MailingListBuilder extends BaseSectionBuilder<MailingListContent> {
 
     if (mailingListArgs.title !== undefined) {
       if (isTiptapDocument(mailingListArgs.title)) {
-        content.title = mailingListArgs.title;
+        content.title = tiptapJsonToHtml(mailingListArgs.title);
         content.titleStyle = resolveGlobalPresetIntoStyle(
           content.titleStyle,
           textStyleOptions,