@designcrowd/library.brand-page 5.15.21 → 5.15.24-ast-previews-2

package/lib/src/lib.js

@@ -30,7 +30,7 @@ export { getOptimalLogoSize, calculateOptimizedLogoDimensions, } from './brand-p
 export { sanitizeRTEHtml } from './brand-page-maker/utils';
 export { getPageSlugFromPageTitle } from './brand-page-maker/utils/slug.util';
 // stores
-export { useBrandPageMakerStore, useBrandPageMakerUserStore, useUiStore, useBrandPageContainerStore, useEventManagerStore, useLocalisedRouteStore, } from './brand-page-maker/stores';
+export { useBrandPageMakerStore, useBrandPageMakerUserStore, useUiStore, useBrandPageContainerStore, useEventManagerStore, useLocalisedRouteStore, useVideoStore, } from './brand-page-maker/stores';
 export { useShopConfigStore } from './shared/ecommerce-settings/store/shop-settings-store';
 // for jest, need to set active pinia in library.brand-page as well
 import { createPinia, setActivePinia } from 'pinia';

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

@@ -180,13 +180,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     "onOn-toggle-state-change"?: ((...args: any[]) => any) | undefined;
 }>, {
     index: number;
+    settings: ContentItemFieldSettings;
     role: string;
     styles: Record<string, any>;
     placeholder: string;
     minLength: number;
     maxLength: number;
     value: string | false | undefined;
-    settings: ContentItemFieldSettings;
     attrs: Record<string, any>;
     isRequired: boolean;
     isToggled: boolean;

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

@@ -52,6 +52,7 @@ declare const _default: import("vue").DefineComponent<{}, {
         brandPageTemplate(): any;
         brandPageTitle(): string;
         brandPageViewModel(): import("../../../../brand-page").BrandPageViewModel;
+        gettyVideoIds(): string[];
         isInteractivePreviewEnabled(): boolean;
         isProduction(): boolean;
         isPublishButtonEnabled(): boolean;
@@ -505,6 +506,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             colorReplacements?: import("../../../../brand-page").ColorReplacement[] | undefined;
             aspectRatio?: number | null | undefined;
         }): void;
+        _setSelectedItemMedia(selectedItemId: string | null, mediaPayload: import("../../../my-uploads/models").MediaBaseSelectedPayload): void;
         _setItems({ items }: {
             items: ContentItem<any>[];
         }): void;
@@ -580,6 +582,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             colorReplacements?: import("../../../../brand-page").ColorReplacement[] | undefined;
             aspectRatio?: number | null | undefined;
         }): void;
+        setSelectedItemMedia(selectedItemId: string | null, mediaPayload: import("../../../my-uploads/models").MediaBaseSelectedPayload): void;
         setItems(payload: {
             items: ContentItem<Content>[];
         }): void;
@@ -659,6 +662,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;

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

@@ -1,5 +1,5 @@
 import type { ContentItem, ContentItemFieldSettings, ReplaceImageSettingsBase, ReplaceImageSettingsTabId } from '../../models';
-import type { UserMediaItemWithDimensions } from '../../../my-uploads/models';
+import type { MediaBaseSelectedPayload, UserMediaItemWithDimensions } from '../../../my-uploads/models';
 declare const _default: import("vue").DefineComponent<{}, {
     items: import("vue").ComputedRef<{
         id: string;
@@ -372,6 +372,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             colorReplacements?: import("../../../../brand-page").ColorReplacement[] | undefined;
             aspectRatio?: number | null | undefined;
         }): void;
+        _setSelectedItemMedia(selectedItemId: string | null, mediaPayload: MediaBaseSelectedPayload): void;
         _setItems({ items }: {
             items: ContentItem<any>[];
         }): void;
@@ -447,6 +448,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             colorReplacements?: import("../../../../brand-page").ColorReplacement[] | undefined;
             aspectRatio?: number | null | undefined;
         }): void;
+        setSelectedItemMedia(selectedItemId: string | null, mediaPayload: MediaBaseSelectedPayload): void;
         setItems(payload: {
             items: ContentItem<import("../../../../brand-page").Content>[];
         }): void;
