@designcrowd/library.brand-page 5.17.6 → 5.17.7

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

@@ -0,0 +1,50 @@
+import { applyScalarFields } from '../section-field-utils';
+import { BaseSectionBuilder } from './base-section-builder';
+const applySocialLinks = (content, links) => {
+    content.links = links.map((link) => ({
+        imageUrl: link.platform || '',
+        imageTitle: '',
+        width: 0,
+        height: 0,
+        imageLink: '',
+        url: link.url || '',
+    }));
+};
+const mergeSocialLinks = (content, links, replaceAll) => {
+    const updatedLinks = links.map((link, index) => {
+        const existing = content.links?.[index];
+        return {
+            ...(existing || {}),
+            imageUrl: link.platform ?? existing?.imageUrl ?? '',
+            url: link.url ?? existing?.url ?? '',
+        };
+    });
+    if (!replaceAll && content.links && content.links.length > links.length) {
+        updatedLinks.push(...content.links.slice(links.length));
+    }
+    content.links = updatedLinks;
+};
+export class SocialLinksBuilder extends BaseSectionBuilder {
+    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);
+        if ('error' in resolved)
+            return resolved.error;
+        const content = resolved.content;
+        applyScalarFields(content, this.args, this.sectionType);
+        const args = this.args;
+        if (args.links && Array.isArray(args.links)) {
+            if (this.mode === 'create') {
+                applySocialLinks(content, args.links);
+            }
+            else {
+                mergeSocialLinks(content, args.links, !!args._replace_items);
+            }
+        }
+        return { request: this.request, model };
+    }
+}

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

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

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

@@ -0,0 +1,133 @@
+import { applyScalarFields, applyStyleFields } from '../section-field-utils';
+import { BaseSectionBuilder } from './base-section-builder';
+const applyTestimonialItems = (content, items) => {
+    content.items = items.map((item) => ({
+        imageUrl: item.avatar_image_url || '',
+        name: item.name || '',
+        position: item.position || '',
+        testimonials: item.testimonial || '',
+        colorReplacements: [],
+        mediaType: 'image',
+    }));
+};
+const mergeTestimonialItems = (content, items, replaceAll) => {
+    const hasIndexedItems = items.some((item) => item.item_index !== undefined);
+    if (hasIndexedItems) {
+        for (const item of items) {
+            const targetIndex = item.item_index;
+            if (targetIndex === undefined ||
+                targetIndex < 0 ||
+                !content.items?.[targetIndex])
+                continue;
+            const existing = content.items[targetIndex];
+            if (item.avatar_image_url !== undefined)
+                existing.imageUrl = item.avatar_image_url;
+            if (item.name !== undefined)
+                existing.name = item.name;
+            if (item.position !== undefined)
+                existing.position = item.position;
+            if (item.testimonial !== undefined)
+                existing.testimonials = item.testimonial;
+        }
+        return;
+    }
+    const updatedItems = items.map((item, index) => {
+        const existing = content.items?.[index];
+        return {
+            ...(existing || {}),
+            imageUrl: item.avatar_image_url ?? existing?.imageUrl ?? '',
+            name: item.name ?? existing?.name ?? '',
+            position: item.position ?? existing?.position ?? '',
+            testimonials: item.testimonial ?? existing?.testimonials ?? '',
+            colorReplacements: existing?.colorReplacements ?? [],
+            mediaType: existing?.mediaType ?? 'image',
+        };
+    });
+    if (!replaceAll && content.items && content.items.length > items.length) {
+        updatedItems.push(...content.items.slice(items.length));
+    }
+    content.items = updatedItems;
+};
+export class TestimonialSectionBuilder extends BaseSectionBuilder {
+    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);
+        if ('error' in resolved)
+            return resolved.error;
+        const content = resolved.content;
+        applyScalarFields(content, this.args, this.sectionType);
+        applyStyleFields(content, this.args, this.sectionType);
+        const args = this.args;
+        if (args.background_style && typeof args.background_style === 'object') {
+            const existing = content.backgroundStyle || {};
+            content.backgroundStyle = {
+                ...existing,
+                ...Object.fromEntries(Object.entries(args.background_style).map(([k, v]) => [
+                    k,
+                    v === null ? '' : v,
+                ])),
+            };
+        }
+        if (args.card_style && typeof args.card_style === 'object') {
+            const existing = content.cardStyle || {};
+            content.cardStyle = {
+                ...existing,
+                ...Object.fromEntries(Object.entries(args.card_style).map(([k, v]) => [
+                    k,
+                    v === null ? '' : v,
+                ])),
+            };
+        }
+        if (args.items && Array.isArray(args.items)) {
+            if (this.mode === 'create') {
+                applyTestimonialItems(content, args.items);
+            }
+            else {
+                mergeTestimonialItems(content, args.items, !!args._replace_items);
+            }
+        }
+        // Phase 2: Item operations (remove, insert, reorder)
+        if (args._remove_item_indices?.length && content.items) {
+            const sorted = [...args._remove_item_indices].sort((a, b) => b - a);
+            for (const idx of sorted) {
+                if (idx >= 0 && idx < content.items.length) {
+                    content.items.splice(idx, 1);
+                }
+            }
+        }
+        if (args.items && Array.isArray(args.items)) {
+            const insertItems = args.items.filter((item) => item.insert_at !== undefined && item.item_index === undefined);
+            const sortedInserts = [...insertItems].sort((a, b) => (b.insert_at ?? 0) - (a.insert_at ?? 0));
+            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 ?? '',
+                    name: item.name ?? '',
+                    position: item.position ?? '',
+                    testimonials: item.testimonial ?? '',
+                    colorReplacements: [],
+                    mediaType: 'image',
+                };
+                content.items = content.items ?? [];
+                content.items.splice(pos, 0, newItem);
+            }
+        }
+        if (args._reorder_items?.length && content.items) {
+            const newOrder = args._reorder_items;
+            const unique = new Set(newOrder);
+            if (unique.size === newOrder.length) {
+                const reordered = newOrder
+                    .filter((idx) => idx >= 0 && idx < content.items.length)
+                    .map((idx) => content.items[idx]);
+                if (reordered.length === content.items.length) {
+                    content.items = reordered;
+                }
+            }
+        }
+        return { request: this.request, model };
+    }
+}

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

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

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

