@designcrowd/library.brand-page 5.16.46 → 5.16.47-alias-1

package/src/brand-page-maker/components/cookie-collection/CookieSettings.vue

@@ -53,10 +53,10 @@
 </template>
 <script setup lang="ts">
 import { Toggle } from '@designcrowd/fe-shared-lib';
-import { cookieSettingTr } from '../../../composables/useTranslate';
-import type { CookieOptions } from '../../../brand-page/models';
+import { cookieSettingTr } from '@src/composables/useTranslate';
+import type { CookieOptions } from '@brand-page/models';
 import { reactive, type PropType } from 'vue';
-import { useBrandPageMakerStore } from '../../stores';
+import { useBrandPageMakerStore } from '@brand-page-maker/stores';
 
 const props = defineProps({
   viewModel: {

package/src/brand-page-maker/components/device/Device.mixin.ts

@@ -1,5 +1,5 @@
 import { defineComponent } from 'vue';
-import { DEVICE_CSS_TRANSITION_DELAY } from '../../constants';
+import { DEVICE_CSS_TRANSITION_DELAY } from '@brand-page-maker/constants';
 
 export default defineComponent({
   props: {

package/src/brand-page-maker/components/device/Device.test.ts

@@ -1,6 +1,6 @@
 import { shallowMount } from '@vue/test-utils';
 import Device from './Device.vue';
-import { BRAND_PAGE_TYPES } from '../../../brand-page';
+import { BRAND_PAGE_TYPES } from '@brand-page';
 
 const getDeviceClasses = (wrapper: any) => {
   return Object.entries((wrapper.vm as any).deviceClasses)

package/src/brand-page-maker/components/google-analytics/GoogleAnalytics.vue

@@ -165,18 +165,18 @@ import {
   commonTr,
   errorTr,
   brandPageSettingsTr,
-} from '../../../composables/useTranslate';
+} from '@src/composables/useTranslate';
 import { computed, reactive, watch } from 'vue';
 import {
   useBrandPageContainerStore,
   useBrandPageMakerStore,
-} from '../../stores';
-import Icon from '../../../../src/brand-page/components/icon/Icon.vue';
+} from '@brand-page-maker/stores';
+import Icon from '@src/brand-page/components/icon/Icon.vue';
 import {
   TRIGGER_TYPE,
   UPGRADE_CTA_LOCATIONS,
   useEventTracker,
-} from '../../../../src/brand-page-maker/composables/useEventTracker';
+} from '@src/brand-page-maker/composables/useEventTracker';
 
 const emit = defineEmits([
   'submit-measurement-id',

package/src/brand-page-maker/components/index.ts

@@ -4,4 +4,4 @@ export { default as UseExistingDomainModal } from './seo-settings/UseExistingDom
 export { default as SensitiveContent } from './sensitive-content/SensitiveContent.vue';
 export { default as SeoPageSettings } from './seo-settings/SeoPageSettings.vue';
 export { default as GoogleAnalytics } from './google-analytics/GoogleAnalytics.vue';
-export { default as PublishBrandPageModalWithState } from '../../shared/publish-brand-page-with-state/PublishBrandPageModalWithState.vue';
+export { default as PublishBrandPageModalWithState } from '@shared/publish-brand-page-with-state/PublishBrandPageModalWithState.vue';

package/src/brand-page-maker/components/layout-switcher/LayoutSwitcher.vue

@@ -49,10 +49,10 @@
 </template>
 <script setup lang="ts">
 import { Icon } from '@designcrowd/fe-shared-lib';
-import type { ViewportsType } from '../../../brand-page';
-import { VIEWPORTS } from '../../../brand-page';
+import type { ViewportsType } from '@brand-page';
+import { VIEWPORTS } from '@brand-page';
 import { computed } from 'vue';
-import { layoutSwitcherTr } from '../../../composables/useTranslate';
+import { layoutSwitcherTr } from '@src/composables/useTranslate';
 import VideoPlayButton from '../video-play/VideoPlayButton.vue';
 
 interface Props {

package/src/brand-page-maker/components/navigation/Navigation.mixin.ts

@@ -1,6 +1,6 @@
 import { defineComponent } from 'vue';
 import { EVENTS } from '../../../constants/brand-page-maker';
-import { navigationTr } from '../../../composables/useTranslate';
+import { navigationTr } from '@src/composables/useTranslate';
 
 export default defineComponent({
   props: {

package/src/brand-page-maker/components/navigation/Navigation.vue

@@ -36,7 +36,7 @@ import { Button } from '@designcrowd/fe-shared-lib';
 import NavigationMixin from './Navigation.mixin.ts';
 import ActionBarNavigation from '../action-bar/ActionBarNavigation.vue';
 import Logo from './Logo.vue';
-import { tr } from '../../../composables/useTranslate.ts';
+import { tr } from '@src/composables/useTranslate.ts';
 
 export default {
   components: {

package/src/brand-page-maker/components/preview/Preview.mixin.ts

@@ -3,16 +3,16 @@ import type { PropType } from 'vue';
 import type { DebounceHandle } from 'lodash.debounce';
 import debounce from 'lodash.debounce';
 import { HelloBar, Loader } from '@designcrowd/fe-shared-lib';
-import type { BrandPageContext, BrandPageViewModel } from '../../../brand-page';
-import { BRAND_PAGE_TYPES, MEDIA_SIZES } from '../../../brand-page';
+import type { BrandPageContext, BrandPageViewModel } from '@brand-page';
+import { BRAND_PAGE_TYPES, MEDIA_SIZES } from '@brand-page';
 import {
   useBrandPageContainerStore,
   useBrandPageMakerStore,
   useRouteStore,
   useVideoStore,
-} from '../../../brand-page-maker/stores';
+} from '@brand-page-maker/stores';
 import BrandPageMakerPage from '../brandpage-maker-page/BrandPageMakerPage.vue';
-import type { UiDeviceMode } from '../../../shared/models';
+import type { UiDeviceMode } from '@shared/models';
 
 const RESIZE_DEBOUNCE_WAIT_MS = 250;
 

package/src/brand-page-maker/components/preview/Preview.stories.ts

@@ -1,7 +1,7 @@
 import type { Component } from 'vue';
 import { createMemoryHistory, createRouter } from 'vue-router';
 import Preview from './Preview.vue';
-import { brandPageData } from '../../../brand-page/__fixtures__/brand-page-sample-data';
+import { brandPageData } from '@brand-page/__fixtures__/brand-page-sample-data';
 import {
   type ContentViewModel,
   type BrandPageViewModel,
@@ -12,14 +12,14 @@ import {
   PageFooterDesktop,
   PageFooterMobile,
   SENSITIVE_CONTENT_TYPES,
-} from '../../../brand-page';
-import { setupStoryPinia } from '../brand-page-maker/__fixtures__/store-fixture';
+} from '@brand-page';
+import { setupStoryPinia } from '../../../brand-page-maker/components/brand-page-maker/__fixtures__/store-fixture';
 import {
   mapToPageFooterViewModel,
   mapToPageHeaderViewModel,
   mapToPageStyleViewModel,
   mapToViewModel,
-} from '../../../brand-page/utils';
+} from '@brand-page/utils';
 
 export default {
   title: 'Components/BrandPageMaker/Preview',
@@ -31,6 +31,7 @@ const pageStyles = new PageStyles();
 const pages = [
   {
     title: '',
+    id: '',
     slug: '',
     isHidden: false,
     contents: brandPageData
@@ -76,6 +77,9 @@ const viewModel: BrandPageViewModel = {
     isSavingEnabled: true,
     hideBranding: false,
   },
+  nav: {
+    navItems: [],
+  },
 };
 
 export const SampleDesktop = (): Component => {

package/src/brand-page-maker/components/preview-with-state/PreviewWithState.vue

@@ -13,8 +13,8 @@ import Preview from '../preview/Preview.vue';
 import {
   useBrandPageContainerStore,
   useBrandPageMakerStore,
-} from '../../stores';
-import { type UiDeviceMode } from '../../../shared/models';
+} from '@brand-page-maker/stores';
+import { type UiDeviceMode } from '@shared/models';
 
 defineProps({
   deviceMode: {

package/src/brand-page-maker/components/quick-link-bar/QuickLinkBar.mixin.ts

@@ -1,7 +1,10 @@
 import { defineComponent } from 'vue';
-import { CUSTOM_DOMAIN_STATUSES } from '../../constants';
-import { useBrandPageContainerStore, useEventManagerStore } from '../../stores';
-import { quickLinkBarTr } from '../../../composables/useTranslate';
+import { CUSTOM_DOMAIN_STATUSES } from '@brand-page-maker/constants';
+import {
+  useBrandPageContainerStore,
+  useEventManagerStore,
+} from '@brand-page-maker/stores';
+import { quickLinkBarTr } from '@src/composables/useTranslate';
 
 export default defineComponent({
   props: {

package/src/brand-page-maker/components/quick-link-bar/QuickLinkBar.vue

@@ -33,7 +33,7 @@
 <script>
 import QuickLinkBarMixin from './QuickLinkBar.mixin.ts';
 import { Button } from '@designcrowd/fe-shared-lib';
-import { quickLinkBarTr } from '../../../composables/useTranslate';
+import { quickLinkBarTr } from '@src/composables/useTranslate';
 
 export default {
   components: {

package/src/brand-page-maker/components/rich-text-editor/RichTextEditor.vue

@@ -461,14 +461,14 @@ import {
 } from '@designcrowd/fe-shared-lib';
 import { EditorContent, BubbleMenu } from '@tiptap/vue-3';
 import { useRichTextEditor } from '../../composables/rich-text-editor/useRichTextEditor';
-import FontFamilySelector from '../../../shared/font-family-selector/FontFamilySelector.vue';
-import ColorField from '../../../shared/content-settings/components/color-field/ColorField.vue';
-import UrlField from '../../../shared/content-settings/components/url-field/UrlField.vue';
-
-import { useUiStyleSettingsStore } from '../../../shared/style-settings/store';
-import { useUiContentSettingsStore } from '../../../shared/content-settings/store';
-import { useUiPageSettingsStore } from '../../../shared/page-settings/store';
-import { URL_REG_EX } from '../../../shared/content-settings/constants';
+import FontFamilySelector from '@shared/font-family-selector/FontFamilySelector.vue';
+import ColorField from '@shared/content-settings/components/color-field/ColorField.vue';
+import UrlField from '@shared/content-settings/components/url-field/UrlField.vue';
+
+import { useUiStyleSettingsStore } from '@shared/style-settings/store';
+import { useUiContentSettingsStore } from '@shared/content-settings/store';
+import { useUiPageSettingsStore } from '@shared/page-settings/store';
+import { URL_REG_EX } from '@shared/content-settings/constants';
 import { v4 as uuidV4 } from 'uuid';
 import {
   MIN_LETTER_SPACING_PERCENT,
@@ -485,20 +485,23 @@ import {
   type HyperlinkType,
   STYLE_THEME_KEYS,
   TEXT_STYLE_TYPES_DISPLAY_NAME_MAP,
-} from '../../../brand-page';
-import { useBrandPageMakerUserStore, useUiStore } from '../../stores';
-import type { ButtonGroupOption } from '../../models/button-group.model';
-import FieldSubHeader from '../../../shared/content-settings/components/field-sub-header/FieldSubHeader.vue';
-import PageDropdownField from '../../../shared/content-settings/components/page-dropdown-field/PageDropdownField.vue';
+} from '@brand-page';
+import {
+  useBrandPageMakerUserStore,
+  useUiStore,
+} from '@brand-page-maker/stores';
+import type { ButtonGroupOption } from '@brand-page-maker/models/button-group.model';
+import FieldSubHeader from '@shared/content-settings/components/field-sub-header/FieldSubHeader.vue';
+import PageDropdownField from '@shared/content-settings/components/page-dropdown-field/PageDropdownField.vue';
 import {
   textStyleFieldTr,
   contentSettingsTr,
-} from '../../../composables/useTranslate';
+} from '@src/composables/useTranslate';
 import {
   backgroundColorConvertor,
   colorConvertor,
-} from '../../../brand-page-maker/convertors';
-import { hasLogoColorVar } from '../../../brand-page-maker/utils';
+} from '@brand-page-maker/convertors';
+import { hasLogoColorVar } from '@brand-page-maker/utils';
 
 interface DropdownInstance {
   hideMenu: () => void;

package/src/brand-page-maker/components/save-contact/SaveContact.vue

@@ -76,8 +76,8 @@ import { Toggle, Tooltip, Icon } from '@designcrowd/fe-shared-lib';
 import {
   useBrandPageMakerStore,
   useBrandPageContainerStore,
-} from '../../stores';
-import { saveContactSettingsTr } from '../../../composables/useTranslate';
+} from '@brand-page-maker/stores';
+import { saveContactSettingsTr } from '@src/composables/useTranslate';
 import { computed, reactive } from 'vue';
 import {
   EVENTS,

package/src/brand-page-maker/components/sensitive-content/SensitiveContent.vue

@@ -96,12 +96,9 @@ import { computed, reactive, nextTick, useTemplateRef } from 'vue';
 import {
   SENSITIVE_CONTENT_TYPES,
   type SensitiveContent,
-} from '../../../brand-page/models/brand-page-context.model';
-import { useBrandPageMakerStore } from '../../stores';
-import {
-  sensitiveSettingTr,
-  commonTr,
-} from '../../../composables/useTranslate';
+} from '@brand-page/models/brand-page-context.model';
+import { useBrandPageMakerStore } from '@brand-page-maker/stores';
+import { sensitiveSettingTr, commonTr } from '@src/composables/useTranslate';
 
 interface Props {
   isMaker: boolean;

package/src/brand-page-maker/components/seo-settings/DeleteDomainModal.vue

@@ -49,7 +49,7 @@
 
 <script setup lang="ts">
 import { Modal, Button } from '@designcrowd/fe-shared-lib';
-import { deleteDomainModalTr } from '../../../composables/useTranslate';
+import { deleteDomainModalTr } from '@src/composables/useTranslate';
 
 defineOptions({ name: 'DeleteDomainModal' });
 

package/src/brand-page-maker/components/seo-settings/SeoPageSettings.mixin.ts

@@ -2,17 +2,17 @@ import { computed, defineComponent } from 'vue';
 import {
   validateBrandPageDescription,
   validateBrandPageTitle,
-} from '../../utils';
+} from '@brand-page-maker/utils';
 import {
   useBrandPageContainerStore,
   useBrandPageMakerStore,
   useLocalisedRouteStore,
-} from '../../stores';
+} from '@brand-page-maker/stores';
 import {
   BRANDPAGE_DESCRIPTION_CHARACTER_LIMIT,
   BRANDPAGE_TITLE_CHARACTER_LIMIT,
-} from '../../constants';
-import { errorTr } from '../../../composables/useTranslate';
+} from '@brand-page-maker/constants';
+import { errorTr } from '@src/composables/useTranslate';
 
 export default defineComponent({
   props: {

package/src/brand-page-maker/components/seo-settings/SeoPageSettings.vue

@@ -106,7 +106,7 @@
 <script>
 import { Button, TextInput, Textarea } from '@designcrowd/fe-shared-lib';
 import SeoPageSettingsMixin from './SeoPageSettings.mixin.ts';
-import { tr, commonTr, seoSettingsTr } from '../../../composables/useTranslate';
+import { tr, commonTr, seoSettingsTr } from '@src/composables/useTranslate';
 
 export default {
   components: {

package/src/brand-page-maker/components/seo-settings/UrlSettings.mixin.ts

@@ -4,16 +4,16 @@ import {
   CUSTOM_DOMAIN_INSTRUCTION_DNS_HOST_DISPLAY_TEXT,
   CUSTOM_DOMAIN_STATUSES,
   DNS_CONFIGURATION_STATUSES,
-} from '../../constants';
+} from '@brand-page-maker/constants';
 import {
   useBrandPageContainerStore,
   useBrandPageMakerStore,
   useLocalisedRouteStore,
   useBrandPageMakerUserStore,
-} from '../../stores';
-import { defaultUSDCurrency } from '../../constants/currency-constants';
-import { validateCustomDomainName } from '../../utils';
-import { seoSettingsTr, commonTr } from '../../../composables/useTranslate';
+} from '@brand-page-maker/stores';
+import { defaultUSDCurrency } from '@brand-page-maker/constants/currency-constants';
+import { validateCustomDomainName } from '@brand-page-maker/utils';
+import { seoSettingsTr, commonTr } from '@src/composables/useTranslate';
 import { validate as validateUUID } from 'uuid';
 
 export interface ActionListItem {

package/src/brand-page-maker/components/seo-settings/UrlSettings.stories.ts

@@ -1,10 +1,10 @@
 import { defineComponent } from 'vue';
 import UrlSettings from './UrlSettings.vue';
-import { setupStoryPinia } from '../brand-page-maker/__fixtures__/store-fixture';
+import { setupStoryPinia } from '../../../brand-page-maker/components/brand-page-maker/__fixtures__/store-fixture';
 import { createPinia } from 'pinia';
 import axios from 'axios';
 import MockAdapter from 'axios-mock-adapter';
-import { useBrandPageContainerStore } from '../../stores';
+import { useBrandPageContainerStore } from '@brand-page-maker/stores';
 
 export default {
   title: 'Components/URL Settings',

package/src/brand-page-maker/components/seo-settings/UrlSettings.vue

@@ -393,9 +393,9 @@ import { Button, Loader, TextInput } from '@designcrowd/fe-shared-lib';
 import { SellDomainNameWidget } from '@designcrowd/fe-shared-lib';
 import UrlSettingsMixin from './UrlSettings.mixin.ts';
 import DeleteDomainModal from './DeleteDomainModal.vue';
-import ConfirmModal from '../../../shared/confirm-modal/ConfirmModal.vue';
+import ConfirmModal from '@shared/confirm-modal/ConfirmModal.vue';
 import UseExistingDomainModal from './UseExistingDomainModal.vue';
-import { commonTr, seoSettingsTr } from '../../../composables/useTranslate';
+import { commonTr, seoSettingsTr } from '@src/composables/useTranslate';
 
 export default {
   components: {

package/src/brand-page-maker/components/seo-settings/UseExistingDomainModal.mixin.ts

@@ -1,9 +1,9 @@
 import { defineComponent, computed } from 'vue';
 import { getUserDomainNamesAsync as getActiveUserDomainNamesAsync } from '../../../clients/user-domain-name-client';
-import type { UserDomainName } from '../../../brand-page/models/user-domain.model';
-import { validateCustomDomainName } from '../../utils';
-import { useBrandPageContainerStore } from '../../stores';
-import type { DomainObjectType } from '../../../brand-page-maker/constants/brandpage-constant';
+import type { UserDomainName } from '@brand-page/models/user-domain.model';
+import { validateCustomDomainName } from '@brand-page-maker/utils';
+import { useBrandPageContainerStore } from '@brand-page-maker/stores';
+import type { DomainObjectType } from '@brand-page-maker/constants/brandpage-constant';
 
 const EXISTING_DOMAIN_RADIO_VALUES = {
   purchased: 'purchased',

package/src/brand-page-maker/components/seo-settings/UseExistingDomainModal.vue

@@ -182,7 +182,7 @@ import {
   tr,
   commonTr,
   existingDomainModalTr,
-} from '../../../composables/useTranslate';
+} from '@src/composables/useTranslate';
 
 export default {
   components: {

package/src/brand-page-maker/components/shop/AddOrEditProductContainer.vue

@@ -153,11 +153,11 @@ import {
 } from '@designcrowd/fe-shared-lib';
 import { computed } from 'vue';
 import ProductItemField from './ProductItemField.vue';
-import { useProductConfigStore } from '../../../brand-page-maker/stores/product-config/product-config-store';
-import { useShopConfigStore } from '../../../shared/ecommerce-settings/store/shop-settings-store';
-import NumberInput from '../../../shared/common/NumberInput.vue';
-import { errorTr } from '../../../composables/useTranslate';
-import { productTr } from '../../../composables/useTranslate';
+import { useProductConfigStore } from '@brand-page-maker/stores/product-config/product-config-store';
+import { useShopConfigStore } from '@shared/ecommerce-settings/store/shop-settings-store';
+import NumberInput from '@shared/common/NumberInput.vue';
+import { errorTr } from '@src/composables/useTranslate';
+import { productTr } from '@src/composables/useTranslate';
 
 const productSettingStore = useProductConfigStore();
 const shopConfigStore = useShopConfigStore();

package/src/brand-page-maker/components/shop/ProductConfigModal.vue

@@ -72,9 +72,9 @@
 import AddOrEditProductContainer from './AddOrEditProductContainer.vue';
 import ImageUpload from './ImageUpload.vue';
 import { Button, Modal, Icon } from '@designcrowd/fe-shared-lib';
-import { useProductConfigStore } from '../../../brand-page-maker/stores/product-config/product-config-store';
+import { useProductConfigStore } from '@brand-page-maker/stores/product-config/product-config-store';
 import { computed, onMounted, onUnmounted } from 'vue';
-import { productTr } from '../../../composables/useTranslate';
+import { productTr } from '@src/composables/useTranslate';
 
 const productSettingStore = useProductConfigStore();
 

package/src/brand-page-maker/components/shop/ProductItemField.vue

@@ -52,12 +52,12 @@
 </template>
 <script setup lang="ts">
 import { Button, TextInput } from '@designcrowd/fe-shared-lib';
-import ItemsField from '../../../shared/content-settings/components/items-field/ItemsField.vue';
+import ItemsField from '@shared/content-settings/components/items-field/ItemsField.vue';
 import { computed } from 'vue';
-import { useProductConfigStore } from '../../../brand-page-maker/stores/product-config/product-config-store';
-import { useShopConfigStore } from '../../../shared/ecommerce-settings/store/shop-settings-store';
-import NumberInput from '../../../shared/common/NumberInput.vue';
-import { productTr } from '../../../composables/useTranslate';
+import { useProductConfigStore } from '@brand-page-maker/stores/product-config/product-config-store';
+import { useShopConfigStore } from '@shared/ecommerce-settings/store/shop-settings-store';
+import NumberInput from '@shared/common/NumberInput.vue';
+import { productTr } from '@src/composables/useTranslate';
 
 const shopConfigStore = useShopConfigStore();
 const productSettingStore = useProductConfigStore();

package/src/brand-page-maker/components/shop/ReplaceImageSettingsForShop.vue

@@ -16,12 +16,12 @@
 </template>
 <script setup lang="ts">
 import { computed } from 'vue';
-import ReplaceImageBaseSettings from '../../../shared/content-settings/components/replace-image-base-settings/ReplaceImageBaseSettings.vue';
-import { useProductConfigStore } from '../../stores/product-config/product-config-store';
+import ReplaceImageBaseSettings from '@shared/content-settings/components/replace-image-base-settings/ReplaceImageBaseSettings.vue';
+import { useProductConfigStore } from '@brand-page-maker/stores/product-config/product-config-store';
 import {
   ReplaceImageSettingsTabIds,
   type ReplaceImageSettingsBase,
-} from '../../../shared/content-settings/models';
+} from '@shared/content-settings/models';
 import type { UserMediaItemWithDimensions } from 'src/shared/my-uploads/models';
 const productSettingStore = useProductConfigStore();
 

package/src/brand-page-maker/components/social-share/SocialShare.mixin.ts

@@ -1,9 +1,12 @@
 import { defineComponent } from 'vue';
-import { useBrandPageMakerStore, BRANDPAGE_SETTINGS_MODES } from '../../stores';
+import {
+  useBrandPageMakerStore,
+  BRANDPAGE_SETTINGS_MODES,
+} from '@brand-page-maker/stores';
 import {
   contentSettingsTr,
   socialShareTr,
-} from '../../../composables/useTranslate';
+} from '@src/composables/useTranslate';
 
 export default defineComponent({
   emits: ['media-type-change', 'field-change'],

package/src/brand-page-maker/components/social-share/SocialShare.vue

@@ -57,8 +57,8 @@
 <script>
 import { Button, Loader, TextInput } from '@designcrowd/fe-shared-lib';
 import SocialShareMixin from './SocialShare.mixin';
-import ImageField from '../../../shared/content-settings/components/image-field/ImageField.vue';
-import { socialShareTr, commonTr } from '../../../composables/useTranslate';
+import ImageField from '@shared/content-settings/components/image-field/ImageField.vue';
+import { socialShareTr, commonTr } from '@src/composables/useTranslate';
 
 export default {
   components: {

package/src/brand-page-maker/components/template-preview/TemplatePreview.mixin.ts

@@ -7,33 +7,33 @@ import type {
   LogoTemplateImageModel,
   LogoTheme,
   UserPersonalisation,
-} from '../../../brand-page';
-import { BRAND_PAGE_TYPES, MEDIA_SIZES, VIEWPORTS } from '../../../brand-page';
+} from '@brand-page';
+import { BRAND_PAGE_TYPES, MEDIA_SIZES, VIEWPORTS } from '@brand-page';
 import {
   applyLogoThemeToBrandPageModel,
   applyUserPersonalisationToBrandPageModelAsync,
   getBrandPageViewModelFromBrandPageModel,
-} from '../../../brand-page/utils';
-import { STYLE_THEME_KEYS } from '../../../brand-page/constants';
+} from '@brand-page/utils';
+import { STYLE_THEME_KEYS } from '@brand-page/constants';
 import {
   TEMPLATE_TABS,
   type TemplateSettingsTemplate,
-} from '../../../shared/template-settings/models';
+} from '@shared/template-settings/models';
 import type { DebounceHandle } from 'lodash.debounce';
 import debounce from 'lodash.debounce';
-import { MOBILE_HEIGHT, MOBILE_WIDTH } from '../../constants';
+import { MOBILE_HEIGHT, MOBILE_WIDTH } from '@brand-page-maker/constants';
 import {
   useBrandPageContainerStore,
   useBrandPageMakerStore,
   useBrandPageMakerUserStore,
-} from '../../stores';
-import { useUiTemplateSettingsStore } from '../../../shared/template-settings/store';
+} from '@brand-page-maker/stores';
+import { useUiTemplateSettingsStore } from '@shared/template-settings/store';
 import {
   applyLogoImageBase64UrlToBrandPageTemplateModel,
   applyLogoImageToBrandPageTemplateModel,
   applyLogoTemplateImageToBrandPageTemplateModel,
-} from '../../../brand-page/utils/logo.util';
-import { useVideoStore } from '../../../lib';
+} from '@brand-page/utils/logo.util';
+import { useVideoStore } from '@src/lib';
 
 const DEBOUNCE_IN_MS = 250;
 

package/src/brand-page-maker/components/template-preview/TemplatePreview.stories.ts

@@ -1,14 +1,14 @@
 import { defineComponent } from 'vue';
 import TemplatePreview from './TemplatePreview.vue';
-import { BRAND_PAGE_TYPES, type LogoTheme } from '../../../brand-page';
-import { hexToRGB } from '../../../utils/helpers.js';
+import { BRAND_PAGE_TYPES, type LogoTheme } from '@brand-page';
+import { hexToRGB } from '@utils/helpers.js';
 import { createRouter, createMemoryHistory } from 'vue-router';
 import {
   BRAND_PAGE_TEMPLATE_BP_909,
   LOGO_IMAGE_URL,
   sampleLogoTheme,
 } from '../../../__fixtures__';
-import { DESKTOP_HEIGHT, DESKTOP_WIDTH } from '../../constants';
+import { DESKTOP_HEIGHT, DESKTOP_WIDTH } from '@brand-page-maker/constants';
 
 export default {
   title: 'Components/BrandPageMaker/Template Preview',

package/src/brand-page-maker/components/template-preview/TemplatePreview.vue

@@ -70,7 +70,7 @@
 <script>
 import { defineComponent } from 'vue';
 import TemplatePreviewMixin from './TemplatePreview.mixin.ts';
-import Page from '../../../brand-page/components/page/Page.vue';
+import Page from '@brand-page/components/page/Page.vue';
 import { Loader } from '@designcrowd/fe-shared-lib';
 
 export default defineComponent({

package/src/brand-page-maker/components/template-preview-with-state/TemplatePreviewWithState.vue

@@ -15,12 +15,12 @@
 <script setup lang="ts">
 import { computed } from 'vue';
 import TemplatePreview from '../template-preview/TemplatePreview.vue';
-import { useBrandPageMakerStore, useUiStore } from '../../stores';
-import { useUiLogoSettingsStore } from '../../../shared/logo-settings/store';
-import { VIEWPORTS, type BrandPageData } from '../../../brand-page';
-import type { TemplateSettingsTemplate } from '../../../shared/template-settings/models';
-import { useUiPageSettingsStore } from '../../../shared/page-settings/store/page-settings-store';
-import { PAGE_SECTIONS } from '../../../shared/page-settings/models';
+import { useBrandPageMakerStore, useUiStore } from '@brand-page-maker/stores';
+import { useUiLogoSettingsStore } from '@shared/logo-settings/store';
+import { VIEWPORTS, type BrandPageData } from '@brand-page';
+import type { TemplateSettingsTemplate } from '@shared/template-settings/models';
+import { useUiPageSettingsStore } from '@shared/page-settings/store/page-settings-store';
+import { PAGE_SECTIONS } from '@shared/page-settings/models';
 
 const props = withDefaults(
   defineProps<{

package/src/brand-page-maker/components/upgrade-to-premium-button/UpgradeToPremiumButton.mixin.ts

@@ -1,6 +1,6 @@
 import { defineComponent } from 'vue';
-import { useBrandPageContainerStore } from '../../stores';
-import { commonTr } from '../../../composables/useTranslate';
+import { useBrandPageContainerStore } from '@brand-page-maker/stores';
+import { commonTr } from '@src/composables/useTranslate';
 
 export default defineComponent({
   props: {

package/src/brand-page-maker/composables/rich-text-editor/font.ts

@@ -1,10 +1,6 @@
 import { ref, type Ref } from 'vue';
 import type { Editor } from '@tiptap/vue-3';
-import {
-  emToPx,
-  pxToEm,
-  skipStyleDetection,
-} from '../../../brand-page-maker/utils';
+import { emToPx, pxToEm, skipStyleDetection } from '@brand-page-maker/utils';
 import debounce from 'lodash/debounce';
 
 interface DropdownRef {