@@ -535,6 +537,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;
@@ -566,6 +569,7 @@ declare const _default: import("vue").DefineComponent<{}, {
         brandPageTemplate(): any;
         brandPageTitle(): string;
         brandPageViewModel(): import("../../../../brand-page").BrandPageViewModel;
+        gettyVideoIds(): string[];
         isInteractivePreviewEnabled(): boolean;
         isProduction(): boolean;
         isPublishButtonEnabled(): boolean;
@@ -694,5 +698,6 @@ declare const _default: import("vue").DefineComponent<{}, {
     onImageRemoved(image: Pick<UserMediaItemWithDimensions, 'url' | 'minimisedUrl' | 'width' | 'height'>): void;
     onDesignSelected(image: UserMediaItemWithDimensions): void;
     onShapeSelected(image: any): void;
+    onVideoSelected(videoPayload: MediaBaseSelectedPayload): void;
 }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/lib/src/shared/content-settings/components/content-settings/ReplaceImageSettingsForContent.mixin.js

@@ -186,5 +186,9 @@ export default defineComponent({
             });
             this.contentSettingsStore.popMode();
         },
+        onVideoSelected(videoPayload) {
+            this.contentSettingsStore.setSelectedItemMedia(this.selectedItemId, videoPayload);
+            this.contentSettingsStore.popMode();
+        },
     },
 });

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

@@ -362,6 +362,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             colorReplacements?: import("../../../../brand-page").ColorReplacement[] | undefined;
             aspectRatio?: number | null | undefined;
         }): void;
+        _setSelectedItemMedia(selectedItemId: string | null, mediaPayload: import("../../../my-uploads/models").MediaBaseSelectedPayload): void;
         _setItems({ items }: {
             items: import("../../models").ContentItem<any>[];
         }): void;
@@ -437,6 +438,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             colorReplacements?: import("../../../../brand-page").ColorReplacement[] | undefined;
             aspectRatio?: number | null | undefined;
         }): void;
+        setSelectedItemMedia(selectedItemId: string | null, mediaPayload: import("../../../my-uploads/models").MediaBaseSelectedPayload): void;
         setItems(payload: {
             items: import("../../models").ContentItem<import("../../../../brand-page").Content>[];
         }): void;

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

@@ -77,6 +77,7 @@ export default defineComponent({
                 isBrandContact: this.brandPageData.brandPageType === BRAND_PAGE_TYPES.brandContact,
                 options: {
                     mediaSizes: MEDIA_SIZES.size1x,
+                    renderVideoAsImage: true,
                 },
                 isCapturingPreview: false,
             };

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

@@ -401,6 +401,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             colorReplacements?: import("../../../../brand-page").ColorReplacement[] | undefined;
             aspectRatio?: number | null | undefined;
         }): void;
+        _setSelectedItemMedia(selectedItemId: string | null, mediaPayload: import("../../../my-uploads/models").MediaBaseSelectedPayload): void;
         _setItems({ items }: {
             items: ContentItem<any>[];
         }): void;
@@ -476,6 +477,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             colorReplacements?: import("../../../../brand-page").ColorReplacement[] | undefined;
             aspectRatio?: number | null | undefined;
         }): void;
+        setSelectedItemMedia(selectedItemId: string | null, mediaPayload: import("../../../my-uploads/models").MediaBaseSelectedPayload): void;
         setItems(payload: {
             items: ContentItem<Content>[];
         }): void;
@@ -511,6 +513,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         brandPageTemplate(): any;
         brandPageTitle(): string;
         brandPageViewModel(): import("../../../../brand-page").BrandPageViewModel;
+        gettyVideoIds(): string[];
         isInteractivePreviewEnabled(): boolean;
         isProduction(): boolean;
         isPublishButtonEnabled(): boolean;
@@ -733,6 +736,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;

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

@@ -177,13 +177,13 @@ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import
     "onOn-toggle-state-change"?: ((...args: any[]) => any) | undefined;
 }>, {
     index: number;
+    settings: import("../../models").ContentItemFieldSettings;
     role: string;
     styles: Record<string, any>;
     placeholder: string;
     minLength: number;
     maxLength: number;
     value: string | false | undefined;
-    settings: import("../../models").ContentItemFieldSettings;
     attrs: Record<string, any>;
     isRequired: boolean;
     isToggled: boolean;

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

@@ -353,6 +353,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             colorReplacements?: import("../../../../brand-page").ColorReplacement[] | undefined;
             aspectRatio?: number | null | undefined;
         }): void;
