@designcrowd/library.brand-page 5.10.20 → 5.10.31

package/lib/src/lib.js

@@ -27,6 +27,7 @@ export { default as SensitiveContentModal } from './brand-page/components/sensit
 export { getBrandPageViewModelFromBrandPageModel, migrateBrandPageModel, } from './brand-page/utils';
 export * as brandPageUtils from './brand-page/utils';
 export { getOptimalLogoSize } from './brand-page/utils/logo.util';
+export { sanitizeRTEHtml } from './brand-page-maker/utils';
 // stores
 export { useBrandPageMakerStore, useBrandPageMakerUserStore, useUiStore, useBrandPageContainerStore, useEventManagerStore, } from './brand-page-maker/stores';
 export { useShopConfigStore } from './shared/ecommerce-settings/store/shop-settings-store';
@@ -44,4 +45,4 @@ export { createBrandPageMakerRouter, setRouterInstance, attachRouterHooks, } fro
 // Composable
 export { useEventTracker } from './brand-page-maker/composables/useEventTracker';
 export { useConsent, } from './brand-page/composables/consent.composable';
-export { setLocaleAsync, tr } from './composables/useTranslate';
+export { setLocaleAsync, tr, createNewI18nInstance, } from './composables/useTranslate';

package/lib/src/mockServiceWorker.js

@@ -5,24 +5,23 @@
  * Mock Service Worker.
  * @see https://github.com/mswjs/msw
  * - Please do NOT modify this file.
- * - Please do NOT serve this file on production.
  */
 
-const PACKAGE_VERSION = '2.8.7'
-const INTEGRITY_CHECKSUM = '00729d72e3b82faf54ca8b9621dbb96f'
+const PACKAGE_VERSION = '2.10.2'
+const INTEGRITY_CHECKSUM = 'f5825c521429caf22a4dd13b66e243af'
 const IS_MOCKED_RESPONSE = Symbol('isMockedResponse')
 const activeClientIds = new Set()
 
