@designcrowd/library.brand-page 5.17.2 → 5.17.3

package/lib/src/mockServiceWorker.js

@@ -7,7 +7,7 @@
  * - Please do NOT modify this file.
  */
 
-const PACKAGE_VERSION = '2.12.3'
+const PACKAGE_VERSION = '2.12.10'
 const INTEGRITY_CHECKSUM = '4db4a41e972cec1b64cc569c66952d82'
 const IS_MOCKED_RESPONSE = Symbol('isMockedResponse')
 const activeClientIds = new Set()

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

@@ -206,6 +206,20 @@ export default defineComponent({
             this.clearFieldValue();
         },
     },
+    mounted() {
+        if (this.field.fieldTypeAssessor && this.field.validator) {
+            const validatorResult = this.field.validator(this.content);
+            const isInvalid = validatorResult === false ||
+                (typeof validatorResult === 'object' && !validatorResult.isValid);
+            if (isInvalid) {
+                this.clearFieldValue();
+            }
+            this.contentSettingsStore.validateItem({
+                id: this.id,
+                name: this.field.name,
+            });
+        }
+    },
     methods: {
         onFieldChanged(payload) {
             if (payload.multipleValues) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@designcrowd/library.brand-page",
   "description": "A collection of Maker/Designer applications",
-  "version": "5.17.2",
+  "version": "5.17.3",
   "author": "Design.com Eng",
   "license": "UNLICENSED",
   "type": "module",

package/src/brand-page/components/about-section/AboutSection.vue

@@ -9,6 +9,8 @@
         'about-container': context.isBrandSite,
         'about-container--padding tw-py-10': !isFullImage,
         'mobile-about-container--padding': isFullImage,
+        'side-full-media-container':
+          isFullImage && (isRightAligned || isLeftAligned),
       }"
     >
       <Media
@@ -64,6 +66,7 @@
             'tw-relative tw-overflow-hidden': !viewModel.imageUrl,
             'full-square-image': isFullImage,
             'container-image': !isFullImage,
+            'tw-mb-4': isMobileDevice,
           }"
           :class="{
             'tw-flex tw-justify-center': isDividedContent,
@@ -117,6 +120,9 @@ export default {
   max-width: var(--brandsite-max-width);
   margin: 0 auto;
 }
+.side-full-media-container {
+  max-width: 100% !important;
+}
 .about-container--padding {
   padding-left: var(--page-padding);
   padding-right: var(--page-padding);
@@ -177,7 +183,6 @@ export default {
 }
 
 .about-container :deep(.full-square-image) {
-  @apply tw-mb-4;
   width: 100%;
   aspect-ratio: 1/1;
   object-fit: cover;
@@ -195,6 +200,7 @@ export default {
   width: 100%;
   height: fit-content;
 }
+
 @media (max-width: 767px) {
   .about-container :deep(.mob_img--left) {
     @apply tw-block tw-w-full;

package/src/brand-page-maker/components/brand-page-maker/BrandPageMaker.vue

@@ -258,7 +258,7 @@ export default {
 }
 
 .c-save-bar {
-  @apply tw-absolute tw-top-0 tw-left-0 tw-w-full tw-p-4 tw-box-border tw-z-20 tw-transition-all tw-duration-300 tw-ease-out tw-transform tw--translate-y-1/2 tw-opacity-0;
+  @apply tw-absolute tw-top-0 tw-left-0 tw-w-full tw-p-4 tw-box-border tw-z-[100] tw-transition-all tw-duration-300 tw-ease-out tw-transform tw--translate-y-1/2 tw-opacity-0;
 }
 
 .c-save-bar--visible {

package/src/brand-page-maker/validators/section-button.validator.ts

@@ -14,6 +14,10 @@ const MISSING_BUTTON_TEL_MESSAGE = () => validatorTr('invalidTelMessage');
 
 const MISSING_PAGE_SLUG_MESSAGE = () => validatorTr('selectAPage');
 
+const containsAtSymbol = (value: unknown): boolean => {
+  return typeof value === 'string' && value.includes('@');
+};
+
 export const textValidator: ContentValidator<BannerSectionContent> = (
   section,
 ): ValidateResult => {
@@ -39,7 +43,7 @@ export const urlValidator: ContentValidator<
 > = (section): ValidateResult => {
   if (
     section.buttonLinkType === BUTTON_LINK_TYPE.url &&
-    !isURL(section.url) &&
+    (!isURL(section.url) || containsAtSymbol(section.url)) &&
     section.buttonText !== false &&
     section.buttonText?.length > 0
   ) {

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

@@ -249,6 +249,23 @@ export default defineComponent({
       this.clearFieldValue();
     },
   },
+  mounted() {
+    if (this.field.fieldTypeAssessor && this.field.validator) {
+      const validatorResult = this.field.validator(this.content);
+      const isInvalid =
+        validatorResult === false ||
+        (typeof validatorResult === 'object' && !validatorResult.isValid);
+
+      if (isInvalid) {
+        this.clearFieldValue();
+      }
+
+      this.contentSettingsStore.validateItem({
+        id: this.id,
+        name: this.field.name,
+      });
+    }
+  },
   methods: {
     onFieldChanged(payload: UpdateItemValuePayload<unknown>) {
       if (payload.multipleValues) {