+        _setSelectedItemMedia(selectedItemId: string | null, mediaPayload: import("../../../my-uploads/models").MediaBaseSelectedPayload): void;
         _setItems({ items }: {
             items: ContentItem<any>[];
         }): void;
@@ -428,6 +429,7 @@ declare const _default: import("vue").DefineComponent<{}, {
             colorReplacements?: import("../../../../brand-page").ColorReplacement[] | undefined;
             aspectRatio?: number | null | undefined;
         }): void;
+        setSelectedItemMedia(selectedItemId: string | null, mediaPayload: import("../../../my-uploads/models").MediaBaseSelectedPayload): void;
         setItems(payload: {
             items: ContentItem<import("../../../../brand-page").Content>[];
         }): void;

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

@@ -59,6 +59,7 @@ export default defineComponent({
                 isBrandContact: this.brandPageData.brandPageType === BRAND_PAGE_TYPES.brandContact,
                 options: {
                     mediaSizes: MEDIA_SIZES.size1x,
+                    renderVideoAsImage: true,
                 },
                 isCapturingPreview: false,
             };

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

@@ -33,6 +33,16 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         required: false;
         default: undefined;
     };
+    mediaViewModel: {
+        type: ObjectConstructor;
+        required: false;
+        default: undefined;
+    };
+    content: {
+        type: ObjectConstructor;
+        required: false;
+        default: undefined;
+    };
 }>, {}, {
     imgValue: string;
 }, {
@@ -79,14 +89,26 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         required: false;
         default: undefined;
     };
