@designcrowd/library.brand-page 5.16.48 → 5.16.50

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 {

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

@@ -1,5 +1,5 @@
 import type { Editor } from '@tiptap/vue-3';
-import { skipStyleDetection } from '../../../brand-page-maker/utils';
+import { skipStyleDetection } from '@brand-page-maker/utils';
 
 export const createFormattingActions = (editor: Editor) => {
   return {

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

@@ -1,8 +1,8 @@
 import { ref, computed } from 'vue';
 import type { Editor } from '@tiptap/vue-3';
 import debounce from 'lodash/debounce';
-import { letterSpacingValueConvertor } from '../../../brand-page-maker/convertors';
-import { skipStyleDetection } from '../../../brand-page-maker/utils';
+import { letterSpacingValueConvertor } from '@brand-page-maker/convertors';
+import { skipStyleDetection } from '@brand-page-maker/utils';
 
 export const useSpacing = (editor: Editor) => {
   const letterSpacing = ref('0');

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

@@ -1,6 +1,6 @@
 import { ref, computed } from 'vue';
 import type { Editor } from '@tiptap/vue-3';
-import { skipStyleDetection } from '../../../brand-page-maker/utils';
+import { skipStyleDetection } from '@brand-page-maker/utils';
 
 export const useTextAlign = (editor: Editor) => {
   const alignmentSettings = {

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

@@ -20,7 +20,7 @@ import { LineHeight } from './extensions/LineHeight';
 import Highlight from '@tiptap/extension-highlight';
 import Placeholder from '@tiptap/extension-placeholder';
 import Link from '@tiptap/extension-link';
-import type { StyleTextFontFamilyOption } from '../../../shared/style-settings/models';
+import type { StyleTextFontFamilyOption } from '@shared/style-settings/models';
 import { createFormattingActions } from './formatting';
 import { useTextAlign } from './textAlign';
 import { useFont } from './font';
@@ -33,20 +33,20 @@ import {
   pxToEm,
   sanitiseClientSideRTE,
   skipStyleDetection,
-} from '../../../brand-page-maker/utils';
-import type { HyperlinkType, TextStyles } from '../../../brand-page';
+} from '@brand-page-maker/utils';
+import type { HyperlinkType, TextStyles } from '@brand-page';
 import {
   HYPERLINK_TYPE,
   type TextItem,
   type TextStyleDeclaration,
-} from '../../../brand-page';
-import type { ButtonGroupOption } from '../../../brand-page-maker/models/button-group.model';
+} from '@brand-page';
+import type { ButtonGroupOption } from '@brand-page-maker/models/button-group.model';
 import {
   letterSpacingValueConvertor,
   colorConvertor,
   backgroundColorConvertor,
-} from '../../../brand-page-maker/convertors';
-import { useUiContentSettingsStore } from '../../../shared/content-settings/store';
+} from '@brand-page-maker/convertors';
+import { useUiContentSettingsStore } from '@shared/content-settings/store';
 import { AllSelection } from 'prosemirror-state';
 import { MaxLength } from './extensions/MaxLength';
 import { AutoLink } from './extensions/AutoLink';
@@ -56,7 +56,7 @@ import {
   hasLogoColorVar,
   isLogoColor,
   getRTEColor,
-} from '../../utils/rich-text-editor.util';
+} from '@brand-page-maker/utils/rich-text-editor.util';
 import { useEventTracker, EVENTS } from '../useEventTracker';
 
 interface UseRichTextEditorReturn {

package/src/brand-page-maker/constants/brandpage-meta-constant.ts

@@ -1,4 +1,4 @@
-import { commonTr, errorTr } from '../../composables/useTranslate';
+import { commonTr, errorTr } from '@src/composables/useTranslate';
 
 export const BRANDPAGE_DEFAULT_SAVE_MESSAGE_DESCRIPTION = () =>
   commonTr(`defaultSaveDescription`);

package/src/brand-page-maker/constants/config-settings-constant.ts

@@ -35,7 +35,7 @@ import type {
   Content,
   ShopContent,
   BookingSectionContent,
-} from '../../brand-page';
+} from '@brand-page';
 import {
   SOCIAL_LINKS_ICON_DISPLAY_STYLES,
   BRAND_PAGE_TYPES,
@@ -51,7 +51,7 @@ import {
   PAYMENT_OPTION_DISPLAY_TYPES,
   PAYMENT_OPTION_IMAGE_TYPES,
   GettyVideoMedia,
-} from '../../brand-page';
+} from '@brand-page';
 import type {
   ContentSettingsConfig,
   ContentSettingsField,
@@ -88,7 +88,7 @@ import {
 import type {
   ContentReplaceImageSettings,
   SetContentMediaPayload,
-} from '../../shared/content-settings/models';
+} from '@shared/content-settings/models';
 import {
   colorConvertor,
   backgroundColorConvertor,
@@ -115,7 +115,7 @@ import {
   ALIGN_CENTERED,
   DISPLAY_STYLE_COLLAPSED,
   DISPLAY_STYLE_PREVIEW,
-} from '../../brand-page';
+} from '@brand-page';
 import {
   imageFieldVisibilityAssessor,
   imageOptionVisibilityAssessor,
@@ -163,13 +163,13 @@ import {
   bannerSectionFieldTypeAssessor,
   bannerSectionRoleTypeAssessor,
 } from '../assessors/banner-section-field.assessor';
-import { isValidSvgUrl } from '../../brand-page/utils';
+import { isValidSvgUrl } from '@brand-page/utils';
 import {
   brandPageOrbrandContactTypeVisibilityAssessor,
   brandSiteTypeVisibilityAssessor,
 } from '../assessors/brand-page-type-visibility.assessor';
-import { contentSettingsTr } from '../../composables/useTranslate';
-import type { GettyVideoMediaSelectedPayload } from '../../shared/my-uploads/models';
+import { contentSettingsTr } from '@src/composables/useTranslate';
+import type { GettyVideoMediaSelectedPayload } from '@shared/my-uploads/models';
 
 const MediaFieldNames = {
   aspectRatio: 'aspectRatio',

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

@@ -1,5 +1,5 @@
-import type { Endpoints } from '../../shared/models';
-import { commonTr, errorTr } from '../../composables/useTranslate';
+import type { Endpoints } from '@shared/models';
+import { commonTr, errorTr } from '@src/composables/useTranslate';
 
 export * from './config-settings-constant';
 export * from './brandpage-meta-constant';

package/src/brand-page-maker/constants/personalisation.constant.ts

@@ -6,7 +6,7 @@ import type {
   TextMediaItem,
   UserPersonalisationItem,
   UserPersonalisationSection,
-} from '../../brand-page/models';
+} from '@brand-page/models';
 
 export type ContentPersonalisationMapping<T> = {
   [key in

package/src/brand-page-maker/constants/sidebar-constant.ts

@@ -1,5 +1,5 @@
-import type { SideBarTab } from '../../shared/side-bar/models';
-import { constantsTr } from '../../composables/useTranslate';
+import type { SideBarTab } from '@shared/side-bar/models';
+import { constantsTr } from '@src/composables/useTranslate';
 
 export const SIDE_BAR_TAB_NAMES = {
   PREVIEW: 'Preview',

package/src/brand-page-maker/constants/ui-constant.ts

@@ -1,4 +1,4 @@
-import { constantsTr } from '../../composables/useTranslate';
+import { constantsTr } from '@src/composables/useTranslate';
 
 export const MESSAGE_VISIBLE_DURATION = 3000;
 

package/src/brand-page-maker/convertors/about-display-style.convertor.ts

@@ -6,9 +6,9 @@ import {
   ALIGN_RIGHT_ALIGNED,
   ALIGN_RIGHT_FULL_IMAGE,
   TEXT_ONLY,
-} from '../../brand-page/constants';
+} from '@brand-page/constants';
 
-import type { AboutSectionContent } from '../../brand-page';
+import type { AboutSectionContent } from '@brand-page';
 
 export const aboutDisplayStyleConvertor: ValueConvertor<
   string | null,

package/src/brand-page-maker/convertors/align-display-style.convertor.ts

@@ -1,6 +1,6 @@
 import type { ButtonGroupConfig, OptionsConvertor } from '../models';
-import { ALIGN_CENTERED, ALIGN_LEFT_ALIGNED } from '../../brand-page/constants';
-import { converterTr } from '../../composables/useTranslate';
+import { ALIGN_CENTERED, ALIGN_LEFT_ALIGNED } from '@brand-page/constants';
+import { converterTr } from '@src/composables/useTranslate';
 
 export const alignDisplayStyleConvertor: OptionsConvertor<string | null> = {
   convertBackToMultipleValues: false,

package/src/brand-page-maker/convertors/banner-align-display-style.convertor.ts

@@ -9,8 +9,8 @@ import {
   ALIGN_LEFT_BIG_IMAGE,
   ALIGN_CARD_CENTER_IMAGE,
   ALIGN_CARD_LEFT_IMAGE,
-} from '../../brand-page/constants';
-import type { BannerSectionContent } from '../../brand-page';
+} from '@brand-page/constants';
+import type { BannerSectionContent } from '@brand-page';
 
 export const bannerAlignDisplayStyleConvertor: ValueConvertor<
   string | null,

package/src/brand-page-maker/convertors/button-link-style.convertor.ts

@@ -1,7 +1,7 @@
 import type { ButtonGroupConfig, OptionsConvertor } from '../models';
-import type { BrandPageContext } from '../../brand-page/models/index';
-import { BUTTON_LINK_TYPE } from '../../brand-page/models/index';
-import { converterTr } from '../../composables/useTranslate';
+import type { BrandPageContext } from '@brand-page/models/index';
+import { BUTTON_LINK_TYPE } from '@brand-page/models/index';
+import { converterTr } from '@src/composables/useTranslate';
 export const buttonLinkStyleConvertor: OptionsConvertor<string | null> = {
   convertBackToMultipleValues: false,
 

package/src/brand-page-maker/convertors/contact-layout-style.convertor.ts

@@ -6,8 +6,8 @@ import {
   ALIGN_CARD_CENTER_IMAGE,
   TEXT_ONLY,
   ALIGN_CARD_CENTER,
-} from '../../brand-page/constants';
-import type { ContactFormContent } from '../../brand-page';
+} from '@brand-page/constants';
+import type { ContactFormContent } from '@brand-page';
 
 export const contactLayoutStyleConvertor: ValueConvertor<
   string | null,

package/src/brand-page-maker/convertors/display-style.convertor.ts

@@ -2,8 +2,8 @@ import type { ButtonGroupConfig, OptionsConvertor } from '../models';
 import {
   DISPLAY_STYLE_COLLAPSED,
   DISPLAY_STYLE_PREVIEW,
-} from '../../brand-page/constants';
-import { converterTr } from '../../composables/useTranslate';
+} from '@brand-page/constants';
+import { converterTr } from '@src/composables/useTranslate';
 
 export const displayStyleConvertor: OptionsConvertor<string | null> = {
   convertBackToMultipleValues: false,

package/src/brand-page-maker/convertors/divider-style.convertor.ts

@@ -1,7 +1,7 @@
 import type { ButtonGroupConfig, OptionsConvertor } from '../models';
-import type { DividerStyle } from '../../brand-page';
-import { DIVIDER_STYLES } from '../../brand-page';
-import { contentSettingsTr } from '../../composables/useTranslate';
+import type { DividerStyle } from '@brand-page';
+import { DIVIDER_STYLES } from '@brand-page';
+import { contentSettingsTr } from '@src/composables/useTranslate';
 
 export const dividerStyleConvertor: OptionsConvertor<string | null> = {
   convertBackToMultipleValues: false,

package/src/brand-page-maker/convertors/gallery-type.convertor.ts

@@ -1,7 +1,7 @@
 import type { ButtonGroupConfig, OptionsConvertor } from '../models';
-import type { GalleryStyles, GalleryType } from '../../brand-page';
-import { GALLERY_TYPES } from '../../brand-page';
-import { converterTr } from '../../composables/useTranslate';
+import type { GalleryStyles, GalleryType } from '@brand-page';
+import { GALLERY_TYPES } from '@brand-page';
+import { converterTr } from '@src/composables/useTranslate';
 
 export const galleryTypeConvertor: OptionsConvertor<GalleryStyles> = {
   convertBackToMultipleValues: false,

package/src/brand-page-maker/convertors/image-aspect-ratio.convertor.ts

@@ -1,8 +1,8 @@
 import type { ButtonGroupConfig, OptionsConvertor } from '../models';
-import type { AspectRatio } from '../../brand-page';
-import { ASPECT_RATIOS, BRAND_PAGE_TYPES } from '../../brand-page';
+import type { AspectRatio } from '@brand-page';
+import { ASPECT_RATIOS, BRAND_PAGE_TYPES } from '@brand-page';
 import { useBrandPageMakerStore } from '../stores';
-import { converterTr } from '../../composables/useTranslate';
+import { converterTr } from '@src/composables/useTranslate';
 
 export const imageAspectRatioConvertor: OptionsConvertor<AspectRatio | false> =
   {

package/src/brand-page-maker/convertors/line-height-value.convertor.ts

@@ -1,4 +1,4 @@
-import { LINE_HEIGHT_BODY } from '../../brand-page/constants/';
+import { LINE_HEIGHT_BODY } from '@brand-page/constants/';
 import type { ValueConvertor } from '../models';
 
 export const lineHeightValueConvertor: ValueConvertor<

package/src/brand-page-maker/convertors/payment-display-type.convertor.ts

@@ -4,8 +4,8 @@ import {
   type PaymentOptionDisplayType,
   type RequestPaymentConfig,
   type RequestPaymentConvertor,
-} from '../../brand-page';
-import { converterTr } from '../../composables/useTranslate';
+} from '@brand-page';
+import { converterTr } from '@src/composables/useTranslate';
 
 export const paymentLinkDisplayStyleConvertor: ValueConvertor<
   RequestPaymentConfig,

package/src/brand-page-maker/convertors/shape-size-options.convertor.ts

@@ -1,5 +1,5 @@
 import type { ButtonGroupConfig, OptionsConvertor } from '../models';
-import { commonTr } from '../../composables/useTranslate';
+import { commonTr } from '@src/composables/useTranslate';
 
 const SHAPE_HEIGHT_SMALL = '4rem';
 const SHAPE_HEIGHT_MEDIUM = '5.5rem';

package/src/brand-page-maker/convertors/shop-aspect-ratio.convertor.ts

@@ -1,6 +1,6 @@
 import type { ButtonGroupConfig, OptionsConvertor } from '../models';
-import { PAYMENT_OPTION_IMAGE_TYPES } from '../../brand-page';
-import { commonTr } from '../../composables/useTranslate';
+import { PAYMENT_OPTION_IMAGE_TYPES } from '@brand-page';
+import { commonTr } from '@src/composables/useTranslate';
 
 export const shopAspectRatioConvertor: OptionsConvertor<string | null> = {
   convertBackToMultipleValues: false,

package/src/brand-page-maker/convertors/shop-display-type.convertor.ts

@@ -3,8 +3,8 @@ import {
   PAYMENT_OPTION_DISPLAY_TYPES,
   type PaymentOptionDisplayType,
   type ShopContent,
-} from '../../brand-page';
-import { converterTr } from '../../composables/useTranslate';
+} from '@brand-page';
+import { converterTr } from '@src/composables/useTranslate';
 
 export const shopDisplayConvertor: ValueConvertor<
   string,

package/src/brand-page-maker/convertors/social-links-icon-display-style.convertor.ts

@@ -1,7 +1,7 @@
 import type { ButtonGroupConfig, OptionsConvertor } from '../models';
-import type { SocialLinksIconDisplayStyle } from '../../brand-page';
-import { SOCIAL_LINKS_ICON_DISPLAY_STYLES } from '../../brand-page';
-import { contentSettingsTr } from '../../composables/useTranslate';
+import type { SocialLinksIconDisplayStyle } from '@brand-page';
+import { SOCIAL_LINKS_ICON_DISPLAY_STYLES } from '@brand-page';
+import { contentSettingsTr } from '@src/composables/useTranslate';
 
 export const socialLinksIconDisplayStyleConvertor: OptionsConvertor<
   SocialLinksIconDisplayStyle | false

package/src/brand-page-maker/convertors/testimonial-display-style-convertor.ts

@@ -1,7 +1,7 @@
 import type { ButtonGroupConfig, ValueConvertor } from '../models';
-import { ALIGN_CENTERED, BIG_IMAGE, COLUMNS } from '../../brand-page/constants';
+import { ALIGN_CENTERED, BIG_IMAGE, COLUMNS } from '@brand-page/constants';
 import type { TestimonialSectionContent } from 'src/lib';
-import { converterTr } from '../../composables/useTranslate';
+import { converterTr } from '@src/composables/useTranslate';
 
 export const testimonialDisplayStyleConvertor: ValueConvertor<
   string | null,

package/src/brand-page-maker/convertors/text-column-style.convertor.ts

@@ -1,5 +1,5 @@
 import type { ButtonGroupConfig, OptionsConvertor } from '../models';
-import { TEXT_COLUMNS } from '../../brand-page/constants';
+import { TEXT_COLUMNS } from '@brand-page/constants';
 
 export const textColumnStyleConvertor: OptionsConvertor<string | null> = {
   convertBackToMultipleValues: false,

package/src/brand-page-maker/convertors/text-css-style-options.convertor.ts

@@ -1,5 +1,5 @@
 import type { ButtonGroupConfig, OptionsConvertor } from '../models';
-import type { TextStyleDeclarationWithoutTextAlign } from '../../brand-page';
+import type { TextStyleDeclarationWithoutTextAlign } from '@brand-page';
 
 const VALUE_BOLD = 'bold';
 const VALUE_ITALIC = 'italic';

package/src/brand-page-maker/convertors/text-image-display-style.convertor.ts

@@ -7,8 +7,8 @@ import {
   ALTERNATE_IMAGE,
   MEDIA_ONLY,
   type ImagesSectionContentDisplayStyle,
-} from '../../brand-page/constants';
-import type { ImagesSectionContent, MediaType } from '../../brand-page';
+} from '@brand-page/constants';
+import type { ImagesSectionContent, MediaType } from '@brand-page';
 
 export const getTextMediaOptionsConverterByMediaType = (
   mediaType: MediaType,

package/src/brand-page-maker/convertors/text-size-value.convertor.ts

@@ -1,5 +1,5 @@
 import type { ValueConvertor } from '../models';
-import { DEFAULT_FONT_SIZE } from '../../brand-page/constants/';
+import { DEFAULT_FONT_SIZE } from '@brand-page/constants/';
 import { pxToEm, emToPx } from '../utils/text.util';
 
 export const textSizeValueConvertor: ValueConvertor<BrandPageCssStyle, string> =

package/src/brand-page-maker/convertors/video-content-state.convertor.ts

@@ -1,4 +1,4 @@
-import type { VideoContent } from '../../brand-page';
+import type { VideoContent } from '@brand-page';
 import type {
   ValueConvertor,
   ValueConvertorConvertBackOptions,

package/src/brand-page-maker/default-getters/payment-fill-color.default-getter.ts

@@ -1,4 +1,4 @@
-import { RGBAtoHex } from '../../utils/helpers';
+import { RGBAtoHex } from '@utils/helpers';
 import type { DefaultGetter } from '../models';
 
 export const paymentFillColorFieldDefaultGetter: DefaultGetter<

package/src/brand-page-maker/default-getters/payment-text-and-border-color.default-getter.ts

@@ -1,6 +1,6 @@
-import type { TextContent } from '../../brand-page';
-import { isHexTransparent } from '../../brand-page/utils/color.util';
-import { RGBAtoHex } from '../../utils/helpers';
+import type { TextContent } from '@brand-page';
+import { isHexTransparent } from '@brand-page/utils/color.util';
+import { RGBAtoHex } from '@utils/helpers';
 import type { DefaultGetter } from '../models';
 
 export const paymentTextAndBorderColorFieldDefaultGetter: DefaultGetter<

package/src/brand-page-maker/default-getters/text-color.default-getter.ts

@@ -1,6 +1,6 @@
-import type { TextContent } from '../../brand-page';
-import { isHexTransparent } from '../../brand-page/utils/color.util';
-import { RGBAtoHex } from '../../utils/helpers';
+import type { TextContent } from '@brand-page';
+import { isHexTransparent } from '@brand-page/utils/color.util';
+import { RGBAtoHex } from '@utils/helpers';
 import type { DefaultGetter } from '../models';
 
 export const textColorFieldDefaultGetter: DefaultGetter<BrandPageCssStyle> = (

package/src/brand-page-maker/models/assessor.model.ts

@@ -1,4 +1,4 @@
-import type { BrandPageContext } from '../../brand-page/models';
+import type { BrandPageContext } from '@brand-page/models';
 import type { ItemFieldType } from './content-settings-configs';
 
 export type Assessor<TPayload, TTarget> = (

package/src/brand-page-maker/models/button-styles-config.ts

@@ -1,6 +1,6 @@
-import type { BrandPageType, ButtonStyles } from '../../brand-page';
-import { BRAND_PAGE_TYPES } from '../../brand-page';
-import { ButtonBoxShadowSize, ButtonSoftBoxShadowSize } from '../../brand-page';
+import type { BrandPageType, ButtonStyles } from '@brand-page';
+import { BRAND_PAGE_TYPES } from '@brand-page';
+import { ButtonBoxShadowSize, ButtonSoftBoxShadowSize } from '@brand-page';
 
 export const ButtonStyleConfigOptions = [
   'buttonBorderColor',