@designcrowd/fe-shared-lib 1.6.10 → 1.7.0

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

@@ -1,203 +1,203 @@
-<template>
-  <Modal
-    :visible="props.isUpgradeModalVisible"
-    full-screen-breakpoint="sm"
-    :show-modal-background-image="!isDesignCom"
-    classes="tw-max-w-3xl tw-p-8"
-    @close-modal="closeUpgradeModal"
-  >
-    <div class="tw-flex tw-flex-col tw-text-black">
-      <div class="tw-flex tw-flex-col tw-pb-16 md:tw-pb-0">
-        <Icon
-          v-if="iconName"
-          :name="iconName"
-          :view-box="'0 0 100 100'"
-          size="5xl"
-          :class="{
-            'tw-text-primary-500': isDesignCom,
-            'tw-text-white': !isDesignCom,
-          }"
-          class="tw-mb-4"
-        />
-        <h2 v-if="titleText" class="tw-font-bold tw-text-3xl tw-mb-2">
-          {{ titleText }}
-        </h2>
-        <span class="tw-text-grayscale-600 tw-mb-2" v-html="descriptionText" />
-        <br />
-        <p class="tw-font-bold">{{ websiteContextualUpgradeModalTr('premiumUpgradeNote') }}</p>
-        <div class="tw-flex tw-flex-col md:tw-flex-row tw-mt-2">
-          <div
-            class="tw-order-last md:tw-order-first tw-w-full md:tw-w-3/4 tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4"
-          >
-            <div v-for="(feature, i) in features" :key="i" class="tw-flex tw-items-center tw-text-sm tw-rounded-md">
-              <Icon class="tw-text-success-500" name="check" size="sm" />
-              <span class="tw-ml-2 tw-text-grayscale-600" v-html="feature" />
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="bottom-bar tw-mt-2">
-        <div
-          class="bottom-bar tw-mt-6 tw-bg-grayscale-200 tw-flex tw-flex-col md:tw-flex-row md:tw-items-center md:tw-gap-2"
-        >
-          <div class="button-size md:tw-flex-1">
-            <Button
-              data-test-upgrade-button
-              :label="upgradeButtonText"
-              size="medium"
-              :variant="'primary'"
-              icon="chevron-right-wide"
-              :url="upgradeUrl"
-              classes="tw-w-full"
-              @on-click="onUpgradeClick"
-            />
-          </div>
-          <div class="button-size nothanks-button-mobile md:tw-flex-1">
-            <Button
-              data-test-upgrade-button
-              :label="websiteContextualUpgradeModalTr('closeButtonText')"
-              size="medium"
-              :variant="'no-border'"
-              classes="tw-w-full"
-              @on-click="closeUpgradeModal"
-            />
-          </div>
-        </div>
-      </div>
-    </div>
-  </Modal>
-</template>
-<script setup lang="ts">
-import { Ref, ref } from 'vue';
-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('');
-const iconName: Ref<string> = ref('');
-const upgradeButtonText: Ref<string> = ref('');
-const features: Ref<string[]> = ref([]);
-
-const props = defineProps<{
-  isUpgradeModalVisible: boolean;
-  isDesignCom: boolean;
-  upgradeUrl: string;
-  brandPageType: string;
-  contextType: WebsiteContextUpgradeType;
-}>();
-
-const FEATURE_KEYS = {
-  PREMIUM_CONTENT: 'PREMIUM_CONTENT',
-  STORE: 'STORE',
-  UNLIMITED_PAGES: 'UNLIMITED_PAGES',
-  CUSTOMER_CARE: 'CUSTOMER_CARE',
-  CUSTOM_DOMAIN: 'CUSTOM_DOMAIN',
-  CANCEL_ANYTIME: 'CANCEL_ANYTIME',
-  NO_WATERMARK: 'NO_WATERMARK',
-} as const;
-
-type FeatureKey = keyof typeof FEATURE_KEYS;
-
-const FEATURE_CONFIG: Record<FeatureKey, (websiteName: string) => string> = {
-  PREMIUM_CONTENT: () => websiteContextualUpgradeModalTr('featurePremiumContent'),
-  STORE: () => websiteContextualUpgradeModalTr('featureStore'),
-  UNLIMITED_PAGES: () => websiteContextualUpgradeModalTr('featureUnlimitedPages'),
-  CUSTOMER_CARE: () => websiteContextualUpgradeModalTr('featureCustomerCare'),
-  CUSTOM_DOMAIN: () => websiteContextualUpgradeModalTr('featureCustomDomain'),
-  CANCEL_ANYTIME: () =>
-    `<div class="tw-text-success-500"><strong>${websiteContextualUpgradeModalTr('featureCancelAnytime')}</strong></div>`,
-  NO_WATERMARK: (websiteName: string) => websiteContextualUpgradeModalTr('featureNoWatermark', { websiteName }),
-};
-
-const FEATURE_ORDERS: Record<string, FeatureKey[]> = {
-  PremiumContent: [
-    'PREMIUM_CONTENT',
-    'STORE',
-    'UNLIMITED_PAGES',
-    'CUSTOMER_CARE',
-    'CUSTOM_DOMAIN',
-    'CANCEL_ANYTIME',
-    'NO_WATERMARK',
-  ],
-  RemoveWatermark: [
-    'NO_WATERMARK',
-    'STORE',
-    'UNLIMITED_PAGES',
-    'CUSTOMER_CARE',
-    'PREMIUM_CONTENT',
-    'CANCEL_ANYTIME',
-    'CUSTOM_DOMAIN',
-  ],
-  Default: [
-    'UNLIMITED_PAGES',
-    'STORE',
-    'PREMIUM_CONTENT',
-    'CUSTOMER_CARE',
-    'CUSTOM_DOMAIN',
-    'CANCEL_ANYTIME',
-    'NO_WATERMARK',
-  ],
-};
-
-const toKebabCase = (value: string) =>
-  value
-    .replace(/([a-z0-9])([A-Z])/g, '$1-$2')
-    .replace(/([A-Z])([A-Z][a-z])/g, '$1-$2')
-    .toLowerCase();
-
-const getFeatureOrder = (websiteName: string) => {
-  const contextTypeKey =
-    props.contextType === WEBSITE_UPGRADE_CONTEXT_TYPES.Maps ||
-    props.contextType === WEBSITE_UPGRADE_CONTEXT_TYPES.Videos ||
-    props.contextType === WEBSITE_UPGRADE_CONTEXT_TYPES.ContactForm
-      ? 'PremiumContent'
-      : props.contextType;
-
-  const order = FEATURE_ORDERS[contextTypeKey] || FEATURE_ORDERS.Default;
-
-  features.value = order.map((key) => FEATURE_CONFIG[key](websiteName));
-};
-
-const initModalContent = (websiteName: string) => {
-  const titleForIcon = `upgradeTo${props.contextType}`;
-  iconName.value = `websites-${toKebabCase(titleForIcon)}`;
-
-  titleText.value = websiteContextualUpgradeModalTr(`${titleForIcon}.title`);
-  descriptionText.value = websiteContextualUpgradeModalTr(`${titleForIcon}.description`);
-  upgradeButtonText.value = websiteContextualUpgradeModalTr('upgradeButtonText');
-
-  getFeatureOrder(websiteName);
-};
-
-const websiteName = props.isDesignCom ? 'Design.com' : 'BrandCrowd';
-initModalContent(websiteName);
-
-const emit = defineEmits<{
-  'on-close-upgrade-modal': [];
-  'on-upgrade-button-clicked': [];
-}>();
-
-const closeUpgradeModal = () => {
-  emit('on-close-upgrade-modal');
-};
-
-const onUpgradeClick = () => {
-  emit('on-upgrade-button-clicked');
-};
-</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;
-}
-.button-size {
-  @apply tw-w-full md:tw-max-w-40;
-}
-@media (max-width: 768px) {
-  .nothanks-button-mobile {
-    @apply tw-hidden;
-  }
-}
-</style>
+<template>
+  <Modal
+    :visible="props.isUpgradeModalVisible"
+    full-screen-breakpoint="sm"
+    :show-modal-background-image="!isDesignCom"
+    classes="tw-max-w-3xl tw-p-8"
+    @close-modal="closeUpgradeModal"
+  >
+    <div class="tw-flex tw-flex-col tw-text-black">
+      <div class="tw-flex tw-flex-col tw-pb-16 md:tw-pb-0">
+        <Icon
+          v-if="iconName"
+          :name="iconName"
+          :view-box="'0 0 100 100'"
+          size="5xl"
+          :class="{
+            'tw-text-primary-500': isDesignCom,
+            'tw-text-white': !isDesignCom,
+          }"
+          class="tw-mb-4"
+        />
+        <h2 v-if="titleText" class="tw-font-bold tw-text-3xl tw-mb-2">
+          {{ titleText }}
+        </h2>
+        <span class="tw-text-grayscale-600 tw-mb-2" v-html="descriptionText" />
+        <br />
+        <p class="tw-font-bold">{{ websiteContextualUpgradeModalTr('premiumUpgradeNote') }}</p>
+        <div class="tw-flex tw-flex-col md:tw-flex-row tw-mt-2">
+          <div
+            class="tw-order-last md:tw-order-first tw-w-full md:tw-w-3/4 tw-grid tw-grid-cols-1 md:tw-grid-cols-2 tw-gap-4"
+          >
+            <div v-for="(feature, i) in features" :key="i" class="tw-flex tw-items-center tw-text-sm tw-rounded-md">
+              <Icon class="tw-text-success-500" name="check" size="sm" />
+              <span class="tw-ml-2 tw-text-grayscale-600" v-html="feature" />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="bottom-bar tw-mt-2">
+        <div
+          class="bottom-bar tw-mt-6 tw-bg-grayscale-200 tw-flex tw-flex-col md:tw-flex-row md:tw-items-center md:tw-gap-2"
+        >
+          <div class="button-size md:tw-flex-1">
+            <Button
+              data-test-upgrade-button
+              :label="upgradeButtonText"
+              size="medium"
+              :variant="'primary'"
+              icon="chevron-right-wide"
+              :url="upgradeUrl"
+              classes="tw-w-full"
+              @on-click="onUpgradeClick"
+            />
+          </div>
+          <div class="button-size nothanks-button-mobile md:tw-flex-1">
+            <Button
+              data-test-upgrade-button
+              :label="websiteContextualUpgradeModalTr('closeButtonText')"
+              size="medium"
+              :variant="'no-border'"
+              classes="tw-w-full"
+              @on-click="closeUpgradeModal"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </Modal>
+</template>
+<script setup lang="ts">
+import { Ref, ref } from 'vue';
+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('');
+const iconName: Ref<string> = ref('');
+const upgradeButtonText: Ref<string> = ref('');
+const features: Ref<string[]> = ref([]);
+
+const props = defineProps<{
+  isUpgradeModalVisible: boolean;
+  isDesignCom: boolean;
+  upgradeUrl: string;
+  brandPageType: string;
+  contextType: WebsiteContextUpgradeType;
+}>();
+
+const FEATURE_KEYS = {
+  PREMIUM_CONTENT: 'PREMIUM_CONTENT',
+  STORE: 'STORE',
+  UNLIMITED_PAGES: 'UNLIMITED_PAGES',
+  CUSTOMER_CARE: 'CUSTOMER_CARE',
+  CUSTOM_DOMAIN: 'CUSTOM_DOMAIN',
+  CANCEL_ANYTIME: 'CANCEL_ANYTIME',
+  NO_WATERMARK: 'NO_WATERMARK',
+} as const;
+
+type FeatureKey = keyof typeof FEATURE_KEYS;
+
+const FEATURE_CONFIG: Record<FeatureKey, (websiteName: string) => string> = {
+  PREMIUM_CONTENT: () => websiteContextualUpgradeModalTr('featurePremiumContent'),
+  STORE: () => websiteContextualUpgradeModalTr('featureStore'),
+  UNLIMITED_PAGES: () => websiteContextualUpgradeModalTr('featureUnlimitedPages'),
+  CUSTOMER_CARE: () => websiteContextualUpgradeModalTr('featureCustomerCare'),
+  CUSTOM_DOMAIN: () => websiteContextualUpgradeModalTr('featureCustomDomain'),
+  CANCEL_ANYTIME: () =>
+    `<div class="tw-text-success-500"><strong>${websiteContextualUpgradeModalTr('featureCancelAnytime')}</strong></div>`,
+  NO_WATERMARK: (websiteName: string) => websiteContextualUpgradeModalTr('featureNoWatermark', { websiteName }),
+};
+
+const FEATURE_ORDERS: Record<string, FeatureKey[]> = {
+  PremiumContent: [
+    'PREMIUM_CONTENT',
+    'STORE',
+    'UNLIMITED_PAGES',
+    'CUSTOMER_CARE',
+    'CUSTOM_DOMAIN',
+    'CANCEL_ANYTIME',
+    'NO_WATERMARK',
+  ],
+  RemoveWatermark: [
+    'NO_WATERMARK',
+    'STORE',
+    'UNLIMITED_PAGES',
+    'CUSTOMER_CARE',
+    'PREMIUM_CONTENT',
+    'CANCEL_ANYTIME',
+    'CUSTOM_DOMAIN',
+  ],
+  Default: [
+    'UNLIMITED_PAGES',
+    'STORE',
+    'PREMIUM_CONTENT',
+    'CUSTOMER_CARE',
+    'CUSTOM_DOMAIN',
+    'CANCEL_ANYTIME',
+    'NO_WATERMARK',
+  ],
+};
+
+const toKebabCase = (value: string) =>
+  value
+    .replace(/([a-z0-9])([A-Z])/g, '$1-$2')
+    .replace(/([A-Z])([A-Z][a-z])/g, '$1-$2')
+    .toLowerCase();
+
+const getFeatureOrder = (websiteName: string) => {
+  const contextTypeKey =
+    props.contextType === WEBSITE_UPGRADE_CONTEXT_TYPES.Maps ||
+    props.contextType === WEBSITE_UPGRADE_CONTEXT_TYPES.Videos ||
+    props.contextType === WEBSITE_UPGRADE_CONTEXT_TYPES.ContactForm
+      ? 'PremiumContent'
+      : props.contextType;
+
+  const order = FEATURE_ORDERS[contextTypeKey] || FEATURE_ORDERS.Default;
+
+  features.value = order.map((key) => FEATURE_CONFIG[key](websiteName));
+};
+
+const initModalContent = (websiteName: string) => {
+  const titleForIcon = `upgradeTo${props.contextType}`;
+  iconName.value = `websites-${toKebabCase(titleForIcon)}`;
+
+  titleText.value = websiteContextualUpgradeModalTr(`${titleForIcon}.title`);
+  descriptionText.value = websiteContextualUpgradeModalTr(`${titleForIcon}.description`);
+  upgradeButtonText.value = websiteContextualUpgradeModalTr('upgradeButtonText');
+
+  getFeatureOrder(websiteName);
+};
+
+const websiteName = props.isDesignCom ? 'Design.com' : 'BrandCrowd';
+initModalContent(websiteName);
+
+const emit = defineEmits<{
+  'on-close-upgrade-modal': [];
+  'on-upgrade-button-clicked': [];
+}>();
+
+const closeUpgradeModal = () => {
+  emit('on-close-upgrade-modal');
+};
+
+const onUpgradeClick = () => {
+  emit('on-upgrade-button-clicked');
+};
+</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;
+}
+.button-size {
+  @apply tw-w-full md:tw-max-w-40;
+}
+@media (max-width: 768px) {
+  .nothanks-button-mobile {
+    @apply tw-hidden;
+  }
+}
+</style>