@@ -0,0 +1,154 @@
+import { updateRTEText } from '../../helpers/rte.helpers';
+import { applyScalarFields, applyStyleFields } from '../section-field-utils';
+import { BaseSectionBuilder } from './base-section-builder';
+const createTextItem = (item, baseStyle) => {
+    const textStyle = (item.text_style ? { ...baseStyle, ...item.text_style } : { ...baseStyle });
+    return {
+        text: item.text || '',
+        textStyle,
+    };
+};
+const applyTextItems = (content, items) => {
+    content.textItems = items.map((item) => createTextItem(item, content.textStyle || {}));
+};
+const mergeTextItems = (content, items, replaceAll) => {
+    const hasIndexedItems = items.some((item) => item.item_index !== undefined);
+    if (hasIndexedItems) {
+        for (const item of items) {
+            const targetIndex = item.item_index;
+            if (targetIndex === undefined ||
+                targetIndex < 0 ||
+                !content.textItems?.[targetIndex])
+                continue;
+            const existing = content.textItems[targetIndex];
+            if (item.text !== undefined)
+                existing.text = item.text;
+            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 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 ?? '';
+        return {
+            text: item.text_style ? updateRTEText(text, mergedStyle) : text,
+            textStyle: mergedStyle,
+        };
+    });
+    if (!replaceAll &&
+        content.textItems &&
+        content.textItems.length > items.length) {
+        updatedItems.push(...content.textItems.slice(items.length));
+    }
+    content.textItems = updatedItems;
+};
+/**
+ * Handles the single `text` + `text_style` fields (BrandPage/BrandContact
+ * or shorthand for the first item).
+ */
+const applySingleTextField = (content, args) => {
+    if (typeof args.text === 'string') {
+        if (Array.isArray(content.textItems) && content.textItems.length > 0) {
+            content.textItems[0] = {
+                ...content.textItems[0],
+                text: args.text,
+            };
+        }
+        else {
+            content.textItems = [
+                {
+                    text: args.text,
+                    textStyle: { ...(content.textStyle || {}) },
+                },
+            ];
+        }
+    }
+    if (args.text_style &&
+        typeof args.text_style === 'object' &&
+        Array.isArray(content.textItems) &&
+        content.textItems.length > 0) {
+        const mergedStyle = {
+            ...(content.textItems[0].textStyle || {}),
+            ...(content.textStyle || {}),
+        };
+        content.textItems[0] = {
+            ...content.textItems[0],
+            textStyle: mergedStyle,
+            text: updateRTEText(content.textItems[0].text, mergedStyle),
+        };
+    }
+};
+export class TextSectionBuilder extends BaseSectionBuilder {
+    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);
+        if ('error' in resolved)
+            return resolved.error;
+        const content = resolved.content;
+        applyScalarFields(content, this.args, this.sectionType);
+        applyStyleFields(content, this.args, this.sectionType);
+        const args = this.args;
+        if (args.items && Array.isArray(args.items)) {
+            if (this.mode === 'create') {
+                applyTextItems(content, args.items);
+            }
+            else {
+                mergeTextItems(content, args.items, !!args._replace_items);
+            }
+        }
+        else {
+            applySingleTextField(content, args);
+        }
+        // Phase 2: Item operations (remove, insert, reorder)
+        if (args._remove_item_indices?.length && content.textItems) {
+            const sorted = [...args._remove_item_indices].sort((a, b) => b - a);
+            for (const idx of sorted) {
+                if (idx >= 0 && idx < content.textItems.length) {
+                    content.textItems.splice(idx, 1);
+                }
+            }
+        }
+        if (args.items && Array.isArray(args.items)) {
+            const insertItems = args.items.filter((item) => item.insert_at !== undefined && item.item_index === undefined);
+            const sortedInserts = [...insertItems].sort((a, b) => (b.insert_at ?? 0) - (a.insert_at ?? 0));
+            for (const item of sortedInserts) {
+                const pos = Math.max(0, Math.min(item.insert_at ?? 0, content.textItems?.length ?? 0));
+                const baseStyle = content.textStyle || {};
+                const textStyle = (item.text_style
+                    ? { ...baseStyle, ...item.text_style }
+                    : { ...baseStyle });
+                const newItem = {
+                    text: item.text ?? '',
+                    textStyle,
+                };
+                content.textItems = content.textItems ?? [];
+                content.textItems.splice(pos, 0, newItem);
+            }
+        }
+        if (args._reorder_items?.length && content.textItems) {
+            const newOrder = args._reorder_items;
+            const unique = new Set(newOrder);
+            if (unique.size === newOrder.length) {
+                const reordered = newOrder
+                    .filter((idx) => idx >= 0 && idx < content.textItems.length)
+                    .map((idx) => content.textItems[idx]);
+                if (reordered.length === content.textItems.length) {
+                    content.textItems = reordered;
+                }
+            }
+        }
+        return { request: this.request, model };
+    }
+}

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

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

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

