@designcrowd/library.brand-page 5.16.48 → 5.16.49

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

@@ -196,7 +196,7 @@
               buttonText: options[option.index].buttonText ?? false,
               buttonLinkType: options[option.index].buttonLinkType || 'url',
               url: options[option.index].url || '',
-              pageSlug: options[option.index].pageSlug || '',
+              buttonPageId: options[option.index].buttonPageId || '',
             }"
             :title-length="titleLength"
             :description-length="descriptionLength"
@@ -291,7 +291,7 @@ import ItemsField from '../items-field/ItemsField.vue';
 import ColorReplacementsField from '../color-replacements-field/ColorReplacementsField.vue';
 import TextareaField from '../../../content-settings/components/textarea-field/TextareaField.vue';
 import ButtonConfigurationField from '../button-configuration-field/ButtonConfigurationField.vue';
-import { textImageFieldTr } from '../../../../composables/useTranslate';
+import { textImageFieldTr } from '@src/composables/useTranslate';
 import PersonalisationOverrideField from '../personalisation-override-field/PersonalisationOverrideField.vue';
 import type {
   ColorReplacement,
@@ -300,7 +300,7 @@ import type {
   TextShapeItem,
   Content,
   ImagesSectionContent,
-} from '../../../../brand-page';
+} from '@brand-page';
 import {
   MAX_DESCRIPTION_LENGTH,
   MAX_LENGTH_ERROR_MESSAGE,
@@ -311,7 +311,7 @@ import {
   ALIGN_RIGHT_ALIGNED,
   CONTENT_TYPES,
   MAX_IMAGES_SECTION_ALIGNMENT_ITEMS_LENGTH,
-} from '../../../../brand-page';
+} from '@brand-page';
 import type { DebounceHandle } from 'lodash.debounce';
 import debounce from 'lodash.debounce';
 import type { UpdateItemValuePayload } from '../../models';

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

@@ -5,24 +5,21 @@ import type {
   LogoTheme,
   TextItem,
   TextStyleDeclaration,
-} from '../../../../brand-page/models';
+} from '@brand-page/models';
 import {
   FONT_SIZE_BODY,
   MAX_LENGTH_ERROR_MESSAGE,
   MAX_TEXT_LENGTH,
   TEXT_EMPTY,
   TEXT_STYLE_TYPES,
-} from '../../../../brand-page';
+} from '@brand-page';
 import type { DebounceHandle } from 'lodash.debounce';
 import debounce from 'lodash.debounce';
 import type { UpdateItemValuePayload } from '../../models';
 import cloneDeep from 'lodash.clonedeep';
-import { escapeContentText } from '../../../../brand-page/utils';
-import { useSnapshotStore } from '../../../../brand-page-maker/stores';
-import {
-  getPlainTextFromRTE,
-  replaceTextInRTE,
-} from '../../../../brand-page-maker/utils';
+import { escapeContentText } from '@brand-page/utils';
+import { useSnapshotStore } from '@brand-page-maker/stores';
+import { getPlainTextFromRTE, replaceTextInRTE } from '@brand-page-maker/utils';
 import { isDefaultContentText } from '../../utils';
 
 const DEBOUNCE_IN_MS = 250;

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

@@ -92,12 +92,9 @@ import ItemsField from '../items-field/ItemsField.vue';
 import TextareaField from '../../../content-settings/components/textarea-field/TextareaField.vue';
 import TextStyleField from '../../../content-settings/components/text-style-field/TextStyleField.vue';
 import GenerateAiButton from '../generate-ai-button/GenerateAiButton.vue';
-import {
-  commonTr,
-  textItemsFieldTr,
-} from '../../../../composables/useTranslate';
+import { commonTr, textItemsFieldTr } from '@src/composables/useTranslate';
 import PersonalisationOverrideField from '../../../content-settings/components/personalisation-override-field/PersonalisationOverrideField.vue';