-self.addEventListener('install', function () {
+addEventListener('install', function () {
   self.skipWaiting()
 })
 
-self.addEventListener('activate', function (event) {
+addEventListener('activate', function (event) {
   event.waitUntil(self.clients.claim())
 })
 
-self.addEventListener('message', async function (event) {
-  const clientId = event.source.id
+addEventListener('message', async function (event) {
+  const clientId = Reflect.get(event.source || {}, 'id')
 
   if (!clientId || !self.clients) {
     return
@@ -94,17 +93,18 @@ self.addEventListener('message', async function (event) {
   }
 })
 
-self.addEventListener('fetch', function (event) {
-  const { request } = event
-
+addEventListener('fetch', function (event) {
   // Bypass navigation requests.
-  if (request.mode === 'navigate') {
+  if (event.request.mode === 'navigate') {
     return
   }
 
   // Opening the DevTools triggers the "only-if-cached" request
   // that cannot be handled by the worker. Bypass such requests.
-  if (request.cache === 'only-if-cached' && request.mode !== 'same-origin') {
+  if (
+    event.request.cache === 'only-if-cached' &&
+    event.request.mode !== 'same-origin'
+  ) {
     return
   }
 
@@ -115,48 +115,62 @@ self.addEventListener('fetch', function (event) {
     return
   }
 
-  // Generate unique request ID.
   const requestId = crypto.randomUUID()
   event.respondWith(handleRequest(event, requestId))
 })
 
+/**
+ * @param {FetchEvent} event
+ * @param {string} requestId
+ */
 async function handleRequest(event, requestId) {
   const client = await resolveMainClient(event)
+  const requestCloneForEvents = event.request.clone()
   const response = await getResponse(event, client, requestId)
 
   // Send back the response clone for the "response:*" life-cycle events.
   // Ensure MSW is active and ready to handle the message, otherwise
   // this message will pend indefinitely.
   if (client && activeClientIds.has(client.id)) {
-    ;(async function () {
-      const responseClone = response.clone()
-
-      sendToClient(
-        client,
-        {
-          type: 'RESPONSE',
-          payload: {
-            requestId,
-            isMockedResponse: IS_MOCKED_RESPONSE in response,
+    const serializedRequest = await serializeRequest(requestCloneForEvents)
+
+    // Clone the response so both the client and the library could consume it.
+    const responseClone = response.clone()
+
+    sendToClient(
+      client,
+      {
+        type: 'RESPONSE',
+        payload: {
+          isMockedResponse: IS_MOCKED_RESPONSE in response,
+          request: {
+            id: requestId,
+            ...serializedRequest,
+          },
+          response: {
             type: responseClone.type,
             status: responseClone.status,
             statusText: responseClone.statusText,
-            body: responseClone.body,
             headers: Object.fromEntries(responseClone.headers.entries()),
+            body: responseClone.body,
           },
         },
-        [responseClone.body],
-      )
-    })()
+      },
+      responseClone.body ? [serializedRequest.body, responseClone.body] : [],
+    )
   }
 
   return response
 }
 
-// Resolve the main client for the given event.
-// Client that issues a request doesn't necessarily equal the client
-// that registered the worker. It's with the latter the worker should
-// communicate with during the response resolving phase.
+/**
+ * Resolve the main client for the given event.
+ * Client that issues a request doesn't necessarily equal the client
+ * that registered the worker. It's with the latter the worker should
+ * communicate with during the response resolving phase.
+ * @param {FetchEvent} event
+ * @returns {Promise<Client | undefined>}
+ */
 async function resolveMainClient(event) {
   const client = await self.clients.get(event.clientId)
 
@@ -184,12 +198,16 @@ async function resolveMainClient(event) {
     })
 }
 
+/**
+ * @param {FetchEvent} event
+ * @param {Client | undefined} client
+ * @param {string} requestId
+ * @returns {Promise<Response>}
+ */
 async function getResponse(event, client, requestId) {
-  const { request } = event
-
   // Clone the request because it might've been already used
   // (i.e. its body has been read and sent to the client).
-  const requestClone = request.clone()
+  const requestClone = event.request.clone()
 
   function passthrough() {
     // Cast the request headers to a new Headers instance
@@ -230,29 +248,17 @@ async function getResponse(event, client, requestId) {
   }
 
   // Notify the client that a request has been intercepted.
-  const requestBuffer = await request.arrayBuffer()
+  const serializedRequest = await serializeRequest(event.request)
   const clientMessage = await sendToClient(
     client,
     {
       type: 'REQUEST',
       payload: {
         id: requestId,
-        url: request.url,
-        mode: request.mode,
-        method: request.method,
-        headers: Object.fromEntries(request.headers.entries()),
-        cache: request.cache,
-        credentials: request.credentials,
-        destination: request.destination,
-        integrity: request.integrity,
-        redirect: request.redirect,
-        referrer: request.referrer,
-        referrerPolicy: request.referrerPolicy,
-        body: requestBuffer,
-        keepalive: request.keepalive,
+        ...serializedRequest,
       },
     },
-    [requestBuffer],
+    [serializedRequest.body],
   )
 
   switch (clientMessage.type) {
@@ -268,6 +274,12 @@ async function getResponse(event, client, requestId) {
   return passthrough()
 }
 
+/**
+ * @param {Client} client
+ * @param {any} message
+ * @param {Array<Transferable>} transferrables
+ * @returns {Promise<any>}
+ */
 function sendToClient(client, message, transferrables = []) {
   return new Promise((resolve, reject) => {
     const channel = new MessageChannel()
@@ -280,14 +292,18 @@ function sendToClient(client, message, transferrables = []) {
       resolve(event.data)
     }
 
-    client.postMessage(
-      message,
-      [channel.port2].concat(transferrables.filter(Boolean)),
-    )
+    client.postMessage(message, [
+      channel.port2,
+      ...transferrables.filter(Boolean),
+    ])
   })
 }
 
-async function respondWithMock(response) {
+/**
+ * @param {Response} response
+ * @returns {Response}
+ */
+function respondWithMock(response) {
   // Setting response status code to 0 is a no-op.
   // However, when responding with a "Response.error()", the produced Response
   // instance will have status code set to 0. Since it's not possible to create
@@ -305,3 +321,24 @@ async function respondWithMock(response) {
 
   return mockedResponse
 }
+
+/**
+ * @param {Request} request
+ */
+async function serializeRequest(request) {
+  return {
+    url: request.url,
+    mode: request.mode,
+    method: request.method,
+    headers: Object.fromEntries(request.headers.entries()),
+    cache: request.cache,
+    credentials: request.credentials,
+    destination: request.destination,
+    integrity: request.integrity,
+    redirect: request.redirect,
+    referrer: request.referrer,
+    referrerPolicy: request.referrerPolicy,
+    body: await request.arrayBuffer(),
+    keepalive: request.keepalive,
+  }
+}

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

@@ -29,7 +29,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;
@@ -125,7 +125,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;

package/lib/src/shared/content-settings/components/color-field/ColorField.mixin.d.ts

@@ -75,6 +75,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         required: false;
         default: undefined;
     };
+    showColorPallet: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
 }>, {
     backgroundStyles: import("vue").ComputedRef<{
         style: {
@@ -369,6 +374,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         required: false;
         default: undefined;
     };
+    showColorPallet: {
+        type: BooleanConstructor;
+        required: false;
+        default: boolean;
+    };
 }>> & Readonly<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
     "onOn-toggle-state-change"?: ((...args: any[]) => any) | undefined;
@@ -384,5 +394,6 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     isToggled: boolean;
     toggleUniqueId: string;
     enableColorMatch: boolean;
+    showColorPallet: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/src/shared/content-settings/components/color-field/ColorField.mixin.js

@@ -80,6 +80,11 @@ export default defineComponent({
             required: false,
             default: undefined,
         },
+        showColorPallet: {
+            type: Boolean,
+            required: false,
+            default: true,
+        },
     },
     setup() {
         const backgroundSettingsStore = useUiBackgroundSettingsStore();

package/lib/src/shared/content-settings/components/email-field/EmailField.mixin.d.ts

@@ -26,7 +26,7 @@ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;
@@ -122,7 +122,7 @@ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;

package/lib/src/shared/content-settings/components/page-dropdown-field/PageDropdownField.mixin.d.ts

@@ -16,6 +16,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: StringConstructor;
         required: true;
     };
+    showUpgradeBtn: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {
     pageSettingsStore: import("pinia").Store<"uiPageSettings", import("../../../page-settings/store").PageSettingsState, {
         pageIndex(): number;
@@ -127,7 +131,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         type: StringConstructor;
         required: true;
     };
+    showUpgradeBtn: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}>, {
+    showUpgradeBtn: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/src/shared/content-settings/components/page-dropdown-field/PageDropdownField.mixin.js

@@ -20,6 +20,10 @@ export default defineComponent({
             type: String,
             required: true,
         },
+        showUpgradeBtn: {
+            type: Boolean,
+            default: true,
+        },
     },
     setup() {
         const pageSettingsStore = useUiPageSettingsStore();

package/lib/src/shared/content-settings/components/shape-field/ShapeField.mixin.d.ts

@@ -32,7 +32,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
 }>, {}, {
     changeDebounce: DebounceHandle | undefined;
     options: ShapeItem[];
-    maxLengthError: string;
+    maxLengthError: any;
     titleLength: number;
     descriptionLength: number;
 }, {}, {

package/lib/src/shared/content-settings/components/tel-field/TelField.mixin.d.ts

@@ -26,7 +26,7 @@ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;
@@ -122,7 +122,7 @@ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;

package/lib/src/shared/content-settings/components/testimonial-items-field/TestimonialItemsField.mixin.d.ts

@@ -35,8 +35,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     isModified: boolean[];
     maxTitleLength: number;
     maxTestimonialLength: number;
-    testimonialEmptyErrorMessage: string;
-    testimonialMaxLengthErrorMessage: string;
+    testimonialEmptyErrorMessage: any;
+    testimonialMaxLengthErrorMessage: any;
 }, {}, {
     onItemsDelete(index: number): void;
     onAddNewItem(): void;

package/lib/src/shared/content-settings/components/text-field/TextField.mixin.d.ts

@@ -26,7 +26,7 @@ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;
@@ -122,7 +122,7 @@ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;

package/lib/src/shared/content-settings/components/text-image-field/TextImageField.mixin.d.ts

@@ -45,8 +45,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
 }>, {}, {
     changeDebounce: DebounceHandle | undefined;
     options: (TextMediaItem | TextShapeItem)[];
-    maxLengthError: string;
-    invalidUrlError: string;
+    maxLengthError: any;
+    invalidUrlError: any;
     titleLength: number;
     urlError: {};
     mediaType: undefined;

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

@@ -38,8 +38,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     isEmpty: boolean[];
     isModified: boolean[];
     maxTextLength: number;
-    textEmptyErrorMessage: string;
-    textMaxLengthErrorMessage: string;
+    textEmptyErrorMessage: any;
+    textMaxLengthErrorMessage: any;
     isInternalWatchEnabled: boolean;
 }, {}, {
     onDelete(index: number): void;

package/lib/src/shared/content-settings/components/textarea-field/TextareaField.mixin.d.ts

@@ -40,7 +40,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;
@@ -136,7 +136,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;

package/lib/src/shared/content-settings/components/url-field/UrlField.mixin.d.ts

@@ -1,8 +1,10 @@
 /// <reference types="types/lodash-shims" />
 declare const _default: import("vue").DefineComponent<{}, {}, Record<string, any>, {
     icon(): string;
+    formattedValue(): string;
 }, {
     onFocusOverride(): void;
+    onInputOverride(): void;
     onChangeOverride(): void;
 }, import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     attrs: {
@@ -31,7 +33,7 @@ declare const _default: import("vue").DefineComponent<{}, {}, Record<string, any
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;
@@ -127,7 +129,7 @@ declare const _default: import("vue").DefineComponent<{}, {}, Record<string, any
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;

package/lib/src/shared/content-settings/components/url-field/UrlField.mixin.js

@@ -22,6 +22,14 @@ export default defineComponent({
                     return 'globe';
             }
         },
+        formattedValue() {
+            if (this.role === 'url' &&
+                this.innerValue &&
+                !URL_RE.test(this.innerValue)) {
+                return `${this.schema}://${this.innerValue}`;
+            }
+            return this.innerValue;
+        },
     },
     watch: {
         value(newVal) {
@@ -35,13 +43,10 @@ export default defineComponent({
     methods: {
         onFocusOverride() {
             this.isDirty = true;
-            if (this.role !== 'url') {
-                return;
-            }
-            const match = URL_RE.exec(this.innerValue);
-            if (match) {
-                this.schema = match[1];
-                this.innerValue = match[2];
+        },
+        onInputOverride() {
+            if (this.role === 'url') {
+                this.text = this.innerValue;
             }
         },
         onChangeOverride() {

package/lib/src/shared/content-settings/components/youtube-video-field/YoutubeVideoField.mixin.d.ts

@@ -29,7 +29,7 @@ declare const _default: import("vue").DefineComponent<{}, {}, Record<string, any
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;
@@ -125,7 +125,7 @@ declare const _default: import("vue").DefineComponent<{}, {}, Record<string, any
     placeholder: {
         type: StringConstructor;
         required: false;
-        default: () => string;
+        default: () => any;
     };
     role: {
         type: StringConstructor;

package/lib/src/shared/logo-settings/components/EditLogoSettings.mixin.d.ts

@@ -202,12 +202,12 @@ declare const _default: import("vue").DefineComponent<{}, {
 }, {
     selectedTab: {
         key: string;
-        displayName: string;
+        displayName: any;
     };
-    tabs: string[];
+    tabs: any[];
     tabsWithTranslations: {
         key: string;
-        displayName: string;
+        displayName: any;
     }[];
 }, {
     tabMenuClasses(): string;

package/lib/src/shared/my-uploads/MyUploads.mixin.d.ts

@@ -101,7 +101,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         thumbnailHeight: any;
         thumbnailWidth: any;
         acceptedFiles: any;
-        dictFileTooBig: string;
+        dictFileTooBig: any;
         accept: any;
     }>;
     onDropzoneImageUploaderAccept(file: DropzoneFile, done: (error?: string | Error) => void): void;

package/lib/src/shared/page-settings/components/page-settings/PageSettings.mixin.d.ts

@@ -4706,7 +4706,7 @@ declare const _default: import("vue").DefineComponent<{}, {
     footerPageSectionStyleOptions(): PageSectionStyleOption[];
     footerFontSettingsOptions(): PageSettingsFontSettingsOption[];
     showFooterSettings(): boolean;
-    hideText(): string;
+    hideText(): any;
 }, {
     onAddNewPageSelected(): Promise<void>;
     onDeletePageSelected(pageIndex: number): void;

package/lib/src/shared/page-settings/components/page-settings-section-styles/PageSettingsSectionStyles.mixin.d.ts

@@ -3059,6 +3059,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             label: string;
             isSelected: boolean;
             dataAttribute?: string | undefined;
+            disabled?: boolean | undefined;
         } | {
             label?: string | undefined;
             value: string;
@@ -3068,6 +3069,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             iconViewBox?: string | undefined;
             iconSize?: string | undefined;
             dataAttribute?: string | undefined;
+            disabled?: boolean | undefined;
         };
         options: ("defaultBorderColor" | "selectedBorderColor" | "defaultTextStyle" | "defaultBackgroundColor" | "selectedTextColor" | "selectedBackgroundColor" | "iconColor" | "iconBackgroundColor")[];
         iconStyle: {
@@ -4282,7 +4284,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         readonly headerDisplay: "headerDisplay";
         readonly footerDisplay: "footerDisplay";
     };
-    viewports: string[];
+    viewports: any[];
 }, {
     isRenderAfterLogo(): any;
     navigation(): NavigationDesktop | NavigationMobile;
@@ -4325,7 +4327,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
 }, {
     toggleShowNavigationBelowLogo(): void;
     handleSelectViewport(viewport: ViewportsType): void;
-    findSelectedViewport(): string;
+    findSelectedViewport(): any;
     handleHeaderDisplayStyleChange(displayStyle: HeaderDisplayStyle): void;
     handleHeaderNavigationDisplayTypeChange(displayType: NavigationDisplayType): void;
     handleHeaderNavigationStyleOptionValueChange({ option, value, }: NavigationStyleOptionValueChangeEvent): void;

package/lib/src/shared/publish-brand-page-with-state/PublishBrandPageModalWithState.mixin.d.ts

@@ -424,10 +424,10 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         abbreviation: string;
     };
     isSearchDomainListModalVisible: boolean;
-    customDomainCardDescription: string;
-    customDomainLabel: string;
-    searchButtonLabel: string;
-    recommendedLabel: string;
+    customDomainCardDescription: any;
+    customDomainLabel: any;
+    searchButtonLabel: any;
+    recommendedLabel: any;
 }, {
     brandPageUrl(): string;
     getBusinessName(): string | undefined;

package/lib/src/shared/shape-library/ShapeLibrary.mixin.d.ts

@@ -58,7 +58,7 @@ declare const _default: import("vue").DefineComponent<{}, {
     currentPageSize: number;
     totalPageSize: number;
     selectedTabName: string;
-    tabs: string[];
+    tabs: any[];
     shapeLibrary: ShapeSearchResponseModel;
     debounceOnSearch: DebounceHandle | undefined;
 }, {