@designcrowd/library.brand-page 5.17.28 → 5.18.0

package/lib/src/metadata-builder/builders/section-builders/shapes-section-builder.js

@@ -1,7 +1,22 @@
-import { applyScalarFields, applyStyleFields, applyRTEStyles, } from '../section-field-utils';
+import { tiptapJsonToHtml } from '../../helpers/rte.helpers';
+import { isTiptapDocument, } from '../../parsers/section-tool-arguments';
+import { applyScalarFields, applyStyleFields, resolveGlobalPresetIntoStyle, } from '../section-field-utils';
+import { applyColorThemeToReplacements, resolveShapeColorReplacementsAsync, } from '../shape-color-utils';
 import { BaseSectionBuilder } from './base-section-builder';
-const applyShapeItems = (content, items) => {
-    content.items = items.map((item, index) => ({
+import { validateShapesSection } from '../section-rules/shapes-section.rules';
+const resolveItemColorsAsync = async (item, existing, prevImageUrl) => {
+    let colors = existing ?? [];
+    const newUrl = item.shape_url ?? item.icon_image_url;
+    if (newUrl && newUrl !== prevImageUrl) {
+        colors = await resolveShapeColorReplacementsAsync(newUrl);
+    }
+    if (item.color_theme) {
+        colors = applyColorThemeToReplacements(colors, item.color_theme);
+    }
+    return colors;
+};
+const applyShapeItemsAsync = async (content, items) => {
+    content.items = await Promise.all(items.map(async (item, index) => ({
         imageUrl: item.shape_url || item.icon_image_url || '',
         imageTitle: '',
         width: 0,
@@ -11,20 +26,20 @@ const applyShapeItems = (content, items) => {
         title: item.heading || '',
         paragraph: item.text || '',
         itemsId: index,
-        colorReplacements: [],
-        keepColor: item.keep_color ?? false,
-    }));
+        colorReplacements: await resolveItemColorsAsync(item, [], undefined),
+    })));
 };
-const mergeShapeItems = (content, items, replaceAll) => {
+const mergeShapeItemsAsync = async (content, items, replaceAll) => {
     const hasIndexedItems = items.some((item) => item.item_index !== undefined);
     if (hasIndexedItems) {
-        for (const item of items) {
+        await Promise.all(items.map(async (item) => {
             const targetIndex = item.item_index;
             if (targetIndex === undefined ||
                 targetIndex < 0 ||
                 !content.items?.[targetIndex])
-                continue;
+                return;
             const existing = content.items[targetIndex];
+            const prevImageUrl = existing.imageUrl;
             if (item.shape_url !== undefined || item.icon_image_url !== undefined) {
                 existing.imageUrl =
                     item.shape_url ?? item.icon_image_url ?? existing.imageUrl;
@@ -33,13 +48,14 @@ const mergeShapeItems = (content, items, replaceAll) => {
                 existing.title = item.heading;
             if (item.text !== undefined)
                 existing.paragraph = item.text;
-            if (item.keep_color !== undefined) {
-                existing.keepColor = item.keep_color;
+            if (item.shape_url !== undefined || item.color_theme !== undefined) {
+                existing.colorReplacements = await resolveItemColorsAsync(item, existing.colorReplacements, prevImageUrl);
             }
-        }
+        }));
         return;
     }
-    const updatedItems = items.map((item, index) => {
+    const itemsToMerge = items.filter((item) => item.insert_at === undefined);
+    const updatedItems = await Promise.all(itemsToMerge.map(async (item, index) => {
         const existing = content.items?.[index];
         const imageUrl = item.shape_url ?? item.icon_image_url ?? existing?.imageUrl ?? '';
         return {
@@ -53,32 +69,53 @@ const mergeShapeItems = (content, items, replaceAll) => {
             title: item.heading ?? existing?.title ?? '',
             paragraph: item.text ?? existing?.paragraph ?? '',
             itemsId: existing?.itemsId ?? index,
-            colorReplacements: existing?.colorReplacements ?? [],
-            keepColor: item.keep_color ??
-                (existing && 'keepColor' in existing ? existing.keepColor : false),
+            colorReplacements: await resolveItemColorsAsync(item, existing?.colorReplacements, existing?.imageUrl),
         };
-    });
-    if (!replaceAll && content.items && content.items.length > items.length) {
-        const remaining = content.items.slice(items.length);
+    }));
+    if (!replaceAll &&
+        content.items &&
+        content.items.length > itemsToMerge.length) {
+        const remaining = content.items.slice(itemsToMerge.length);
         updatedItems.push(...remaining);
     }
     content.items = updatedItems;
 };
 export class ShapesSectionBuilder extends BaseSectionBuilder {
+    get sectionValidate() {
+        return validateShapesSection;
+    }
     async buildAsync(model) {
         this.log('Build called');
         const validation = await this.validateAsync();
         if (validation.errors.length) {
             return { request: this.request, model, errors: validation.errors };
         }
-        const resolved = this.resolveContent(model);
+        const resolved = this.resolveAndRepositionContent(model);
         if ('error' in resolved)
             return resolved.error;
         const content = resolved.content;
         applyScalarFields(content, this.args, this.sectionType);
-        applyStyleFields(content, this.args, this.sectionType);
-        applyRTEStyles(content, this.args, this.sectionType);
+        applyStyleFields(content, this.args, this.sectionType, this.getGlobalTextStyles(model));
         const args = this.args;
+        const textStyleOptions = model.styles?.textStyles?.textStyleOptions;
+        if (args.title !== undefined) {
+            if (isTiptapDocument(args.title)) {
+                content.title = tiptapJsonToHtml(args.title);
+                content.titleStyle = resolveGlobalPresetIntoStyle(content.titleStyle, textStyleOptions);
+            }
+            else {
+                content.title = args.title;
+            }
+        }
+        if (args.description !== undefined) {
+            if (isTiptapDocument(args.description)) {
+                content.description = tiptapJsonToHtml(args.description);
+                content.descriptionStyle = resolveGlobalPresetIntoStyle(content.descriptionStyle, textStyleOptions);
+            }
+            else {
+                content.description = args.description;
+            }
+        }
         if (args.background_style && typeof args.background_style === 'object') {
             const existing = content.backgroundStyle || {};
             content.backgroundStyle = {
@@ -101,10 +138,10 @@ export class ShapesSectionBuilder extends BaseSectionBuilder {
         }
         if (args.items && Array.isArray(args.items)) {
             if (this.mode === 'create') {
-                applyShapeItems(content, args.items);
+                await applyShapeItemsAsync(content, args.items);
             }
             else {
-                mergeShapeItems(content, args.items, !!args._replace_items);
+                await mergeShapeItemsAsync(content, args.items, !!args._replace_items);
             }
         }
         // Phase 2: Item operations (remove, insert, reorder)
@@ -121,9 +158,16 @@ export class ShapesSectionBuilder extends BaseSectionBuilder {
             // Process inserts in reverse order of insert_at to preserve indices
             const sortedInserts = [...insertItems].sort((a, b) => (b.insert_at ?? 0) - (a.insert_at ?? 0));
             for (const item of sortedInserts) {
+                const insertUrl = item.shape_url ?? item.icon_image_url ?? '';
+                // Skip if this shape/icon already exists — defensive against duplicate
+                // tool call application
+                if (insertUrl &&
+                    content.items?.some((existing) => existing.imageUrl === insertUrl)) {
+                    continue;
+                }
                 const pos = Math.max(0, Math.min(item.insert_at ?? 0, content.items?.length ?? 0));
                 const newItem = {
-                    imageUrl: item.shape_url ?? item.icon_image_url ?? '',
+                    imageUrl: insertUrl,
                     imageTitle: '',
                     width: 0,
                     height: 0,
@@ -132,8 +176,7 @@ export class ShapesSectionBuilder extends BaseSectionBuilder {
                     title: item.heading ?? '',
                     paragraph: item.text ?? '',
                     itemsId: pos,
-                    colorReplacements: [],
-                    keepColor: item.keep_color ?? false,
+                    colorReplacements: await resolveItemColorsAsync(item, [], undefined),
                 };
                 content.items = content.items ?? [];
                 content.items.splice(pos, 0, newItem);

package/lib/src/metadata-builder/builders/section-builders/social-links-builder.d.ts

@@ -1,6 +1,8 @@
 import type { SocialLinksContent, BrandPageModel } from '../../../brand-page/models';
 import type { BuilderResult } from '../../models';
 import { BaseSectionBuilder } from './base-section-builder';
+import { validateSocialLinks } from '../section-rules/social-links.rules';
 export declare class SocialLinksBuilder extends BaseSectionBuilder<SocialLinksContent> {
+    protected get sectionValidate(): typeof validateSocialLinks;
     buildAsync(model: BrandPageModel): Promise<BuilderResult>;
 }

package/lib/src/metadata-builder/builders/section-builders/social-links-builder.js

@@ -1,5 +1,6 @@
-import { applyScalarFields } from '../section-field-utils';
+import { applyScalarFields, applyStyleFields } from '../section-field-utils';
 import { BaseSectionBuilder } from './base-section-builder';
+import { validateSocialLinks } from '../section-rules/social-links.rules';
 const applySocialLinks = (content, links) => {
     content.links = links.map((link) => ({
         imageUrl: link.platform || '',
@@ -25,17 +26,21 @@ const mergeSocialLinks = (content, links, replaceAll) => {
     content.links = updatedLinks;
 };
 export class SocialLinksBuilder extends BaseSectionBuilder {
+    get sectionValidate() {
+        return validateSocialLinks;
+    }
     async buildAsync(model) {
         this.log('Build called');
         const validation = await this.validateAsync();
         if (validation.errors.length) {
             return { request: this.request, model, errors: validation.errors };
         }
-        const resolved = this.resolveContent(model);
+        const resolved = this.resolveAndRepositionContent(model);
         if ('error' in resolved)
             return resolved.error;
         const content = resolved.content;
         applyScalarFields(content, this.args, this.sectionType);
+        applyStyleFields(content, this.args, this.sectionType, this.getGlobalTextStyles(model));
         const args = this.args;
         if (args.links && Array.isArray(args.links)) {
             if (this.mode === 'create') {

package/lib/src/metadata-builder/builders/section-builders/testimonial-section-builder.d.ts

@@ -1,6 +1,8 @@
 import type { TestimonialSectionContent, BrandPageModel } from '../../../brand-page/models';
 import type { BuilderResult } from '../../models';
 import { BaseSectionBuilder } from './base-section-builder';
+import { validateTestimonialSection } from '../section-rules/testimonial-section.rules';
 export declare class TestimonialSectionBuilder extends BaseSectionBuilder<TestimonialSectionContent> {
+    protected get sectionValidate(): typeof validateTestimonialSection;
     buildAsync(model: BrandPageModel): Promise<BuilderResult>;
 }

package/lib/src/metadata-builder/builders/section-builders/testimonial-section-builder.js

@@ -1,67 +1,117 @@
-import { applyScalarFields, applyStyleFields } from '../section-field-utils';
+import { tiptapJsonToHtml } from '../../helpers/rte.helpers';
+import { isTiptapDocument, } from '../../parsers/section-tool-arguments';
+import { applyScalarFields, applyStyleFields, resolveGlobalPresetIntoStyle, } from '../section-field-utils';
+import { applyColorThemeToReplacements, resolveShapeColorReplacementsAsync, } from '../shape-color-utils';
 import { BaseSectionBuilder } from './base-section-builder';
-const applyTestimonialItems = (content, items) => {
-    content.items = items.map((item) => ({
-        imageUrl: item.avatar_image_url || '',
+import { validateTestimonialSection, TESTIMONIAL_ITEM_CAP, } from '../section-rules/testimonial-section.rules';
+const resolveItemColorsAsync = async (item, existing, prevImageUrl) => {
+    let colors = existing ?? [];
+    if (item.avatar_shape_url && item.avatar_shape_url !== prevImageUrl) {
+        colors = await resolveShapeColorReplacementsAsync(item.avatar_shape_url);
+    }
+    if (item.color_theme) {
+        colors = applyColorThemeToReplacements(colors, item.color_theme);
+    }
+    return colors;
+};
+const applyTestimonialItemsAsync = async (content, items) => {
+    content.items = await Promise.all(items.map(async (item) => ({
+        imageUrl: item.avatar_shape_url || item.avatar_image_url || '',
         name: item.name || '',
         position: item.position || '',
         testimonials: item.testimonial || '',
-        colorReplacements: [],
-        mediaType: 'image',
-    }));
+        colorReplacements: await resolveItemColorsAsync(item, [], undefined),
+        mediaType: item.avatar_shape_url ? 'shape' : 'image',
+    })));
 };
-const mergeTestimonialItems = (content, items, replaceAll) => {
+const mergeTestimonialItemsAsync = async (content, items, replaceAll) => {
     const hasIndexedItems = items.some((item) => item.item_index !== undefined);
     if (hasIndexedItems) {
-        for (const item of items) {
+        await Promise.all(items.map(async (item) => {
             const targetIndex = item.item_index;
             if (targetIndex === undefined ||
                 targetIndex < 0 ||
                 !content.items?.[targetIndex])
-                continue;
+                return;
             const existing = content.items[targetIndex];
-            if (item.avatar_image_url !== undefined)
+            const prevImageUrl = existing.imageUrl;
+            if (item.avatar_shape_url !== undefined) {
+                existing.imageUrl = item.avatar_shape_url;
+                existing.mediaType = 'shape';
+            }
+            else if (item.avatar_image_url !== undefined) {
                 existing.imageUrl = item.avatar_image_url;
+                existing.mediaType = 'image';
+            }
             if (item.name !== undefined)
                 existing.name = item.name;
             if (item.position !== undefined)
                 existing.position = item.position;
             if (item.testimonial !== undefined)
                 existing.testimonials = item.testimonial;
-        }
+            if (item.avatar_shape_url !== undefined ||
+                item.color_theme !== undefined) {
+                existing.colorReplacements = await resolveItemColorsAsync(item, existing.colorReplacements, prevImageUrl);
+            }
+        }));
         return;
     }
-    const updatedItems = items.map((item, index) => {
+    const itemsToMerge = items.filter((item) => item.insert_at === undefined);
+    const updatedItems = await Promise.all(itemsToMerge.map(async (item, index) => {
         const existing = content.items?.[index];
+        const imageUrl = item.avatar_shape_url ??
+            item.avatar_image_url ??
+            existing?.imageUrl ??
+            '';
+        const mediaType = item.avatar_shape_url
+            ? 'shape'
+            : item.avatar_image_url
+                ? 'image'
+                : existing?.mediaType ?? 'image';
         return {
             ...(existing || {}),
-            imageUrl: item.avatar_image_url ?? existing?.imageUrl ?? '',
+            imageUrl,
             name: item.name ?? existing?.name ?? '',
             position: item.position ?? existing?.position ?? '',
             testimonials: item.testimonial ?? existing?.testimonials ?? '',
-            colorReplacements: existing?.colorReplacements ?? [],
-            mediaType: existing?.mediaType ?? 'image',
+            colorReplacements: await resolveItemColorsAsync(item, existing?.colorReplacements, existing?.imageUrl),
+            mediaType,
         };
-    });
-    if (!replaceAll && content.items && content.items.length > items.length) {
-        updatedItems.push(...content.items.slice(items.length));
+    }));
+    if (!replaceAll &&
+        content.items &&
+        content.items.length > itemsToMerge.length) {
+        updatedItems.push(...content.items.slice(itemsToMerge.length));
     }
     content.items = updatedItems;
 };
 export class TestimonialSectionBuilder extends BaseSectionBuilder {
+    get sectionValidate() {
+        return validateTestimonialSection;
+    }
     async buildAsync(model) {
         this.log('Build called');
         const validation = await this.validateAsync();
         if (validation.errors.length) {
             return { request: this.request, model, errors: validation.errors };
         }
-        const resolved = this.resolveContent(model);
+        const resolved = this.resolveAndRepositionContent(model);
         if ('error' in resolved)
             return resolved.error;
         const content = resolved.content;
         applyScalarFields(content, this.args, this.sectionType);
-        applyStyleFields(content, this.args, this.sectionType);
+        applyStyleFields(content, this.args, this.sectionType, this.getGlobalTextStyles(model));
         const args = this.args;
+        const textStyleOptions = model.styles?.textStyles?.textStyleOptions;
+        if (args.title !== undefined) {
+            if (isTiptapDocument(args.title)) {
+                content.title = tiptapJsonToHtml(args.title);
+                content.titleStyle = resolveGlobalPresetIntoStyle(content.titleStyle, textStyleOptions);
+            }
+            else {
+                content.title = args.title;
+            }
+        }
         if (args.background_style && typeof args.background_style === 'object') {
             const existing = content.backgroundStyle || {};
             content.backgroundStyle = {
@@ -84,10 +134,10 @@ export class TestimonialSectionBuilder extends BaseSectionBuilder {
         }
         if (args.items && Array.isArray(args.items)) {
             if (this.mode === 'create') {
-                applyTestimonialItems(content, args.items);
+                await applyTestimonialItemsAsync(content, args.items);
             }
             else {
-                mergeTestimonialItems(content, args.items, !!args._replace_items);
+                await mergeTestimonialItemsAsync(content, args.items, !!args._replace_items);
             }
         }
         // Phase 2: Item operations (remove, insert, reorder)
@@ -105,12 +155,12 @@ export class TestimonialSectionBuilder extends BaseSectionBuilder {
             for (const item of sortedInserts) {
                 const pos = Math.max(0, Math.min(item.insert_at ?? 0, content.items?.length ?? 0));
                 const newItem = {
-                    imageUrl: item.avatar_image_url ?? '',
+                    imageUrl: item.avatar_shape_url ?? item.avatar_image_url ?? '',
                     name: item.name ?? '',
                     position: item.position ?? '',
                     testimonials: item.testimonial ?? '',
-                    colorReplacements: [],
-                    mediaType: 'image',
+                    colorReplacements: await resolveItemColorsAsync(item, [], undefined),
+                    mediaType: item.avatar_shape_url ? 'shape' : 'image',
                 };
                 content.items = content.items ?? [];
                 content.items.splice(pos, 0, newItem);
@@ -128,6 +178,21 @@ export class TestimonialSectionBuilder extends BaseSectionBuilder {
                 }
             }
         }
+        // Post-merge cap check. itemCapCheck only fires for create / update with
+        // _replace_items, so insert_at on an already-full section silently bloats
+        // the array. Surface as an error so the AI retry loop gets a signal and
+        // can reissue with _remove_item_indices or fewer inserts.
+        // brandSite key mirrors base-section-builder's hardcoded brandPageType.
+        const cap = TESTIMONIAL_ITEM_CAP.brandSite;
+        if (content.items && content.items.length > cap) {
+            return {
+                request: this.request,
+                model,
+                errors: [
+                    `"${TESTIMONIAL_ITEM_CAP.arrayField}" has ${content.items.length} items but "testimonial-section" supports a maximum of ${cap}`,
+                ],
+            };
+        }
         return { request: this.request, model };
     }
 }

package/lib/src/metadata-builder/builders/section-builders/text-section-builder.d.ts

@@ -1,6 +1,8 @@
 import type { BuilderResult } from '../../models';
 import type { TextContent, BrandPageModel } from '../../../brand-page/models';
 import { BaseSectionBuilder } from './base-section-builder';
+import { validateTextSection } from '../section-rules/text-section.rules';
 export declare class TextSectionBuilder extends BaseSectionBuilder<TextContent> {
+    protected get sectionValidate(): typeof validateTextSection;
     buildAsync(model: BrandPageModel): Promise<BuilderResult>;
 }

package/lib/src/metadata-builder/builders/section-builders/text-section-builder.js

@@ -1,17 +1,29 @@
-import { updateRTEText } from '../../helpers/rte.helpers';
-import { applyScalarFields, applyStyleFields } from '../section-field-utils';
+import { tiptapJsonToHtml } from '../../helpers/rte.helpers';
+import { isTiptapDocument, } from '../../parsers/section-tool-arguments';
+import { applyScalarFields, applyStyleFields, resolveGlobalPresetIntoStyle, } from '../section-field-utils';
 import { BaseSectionBuilder } from './base-section-builder';
-const createTextItem = (item, baseStyle) => {
+import { validateTextSection } from '../section-rules/text-section.rules';
+/** Resolve a RichTextField (string or TiptapDocument) to a plain HTML string. */
+const resolveText = (value) => {
+    if (isTiptapDocument(value))
+        return { html: tiptapJsonToHtml(value), wasTiptap: true };
+    return { html: typeof value === 'string' ? value : '', wasTiptap: false };
+};
+const clearTextStyleTypeIfTiptap = (style, wasTiptap, textStyleOptions) => wasTiptap
+    ? resolveGlobalPresetIntoStyle(style, textStyleOptions)
+    : style;
+const createTextItem = (item, baseStyle, textStyleOptions) => {
     const textStyle = (item.text_style ? { ...baseStyle, ...item.text_style } : { ...baseStyle });
+    const { html, wasTiptap } = resolveText(item.text);
     return {
-        text: item.text || '',
-        textStyle,
+        text: html,
+        textStyle: clearTextStyleTypeIfTiptap(textStyle, wasTiptap, textStyleOptions),
     };
 };
-const applyTextItems = (content, items) => {
-    content.textItems = items.map((item) => createTextItem(item, content.textStyle || {}));
+const applyTextItems = (content, items, textStyleOptions) => {
+    content.textItems = items.map((item) => createTextItem(item, content.textStyle || {}, textStyleOptions));
 };
-const mergeTextItems = (content, items, replaceAll) => {
+const mergeTextItems = (content, items, replaceAll, textStyleOptions) => {
     const hasIndexedItems = items.some((item) => item.item_index !== undefined);
     if (hasIndexedItems) {
         for (const item of items) {
@@ -21,32 +33,36 @@ const mergeTextItems = (content, items, replaceAll) => {
                 !content.textItems?.[targetIndex])
                 continue;
             const existing = content.textItems[targetIndex];
-            if (item.text !== undefined)
-                existing.text = item.text;
+            if (item.text !== undefined) {
+                const { html, wasTiptap } = resolveText(item.text);
+                existing.text = html;
+                existing.textStyle = clearTextStyleTypeIfTiptap(existing.textStyle || {}, wasTiptap, textStyleOptions);
+            }
             if (item.text_style && typeof item.text_style === 'object') {
                 const mergedStyle = (item.text_style
                     ? { ...(existing.textStyle || {}), ...item.text_style }
                     : existing.textStyle || {});
                 existing.textStyle = mergedStyle;
-                existing.text = updateRTEText(existing.text, mergedStyle);
             }
         }
         return;
     }
-    const updatedItems = items.map((item, index) => {
+    const itemsToMerge = items.filter((item) => item.insert_at === undefined);
+    const updatedItems = itemsToMerge.map((item, index) => {
         const existing = content.textItems?.[index];
         const baseStyle = existing?.textStyle || content.textStyle || {};
         const mergedStyle = (item.text_style ? { ...baseStyle, ...item.text_style } : baseStyle);
-        const text = item.text ?? existing?.text ?? '';
+        const resolved = item.text !== undefined ? resolveText(item.text) : null;
+        const text = resolved ? resolved.html : existing?.text ?? '';
         return {
-            text: item.text_style ? updateRTEText(text, mergedStyle) : text,
-            textStyle: mergedStyle,
+            text,
+            textStyle: clearTextStyleTypeIfTiptap(mergedStyle, resolved?.wasTiptap ?? false, textStyleOptions),
         };
     });
     if (!replaceAll &&
         content.textItems &&
-        content.textItems.length > items.length) {
-        updatedItems.push(...content.textItems.slice(items.length));
+        content.textItems.length > itemsToMerge.length) {
+        updatedItems.push(...content.textItems.slice(itemsToMerge.length));
     }
     content.textItems = updatedItems;
 };
@@ -54,19 +70,21 @@ const mergeTextItems = (content, items, replaceAll) => {
  * Handles the single `text` + `text_style` fields (BrandPage/BrandContact
  * or shorthand for the first item).
  */
-const applySingleTextField = (content, args) => {
-    if (typeof args.text === 'string') {
+const applySingleTextField = (content, args, textStyleOptions) => {
+    if (args.text !== undefined) {
+        const { html, wasTiptap } = resolveText(args.text);
         if (Array.isArray(content.textItems) && content.textItems.length > 0) {
             content.textItems[0] = {
                 ...content.textItems[0],
-                text: args.text,
+                text: html,
+                textStyle: clearTextStyleTypeIfTiptap(content.textItems[0].textStyle || {}, wasTiptap, textStyleOptions),
             };
         }
         else {
             content.textItems = [
                 {
-                    text: args.text,
-                    textStyle: { ...(content.textStyle || {}) },
+                    text: html,
+                    textStyle: clearTextStyleTypeIfTiptap({ ...(content.textStyle || {}) }, wasTiptap, textStyleOptions),
                 },
             ];
         }
@@ -77,39 +95,42 @@ const applySingleTextField = (content, args) => {
         content.textItems.length > 0) {
         const mergedStyle = {
             ...(content.textItems[0].textStyle || {}),
-            ...(content.textStyle || {}),
+            ...args.text_style,
         };
         content.textItems[0] = {
             ...content.textItems[0],
             textStyle: mergedStyle,
-            text: updateRTEText(content.textItems[0].text, mergedStyle),
         };
     }
 };
 export class TextSectionBuilder extends BaseSectionBuilder {
+    get sectionValidate() {
+        return validateTextSection;
+    }
     async buildAsync(model) {
         this.log('Build called');
         const validation = await this.validateAsync();
         if (validation.errors.length) {
             return { request: this.request, model, errors: validation.errors };
         }
-        const resolved = this.resolveContent(model);
+        const resolved = this.resolveAndRepositionContent(model);
         if ('error' in resolved)
             return resolved.error;
         const content = resolved.content;
+        const textStyleOptions = model.styles?.textStyles?.textStyleOptions;
         applyScalarFields(content, this.args, this.sectionType);
-        applyStyleFields(content, this.args, this.sectionType);
+        applyStyleFields(content, this.args, this.sectionType, this.getGlobalTextStyles(model));
         const args = this.args;
         if (args.items && Array.isArray(args.items)) {
             if (this.mode === 'create') {
-                applyTextItems(content, args.items);
+                applyTextItems(content, args.items, textStyleOptions);
             }
             else {
-                mergeTextItems(content, args.items, !!args._replace_items);
+                mergeTextItems(content, args.items, !!args._replace_items, textStyleOptions);
             }
         }
         else {
-            applySingleTextField(content, args);
+            applySingleTextField(content, args, textStyleOptions);
         }
         // Phase 2: Item operations (remove, insert, reorder)
         if (args._remove_item_indices?.length && content.textItems) {
@@ -129,9 +150,10 @@ export class TextSectionBuilder extends BaseSectionBuilder {
                 const textStyle = (item.text_style
                     ? { ...baseStyle, ...item.text_style }
                     : { ...baseStyle });
+                const { html, wasTiptap } = resolveText(item.text);
                 const newItem = {
-                    text: item.text ?? '',
-                    textStyle,
+                    text: html,
+                    textStyle: clearTextStyleTypeIfTiptap(textStyle, wasTiptap, textStyleOptions),
                 };
                 content.textItems = content.textItems ?? [];
                 content.textItems.splice(pos, 0, newItem);
@@ -155,6 +177,22 @@ export class TextSectionBuilder extends BaseSectionBuilder {
                 backgroundColor: args.background_color ?? '',
             };
         }
+        // CREATE-mode: the editor's `createInitialTextContent` factory seeds
+        // `content.text` with the i18n placeholder "This is a sample text" as a
+        // click-to-add affordance for the manual maker UI. That placeholder
+        // must not survive an AI-driven create. The AI flow writes resolved
+        // copy into `content.textItems` only — never to the legacy single-text
+        // `content.text` field — so when the renderer reads `content.text`
+        // (non-brandSite path in Text.vue, or any fallback for empty
+        // textItems), it falls back to the placeholder.
+        //
+        // Mirror the resolved first item's text into the legacy field so both
+        // renderer paths agree. Same pattern as yesterday's about-section /
+        // contact-form / testimonial RTE fix — clear the factory default and
+        // align both fields with the AI's actual output.
+        if (this.mode === 'create') {
+            content.text = content.textItems?.[0]?.text ?? '';
+        }
         return { request: this.request, model };
     }
 }

package/lib/src/metadata-builder/builders/section-content-factory.d.ts

@@ -1,3 +1,3 @@
-import type { Content } from '../../brand-page/models';
+import type { BrandPageType, Content } from '../../brand-page/models';
 import type { SectionType } from '../parsers/section-tool-arguments';
-export declare const createDefaultSectionContent: (sectionType: SectionType) => Content | null;
+export declare const createDefaultSectionContent: (sectionType: SectionType, brandPageType?: BrandPageType) => Content | null;

package/lib/src/metadata-builder/builders/section-content-factory.js

@@ -3,11 +3,17 @@
  * Used by BaseSectionBuilder when adding a new section to a page.
  */
 import { CONTENT_SETTINGS_CONFIGS } from '../../brand-page-maker/constants/config-settings-constant';
-export const createDefaultSectionContent = (sectionType) => {
+export const createDefaultSectionContent = (sectionType, brandPageType) => {
     const configs = CONTENT_SETTINGS_CONFIGS();
     const config = configs[sectionType];
     if (!config) {
         return null;
     }
-    return config.createInitialContent();
+    const options = brandPageType
+        ? {
+            brandPageType,
+            userState: { emailAddress: '' },
+        }
+        : undefined;
+    return config.createInitialContent(options);
 };