@designcrowd/library.brand-page 5.16.20-jj-5 → 5.16.20

package/lib/src/{CreatedOnBrandCrowd-de-de-BmtwV05T.js → CreatedOnBrandCrowd-de-de-J__RLFLg.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-VRdwhwmL.js";
+import { _ as t } from "./lib-BOtmY7CJ.js";
 const i = {}, h = {
   width: "275",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-en-us-LuqBJgA0.js → CreatedOnBrandCrowd-en-us-C_StRJjo.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-VRdwhwmL.js";
+import { _ as t } from "./lib-BOtmY7CJ.js";
 const i = {}, h = {
   width: "251",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-es-es-jz11frzX.js → CreatedOnBrandCrowd-es-es-ykBdLbIt.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-VRdwhwmL.js";
+import { _ as t } from "./lib-BOtmY7CJ.js";
 const i = {}, h = {
   width: "250",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-fr-fr-7sG2kcrh.js → CreatedOnBrandCrowd-fr-ca-Ben4lUb4.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-VRdwhwmL.js";
+import { _ as t } from "./lib-BOtmY7CJ.js";
 const i = {}, h = {
   width: "237",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-fr-ca-7sG2kcrh.js → CreatedOnBrandCrowd-fr-fr-Ben4lUb4.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-VRdwhwmL.js";
+import { _ as t } from "./lib-BOtmY7CJ.js";
 const i = {}, h = {
   width: "237",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-pt-pt-B-cCVxd5.js → CreatedOnBrandCrowd-pt-br-DE7Ub3nU.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-VRdwhwmL.js";
+import { _ as t } from "./lib-BOtmY7CJ.js";
 const i = {}, h = {
   width: "263",
   height: "36",

package/lib/src/{CreatedOnBrandCrowd-pt-br-B-cCVxd5.js → CreatedOnBrandCrowd-pt-pt-DE7Ub3nU.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as e, openBlock as l, createStaticVNode as a } from "vue";
-import { _ as t } from "./lib-VRdwhwmL.js";
+import { _ as t } from "./lib-BOtmY7CJ.js";
 const i = {}, h = {
   width: "263",
   height: "36",

package/lib/src/{CreatedOnDcom-de-de-D2qanamp.js → CreatedOnDcom-de-de-Di4nyRvm.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as H, openBlock as V, createStaticVNode as t } from "vue";
-import { _ as e } from "./lib-VRdwhwmL.js";
+import { _ as e } from "./lib-BOtmY7CJ.js";
 const M = {}, Z = {
   width: "242",
   height: "36",

package/lib/src/{CreatedOnDcom-en-us-7-SxOY7M.js → CreatedOnDcom-en-us-DhKIp5pO.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as H, openBlock as V, createStaticVNode as t } from "vue";
-import { _ as e } from "./lib-VRdwhwmL.js";
+import { _ as e } from "./lib-BOtmY7CJ.js";
 const i = {}, M = {
   width: "231",
   height: "36",

package/lib/src/{CreatedOnDcom-es-es-DgoRlaC6.js → CreatedOnDcom-es-es-CN2W2-do.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as H, openBlock as V, createStaticVNode as t } from "vue";
-import { _ as e } from "./lib-VRdwhwmL.js";
+import { _ as e } from "./lib-BOtmY7CJ.js";
 const M = {}, Z = {
   width: "230",
   height: "36",

package/lib/src/{CreatedOnDcom-fr-ca-B0Sh69Uf.js → CreatedOnDcom-fr-ca-C9BMeD0q.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as H, openBlock as V, createStaticVNode as t } from "vue";
-import { _ as e } from "./lib-VRdwhwmL.js";
+import { _ as e } from "./lib-BOtmY7CJ.js";
 const i = {}, l = {
   width: "216",
   height: "36",

package/lib/src/{CreatedOnDcom-fr-fr-BUtkbWuU.js → CreatedOnDcom-fr-fr-BEDq3Dtj.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as H, openBlock as V, createStaticVNode as t } from "vue";
-import { _ as e } from "./lib-VRdwhwmL.js";
+import { _ as e } from "./lib-BOtmY7CJ.js";
 const i = {}, l = {
   width: "216",
   height: "36",

package/lib/src/{CreatedOnDcom-pt-br-CGm1W-GK.js → CreatedOnDcom-pt-br-DayjxD6x.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as H, openBlock as V, createStaticVNode as t } from "vue";
-import { _ as M } from "./lib-VRdwhwmL.js";
+import { _ as M } from "./lib-BOtmY7CJ.js";
 const Z = {}, e = {
   width: "232",
   height: "36",

package/lib/src/{CreatedOnDcom-pt-pt-Bu6bf7iy.js → CreatedOnDcom-pt-pt-E7OAm5qD.js}

@@ -1,5 +1,5 @@
 import { createElementBlock as H, openBlock as V, createStaticVNode as t } from "vue";
-import { _ as M } from "./lib-VRdwhwmL.js";
+import { _ as M } from "./lib-BOtmY7CJ.js";
 const Z = {}, e = {
   width: "232",
   height: "36",

package/lib/src/brand-page/constants/logo.constants.d.ts

@@ -5,3 +5,4 @@ export declare const LOGO_VARIATION: {
     TEXT_ONLY_WITH_TRANSPARENT_BACKGROUND: number;
 };
 export declare const DEFAULT_LOGO_VARIATION: number;
+export declare const LOGO_MIGRATION_VERSION = 6;

package/lib/src/brand-page/constants/logo.constants.js

@@ -5,3 +5,5 @@ export const LOGO_VARIATION = {
     TEXT_ONLY_WITH_TRANSPARENT_BACKGROUND: 3,
 };
 export const DEFAULT_LOGO_VARIATION = LOGO_VARIATION.LOGO_WITH_TRANSPARENT_BACKGROUND;
+// migrating logo images to a fixed height
+export const LOGO_MIGRATION_VERSION = 6;

package/lib/src/brand-page/utils/logo.util.d.ts

@@ -1,4 +1,3 @@
-import type { BrandPageType } from '../models';
 import { type BrandPageModel, type LogoImageModel, type LogoTemplateImageModel, type LogoVariation } from '../models';
 import { type LogoOutputFormat } from '../../clients/fabric-render-client';
 export declare const getLogoDraftTokenFromLogoImageUrl: (variationUrl?: string) => string;
@@ -13,9 +12,7 @@ export declare const applyLogoImageBase64UrlToBrandPageTemplateModel: (model: Br
 export declare const applyLogoTemplateImageToBrandPageTemplateModel: (model: BrandPageModel, logoTemplateImage: LogoTemplateImageModel) => BrandPageModel;
 export declare const getLogoVariationUrlByLogoImage: (logoImage: LogoImageModel) => string | undefined;
 export declare const getLogoTemplateUrlByLogoTemplateImage: (logoTemplateImage: LogoTemplateImageModel) => string;
-export declare const getOptimalLogoSize: (brandPageType: BrandPageType, width: number, height: number, currentSize: string) => {
-    newLogoSize: string;
-};
+export declare const getOptimalLogoSize: (width: number, height: number, currentSize: string) => string;
 export declare const calculateLogoDimensions: (logoData: {
     width: number;
     height: number;

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

@@ -167,40 +167,21 @@ export const getLogoVariationUrlByLogoImage = (logoImage) => {
 export const getLogoTemplateUrlByLogoTemplateImage = (logoTemplateImage) => {
     return FabricRenderClient.getInstance().getLogoTemplateUrlByLogoTemplateImage(logoTemplateImage);
 };
-export const getOptimalLogoSize = (brandPageType, width, height, currentSize) => {
-    // //OLD logic
-    // if (parseFloat(currentSize) >= 16) {
-    //   return { newLogoSize: currentSize };
-    // }
-    // const aspectRatio = width / height;
-    // if (!parseFloat(`${aspectRatio}`) || aspectRatio <= 1) {
-    //   return { newLogoSize: currentSize };
-    // }
-    // const newSize = parseFloat(currentSize) + (aspectRatio - 1) * 4.5;
-    // if (newSize > 11) {
-    //   return { newLogoSize: '11rem' };
-    // } else {
-    //   return { newLogoSize: `${Math.round(newSize)}rem` };
-    // }
-    const ratio = width / height;
-    let newLogoSize = '11rem'; // default size
-    if (brandPageType === BRAND_PAGE_TYPES.brandSite) {
-        if (ratio < 0.95) {
-            // tall logos
-            newLogoSize = '10rem';
-        }
-        else if (ratio >= 1.65) {
-            // wide logos
-            newLogoSize = '10rem';
-        }
+export const getOptimalLogoSize = (width, height, currentSize) => {
+    if (parseFloat(currentSize) >= 16) {
+        return currentSize;
+    }
+    const aspectRatio = width / height;
+    if (!parseFloat(`${aspectRatio}`) || aspectRatio <= 1) {
+        return currentSize;
+    }
+    const newSize = parseFloat(currentSize) + (aspectRatio - 1) * 4.5;
+    if (newSize > 11) {
+        return '11rem';
     }
     else {
-        // BP and BC default
-        newLogoSize = '8rem';
+        return `${Math.round(newSize)}rem`;
     }
-    return {
-        newLogoSize,
-    };
 };
 export const calculateLogoDimensions = (logoData, maxWidth, maxHeight) => {
     const maxWidthRem = parseFloat(maxWidth);
@@ -268,9 +249,11 @@ export const recalculateLogoContentDimensions = async (pageData, editableLogoVar
             }
             // Apply dimensions or fallback logic
             if (logoData && logoData.width && logoData.height) {
-                const dimensions = getOptimalLogoSize(BRAND_PAGE_TYPES.default, logoData.width, logoData.height, content.logoImageHeight);
-                content.logoImageHeight = dimensions.newLogoSize;
-                content.logoImageWidth = dimensions.newLogoSize;
+                const currentMaxWidth = content.logoImageWidth || DEFAULT_LOGO_WIDTH;
+                const currentMaxHeight = content.logoImageHeight || DEFAULT_LOGO_HEIGHT;
+                const dimensions = calculateOptimizedLogoDimensions(logoData, currentMaxWidth, currentMaxHeight);
+                content.logoImageHeight = dimensions.height;
+                content.logoImageWidth = dimensions.width;
             }
         });
     }

package/lib/src/brand-page/utils/migration/migration-07.d.ts

@@ -1,2 +1,4 @@
-import type { MigrationData, MigrationOptions } from '../migration.util';
-export declare const migration07: (migrationResult: MigrationData, options: MigrationOptions) => Promise<MigrationData>;
+import type { MigrationData } from '../migration.util';
+export declare const migration07: (migrationResult: MigrationData, options: {
+    isServerRender: boolean;
+}) => Promise<MigrationData>;

package/lib/src/brand-page/utils/migration/migration-07.js

@@ -6,7 +6,7 @@ export const migration07 = async (migrationResult, options) => {
     if (brandPageModel.brandPageType !== BRAND_PAGE_TYPES.brandSite) {
         return migrationResult;
     }
-    if (options.disableLogoSizeMigration) {
+    if (options.isServerRender !== undefined && options.isServerRender) {
         migrationResult.useOldLogoRenderSize = true;
         return migrationResult;
     }

package/lib/src/brand-page/utils/migration/migration-08.d.ts

@@ -1,2 +1,5 @@
-import type { MigrationData, MigrationOptions } from '../migration.util';
-export declare const migration08: (migrationResult: MigrationData, options: MigrationOptions) => Promise<MigrationData>;
+import type { MigrationData } from '../migration.util';
+export declare const migration08: (migrationResult: MigrationData, options: {
+    isServerRender: boolean;
+    isUserDraft?: boolean;
+}) => Promise<MigrationData>;

package/lib/src/brand-page/utils/migration/migration-08.js

@@ -1,14 +1,17 @@
 import { DEFAULT_LOGO_HEIGHT, DEFAULT_LOGO_WIDTH, BRAND_PAGE_TYPES, } from '../..';
 import { FabricRenderClient } from '../../../clients/fabric-render-client';
 import { isLogoContent } from '../model.util';
-import { calculateLogoDimensions } from '../logo.util';
+import { calculateLogoDimensions, safeGetLogoImageFromLogoImageUrl, } from '../logo.util';
 export const migration08 = async (migrationResult, options) => {
     const { brandPageModel } = migrationResult;
     if (brandPageModel.brandPageType !== BRAND_PAGE_TYPES.default &&
         brandPageModel.brandPageType !== BRAND_PAGE_TYPES.brandContact) {
         return migrationResult;
     }
-    if (options.disableLogoSizeMigration) {
+    if (options.isUserDraft !== undefined && !options.isUserDraft) {
+        return migrationResult;
+    }
+    if (options.isServerRender !== undefined && options.isServerRender) {
         migrationResult.useOldLogoRenderSize = true;
         return migrationResult;
     }

package/lib/src/brand-page/utils/migration.util.d.ts

@@ -3,11 +3,9 @@ export interface MigrationData {
     brandPageModel: BrandPageModel;
     useOldLogoRenderSize: boolean;
 }
-export interface MigrationOptions {
+export declare const GetLatestModelVersion: () => number;
+export declare const migrateBrandPageModel: (brandPageModel: BrandPageModel, options: {
     logoImage?: LogoImageModel;
     isUserDraft: boolean;
     isServerRender: boolean;
-    disableLogoSizeMigration?: boolean;
-}
-export declare const GetLatestModelVersion: () => number;
-export declare const migrateBrandPageModel: (brandPageModel: BrandPageModel, options: MigrationOptions) => Promise<MigrationData>;
+}) => Promise<MigrationData>;

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

@@ -1,3 +1,4 @@
+import { LOGO_MIGRATION_VERSION } from '../constants';
 import {} from '../models';
 import { migration01 } from './migration/migration-01';
 import { migration01_1 } from './migration/migration-01_1';

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

@@ -552,14 +552,13 @@ export const useBrandPageMakerStore = defineStore('brandPageMaker', {
                         ? logoPrePurchase
                         : logoPostPurchase;
                     if (logo && logoImageHeight) {
-                        const optimalSize = getOptimalLogoSize(this.brandPageType, logo.width, logo.height, logoImageHeight);
-                        pageSettingsStore.sections[PAGE_SECTIONS.header][VIEWPORTS.desktop].logoImageWidth = optimalSize.newLogoSize;
-                        pageSettingsStore.sections[PAGE_SECTIONS.header][VIEWPORTS.desktop].logoImageHeight = optimalSize.newLogoSize;
+                        const newLogoSize = getOptimalLogoSize(logo.width, logo.height, logoImageHeight);
+                        pageSettingsStore.sections[PAGE_SECTIONS.header][VIEWPORTS.desktop].logoImageWidth = newLogoSize;
+                        pageSettingsStore.sections[PAGE_SECTIONS.header][VIEWPORTS.desktop].logoImageHeight = newLogoSize;
                     }
                 }
-                else if (!brandPageContainerStore.designDraftToken &&
-                    !userStore.isAdmin &&
-                    this.isBrandPageOrIsBrandContact) {
+                else if (this.isBrandPageOrIsBrandContact &&
+                    brandPageContainerStore.isPrePurchase) {
                     recalculateLogoContentDimensions(pageSettingsStore, editableLogoStore.editableLogoVariations);
                 }
                 const backgroundStyles = new BackgroundStyles(brandPageModel.styles.backgroundStyles);