+    mediaViewModel: {
+        type: ObjectConstructor;
+        required: false;
+        default: undefined;
+    };
+    content: {
+        type: ObjectConstructor;
+        required: false;
+        default: undefined;
+    };
 }>> & Readonly<{
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
     "onOn-intent-image-replace"?: ((...args: any[]) => any) | undefined;
 }>, {
     mediaType: string;
-    placeholder: string;
     settings: ContentItemFieldSettings;
+    placeholder: string;
+    content: Record<string, any>;
     isRequired: boolean;
+    mediaViewModel: Record<string, any>;
 }, {}, {
     Button: any;
     Icon: any;

package/lib/src/shared/content-settings/components/image-field/ImageField.mixin.js

@@ -3,6 +3,7 @@ import { Button, Icon } from '@designcrowd/fe-shared-lib';
 import BrandPageIcon from '../../../../brand-page/components/icon/Icon.vue';
 import { isURL } from '../../../../utils/validator.util';
 import { commonTr } from '../../../../composables/useTranslate';
+import { useVideoStore } from '../../../../brand-page-maker/stores/video/video-store';
 const ACCEPTED_MIME_TYPES = 'image/png, image/jpeg, image/svg+xml';
 export default defineComponent({
     components: {
@@ -43,6 +44,16 @@ export default defineComponent({
             required: false,
             default: undefined,
         },
+        mediaViewModel: {
+            type: Object,
+            required: false,
+            default: undefined,
+        },
+        content: {
+            type: Object,
+            required: false,
+            default: undefined,
+        },
     },
     emits: ['update:modelValue', 'on-intent-image-replace'],
     data() {
@@ -56,6 +67,18 @@ export default defineComponent({
         },
         imageUrl: {
             get() {
+                if (this.content?.type === 'banner-section' &&
+                    this.content?.media?.type === 'getty-video' &&
+                    this.name === 'imageUrl') {
+                    const gettyToken = this.content?.media.gettyToken;
+                    if (gettyToken) {
+                        const videoStore = useVideoStore();
+                        const videoUrls = videoStore.getVideoUrlsForToken(gettyToken);
+                        if (videoUrls?.previewImageUrl) {
+                            return videoUrls.previewImageUrl;
+                        }
+                    }
+                }
                 return this.imgValue;
             },
             set(newVal) {
@@ -69,7 +92,7 @@ export default defineComponent({
         addTitle() {
             return this.mediaType === 'shape'
                 ? commonTr('addShapeLabel')
-                : commonTr('addImageLabel');
+                : commonTr('addMediaLabel');
         },
     },
     watch: {
@@ -86,6 +109,7 @@ export default defineComponent({
             });
         },
         onRemove() {
+            this.content.media = undefined;
             this.imgValue = '';
             this.imageUrl = '';
         },

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

@@ -76,6 +76,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             logoImageHeight: string | undefined;
             logoImageWidth: string | undefined;
         }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: import("../../../../brand-page").BrandPagePaymentConfig, newCurrency: import("../../../../brand-page").BrandPagePaymentConfigCurrency): void;
         setPageTitle({ pageTitle, pageIndex, }: {
             pageTitle: string;
             pageIndex: number;

package/lib/src/shared/content-settings/components/payment-config-field/PaymentConfigField.mixin.d.ts

@@ -1,5 +1,5 @@
 import type { PropType } from 'vue';
-import type { BrandPagePaymentConfig, PaymentConfig } from '../../../../brand-page';
+import type { BrandPagePaymentConfig, BrandPagePaymentConfigCurrency, PaymentConfig } from '../../../../brand-page';
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     id: {
         type: StringConstructor;
@@ -368,8 +368,85 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         deleteProduct(id: any): void;
         getVariantCombinations(variants: import("../../../../brand-page/models/shop.model").VariantModel[]): import("../../../../brand-page/models/shop.model").VariantOptionModel[][];
     }>;
+    uiPageSettingsStore: import("pinia").Store<"uiPageSettings", import("../../../page-settings/store/page-settings-store").PageSettingsState, {
+        pageIndex(): number;
+    }, {
+        setCurrentPageIndex({ pageIndex }: {
+            pageIndex: number;
+        }): void;
+        setState({ newState, }: {
+            newState: Omit<import("../../../page-settings/store/page-settings-store").PageSettingsState, "sectionCollapsedStates">;
+        }): void;
+        setPageContents({ pageIndex, contents, }: {
+            pageIndex: number;
+            contents: import("../../models").ContentItem<import("../../../../brand-page").Content>[];
+        }): void;
+        setPages({ pages }: {
+            pages: import("../../../page-settings/models").ContentPage[];
+        }): void;
+        setNewPageModalVisibilityAsync({ isNewPageModalVisible, }: {
+            isNewPageModalVisible: boolean;
+        }): Promise<void>;
+        addPage({ page }: {
+            page: import("../../../page-settings/models").ContentPage;
+        }): void;
+        setPageTitleAndSlug({ title, slug, index, }: {
+            title: string;
+            slug: string;
+            index: number;
+        }): void;
+        setPageVisibility({ isHidden, index, }: {
+            isHidden: boolean;
+            index: number;
+        }): void;
+        setPageSettingsSectionValue({ sectionName, propName, index, value, merge, viewport, }: {
+            sectionName: "footer" | "header" | "pages";
+            propName: "copyrightStyle" | "style" | "iconStyle" | "displayStyle" | "backgroundStyle" | "logoImage" | "logoImageStyle" | "isLogoOptional" | "viewport" | "isLogoVisible" | "logoTemplateImage" | "logoImageHeight" | "logoImageWidth" | "navigationStyles" | "navigation" | "logoImageUrl" | "logoDraftToken" | "logoVariation" | "logoImageBase64Url" | "backgroundColorEnabled" | "copyrightText" | "socialLinks" | "textFontFamily";
+            index?: number | undefined;
+            value: string | number | boolean | BrandPageCssStyle | import("../../../../brand-page").LinksItem[] | Partial<import("../../../../brand-page").ImageItem> | null | undefined;
+            merge?: boolean | undefined;
+            viewport: import("../../../../brand-page").ViewportsType;
+        }): void;
+        setPageSettingsSectionLogoImage({ sectionName, logoImage, logoTemplateImage, logoImageBase64Url, viewport, keepLogoVariation, logoImageHeight, logoImageWidth, }: {
+            logoImage: import("../../../../brand-page").LogoImageModel;
+            logoTemplateImage?: import("../../../../brand-page").LogoTemplateImageModel | undefined;
+            logoImageBase64Url: string | undefined;
+            sectionName: "footer" | "header" | "pages";
+            viewport: import("../../../../brand-page").ViewportsType;
+            keepLogoVariation?: boolean | undefined;
+            logoImageHeight?: string | undefined;
+            logoImageWidth?: string | undefined;
+        }): void;
+        updatePageSettingsSectionLogoImageStyle({ sectionName, viewport, logoImageHeight, logoImageWidth, }: {
+            sectionName: string;
+            viewport: string;
+            logoImageHeight: string | undefined;
+            logoImageWidth: string | undefined;
+        }): void;
+        updatePaymentConfigCurrency(updatedPaymentConfig: BrandPagePaymentConfig, newCurrency: BrandPagePaymentConfigCurrency): void;
+        setPageTitle({ pageTitle, pageIndex, }: {
+            pageTitle: string;
+            pageIndex: number;
+        }): void;
+        setCurrentPageIndexAndGoToPage({ pageIndex }: {
+            pageIndex: number;
+        }): void;
+        addNewPage(payload: {
+            title: string;
+        }): void;
+        setSelectedSectionName({ sectionName, }: {
+            sectionName?: "footer" | "header" | "pages" | undefined;
+        }): void;
+        setSectionCollapsedState({ sectionName, isCollapsed, }: {
+            sectionName: "footer" | "header" | "pages";
+            isCollapsed: boolean;
+        }): void;
+        collapseAllSections(): void;
+        setPreviousSelectedDisplayStyle(viewport: string, displayStyle: string): void;
+    }>;
 }, {
     selectedPaymentConfig: BrandPagePaymentConfig | undefined;
+    isCurrencyUpdating: boolean;
 }, {
     currencySymbol(): string;
     isPaymentConfigActive(): boolean;
@@ -382,6 +459,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     onAddPaymentProviderClick(): Promise<void>;
     onPaymentConfigSelected(paymentConfig: BrandPagePaymentConfig): void;
     updatePaymentConfig(paymentConfig: BrandPagePaymentConfig): void;
+    onCurrencySelected(selectedCurrency: BrandPagePaymentConfigCurrency): Promise<void>;
 }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     id: {
         type: StringConstructor;

package/lib/src/shared/content-settings/components/payment-config-field/PaymentConfigField.mixin.js

@@ -2,6 +2,8 @@ import { computed, defineComponent } from 'vue';
 import { useBrandPageContainerStore, useEventManagerStore, } from '../../../../brand-page-maker/stores';
 import { useShopConfigStore } from '../../../../shared/ecommerce-settings/store/shop-settings-store';
 import { paymentConfigTr } from '../../../../composables/useTranslate';
+import brandPageClient from '../../../../clients/brand-page-client';
+import { useUiPageSettingsStore } from '../../../../shared/page-settings/store';
 export default defineComponent({
     props: {
         id: {
@@ -24,6 +26,7 @@ export default defineComponent({
     },
     setup() {
         const brandPageContainerStore = useBrandPageContainerStore();
+        const uiPageSettingsStore = useUiPageSettingsStore();
         const eventManagerStore = useEventManagerStore();
         const shopConfigStore = useShopConfigStore();
         return {
@@ -32,11 +35,13 @@ export default defineComponent({
             brandPageContainerStore,
             eventManagerStore,
             shopConfigStore,
+            uiPageSettingsStore,
         };
     },
     emits: ['update:modelValue'],
     data: () => ({
         selectedPaymentConfig: undefined,
+        isCurrencyUpdating: false,
     }),
     computed: {
         currencySymbol() {
@@ -131,5 +136,16 @@ export default defineComponent({
             };
             this.$emit('update:modelValue', payload);
         },
+        async onCurrencySelected(selectedCurrency) {
+            if (this.selectedPaymentConfig.defaultCurrency ===
+                selectedCurrency.iso4127Code) {
+                return;
+            }
+            this.isCurrencyUpdating = true;
+            const updatedPaymentConfig = await brandPageClient.updatePaymentConfigCurrencyAsync(this.brandPageToken, this.selectedPaymentConfig.id, selectedCurrency.id);
+            this.uiPageSettingsStore.updatePaymentConfigCurrency(updatedPaymentConfig, selectedCurrency);
+            await this.brandPageContainerStore.saveBrandPage();
+            this.isCurrencyUpdating = false;
+        },
     },
 });

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

@@ -177,13 +177,13 @@ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import
     "onOn-toggle-state-change"?: ((...args: any[]) => any) | undefined;
 }>, {
     index: number;
+    settings: import("../../models").ContentItemFieldSettings;
     role: string;
     styles: Record<string, any>;
     placeholder: string;
     minLength: number;
     maxLength: number;
     value: string | false | undefined;
-    settings: import("../../models").ContentItemFieldSettings;
     attrs: Record<string, any>;
     isRequired: boolean;
     isToggled: boolean;

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

@@ -177,13 +177,13 @@ declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import
     "onOn-toggle-state-change"?: ((...args: any[]) => any) | undefined;
 }>, {
     index: number;
+    settings: import("../../models").ContentItemFieldSettings;
     role: string;
     styles: Record<string, any>;
     placeholder: string;
     minLength: number;
     maxLength: number;
     value: string | false | undefined;
-    settings: import("../../models").ContentItemFieldSettings;
     attrs: Record<string, any>;
     isRequired: boolean;
     isToggled: boolean;

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

@@ -191,13 +191,13 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     "onOn-toggle-state-change"?: ((...args: any[]) => any) | undefined;
 }>, {
     index: number;
+    settings: import("../../models").ContentItemFieldSettings;
     role: string;
     styles: Record<string, any>;
     placeholder: string;
     minLength: number;
     maxLength: number;
     value: string | false | undefined;
-    settings: import("../../models").ContentItemFieldSettings;
     attrs: Record<string, any>;
     isRequired: boolean;
     isToggled: boolean;

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

@@ -184,13 +184,13 @@ declare const _default: import("vue").DefineComponent<{}, {}, Record<string, any
     "onOn-toggle-state-change"?: ((...args: any[]) => any) | undefined;
 }>, {
     index: number;
+    settings: import("../../models").ContentItemFieldSettings;
     role: string;
     styles: Record<string, any>;
     placeholder: string;
     minLength: number;
     maxLength: number;
     value: string | false | undefined;
-    settings: import("../../models").ContentItemFieldSettings;
     attrs: Record<string, any>;
     isRequired: boolean;
     isToggled: boolean;

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

@@ -180,13 +180,13 @@ declare const _default: import("vue").DefineComponent<{}, {}, Record<string, any
     "onOn-toggle-state-change"?: ((...args: any[]) => any) | undefined;
 }>, {
     index: number;
+    settings: import("../../models").ContentItemFieldSettings;
     role: string;
     styles: Record<string, any>;
     placeholder: string;
     minLength: number;
     maxLength: number;
     value: string | false | undefined;
-    settings: import("../../models").ContentItemFieldSettings;
     attrs: Record<string, any>;
     isRequired: boolean;
     isToggled: boolean;

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

@@ -1,6 +1,7 @@
 import type { Content, ColorReplacement, ContentType, BrandPageType } from '../../brand-page';
 import type { ContentSettingsDisplayMode, ContentSettingsField, ContentSettingsFieldGroup, ContentSettingsMultiField, ValidateResult } from '../../brand-page-maker/models';
 import type { UserState } from '../../brand-page-maker/stores';
+import type { MediaBaseSelectedPayload } from '../my-uploads/models';
 export interface ContentItemFieldSettings {
     errorMessage: string;
     isValid: boolean;
@@ -51,6 +52,7 @@ export interface SetContentMediaPayload {
     mediaType?: string;
     size?: string;
     imageLink: string;
+    media?: MediaBaseSelectedPayload;
 }
 export interface ContentItem<TContent> {
     id: string;

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

@@ -2,6 +2,7 @@ import type { AddContentOption, ContentItem, ContentItemFieldSettings, ContentSe
 import type { ColorReplacement, Content } from '../../../brand-page';
 import type { UIEventSource } from '../../models';
 import type { ContentSettingsConfig, ItemCategory } from '../../../brand-page-maker/models';
+import type { MediaBaseSelectedPayload } from '../../my-uploads/models';
 export declare const CONTENT_SETTINGS_MODES: {
     readonly edit: "edit";
     readonly add: "add";
@@ -368,6 +369,7 @@ export declare const useUiContentSettingsStore: import("pinia").StoreDefinition<
         colorReplacements?: ColorReplacement[] | undefined;
         aspectRatio?: number | null | undefined;
     }): void;
+    _setSelectedItemMedia(selectedItemId: string | null, mediaPayload: MediaBaseSelectedPayload): void;
     _setItems({ items }: {
         items: ContentItem<any>[];
     }): void;
@@ -443,6 +445,7 @@ export declare const useUiContentSettingsStore: import("pinia").StoreDefinition<
         colorReplacements?: ColorReplacement[];
         aspectRatio?: number | null;
     }): void;
+    setSelectedItemMedia(selectedItemId: string | null, mediaPayload: MediaBaseSelectedPayload): void;
     setItems(payload: {
         items: ContentItem<Content>[];
     }): void;