@designcrowd/fe-shared-lib 1.5.10-kp-8 → 1.5.11-kp-1

package/dist/css/tailwind-brandCrowd.css

@@ -617,6 +617,9 @@ video {
 .tw-m-3 {
   margin: 0.75rem;
 }
+.tw-m-4 {
+  margin: 1rem;
+}
 .tw-m-5 {
   margin: 1.25rem;
 }
@@ -2147,6 +2150,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(17 21 23 / var(--tw-text-opacity));
 }
+.hover\:tw-text-primary-600:hover {
+  --tw-text-opacity: 1;
+  color: rgb(194 22 50 / var(--tw-text-opacity));
+}
 .hover\:tw-text-secondary-500:hover {
   --tw-text-opacity: 1;
   color: rgb(89 89 89 / var(--tw-text-opacity));
@@ -2301,6 +2308,10 @@ video {
 }
 @media (min-width: 768px) {
 
+  .md\:tw-relative {
+    position: relative;
+  }
+
   .md\:tw-right-6 {
     right: 1.5rem;
   }
@@ -2385,10 +2396,6 @@ video {
     width: 100%;
   }
 
-  .md\:tw-max-w-40 {
-    max-width: 10rem;
-  }
-
   .md\:tw-max-w-full {
     max-width: 100%;
   }
@@ -2456,6 +2463,10 @@ video {
        object-fit: contain;
   }
 
+  .md\:tw-p-0 {
+    padding: 0px;
+  }
+
   .md\:tw-p-2 {
     padding: 0.5rem;
   }

package/dist/css/tailwind-brandPage.css

@@ -617,6 +617,9 @@ video {
 .tw-m-3 {
   margin: 0.75rem;
 }
+.tw-m-4 {
+  margin: 1rem;
+}
 .tw-m-5 {
   margin: 1.25rem;
 }
@@ -1985,6 +1988,10 @@ video {
 }
 @media (min-width: 768px) {
 
+  .md\:tw-relative {
+    position: relative;
+  }
+
   .md\:tw-right-6 {
     right: 1.5rem;
   }
@@ -2069,10 +2076,6 @@ video {
     width: 100%;
   }
 
-  .md\:tw-max-w-40 {
-    max-width: 10rem;
-  }
-
   .md\:tw-max-w-full {
     max-width: 100%;
   }
@@ -2140,6 +2143,10 @@ video {
        object-fit: contain;
   }
 
+  .md\:tw-p-0 {
+    padding: 0px;
+  }
+
   .md\:tw-p-2 {
     padding: 0.5rem;
   }

package/dist/css/tailwind-crazyDomains.css

@@ -617,6 +617,9 @@ video {
 .tw-m-3 {
   margin: 0.75rem;
 }
+.tw-m-4 {
+  margin: 1rem;
+}
 .tw-m-5 {
   margin: 1.25rem;
 }
@@ -2147,6 +2150,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(79 89 92 / var(--tw-text-opacity));
 }
+.hover\:tw-text-primary-600:hover {
+  --tw-text-opacity: 1;
+  color: rgb(89 138 38 / var(--tw-text-opacity));
+}
 .hover\:tw-text-secondary-500:hover {
   --tw-text-opacity: 1;
   color: rgb(72 72 72 / var(--tw-text-opacity));
@@ -2301,6 +2308,10 @@ video {
 }
 @media (min-width: 768px) {
 
+  .md\:tw-relative {
+    position: relative;
+  }
+
   .md\:tw-right-6 {
     right: 1.5rem;
   }
@@ -2385,10 +2396,6 @@ video {
     width: 100%;
   }
 
-  .md\:tw-max-w-40 {
-    max-width: 10rem;
-  }
-
   .md\:tw-max-w-full {
     max-width: 100%;
   }
@@ -2456,6 +2463,10 @@ video {
        object-fit: contain;
   }
 
+  .md\:tw-p-0 {
+    padding: 0px;
+  }
+
   .md\:tw-p-2 {
     padding: 0.5rem;
   }

package/dist/css/tailwind-designCom.css

@@ -617,6 +617,9 @@ video {
 .tw-m-3 {
   margin: 0.75rem;
 }
+.tw-m-4 {
+  margin: 1rem;
+}
 .tw-m-5 {
   margin: 1.25rem;
 }
@@ -2147,6 +2150,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(23 23 23 / var(--tw-text-opacity));
 }
+.hover\:tw-text-primary-600:hover {
+  --tw-text-opacity: 1;
+  color: rgb(50 71 197 / var(--tw-text-opacity));
+}
 .hover\:tw-text-secondary-500:hover {
   --tw-text-opacity: 1;
   color: rgb(61 61 61 / var(--tw-text-opacity));
@@ -2301,6 +2308,10 @@ video {
 }
 @media (min-width: 768px) {
 
+  .md\:tw-relative {
+    position: relative;
+  }
+
   .md\:tw-right-6 {
     right: 1.5rem;
   }
@@ -2385,10 +2396,6 @@ video {
     width: 100%;
   }
 
-  .md\:tw-max-w-40 {
-    max-width: 10rem;
-  }
-
   .md\:tw-max-w-full {
     max-width: 100%;
   }
@@ -2456,6 +2463,10 @@ video {
        object-fit: contain;
   }
 
+  .md\:tw-p-0 {
+    padding: 0px;
+  }
+
   .md\:tw-p-2 {
     padding: 0.5rem;
   }

package/dist/css/tailwind-designCrowd.css

@@ -617,6 +617,9 @@ video {
 .tw-m-3 {
   margin: 0.75rem;
 }
+.tw-m-4 {
+  margin: 1rem;
+}
 .tw-m-5 {
   margin: 1.25rem;
 }
@@ -2147,6 +2150,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(39 52 56 / var(--tw-text-opacity));
 }
+.hover\:tw-text-primary-600:hover {
+  --tw-text-opacity: 1;
+  color: rgb(14 121 188 / var(--tw-text-opacity));
+}
 .hover\:tw-text-secondary-500:hover {
   --tw-text-opacity: 1;
   color: rgb(93 109 129 / var(--tw-text-opacity));
@@ -2301,6 +2308,10 @@ video {
 }
 @media (min-width: 768px) {
 
+  .md\:tw-relative {
+    position: relative;
+  }
+
   .md\:tw-right-6 {
     right: 1.5rem;
   }
@@ -2385,10 +2396,6 @@ video {
     width: 100%;
   }
 
-  .md\:tw-max-w-40 {
-    max-width: 10rem;
-  }
-
   .md\:tw-max-w-full {
     max-width: 100%;
   }
@@ -2456,6 +2463,10 @@ video {
        object-fit: contain;
   }
 
+  .md\:tw-p-0 {
+    padding: 0px;
+  }
+
   .md\:tw-p-2 {
     padding: 0.5rem;
   }

package/index.js

@@ -19,6 +19,11 @@ export { default as SellDomainNameWidget } from './src/experiences/components/Se
 export { default as PublishBrandPageModal } from './src/experiences/components/PublishBrandPageModal/PublishBrandPageModal.vue';
 export { default as PublishBrandPageCard } from './src/experiences/components/PublishBrandPageModal/PublishBrandPageCard.vue';
 export { default as WebsiteContextualUpgradeModal } from './src/experiences/components/WebsitesContextualUpgradeModal/WebsiteContextualUpgradeModal.vue';
+export {
+  WEBSITE_UPGRADE_CONTEXT_TYPES,
+  // Type-only export (TS consumers)
+  type WebsiteContextUpgradeType,
+} from './src/experiences/models/websiteContextualModel';
 
 export { setSharedLibLocaleAsync, tr } from './src/useSharedLibTranslate';
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@designcrowd/fe-shared-lib",
-  "version": "1.5.10-kp-8",
+  "version": "1.5.11-kp-1",
   "scripts": {
     "start": "run-p storybook watch:translation",
     "build": "npm run build:css --production",
@@ -71,8 +71,6 @@
     "postcss-import": "16.0.0",
     "postcss-nested": "6.0.1",
     "prettier": "3.2.4",
-    "react": "^19.2.0",
-    "react-dom": "^19.2.0",
     "storybook": "9.0.4",
     "stylelint": "16.2.1",
     "stylelint-config-standard": "36.0.0",

package/public/css/tailwind-brandCrowd.css

@@ -617,6 +617,9 @@ video {
 .theme-brandCrowd .tw-m-3 {
   margin: 0.75rem;
 }
+.theme-brandCrowd .tw-m-4 {
+  margin: 1rem;
+}
 .theme-brandCrowd .tw-m-5 {
   margin: 1.25rem;
 }
@@ -2147,6 +2150,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(17 21 23 / var(--tw-text-opacity));
 }
+.theme-brandCrowd .hover\:tw-text-primary-600:hover {
+  --tw-text-opacity: 1;
+  color: rgb(194 22 50 / var(--tw-text-opacity));
+}
 .theme-brandCrowd .hover\:tw-text-secondary-500:hover {
   --tw-text-opacity: 1;
   color: rgb(89 89 89 / var(--tw-text-opacity));
@@ -2343,9 +2350,6 @@ video {
 .theme-brandCrowd .md\:tw-w-full {
     width: 100%;
   }
-.theme-brandCrowd .md\:tw-max-w-40 {
-    max-width: 10rem;
-  }
 .theme-brandCrowd .md\:tw-max-w-full {
     max-width: 100%;
   }
@@ -2393,9 +2397,6 @@ video {
     border-top-right-radius: 0px;
     border-bottom-right-radius: 0px;
   }
-.theme-brandCrowd .md\:tw-border-none {
-    border-style: none;
-  }
 .theme-brandCrowd .md\:tw-object-contain {
     -o-object-fit: contain;
        object-fit: contain;

package/public/css/tailwind-brandPage.css

@@ -617,6 +617,9 @@ video {
 .theme-brandPage .tw-m-3 {
   margin: 0.75rem;
 }
+.theme-brandPage .tw-m-4 {
+  margin: 1rem;
+}
 .theme-brandPage .tw-m-5 {
   margin: 1.25rem;
 }
@@ -2027,9 +2030,6 @@ video {
 .theme-brandPage .md\:tw-w-full {
     width: 100%;
   }
-.theme-brandPage .md\:tw-max-w-40 {
-    max-width: 10rem;
-  }
 .theme-brandPage .md\:tw-max-w-full {
     max-width: 100%;
   }
@@ -2077,9 +2077,6 @@ video {
     border-top-right-radius: 0px;
     border-bottom-right-radius: 0px;
   }
-.theme-brandPage .md\:tw-border-none {
-    border-style: none;
-  }
 .theme-brandPage .md\:tw-object-contain {
     -o-object-fit: contain;
        object-fit: contain;

package/public/css/tailwind-crazyDomains.css

@@ -617,6 +617,9 @@ video {
 .theme-crazyDomains .tw-m-3 {
   margin: 0.75rem;
 }
+.theme-crazyDomains .tw-m-4 {
+  margin: 1rem;
+}
 .theme-crazyDomains .tw-m-5 {
   margin: 1.25rem;
 }
@@ -2147,6 +2150,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(79 89 92 / var(--tw-text-opacity));
 }
+.theme-crazyDomains .hover\:tw-text-primary-600:hover {
+  --tw-text-opacity: 1;
+  color: rgb(89 138 38 / var(--tw-text-opacity));
+}
 .theme-crazyDomains .hover\:tw-text-secondary-500:hover {
   --tw-text-opacity: 1;
   color: rgb(72 72 72 / var(--tw-text-opacity));
@@ -2343,9 +2350,6 @@ video {
 .theme-crazyDomains .md\:tw-w-full {
     width: 100%;
   }
-.theme-crazyDomains .md\:tw-max-w-40 {
-    max-width: 10rem;
-  }
 .theme-crazyDomains .md\:tw-max-w-full {
     max-width: 100%;
   }
@@ -2393,9 +2397,6 @@ video {
     border-top-right-radius: 0px;
     border-bottom-right-radius: 0px;
   }
-.theme-crazyDomains .md\:tw-border-none {
-    border-style: none;
-  }
 .theme-crazyDomains .md\:tw-object-contain {
     -o-object-fit: contain;
        object-fit: contain;

package/public/css/tailwind-designCom.css

@@ -617,6 +617,9 @@ video {
 .theme-designCom .tw-m-3 {
   margin: 0.75rem;
 }
+.theme-designCom .tw-m-4 {
+  margin: 1rem;
+}
 .theme-designCom .tw-m-5 {
   margin: 1.25rem;
 }
@@ -2147,6 +2150,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(23 23 23 / var(--tw-text-opacity));
 }
+.theme-designCom .hover\:tw-text-primary-600:hover {
+  --tw-text-opacity: 1;
+  color: rgb(50 71 197 / var(--tw-text-opacity));
+}
 .theme-designCom .hover\:tw-text-secondary-500:hover {
   --tw-text-opacity: 1;
   color: rgb(61 61 61 / var(--tw-text-opacity));
@@ -2343,9 +2350,6 @@ video {
 .theme-designCom .md\:tw-w-full {
     width: 100%;
   }
-.theme-designCom .md\:tw-max-w-40 {
-    max-width: 10rem;
-  }
 .theme-designCom .md\:tw-max-w-full {
     max-width: 100%;
   }
@@ -2393,9 +2397,6 @@ video {
     border-top-right-radius: 0px;
     border-bottom-right-radius: 0px;
   }
-.theme-designCom .md\:tw-border-none {
-    border-style: none;
-  }
 .theme-designCom .md\:tw-object-contain {
     -o-object-fit: contain;
        object-fit: contain;

package/public/css/tailwind-designCrowd.css

@@ -617,6 +617,9 @@ video {
 .theme-designCrowd .tw-m-3 {
   margin: 0.75rem;
 }
+.theme-designCrowd .tw-m-4 {
+  margin: 1rem;
+}
 .theme-designCrowd .tw-m-5 {
   margin: 1.25rem;
 }
@@ -2147,6 +2150,10 @@ video {
   --tw-text-opacity: 1;
   color: rgb(39 52 56 / var(--tw-text-opacity));
 }
+.theme-designCrowd .hover\:tw-text-primary-600:hover {
+  --tw-text-opacity: 1;
+  color: rgb(14 121 188 / var(--tw-text-opacity));
+}
 .theme-designCrowd .hover\:tw-text-secondary-500:hover {
   --tw-text-opacity: 1;
   color: rgb(93 109 129 / var(--tw-text-opacity));
@@ -2343,9 +2350,6 @@ video {
 .theme-designCrowd .md\:tw-w-full {
     width: 100%;
   }
-.theme-designCrowd .md\:tw-max-w-40 {
-    max-width: 10rem;
-  }
 .theme-designCrowd .md\:tw-max-w-full {
     max-width: 100%;
   }
@@ -2393,9 +2397,6 @@ video {
     border-top-right-radius: 0px;
     border-bottom-right-radius: 0px;
   }
-.theme-designCrowd .md\:tw-border-none {
-    border-style: none;
-  }
 .theme-designCrowd .md\:tw-object-contain {
     -o-object-fit: contain;
        object-fit: contain;

package/src/atoms/components/Icon/Icon.vue

@@ -414,6 +414,8 @@ import IconWebsitesUpgradeToVideos from './icons/websites/upgrade-to-videos.vue'
 import IconWebsitesUpgradeToMaps from './icons/websites/upgrade-to-maps.vue';
 import IconWebsitesUpgradeToGoogleAd from './icons/websites/upgrade-to-google-ad.vue';
 
+import IconGroup from './icons/group.vue';
+
 export default {
   components: {
     IconFile,
@@ -696,6 +698,8 @@ export default {
     IconBan,
     IconShape,
 
+    IconGroup,
+
     // Maker icons
     IconMakerAnimate,
     IconMakerCustomLandscape,

package/src/atoms/components/Icon/icons/group.vue

@@ -0,0 +1,6 @@
+<template>
+  <path
+    d="M3.08437 3.86161C2.80729 4.14435 2.47917 4.28571 2.1 4.28571C1.72083 4.28571 1.39271 4.14435 1.11563 3.86161C0.838542 3.57887 0.7 3.24405 0.7 2.85714C0.7 2.47024 0.838542 2.13542 1.11563 1.85268C1.39271 1.56994 1.72083 1.42857 2.1 1.42857C2.47917 1.42857 2.80729 1.56994 3.08437 1.85268C3.36146 2.13542 3.5 2.47024 3.5 2.85714C3.5 3.24405 3.36146 3.57887 3.08437 3.86161ZM12.8844 3.86161C12.6073 4.14435 12.2792 4.28571 11.9 4.28571C11.5208 4.28571 11.1927 4.14435 10.9156 3.86161C10.6385 3.57887 10.5 3.24405 10.5 2.85714C10.5 2.47024 10.6385 2.13542 10.9156 1.85268C11.1927 1.56994 11.5208 1.42857 11.9 1.42857C12.2792 1.42857 12.6073 1.56994 12.8844 1.85268C13.1615 2.13542 13.3 2.47024 13.3 2.85714C13.3 3.24405 13.1615 3.57887 12.8844 3.86161ZM12.6 5C12.9792 5 13.3073 5.14137 13.5844 5.42411C13.8615 5.70685 14 6.04167 14 6.42857V7.14286C14 7.33631 13.9271 7.50744 13.7812 7.65625C13.65 7.79018 13.4896 7.85714 13.3 7.85714H11.8562C11.8125 7.51488 11.7177 7.1875 11.5719 6.875C11.426 6.5625 11.2365 6.2872 11.0031 6.04911C10.7698 5.79613 10.5073 5.5878 10.2156 5.42411C10.4927 5.14137 10.8208 5 11.2 5H12.6ZM8.72812 4.26339C8.24687 4.75446 7.67083 5 7 5C6.32917 5 5.75313 4.75446 5.27187 4.26339C4.79063 3.77232 4.55 3.18452 4.55 2.5C4.55 1.81548 4.79063 1.22768 5.27187 0.736607C5.75313 0.245536 6.32917 0 7 0C7.67083 0 8.24687 0.245536 8.72812 0.736607C9.20938 1.22768 9.45 1.81548 9.45 2.5C9.45 3.18452 9.20938 3.77232 8.72812 4.26339ZM8.68437 5.71429C9.38437 5.71429 9.975 5.96726 10.4563 6.47321C10.9521 6.96429 11.2 7.56696 11.2 8.28125V8.92857C11.2 9.22619 11.0979 9.47917 10.8938 9.6875C10.6896 9.89583 10.4417 10 10.15 10H3.85C3.55833 10 3.31042 9.89583 3.10625 9.6875C2.90208 9.47917 2.8 9.22619 2.8 8.92857V8.28125C2.8 7.56696 3.04063 6.96429 3.52187 6.47321C4.01771 5.96726 4.61562 5.71429 5.31563 5.71429H5.5125C5.99375 5.95238 6.48958 6.07143 7 6.07143C7.51042 6.07143 8.00625 5.95238 8.4875 5.71429H8.68437ZM3.78437 5.42411C3.34687 5.6622 2.98229 5.99702 2.69062 6.42857C2.39896 6.86012 2.21667 7.33631 2.14375 7.85714H0.7C0.510417 7.85714 0.342708 7.79018 0.196875 7.65625C0.065625 7.50744 0 7.33631 0 7.14286V6.42857C0 6.04167 0.138542 5.70685 0.415625 5.42411C0.692708 5.14137 1.02083 5 1.4 5H2.8C3.17917 5 3.50729 5.14137 3.78437 5.42411Z"
+    fill="#3D3D3D"
+  />
+</template>

package/src/bundles/bundled-translations.de-DE.json

@@ -32,7 +32,9 @@
     "hasAlreadyPurchasedDomainCloseButtonLabel": "Nein, danke, vielleicht später",
     "selectDomainDropdownPlaceholder": "Domain auswählen",
     "websiteFriendlyName": "Website",
-    "digitalBusinessCardFriendlyName": "Digitale Visitenkarte"
+    "digitalBusinessCardFriendlyName": "Digitale Visitenkarte",
+    "alreadyHaveADomainLabel": "Besitzen Sie bereits eine Domain?",
+    "useExistingDomainLabel": "Meine vorhandene Domain verwenden"
   },
   "sellDomainNameList": {
     "freeDomainButtonLabel": "Kostenlose Domain",

package/src/bundles/bundled-translations.es-ES.json

@@ -32,7 +32,9 @@
     "hasAlreadyPurchasedDomainCloseButtonLabel": "No gracias, quizás más tarde",
     "selectDomainDropdownPlaceholder": "Selecciona un nombre de dominio",
     "websiteFriendlyName": "Sitio web",
-    "digitalBusinessCardFriendlyName": "Tarjeta de visita digital"
+    "digitalBusinessCardFriendlyName": "Tarjeta de visita digital",
+    "alreadyHaveADomainLabel": "¿Ya tienes un dominio?",
+    "useExistingDomainLabel": "Usa mi dominio existente"
   },
   "sellDomainNameList": {
     "freeDomainButtonLabel": "Dominio gratis",

package/src/bundles/bundled-translations.fr-CA.json

@@ -32,7 +32,9 @@
     "hasAlreadyPurchasedDomainCloseButtonLabel": "Non merci, peut-être plus tard",
     "selectDomainDropdownPlaceholder": "Sélectionner un nom de domaine",
     "websiteFriendlyName": "Site Web",
-    "digitalBusinessCardFriendlyName": "Carte professionnelle numérique"
+    "digitalBusinessCardFriendlyName": "Carte professionnelle numérique",
+    "alreadyHaveADomainLabel": "Vous avez déjà un domaine?",
+    "useExistingDomainLabel": "Utiliser mon nom de domaine existant"
   },
   "sellDomainNameList": {
     "freeDomainButtonLabel": "Domaine gratuit",

package/src/bundles/bundled-translations.fr-FR.json

@@ -32,7 +32,9 @@
     "hasAlreadyPurchasedDomainCloseButtonLabel": "Non merci, peut-être plus tard",
     "selectDomainDropdownPlaceholder": "Sélectionner un nom de domaine",
     "websiteFriendlyName": "Site Web",
-    "digitalBusinessCardFriendlyName": "Carte de visite numérique"
+    "digitalBusinessCardFriendlyName": "Carte de visite numérique",
+    "alreadyHaveADomainLabel": "Vous avez déjà un domaine ?",
+    "useExistingDomainLabel": "Utiliser mon nom de domaine existant"
   },
   "sellDomainNameList": {
     "freeDomainButtonLabel": "Domaine gratuit",

package/src/bundles/bundled-translations.json

@@ -32,7 +32,9 @@
     "hasAlreadyPurchasedDomainCloseButtonLabel": "No thanks, maybe later",
     "selectDomainDropdownPlaceholder": "Select domain name",
     "websiteFriendlyName": "Website",
-    "digitalBusinessCardFriendlyName": "Digital Business Card"
+    "digitalBusinessCardFriendlyName": "Digital Business Card",
+    "alreadyHaveADomainLabel": "Already have a domain?",
+    "useExistingDomainLabel": "Use my existing domain"
   },
   "sellDomainNameList": {
     "freeDomainButtonLabel": "Free Domain",

package/src/bundles/bundled-translations.pt-BR.json

@@ -32,7 +32,9 @@
     "hasAlreadyPurchasedDomainCloseButtonLabel": "Não, obrigado. Talvez depois",
     "selectDomainDropdownPlaceholder": "Selecionar nome de domínio",
     "websiteFriendlyName": "Site",
-    "digitalBusinessCardFriendlyName": "Cartão de visita digital"
+    "digitalBusinessCardFriendlyName": "Cartão de visita digital",
+    "alreadyHaveADomainLabel": "Já tem um domínio?",
+    "useExistingDomainLabel": "Usar meu domínio existente"
   },
   "sellDomainNameList": {
     "freeDomainButtonLabel": "Domínio gratuito",

package/src/bundles/bundled-translations.pt-PT.json

@@ -32,7 +32,9 @@
     "hasAlreadyPurchasedDomainCloseButtonLabel": "Não, obrigado, talvez mais tarde",
     "selectDomainDropdownPlaceholder": "Selecionar nome de domínio",
     "websiteFriendlyName": "Website",
-    "digitalBusinessCardFriendlyName": "Cartão de visita digital"
+    "digitalBusinessCardFriendlyName": "Cartão de visita digital",
+    "alreadyHaveADomainLabel": "Já tem um domínio?",
+    "useExistingDomainLabel": "Utilizar o meu domínio existente"
   },
   "sellDomainNameList": {
     "freeDomainButtonLabel": "Domínio gratuito",

package/src/experiences/components/PublishBrandPageModal/PublishBrandPageModal.vue

@@ -42,6 +42,7 @@
           :brand-page-type="brandPageType"
           @on-slug-changed="onSlugChanged"
           @internal-publish-brand-page="onInternalPublishBrandPage"
+          @on-use-existing-domain="onUseExistingDomain"
         >
           <template #recommended>
             <slot name="recommended" />
@@ -287,6 +288,7 @@ export default {
     'on-view-more-domains',
     'on-slug-changed',
     'on-show-domain-modal',
+    'on-use-existing-domain',
   ],
   setup() {
     return {
@@ -387,6 +389,9 @@ export default {
     onSlugChanged(e) {
       this.$emit('on-slug-changed', e);
     },
+    onUseExistingDomain() {
+      this.$emit('on-use-existing-domain');
+    },
     onInternalPublishBrandPage(slug, customdomain) {
       this.$emit('internal-publish-brand-page', slug, customdomain);
     },

package/src/experiences/components/PublishBrandPageModal/i18n/publish-brand-page-modal.de-DE.json

@@ -1,24 +1,26 @@
 {
-  "publishBrandPageModal" : {
-    "firstTimePublishHeaderLabel" : "Legen Sie die URL für {{brandPageDisplayName}} fest",
-    "sitePublishedLabel" : "Seite veröffentlicht!",
-    "publishSuccessLabel" : "Ihr {{brandPageDisplayName}} ist live! Beginnen Sie mit der Nutzung Ihres Links:",
-    "freePublishCardTitleLabel" : "Freie Adresse",
-    "freePublishCardDescriptionLabel" : "Wählen Sie jetzt eine kostenlose Adresse zur Veröffentlichung aus. Sie können die URL später jederzeit bearbeiten",
-    "slugInputPlaceholderYourNameLabel" : "ihr-name",
-    "slugInputPlaceholderYourBusinessNameLabel" : "ihr-firmen-name",
-    "freeDomainLabel" : "Kostenlose Domain",
-    "purchasedDomainLabel" : "Erworbene Domain",
-    "setUrlLabel" : "URL festlegen",
-    "publishLabel" : "Veröffentlichen",
-    "viewMoreDomainLabel" : "WEITERE DOMAINS ANZEIGEN",
-    "viewMyWebsiteLabel" : "{{brandPageDisplayName}} anzeigen",
-    "copyLabel" : "Kopieren",
-    "copySuccessLabel" : "Kopiert!",
-    "publishedSuccessDescriptionLabel" : "Kaufen Sie eine passende Domain für Ihre Marke",
-    "hasAlreadyPurchasedDomainCloseButtonLabel" : "Nein, danke, vielleicht später",
-    "selectDomainDropdownPlaceholder" : "Domain auswählen",
-    "websiteFriendlyName" : "Website",
-    "digitalBusinessCardFriendlyName" : "Digitale Visitenkarte"
+  "publishBrandPageModal": {
+    "firstTimePublishHeaderLabel": "Legen Sie die URL für {{brandPageDisplayName}} fest",
+    "sitePublishedLabel": "Seite veröffentlicht!",
+    "publishSuccessLabel": "Ihr {{brandPageDisplayName}} ist live! Beginnen Sie mit der Nutzung Ihres Links:",
+    "freePublishCardTitleLabel": "Freie Adresse",
+    "freePublishCardDescriptionLabel": "Wählen Sie jetzt eine kostenlose Adresse zur Veröffentlichung aus. Sie können die URL später jederzeit bearbeiten",
+    "slugInputPlaceholderYourNameLabel": "ihr-name",
+    "slugInputPlaceholderYourBusinessNameLabel": "ihr-firmen-name",
+    "freeDomainLabel": "Kostenlose Domain",
+    "purchasedDomainLabel": "Erworbene Domain",
+    "setUrlLabel": "URL festlegen",
+    "publishLabel": "Veröffentlichen",
+    "viewMoreDomainLabel": "WEITERE DOMAINS ANZEIGEN",
+    "viewMyWebsiteLabel": "{{brandPageDisplayName}} anzeigen",
+    "copyLabel": "Kopieren",
+    "copySuccessLabel": "Kopiert!",
+    "publishedSuccessDescriptionLabel": "Kaufen Sie eine passende Domain für Ihre Marke",
+    "hasAlreadyPurchasedDomainCloseButtonLabel": "Nein, danke, vielleicht später",
+    "selectDomainDropdownPlaceholder": "Domain auswählen",
+    "websiteFriendlyName": "Website",
+    "digitalBusinessCardFriendlyName": "Digitale Visitenkarte",
+    "alreadyHaveADomainLabel": "Besitzen Sie bereits eine Domain?",
+    "useExistingDomainLabel": "Meine vorhandene Domain verwenden"
   }
 }

package/src/experiences/components/PublishBrandPageModal/i18n/publish-brand-page-modal.es-ES.json

@@ -1,24 +1,26 @@
 {
-  "publishBrandPageModal" : {
-    "firstTimePublishHeaderLabel" : "Establece la URL para {{brandPageDisplayName}}",
-    "sitePublishedLabel" : "¡Sitio publicado!",
-    "publishSuccessLabel" : "¡Tu {{brandPageDisplayName}} está activo! Comienza a usar tu enlace:",
-    "freePublishCardTitleLabel" : "Dirección gratuita",
-    "freePublishCardDescriptionLabel" : "Elige una dirección gratuita para publicar ahora. Siempre puedes editar la URL más tarde",
-    "slugInputPlaceholderYourNameLabel" : "tu-nombre",
-    "slugInputPlaceholderYourBusinessNameLabel" : "nombre-de-tu-negocio",
-    "freeDomainLabel" : "Dominio gratis",
-    "purchasedDomainLabel" : "Dominio adquirido",
-    "setUrlLabel" : "Establece URL",
-    "publishLabel" : "Publicar",
-    "viewMoreDomainLabel" : "VER MÁS DOMINIOS",
-    "viewMyWebsiteLabel" : "Ver {{brandPageDisplayName}}",
-    "copyLabel" : "Copiar",
-    "copySuccessLabel" : "¡Copiado!",
-    "publishedSuccessDescriptionLabel" : "Compra un nombre de dominio que coincida con tu marca",
-    "hasAlreadyPurchasedDomainCloseButtonLabel" : "No gracias, quizás más tarde",
-    "selectDomainDropdownPlaceholder" : "Selecciona un nombre de dominio",
-    "websiteFriendlyName" : "Sitio web",
-    "digitalBusinessCardFriendlyName" : "Tarjeta de visita digital"
+  "publishBrandPageModal": {
+    "firstTimePublishHeaderLabel": "Establece la URL para {{brandPageDisplayName}}",
+    "sitePublishedLabel": "¡Sitio publicado!",
+    "publishSuccessLabel": "¡Tu {{brandPageDisplayName}} está activo! Comienza a usar tu enlace:",
+    "freePublishCardTitleLabel": "Dirección gratuita",
+    "freePublishCardDescriptionLabel": "Elige una dirección gratuita para publicar ahora. Siempre puedes editar la URL más tarde",
+    "slugInputPlaceholderYourNameLabel": "tu-nombre",
+    "slugInputPlaceholderYourBusinessNameLabel": "nombre-de-tu-negocio",
+    "freeDomainLabel": "Dominio gratis",
+    "purchasedDomainLabel": "Dominio adquirido",
+    "setUrlLabel": "Establece URL",
+    "publishLabel": "Publicar",
+    "viewMoreDomainLabel": "VER MÁS DOMINIOS",
+    "viewMyWebsiteLabel": "Ver {{brandPageDisplayName}}",
+    "copyLabel": "Copiar",
+    "copySuccessLabel": "¡Copiado!",
+    "publishedSuccessDescriptionLabel": "Compra un nombre de dominio que coincida con tu marca",
+    "hasAlreadyPurchasedDomainCloseButtonLabel": "No gracias, quizás más tarde",
+    "selectDomainDropdownPlaceholder": "Selecciona un nombre de dominio",
+    "websiteFriendlyName": "Sitio web",
+    "digitalBusinessCardFriendlyName": "Tarjeta de visita digital",
+    "alreadyHaveADomainLabel": "¿Ya tienes un dominio?",
+    "useExistingDomainLabel": "Usa mi dominio existente"
   }
 }

package/src/experiences/components/PublishBrandPageModal/i18n/publish-brand-page-modal.fr-CA.json

@@ -1,24 +1,26 @@
 {
-  "publishBrandPageModal" : {
-    "firstTimePublishHeaderLabel" : "Définissez l'URL pour {{brandPageDisplayName}}",
-    "sitePublishedLabel" : "Site publié !",
-    "publishSuccessLabel" : "Votre {{brandPageDisplayName}} est en ligne ! Commencez à utiliser votre lien :",
-    "freePublishCardTitleLabel" : "Adresse libre",
-    "freePublishCardDescriptionLabel" : "Choisissez une adresse gratuite pour publier maintenant. Vous pouvez toujours modifier l'URL plus tard",
-    "slugInputPlaceholderYourNameLabel" : "your-name",
-    "slugInputPlaceholderYourBusinessNameLabel" : "nom-de-votre-entreprise",
-    "freeDomainLabel" : "Domaine gratuit",
-    "purchasedDomainLabel" : "Domaine acheté",
-    "setUrlLabel" : "Définir l'URL",
-    "publishLabel" : "Publier",
-    "viewMoreDomainLabel" : "VOIR PLUS DE NOMS DE DOMAINE",
-    "viewMyWebsiteLabel" : "Voir {{brandPageDisplayName}}",
-    "copyLabel" : "Copier",
-    "copySuccessLabel" : "Copié !",
-    "publishedSuccessDescriptionLabel" : "Achetez un nom de domaine correspondant à votre marque",
-    "hasAlreadyPurchasedDomainCloseButtonLabel" : "Non merci, peut-être plus tard",
-    "selectDomainDropdownPlaceholder" : "Sélectionner un nom de domaine",
-    "websiteFriendlyName" : "Site Web",
-    "digitalBusinessCardFriendlyName" : "Carte professionnelle numérique"
+  "publishBrandPageModal": {
+    "firstTimePublishHeaderLabel": "Définissez l'URL pour {{brandPageDisplayName}}",
+    "sitePublishedLabel": "Site publié !",
+    "publishSuccessLabel": "Votre {{brandPageDisplayName}} est en ligne ! Commencez à utiliser votre lien :",
+    "freePublishCardTitleLabel": "Adresse libre",
+    "freePublishCardDescriptionLabel": "Choisissez une adresse gratuite pour publier maintenant. Vous pouvez toujours modifier l'URL plus tard",
+    "slugInputPlaceholderYourNameLabel": "your-name",
+    "slugInputPlaceholderYourBusinessNameLabel": "nom-de-votre-entreprise",
+    "freeDomainLabel": "Domaine gratuit",
+    "purchasedDomainLabel": "Domaine acheté",
+    "setUrlLabel": "Définir l'URL",
+    "publishLabel": "Publier",
+    "viewMoreDomainLabel": "VOIR PLUS DE NOMS DE DOMAINE",
+    "viewMyWebsiteLabel": "Voir {{brandPageDisplayName}}",
+    "copyLabel": "Copier",
+    "copySuccessLabel": "Copié !",
+    "publishedSuccessDescriptionLabel": "Achetez un nom de domaine correspondant à votre marque",
+    "hasAlreadyPurchasedDomainCloseButtonLabel": "Non merci, peut-être plus tard",
+    "selectDomainDropdownPlaceholder": "Sélectionner un nom de domaine",
+    "websiteFriendlyName": "Site Web",
+    "digitalBusinessCardFriendlyName": "Carte professionnelle numérique",
+    "alreadyHaveADomainLabel": "Vous avez déjà un domaine?",
+    "useExistingDomainLabel": "Utiliser mon nom de domaine existant"
   }
 }

package/src/experiences/components/PublishBrandPageModal/i18n/publish-brand-page-modal.fr-FR.json

@@ -1,24 +1,26 @@
 {
-  "publishBrandPageModal" : {
-    "firstTimePublishHeaderLabel" : "Définissez l'URL pour {{brandPageDisplayName}}",
-    "sitePublishedLabel" : "Site publié !",
-    "publishSuccessLabel" : "Votre {{brandPageDisplayName}} est en ligne ! Commencez à utiliser votre lien :",
-    "freePublishCardTitleLabel" : "Adresse libre",
-    "freePublishCardDescriptionLabel" : "Choisissez une adresse gratuite pour publier maintenant. Vous pouvez toujours modifier l'URL plus tard",
-    "slugInputPlaceholderYourNameLabel" : "your-name",
-    "slugInputPlaceholderYourBusinessNameLabel" : "nom-de-votre-entreprise",
-    "freeDomainLabel" : "Domaine gratuit",
-    "purchasedDomainLabel" : "Domaine acheté",
-    "setUrlLabel" : "Définir l'URL",
-    "publishLabel" : "Publier",
-    "viewMoreDomainLabel" : "VOIR PLUS DE NOMS DE DOMAINE",
-    "viewMyWebsiteLabel" : "Voir {{brandPageDisplayName}}",
-    "copyLabel" : "Copier",
-    "copySuccessLabel" : "Copié !",
-    "publishedSuccessDescriptionLabel" : "Achetez un nom de domaine correspondant à votre marque",
-    "hasAlreadyPurchasedDomainCloseButtonLabel" : "Non merci, peut-être plus tard",
-    "selectDomainDropdownPlaceholder" : "Sélectionner un nom de domaine",
-    "websiteFriendlyName" : "Site Web",
-    "digitalBusinessCardFriendlyName" : "Carte de visite numérique"
+  "publishBrandPageModal": {
+    "firstTimePublishHeaderLabel": "Définissez l'URL pour {{brandPageDisplayName}}",
+    "sitePublishedLabel": "Site publié !",
+    "publishSuccessLabel": "Votre {{brandPageDisplayName}} est en ligne ! Commencez à utiliser votre lien :",
+    "freePublishCardTitleLabel": "Adresse libre",
+    "freePublishCardDescriptionLabel": "Choisissez une adresse gratuite pour publier maintenant. Vous pouvez toujours modifier l'URL plus tard",
+    "slugInputPlaceholderYourNameLabel": "your-name",
+    "slugInputPlaceholderYourBusinessNameLabel": "nom-de-votre-entreprise",
+    "freeDomainLabel": "Domaine gratuit",
+    "purchasedDomainLabel": "Domaine acheté",
+    "setUrlLabel": "Définir l'URL",
+    "publishLabel": "Publier",
+    "viewMoreDomainLabel": "VOIR PLUS DE NOMS DE DOMAINE",
+    "viewMyWebsiteLabel": "Voir {{brandPageDisplayName}}",
+    "copyLabel": "Copier",
+    "copySuccessLabel": "Copié !",
+    "publishedSuccessDescriptionLabel": "Achetez un nom de domaine correspondant à votre marque",
+    "hasAlreadyPurchasedDomainCloseButtonLabel": "Non merci, peut-être plus tard",
+    "selectDomainDropdownPlaceholder": "Sélectionner un nom de domaine",
+    "websiteFriendlyName": "Site Web",
+    "digitalBusinessCardFriendlyName": "Carte de visite numérique",
+    "alreadyHaveADomainLabel": "Vous avez déjà un domaine ?",
+    "useExistingDomainLabel": "Utiliser mon nom de domaine existant"
   }
 }

package/src/experiences/components/PublishBrandPageModal/i18n/publish-brand-page-modal.json

@@ -19,6 +19,8 @@
     "hasAlreadyPurchasedDomainCloseButtonLabel": "No thanks, maybe later",
     "selectDomainDropdownPlaceholder": "Select domain name",
     "websiteFriendlyName": "Website",
-    "digitalBusinessCardFriendlyName": "Digital Business Card"
+    "digitalBusinessCardFriendlyName": "Digital Business Card",
+    "alreadyHaveADomainLabel": "Already have a domain?",
+    "useExistingDomainLabel": "Use my existing domain"
   }
 }

package/src/experiences/components/PublishBrandPageModal/i18n/publish-brand-page-modal.pt-BR.json

@@ -1,24 +1,26 @@
 {
-  "publishBrandPageModal" : {
-    "firstTimePublishHeaderLabel" : "Defina o URL para {{brandPageDisplayName}}",
-    "sitePublishedLabel" : "Site publicado!",
-    "publishSuccessLabel" : "Seu {{brandPageDisplayName}} está ativo! Comece a usar seu link:",
-    "freePublishCardTitleLabel" : "Endereço gratuito",
-    "freePublishCardDescriptionLabel" : "Escolha um endereço gratuito para publicar agora. Você pode editar o URL depois",
-    "slugInputPlaceholderYourNameLabel" : "Seu nome",
-    "slugInputPlaceholderYourBusinessNameLabel" : "nome-da-sua-empresa",
-    "freeDomainLabel" : "Domínio gratuito",
-    "purchasedDomainLabel" : "Domínio comprado",
-    "setUrlLabel" : "Definir URL",
-    "publishLabel" : "Publicar",
-    "viewMoreDomainLabel" : "Ver mais domínios",
-    "viewMyWebsiteLabel" : "Ver {{brandPageDisplayName}}",
-    "copyLabel" : "Copiar",
-    "copySuccessLabel" : "Copiado!",
-    "publishedSuccessDescriptionLabel" : "Compre um nome de domínio que corresponda à sua marca",
-    "hasAlreadyPurchasedDomainCloseButtonLabel" : "Não, obrigado. Talvez depois",
-    "selectDomainDropdownPlaceholder" : "Selecionar nome de domínio",
-    "websiteFriendlyName" : "Site",
-    "digitalBusinessCardFriendlyName" : "Cartão de visita digital"
+  "publishBrandPageModal": {
+    "firstTimePublishHeaderLabel": "Defina o URL para {{brandPageDisplayName}}",
+    "sitePublishedLabel": "Site publicado!",
+    "publishSuccessLabel": "Seu {{brandPageDisplayName}} está ativo! Comece a usar seu link:",
+    "freePublishCardTitleLabel": "Endereço gratuito",
+    "freePublishCardDescriptionLabel": "Escolha um endereço gratuito para publicar agora. Você pode editar o URL depois",
+    "slugInputPlaceholderYourNameLabel": "Seu nome",
+    "slugInputPlaceholderYourBusinessNameLabel": "nome-da-sua-empresa",
+    "freeDomainLabel": "Domínio gratuito",
+    "purchasedDomainLabel": "Domínio comprado",
+    "setUrlLabel": "Definir URL",
+    "publishLabel": "Publicar",
+    "viewMoreDomainLabel": "Ver mais domínios",
+    "viewMyWebsiteLabel": "Ver {{brandPageDisplayName}}",
+    "copyLabel": "Copiar",
+    "copySuccessLabel": "Copiado!",
+    "publishedSuccessDescriptionLabel": "Compre um nome de domínio que corresponda à sua marca",
+    "hasAlreadyPurchasedDomainCloseButtonLabel": "Não, obrigado. Talvez depois",
+    "selectDomainDropdownPlaceholder": "Selecionar nome de domínio",
+    "websiteFriendlyName": "Site",
+    "digitalBusinessCardFriendlyName": "Cartão de visita digital",
+    "alreadyHaveADomainLabel": "Já tem um domínio?",
+    "useExistingDomainLabel": "Usar meu domínio existente"
   }
 }

package/src/experiences/components/PublishBrandPageModal/i18n/publish-brand-page-modal.pt-PT.json

@@ -1,24 +1,26 @@
 {
-  "publishBrandPageModal" : {
-    "firstTimePublishHeaderLabel" : "Defina o URL para {{brandPageDisplayName}}",
-    "sitePublishedLabel" : "Site publicado!",
-    "publishSuccessLabel" : "A sua página {{brandPageDisplayName}} está ativa! Comece a utilizar o link:",
-    "freePublishCardTitleLabel" : "Endereço gratuito",
-    "freePublishCardDescriptionLabel" : "Escolha um endereço gratuito para publicar agora. Pode sempre editar o URL mais tarde",
-    "slugInputPlaceholderYourNameLabel" : "o-seu-nome",
-    "slugInputPlaceholderYourBusinessNameLabel" : "nome-da-sua-empresa",
-    "freeDomainLabel" : "Domínio gratuito",
-    "purchasedDomainLabel" : "Domínio comprado",
-    "setUrlLabel" : "Definir URL",
-    "publishLabel" : "Publicar",
-    "viewMoreDomainLabel" : "VER MAIS DOMÍNIOS",
-    "viewMyWebsiteLabel" : "Ver {{brandPageDisplayName}}",
-    "copyLabel" : "Copiar",
-    "copySuccessLabel" : "Copiado!",
-    "publishedSuccessDescriptionLabel" : "Compre um nome de domínio que corresponda à sua marca",
-    "hasAlreadyPurchasedDomainCloseButtonLabel" : "Não, obrigado, talvez mais tarde",
-    "selectDomainDropdownPlaceholder" : "Selecionar nome de domínio",
-    "websiteFriendlyName" : "Website",
-    "digitalBusinessCardFriendlyName" : "Cartão de visita digital"
+  "publishBrandPageModal": {
+    "firstTimePublishHeaderLabel": "Defina o URL para {{brandPageDisplayName}}",
+    "sitePublishedLabel": "Site publicado!",
+    "publishSuccessLabel": "A sua página {{brandPageDisplayName}} está ativa! Comece a utilizar o link:",
+    "freePublishCardTitleLabel": "Endereço gratuito",
+    "freePublishCardDescriptionLabel": "Escolha um endereço gratuito para publicar agora. Pode sempre editar o URL mais tarde",
+    "slugInputPlaceholderYourNameLabel": "o-seu-nome",
+    "slugInputPlaceholderYourBusinessNameLabel": "nome-da-sua-empresa",
+    "freeDomainLabel": "Domínio gratuito",
+    "purchasedDomainLabel": "Domínio comprado",
+    "setUrlLabel": "Definir URL",
+    "publishLabel": "Publicar",
+    "viewMoreDomainLabel": "VER MAIS DOMÍNIOS",
+    "viewMyWebsiteLabel": "Ver {{brandPageDisplayName}}",
+    "copyLabel": "Copiar",
+    "copySuccessLabel": "Copiado!",
+    "publishedSuccessDescriptionLabel": "Compre um nome de domínio que corresponda à sua marca",
+    "hasAlreadyPurchasedDomainCloseButtonLabel": "Não, obrigado, talvez mais tarde",
+    "selectDomainDropdownPlaceholder": "Selecionar nome de domínio",
+    "websiteFriendlyName": "Website",
+    "digitalBusinessCardFriendlyName": "Cartão de visita digital",
+    "alreadyHaveADomainLabel": "Já tem um domínio?",
+    "useExistingDomainLabel": "Utilizar o meu domínio existente"
   }
 }

package/src/experiences/components/PublishBrandPageModal/views/PublishWhenNoDomainsView.vue

@@ -46,6 +46,14 @@
     <div class="tw-mt-4">
       <slot name="recommended" />
     </div>
+    <div class="tw-m-4 tw-text-center">
+      <p :class="{ 'tw-text-grayscale-600': isDesignCom }">
+        {{ alreadyHaveADomainLabel }}
+        <a href="#" class="tw-text-primary-500 hover:tw-text-primary-600" @click.prevent="onUseExistingDomain">{{
+          useExistingDomainLabel
+        }}</a>
+      </p>
+    </div>
   </div>
 </template>
 <script>
@@ -107,7 +115,7 @@ export default {
       default: '',
     },
   },
-  emits: ['internal-publish-brand-page', 'on-slug-changed'],
+  emits: ['internal-publish-brand-page', 'on-slug-changed', 'on-use-existing-domain'],
   setup() {
     return {
       publishBrandPageModalTr,
@@ -116,6 +124,8 @@ export default {
       slugInputPlaceholderYourNameLabel: publishBrandPageModalTr('slugInputPlaceholderYourNameLabel'),
       slugInputPlaceholderYourBusinessNameLabel: publishBrandPageModalTr('slugInputPlaceholderYourBusinessNameLabel'),
       publishLabel: publishBrandPageModalTr('publishLabel'),
+      alreadyHaveADomainLabel: publishBrandPageModalTr('alreadyHaveADomainLabel'),
+      useExistingDomainLabel: publishBrandPageModalTr('useExistingDomainLabel'),
     };
   },
   data() {
@@ -163,6 +173,9 @@ export default {
     onPublish() {
       this.$emit('internal-publish-brand-page', this.internalSlug);
     },
+    onUseExistingDomain() {
+      this.$emit('on-use-existing-domain');
+    },
   },
 };
 </script>

package/src/experiences/components/WebsitesContextualUpgradeModal/WebsiteContextualUpgradeModal.vue

@@ -73,6 +73,7 @@ import Modal from '../../../atoms/components/Modal/Modal.vue';
 import Button from '../../../atoms/components/Button/Button.vue';
 import Icon from '../../../atoms/components/Icon/Icon.vue';
 import { websiteContextualUpgradeModalTr } from '../../../useSharedLibTranslate';
+import { WEBSITE_UPGRADE_CONTEXT_TYPES, type WebsiteContextUpgradeType } from '../../models/WebsiteContextualModel';
 
 const titleText: Ref<string> = ref('');
 const descriptionText: Ref<string> = ref('');
@@ -80,24 +81,12 @@ const iconName: Ref<string> = ref('');
 const upgradeButtonText: Ref<string> = ref('');
 const features: Ref<string[]> = ref([]);
 
-const CONTEXT_TYPES = {
-  ContactForm: 'ContactForm',
-  Videos: 'Videos',
-  Maps: 'Maps',
-  AddPage: 'AddPage',
-  Publish: 'Publish',
-  RemoveWatermark: 'RemoveWatermark',
-  GoogleAd: 'GoogleAd',
-} as const;
-
-type ContextUpgradeType = keyof typeof CONTEXT_TYPES;
-
 const props = defineProps<{
   isUpgradeModalVisible: boolean;
   isDesignCom: boolean;
   upgradeUrl: string;
   brandPageType: string;
-  contextType: ContextUpgradeType;
+  contextType: WebsiteContextUpgradeType;
 }>();
 
 const FEATURE_KEYS = {
@@ -161,9 +150,9 @@ const toKebabCase = (value: string) =>
 
 const getFeatureOrder = (websiteName: string) => {
   const contextTypeKey =
-    props.contextType === CONTEXT_TYPES.Maps ||
-    props.contextType === CONTEXT_TYPES.Videos ||
-    props.contextType === CONTEXT_TYPES.ContactForm
+    props.contextType === WEBSITE_UPGRADE_CONTEXT_TYPES.Maps ||
+    props.contextType === WEBSITE_UPGRADE_CONTEXT_TYPES.Videos ||
+    props.contextType === WEBSITE_UPGRADE_CONTEXT_TYPES.ContactForm
       ? 'PremiumContent'
       : props.contextType;
 
@@ -201,7 +190,7 @@ const onUpgradeClick = () => {
 </script>
 <style scoped>
 .bottom-bar {
-  @apply tw-absolute tw-p-4 tw-bottom-0 tw-left-0 tw-w-full tw-border-t tw-border-grayscale-300 md:tw-p-0 md:tw-relative md:tw-border-none;
+  @apply tw-absolute tw-p-4 tw-bottom-0 tw-left-0 tw-w-full tw-border-t tw-border-gray-300 md:tw-p-0 md:tw-relative md:tw-border-none;
 }
 .button-size {
   @apply tw-w-full md:tw-max-w-40;

package/src/experiences/models/websiteContextualModel.ts

@@ -0,0 +1,11 @@
+export const WEBSITE_UPGRADE_CONTEXT_TYPES = {
+  ContactForm: 'ContactForm',
+  Videos: 'Videos',
+  Maps: 'Maps',
+  AddPage: 'AddPage',
+  Publish: 'Publish',
+  RemoveWatermark: 'RemoveWatermark',
+  GoogleAd: 'GoogleAd',
+} as const;
+
+export type WebsiteContextUpgradeType = keyof typeof WEBSITE_UPGRADE_CONTEXT_TYPES;