-import { getCtaLocationFromFieldType } from '../../../../brand-page-maker/utils/mixpanel.util';
+import { getCtaLocationFromFieldType } from '@brand-page-maker/utils/mixpanel.util';
 
 export default {
   components: {

package/src/shared/content-settings/components/text-style-field/TextStyleField.mixin.ts

@@ -11,15 +11,15 @@ import {
   textSizeValueConvertor,
   letterSpacingValueConvertor,
   lineHeightValueConvertor,
-} from '../../../../brand-page-maker/convertors';
+} from '@brand-page-maker/convertors';
 import type { StyleTextFontFamilyOption } from '../../../style-settings/models';
-import type { ButtonGroupOption } from '../../../../brand-page-maker/models/button-group.model';
+import type { ButtonGroupOption } from '@brand-page-maker/models/button-group.model';
 import { useUiStyleSettingsStore } from '../../../style-settings/store';
 import type {
   LogoTheme,
   TextStyleDeclaration,
   TextStyleType,
-} from '../../../../brand-page';
+} from '@brand-page';
 import {
   FONT_FAMILY_CONFIGS,
   MIN_TEXT_SIZE_PX,
@@ -30,7 +30,7 @@ import {
   MAX_LINE_HEIGHT,
   TEXT_STYLE_TYPES,
   TEXT_STYLE_TYPES_DISPLAY_NAME_MAP,
-} from '../../../../brand-page';
+} from '@brand-page';
 
 const TEXT_SIZE_CHANGE_DEBOUNCE_WAIT_IN_MS = 5;
 

package/src/shared/content-settings/components/text-style-field/TextStyleField.vue

@@ -159,7 +159,7 @@
 </template>
 
 <script>
