@designcrowd/library.brand-page 5.19.0 → 5.19.1-error-html2canvas-2

package/src/shared/content-settings/components/content-settings/i18n/content-settings.es-ES.json

@@ -113,6 +113,8 @@
     "iconFillColorTitle": "Color de relleno del icono",
     "iconBackgroundColorTitle": "Color de fondo del icono",
     "paddingTitle": "Relleno",
+    "topPaddingTitle": "Relleno superior",
+    "bottomPaddingTitle": "Relleno inferior",
     "dividerStyleTitle": "Estilo del divisor",
     "dividerColorTitle": "Color del separador",
     "addItemTitle": "Añadir artículo",

package/src/shared/content-settings/components/content-settings/i18n/content-settings.fr-CA.json

@@ -113,6 +113,8 @@
     "iconFillColorTitle": "Couleur de remplissage de l’icône",
     "iconBackgroundColorTitle": "Couleur d’arrière-plan de l’icône",
     "paddingTitle": "Marges intérieures",
+    "topPaddingTitle": "Marge intérieure supérieure",
+    "bottomPaddingTitle": "Marges intérieures inférieures",
     "dividerStyleTitle": "Style de séparateur",
     "dividerColorTitle": "Couleur du séparateur",
     "addItemTitle": "Ajouter un article",

package/src/shared/content-settings/components/content-settings/i18n/content-settings.fr-FR.json

@@ -113,6 +113,8 @@
     "iconFillColorTitle": "Couleur de remplissage de l’icône",
     "iconBackgroundColorTitle": "Couleur d’arrière-plan de l’icône",
     "paddingTitle": "Marges intérieures",
+    "topPaddingTitle": "Marges intérieures supérieures",
+    "bottomPaddingTitle": "Marges intérieures inférieures",
     "dividerStyleTitle": "Style de séparateur",
     "dividerColorTitle": "Couleur du séparateur",
     "addItemTitle": "Ajouter un article",

package/src/shared/content-settings/components/content-settings/i18n/content-settings.json

@@ -113,6 +113,8 @@
     "iconFillColorTitle": "Icon fill color",
     "iconBackgroundColorTitle": "Icon background color",
     "paddingTitle": "Padding",
+    "topPaddingTitle": "Top padding",
+    "bottomPaddingTitle": "Bottom padding",
     "dividerStyleTitle": "Divider Style",
     "dividerColorTitle": "Divider color",
     "addItemTitle": "Add Item",

package/src/shared/content-settings/components/content-settings/i18n/content-settings.pt-BR.json

@@ -113,6 +113,8 @@
     "iconFillColorTitle": "Cor de preenchimento do ícone",
     "iconBackgroundColorTitle": "Cor de fundo do ícone",
     "paddingTitle": "Preenchimento",
+    "topPaddingTitle": "Preenchimento superior",
+    "bottomPaddingTitle": "Preenchimento inferior",
     "dividerStyleTitle": "Estilo do separador",
     "dividerColorTitle": "Cor do separador",
     "addItemTitle": "Adicionar item",

package/src/shared/content-settings/components/content-settings/i18n/content-settings.pt-PT.json

@@ -113,6 +113,8 @@
     "iconFillColorTitle": "Cor de preenchimento do ícone",
     "iconBackgroundColorTitle": "Cor de fundo do ícone",
     "paddingTitle": "Preenchimento",
+    "topPaddingTitle": "Preenchimento superior",
+    "bottomPaddingTitle": "Preenchimento inferior",
     "dividerStyleTitle": "Estilo do separador",
     "dividerColorTitle": "Cor do separador",
     "addItemTitle": "Adicionar Item",

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

@@ -49,6 +49,11 @@ export default defineComponent({
       required: true,
     },
   },