package/src/experiences/components/WebsitesContextualUpgradeModal/i18n/website-contextual-upgrade-modal.de-DE.json

@@ -1,42 +1,42 @@
-{
-  "websiteContextualUpgradeModal": {
-    "upgradeButtonText": "Jetzt upgraden",
-    "closeButtonText": "Nein, danke",
-    "featureCustomerCare": "Kundenbetreuung rund um die Uhr",
-    "featureCustomDomain": "Eine benutzerdefinierte Domain verbinden",
-    "featureNoWatermark": "Kein {{websiteName}}-Wasserzeichen",
-    "featureUnlimitedPages": "Unbegrenzte Seiten",
-    "featurePremiumContent": "Kontaktformulare, Videos und Karten",
-    "featureStore": "Einfacher Online-Shop",
-    "featureCancelAnytime": "Jederzeit kündigen",
-    "premiumUpgradeNote": "Mit Premium erhalten Sie:",
-    "upgradeToAddPage": {
-      "title": "Mit einem Upgrade können Sie weitere Seiten hinzufügen.",
-      "description": "Sie haben das kostenlose Seitenlimit erreicht. Mit einem Upgrade können Sie Ihre Website weiter ausbauen und alle Premium-Funktionen nutzen."
-    },
-    "upgradeToContactForm": {
-      "title": "Upgraden, um das Kontaktformular freizuschalten",
-      "description": "Lassen Sie Besucher Sie direkt erreichen. Führen Sie ein Upgrade durch, um ein Kontaktformular zu Ihrer Website hinzuzufügen und auf alle Premium-Funktionen zuzugreifen."
-    },
-    "upgradeToMaps": {
-      "title": "Upgraden, um Karten freizuschalten",
-      "description": "Helfen Sie den Besuchern, Sie leicht zu finden. Führen Sie ein Upgrade durch, um interaktive Karten in Ihre Website einzubetten und auf alle Premium-Funktionen zuzugreifen."
-    },
-    "upgradeToVideos": {
-      "title": "Upgraden, um Videos freizuschalten",
-      "description": "Erwecken Sie Ihren Inhalt zum Leben. Führen Sie ein Upgrade durch, um Videos in Ihre Website einzubetten, sie abzuspielen und auf alle Premium-Funktionen zuzugreifen."
-    },
-    "upgradeToRemoveWatermark": {
-      "title": "Upgrade zum Entfernen des Wasserzeichens",
-      "description": "Machen Sie sie wirklich zu Ihrer eigenen. Führen Sie ein Upgrade durch, um unser Wasserzeichen von Ihrer Website zu entfernen und auf alle Premium-Funktionen zuzugreifen."
-    },
-    "upgradeToPublish": {
-      "title": "Zum Veröffentlichen upgraden",
-      "description": "Sie können mit jedem Abonnement eine Website veröffentlichen. Fügen Sie ein weiteres Abonnement hinzu, um diese Website zu veröffentlichen und auf alle Premium-Funktionen zuzugreifen."
-    },
-    "upgradeToGoogleAd": {
-      "title": "Upgraden, um Google AdSense freizuschalten",
-      "description": "Verbinden Sie Google AdSense und verdienen Sie Geld mit Ihrem Traffic. Führen Sie ein Upgrade durch, um alle Premium-Funktionen freizuschalten."
-    }
-  }
-}
+{
+  "websiteContextualUpgradeModal": {
+    "upgradeButtonText": "Jetzt upgraden",
+    "closeButtonText": "Nein, danke",
+    "featureCustomerCare": "Kundenbetreuung rund um die Uhr",
+    "featureCustomDomain": "Eine benutzerdefinierte Domain verbinden",
+    "featureNoWatermark": "Kein {{websiteName}}-Wasserzeichen",
+    "featureUnlimitedPages": "Unbegrenzte Seiten",
+    "featurePremiumContent": "Kontaktformulare, Videos und Karten",
+    "featureStore": "Einfacher Online-Shop",
+    "featureCancelAnytime": "Jederzeit kündigen",
+    "premiumUpgradeNote": "Mit Premium erhalten Sie:",
+    "upgradeToAddPage": {
+      "title": "Mit einem Upgrade können Sie weitere Seiten hinzufügen.",
+      "description": "Sie haben das kostenlose Seitenlimit erreicht. Mit einem Upgrade können Sie Ihre Website weiter ausbauen und alle Premium-Funktionen nutzen."
+    },
+    "upgradeToContactForm": {
+      "title": "Upgraden, um das Kontaktformular freizuschalten",
+      "description": "Lassen Sie Besucher Sie direkt erreichen. Führen Sie ein Upgrade durch, um ein Kontaktformular zu Ihrer Website hinzuzufügen und auf alle Premium-Funktionen zuzugreifen."
+    },
+    "upgradeToMaps": {
+      "title": "Upgraden, um Karten freizuschalten",
+      "description": "Helfen Sie den Besuchern, Sie leicht zu finden. Führen Sie ein Upgrade durch, um interaktive Karten in Ihre Website einzubetten und auf alle Premium-Funktionen zuzugreifen."
+    },
+    "upgradeToVideos": {
+      "title": "Upgraden, um Videos freizuschalten",
+      "description": "Erwecken Sie Ihren Inhalt zum Leben. Führen Sie ein Upgrade durch, um Videos in Ihre Website einzubetten, sie abzuspielen und auf alle Premium-Funktionen zuzugreifen."
+    },
+    "upgradeToRemoveWatermark": {
+      "title": "Upgrade zum Entfernen des Wasserzeichens",
+      "description": "Machen Sie sie wirklich zu Ihrer eigenen. Führen Sie ein Upgrade durch, um unser Wasserzeichen von Ihrer Website zu entfernen und auf alle Premium-Funktionen zuzugreifen."
+    },
+    "upgradeToPublish": {
+      "title": "Zum Veröffentlichen upgraden",
+      "description": "Sie können mit jedem Abonnement eine Website veröffentlichen. Fügen Sie ein weiteres Abonnement hinzu, um diese Website zu veröffentlichen und auf alle Premium-Funktionen zuzugreifen."
+    },
+    "upgradeToGoogleAd": {
+      "title": "Upgraden, um Google AdSense freizuschalten",
+      "description": "Verbinden Sie Google AdSense und verdienen Sie Geld mit Ihrem Traffic. Führen Sie ein Upgrade durch, um alle Premium-Funktionen freizuschalten."
+    }
+  }
+}

