@designcrowd/library.brand-page 6.2.3-ast-faq → 6.2.3

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

@@ -24,24 +24,6 @@ export const useExternalRichTextEditor = () => {
         externalEditor,
     };
 };
-/**
- * An editor bound to a list item (`itemStyleTarget`) writes its toolbar styles to that
- * item's own style field instead of the section-level `${name}Style`. Returns false when
- * the editor has no item target, so the caller falls through to its section-level write.
- */
-export const writeListItemStyles = (store, props, value, isHydrationWrite) => {
-    if (!props.itemStyleTarget) {
-        return false;
-    }
-    store.updateListItemTextStyles({
-        id: props.rawId,
-        name: props.name,
-        value,
-        target: props.itemStyleTarget,
-        isHydrationWrite,
-    });
-    return true;
-};
 export const useRichTextEditor = (model, props, emit, fontSettings, fontStyleDropdownRef, 
 // One entry of `textStyleOptions`; `undefined` when the selection is "none".
 selectedGlobalTextStyles, onSelectTextStyleType, updateRichTextEditor, textStyleTypeOptions, markedText, isHyperlinkPopupOpen, selectedLinkTypeValue) => {
@@ -222,21 +204,6 @@ selectedGlobalTextStyles, onSelectTextStyleType, updateRichTextEditor, textStyle
             });
         }
     });
-    // Set while a toolbar command runs. The toolbar has taken focus by then, so
-    // `isFocused` alone would tag the command's write as hydration and fold it into
-    // the previous undo entry — hidden only when a style write rides along and opens
-    // an entry of its own. Synchronous commands only: the spacing sliders dispatch
-    // after a debounce and are not covered.
-    let isRunningToolbarCommand = false;
-    const runAsToolbarCommand = (command) => {
-        isRunningToolbarCommand = true;
-        try {
-            return command();
-        }
-        finally {
-            isRunningToolbarCommand = false;
-        }
-    };
     // Update model when editor content changes. RTE content is stored as Tiptap
     // JSON (BP-5787). getJSON() is already in hand (the editor holds the doc) and
     // is sanitised natively — no getHTML(), no DOMPurify, no extra editor — so
@@ -250,9 +217,15 @@ selectedGlobalTextStyles, onSelectTextStyleType, updateRichTextEditor, textStyle
         // field → store chain and arms the history merge at the moment of the
         // store write — arming here at emit time would lapse before the
         // debounce fires. Genuine edits happen while focused and commit