+  emits: [
+    'on-delete',
+    'capture-snapshot-before-modal',
+    'capture-preview-snapshot',
+  ],
   setup() {
     const contentSettingsStore = useUiContentSettingsStore();
     const sideBarStore = useUiSideBarStore();

package/src/shared/content-settings/components/content-settings-item/ContentSettingsItem.vue

@@ -56,7 +56,7 @@
     >
       <li
         v-for="(field, index) in fields"
-        :key="`content-settings-item-field-${id}-${index}`"
+        :key="`content-settings-item-field-${id}-${field.name}`"
         class="tw-cursor-pointer"
         :class="{
           'tw-mb-3': index !== fields.length - 1,

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

@@ -16,7 +16,6 @@ import { SIDE_BAR_TAB_NAMES } from '@brand-page-maker/constants';
 import { ITEM_FIELD_TYPES, type ItemFieldType } from '@brand-page-maker/models';
 import { useUiPageSettingsStore } from '../../../page-settings/store';
 import { PAGE_SECTIONS } from '../../../page-settings/models';
-import { commonTr } from '@src/composables/useTranslate';
 import {
   getPlainTextFromRTE,
   replaceTextInRTE,
@@ -26,19 +25,6 @@ import {
 import { isDefaultContentText } from '@shared/content-settings/utils';
 import { useUiLogoSettingsStore } from '../../../logo-settings/store';
 
-const RTE_DISALLOWED_STYLE_FIELD_NAMES = [
-  'descriptionStyle',
-  'titleStyle',
-  'textStyle',
-  'paragraphStyle',
-];
-const AI_ALLOWED_SECTION_TYPES = [
-  'banner-section',
-  'text',
-  'about-section',
-  'testimonials-section',
-];
-const AI_ALLOWED_FIELD_NAMES = ['description', 'title', 'text', 'paragraph'];
 const RTE_DISALLOWED_FIELD_NAMES = ['buttonText'];
 
 export default defineComponent({
@@ -62,6 +48,7 @@ export default defineComponent({
       default: undefined,
     },
   },
+  emits: ['capture-preview-snapshot'],
   setup() {
     const contentSettingsStore = useUiContentSettingsStore();
     const brandPageMakerStore = useBrandPageMakerStore();

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

@@ -25,20 +25,18 @@ import {
   type PersonalisationRole,
 } from '@brand-page';
 import { buildRelativePathFromParams } from '@brand-page/utils/route.util';
-import {
-  switchAllContentToRTE,
-  isRTEManagedStyleField,
-} from '@brand-page-maker/utils';
+import { isRTEManagedStyleField } from '@brand-page-maker/utils';
 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'],
   setup() {
     const contentSettingsStore = useUiContentSettingsStore();
     const brandPageMakerStore = useBrandPageMakerStore();
-    const pageSettingsStore = useUiPageSettingsStore();
-    const styleSettingsStore = useUiStyleSettingsStore();
+    const _pageSettingsStore = useUiPageSettingsStore();
+    const _styleSettingsStore = useUiStyleSettingsStore();
 
     const userStore = useBrandPageMakerUserStore();
     const uiStore = useUiStore();

package/src/shared/content-settings/components/focused-content-item-settings/FocusedContentItemSettings.vue

@@ -25,8 +25,8 @@
     >
       <ul>
         <li
-          v-for="(field, fieldIndex) in group.fields"
-          :key="`content-settings-item-group-field-${id}-${group.id}-${fieldIndex}`"
+          v-for="field in group.fields"
+          :key="`content-settings-item-group-field-${id}-${group.id}-${field.name}`"
         >
           <ContentSettingsItemField
             v-if="

package/src/shared/content-settings/components/icon-library/IconLibrary.mixin.ts

@@ -6,6 +6,7 @@ export default defineComponent({
   components: {
     Icon,
   },
+  emits: ['on-select-image'],
   data() {
     return {
       orderedIcons: BRAND_PAGE_ICONS,

package/src/shared/content-settings/components/items-field/ItemsField.mixin.ts

@@ -30,7 +30,7 @@ export default defineComponent({
       default: false,
     },
   },
-  emits: ['items-change', 'items-delete'],
+  emits: ['items-change', 'items-delete', 'itemsEdit'],
   data: () => ({
     itemStates: {} as Record<number, ItemFieldState>,
   }),

package/src/shared/content-settings/components/logo-selection-field/LogoSelectionField.vue

@@ -133,7 +133,7 @@ const onLogoVersionSelected = async (
   const logoDraftAsset = logoStore.getLogoDraftAssetByToken(
     selectedLogoVersion.token,
   );
-  const brandPageMakerStore = useBrandPageMakerStore();
+  const _brandPageMakerStore = useBrandPageMakerStore();
   const uiStore = useUiStore();
   const pageSettingsStore = useUiPageSettingsStore();
 

package/src/shared/content-settings/components/logo-size-field/LogoSizeSliderField.vue

@@ -27,7 +27,7 @@ const props = defineProps<Props>();
 
 const emit = defineEmits(['update:model-value']);
 
-const data = reactive<Data>({
+const _data = reactive<Data>({
   suffix: null,
 });
 

package/src/shared/content-settings/components/page-dropdown-field/PageDropdownField.vue

@@ -71,7 +71,7 @@ const addPageButtonVariant = computed((): string => {
   return canAddPages.value ? 'outline' : 'primary';
 });
 
-const selectedPageName = computed((): string => {
+const _selectedPageName = computed((): string => {
   return selectedPage.value;
 });
 

package/src/shared/content-settings/components/personalisation-role-field/PersonalisationRoleField.vue

@@ -23,12 +23,12 @@
         None
       </DropdownItem>
       <DropdownItem
-        v-for="value of data.dropdownValues"
-        :key="value"
+        v-for="dValue of data.dropdownValues"
+        :key="dValue"
         class="tw-text-black tw-break-all tw-capitalize"
-        @click="onSelectPersonalisationRole(value as PersonalisationRole)"
+        @click="onSelectPersonalisationRole(dValue as PersonalisationRole)"
       >
-        {{ value }}
+        {{ dValue }}
       </DropdownItem>
     </Dropdown>
   </div>

package/src/shared/content-settings/components/slider-field/SliderField.mixin.ts

@@ -45,6 +45,15 @@ export default defineComponent({
       sliderValue: value,
     };
   },
+  watch: {
+    // The value can change outside the slider (e.g. a layout switch
+    // re-applying default padding, or undo) — keep the display in sync.
+    value(newValue: string | undefined) {
+      this.sliderValue = this.valueConvertor
+        ? this.valueConvertor.convert(newValue as any)
+        : newValue;
+    },
+  },
   computed: {
     innerMinLength(): number {
       return this.minLength ?? 0;

package/src/shared/content-settings/components/text-image-field/TextImageField.vue

@@ -278,14 +278,8 @@
   </div>
 </template>
 <script setup lang="ts">
-import { ref, computed, watch, onMounted, type PropType } from 'vue';
-import {
-  Button,
-  TextInput,
-  Icon,
-  ButtonGroup,
-  Toggle,
-} from '@designcrowd/fe-shared-lib';
+import { ref, computed, watch, onMounted } from 'vue';
+import { Button, TextInput, Icon, Toggle } from '@designcrowd/fe-shared-lib';
 import ImageField from '../image-field/ImageField.vue';
 import ItemsField from '../items-field/ItemsField.vue';
 import ColorReplacementsField from '../color-replacements-field/ColorReplacementsField.vue';

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

@@ -19,7 +19,7 @@ import type { UpdateItemValuePayload } from '../../models';
 import cloneDeep from 'lodash.clonedeep';
 import { decodeHtmlEntities, escapeContentText } from '@brand-page/utils';
 import { useSnapshotStore } from '@brand-page-maker/stores';
-import { getPlainTextFromRTE, replaceTextInRTE } from '@brand-page-maker/utils';
+import { getPlainTextFromRTE } from '@brand-page-maker/utils';
 import { isDefaultContentText } from '../../utils';
 
 const DEBOUNCE_IN_MS = 250;

package/src/shared/content-settings/models.ts

@@ -43,8 +43,9 @@ export interface Tab {
   active: boolean;
 }
 
-export interface ContentReplaceImageSettings<TContent>
-  extends ReplaceImageSettingsBase {
+export interface ContentReplaceImageSettings<
+  TContent,
+> extends ReplaceImageSettingsBase {
   setContentMedia: (
     content: TContent,
     value: SetContentMediaPayload,

package/src/shared/content-settings/utils.ts

@@ -1,5 +1,4 @@
 import type { Field, UpdateItemValuePayload } from './models';
-import { ESCAPED_NEWLINE_CHARACTER } from '../../constants/ui';
 import type {
   ContentSettingsConfig,
   ContentSettingsMultiField,

package/src/shared/dropzone-image-uploader/components/DropzoneImageUploader.vue

@@ -114,6 +114,7 @@ const props = defineProps({
     type: Function as PropType<() => Promise<DropzoneOptions>>,
     required: true,
   },
+  // eslint-disable-next-line vue/require-default-prop
   accept: {
     type: Function as PropType<
       (file: DropzoneFile, done: (error?: string | Error) => void) => void

package/src/shared/ecommerce-settings/store/cart-store.test.ts

@@ -1,5 +1,5 @@
 import { setActivePinia, createPinia } from 'pinia';
-import { describe, beforeEach, it, expect, vi } from 'vitest';
+import { describe, beforeEach, it, expect } from 'vitest';
 import { useCartStore } from './cart-settings-store';
 import { useShopConfigStore } from './shop-settings-store';
 

package/src/shared/font-family-selector/FontFamilySelector.mixin.ts

@@ -15,6 +15,7 @@ export default defineComponent({
       required: true,
     },
   },
+  emits: ['on-select'],
   data() {
     return {
       fontFamilyCategories: Object.values(FONT_FAMILY_CATEGORIES()),

package/src/shared/image-gallery-style-settings/ImageGalleryStyleSettings.mixin.ts

@@ -14,6 +14,7 @@ export default defineComponent({
       default: undefined,
     },
   },
+  emits: ['gallery-type-selected'],
   methods: {
     onGalleryTypeClick(galleryType: GalleryType) {
       this.$emit('gallery-type-selected', galleryType);

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

@@ -190,7 +190,7 @@ export default defineComponent({
             y1: 0,
             y2: 1,
           },
-          colorStops: newColor.colors.map((c, i) => {
+          colorStops: newColor.colors.map((c, _i) => {
             return {
               color: c.color,
               offset: c.pos / 100,

package/src/shared/logo-settings/components/LogoSettings.mixin.ts

@@ -6,7 +6,6 @@ import {
   useLogoStore,
 } from '@brand-page-maker/stores';
 import { useUiPageSettingsStore } from '@shared/page-settings/store';
-import type { ContentItem } from '@shared/content-settings/models';
 import type { CreateWebsiteByoUploadResult } from '@shared/website-byo-upload/WebsiteByoUploadModels';
 
 export interface Tab {

package/src/shared/logo-settings/components/LogoSettingsHeader.mixin.ts

@@ -2,6 +2,7 @@ import { defineComponent } from 'vue';
 import { useUiLogoSettingsStore } from '../store';
 
 export default defineComponent({
+  emits: ['on-back'],
   setup() {
     const logoSettingsStore = useUiLogoSettingsStore();
 

package/src/shared/logo-settings/components/LogoStyleSettingsWithState.vue

@@ -69,14 +69,14 @@ const viewport = computed<ViewportsType>(() => {
   return brandPageMakerStore.viewport;
 });
 
-const logoSliderMin = computed(() => {
+const _logoSliderMin = computed(() => {
   if (viewport.value === VIEWPORTS.mobile) {
     return LOGO_SLIDER_MOBILE_MIN;
   }
   return LOGO_SLIDER_DESKTOP_MIN;
 });
 
-const logoSliderMax = computed(() => {
+const _logoSliderMax = computed(() => {
   if (viewport.value === VIEWPORTS.mobile) {
     return LOGO_SLIDER_MOBILE_MAX;
   }

package/src/shared/logo-settings/components/LogoTemplateSearch.vue

@@ -183,7 +183,7 @@ const onNewLogoSelected = async () => {
   const client = FabricRenderClient.getInstance();
 
   // To handle parallel requests
-  const [_, logoDesignAttributes] = await Promise.all([
+  const [__, logoDesignAttributes] = await Promise.all([
     updateTask(),
     client.getLogoAttributesByLogoTemplateTokenAsync(
       data.selectedTemplate.token,

package/src/shared/logo-settings/store/editable-logo-store.ts

@@ -311,7 +311,7 @@ export const useUiEditableLogoStore = defineStore('uiEditableLogo', {
 
       this.logoEdits.textObjects = [];
 
-      templateMetadata.objects.forEach((o, i) => {
+      templateMetadata.objects.forEach((o, _i) => {
         const matchingDraftObject = draftMetadata?.objects?.find(
           (d) => d.id === o.id,
         );

package/src/shared/logo-settings/store/logo-settings-store.test.ts

@@ -2,7 +2,7 @@ import type Vue from 'vue';
 import { createApp } from 'vue';
 import { createRouter, createMemoryHistory } from 'vue-router';
 import { createPinia, setActivePinia } from 'pinia';
-import type { LogoContent, NavRoute, TextContent } from '@brand-page';
+import type { LogoContent, TextContent } from '@brand-page';
 import type { ContentItem } from '../../content-settings/models';
 import { useBrandPageMakerStore } from '@brand-page-maker/stores';
 import { INITIALISE_PAYLOAD } from '@brand-page-maker/components/brand-page-maker/__fixtures__';
@@ -15,7 +15,7 @@ import { setLocaleAsync } from '@src/composables/useTranslate';
 
 const FABRIC_RENDER_BASE_URL = 'https://localhost:6006';
 
-const LOGO_VERSION_ONE_URL =
+const _LOGO_VERSION_ONE_URL =
   'https://localhost:6006/asset/logodraft/brand-page/00000000-0000-0000-0000-000000000000?v=637979483674400000&outputFormat=png&dimensionsType=preview_image_transparent_no_buffer';
 
 const LOGO_VERSION_TWO_URL =
@@ -53,7 +53,7 @@ const PAGE_TWO = createPage(2);
 const PAGE_THREE = createPage(3);
 
 describe('logo store module', () => {
-  let app: Vue.App;
+  let _app: Vue.App;
 
   beforeAll(async () => {
     FabricRenderClient.setInstance({ baseUrl: FABRIC_RENDER_BASE_URL });
@@ -64,7 +64,7 @@ describe('logo store module', () => {
 
     await setLocaleAsync('en-US');
 
-    app = createApp({
+    _app = createApp({
       pinia,
       router: createRouter({ history: createMemoryHistory(), routes: [] }),
     });

package/src/shared/logo-versions/LogoVersions.mixin.ts

@@ -16,6 +16,7 @@ export default defineComponent({
       required: true,
     },
   },
+  emits: ['on-select-logo'],
   setup() {
     const uiStore = useUiStore();
 

package/src/shared/models.ts

@@ -19,6 +19,12 @@ export interface UIRootState {
   thirdPartySettings: UIRootStateThirdPartySettings;
   personalisationData: UserPersonalisationContent[] | undefined;
   isPersonalisationEnabled: boolean;
+  // Pre-purchase AI content key used to personalise AI template previews when
+  // there is no post-purchase personalisationData (bp-5742).
+  userPromptContentKey: string | undefined;
+  // Controls visibility of the dedicated AI templates tab. Decoupled from personalisationData
+  // so the slug flow can personalise previews/apply without surfacing the AI tab (bp-5742).
+  showAiTemplatesTab: boolean;
 }
 
 export interface Endpoints {

package/src/shared/my-designs/MyDesigns.mixin.ts

@@ -16,6 +16,7 @@ export default defineComponent({
     TextInput,
     Loader,
   },
+  emits: ['on-select-image'],
   setup() {
     const uiStore = useUiStore();
     const logoSettingsStore = useUiLogoSettingsStore();

package/src/shared/my-uploads/MyMedia.mixin.ts

@@ -25,6 +25,7 @@ export default defineComponent({
       default: null,
     },
   },
+  emits: ['on-delete-image', 'on-select-image'],
   setup() {
     const uiStore = useUiStore();
 

package/src/shared/my-uploads/MyMediaSelectionItem.vue

@@ -29,7 +29,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, defineProps, defineEmits } from 'vue';
+import { ref, onMounted } from 'vue';
 import { Icon, Loader } from '@designcrowd/fe-shared-lib';
 import type { UserMediaClient } from 'src/clients/user-media-client';
 import type { UserMediaItemWithDimensions } from './models';
@@ -72,6 +72,7 @@ async function checkStatusAsync(): Promise<boolean> {
     }
 
     if (status === 'done') {
+      // eslint-disable-next-line vue/require-explicit-emits
       emit('on-media-done', data);
       previewSrc.value = data.thumbnailUrl ?? data.url ?? '';
       isDone.value = true;

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

@@ -54,6 +54,7 @@ export default defineComponent({
       default: undefined,
     },
   },
+  emits: ['on-delete-image', 'on-select-image'],
   setup() {
     const uiStore = useUiStore();
     const userStore = useBrandPageMakerUserStore();

package/src/shared/my-uploads/models.ts

@@ -27,8 +27,7 @@ export interface MediaBaseSelectedPayload {
   type: MediaTypes;
 }
 
-export interface GettyVideoMediaSelectedPayload
-  extends MediaBaseSelectedPayload {
+export interface GettyVideoMediaSelectedPayload extends MediaBaseSelectedPayload {
   assetId: string;
   token: string;
   mimeType: string;

package/src/shared/navigation-style-settings/components/navigation-style-settings/NavigationStyleSettings.mixin.ts

@@ -38,6 +38,7 @@ export default defineComponent({
       required: true,
     },
   },
+  emits: ['option-value-change'],
   data: () => ({
     navigationStyleConfigOptionTitles:
       NAVIGATION_STYLE_CONFIG_OPTION_TITLES() as Record<

package/src/shared/navigation-style-settings/components/navigation-style-settings/NavigationStyleSettings.vue

@@ -116,7 +116,7 @@ import { Toggle } from '@designcrowd/fe-shared-lib';
 import NavigationStyleSettingsMixin from './NavigationStyleSettings.mixin.ts';
 import ColorField from '../../../content-settings/components/color-field/ColorField.vue';
 import TextStyleField from '../../../content-settings/components/text-style-field/TextStyleField.vue';
-import { tr, commonTr } from '@src/composables/useTranslate';
+import { commonTr } from '@src/composables/useTranslate';
 
 export default {
   components: {

package/src/shared/page-settings/components/new-page-modal/NewPageModal.mixin.ts

@@ -3,9 +3,6 @@ import { getPageTitleError } from '../../utils';
 import { useUiPageSettingsStore } from '../../store';
 import { useEventTracker } from '@brand-page-maker/composables/useEventTracker';
 import { usePageNavigationStore } from '../../../page-navigation/store/page-navigation-store';
-import type { NavRoute } from '@brand-page';
-import { v4 as uuid } from 'uuid';
-import { getPageSlugFromPageTitle } from '@src/lib';
 
 export default defineComponent({
   setup() {

package/src/shared/page-settings/components/page-settings/NestedDraggable.vue

@@ -256,7 +256,7 @@ function canMoveToPosition(
   sourceParentRouteId: string | null,
   draggedRouteId: string | undefined,
   draggedHasSubPages: boolean,
-  futureIndex: number | undefined,
+  _futureIndex: number | undefined,
 ): boolean {
   // Rule 1: Pages with sub-pages cannot become sub-pages themselves
   if (targetParentRouteId && draggedHasSubPages) {

package/src/shared/page-settings/components/page-settings/PageSettings.vue

@@ -115,7 +115,6 @@ import SideBarSettingsHeader from '../../../common/SideBarSettingsHeader.vue';
 import PageSettingsMixin from './PageSettings.mixin.ts';
 import SideBarSectionTitle from '../../../common/SideBarSectionTitle.vue';
 import DeletePageModal from '../delete-page-modal/DeletePageModal.vue';
-import PageElement from './PageElement.vue';
 import PageSettingsSectionStyles from '../page-settings-section-styles/PageSettingsSectionStyles.vue';
 import NestedDraggable from './NestedDraggable.vue';
 import { useBrandPageContainerStore } from '@brand-page-maker/stores';
@@ -133,7 +132,7 @@ export default {
     PageSettingsSectionStyles,
   },
   mixins: [PageSettingsMixin],
-  setup(props, context) {
+  setup(_props, _context) {
     const brandPageContainerStore = useBrandPageContainerStore();
 
     return {

package/src/shared/page-settings/components/page-settings-section-styles/HeaderDisplayStyle.vue

@@ -72,7 +72,7 @@ const options = computed(() => {
     }
   }
 
-  const filteredOptions = filteredConfigs.reduce((arr, config, index) => {
+  const filteredOptions = filteredConfigs.reduce((arr, config, _index) => {
     config.option.isSelected = props.displayStyle === config.option.value;
 
     arr.push(config.option);

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

@@ -575,7 +575,7 @@ export default defineComponent({
 
     async onLogoVersionSelected(selectedLogoVersion: DisplayLogoDraftAsset) {
       const uiStore = useUiStore();
-      const brandPageMakerStore = useBrandPageMakerStore();
+      const _brandPageMakerStore = useBrandPageMakerStore();
 
       this.logoDraftToken = selectedLogoVersion.token;