package/src/experiences/components/WebsitesContextualUpgradeModal/i18n/website-contextual-upgrade-modal.es-ES.json

@@ -1,42 +1,42 @@
-{
-  "websiteContextualUpgradeModal": {
-    "upgradeButtonText": "Hazte prémium ya",
-    "closeButtonText": "No, gracias",
-    "featureCustomerCare": "Atención al cliente 24/7",
-    "featureCustomDomain": "Conecta un dominio personalizado",
-    "featureNoWatermark": "Sin marca de agua {{websiteName}}",
-    "featureUnlimitedPages": "Páginas ilimitadas",
-    "featurePremiumContent": "Formularios de contacto, vídeos y mapas",
-    "featureStore": "Tienda online básica",
-    "featureCancelAnytime": "Cancela en cualquier momento",
-    "premiumUpgradeNote": "Con prémium, obtendrás:",
-    "upgradeToAddPage": {
-      "title": "Mejora para añadir más páginas",
-      "description": "Has alcanzado el límite de páginas gratis. Actualiza para seguir construyendo tu sitio y acceder a todas las características prémium."
-    },
-    "upgradeToContactForm": {
-      "title": "Actualiza para desbloquear el formulario de contacto.",
-      "description": "Deja que los visitantes lleguen hasta ti directamente. Actualiza para añadir un formulario de contacto a tu sitio y acceder a todas las características prémium."
-    },
-    "upgradeToMaps": {
-      "title": "Actualiza para desbloquear los mapas.",
-      "description": "Ayuda a los visitantes a encontrarte fácilmente. Actualiza para incrustar mapas interactivos en tu sitio y accede a todas las características prémium."
-    },
-    "upgradeToVideos": {
-      "title": "Actualiza para desbloquear vídeos",
-      "description": "Da vida a tu contenido. Actualiza para incrustar y reproducir vídeos en tu sitio y accede a todas las características prémium."
-    },
-    "upgradeToRemoveWatermark": {
-      "title": "Actualiza para eliminar marca de agua",
-      "description": "Hazlo tuyo de verdad. Actualiza para eliminar nuestra marca de agua de tu sitio web y accede a todas las características prémium."
-    },
-    "upgradeToPublish": {
-      "title": "Actualiza para publicar",
-      "description": "Cada suscripción te permite publicar un sitio web. Añade otra suscripción para publicar este sitio y acceder a todas las características prémium."
-    },
-    "upgradeToGoogleAd": {
-      "title": "Actualiza para desbloquear Google AdSense",
-      "description": "Conecta Google AdSense y empieza a ganar dinero con tu tráfico. Actualiza para desbloquear todas las características prémium."
-    }
-  }
-}
+{
+  "websiteContextualUpgradeModal": {
+    "upgradeButtonText": "Hazte prémium ya",
+    "closeButtonText": "No, gracias",
+    "featureCustomerCare": "Atención al cliente 24/7",
+    "featureCustomDomain": "Conecta un dominio personalizado",
+    "featureNoWatermark": "Sin marca de agua {{websiteName}}",
+    "featureUnlimitedPages": "Páginas ilimitadas",
+    "featurePremiumContent": "Formularios de contacto, vídeos y mapas",
+    "featureStore": "Tienda online básica",
+    "featureCancelAnytime": "Cancela en cualquier momento",
+    "premiumUpgradeNote": "Con prémium, obtendrás:",
+    "upgradeToAddPage": {
+      "title": "Mejora para añadir más páginas",
+      "description": "Has alcanzado el límite de páginas gratis. Actualiza para seguir construyendo tu sitio y acceder a todas las características prémium."
+    },
+    "upgradeToContactForm": {
+      "title": "Actualiza para desbloquear el formulario de contacto.",
+      "description": "Deja que los visitantes lleguen hasta ti directamente. Actualiza para añadir un formulario de contacto a tu sitio y acceder a todas las características prémium."
+    },
+    "upgradeToMaps": {
+      "title": "Actualiza para desbloquear los mapas.",
+      "description": "Ayuda a los visitantes a encontrarte fácilmente. Actualiza para incrustar mapas interactivos en tu sitio y accede a todas las características prémium."
+    },
+    "upgradeToVideos": {
+      "title": "Actualiza para desbloquear vídeos",
+      "description": "Da vida a tu contenido. Actualiza para incrustar y reproducir vídeos en tu sitio y accede a todas las características prémium."
+    },
+    "upgradeToRemoveWatermark": {
+      "title": "Actualiza para eliminar marca de agua",
+      "description": "Hazlo tuyo de verdad. Actualiza para eliminar nuestra marca de agua de tu sitio web y accede a todas las características prémium."
+    },
+    "upgradeToPublish": {
+      "title": "Actualiza para publicar",
+      "description": "Cada suscripción te permite publicar un sitio web. Añade otra suscripción para publicar este sitio y acceder a todas las características prémium."
+    },
+    "upgradeToGoogleAd": {
+      "title": "Actualiza para desbloquear Google AdSense",
+      "description": "Conecta Google AdSense y empieza a ganar dinero con tu tráfico. Actualiza para desbloquear todas las características prémium."
+    }
+  }
+}