@@ -0,0 +1,13 @@
+/**
+ * Factory that creates default Content objects for each section type.
+ * 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) => {
+    const configs = CONTENT_SETTINGS_CONFIGS();
+    const config = configs[sectionType];
+    if (!config) {
+        return null;
+    }
+    return config.createInitialContent();
+};

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

@@ -0,0 +1,12 @@
+/**
+ * Maps AI tool call argument names → BrandPageModel content field names
+ * per section type.
+ *
+ * Reference: service.ai-pipelines/src/agents/website/section_schemas.py
+ * Reference: library.brand-page/src/brand-page/models/index.ts
+ */
+export type SectionFieldMap = Record<string, string>;
+export declare const SECTION_FIELD_MAPS: Record<string, SectionFieldMap>;
+export declare const getSectionFieldMap: (sectionType: string) => SectionFieldMap | undefined;
+export declare const STYLE_FIELD_MAPS: Record<string, SectionFieldMap>;
+export declare const getStyleFieldMap: (sectionType: string) => SectionFieldMap | undefined;

package/lib/src/metadata-builder/builders/section-field-maps.js

@@ -0,0 +1,180 @@
+/**
+ * Maps AI tool call argument names → BrandPageModel content field names
+ * per section type.
+ *
+ * Reference: service.ai-pipelines/src/agents/website/section_schemas.py
+ * Reference: library.brand-page/src/brand-page/models/index.ts
+ */
+/**
+ * Identity function that validates field map values are actual properties
+ * of the given Content subtype at compile time.
+ */
+function defineFieldMap(map) {
+    return map;
+}
+const bannerFields = defineFieldMap({
+    title: 'title',
+    description: 'description',
+    button_text: 'buttonText',
+    button_url: 'url',
+    background_image_url: 'imageUrl',
+    display_style: 'displayStyle',
+});
+const aboutFields = defineFieldMap({
+    title: 'title',
+    paragraph: 'paragraph',
+    about_image_url: 'imageUrl',
+    display_style: 'displayStyle',
+});
+const testimonialFields = defineFieldMap({
+    title: 'title',
+    display_style: 'displayStyle',
+    // items handled separately
+});
+const imagesSectionFields = defineFieldMap({
+    title: 'title',
+    description: 'description',
+    display_style: 'displayStyle',
+    aspect_ratio: 'aspectRatio',
+    are_images_full_width: 'areImagesFullWidth',
+    // items handled separately
+});
+const shapesSectionFields = defineFieldMap({
+    title: 'title',
+    description: 'description',
+    display_style: 'displayStyle',
+    size: 'size',
+    // items handled separately
+});
+const textFields = defineFieldMap({
+    text: 'text',
+});
+const profileFields = defineFieldMap({
+    name: 'name',
+    title: 'title',
+    description: 'description',
+    avatar_image_url: 'avatarImageUrl',
+});
+const contactFormFields = defineFieldMap({
+    title: 'title',
+    description: 'description',
+    button_text: 'buttonText',
+    success_message: 'successMessage',
+    response_email: 'responseEmail',
+    header_image_url: 'imageUrl',
+    display_style: 'displayStyle',
+    layout_style: 'layoutStyle',
+});
+const mailingListFields = defineFieldMap({
+    title: 'title',
+    button_text: 'buttonText',
+});
+const socialLinksFields = defineFieldMap({
+    title: 'title',
+    icon_style: 'iconDisplayStyle',
+    // links handled separately
+});
+const dividerFields = defineFieldMap({
+    divider_style: 'dividerStyle',
+});
+const imageFields = defineFieldMap({
+    image_url: 'imageUrl',
+    image_title: 'imageTitle',
+});
+const imageGalleryFields = defineFieldMap({
+// images handled separately
+});
+const buttonWithIconFields = defineFieldMap({
+    title: 'title',
+    url: 'url',
+    icon_image_url: 'iconUrl',
+});
+const emailButtonFields = defineFieldMap({
+    title: 'title',
+    email: 'url',
+    icon_image_url: 'iconUrl',
+});
+const phoneButtonFields = defineFieldMap({
+    title: 'title',
+    phone_number: 'url',
+    icon_image_url: 'iconUrl',
+});
+const socialButtonFields = defineFieldMap({
+    title: 'title',
+    url: 'url',
+});
+export const SECTION_FIELD_MAPS = {
+    'banner-section': bannerFields,
+    'about-section': aboutFields,
+    'testimonial-section': testimonialFields,
+    'images-section': imagesSectionFields,
+    'shapes-section': shapesSectionFields,
+    text: textFields,
+    profile: profileFields,
+    'contact-form': contactFormFields,
+    'mailing-list': mailingListFields,
+    'social-links': socialLinksFields,
+    'divider-section': dividerFields,
+    image: imageFields,
+    'image-gallery': imageGalleryFields,
+    'general-link': buttonWithIconFields,
+    website: buttonWithIconFields,
+    email: emailButtonFields,
+    phone: phoneButtonFields,
+    facebook: socialButtonFields,
+    x: socialButtonFields,
+    instagram: socialButtonFields,
+    youtube: socialButtonFields,
+    linkedin: socialButtonFields,
+    pinterest: socialButtonFields,
+    twitch: socialButtonFields,
+    tiktok: socialButtonFields,
+};
+export const getSectionFieldMap = (sectionType) => {
+    return SECTION_FIELD_MAPS[sectionType];
+};
+const bannerStyleFields = defineFieldMap({
+    title_style: 'titleStyle',
+    description_style: 'descriptionStyle',
+    button_text_style: 'buttonTextStyle',
+});
+const aboutStyleFields = defineFieldMap({
+    title_style: 'titleStyle',
+    paragraph_style: 'paragraphStyle',
+});
+const textStyleFields = defineFieldMap({
+    text_style: 'textStyle',
+});
+const testimonialStyleFields = defineFieldMap({
+    title_style: 'titleStyle',
+    testimonial_style: 'testimonialStyle',
+    name_style: 'nameStyle',
+    position_style: 'positionStyle',
+});
+const contactFormStyleFields = defineFieldMap({
+    title_style: 'titleStyle',
+    description_style: 'descriptionStyle',
+    button_text_style: 'buttonTextStyle',
+});
+const imagesSectionStyleFields = defineFieldMap({
+    title_style: 'titleStyle',
+    description_style: 'descriptionStyle',
+    heading_style: 'headingStyle',
+    paragraph_style: 'paragraphStyle',
+});
+const shapesSectionStyleFields = defineFieldMap({
+    title_style: 'titleStyle',
+    description_style: 'descriptionStyle',
+    heading_style: 'headingStyle',
+    paragraph_style: 'paragraphStyle',
+});
+export const STYLE_FIELD_MAPS = {
+    'banner-section': bannerStyleFields,
+    'about-section': aboutStyleFields,
+    text: textStyleFields,
+    'testimonial-section': testimonialStyleFields,
+    'contact-form': contactFormStyleFields,
+    'images-section': imagesSectionStyleFields,
+    'shapes-section': shapesSectionStyleFields,
+};
+export const getStyleFieldMap = (sectionType) => STYLE_FIELD_MAPS[sectionType];

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

@@ -0,0 +1,11 @@
+import type { Content } from '../../brand-page/models';
+import type { SectionToolArguments } from '../parsers/section-tool-arguments';
+export declare const applyScalarFields: (content: Content, args: SectionToolArguments, sectionType: string) => void;
+export declare const applyStyleFields: (content: Content, args: SectionToolArguments, sectionType: string) => void;
+/**
+ * Re-applies merged styles to RTE content fields after applyStyleFields has
+ * updated the style objects. Only runs for section types that support RTE
+ * (defined by RTE_ALLOWED_SECTION_TYPES) and only touches fields in the
+ * RTE_ALLOWED_FIELDS list.
+ */
+export declare const applyRTEStyles: (content: Content, args: SectionToolArguments, sectionType: string) => void;