@designcrowd/library.brand-page 6.2.11 → 6.2.12

package/lib/src/shared/content-settings/components/content-settings/ContentSettings.mixin.d.ts

@@ -6,12 +6,11 @@ interface CategoryTab {
     label: string;
 }
 declare const _default: import("vue").DefineComponent<{}, {
-    mode: import("vue").ComputedRef<"images" | "add" | "edit" | "focusedContentItem">;
+    mode: import("vue").ComputedRef<"images" | "edit" | "add" | "focusedContentItem">;
     activePageId: import("vue").ComputedRef<string>;
     activeCategoryTab: import("vue").ComputedRef<string>;
     contentSettingsSelectedItemId: import("vue").ComputedRef<string | null>;
     isAdminMaker: import("vue").ComputedRef<boolean>;
-    canUseRichTextEditor: import("vue").ComputedRef<boolean>;
     contentSettingsStore: import("pinia").Store<"uiContentSettings", import("../../store").ContentSettingsState, {
         contentErrorCount(): number;
         getContent(state: {
@@ -382,6 +381,12 @@ declare const _default: import("vue").DefineComponent<{}, {
             id: string;
             name: string;
         }): unknown;
+        renormalizeTextStylesForRole(type: string, previousRole?: Record<string, unknown>, active?: {
+            id: string;
+            name: string;
+            index?: number;
+            doc: unknown;
+        }): void;
         applyCardContrastToItem({ id }: {
             id: string;
         }): void;
@@ -527,6 +532,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             isHidden: boolean;
             pageId: string;
         }): void;
+        renormalizeTextStylesForRole(type: string, textStyleOptions: import("@brand-page").TextStyleOptions | undefined): void;
         setPageSettingsSectionValue({ sectionName, propName, index, value, merge, viewport, }: {
             sectionName: import("../../../page-settings/store").PageSettingsSection;
             propName: keyof import("../../../page-settings/store").PageSettingsStateSectionStyles;
@@ -583,65 +589,7 @@ declare const _default: import("vue").DefineComponent<{}, {
         setSelectedSettingsSection(payload: {
             sectionName?: string;
         }): void;
-    }>;
-    styleSettingsStore: import("pinia").Store<"uiStyleSettings", import("../../../style-settings/store").StyleSettingsState, {
-        availableTextFontFamilyOptions(): import("../../../style-settings/models").StyleTextFontFamilyOption[];
-        buttonBorderColor(): string | undefined;
-        buttonFillColor(): string | undefined;
-        buttonIconColor(): string | undefined;
-        buttonShadowColor(): string;
-        buttonSoftShadowColor(): string;
-        defaultTextColor(): string | undefined;
-        selectedButtonStyleConfig(): import("@brand-page-maker/models").ButtonStyleConfig | undefined;
-        selectedTextFontFamily(): import("@brand-page").FontFamilyKey;
-    }, {
-        initialise(options: {
-            reset: boolean;
-            brandPageType: import("@brand-page").BrandPageType;
-        }): void;
-        setState(payload: {
-            newState: Omit<import("../../../style-settings/store").StyleSettingsState, "availableButtonStyleConfigs" | "availableGalleryTypes">;
-        }): void;
-        _setButtonStyle(payload: BrandPageCssStyle): void;
-        _setButtonIconStyle(payload: BrandPageCssStyle): void;
-        _setButtonSelectedId(payload: string): void;
-        _setLogoImageStyle(payload: {
-            style: BrandPageCssStyle;
-            clearLogoContentImageStyle: boolean;
-        }): void;
-        _setGalleryStyles(payload: import("@brand-page").GalleryStyles): void;
-        _setSelectedButtonStyle(payload: {
-            id: string;
-        }): void;
-        _setTextFontFamily(payload: {
-            fontFamily: import("@brand-page").FontFamilyKey;
-        }): void;
-        _setTextStyles(payload: Partial<import("@brand-page").TextStyles>): void;
-        setAdminStyleOptionDefaultValues(): void;
-        setTextStyleOption(payload: {
-            type: import("@brand-page").TextStyleType;
-            style: import("@brand-page").TextStyleDeclaration;
-        }): void;
-        setStyleOptionValue(payload: {
-            option: import("@brand-page-maker/models").ButtonStyleConfigOption | import("@brand-page-maker/models").OtherStyleConfigOption;
-            value: string;
-        }): void;
-        setButtonStyles(payload: import("@brand-page").ButtonStyles): void;
-        setGalleryType(payload: import("../../../style-settings/models").SetGalleryTypePayload): void;
-        setGalleryStyles(payload: import("../../../style-settings/models").SetGalleryTypePayload): void;
-        setTextStyles(payload: import("@brand-page").TextStyles): void;
-        setLogoStyles(payload: import("@brand-page").LogoStyles): void;
-        setLogoImageStyle(payload: {
-            style: BrandPageCssStyle;
-        }, options: {
-            viewport: import("@brand-page").ViewportsType;
-        }): Promise<void>;
-        setSelectedButtonStyle(payload: {
-            id: string;
-        }): void;
-        setTextFontFamily(payload: {
-            fontFamily: import("@brand-page").FontFamilyKey;
-        }): Promise<void>;
+        openTextStyles(): void;
     }>;
     eventTracker: {
         sendShippingToggleEvent: (isEnabled: boolean) => void;
@@ -704,80 +652,6 @@ declare const _default: import("vue").DefineComponent<{}, {
         sendAiSendPromptEvent: (ctaLocation: string) => void;
         sendAiStopGenerationEvent: (ctaLocation: string) => void;
     };
-    historyStore: import("pinia").Store<"history", Pick<{
-        entries: import("vue").ShallowRef<import("@brand-page-maker/stores/history/history-store").HistoryEntry[], import("@brand-page-maker/stores/history/history-store").HistoryEntry[]>;
-        currentIndex: import("vue").Ref<number, number>;
-        isApplyingSnapshot: import("vue").Ref<boolean, boolean>;
-        snapshotAppliedToken: import("vue").Ref<number, number>;
-        rteResyncToken: import("vue").Ref<number, number>;
-        baselineCaptured: import("vue").Ref<boolean, boolean>;
-        canUndo: import("vue").ComputedRef<boolean>;
-        canRedo: import("vue").ComputedRef<boolean>;
-        captureBaseline: () => void;
-        capture: (args: {
-            source: import("@brand-page-maker/stores/history/history-store").HistoryEntry["source"];
-            actor: import("@brand-page-maker/stores/history/history-store").HistoryEntry["actor"];
-            label?: string;
-        }) => "committed" | "oversized" | "noop" | "skipped";
-        captureTemplateSwitch: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
-        captureAiChangeset: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
-        mergeNextMutation: () => void;
-        markRteResync: () => void;
-        undo: () => Promise<void>;
-        redo: () => Promise<void>;
-        reset: () => void;
-        getCurrentSizeBytes: () => number;
-        getCurrentEntryCount: () => number;
-    }, "entries" | "currentIndex" | "isApplyingSnapshot" | "snapshotAppliedToken" | "rteResyncToken" | "baselineCaptured">, Pick<{
-        entries: import("vue").ShallowRef<import("@brand-page-maker/stores/history/history-store").HistoryEntry[], import("@brand-page-maker/stores/history/history-store").HistoryEntry[]>;
-        currentIndex: import("vue").Ref<number, number>;
-        isApplyingSnapshot: import("vue").Ref<boolean, boolean>;
-        snapshotAppliedToken: import("vue").Ref<number, number>;
-        rteResyncToken: import("vue").Ref<number, number>;
-        baselineCaptured: import("vue").Ref<boolean, boolean>;
-        canUndo: import("vue").ComputedRef<boolean>;
-        canRedo: import("vue").ComputedRef<boolean>;
-        captureBaseline: () => void;
-        capture: (args: {
-            source: import("@brand-page-maker/stores/history/history-store").HistoryEntry["source"];
-            actor: import("@brand-page-maker/stores/history/history-store").HistoryEntry["actor"];
-            label?: string;
-        }) => "committed" | "oversized" | "noop" | "skipped";
-        captureTemplateSwitch: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
-        captureAiChangeset: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
-        mergeNextMutation: () => void;
-        markRteResync: () => void;
-        undo: () => Promise<void>;
-        redo: () => Promise<void>;
-        reset: () => void;
-        getCurrentSizeBytes: () => number;
-        getCurrentEntryCount: () => number;
-    }, "canUndo" | "canRedo">, Pick<{
-        entries: import("vue").ShallowRef<import("@brand-page-maker/stores/history/history-store").HistoryEntry[], import("@brand-page-maker/stores/history/history-store").HistoryEntry[]>;
-        currentIndex: import("vue").Ref<number, number>;
-        isApplyingSnapshot: import("vue").Ref<boolean, boolean>;
-        snapshotAppliedToken: import("vue").Ref<number, number>;
-        rteResyncToken: import("vue").Ref<number, number>;
-        baselineCaptured: import("vue").Ref<boolean, boolean>;
-        canUndo: import("vue").ComputedRef<boolean>;
-        canRedo: import("vue").ComputedRef<boolean>;
-        captureBaseline: () => void;
-        capture: (args: {
-            source: import("@brand-page-maker/stores/history/history-store").HistoryEntry["source"];
-            actor: import("@brand-page-maker/stores/history/history-store").HistoryEntry["actor"];
-            label?: string;
-        }) => "committed" | "oversized" | "noop" | "skipped";
-        captureTemplateSwitch: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
-        captureAiChangeset: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
-        mergeNextMutation: () => void;
-        markRteResync: () => void;
-        undo: () => Promise<void>;
-        redo: () => Promise<void>;
-        reset: () => void;
-        getCurrentSizeBytes: () => number;
-        getCurrentEntryCount: () => number;
-    }, "reset" | "captureBaseline" | "capture" | "captureTemplateSwitch" | "captureAiChangeset" | "mergeNextMutation" | "markRteResync" | "undo" | "redo" | "getCurrentSizeBytes" | "getCurrentEntryCount">>;
-    externalEditor: import("@tiptap/vue-3").Editor;
 }, {
     categoryTabs: CategoryTab[];
 }, {

package/lib/src/shared/content-settings/components/content-settings/ContentSettings.mixin.js

@@ -6,42 +6,30 @@ import { useUiSideBarStore } from '../../../side-bar/store';
 import { SIDE_BAR_TAB_NAMES } from '@brand-page-maker/constants';
 import { useUiContentSettingsStore } from '../../store';
 import { CONTENT_SETTINGS_MODES } from '../../store';
-import { useBrandPageMakerUserStore, useBrandPageContainerStore, } from '@brand-page-maker/stores';
+import { useBrandPageContainerStore } from '@brand-page-maker/stores';
 import { SIDE_BAR_CONTENT_ID } from '../../constants';
 import { SELECT_LOCATIONS, useEventTracker, } from '@brand-page-maker/composables/useEventTracker';
-import { useExternalRichTextEditor } from '@brand-page-maker/composables/rich-text-editor/useRichTextEditor';
-import { switchAllContentToRTE, transformToRTE, RTE_ALLOWED_SECTION_TYPES, } from '@brand-page-maker/utils';
-import { useUiStyleSettingsStore } from '../../../style-settings/store';
 import { usePageNavigationStore } from '../../../../shared/page-navigation/store/page-navigation-store';
-import { useHistoryStore } from '@brand-page-maker/stores/history/history-store';
 export default defineComponent({
     emits: ['capture-preview-snapshot'],
     setup() {
         const contentSettingsStore = useUiContentSettingsStore();
         const pageSettingsStore = useUiPageSettingsStore();
         const pageNavigationStore = usePageNavigationStore();
-        const styleSettingsStore = useUiStyleSettingsStore();
         const sideBarStore = useUiSideBarStore();
-        const userStore = useBrandPageMakerUserStore();
         const containerStore = useBrandPageContainerStore();
         const eventTracker = useEventTracker();
-        const historyStore = useHistoryStore();
-        const { externalEditor } = useExternalRichTextEditor();
         return {
             mode: computed(() => contentSettingsStore.mode),
             activePageId: computed(() => pageNavigationStore.activePageId),
             activeCategoryTab: computed(() => contentSettingsStore.activeCategoryTab),
             contentSettingsSelectedItemId: computed(() => contentSettingsStore.selectedItemId),
             isAdminMaker: computed(() => containerStore.isAdminMaker),
-            canUseRichTextEditor: computed(() => userStore.features.canUseRichTextEditor),
             contentSettingsStore,
             pageNavigationStore,
             pageSettingsStore,
             sideBarStore,
-            styleSettingsStore,
             eventTracker,
-            historyStore,
-            externalEditor,
         };
     },
     data() {
@@ -54,13 +42,6 @@ export default defineComponent({
             ],
         };
     },
-    mounted() {
-        if (this.canUseRichTextEditor) {
-            // RTE rewrap on tab mount — fold into current head.
-            this.historyStore.mergeNextMutation();
-            switchAllContentToRTE(this.pageSettingsStore, this.externalEditor, this.styleSettingsStore);
-        }
-    },
     computed: {
         showPageControls() {
             return true;
@@ -91,10 +72,6 @@ export default defineComponent({
             if (!newItem) {
                 return;
             }
-            if (RTE_ALLOWED_SECTION_TYPES.includes(option.type) &&
-                this.canUseRichTextEditor) {
-                transformToRTE(this.pageSettingsStore, this.externalEditor, this.styleSettingsStore, newItem.settings.content);
-            }
             // Send MixPanel add event
             this.eventTracker.sendAddContentEvent(option.type, SELECT_LOCATIONS.SIDEBAR, option.category);
             if (option.displayMode === 'focused') {
@@ -202,7 +179,4 @@ export default defineComponent({
             this.scrollToSelectedItem(itemId);
         },
     },
-    beforeUnmount() {
-        this.externalEditor.destroy();
-    },
 });

package/lib/src/shared/content-settings/components/content-settings/ReplaceImageSettingsForContent.mixin.d.ts

@@ -34,7 +34,7 @@ declare const _default: import("vue").DefineComponent<{}, {
     selectedItemIndex: import("vue").ComputedRef<number | null>;
     selectedItemValue: import("vue").ComputedRef<string | null>;
     contentType: import("vue").ComputedRef<"website" | "image" | "email" | "phone" | "logo" | "general-link" | "profile" | "video" | "text" | "facebook" | "x" | "instagram" | "youtube" | "linkedin" | "pinterest" | "twitch" | "tiktok" | "map" | "image-gallery" | "mailing-list" | "request-payment" | "support-me" | "contact-form" | "banner-section" | "about-section" | "divider-section" | "images-section" | "testimonial-section" | "social-links" | "shapes-section" | "shop-section" | "booking-section" | undefined>;
-    mode: import("vue").ComputedRef<"images" | "add" | "edit" | "focusedContentItem">;
+    mode: import("vue").ComputedRef<"images" | "edit" | "add" | "focusedContentItem">;
     isAdminMaker: import("vue").ComputedRef<boolean>;
     contentSettingsStore: import("pinia").Store<"uiContentSettings", import("../../store").ContentSettingsState, {
         contentErrorCount(): number;
@@ -406,6 +406,12 @@ declare const _default: import("vue").DefineComponent<{}, {
             id: string;
             name: string;
         }): unknown;
+        renormalizeTextStylesForRole(type: string, previousRole?: Record<string, unknown>, active?: {
+            id: string;
+            name: string;
+            index?: number;
+            doc: unknown;
+        }): void;
         applyCardContrastToItem({ id }: {
             id: string;
         }): void;
@@ -534,6 +540,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             isHidden: boolean;
             pageId: string;
         }): void;
+        renormalizeTextStylesForRole(type: string, textStyleOptions: import("@brand-page").TextStyleOptions | undefined): void;
         setPageSettingsSectionValue({ sectionName, propName, index, value, merge, viewport, }: {
             sectionName: import("../../../page-settings/store").PageSettingsSection;
             propName: keyof PageSettingsStateSectionStyles;
@@ -634,6 +641,9 @@ declare const _default: import("vue").DefineComponent<{}, {
         setHideBranding(payload: {
             hideBranding: boolean;
         }): void;
+        setSaveContactButtonTextStyle(payload: {
+            buttonTextStyle: import("@brand-page").SaveContactOptions["buttonTextStyle"];
+        }): void;
         setSensitiveContent(payload: {
             sensitiveContent: string;
         }): void;
@@ -696,7 +706,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             brandPageType: import("@brand-page").BrandPageType;
         }): void;
         initialiseStoresByBrandPageModelAsync(brandPageModel: import("@brand-page").BrandPageModel): Promise<void>;
-        initialise({ brandPage, brandPageType, logoDraftDesignAttributes, unsplashApplicationName, templateCategories, personalisationData, isPersonalisationEnabled, userPromptContentKey, showAiTemplatesTab, businessName, industry, layout, logoVariationImageUrls, shopConfigData: _shopConfigData, isServerRenderOverride, }: import("@brand-page-maker/stores").InitialisePayload): Promise<void>;
+        initialise({ brandPage, brandPageType, logoDraftDesignAttributes, unsplashApplicationName, templateCategories, personalisationData, isPersonalisationEnabled, userPromptContentKey, showAiTemplatesTab, businessName, industry, layout, logoVariationImageUrls, shopConfigData: _shopConfigData, isServerRenderOverride, isBlankSite, }: import("@brand-page-maker/stores").InitialisePayload): Promise<void>;
         initialisePages({ pages, sections, }: {
             pages: import("@brand-page").PageModel[];
             sections: import("../../../page-settings/store").PageSettingsStateSections;

package/lib/src/shared/content-settings/components/content-settings-item/ContentSettingsItem.mixin.d.ts

@@ -394,6 +394,12 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             id: string;
             name: string;
         }): unknown;
+        renormalizeTextStylesForRole(type: string, previousRole?: Record<string, unknown>, active?: {
+            id: string;
+            name: string;
+            index?: number;
+            doc: unknown;
+        }): void;
         applyCardContrastToItem({ id }: {
             id: string;
         }): void;
@@ -486,6 +492,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         setSelectedSettingsSection(payload: {
             sectionName?: string;
         }): void;
+        openTextStyles(): void;
     }>;
     eventTracker: {
         sendShippingToggleEvent: (isEnabled: boolean) => void;

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

@@ -434,6 +434,12 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             id: string;
             name: string;
         }): unknown;
+        renormalizeTextStylesForRole(type: string, previousRole?: Record<string, unknown>, active?: {
+            id: string;
+            name: string;
+            index?: number;
+            doc: unknown;
+        }): void;
         applyCardContrastToItem({ id }: {
             id: string;
         }): void;
@@ -570,6 +576,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         setHideBranding(payload: {
             hideBranding: boolean;
         }): void;
+        setSaveContactButtonTextStyle(payload: {
+            buttonTextStyle: import("@brand-page").SaveContactOptions["buttonTextStyle"];
+        }): void;
         setSensitiveContent(payload: {
             sensitiveContent: string;
         }): void;
@@ -632,7 +641,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             brandPageType: import("@brand-page").BrandPageType;
         }): void;
         initialiseStoresByBrandPageModelAsync(brandPageModel: import("@brand-page").BrandPageModel): Promise<void>;
-        initialise({ brandPage, brandPageType, logoDraftDesignAttributes, unsplashApplicationName, templateCategories, personalisationData, isPersonalisationEnabled, userPromptContentKey, showAiTemplatesTab, businessName, industry, layout, logoVariationImageUrls, shopConfigData: _shopConfigData, isServerRenderOverride, }: import("@brand-page-maker/stores").InitialisePayload): Promise<void>;
+        initialise({ brandPage, brandPageType, logoDraftDesignAttributes, unsplashApplicationName, templateCategories, personalisationData, isPersonalisationEnabled, userPromptContentKey, showAiTemplatesTab, businessName, industry, layout, logoVariationImageUrls, shopConfigData: _shopConfigData, isServerRenderOverride, isBlankSite, }: import("@brand-page-maker/stores").InitialisePayload): Promise<void>;
         initialisePages({ pages, sections, }: {
             pages: import("@brand-page").PageModel[];
             sections: import("../../../page-settings/store").PageSettingsStateSections;
@@ -721,6 +730,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         setSelectedSettingsSection(payload: {
             sectionName?: string;
         }): void;
+        openTextStyles(): void;
     }>;
     pageSettingsStore: import("pinia").Store<"uiPageSettings", import("../../../page-settings/store").PageSettingsState, {
         canAddPage(): boolean;
@@ -756,6 +766,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             isHidden: boolean;
             pageId: string;
         }): void;
+        renormalizeTextStylesForRole(type: string, textStyleOptions: import("@brand-page").TextStyleOptions | undefined): void;
         setPageSettingsSectionValue({ sectionName, propName, index, value, merge, viewport, }: {
             sectionName: import("../../../page-settings/store").PageSettingsSection;
             propName: keyof import("../../../page-settings/store").PageSettingsStateSectionStyles;
@@ -833,6 +844,15 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         isApplyingSnapshot: import("vue").Ref<boolean, boolean>;
         snapshotAppliedToken: import("vue").Ref<number, number>;
         rteResyncToken: import("vue").Ref<number, number>;
+        rteResyncExcept: import("vue").Ref<{
+            id: string;
+            name: string;
+            from: number;
+        } | undefined, {
+            id: string;
+            name: string;
+            from: number;
+        } | undefined>;
         baselineCaptured: import("vue").Ref<boolean, boolean>;
         canUndo: import("vue").ComputedRef<boolean>;
         canRedo: import("vue").ComputedRef<boolean>;
@@ -845,18 +865,36 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         captureTemplateSwitch: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
         captureAiChangeset: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
         mergeNextMutation: () => void;
-        markRteResync: () => void;
+        markRteResync: (options?: {
+            except?: {
+                id: string;
+                name: string;
+            };
+        }) => void;
+        isRteResyncExcepted: (field: {
+            id: string;
+            name: string;
+        }, sinceToken: number) => boolean;
         undo: () => Promise<void>;
         redo: () => Promise<void>;
         reset: () => void;
         getCurrentSizeBytes: () => number;
         getCurrentEntryCount: () => number;
-    }, "entries" | "currentIndex" | "isApplyingSnapshot" | "snapshotAppliedToken" | "rteResyncToken" | "baselineCaptured">, Pick<{
+    }, "entries" | "currentIndex" | "isApplyingSnapshot" | "snapshotAppliedToken" | "rteResyncToken" | "rteResyncExcept" | "baselineCaptured">, Pick<{
         entries: import("vue").ShallowRef<import("@brand-page-maker/stores/history/history-store").HistoryEntry[], import("@brand-page-maker/stores/history/history-store").HistoryEntry[]>;
         currentIndex: import("vue").Ref<number, number>;
         isApplyingSnapshot: import("vue").Ref<boolean, boolean>;
         snapshotAppliedToken: import("vue").Ref<number, number>;
         rteResyncToken: import("vue").Ref<number, number>;
+        rteResyncExcept: import("vue").Ref<{
+            id: string;
+            name: string;
+            from: number;
+        } | undefined, {
+            id: string;
+            name: string;
+            from: number;
+        } | undefined>;
         baselineCaptured: import("vue").Ref<boolean, boolean>;
         canUndo: import("vue").ComputedRef<boolean>;
         canRedo: import("vue").ComputedRef<boolean>;
@@ -869,7 +907,16 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         captureTemplateSwitch: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
         captureAiChangeset: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
         mergeNextMutation: () => void;
-        markRteResync: () => void;
+        markRteResync: (options?: {
+            except?: {
+                id: string;
+                name: string;
+            };
+        }) => void;
+        isRteResyncExcepted: (field: {
+            id: string;
+            name: string;
+        }, sinceToken: number) => boolean;
         undo: () => Promise<void>;
         redo: () => Promise<void>;
         reset: () => void;
@@ -881,6 +928,15 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         isApplyingSnapshot: import("vue").Ref<boolean, boolean>;
         snapshotAppliedToken: import("vue").Ref<number, number>;
         rteResyncToken: import("vue").Ref<number, number>;
+        rteResyncExcept: import("vue").Ref<{
+            id: string;
+            name: string;
+            from: number;
+        } | undefined, {
+            id: string;
+            name: string;
+            from: number;
+        } | undefined>;
         baselineCaptured: import("vue").Ref<boolean, boolean>;
         canUndo: import("vue").ComputedRef<boolean>;
         canRedo: import("vue").ComputedRef<boolean>;
@@ -893,13 +949,22 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         captureTemplateSwitch: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
         captureAiChangeset: (label?: string) => "committed" | "oversized" | "noop" | "skipped";
         mergeNextMutation: () => void;
-        markRteResync: () => void;
+        markRteResync: (options?: {
+            except?: {
+                id: string;
+                name: string;
+            };
+        }) => void;
+        isRteResyncExcepted: (field: {
+            id: string;
+            name: string;
+        }, sinceToken: number) => boolean;
         undo: () => Promise<void>;
         redo: () => Promise<void>;
         reset: () => void;
         getCurrentSizeBytes: () => number;
         getCurrentEntryCount: () => number;
-    }, "reset" | "captureBaseline" | "capture" | "captureTemplateSwitch" | "captureAiChangeset" | "mergeNextMutation" | "markRteResync" | "undo" | "redo" | "getCurrentSizeBytes" | "getCurrentEntryCount">>;
+    }, "reset" | "undo" | "redo" | "captureBaseline" | "capture" | "captureTemplateSwitch" | "captureAiChangeset" | "mergeNextMutation" | "markRteResync" | "isRteResyncExcepted" | "getCurrentSizeBytes" | "getCurrentEntryCount">>;
 }, {
     isToggled: boolean;
     richTextEditorKey: number;
@@ -916,6 +981,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
      * aren't container-bound text. Fed to the Text Style panel so its swatch matches
      * what the renderer paints — both derive it from the SAME helper (see
      * `container-text-color.util.ts`), so the sidebar and canvas cannot drift.
+     *
+     * A standalone button's label carries no element colour (it inherits the button's
+     * on-fill colour at render); `buttonLabelColorDefault` supplies that same colour so
+     * the swatch shows it instead of reading blank.
      */
     containerDefaultColor(): string | undefined;
     isInline(): boolean;

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

@@ -1,6 +1,6 @@
 import { defineComponent, computed } from 'vue';
 import { VIEWPORTS } from '@brand-page';
-import { containerTextColorDefaults } from '@brand-page/utils/container-text-color.util';
+import { containerTextColorDefaults, buttonLabelColorDefault, } from '@brand-page/utils/container-text-color.util';
 import { UI_EVENT_SOURCES } from '../../../models';
 import { useUiContentSettingsStore } from '../../store';
 import { useUiSideBarStore } from '../../../side-bar/store';
@@ -111,10 +111,15 @@ export default defineComponent({
          * aren't container-bound text. Fed to the Text Style panel so its swatch matches
          * what the renderer paints — both derive it from the SAME helper (see
          * `container-text-color.util.ts`), so the sidebar and canvas cannot drift.
+         *
+         * A standalone button's label carries no element colour (it inherits the button's
+         * on-fill colour at render); `buttonLabelColorDefault` supplies that same colour so
+         * the swatch shows it instead of reading blank.
          */
         containerDefaultColor() {
             const defaults = containerTextColorDefaults(this.content, this.brandPageData.styles, this.brandPageType);
-            return defaults[this.fieldName];
+            return (defaults[this.fieldName] ??
+                buttonLabelColorDefault(this.content, this.brandPageData.styles, this.fieldName));
         },
         isInline() {
             return this.field.isInline || false;
@@ -210,8 +215,9 @@ export default defineComponent({
         // the store's new one, so remount it (same lever as onUseGeneratedText) to
         // re-seed from the just-written value. Keyed off the history store's resync
         // signal, bumped by the applier only when it writes an RTE document.
-        'historyStore.rteResyncToken'() {
-            if (this.showRichTextEditor) {
+        'historyStore.rteResyncToken'(_token, previous) {
+            const isExcepted = this.historyStore.isRteResyncExcepted({ id: this.id, name: this.fieldName }, previous);
+            if (this.showRichTextEditor && !isExcepted) {
                 this.richTextEditorKey = this.richTextEditorKey + 1;
             }
         },
@@ -238,9 +244,14 @@ export default defineComponent({
             else {
                 this.contentSettingsStore.updateItemValue(payload);
             }
-            // Switching a card title's text style clears its colour; re-bake the card's
-            // higher-contrast brand colour so it stays readable. No-op for non-card content.
-            if (this.field.type === ITEM_FIELD_TYPES['text-style'] && payload.id) {
+            // Re-bake the section's contrast colour after a change that can leave text uncoloured:
+            // switching a text style clears its colour, and ADDING a new `textItems` entry creates one
+            // with no colour (TextItemsField.addOption). `applyTextContrast` colours only the uncoloured
+            // fields/items, so this is a no-op for the rest. Without it a new brand-site text item falls
+            // back to the base default instead of the page-contrast colour.
+            if ((this.field.type === ITEM_FIELD_TYPES['text-style'] ||
+                this.field.type === ITEM_FIELD_TYPES['text-items']) &&
+                payload.id) {
                 this.contentSettingsStore.applyCardContrastToItem({ id: payload.id });
             }
             if (payload.multipleValues &&

package/lib/src/shared/content-settings/components/focused-content-item-settings/FocusedContentItemSettings.mixin.d.ts

@@ -16,7 +16,6 @@ declare const _default: import("vue").DefineComponent<{}, {
     isPersonalisationEnabled: import("vue").ComputedRef<boolean>;
     isAdminMaker: import("vue").ComputedRef<boolean>;
     canUseRichTextEditor: import("vue").ComputedRef<boolean>;
-    externalEditor: import("@tiptap/vue-3").Editor;
     contentSettingsStore: import("pinia").Store<"uiContentSettings", import("../../store").ContentSettingsState, {
         contentErrorCount(): number;
         getContent(state: {
@@ -387,6 +386,12 @@ declare const _default: import("vue").DefineComponent<{}, {
             id: string;
             name: string;
         }): unknown;
+        renormalizeTextStylesForRole(type: string, previousRole?: Record<string, unknown>, active?: {
+            id: string;
+            name: string;
+            index?: number;
+            doc: unknown;
+        }): void;
         applyCardContrastToItem({ id }: {
             id: string;
         }): void;

package/lib/src/shared/content-settings/components/focused-content-item-settings/FocusedContentItemSettings.mixin.js

@@ -12,7 +12,6 @@ import { sectionSupportsColorStrategy, applyColorStrategyToItem, } from '@brand-
 import { pageStrategyAnchors } from '@shared/color-strategies/page-anchors';
 import { useHistoryStore } from '@brand-page-maker/stores/history/history-store';
 import { useUiPageSettingsStore } from '@shared/page-settings/store';
-import { useExternalRichTextEditor } from '@brand-page-maker/composables/rich-text-editor/useRichTextEditor';
 import { useUiStyleSettingsStore } from '@shared/style-settings/store';
 export default defineComponent({
     emits: ['capture-preview-snapshot'],
@@ -25,7 +24,6 @@ export default defineComponent({
         const containerStore = useBrandPageContainerStore();
         const uiStore = useUiStore();
         const routeStore = useRouteStore();
-        const { externalEditor } = useExternalRichTextEditor();
         return {
             currentRoute: computed(() => routeStore.currentRoute),
             selectedItemId: computed(() => contentSettingsStore.selectedItemId),
@@ -37,7 +35,6 @@ export default defineComponent({
             isPersonalisationEnabled: computed(() => uiStore.isPersonalisationEnabled),
             isAdminMaker: computed(() => containerStore.isAdminMaker),
             canUseRichTextEditor: computed(() => userStore.features.canUseRichTextEditor),
-            externalEditor,
             contentSettingsStore,
         };
     },
@@ -257,8 +254,4 @@ export default defineComponent({
             });
         },
     },
-    beforeUnmount() {
-        if (this.externalEditor)
-            this.externalEditor.destroy();
-    },
 });

package/lib/src/shared/content-settings/components/payment-config-field/PaymentConfigField.mixin.d.ts

@@ -538,6 +538,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             isHidden: boolean;
             pageId: string;
         }): void;
+        renormalizeTextStylesForRole(type: string, textStyleOptions: import("@brand-page").TextStyleOptions | undefined): void;
         setPageSettingsSectionValue({ sectionName, propName, index, value, merge, viewport, }: {
             sectionName: import("@shared/page-settings/store").PageSettingsSection;
             propName: keyof import("@shared/page-settings/store").PageSettingsStateSectionStyles;

package/lib/src/shared/content-settings/components/text-items-field/TextItemsField.mixin.js

@@ -1,5 +1,5 @@
 import { defineComponent, computed } from 'vue';
-import { FONT_SIZE_BODY, MAX_LENGTH_ERROR_MESSAGE, MAX_TEXT_LENGTH, TEXT_EMPTY, TEXT_STYLE_TYPES, } from '@brand-page';
+import { CANONICAL_TEXT_STYLE_TYPES, MAX_LENGTH_ERROR_MESSAGE, MAX_TEXT_LENGTH, TEXT_EMPTY, TEXT_STYLE_TYPES, } from '@brand-page';
 import debounce from 'lodash.debounce';
 import cloneDeep from 'lodash.clonedeep';
 import { decodeHtmlEntities, escapeContentText } from '@brand-page/utils';
@@ -94,12 +94,16 @@ export default defineComponent({
         },
         addOption() {
             this.burstIsHydration = false;
+            const previousTextStyle = this.options.at(-1)?.textStyle;
+            const previousTextStyleType = previousTextStyle?.textStyleType;
+            const textStyleType = CANONICAL_TEXT_STYLE_TYPES.includes(previousTextStyleType)
+                ? previousTextStyleType
+                : TEXT_STYLE_TYPES.paragraph1;
             this.options.push({
                 text: '',
                 textStyle: {
-                    fontSize: FONT_SIZE_BODY,
-                    textAlign: 'left',
-                    textStyleType: TEXT_STYLE_TYPES.paragraphs,
+                    textStyleType,
+                    textAlign: previousTextStyle?.textAlign ?? 'left',
                     applyAutoScale: true,
                 },
             });