@designcrowd/library.brand-page 5.19.1-error-html2canvas-1 → 5.19.1-error-html2canvas-3

package/lib/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.mixin.d.ts

@@ -36,7 +36,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     toggleExpanded(pageId: string): void;
     isExpanded(pageId: string): boolean;
     expandSubPageIfCurrentPage(): void;
-}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "close-side-menu"[], "close-side-menu", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     context: {
         type: PropType<BrandPageContext>;
         required: true;
@@ -53,5 +53,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: PropType<NavigationDesktop | NavigationMobile>;
         required: true;
     };
-}>> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}>> & Readonly<{
+    "onClose-side-menu"?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/src/brand-page/components/navigation/navigation-side-menu/NavigationSideMenu.mixin.js

@@ -18,6 +18,7 @@ export default defineComponent({
             required: true,
         },
     },
+    emits: ['close-side-menu'],
     data() {
         return {
             expandedItems: {}, // Keep track of which navs are expanded
@@ -41,15 +42,15 @@ export default defineComponent({
         },
         // Prevents us from doubling down on em sizing of font
         defaultWrapperStyle() {
-            const { fontSize, lineHeight, letterSpacing, ...rest } = this.defaultButtonStyle;
+            const { fontSize: _fontSize, lineHeight: _lineHeight, letterSpacing: _letterSpacing, ...rest } = this.defaultButtonStyle;
             return rest;
         },
         selectedWrapperStyle() {
-            const { fontSize, lineHeight, letterSpacing, ...rest } = this.selectedButtonStyle;
+            const { fontSize: _fontSize, lineHeight: _lineHeight, letterSpacing: _letterSpacing, ...rest } = this.selectedButtonStyle;
             return rest;
         },
         routes() {
-            return this.visibleNavItems.map((navItem, i) => {
+            return this.visibleNavItems.map((navItem, _i) => {
                 return {
                     routeName: navItem.routeName,
                     routeParams: navItem.routeParams,
@@ -79,7 +80,7 @@ export default defineComponent({
                 paddingLeft: '32px',
                 backgroundColor: isActive
                     ? baseStyle.backgroundColor
-                    : this.styles.hamburgerMenuStyle.subNavBackgroundColor ?? '#ffffff',
+                    : (this.styles.hamburgerMenuStyle.subNavBackgroundColor ?? '#ffffff'),
             };
         },
         closeSideMenu() {

package/lib/src/brand-page/components/page/Page.mixin.d.ts

@@ -145,8 +145,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
 }>, {
     viewport: ViewportsType;
     isMobileDevice: boolean;
-    containerClientHeight: number | undefined;
     containerClientWidth: number | undefined;
+    containerClientHeight: number | undefined;
     isContentSelected: boolean;
     isHeaderSelected: boolean;
     isFooterSelected: boolean;

package/lib/src/brand-page/components/page/PageComponent.mixin.d.ts

@@ -78,7 +78,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
 }>> & Readonly<{}>, {
     brandPageToken: string;
     isMobileDevice: boolean;
-    containerClientHeight: number;
     containerClientWidth: number;
+    containerClientHeight: number;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/src/brand-page/components/payment/Payment.mixin.d.ts

@@ -23,7 +23,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         required: true;
     };
     viewModel: {
-        type: PropType<SupportMeViewModel | RequestPaymentViewModel>;
+        type: PropType<RequestPaymentViewModel | SupportMeViewModel>;
         required: true;
     };
     paymentConfig: {
@@ -42,7 +42,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         readonly CheckoutStripe: "checkout-stripe";
         readonly Success: "success";
     };
-    cart: CreateCartResult<unknown> | null | undefined;
+    cart: CreateCartResult<unknown> | undefined | null;
     isCollapsed: boolean;
     isPaymentConfigActive: boolean;
     state: State;
@@ -78,7 +78,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         required: true;
     };
     viewModel: {
-        type: PropType<SupportMeViewModel | RequestPaymentViewModel>;
+        type: PropType<RequestPaymentViewModel | SupportMeViewModel>;
         required: true;
     };
     paymentConfig: {

package/lib/src/brand-page/components/payment/__fixtures__/request-payment.d.ts

@@ -3,33 +3,33 @@ export declare const context: {
     stripePublishableKey: string;
     isTemplate: boolean;
     isPreview: boolean;
-    isMobile?: boolean | undefined;
+    isMobile?: boolean;
     isDesignCom: boolean;
     isProduction: boolean;
     isServerRender: boolean;
     brandPageSlug: string;
-    brandPageToken?: string | undefined;
-    pages?: import("../../../view-models").PageViewModel[] | undefined;
+    brandPageToken?: string;
+    pages?: import("../../../view-models").PageViewModel[];
     nav: import("../../../view-models").NavViewModel;
-    currentPageRelativePath?: string | undefined;
+    currentPageRelativePath?: string;
     runtimeEnvironment: string;
     recaptchaSiteKey: string | undefined;
     pageTitle: string;
     customDomain: string | undefined;
-    brandPageType: "default" | "brandSite" | "brandContact";
+    brandPageType: import("../../../models").BrandPageType;
     isBrandPage: boolean;
     isBrandPageOrIsBrandContact: boolean;
     isBrandSite: boolean;
     isBrandContact: boolean;
     options?: {
-        disableNavigationSideMenu?: boolean | undefined;
-        mediaSizes?: "size1x" | "size2x" | "sizeThumb" | undefined;
-        renderVideoAsImage?: boolean | undefined;
-        shouldPlayVideos?: boolean | undefined;
-        enableSaveContact?: boolean | undefined;
-    } | undefined;
-    abTests?: import("../../../models").AbTest | undefined;
+        disableNavigationSideMenu?: boolean;
+        mediaSizes?: import("../../../models").MediaSizes;
+        renderVideoAsImage?: boolean;
+        shouldPlayVideos?: boolean;
+        enableSaveContact?: boolean;
+    };
+    abTests?: import("../../../models").AbTest;
     isCapturingPreview: boolean;
-    disableLogoRenderOnServerside?: boolean | undefined;
+    disableLogoRenderOnServerside?: boolean;
 };
 export declare const viewModel: RequestPaymentViewModel;

package/lib/src/brand-page/components/payment/__fixtures__/support-me.d.ts

@@ -3,33 +3,33 @@ export declare const context: {
     stripePublishableKey: string;
     isTemplate: boolean;
     isPreview: boolean;
-    isMobile?: boolean | undefined;
+    isMobile?: boolean;
     isDesignCom: boolean;
     isProduction: boolean;
     isServerRender: boolean;
     brandPageSlug: string;
-    brandPageToken?: string | undefined;
-    pages?: import("../../../view-models").PageViewModel[] | undefined;
+    brandPageToken?: string;
+    pages?: import("../../../view-models").PageViewModel[];
     nav: import("../../../view-models").NavViewModel;
-    currentPageRelativePath?: string | undefined;
+    currentPageRelativePath?: string;
     runtimeEnvironment: string;
     recaptchaSiteKey: string | undefined;
     pageTitle: string;
     customDomain: string | undefined;
-    brandPageType: "default" | "brandSite" | "brandContact";
+    brandPageType: import("../../../models").BrandPageType;
     isBrandPage: boolean;
     isBrandPageOrIsBrandContact: boolean;
     isBrandSite: boolean;
     isBrandContact: boolean;
     options?: {
-        disableNavigationSideMenu?: boolean | undefined;
-        mediaSizes?: "size1x" | "size2x" | "sizeThumb" | undefined;
-        renderVideoAsImage?: boolean | undefined;
-        shouldPlayVideos?: boolean | undefined;
-        enableSaveContact?: boolean | undefined;
-    } | undefined;
-    abTests?: import("../../../models").AbTest | undefined;
+        disableNavigationSideMenu?: boolean;
+        mediaSizes?: import("../../../models").MediaSizes;
+        renderVideoAsImage?: boolean;
+        shouldPlayVideos?: boolean;
+        enableSaveContact?: boolean;
+    };
+    abTests?: import("../../../models").AbTest;
     isCapturingPreview: boolean;
-    disableLogoRenderOnServerside?: boolean | undefined;
+    disableLogoRenderOnServerside?: boolean;
 };
 export declare const viewModel: SupportMeViewModel;

package/lib/src/brand-page/constants/sections/footer-display.constants.js

@@ -1,5 +1,5 @@
 import { ALIGN_CENTERED, ALIGN_JUSTIFIED } from '../misc.constants';
-import { tr, commonTr } from '@src/composables/useTranslate';
+import { commonTr } from '@src/composables/useTranslate';
 export const FOOTER_DISPLAY = {
     /** @deprecated */
     ALIGN_CENTERED, // mapped to CENTERED

package/lib/src/brand-page/models/index.d.ts

@@ -42,7 +42,7 @@ export declare const GALLERY_TYPES: {
     readonly masonry: "masonry";
 };
 export type GalleryType = keyof typeof GALLERY_TYPES;
-export declare const availableGalleryTypes: ("grid" | "carousel" | "masonry")[];
+export declare const availableGalleryTypes: GalleryType[];
 export declare class GalleryStyles {
     galleryType: GalleryType;
     constructor(option?: Partial<GalleryStyles>);
@@ -547,6 +547,7 @@ export interface SaveContactOptions {
 }
 export declare class BrandPageModel {
     v: number;
+    userPromptContentKey?: string;
     styles: PageStyles;
     /** @deprecated */
     headerStyles?: AbstractPageHeaderStyles;

package/lib/src/brand-page/models/index.js

@@ -400,6 +400,9 @@ export class PageFooterMobile extends AbstractPageFooterStyles {
 export class BrandPageModel {
     // Model version
     v;
+    // AI personalisation key persisted with the draft so previews survive login/checkout-back/
+    // refresh - content is retrieved by this token (user-agnostic), not regenerated (bp-5742).
+    userPromptContentKey;
     styles;
     /** @deprecated */
     headerStyles;

package/lib/src/brand-page/models/payment.model.d.ts

@@ -50,7 +50,7 @@ export interface StripePaymentIntent {
     currency: string;
 }
 export declare const isStripePaymentIntent: (value: any) => value is StripePaymentIntent;
-export interface CreateCartResult<T> {
+export interface CreateCartResult<T = unknown> {
     cartId: string;
     paymentProviderName: string;
     paymentProviderExternalId: string;

package/lib/src/brand-page/utils/personalisation.util.js

@@ -206,15 +206,59 @@ const getPersonalisationValueAsync = async (section, property) => {
     }
     return { value: propertyValue, section };
 };
+// The userPrompt AI content generation only populates these content-bearing sections
+// (see GenerateAiDesignMakerContentService / GenerateWebsiteContentService - About,
+// Information, Profile, Media). Sections like email/website/phone are never generated, so
+// blocks whose role points at an ungenerated section fall back to this pool.
+const PERSONALISATION_FALLBACK_ROLES = [
+    'profile',
+    'about',
+    'information',
+    'media',
+];
+// "Effectively empty" = no renderable content (ungenerated userPrompt sections like
+// email/website/phone). A section that has data but lacks one property is NOT empty - it
+// intentionally keeps its original content.
+const isSectionEffectivelyEmpty = (section) => {
+    if (!section) {
+        return true;
+    }
+    return (!section.title &&
+        !section.name &&
+        !section.url &&
+        !section.description &&
+        !section.descriptionShort &&
+        !section.ctaTitle &&
+        !section.imageUrls?.length &&
+        !section.shapes?.length &&
+        !section.items?.length &&
+        !section.mainShapesCollection?.tall?.length &&
+        !section.mainShapesCollection?.square?.length &&
+        !section.mainShapesCollection?.wide?.length);
+};
+// Resolve a property from a specific role's section. Returns null when that section is
+// ungenerated (effectively empty) or cannot supply the property, so the caller can try the
+// next role.
+const resolvePersonalisationValueForRoleAsync = async (role, property, personalisation) => {
+    const key = `${role}Section`;
+    const section = personalisation[key];
+    if (isSectionEffectivelyEmpty(section)) {
+        return null;
+    }
+    const { value, section: updatedSection, valuesToUpdate, } = await getPersonalisationValueAsync(section, property);
+    if (value === undefined || value === null) {
+        return null;
+    }
+    return {
+        value,
+        personalisation: { ...personalisation, [key]: updatedSection },
+        valuesToUpdate,
+    };
+};
 const getPersonalisationValueFromPropertyAsync = async (propertyKey, propertyValue, personalisationRole, personalisationOverride, personalisation, contentType) => {
     if (!personalisationRole || personalisationOverride === 'none') {
         return { value: undefined, personalisation };
     }
-    const matchingValue = Object.entries(personalisation).find(([key]) => key === `${personalisationRole}Section`);
-    if (!matchingValue) {
-        return { value: undefined, personalisation };
-    }
-    const section = matchingValue[1];
     const mapping = getPersonalisationMappingForContentType(contentType);
     const matchingProperty = Object.entries(mapping).find(([, value]) => value.includes(propertyKey));
     if (!matchingProperty) {
@@ -225,15 +269,29 @@ const getPersonalisationValueFromPropertyAsync = async (propertyKey, propertyVal
         brandPageType: personalisation.type,
         isSvgShape: typeof propertyValue === 'string' && propertyValue.endsWith('.svg'),
     });
-    const { value, section: updatedSection, valuesToUpdate, } = await getPersonalisationValueAsync(section, property);
-    return {
-        value,
-        personalisation: {
-            ...personalisation,
-            [`${personalisationRole}Section`]: updatedSection,
-        },
-        valuesToUpdate,
-    };
+    const primaryKey = `${personalisationRole}Section`;
+    const primarySection = personalisation[primaryKey];
+    // When the block's own section has content, use it as-is - this preserves existing
+    // behaviour, including legitimately keeping the original when that section lacks a
+    // specific property (e.g. no items, or an invalid shape).
+    if (!isSectionEffectivelyEmpty(primarySection)) {
+        const { value, section: updatedSection, valuesToUpdate, } = await getPersonalisationValueAsync(primarySection, property);
+        return {
+            value,
+            personalisation: { ...personalisation, [primaryKey]: updatedSection },
+            valuesToUpdate,
+        };
+    }
+    // The block's section was never generated - fall back to the first populated section that
+    // can supply this property, so it doesn't render the "should be AI generated" placeholder.
+    // Never reached when the section exists (above) or all are populated (AI Website Builder).
+    for (const role of PERSONALISATION_FALLBACK_ROLES) {
+        const resolved = await resolvePersonalisationValueForRoleAsync(role, property, personalisation);
+        if (resolved) {
+            return resolved;
+        }
+    }
+    return { value: undefined, personalisation };
 };
 const applyPersonalisationToBrandPageContentsRecursiveAsync = async (personalisation, mappingType, content, personalisationRole) => {
     let isApplied = false;

package/lib/src/brand-page-maker/components/action-bar/ActionBar.mixin.d.ts

@@ -6,12 +6,12 @@ declare const _default: import("vue").DefineComponent<{}, {
     isBrandContact: import("vue").ComputedRef<boolean>;
     userStore: import("pinia").Store<"brandPageMakerUser", import("@brand-page-maker/stores").UserState, {}, {
         setUserState(payload: {
-            emailAddress?: string | undefined;
-            userToken?: string | undefined;
-            isAdmin?: boolean | undefined;
-            hasPremiumSubscription?: boolean | undefined;
-            brandPageCommissionPercentage?: number | undefined;
-            features?: Partial<import("../../../constants/ui").UIUserFeatures> | undefined;
+            emailAddress?: string;
+            userToken?: string;
+            isAdmin?: boolean;
+            hasPremiumSubscription?: boolean;
+            brandPageCommissionPercentage?: number;
+            features?: Partial<import("@brand-page-maker/stores").UserFeatures>;
         }): void;
     }>;
     brandPageMakerStore: import("pinia").Store<"brandPageMaker", import("@brand-page-maker/stores").BrandPageMakerState, {
@@ -22,7 +22,7 @@ declare const _default: import("vue").DefineComponent<{}, {
         brandPageToken(): string | undefined;
         brandPageDescription(): string;
         brandPageSlug(): string;
-        brandPageTemplate(): any;
+        brandPageTemplate(): import("@brand-page/models").BrandPageData;
         brandPageTitle(): string;
         brandPageViewModel(): import("../../../brand-page").BrandPageViewModel;
         gettyVideoIds(): string[];
@@ -37,7 +37,7 @@ declare const _default: import("vue").DefineComponent<{}, {
         showBrandCrowdLogo(): boolean;
     }, {
         setMode(payload: {
-            mode: "images" | "edit";
+            mode: import("@brand-page-maker/stores").BrandPageSettingsMode;
         }): void;
         setFaviconUrl(payload: {
             faviconUrl: string | undefined;
@@ -81,7 +81,7 @@ declare const _default: import("vue").DefineComponent<{}, {
         enqueueContentErrorMessage(): void;
         dequeueNotificationMessageQueue(): void;
         setCurrentNotificationMessage(payload: {
-            message: false | import("@brand-page-maker/stores").NotificationMessage;
+            message: import("@brand-page-maker/stores").NotificationMessage | false;
         }): void;
         setIsApplyingTemplate(payload: import("@brand-page-maker/stores").IsApplyingTemplatePayload): void;
         setIsPageNavigating(isPageNavigating: boolean): void;
@@ -100,9 +100,9 @@ declare const _default: import("vue").DefineComponent<{}, {
         applySelectedTemplate(): Promise<void>;
         enqueueErrorMessage(): Promise<void>;
         enqueueSaveSuccessMessage(payload?: {
-            description?: string | undefined;
-            isPublished?: boolean | undefined;
-            noDescription?: boolean | undefined;
+            description?: string;
+            isPublished?: boolean;
+            noDescription?: boolean;
         }): Promise<void>;
         hideChangeTemplateConfirmModal(): void;
         onBackgroundChanged(): void;
@@ -118,16 +118,16 @@ declare const _default: import("vue").DefineComponent<{}, {
             content: TContent;
         }>(payload: P): Promise<void>;
         _captureTemplateSwitchIfEnabled(): void;
-        applyHistorySnapshot(snapshot: import("@brand-page/models").BrandPageModel, activePageId?: string | undefined, logoEditsStr?: string | undefined): Promise<void>;
-        _syncLogoSettingsFromSnapshot(snapshot: import("@brand-page/models").BrandPageModel, logoEditsStr?: string | undefined): Promise<void>;
-        _navigateToActivePage(activePageId?: string | undefined): void;
+        applyHistorySnapshot(snapshot: import("@brand-page/models").BrandPageModel, activePageId?: string, logoEditsStr?: string): Promise<void>;
+        _syncLogoSettingsFromSnapshot(snapshot: import("@brand-page/models").BrandPageModel, logoEditsStr?: string): Promise<void>;
+        _navigateToActivePage(activePageId?: string): void;
         _fallbackSidebarIfSelectedContentMissing(snapshot: import("@brand-page/models").BrandPageModel): void;
         export(): import("@brand-page/models").BrandPageModel;
         setBrandPageType({ brandPageType }: {
-            brandPageType: "default" | "brandSite" | "brandContact";
+            brandPageType: import("@brand-page/models").BrandPageType;
         }): void;
         initialiseStoresByBrandPageModelAsync(brandPageModel: import("@brand-page/models").BrandPageModel): Promise<void>;
-        initialise({ brandPage, brandPageType, logoDraftDesignAttributes, unsplashApplicationName, templateCategories, personalisationData, isPersonalisationEnabled, businessName, industry, layout, logoVariationImageUrls, 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, }: import("@brand-page-maker/stores").InitialisePayload): Promise<void>;
         initialisePages({ pages, sections, }: {
             pages: import("@brand-page/models").PageModel[];
             sections: import("../../../shared/page-settings/store").PageSettingsStateSections;
@@ -155,11 +155,13 @@ declare const _default: import("vue").DefineComponent<{}, {
             viewport: import("@brand-page/models").ViewportsType;
         }): void;
         showStripeOnboardingModal(): Promise<void>;
-        selectInitialCategories(payload: import("../../../shared/template-settings/models").InitialCategories): void;
+        selectInitialCategories(payload: import("@brand-page-maker/stores").SelectedCategoryPayload): void;
     }>;
 }, {}, {}, {
     saveBrandPage(): void;
     saveAndPublishBrandPage(isActionBar: boolean): void;
     createTeamCards(isTopNav: boolean): void;
-}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "create-team-cards"[], "create-team-cards", import("vue").PublicProps, Readonly<{}> & Readonly<{
+    "onCreate-team-cards"?: ((...args: any[]) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/src/brand-page-maker/components/action-bar/ActionBar.mixin.js

@@ -4,6 +4,7 @@ import { computed, defineComponent } from 'vue';
 import { UPGRADE_CTA_LOCATIONS } from './../../composables/useEventTracker';
 import { BRAND_PAGE_TYPES } from '@brand-page/models';
 export default defineComponent({
+    emits: ['create-team-cards'],
     setup() {
         const userStore = useBrandPageMakerUserStore();
         const brandPageMakerStore = useBrandPageMakerStore();

package/lib/src/brand-page-maker/components/admin-background-settings/AdminBackgroundSettings.mixin.d.ts

@@ -180,7 +180,7 @@ declare const _default: import("vue").DefineComponent<{}, {
                 wordBreak?: string | undefined;
             };
         }[];
-        personalisationRole?: "website" | "email" | "phone" | "profile" | "about" | "information" | "media" | undefined;
+        personalisationRole?: import("../../../brand-page").PersonalisationRole | undefined;
         media?: {
             type: import("../../../brand-page").MediaTypes;
         } | undefined;
@@ -243,14 +243,20 @@ declare const _default: import("vue").DefineComponent<{}, {
             thirdPartySettings: import("../../../lib").UIRootStateThirdPartySettings;
         }): void;
         setDeviceMode({ mode }: {
-            mode: "desktop" | "mobile";
+            mode: import("../../../lib").UiDeviceMode;
         }): void;
         setScreenSizeMode({ mode }: {
-            mode: "desktop" | "mobile";
+            mode: import("../../../lib").UiScreenSizeMode;
         }): void;
         setUserPersonalisationData({ personalisationData, }: {
             personalisationData: import("../../../brand-page").UserPersonalisationContent[];
         }): void;
+        setUserPromptContentKey({ userPromptContentKey, }: {
+            userPromptContentKey: string | undefined;
+        }): void;
+        setShowAiTemplatesTab({ showAiTemplatesTab, }: {
+            showAiTemplatesTab: boolean;
+        }): void;
         onBackgroundChanged(): void;
         onContentChanged(): void;
         onStyleChanged(): void;
@@ -263,7 +269,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             type: string;
         }): Promise<void>;
         onTemplateSelected(payload: import("@brand-page-maker/stores").OnTemplateSelectedPayload): Promise<void>;
-        showUpgradeModalAndSaveAsync(contextualUpgradeType?: string | number | symbol | undefined): Promise<void>;
+        showUpgradeModalAndSaveAsync(contextualUpgradeType?: import("@brand-page-maker/stores").WebsiteContextUpgradeType): Promise<void>;
         setIsPersonalisationEnabled({ isPersonalisationEnabled, }: {
             isPersonalisationEnabled: boolean;
         }): void;
@@ -273,11 +279,11 @@ declare const _default: import("vue").DefineComponent<{}, {
     }, {
         onBackgroundChanged(): void;
         setBackgroundStyle({ backgroundStyle, }: {
-            backgroundStyle: Partial<Omit<BrandPageCssStyle, "backgroundColor">>;
+            backgroundStyle: import("../../../brand-page").BackgroundStyle;
         }): void;
         setBackgroundShapes(payload: import("../../../brand-page").BackgroundShape[]): void;
         setBackgroundPersonalisationRole(payload: {
-            personalisationRole: "website" | "email" | "phone" | "profile" | "about" | "information" | "media" | undefined;
+            personalisationRole: import("../../../brand-page").PersonalisationRole | undefined;
         }): void;
         setBackgroundShapeStyle(payload: BrandPageCssStyle): void;
         setPrimaryBackgroundShapeStyle(payload: BrandPageCssStyle): void;
@@ -286,9 +292,9 @@ declare const _default: import("vue").DefineComponent<{}, {
         }): void;
         addBackgroundShape({ shapeUrl, width, height, aspectRatio, }: {
             shapeUrl: string;
-            width?: number | undefined;
-            height?: number | undefined;
-            aspectRatio?: number | undefined;
+            width?: number;
+            height?: number;
+            aspectRatio?: number;
         }): void;
         deleteBackgroundShape({ shapeIndex }: {
             shapeIndex: number;
@@ -303,7 +309,7 @@ declare const _default: import("vue").DefineComponent<{}, {
         setBackgroundShapeSettings(payload: import("../../../shared/background-settings/background-settings-models").SetBackgroundShapeSettingsPayload): void;
         setRecommendedLogoColors(payload: import("../../../shared/background-settings/background-settings-models").SetRecommendedLogoColorsPayload): void;
         setBackgroundMode(payload: {
-            backgroundMode: "images" | "edit";
+            backgroundMode: import("@brand-page-maker/stores").BrandPageSettingsMode;
         }): void;
         setBackgroundMedia(payload: import("src/shared/my-uploads/models").MediaBaseSelectedPayload): void;
         removeBackgroundVideo(): void;

package/lib/src/brand-page-maker/components/admin-logo-settings/AdminLogoSettings.mixin.d.ts

@@ -2,12 +2,12 @@ declare const _default: import("vue").DefineComponent<{}, {
     templates: import("vue").ComputedRef<import("@brand-page-maker/stores/admin-logo-settings").AdminPreviewLogoTemplateTemplate[]>;
     items: import("vue").ComputedRef<{
         id: string;
-        type: "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";
+        type: import("../../../brand-page").ContentType;
         settings: {
             content: {
                 id: string;
-                type: "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";
-                personalisationRole?: "website" | "email" | "phone" | "profile" | "about" | "information" | "media" | undefined;
+                type: import("../../../brand-page").ContentType;
+                personalisationRole?: import("../../../brand-page").PersonalisationRole | undefined;
                 topPadding?: number | undefined;
                 bottomPadding?: number | undefined;
                 imageUrlOverride?: string | undefined;