-        // normally, and so do synchronous toolbar commands (isRunningToolbarCommand).
+        // normally.
+        //
+        // Known limitation: a programmatic toolbar command run on an editor the
+        // user hasn't focused yet would also merge (losing that undo step). Today
+        // the RTE only mounts inside an already-open settings drawer and the user
+        // focuses it before formatting, so this doesn't occur — revisit if a
+        // consumer ever drives toolbar actions on an unfocused editor.
         emit('update:modelValue', sanitizeRteJson(editor.getJSON()), {
-            isHydrationWrite: !editor.isFocused && !isRunningToolbarCommand,
+            isHydrationWrite: !editor.isFocused,
         });
     });
     editor.on('selectionUpdate', () => {
@@ -330,30 +303,26 @@ selectedGlobalTextStyles, onSelectTextStyleType, updateRichTextEditor, textStyle
             // write lands ~100ms BEFORE the editor's canonical text write-back, and
             // an unflagged write here would open a plain capture burst that
             // swallows the flagged text write into a phantom entry (BP-5810).
-            const syncedStyles = {
-                fontSize: globalStyles.fontSize,
-                fontFamily: globalStyles.fontFamily,
-                fontWeight: globalStyles.fontWeight,
-                fontStyle: globalStyles.fontStyle,
-                textDecoration: globalStyles.textDecoration,
-                // Keep an element colour override (a creation-time contrast bake, or a
-                // colour picked while linked) — only fall back to the global style's colour
-                // when the element has none, mirroring `resolveTextColor`'s element-first
-                // cascade. Blindly taking `globalStyles.color` here re-derived the linked
-                // colour on every RTE mount and clobbered the override.
-                color: props.styles?.color || globalStyles.color,
-                lineHeight: globalStyles.lineHeight,
-                letterSpacing: globalStyles.letterSpacing,
-            };
-            const isHydrationWrite = !editor.isFocused;
-            if (!writeListItemStyles(contentSettingStore, props, syncedStyles, isHydrationWrite)) {
-                contentSettingStore.updateTextStyles({
-                    id: props.rawId,
-                    name: props.name,
-                    value: syncedStyles,
-                    isHydrationWrite,
-                });
-            }
+            contentSettingStore.updateTextStyles({
+                id: props.rawId,
+                name: props.name,
+                value: {
+                    fontSize: globalStyles.fontSize,
+                    fontFamily: globalStyles.fontFamily,
+                    fontWeight: globalStyles.fontWeight,
+                    fontStyle: globalStyles.fontStyle,
+                    textDecoration: globalStyles.textDecoration,
+                    // Keep an element colour override (a creation-time contrast bake, or a
+                    // colour picked while linked) — only fall back to the global style's colour
+                    // when the element has none, mirroring `resolveTextColor`'s element-first
+                    // cascade. Blindly taking `globalStyles.color` here re-derived the linked
+                    // colour on every RTE mount and clobbered the override.
+                    color: props.styles?.color || globalStyles.color,
+                    lineHeight: globalStyles.lineHeight,
+                    letterSpacing: globalStyles.letterSpacing,
+                },
+                isHydrationWrite: !editor.isFocused,
+            });
             // sync toolbar editor styles
             fontSettings.selectedFont = globalStyles?.fontFamily ?? 'Lato';
             fontSettings.selectedFontSize = globalStyles?.fontSize ?? '2.25em';
@@ -507,9 +476,6 @@ selectedGlobalTextStyles, onSelectTextStyleType, updateRichTextEditor, textStyle
         syncContentSettings(fontStyleChanges);
     };
     const syncContentSettings = (fontStyleChanges) => {
-        if (writeListItemStyles(contentSettingStore, props, fontStyleChanges)) {
-            return;
-        }
         if (props.name === 'textItems') {
             contentSettingStore.updateTextItemTextStyleTypeWithStyles({
                 id: props.rawId,
@@ -618,7 +584,7 @@ selectedGlobalTextStyles, onSelectTextStyleType, updateRichTextEditor, textStyle
         editor,
         onFocus,
         onBlur,
-        triggerEditorStyleChange: (editorOption) => runAsToolbarCommand(() => triggerEditorStyleChange(editorOption)),
+        triggerEditorStyleChange,
         toggleBold,
         toggleItalic,
         toggleUnderline,
@@ -635,7 +601,7 @@ selectedGlobalTextStyles, onSelectTextStyleType, updateRichTextEditor, textStyle
         setInitialStyleSettings,
         copyGlobalStyleSettings,
         unsetAllMarks,
-        handleHyperlink: (...args) => runAsToolbarCommand(() => handleHyperlink(...args)),
+        handleHyperlink,
         hyperlinkValue,
         setHyperlinkUrlValue,
         shouldShow,

package/lib/src/brand-page-maker/constants/config-settings-constant.d.ts

@@ -1,4 +1,4 @@
-import type { LogoContent, FacebookContent, GeneralLinkContent, PhoneContent, EmailContent, ImageContent, InstagramContent, LinkedInContent, PinterestContent, ProfileContent, TextContent, TiktokContent, TwitchContent, XContent, VideoContent, WebsiteContent, YoutubeContent, ContentType, MapContent, ImageGalleryContent, MailingListContent, RequestPaymentContent, SupportMeContent, ContactFormContent, BannerSectionContent, SocialLinksContent, ImagesSectionContent, TestimonialSectionContent, AboutSectionContent, DividerSectionContent, ShapesSectionContent, ShopContent, BookingSectionContent, FaqSectionContent } from '@brand-page';
+import type { LogoContent, FacebookContent, GeneralLinkContent, PhoneContent, EmailContent, ImageContent, InstagramContent, LinkedInContent, PinterestContent, ProfileContent, TextContent, TiktokContent, TwitchContent, XContent, VideoContent, WebsiteContent, YoutubeContent, ContentType, MapContent, ImageGalleryContent, MailingListContent, RequestPaymentContent, SupportMeContent, ContactFormContent, BannerSectionContent, SocialLinksContent, ImagesSectionContent, TestimonialSectionContent, AboutSectionContent, DividerSectionContent, ShapesSectionContent, ShopContent, BookingSectionContent } from '@brand-page';
 import type { ContentSettingsConfig, ContentSettingsField, ContentSettingsMultiField } from '../models';
 export declare const LOGO_SETTINGS_CONFIG: () => ContentSettingsConfig<Omit<LogoContent, "version" | "logoVariation" | "logoImageHeight" | "logoImageWidth" | "logoLastUpdate" | "logoImageBase64Url">>;
 export declare const GENERAL_LINK_CONTENT_SETTINGS_CONFIG: () => ContentSettingsConfig<GeneralLinkContent>;
@@ -51,5 +51,4 @@ export declare const SHOP_SECTION_SETTINGS_CONFIG: () => ContentSettingsConfig<S
     isShippingEnabled: boolean;
 }>;
 export declare const BOOKING_SECTION_SETTINGS_CONFIG: () => ContentSettingsConfig<BookingSectionContent>;
-export declare const FAQ_SECTION_SETTINGS_CONFIG: () => ContentSettingsConfig<FaqSectionContent>;
 export declare const CONTENT_SETTINGS_CONFIGS: () => Record<ContentType, ContentSettingsConfig<any>>;

package/lib/src/brand-page-maker/constants/config-settings-constant.js

@@ -1,5 +1,5 @@
-import { FAQ_DISPLAY_STYLES, FAQ_MAX_ITEMS, SOCIAL_LINKS_ICON_DISPLAY_STYLES, BRAND_PAGE_TYPES, DIVIDER_STYLES, MEDIA_TYPES, BUTTON_LINK_TYPE, FONT_SIZE_BODY, LINE_HEIGHT_BODY, MIN_TEXT_SIZE_PX, MAX_TEXT_SIZE_PX, TEXT_COLUMNS, DEFAULT_SHAPE_SIZE, PAYMENT_OPTION_DISPLAY_TYPES, PAYMENT_OPTION_IMAGE_TYPES, GettyVideoMedia, } from '@brand-page';
-import { createInitialButtonContent, createInitialImageContent, createInitialProfileContent, createInitialTextContent, createInitialVideoContent, createInitialLogoContent, createInitialMapContent, createInitialImageGalleryContent, createInitialGeneralLinkContent, createInitialMailingListContent, createInitialRequestPaymentContent, createInitialSupportMeContent, createInitialContactFormContent, CONTENT_SETTINGS_DISPLAY_MODES, createInitialBannerSectionContent, createInitialSocialLinksContent, createInitialImagesSectionContent, createInitialTestimonialSectionContent, createInitialAboutSectionContent, createInitialDividerSectionContent, createInitialShapesSectionContent, VARIANT_DISPLAY_MODES, createInitialShopContent, createInitialBookingSectionContent, createInitialFaqSectionContent, createInitialFaqQuestionStyle, createInitialFaqAnswerStyle, } from '../models';
+import { SOCIAL_LINKS_ICON_DISPLAY_STYLES, BRAND_PAGE_TYPES, DIVIDER_STYLES, MEDIA_TYPES, BUTTON_LINK_TYPE, FONT_SIZE_BODY, LINE_HEIGHT_BODY, MIN_TEXT_SIZE_PX, MAX_TEXT_SIZE_PX, TEXT_COLUMNS, DEFAULT_SHAPE_SIZE, PAYMENT_OPTION_DISPLAY_TYPES, PAYMENT_OPTION_IMAGE_TYPES, GettyVideoMedia, } from '@brand-page';
+import { createInitialButtonContent, createInitialImageContent, createInitialProfileContent, createInitialTextContent, createInitialVideoContent, createInitialLogoContent, createInitialMapContent, createInitialImageGalleryContent, createInitialGeneralLinkContent, createInitialMailingListContent, createInitialRequestPaymentContent, createInitialSupportMeContent, createInitialContactFormContent, CONTENT_SETTINGS_DISPLAY_MODES, createInitialBannerSectionContent, createInitialSocialLinksContent, createInitialImagesSectionContent, createInitialTestimonialSectionContent, createInitialAboutSectionContent, createInitialDividerSectionContent, createInitialShapesSectionContent, VARIANT_DISPLAY_MODES, createInitialShopContent, createInitialBookingSectionContent, } from '../models';
 import * as uuid from 'uuid';
 import { colorConvertor, backgroundColorConvertor, borderColorConvertor, displayStyleConvertor, galleryTypeConvertor, imageAspectRatioConvertor, textAlignmentOptionsConvertor, videoContentStateConvertor, fillColorConvertor, bannerAlignDisplayStyleConvertor, aboutDisplayStyleConvertor, dividerStyleConvertor, shapeSizeOptionsConvertor, buttonLinkStyleConvertor, textSizeValueConvertor, textColumnStyleConvertor, contactLayoutStyleConvertor, paymentLinkDisplayStyleConvertor, shopDisplayConvertor, shopAspectRatioConvertor, } from '../convertors';
 import { ALIGN_CENTERED, DISPLAY_STYLE_COLLAPSED, DISPLAY_STYLE_PREVIEW, } from '@brand-page';
@@ -8,7 +8,6 @@ import { contactFormCardColorDefaultGetter, paymentFillColorFieldDefaultGetter,
 import { socialLinksIconDisplayStyleConvertor } from '../convertors/social-links-icon-display-style.convertor';
 import { getTextMediaOptionsConverterByMediaType } from '../convertors/text-image-display-style.convertor';
 import { testimonialDisplayStyleConvertor } from '../convertors/testimonial-display-style-convertor';
-import { faqDisplayStyleConvertor } from '../convertors/faq-display-style.convertor';
 import { pageValidator, urlValidator } from '../validators';
 import { imagesSectionAspectRatioVisibilityAssessor } from '../assessors/images-section-aspect-ratio-visibility.assessor';
 import { bannerLinkTypeVisibilityAssessor, bannerSectionPageVisibilityAssessor, bannerSectionUrlVisibilityAssessor, bannerDisplayTypeVisibilityAssessor, bannerOverlayOptionsVisibilityAssessor, } from '../assessors/banner-section-description-visibility.assessor';
@@ -2808,103 +2807,6 @@ export const BOOKING_SECTION_SETTINGS_CONFIG = () => ({
     isEnabled: true,
     isLocked: false,
 });
-const FAQ_FIELD_GROUP_IDS = {
-    settings: 'settings',
-    items: 'items',
-    style: 'style',
-};
-export const FAQ_SECTION_SETTINGS_CONFIG = () => ({
-    type: 'faq-section',
-    category: 'general',
-    createInitialContent: createInitialFaqSectionContent,
-    displayMode: CONTENT_SETTINGS_DISPLAY_MODES.focused,
-    defaultIconName: 'question-circle-filled',
-    displayName: contentSettingsTr(`faqSectionDisplayName`),
-    fieldGroups: [
-        {
-            id: FAQ_FIELD_GROUP_IDS.settings,
-            displayName: contentSettingsTr(`settingsDisplayName`),
-            isCollapsed: false,
-        },
-        {
-            id: FAQ_FIELD_GROUP_IDS.items,
-            displayName: contentSettingsTr(`faqItemsDisplayName`),
-            isCollapsed: false,
-        },
-        {
-            id: FAQ_FIELD_GROUP_IDS.style,
-            displayName: contentSettingsTr(`styleDisplayName`),
-            isCollapsed: true,
-        },
-    ],
-    fields: {
-        titleStyle: DEFAULT_TITLE_STYLE_SETTINGS_FILED_WITH_TITLE(),
-        descriptionStyle: DEFAULT_DESCRIPTION_STYLE_FILED(),
-        title: {
-            type: 'text',
-            placeholder: contentSettingsTr(`titlePlaceholder`),
-            title: contentSettingsTr(`titleTitle`),
-            groupId: FAQ_FIELD_GROUP_IDS.settings,
-            maxLength: 200,
-        },
-        description: {
-            type: 'textarea',
-            placeholder: contentSettingsTr(`descriptionPlaceholder`),
-            title: contentSettingsTr(`descriptionTitle`),
-            groupId: FAQ_FIELD_GROUP_IDS.settings,
-            maxLength: 1000,
-        },
-        items: {
-            type: 'list-items',
-            defaultValue: [],
-            groupId: FAQ_FIELD_GROUP_IDS.items,
-            maxLength: FAQ_MAX_ITEMS,
-            itemFields: [
-                {
-                    key: 'question',
-                    kind: 'text',
-                    styleKey: 'questionStyle',
-                    defaultStyle: () => createInitialFaqQuestionStyle(),
-                    maxLength: 200,
-                    title: contentSettingsTr(`faqQuestionTitle`),
-                    placeholder: contentSettingsTr(`faqQuestionPlaceholder`),
-                    defaultValue: () => contentSettingsTr(`faqNewQuestion`),
-                },
-                {
-                    key: 'answer',
-                    kind: 'textarea',
-                    styleKey: 'answerStyle',
-                    defaultStyle: () => createInitialFaqAnswerStyle(),
-                    maxLength: 1000,
-                    title: contentSettingsTr(`faqAnswerTitle`),
-                    placeholder: contentSettingsTr(`faqAnswerPlaceholder`),
-                    defaultValue: () => contentSettingsTr(`faqNewAnswer`),
-                },
-            ],
-        },
-        displayStyle: {
-            type: 'radio',
-            role: 'multi',
-            defaultValue: FAQ_DISPLAY_STYLES.centered,
-            title: contentSettingsTr(`displayStyleTitle`),
-            optionsConvertor: faqDisplayStyleConvertor,
-            groupId: FAQ_FIELD_GROUP_IDS.style,
-            variant: 'icon',
-        },
-        ...PADDING_CONTROL_FIELDS(FAQ_FIELD_GROUP_IDS.style),
-        backgroundStyle: {
-            type: 'color',
-            groupId: FAQ_FIELD_GROUP_IDS.style,
-            defaultValue: {},
-            isInline: true,
-            showToggle: false,
-            title: contentSettingsTr(`backgroundColorTitle`),
-            valueConvertor: backgroundColorConvertor,
-        },
-    },
-    isEnabled: true,
-    isLocked: false,
-});
 export const CONTENT_SETTINGS_CONFIGS = () => ({
     logo: LOGO_SETTINGS_CONFIG(),
     'general-link': GENERAL_LINK_CONTENT_SETTINGS_CONFIG(),
@@ -2938,5 +2840,4 @@ export const CONTENT_SETTINGS_CONFIGS = () => ({
     'shapes-section': SHAPES_SECTION_SETTINGS_CONFIG(),
     'shop-section': SHOP_SECTION_SETTINGS_CONFIG(),
     'booking-section': BOOKING_SECTION_SETTINGS_CONFIG(),
-    'faq-section': FAQ_SECTION_SETTINGS_CONFIG(),
 });

package/lib/src/brand-page-maker/models/content-settings-configs.d.ts

@@ -1,4 +1,4 @@
-import type { BrandPageContext, BrandPageType, Content, ContentType, TextStyleDeclaration } from '@brand-page';
+import type { BrandPageContext, BrandPageType, Content, ContentType } from '@brand-page';
 import type { ContentReplaceImageSettings } from '@shared/content-settings/models';
 import type { UIUserFeatures } from '@src/constants/ui';
 import type { OptionsConvertor, ValueConvertor } from './convertor.model';
@@ -52,7 +52,6 @@ export declare const ITEM_FIELD_TYPES: {
     readonly 'color-replacements': "color-replacements";
     readonly 'testimonial-items': "testimonial-items";
     readonly 'text-items': "text-items";
-    readonly 'list-items': "list-items";
     readonly 'page-dropdown': "page-dropdown";
     readonly 'personalisation-override': "personalisation-override";
 };
@@ -105,26 +104,6 @@ export interface ContentSettingsField<TContent> {
      * Defaults to `${fieldName}Style` when not specified.
      */
     styleName?: string;
-    /** `list-items` only: the per-item inputs, in order. The first `text` input labels the row. */
-    itemFields?: ListItemFieldSchema[];
-}
-export interface ListItemFieldSchema {
-    key: string;
-    /** The plain input used when the rich-text editor is unavailable. */
-    kind: 'text' | 'textarea';
-    title: string;
-    placeholder?: string;
-    maxLength?: number;
-    /**
-     * The item field that holds this text's style. Set it to make the text rich text —
-     * the same editor as a section title, writing this item's own style — whenever the
-     * section allows rich text. Without rich text, a font-style control edits it instead.
-     */
-    styleKey?: string;
-    /** Style a first item starts with; later items copy the last item's style. */
-    defaultStyle?: () => TextStyleDeclaration;
-    /** Value a newly added item starts with. */
-    defaultValue?: () => string;
 }
 export interface ContentSettingsMultiField<TContent, TField> extends Omit<ContentSettingsField<TContent>, 'type' | 'role'> {
     type: ItemMultiFieldType;

package/lib/src/brand-page-maker/models/content-settings-configs.js

@@ -55,7 +55,6 @@ export const ITEM_FIELD_TYPES = {
     'color-replacements': 'color-replacements',
     'testimonial-items': 'testimonial-items',
     'text-items': 'text-items',
-    'list-items': 'list-items',
     'page-dropdown': 'page-dropdown',
     'personalisation-override': 'personalisation-override',
 };

package/lib/src/brand-page-maker/models/content-settings.d.ts

@@ -1,5 +1,5 @@
 import { BrandPageModel } from '@brand-page';
-import type { ButtonContent, ContentType, ImageContent, ProfileContent, TextContent, VideoContent, LogoContent, LogoTheme, MapContent, ImageGalleryContent, GeneralLinkContent, MailingListContent, RequestPaymentContent, ContactFormContent, BannerSectionContent, SocialLinksContent, ImagesSectionContent, TestimonialSectionContent, AboutSectionContent, DividerSectionContent, ShapesSectionContent, BrandPageType, SupportMeContent, ShopContent, BookingSectionContent, TextStyleDeclaration, FaqSectionContent } from '@brand-page';
+import type { ButtonContent, ContentType, ImageContent, ProfileContent, TextContent, VideoContent, LogoContent, LogoTheme, MapContent, ImageGalleryContent, GeneralLinkContent, MailingListContent, RequestPaymentContent, ContactFormContent, BannerSectionContent, SocialLinksContent, ImagesSectionContent, TestimonialSectionContent, AboutSectionContent, DividerSectionContent, ShapesSectionContent, BrandPageType, SupportMeContent, ShopContent, BookingSectionContent } from '@brand-page';
 import type { CreateInitialContentFunction } from './content-settings-configs';
 import type { CreateInitialContentOptions } from '@shared/content-settings/models';
 export declare const createInitialButtonContent: (type: ContentType, iconUrl: string, options?: CreateInitialContentOptions) => () => ButtonContent;
@@ -18,9 +18,6 @@ export declare const createInitialSupportMeContent: (options?: CreateInitialCont
 export declare const createInitialContactFormContent: CreateInitialContentFunction<ContactFormContent>;
 export declare const createInitialBannerSectionContent: CreateInitialContentFunction<BannerSectionContent>;
 export declare const createInitialBookingSectionContent: CreateInitialContentFunction<BookingSectionContent>;
-export declare const createInitialFaqQuestionStyle: (applyAutoScale?: boolean) => TextStyleDeclaration;
-export declare const createInitialFaqAnswerStyle: (applyAutoScale?: boolean) => TextStyleDeclaration;
-export declare const createInitialFaqSectionContent: CreateInitialContentFunction<FaqSectionContent>;
 export declare const createInitialImagesSectionContent: CreateInitialContentFunction<ImagesSectionContent>;
 export declare const createInitialTestimonialSectionContent: CreateInitialContentFunction<TestimonialSectionContent>;
 export declare const createInitialAboutSectionContent: CreateInitialContentFunction<AboutSectionContent>;

package/lib/src/brand-page-maker/models/content-settings.js

@@ -1,4 +1,4 @@
-import { BrandPageModel, PageStyles, FORM_FIELD_IDS, PAYMENT_OPTION_DISPLAY_TYPES, PAYMENT_OPTION_IMAGE_TYPES, SOCIAL_LINKS_ICON_DISPLAY_STYLES, PageHeaderMobile, PageHeaderDesktop, PageFooterMobile, PageFooterDesktop, MEDIA_TYPES, BUTTON_LINK_TYPE, DISPLAY_STYLE_PREVIEW, SUPPORT_ME_CUSTOM_PRODUCT_NAME, DEFAULT_LOGO_HEIGHT, DEFAULT_LOGO_WIDTH, FONT_SIZE_BODY, LINE_HEIGHT_BODY, TEXT_STYLE_TYPES, TEXT_COLUMNS, DEFAULT_LOGO_BACKGROUND_COLOR_RGB, DEFAULT_LOGO_TEXT_COLOR_RGB, EMPTY_LOGO_IMAGE_MODEL, BRAND_PAGE_TYPES, SENSITIVE_CONTENT_TYPES, CONTACT_FORM_LAYOUT_DEFAULT_PADDING, TESTIMONIAL_DEFAULT_PADDING, FAQ_DISPLAY_STYLES, } from '@brand-page';
+import { BrandPageModel, PageStyles, FORM_FIELD_IDS, PAYMENT_OPTION_DISPLAY_TYPES, PAYMENT_OPTION_IMAGE_TYPES, SOCIAL_LINKS_ICON_DISPLAY_STYLES, PageHeaderMobile, PageHeaderDesktop, PageFooterMobile, PageFooterDesktop, MEDIA_TYPES, BUTTON_LINK_TYPE, DISPLAY_STYLE_PREVIEW, SUPPORT_ME_CUSTOM_PRODUCT_NAME, DEFAULT_LOGO_HEIGHT, DEFAULT_LOGO_WIDTH, FONT_SIZE_BODY, LINE_HEIGHT_BODY, TEXT_STYLE_TYPES, TEXT_COLUMNS, DEFAULT_LOGO_BACKGROUND_COLOR_RGB, DEFAULT_LOGO_TEXT_COLOR_RGB, EMPTY_LOGO_IMAGE_MODEL, BRAND_PAGE_TYPES, SENSITIVE_CONTENT_TYPES, CONTACT_FORM_LAYOUT_DEFAULT_PADDING, TESTIMONIAL_DEFAULT_PADDING, } from '@brand-page';
 import * as uuid from 'uuid';
 import { getColorShades, DEFAULT_CARD_SURFACE_REFERENCE, } from '@brand-page/utils';
 import { contentSettingsTr } from '@src/composables/useTranslate';
@@ -556,50 +556,6 @@ export const createInitialBookingSectionContent = (options) => {
         },
     };
 };
-// Questions follow the Headings role, answers the Paragraphs role.
-export const createInitialFaqQuestionStyle = (applyAutoScale = false) => ({
-    applyAutoScale,
-    textStyleType: TEXT_STYLE_TYPES.headings,
-    textAlign: 'left',
-});
-export const createInitialFaqAnswerStyle = (applyAutoScale = false) => ({
-    applyAutoScale,
-    textStyleType: TEXT_STYLE_TYPES.paragraphs,
-    textAlign: 'left',
-});
-export const createInitialFaqSectionContent = (options) => {
-    const applyAutoScale = options?.brandPageType === BRAND_PAGE_TYPES.brandSite;
-    return {
-        id: uuid.v4(),
-        type: 'faq-section',
-        title: contentSettingsTr(`defaultFaqTitle`),
-        description: contentSettingsTr(`defaultFaqDescription`),
-        displayStyle: FAQ_DISPLAY_STYLES.centered,
-        topPadding: 32,
-        bottomPadding: 32,
-        // One sample item; the design's four are only there to show a longer list.
-        items: [
-            {
-                id: uuid.v4(),
-                question: contentSettingsTr(`defaultFaqQuestion`),
-                questionStyle: createInitialFaqQuestionStyle(applyAutoScale),
-                answer: contentSettingsTr(`defaultFaqAnswer`),
-                answerStyle: createInitialFaqAnswerStyle(applyAutoScale),
-            },
-        ],
-        titleStyle: {
-            applyAutoScale,
-            textStyleType: TEXT_STYLE_TYPES.titles,
-            textAlign: 'center',
-        },
-        descriptionStyle: {
-            applyAutoScale,
-            textStyleType: TEXT_STYLE_TYPES.paragraphs,
-            textAlign: 'center',
-        },
-        backgroundStyle: {},
-    };
-};
 export const createInitialImagesSectionContent = (options) => {
     return {
         id: uuid.v4(),

package/lib/src/brand-page-maker/stores/brandpage-maker/brandpage-maker-store.js

@@ -1477,7 +1477,6 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
                 setVideoUrlsWithToken: videoStore.setVideoUrlsWithToken,
                 isCustomDomain: false,
                 brandPageSlug: brandPageContainerStore.brandPageSlug,
-                activeItemIdByContentId: useUiContentSettingsStore().activeItemIdByContentId,
             });
         },
         gettyVideoIds() {

package/lib/src/brand-page-maker/utils/apply-color-strategy.js

@@ -2,7 +2,7 @@ import { BRAND_PAGE_TYPES } from '@brand-page';
 import { FIELD_SLOT_MAP, raisedLayerFor, strategyRoleRefForField, } from '@shared/color-strategies/color-strategies';
 import { isTransparentDisabled, } from '@shared/content-settings/disable-transparent.util';
 import { setRteTextColor } from '@shared/color-strategies/rte-color';
-import { pairedRteTextField, RTE_ITEM_FIELD_PAIRS, } from '@shared/color-strategies/rte-field-pairs';
+import { pairedRteTextField } from '@shared/color-strategies/rte-field-pairs';
 /**
  * Field types a strategy can assign. `color` fields hold nothing but a colour and are
  * REPLACED via their `valueConvertor`; `text-style` fields hold typography *and* a
@@ -62,17 +62,6 @@ const sectionLayers = (assignable, content, context) => {
             surfaceFields.every(([, field]) => !isTransparentDisabled(field.disableTransparent, context?.brandPageType ?? BRAND_PAGE_TYPES.default)),
     };
 };
-/**
- * The strategy's text treatment for one text-style field: `color` set, text background
- * cleared (matching the highlight strip in `setRteTextColor` — the toolbar writes both).
- * The key is deleted rather than set undefined so `'backgroundColor' in style` checks
- * downstream stay honest.
- */
-const withStrategyTextStyle = (current, ref) => {
-    const nextStyle = { ...(current ?? {}), color: ref };
-    delete nextStyle.backgroundColor;
-    return nextStyle;
-};
 /**
  * Build the per-field colour writes a strategy stamps onto a section. Pure — reads the
  * section config + current content and returns a `{ fieldName: value }` partial. Each
@@ -108,7 +97,16 @@ export const buildColorStrategyValues = (config, content, strategyId, context, a
         }
         if (field.type === 'text-style') {
             const current = contentRecord[name];
-            values[name] = withStrategyTextStyle(current, ref);
+            const nextStyle = {
+                ...(current ?? {}),
+                color: ref,
+            };
+            // A strategy owns the text treatment, so it clears the text background colour
+            // too — matching the highlight strip in `setRteTextColor` (the toolbar writes
+            // both). Delete the key rather than set it undefined so `'backgroundColor' in
+            // style` checks downstream stay honest.
+            delete nextStyle.backgroundColor;
+            values[name] = nextStyle;
             // Also stamp the colour into the paired RTE document, if this field drives one.
             // `setRteTextColor` returns undefined for a plain string or legacy HTML RTE, so
             // that doubles as the "nothing to do" test — no separate type guard here.
@@ -135,33 +133,8 @@ export const buildColorStrategyValues = (config, content, strategyId, context, a
         }
         values[name] = field.valueConvertor.convertBack(ref);
     });
-    // Item-level RTE fields (each FAQ question) carry their own style and document, so
-    // the section's field loop above never sees them. Same two halves, per item, written
-    // back as one new list.
-    const itemPairs = typeof contentRecord.type === 'string'
-        ? (RTE_ITEM_FIELD_PAIRS[contentRecord.type] ?? [])
-        : [];
-    itemPairs.forEach((pair) => {
-        const ref = strategyRoleRefForField(strategyId, pair.styleField, content, context, layers, anchors);
-        const items = (values[pair.itemsField] ??
-            contentRecord[pair.itemsField]);
-        if (!ref || !Array.isArray(items)) {
-            return;
-        }
-        values[pair.itemsField] = items.map((item) => {
-            const nextDoc = setRteTextColor(item[pair.textField], ref);
-            return {
-                ...item,
-                [pair.styleField]: withStrategyTextStyle(item[pair.styleField], ref),
-                ...(nextDoc ? { [pair.textField]: nextDoc } : {}),
-            };
-        });
-    });
     return values;
 };
-const isRteDoc = (value) => typeof value === 'object' &&
-    value !== null &&
-    value.type === 'doc';
 /**
  * Apply a strategy to one content item. Shared by both settings surfaces — the focused
  * section panel and the inline list item (divider) — so the write semantics can't drift.
@@ -174,15 +147,12 @@ export const applyColorStrategyToItem = (store, { id, config, content, strategyI
     Object.entries(values).forEach(([name, value]) => {
         store.updateItemValue({ id, name, value });
     });
-    // A recoloured RTE field is emitted as a whole Tiptap document (at the top level,
-    // or inside a rewritten item list); the paired style-object writes are plain
-    // objects. Only the former needs the live editor to re-seed, so signal it just
-    // when a doc was among the writes.
-    const replacedRteDoc = Object.values(values).some((value) => isRteDoc(value) ||
-        (Array.isArray(value) &&
-            value.some((item) => typeof item === 'object' &&
-                item !== null &&
-                Object.values(item).some(isRteDoc))));
+    // A recoloured RTE field is emitted as a whole Tiptap document; the paired
+    // style-object writes are plain objects. Only the former needs the live editor
+    // to re-seed, so signal it just when a doc was among the writes.
+    const replacedRteDoc = Object.values(values).some((value) => typeof value === 'object' &&
+        value !== null &&
+        value.type === 'doc');
     if (replacedRteDoc) {
         markRteResync?.();
     }

package/lib/src/brand-page-maker/utils/rich-text-editor.util.d.ts

@@ -36,12 +36,6 @@ export declare const getPlainTextFromRTE: (content: unknown) => string;
  */
 export declare const getRteTextLength: (value: RichTextValue | null | undefined) => number;
 export declare const replaceTextInRTE: (existingHtml: string, newText: string) => string;
-/**
- * Convert a new list item's plain text to RTE, as adding its section would. Goes through
- * `transformRTEField` (element-first colour), so an item that copied a sibling's
- * strategy-coloured style bakes that colour rather than the linked global one.
- */
-export declare const switchRteItemFieldsToRTE: (sectionType: string, item: Record<string, unknown>, externalEditor: Editor, uiStyleSettingsStore?: StyleSettingsState) => void;
 export declare const transformToRTE: (uiPageSettingStore: PageSettingsState, externalEditor: Editor, uiStyleSettingsStore?: StyleSettingsState, newContent?: Content, type?: TextStyleType, newStyle?: TextStyleDeclaration) => void;
 export declare const switchAllContentToRTE: (uiPageSettingStore: PageSettingsState, externalEditor: Editor, uiStyleSettingsStore?: StyleSettingsState) => void;
 export declare const getUpdatedHTMLFromEditor: (externalEditor: Editor, contentText: RichTextValue, newContentStyle: TextStyleDeclaration) => string | import("@tiptap/core").DocumentType<Record<string, any> | undefined, import("@tiptap/core").NodeType<string, Record<string, any> | undefined, any, (import("@tiptap/core").NodeType<any, any, any, any> | import("@tiptap/core").TextType<import("@tiptap/core").MarkType<any, any>>)[]>[]>;

package/lib/src/brand-page-maker/utils/rich-text-editor.util.js

@@ -5,7 +5,7 @@ import { getRenderText } from '@brand-page/utils';
 import createDomPurify, {} from 'dompurify';
 import Color from 'color';
 import { isHrefPageId } from '../composables/rich-text-editor/hyperlink';
-import { RTE_ITEM_FIELD_PAIRS, RTE_SECTION_FIELD_PAIRS, } from '@shared/color-strategies/rte-field-pairs';
+import { RTE_SECTION_FIELD_PAIRS, } from '@shared/color-strategies/rte-field-pairs';
 // Re-exported below so every existing caller keeps importing them from here; they
 // live in a leaf module because this one pulls dompurify at runtime.
 import { isTiptapDocument, isRteHtmlString } from './rte-shape';
@@ -372,24 +372,6 @@ const switchRTEField = (content, pair, externalEditor, uiStyleSettingsStore) =>
         fields[pair.textField] = getUpdatedHTMLFromEditor(externalEditor, fields[pair.textField], style);
     }
 };
-// Items are visited as their own "content": each item carries the style that drives its
-// text, so the section-field helpers apply unchanged.
-const forEachRteItem = (sectionType, content, visit) => {
-    for (const pair of RTE_ITEM_FIELD_PAIRS[sectionType] ?? []) {
-        const items = content[pair.itemsField];
-        if (Array.isArray(items)) {
-            items.forEach((item) => visit(item, pair));
-        }
-    }
-};
-/**
- * Convert a new list item's plain text to RTE, as adding its section would. Goes through
- * `transformRTEField` (element-first colour), so an item that copied a sibling's
- * strategy-coloured style bakes that colour rather than the linked global one.
- */
-export const switchRteItemFieldsToRTE = (sectionType, item, externalEditor, uiStyleSettingsStore) => {
-    RTE_ITEM_FIELD_PAIRS[sectionType]?.forEach((pair) => transformRTEField(item, pair, externalEditor, uiStyleSettingsStore, item, undefined, undefined));
-};
 export const transformToRTE = (uiPageSettingStore, externalEditor, uiStyleSettingsStore, newContent, type, newStyle) => {
     for (const page of uiPageSettingStore.pages) {
         for (const contentItem of page.contents) {
@@ -400,10 +382,6 @@ export const transformToRTE = (uiPageSettingStore, externalEditor, uiStyleSettin
                     transformRTEField(content, pair, externalEditor, uiStyleSettingsStore, newContent, type, newStyle);
                 }
             }
-            const isNewContent = !!newContent && newContent.id === contentItem.id;
-            forEachRteItem(contentItem.type, contentItem.settings.content, (item, pair) => transformRTEField(item, pair, externalEditor, uiStyleSettingsStore, 
-            // An unlinked item of the section being added bakes its own style.
-            isNewContent ? item : undefined, type, newStyle));
             if (contentItem.type === 'text') {
                 const textContent = contentItem.settings.content;
                 if (textContent.textItems && textContent.textItems.length > 0) {
@@ -469,7 +447,6 @@ export const switchAllContentToRTE = (uiPageSettingStore, externalEditor, uiStyl
                     switchRTEField(content, pair, externalEditor, uiStyleSettingsStore);
                 }
             }
-            forEachRteItem(contentItem.type, contentItem.settings.content, (item, pair) => switchRTEField(item, pair, externalEditor, uiStyleSettingsStore));
             if (contentItem.type === 'text') {
                 const textContent = contentItem.settings.content;
                 if (textContent.textItems && textContent.textItems.length > 0) {

package/lib/src/brand-page-maker/validators/field.validator.js

@@ -139,7 +139,6 @@ export const validatorDict = {
     'color-replacements': dummyValidator,
     'testimonial-items': dummyValidator,
     'text-items': dummyValidator,
-    'list-items': dummyValidator,
     'page-dropdown': dummyValidator,
     shape: dummyValidator,
     'logo-selection': dummyValidator,
@@ -182,7 +181,6 @@ export const adminValidatorsDict = {
     'color-replacements': dummyValidator,
     'testimonial-items': dummyValidator,
     'text-items': dummyValidator,
-    'list-items': dummyValidator,
     'page-dropdown': dummyValidator,
     shape: dummyValidator,
     'logo-selection': dummyValidator,