-import FontFamilySelector from '../../../../shared/font-family-selector/FontFamilySelector.vue';
+import FontFamilySelector from '@shared/font-family-selector/FontFamilySelector.vue';
 import TextStyleFieldMixin from './TextStyleField.mixin.ts';
 import {
   ButtonGroup,
@@ -169,7 +169,7 @@ import {
   DropdownItem,
 } from '@designcrowd/fe-shared-lib';
 import ColorField from '../color-field/ColorField.vue';
-import { textStyleFieldTr } from '../../../../composables/useTranslate';
+import { textStyleFieldTr } from '@src/composables/useTranslate';
 
 export default {
   components: {

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

@@ -1,6 +1,6 @@
 import { defineComponent, type PropType } from 'vue';
 import GenericTextInputMixin from '../GenericTextInput.mixin';
-import type { TextItem } from '../../../../brand-page';
+import type { TextItem } from '@brand-page';
 
 export default defineComponent({
   mixins: [GenericTextInputMixin],

package/src/shared/content-settings/components/textarea-field/TextareaField.vue

@@ -52,8 +52,8 @@
 </template>
 <script>
 import TextareaFieldMixin from './TextareaField.mixin.ts';
-import RichTextEditor from '../../../../brand-page-maker/components/rich-text-editor/RichTextEditor.vue';
-import { textAreaFieldTr } from '../../../../composables/useTranslate';
+import RichTextEditor from '@brand-page-maker/components/rich-text-editor/RichTextEditor.vue';
+import { textAreaFieldTr } from '@src/composables/useTranslate';
 
 export default {
   components: {

package/src/shared/content-settings/components/toggle-field/ToggleField.mixin.ts

@@ -1,6 +1,6 @@
 import { defineComponent } from 'vue';
 import type { PropType } from 'vue';
-import type { ValueConvertor } from '../../../../brand-page-maker/models';
+import type { ValueConvertor } from '@brand-page-maker/models';
 import type { UpdateItemValuePayload } from '../../models';
 
 export default defineComponent({

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

@@ -1,7 +1,7 @@
 import { defineComponent } from 'vue';
 import GenericTextInputMixin from '../GenericTextInput.mixin';
-import { YOUTUBE_URL_RE } from '../../../../brand-page-maker/utils';
-import { YOUTUBE_EMBED_URL_PREFIX } from '../../../../brand-page-maker/constants';
+import { YOUTUBE_URL_RE } from '@brand-page-maker/utils';
+import { YOUTUBE_EMBED_URL_PREFIX } from '@brand-page-maker/constants';
 
 export default defineComponent({
   mixins: [GenericTextInputMixin],

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

@@ -3,15 +3,15 @@ import type {
   ColorReplacement,
   ContentType,
   BrandPageType,
-} from '../../brand-page';
+} from '@brand-page';
 import type {
   ContentSettingsDisplayMode,
   ContentSettingsField,
   ContentSettingsFieldGroup,
   ContentSettingsMultiField,
   ValidateResult,
-} from '../../brand-page-maker/models';
-import type { UserState } from '../../brand-page-maker/stores';
+} from '@brand-page-maker/models';
+import type { UserState } from '@brand-page-maker/stores';
 import type { MediaBaseSelectedPayload } from '../my-uploads/models';
 
 export interface ContentItemFieldSettings {

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

@@ -11,16 +11,12 @@ import type {
   UpdateMultipleItemValuesPayload,
   ValidateItemPayload,
 } from '../models';
-import type {
-  ColorReplacement,
-  Content,
-  ContentType,
-} from '../../../brand-page';
+import type { ColorReplacement, Content, ContentType } from '@brand-page';
 
 import {
   CONTENT_SETTINGS_CONFIGS,
   SIDE_BAR_TAB_NAMES,
-} from '../../../brand-page-maker/constants';
+} from '@brand-page-maker/constants';
 import { RESERVED_FIELD_NAMES } from '../constants';
 import type { UIEventSource } from '../../models';
 import { UI_EVENT_SOURCES } from '../../models';
@@ -28,18 +24,18 @@ import type {
   ContentSettingsConfig,
   ItemCategory,
   Validator,
-} from '../../../brand-page-maker/models';
+} from '@brand-page-maker/models';
 import {
   CONTENT_SETTINGS_DISPLAY_MODES,
   ITEM_CATEGORIES,
   ITEM_CATEGORY_NAMES,
-} from '../../../brand-page-maker/models';
+} from '@brand-page-maker/models';
 import {
   useUiStore,
   useBrandPageMakerUserStore,
   useBrandPageMakerStore,
   useVideoStore,
-} from '../../../brand-page-maker/stores';
+} from '@brand-page-maker/stores';
 import { useUiSideBarStore } from '../../side-bar/store';
 import {
   createDefaultContentItemGroupState,
@@ -49,14 +45,14 @@ import {
   adminValidatorsDict,
   dummyValidator,
   validatorDict,
-} from '../../../brand-page-maker/validators';
+} from '@brand-page-maker/validators';
 import { vueDeepMerge } from '../../../helpers/vue.helper';
 
 import type {
   GettyVideoMediaSelectedPayload,
   MediaBaseSelectedPayload,
 } from '../../my-uploads/models';
-import {} from '../../../brand-page-maker/stores/video';
+import {} from '@brand-page-maker/stores/video';
 
 const DEFAULT_TEXT_COLOR_DEPENDENT_TYPES: readonly ContentType[] = [
   'profile',

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

@@ -3,10 +3,10 @@ import { ESCAPED_NEWLINE_CHARACTER } from '../../constants/ui';
 import type {
   ContentSettingsConfig,
   ContentSettingsMultiField,
-} from '../../brand-page-maker/models';
-import { CONTENT_SETTINGS_CONFIGS } from '../../brand-page-maker/constants';
-import type { Content, ContentType } from '../../brand-page';
-import { contentSettingsTr } from '../../composables/useTranslate';
+} from '@brand-page-maker/models';
+import { CONTENT_SETTINGS_CONFIGS } from '@brand-page-maker/constants';
+import type { Content, ContentType } from '@brand-page';
+import { contentSettingsTr } from '@src/composables/useTranslate';
 
 export function isUpdateItemValuePayload<T>(
   payload: UpdateItemValuePayload<T>,

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

@@ -105,7 +105,7 @@ import Dropzone, {
   type DropzoneFile,
   type DropzoneOptions,
 } from 'dropzone-vue3';
-import { dropzoneUploaderTr } from '../../../composables/useTranslate';
+import { dropzoneUploaderTr } from '@src/composables/useTranslate';
 
 Dropzone.autoDiscover = false;
 

package/src/shared/ecommerce-settings/components/product-config-field/ProductConfigOption.vue

@@ -53,16 +53,16 @@
 <script setup lang="ts">
 import { Button, Icon } from '@designcrowd/fe-shared-lib';
 import ItemsField from '../../../content-settings/components/items-field/ItemsField.vue';
-import type { PaymentOption } from '../../../../brand-page/models';
+import type { PaymentOption } from '@brand-page/models';
 import { useShopConfigStore } from '../../store/shop-settings-store';
-import type { ProductModel } from '../../../../brand-page/models/shop.model';
+import type { ProductModel } from '@brand-page/models/shop.model';
 import { computed, reactive } from 'vue';
 import type { DebounceHandle } from 'lodash.debounce';
 import cloneDeep from 'lodash.clonedeep';
-import type { UpdateItemValuePayload } from '../../../../shared/content-settings/models';
-import { useProductConfigStore } from '../../../../brand-page-maker/stores/product-config/product-config-store';
-import ProductConfigModal from '../../../../brand-page-maker/components/shop/ProductConfigModal.vue';
-import { productConfigOptionTr } from '../../../../composables/useTranslate';
+import type { UpdateItemValuePayload } from '@shared/content-settings/models';
+import { useProductConfigStore } from '@brand-page-maker/stores/product-config/product-config-store';
+import ProductConfigModal from '@brand-page-maker/components/shop/ProductConfigModal.vue';
+import { productConfigOptionTr } from '@src/composables/useTranslate';
 
 const props = withDefaults(
   defineProps<{

package/src/shared/ecommerce-settings/components/shop-payment-config-field/ShopPaymentConfigField.vue

@@ -13,7 +13,7 @@
 import type { PropType } from 'vue';
 import { defineProps, defineEmits } from 'vue';
 import PaymentConfigField from '../../../content-settings/components/payment-config-field/PaymentConfigField.vue';
-import type { ShopContentConfig, PaymentConfig } from '../../../../brand-page';
+import type { ShopContentConfig, PaymentConfig } from '@brand-page';
 import type { UpdateItemValuePayload } from '../../../content-settings/models';
 
 defineProps({

package/src/shared/ecommerce-settings/store/shop-settings-store.ts

@@ -5,12 +5,12 @@ import type {
   VariantOptionModel,
   SkuModel,
   SkuVariantModel,
-} from '../../../brand-page/models/shop.model';
+} from '@brand-page/models/shop.model';
 import { generateSku } from '../util/skuUtils';
 import { v4 as uuid } from 'uuid';
 import type { BrandPagePaymentConfig } from 'src/brand-page';
-import type { PageModel, ShopContent } from '../../../brand-page/models/index';
-import { isShopContent } from '../../../brand-page/utils';
+import type { PageModel, ShopContent } from '@brand-page/models/index';
+import { isShopContent } from '@brand-page/utils';
 
 export interface ShopConfigState {
   paymentConfig: BrandPagePaymentConfig | undefined;

package/src/shared/ecommerce-settings/util/skuUtils.ts

@@ -1,4 +1,4 @@
-import type { VariantOptionModel } from '../../../brand-page/models/shop.model';
+import type { VariantOptionModel } from '@brand-page/models/shop.model';
 
 export function generateSku(
   productName: string,

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

@@ -1,7 +1,7 @@
 import { defineComponent } from 'vue';
 import type { PropType } from 'vue';
-import type { FontFamilyCategory, FontFamilyName } from '../../brand-page';
-import { FONT_FAMILY_CATEGORIES, FONT_FAMILY_CONFIGS } from '../../brand-page';
+import type { FontFamilyCategory, FontFamilyName } from '@brand-page';
+import { FONT_FAMILY_CATEGORIES, FONT_FAMILY_CONFIGS } from '@brand-page';
 import type { StyleTextFontFamilyOption } from '../style-settings/models';
 
 export default defineComponent({

package/src/shared/font-preview/FontPreview.vue

@@ -8,7 +8,7 @@
   </div>
 </template>
 <script>
-import { FONT_FAMILY_KEYS } from '../../brand-page/constants/index.ts';
+import { FONT_FAMILY_KEYS } from '@brand-page/constants/index.ts';
 import FontAnton from './previews/font-anton.vue';
 import FontAntonSc from './previews/font-antonsc.vue';
 import FontArsenal from './previews/font-arsenal.vue';

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

@@ -1,6 +1,6 @@
 import { defineComponent } from 'vue';
 import type { PropType } from 'vue';
-import type { GalleryStyles, GalleryType } from '../../brand-page';
+import type { GalleryStyles, GalleryType } from '@brand-page';
 
 export default defineComponent({
   props: {

package/src/shared/login-required-message/LoginRequiredMessage.vue

@@ -7,7 +7,7 @@
   </div>
 </template>
 <script setup lang="ts">
-import { loginMessageTr } from '../../composables/useTranslate';
+import { loginMessageTr } from '@src/composables/useTranslate';
 
 const handleLogin = () => {
   window.dispatchEvent(new Event('ON_LOGIN_REQUESTED'));

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

@@ -4,17 +4,17 @@ import {
   type GradientObject,
 } from '../store/editable-logo-store';
 import debounce from 'lodash.debounce';
-import type { BpColorPickerGradient } from '../../../brand-page-maker/components/color-picker/BpColorPickerV2.mixin';
-import { GRADIENT_COLOR_TYPE } from '../../../brand-page-maker/components/color-picker/components/GradientTypeSelector.mixin';
+import type { BpColorPickerGradient } from '@brand-page-maker/components/color-picker/BpColorPickerV2.mixin';
+import { GRADIENT_COLOR_TYPE } from '@brand-page-maker/components/color-picker/components/GradientTypeSelector.mixin';
 import { useUiLogoSettingsStore } from '../store/logo-settings-store';
-import { useUiStore } from '../../../brand-page-maker/stores';
+import { useUiStore } from '@brand-page-maker/stores';
 import { useUiTemplateSettingsStore } from '../../template-settings/store';
-import { editLogoSettingsTr } from '../../../composables/useTranslate';
+import { editLogoSettingsTr } from '@src/composables/useTranslate';
 import {
   EVENTS,
   SELECT_LOCATIONS,
   useEventTracker,
-} from '../../../brand-page-maker/composables/useEventTracker';
+} from '@brand-page-maker/composables/useEventTracker';
 
 export default defineComponent({
   setup() {

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

@@ -212,7 +212,7 @@ import {
 import EditLogoSettingsMixin from './EditLogoSettings.mixin.ts';
 import UploadLogoModal from '../../upload-logo-modal/UploadLogoModal.vue';
 import LogoSettingsHeader from './LogoSettingsHeader.vue';
-import { editLogoSettingsTr } from '../../../composables/useTranslate';
+import { editLogoSettingsTr } from '@src/composables/useTranslate';
 import LogoTemplateSearch from './LogoTemplateSearch.vue';
 
 export default {

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

@@ -4,10 +4,10 @@ import {
   useBrandPageContainerStore,
   useBrandPageMakerStore,
   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';
+} 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 {
   id: 'VARIATIONS' | 'VERSIONS';

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

@@ -5,7 +5,7 @@
   </div>
 </template>
 <script>
-import WebsiteByoUpload from '../../../shared/website-byo-upload/WebsiteByoUpload.vue';
+import WebsiteByoUpload from '@shared/website-byo-upload/WebsiteByoUpload.vue';
 import LogoSettingsMixin from './LogoSettings.mixin.ts';
 import EditLogoSettings from './EditLogoSettings.vue';
 

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

@@ -44,18 +44,18 @@ import type {
   PageHeaderDesktop,
   PageHeaderMobile,
   ViewportsType,
-} from '../../../brand-page';
+} from '@brand-page';
 import { computed } from 'vue';
 import {
   LOGO_SLIDER_DESKTOP_MIN,
   LOGO_SLIDER_DESKTOP_MAX,
   LOGO_SLIDER_MOBILE_MIN,
   LOGO_SLIDER_MOBILE_MAX,
-} from '../../../brand-page';
+} from '@brand-page';
 import { useUiContentSettingsStore } from '../../content-settings/store';
-import { useBrandPageMakerStore } from '../../../brand-page-maker/stores';
+import { useBrandPageMakerStore } from '@brand-page-maker/stores';
 import { useUiPageSettingsStore } from '../../page-settings/store';
-import { VIEWPORTS } from '../../../brand-page';
+import { VIEWPORTS } from '@brand-page';
 import { PAGE_SECTIONS } from '../../page-settings/models';
 import type { ContentItem } from '../../content-settings/models';
 

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

@@ -79,7 +79,7 @@ import LogoSwitchConfirmationModal from './logo-switch-confirmation-modal/LogoSw
 import brandPageClient from '../../../clients/brand-page-client';
 import { FabricRenderClient } from '../../../clients/fabric-render-client';
 import type { LogoTemplate } from '../../../clients/brand-page-client';
-import { useLogoStore } from '../../../brand-page-maker/stores/logo-store';
+import { useLogoStore } from '@brand-page-maker/stores/logo-store';
 import { useUiEditableLogoStore } from '../store/editable-logo-store';
 import { useUiLogoSettingsStore } from '../store/logo-settings-store';
 import { useUiTemplateSettingsStore } from '../../template-settings/store/template-settings-store';
@@ -87,13 +87,13 @@ import { v4 as uuidv4 } from 'uuid';
 import {
   commonTr,
   logoTemplateSearchModalTr,
-} from '../../../composables/useTranslate';
-import { useBrandPageContainerStore } from '../../../brand-page-maker/stores';
+} from '@src/composables/useTranslate';
+import { useBrandPageContainerStore } from '@brand-page-maker/stores';
 import {
   EVENTS,
   SELECT_LOCATIONS,
   useEventTracker,
-} from '../../../brand-page-maker/composables/useEventTracker';
+} from '@brand-page-maker/composables/useEventTracker';
 
 const emit = defineEmits(['on-back']);
 

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

@@ -36,7 +36,7 @@
 </template>
 <script setup lang="ts">
 import { reactive } from 'vue';
-import type { LogoVariation } from '../../../brand-page';
+import type { LogoVariation } from '@brand-page';
 
 defineProps<{
   logoVariationImageUrls: string[];

package/src/shared/logo-settings/components/logo-switch-confirmation-modal/LogoSwitchConfirmationModal.vue

@@ -49,7 +49,7 @@ import { Modal, Button } from '@designcrowd/fe-shared-lib';
 import {
   logoSwitchConfirmationModalTr,
   commonTr,
-} from '../../../../composables/useTranslate';
+} from '@src/composables/useTranslate';
 import { defineEmits } from 'vue';
 
 const emit = defineEmits(['on-continue', 'on-cancel']);

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

@@ -6,16 +6,16 @@ import {
   type ModifyLogoDataRequest,
   type ModifyLogoDataResponse,
 } from '../../../clients/fabric-render-client';
-import { useLogoStore } from '../../../brand-page-maker/stores';
-import { useUiPageSettingsStore } from '../../../shared/page-settings/store';
-import { isLogoContent } from '../../../brand-page/utils';
+import { useLogoStore } from '@brand-page-maker/stores';
+import { useUiPageSettingsStore } from '@shared/page-settings/store';
+import { isLogoContent } from '@brand-page/utils';
 import {
   VIEWPORTS,
   type LogoContent,
   LOGO_VARIATION,
   type FabricLogoTheme,
-} from '../../../brand-page';
-import { PAGE_SECTIONS } from '../../../shared/page-settings/models';
+} from '@brand-page';
+import { PAGE_SECTIONS } from '@shared/page-settings/models';
 
 export interface GradientObject {
   type: string;

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

@@ -2,16 +2,16 @@ import type Vue from 'vue';
 import { createApp } from 'vue';
 import { createRouter, createMemoryHistory } from 'vue-router';
 import { createPinia, setActivePinia } from 'pinia';
-import type { LogoContent, 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__';
+import { useBrandPageMakerStore } from '@brand-page-maker/stores';
+import { INITIALISE_PAYLOAD } from '@brand-page-maker/components/brand-page-maker/__fixtures__';
 import { type SetLogoVariationPayload, useUiLogoSettingsStore } from './index';
 import type { ContentPage } from '../../page-settings/models';
 import { useUiPageSettingsStore } from '../../page-settings/store';
-import { logoUtil } from '../../../brand-page/utils';
+import { logoUtil } from '@brand-page/utils';
 import { FabricRenderClient } from '../../../clients/fabric-render-client';
-import { setLocaleAsync } from '../../../../src/composables/useTranslate';
+import { setLocaleAsync } from '@src/composables/useTranslate';
 
 const FABRIC_RENDER_BASE_URL = 'https://localhost:6006';
 

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

@@ -1,21 +1,14 @@
 import { defineStore } from 'pinia';
-import {
-  EMPTY_LOGO_IMAGE_MODEL,
-  LOGO_VARIATION,
-  VIEWPORTS,
-} from '../../../brand-page';
+import { EMPTY_LOGO_IMAGE_MODEL, LOGO_VARIATION, VIEWPORTS } from '@brand-page';
 import type {
   LogoContent,
   LogoImageModel,
   LogoTemplateImageModel,
   LogoVariation,
-} from '../../../brand-page';
+} from '@brand-page';
 import type { ContentItem } from '../../content-settings/models';
-import { parseLogoThemeToCssStyles } from '../../../brand-page/utils';
-import {
-  useUiStore,
-  useBrandPageMakerStore,
-} from '../../../brand-page-maker/stores';
+import { parseLogoThemeToCssStyles } from '@brand-page/utils';
+import { useUiStore, useBrandPageMakerStore } from '@brand-page-maker/stores';
 import { useUiContentSettingsStore } from '../../content-settings/store';
 import { useUiPageSettingsStore } from '../../page-settings/store';
 import { useUiBackgroundSettingsStore } from '../../background-settings/store';
@@ -28,7 +21,7 @@ import type {
   CreateByoLogoDraftResult,
   LogoDesignAttributesModel,
 } from '../../models';
-import * as logoUtil from '../../../brand-page/utils/logo.util';
+import * as logoUtil from '@brand-page/utils/logo.util';
 
 export interface SetLogoVariationPayload {
   logoImage: LogoImageModel;

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

@@ -2,7 +2,7 @@ import { defineComponent, computed } from 'vue';
 import { Button, TextInput, Loader } from '@designcrowd/fe-shared-lib';
 import * as DesignAssetClient from '../../clients/design-asset-client';
 import type { DisplayLogoDraftAsset } from 'src/clients/models';
-import { useUiStore } from '../../brand-page-maker/stores';
+import { useUiStore } from '@brand-page-maker/stores';
 
 export default defineComponent({
   components: {

package/src/shared/models.ts

@@ -1,4 +1,4 @@
-import type { LogoTheme, UserPersonalisationContent } from '../brand-page';
+import type { LogoTheme, UserPersonalisationContent } from '@brand-page';
 import type { UIUserFeatures } from '../constants/ui';
 
 export interface UIUserState {

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

@@ -6,9 +6,9 @@ import { getInstance as getUserMediaClientInstance } from '../../clients/user-me
 import {
   useBrandPageMakerUserStore,
   useUiStore,
-} from '../../brand-page-maker/stores';
+} from '@brand-page-maker/stores';
 import { useUiLogoSettingsStore } from '../logo-settings/store';
-import { currentLocale } from '../../composables/useTranslate';
+import { currentLocale } from '@src/composables/useTranslate';
 
 export default defineComponent({
   components: {