@weni/unnnic-system 3.2.7-alpha.0 → 3.2.8

package/src/types/unnnic-utils.d.ts

@@ -1,88 +1,88 @@
 export type UnnnicColorToken =
-  | "background-solo"
-  | "background-sky"
-  | "background-grass"
-  | "background-carpet"
-  | "background-snow"
-  | "background-lightest"
-  | "background-white"
-  | "neutral-black"
-  | "neutral-darkest"
-  | "neutral-dark"
-  | "neutral-cloudy"
-  | "neutral-cleanest"
-  | "neutral-clean"
-  | "neutral-soft"
-  | "neutral-lightest"
-  | "neutral-light"
-  | "neutral-white"
-  | "neutral-snow"
-  | "feedback-red"
-  | "feedback-green"
-  | "feedback-yellow"
-  | "feedback-blue"
-  | "feedback-grey"
-  | "aux-blue"
-  | "aux-purple"
-  | "aux-orange"
-  | "aux-lemon"
-  | "aux-pink"
-  | "aux-baby-blue"
-  | "aux-baby-yellow"
-  | "aux-baby-red"
-  | "aux-baby-green"
-  | "aux-baby-pink"
-  | "aux-green-100"
-  | "aux-green-300"
-  | "aux-green-500"
-  | "aux-green-700"
-  | "aux-green-900"
-  | "aux-blue-100"
-  | "aux-blue-300"
-  | "aux-blue-500"
-  | "aux-blue-700"
-  | "aux-blue-900"
-  | "aux-purple-100"
-  | "aux-purple-300"
-  | "aux-purple-500"
-  | "aux-purple-700"
-  | "aux-purple-900"
-  | "aux-red-100"
-  | "aux-red-300"
-  | "aux-red-500"
-  | "aux-red-700"
-  | "aux-red-900"
-  | "aux-orange-100"
-  | "aux-orange-300"
-  | "aux-orange-500"
-  | "aux-orange-700"
-  | "aux-orange-900"
-  | "aux-yellow-100"
-  | "aux-yellow-300"
-  | "aux-yellow-500"
-  | "aux-yellow-700"
-  | "aux-yellow-900"
-  | "floweditor-blue"
-  | "floweditor-purple"
-  | "floweditor-wine"
-  | "floweditor-orange"
-  | "floweditor-pink"
-  | "floweditor-turquoise"
-  | "floweditor-green"
-  | "weni-50"
-  | "weni-100"
-  | "weni-200"
-  | "weni-300"
-  | "weni-400"
-  | "weni-500"
-  | "weni-600"
-  | "weni-700"
-  | "weni-800"
-  | "weni-900"
-  | "weni-950"
-  | "brand-weni"
-  | "brand-weni-dark"
-  | "brand-weni-soft"
-  | "brand-sec-dark"
-  | "brand-sec-soft"
-  | "brand-sec";
+  | 'background-solo'
+  | 'background-sky'
+  | 'background-grass'
+  | 'background-carpet'
+  | 'background-snow'
+  | 'background-lightest'
+  | 'background-white'
+  | 'neutral-black'
+  | 'neutral-darkest'
+  | 'neutral-dark'
+  | 'neutral-cloudy'
+  | 'neutral-cleanest'
+  | 'neutral-clean'
+  | 'neutral-soft'
+  | 'neutral-lightest'
+  | 'neutral-light'
+  | 'neutral-white'
+  | 'neutral-snow'
+  | 'feedback-red'
+  | 'feedback-green'
+  | 'feedback-yellow'
+  | 'feedback-blue'
+  | 'feedback-grey'
+  | 'aux-blue'
+  | 'aux-purple'
+  | 'aux-orange'
+  | 'aux-lemon'
+  | 'aux-pink'
+  | 'aux-baby-blue'
+  | 'aux-baby-yellow'
+  | 'aux-baby-red'
+  | 'aux-baby-green'
+  | 'aux-baby-pink'
+  | 'aux-green-100'
+  | 'aux-green-300'
+  | 'aux-green-500'
+  | 'aux-green-700'
+  | 'aux-green-900'
+  | 'aux-blue-100'
+  | 'aux-blue-300'
+  | 'aux-blue-500'
+  | 'aux-blue-700'
+  | 'aux-blue-900'
+  | 'aux-purple-100'
+  | 'aux-purple-300'
+  | 'aux-purple-500'
+  | 'aux-purple-700'
+  | 'aux-purple-900'
+  | 'aux-red-100'
+  | 'aux-red-300'
+  | 'aux-red-500'
+  | 'aux-red-700'
+  | 'aux-red-900'
+  | 'aux-orange-100'
+  | 'aux-orange-300'
+  | 'aux-orange-500'
+  | 'aux-orange-700'
+  | 'aux-orange-900'
+  | 'aux-yellow-100'
+  | 'aux-yellow-300'
+  | 'aux-yellow-500'
+  | 'aux-yellow-700'
+  | 'aux-yellow-900'
+  | 'floweditor-blue'
+  | 'floweditor-purple'
+  | 'floweditor-wine'
+  | 'floweditor-orange'
+  | 'floweditor-pink'
+  | 'floweditor-turquoise'
+  | 'floweditor-green'
+  | 'weni-50'
+  | 'weni-100'
+  | 'weni-200'
+  | 'weni-300'
+  | 'weni-400'
+  | 'weni-500'
+  | 'weni-600'
+  | 'weni-700'
+  | 'weni-800'
+  | 'weni-900'
+  | 'weni-950'
+  | 'brand-weni'
+  | 'brand-weni-dark'
+  | 'brand-weni-soft'
+  | 'brand-sec-dark'
+  | 'brand-sec-soft'
+  | 'brand-sec';

package/src/types/vue-shims.d.ts

@@ -2,4 +2,4 @@ declare module '*.vue' {
   import type { DefineComponent } from 'vue';
   const component: DefineComponent<{}, {}, any>;
   export default component;
-} 
+}

package/src/types/vueuse-overrides.d.ts

@@ -2,6 +2,6 @@ declare module '@vueuse/components' {
   export interface OnClickOutsideOptions {
     [key: string]: any;
   }
-  
+
   export const vOnClickOutside: any;
-} 
+}

package/src/utils/plugins/i18n.js

@@ -1,4 +1,3 @@
-/* eslint-disable camelcase */
 import { createI18n } from 'vue-i18n';
 
 import en from '../../locales/en.json';

package/dist/components/TemplatePreview/TemplatePreview.vue.d.ts

@@ -1,9 +0,0 @@
-import { Template } from './types';
-interface Props {
-    template?: Template | null;
-}
-declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
-    template: Template | null;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLElement>;
-export default _default;
-//# sourceMappingURL=TemplatePreview.vue.d.ts.map

package/dist/components/TemplatePreview/TemplatePreview.vue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TemplatePreview.vue.d.ts","sourceRoot":"","sources":["../../../src/components/TemplatePreview/TemplatePreview.vue"],"names":[],"mappings":"AAgGA;AA6PA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAQxC,UAAU,KAAK;IACb,QAAQ,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;CAC5B;;cADY,QAAQ,GAAG,IAAI;;AAkN5B,wBAQG"}

package/dist/components/TemplatePreview/TemplatePreviewModal.vue.d.ts

@@ -1,15 +0,0 @@
-import { Template } from './types';
-interface Props {
-    locale?: string;
-    template: Template;
-    modelValue: boolean;
-}
-declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    close: () => any;
-}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
-    onClose?: (() => any) | undefined;
-}>, {
-    locale: string;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
-export default _default;
-//# sourceMappingURL=TemplatePreviewModal.vue.d.ts.map

package/dist/components/TemplatePreview/TemplatePreviewModal.vue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"TemplatePreviewModal.vue.d.ts","sourceRoot":"","sources":["../../../src/components/TemplatePreview/TemplatePreviewModal.vue"],"names":[],"mappings":"AAWA;AAwDA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAUxC,UAAU,KAAK;IACb,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,QAAQ,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;CACrB;;;;;;YAHU,MAAM;;AAgGjB,wBASG"}

package/dist/unnnic.mjs

@@ -1,186 +0,0 @@
-import { bf as c, bb as s, bG as e, aQ as r, bm as t, bp as u, aI as o, aJ as U, bc as b, bd as l, aV as d, aX as C, aY as m, aZ as p, a$ as g, bA as T, a_ as h, bi as I, bC as S, bS as D, bD as M, bQ as A, bB as P, by as v, bJ as w, bK as x, bL as B, bM as R, bO as L, bP as N, b0 as k, c0 as F, bH as E, b1 as f, bn as j, bs as y, b$ as z, bx as H, bo as q, bT as G, bU as J, bu as K, aO as O, aP as Q, bR as V, aD as W, aE as X, aR as Y, aT as Z, aS as _, bw as $, bg as nn, aF as an, aH as cn, aG as sn, bj as en, b4 as rn, b5 as tn, b6 as un, b7 as on, bE as Un, ba as bn, bX as ln, bt as dn, bI as Cn, b2 as mn, bN as pn, b9 as gn, b8 as Tn, bY as hn, aK as In, aL as Sn, aW as Dn, bh as Mn, br as An, bF as Pn, bq as vn, bk as wn, aM as xn, bV as Bn, aN as Rn, bl as Ln, be as Nn, bZ as kn, b_ as Fn, bz as En, aU as fn, bW as jn, bv as yn, b3 as zn, c as Hn, U as qn, Q as Gn, M as Jn, ag as Kn, o as On, Y as Qn, $ as Vn, f as Wn, g as Xn, N as Yn, O as Zn, t as _n, w as $n, x as na, y as aa, A as ia, aa as ca, z as sa, T as ea, ac as ra, as as ta, ad as ua, aq as oa, ab as Ua, a8 as ba, aj as la, ak as da, al as Ca, am as ma, ao as pa, ap as ga, B as Ta, aC as ha, ah as Ia, C as Sa, Z as Da, a2 as Ma, aB as Aa, a7 as Pa, _ as va, at as wa, au as xa, a4 as Ba, m as Ra, n as La, ar as Na, u as ka, a as Fa, p as Ea, r as fa, q as ja, a6 as ya, R as za, b as Ha, e as qa, d as Ga, V as Ja, F as Ka, G as Oa, H as Qa, I as Va, ae as Wa, L as Xa, ax as Ya, a3 as Za, ai as _a, D as $a, an as ni, K as ai, J as ii, ay as ci, i as si, j as ei, v as ri, S as ti, a1 as ui, af as oi, a0 as Ui, W as bi, k as li, av as di, l as Ci, X as mi, P as pi, az as gi, aA as Ti, a9 as hi, s as Ii, aw as Si, a5 as Di, E as Mi } from "./index-802ab669.mjs";
-import "vue";
-export {
-  c as UnnnicAccordion,
-  s as UnnnicAlert,
-  e as UnnnicAudioRecorder,
-  r as UnnnicAvatarIcon,
-  t as UnnnicBanner,
-  u as UnnnicBreadcrumb,
-  o as UnnnicButton,
-  U as UnnnicButtonIcon,
-  b as UnnnicCallAlert,
-  l as UnnnicCallModal,
-  d as UnnnicCard,
-  C as UnnnicCardCompany,
-  m as UnnnicCardData,
-  p as UnnnicCardImage,
-  g as UnnnicCardInformation,
-  T as UnnnicCardNumber,
-  h as UnnnicCardProject,
-  I as UnnnicCarousel,
-  S as UnnnicChartBar,
-  D as UnnnicChartFunnel,
-  M as UnnnicChartLine,
-  A as UnnnicChartMultiLine,
-  P as UnnnicChartRainbow,
-  v as UnnnicChatText,
-  w as UnnnicChatsContact,
-  x as UnnnicChatsDashboardTagLive,
-  B as UnnnicChatsHeader,
-  R as UnnnicChatsMessage,
-  L as UnnnicChatsNavbar,
-  N as UnnnicChatsUserAvatar,
-  k as UnnnicCheckbox,
-  F as UnnnicChip,
-  E as UnnnicCircleProgressBar,
-  f as UnnnicCollapse,
-  j as UnnnicComment,
-  y as UnnnicDataArea,
-  z as UnnnicDataTable,
-  H as UnnnicDateFilter,
-  q as UnnnicDatePicker,
-  G as UnnnicDisclaimer,
-  J as UnnnicDrawer,
-  K as UnnnicDropArea,
-  O as UnnnicDropdown,
-  Q as UnnnicDropdownItem,
-  V as UnnnicEmojiPicker,
-  W as UnnnicFontSize,
-  X as UnnnicFormElement,
-  Y as UnnnicIcon,
-  Z as UnnnicIconLoading,
-  _ as UnnnicIconSvg,
-  $ as UnnnicImportCard,
-  nn as UnnnicIndicator,
-  an as UnnnicInput,
-  cn as UnnnicInputDatePicker,
-  sn as UnnnicInputNext,
-  en as UnnnicLabel,
-  rn as UnnnicModal,
-  tn as UnnnicModalDialog,
-  un as UnnnicModalNext,
-  on as UnnnicModalUpload,
-  Un as UnnnicMoodRating,
-  bn as UnnnicMultiSelect,
-  ln as UnnnicNavigator,
-  dn as UnnnicPagination,
-  Cn as UnnnicProgressBar,
-  mn as UnnnicRadio,
-  pn as UnnnicReplyMessage,
-  gn as UnnnicSelectItem,
-  Tn as UnnnicSelectSmart,
-  hn as UnnnicSelectTime,
-  In as UnnnicSidebar,
-  Sn as UnnnicSidebarItem,
-  Dn as UnnnicSimpleCard,
-  Mn as UnnnicSkeletonLoading,
-  An as UnnnicSlider,
-  Pn as UnnnicStarRating,
-  vn as UnnnicSwitch,
-  wn as UnnnicTab,
-  xn as UnnnicTable,
-  Bn as UnnnicTableNext,
-  Rn as UnnnicTableRow,
-  Ln as UnnnicTabsExpanded,
-  Nn as UnnnicTag,
-  kn as UnnnicTemplatePreview,
-  Fn as UnnnicTemplatePreviewModal,
-  En as UnnnicTextArea,
-  fn as UnnnicToolTip,
-  jn as UnnnicTour,
-  yn as UnnnicUploadArea,
-  zn as UnnniclanguageSelect,
-  Hn as components,
-  qn as default,
-  Gn as unnnicAccordion,
-  Jn as unnnicAlert,
-  Kn as unnnicAudioRecorder,
-  On as unnnicAvatarIcon,
-  Qn as unnnicBanner,
-  Vn as unnnicBreadcrumb,
-  Wn as unnnicButton,
-  Xn as unnnicButtonIcon,
-  Yn as unnnicCallAlert,
-  Zn as unnnicCallModal,
-  _n as unnnicCard,
-  $n as unnnicCardCompany,
-  na as unnnicCardData,
-  aa as unnnicCardImage,
-  ia as unnnicCardInformation,
-  ca as unnnicCardNumber,
-  sa as unnnicCardProject,
-  ea as unnnicCarousel,
-  ra as unnnicChartBar,
-  ta as unnnicChartFunnel,
-  ua as unnnicChartLine,
-  oa as unnnicChartMultiLine,
-  Ua as unnnicChartRainbow,
-  ba as unnnicChatText,
-  la as unnnicChatsContact,
-  da as unnnicChatsDashboardTagLive,
-  Ca as unnnicChatsHeader,
-  ma as unnnicChatsMessage,
-  pa as unnnicChatsNavbar,
-  ga as unnnicChatsUserAvatar,
-  Ta as unnnicCheckbox,
-  ha as unnnicChip,
-  Ia as unnnicCircleProgressBar,
-  Sa as unnnicCollapse,
-  Da as unnnicComment,
-  Ma as unnnicDataArea,
-  Aa as unnnicDataTable,
-  Pa as unnnicDateFilter,
-  va as unnnicDatePicker,
-  wa as unnnicDisclaimer,
-  xa as unnnicDrawer,
-  Ba as unnnicDropArea,
-  Ra as unnnicDropdown,
-  La as unnnicDropdownItem,
-  Na as unnnicEmojiPicker,
-  ka as unnnicFontSize,
-  Fa as unnnicFormElement,
-  Ea as unnnicIcon,
-  fa as unnnicIconLoading,
-  ja as unnnicIconSvg,
-  ya as unnnicImportCard,
-  za as unnnicIndicator,
-  Ha as unnnicInput,
-  qa as unnnicInputDatePicker,
-  Ga as unnnicInputNext,
-  Ja as unnnicLabel,
-  Ka as unnnicModal,
-  Oa as unnnicModalDialog,
-  Qa as unnnicModalNext,
-  Va as unnnicModalUpload,
-  Wa as unnnicMoodRating,
-  Xa as unnnicMultiSelect,
-  Ya as unnnicNavigator,
-  Za as unnnicPagination,
-  _a as unnnicProgressBar,
-  $a as unnnicRadio,
-  ni as unnnicReplyMessage,
-  ai as unnnicSelectItem,
-  ii as unnnicSelectSmart,
-  ci as unnnicSelectTime,
-  si as unnnicSidebar,
-  ei as unnnicSidebarItem,
-  ri as unnnicSimpleCard,
-  ti as unnnicSkeletonLoading,
-  ui as unnnicSlider,
-  oi as unnnicStarRating,
-  Ui as unnnicSwitch,
-  bi as unnnicTab,
-  li as unnnicTable,
-  di as unnnicTableNext,
-  Ci as unnnicTableRow,
-  mi as unnnicTabsExpanded,
-  pi as unnnicTag,
-  gi as unnnicTemplatePreview,
-  Ti as unnnicTemplatePreviewModal,
-  hi as unnnicTextArea,
-  Ii as unnnicToolTip,
-  Si as unnnicTour,
-  Di as unnnicUploadArea,
-  Mi as unnniclanguageSelect
-};

package/src/components/TemplatePreview/TemplatePreview.vue

@@ -1,249 +0,0 @@
-<template>
-  <section class="unnnic-template-preview">
-    <section
-      :class="[
-        'unnnic-template-preview__content',
-        { 'unnnic-template-preview__content--has-media': hasHeaderMedia },
-      ]"
-    >
-      <header
-        v-if="hasHeader"
-        :class="`unnnic-template-preview__header__${
-          template?.header.type === 'TEXT' ? 'text' : 'media'
-        }`"
-      >
-        <img
-          class="unnnic-template-preview__header__media__preview"
-          v-if="
-            template?.header.type === 'MEDIA' &&
-            template?.header.mediaType === 'IMAGE'
-          "
-          :src="template.header.src || imagePreview"
-        />
-        <template
-          v-else-if="
-            template?.header.type === 'MEDIA' &&
-            template?.header.mediaType === 'VIDEO'
-          "
-        >
-          <video
-            v-if="template.header.src"
-            class="unnnic-template-preview__header__media__preview"
-            :src="template.header.src"
-            controls
-          />
-          <img
-            v-else
-            class="unnnic-template-preview__header__media__preview"
-            :src="videoPreview"
-          />
-        </template>
-        <template
-          v-else-if="
-            template?.header.type === 'MEDIA' &&
-            template?.header.mediaType === 'DOCUMENT'
-          "
-        >
-          <img
-            class="unnnic-template-preview__header__media__preview"
-            :src="documentPreview"
-          />
-        </template>
-        <h1
-          class="unnnic-template-preview__header__text__preview"
-          v-else-if="template?.header.type === 'TEXT'"
-        >
-          {{ template.header.text }}
-        </h1>
-      </header>
-      <section
-        v-if="hasBody"
-        :class="[
-          'unnnic-template-preview__body',
-          { 'unnnic-template-preview__body--has-media': hasHeaderMedia },
-        ]"
-      >
-        <section v-html="parsedBody"></section>
-      </section>
-      <footer
-        v-if="hasFooter"
-        :class="[
-          'unnnic-template-preview__footer',
-          { 'unnnic-template-preview__footer--has-media': hasHeaderMedia },
-        ]"
-      >
-        {{ template?.footer }}
-      </footer>
-    </section>
-    <footer v-if="hasButtons" class="unnnic-template-preview__buttons">
-      <section
-        v-for="(button, index) in template?.buttons"
-        :key="`button-${index}`"
-        class="unnnic-template-preview__buttons__button"
-      >
-        <UnnnicIcon
-          class="unnnic-template-preview__buttons__button__icon"
-          :icon="getButtonIcon(button.type)"
-          scheme="aux-blue-500"
-          size="ant"
-        />
-        <p class="unnnic-template-preview__buttons__button__text">
-          {{ button.text }}
-        </p>
-      </section>
-    </footer>
-  </section>
-</template>
-
-<script lang="ts" setup>
-import { computed } from "vue";
-
-import type { Template } from "./types";
-
-import imagePreview from "../../assets/img/previews/image-preview.png";
-import documentPreview from "../../assets/img/previews/doc-preview.png";
-import videoPreview from "../../assets/img/previews/video-preview.png";
-
-import UnnnicIcon from "../Icon.vue";
-
-interface Props {
-  template?: Template | null;
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  template: null,
-});
-
-const hasHeader = computed(
-  () => props.template?.header && props.template.header.type
-);
-const hasHeaderMedia = computed(
-  () => !!props.template?.header && props.template.header.type === "MEDIA"
-);
-const hasBody = computed(
-  () => !!props.template?.body && props.template.body.length > 0
-);
-const hasFooter = computed(
-  () => !!props.template?.footer && props.template.footer.length > 0
-);
-const hasButtons = computed(
-  () => !!props.template?.buttons && props.template.buttons.length > 0
-);
-const parsedBody = computed(() => {
-  if (!hasBody.value) return "";
-
-  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-  const result = props
-    .template!.body!.replaceAll("\n", "<br/>")
-    .replaceAll(/(?:\*)([^*<\n]+)(?:\*)/g, "<strong>$1</strong>")
-    .replaceAll(/(?:_)([^_<\n]+)(?:_)/g, "<i>$1</i>")
-    .replaceAll(/(?:~)([^~<\n]+)(?:~)/g, "<s>$1</s>")
-    .replaceAll(/(?:```)([^```<\n]+)(?:```)/g, "<tt>$1</tt>")
-    .replaceAll(/{{.*?}}/g, (match) => `<strong>${match}</strong>`);
-
-  return result;
-});
-
-const getButtonIcon = (buttonType) => {
-  const buttonMapper = {
-    PHONE_NUMBER: "phone",
-    URL: "open_in_new",
-    COPY_CODE: "content_copy",
-    FLOW: "",
-    QUICK_REPLY: "reply",
-  };
-
-  return buttonMapper[buttonType] || "";
-};
-</script>
-
-<style lang="scss" scoped>
-@use "@/assets/scss/unnnic" as *;
-
-.unnnic-template-preview {
-  display: flex;
-  flex-direction: column;
-  box-shadow: $unnnic-shadow-level-near;
-  background-color: $unnnic-color-background-white;
-  width: 368px;
-  border-radius: $unnnic-border-radius-md;
-
-  &__content {
-    display: flex;
-    flex-direction: column;
-    gap: $unnnic-space-3;
-    padding: $unnnic-space-4 $unnnic-space-3;
-
-    &--has-media {
-      padding: $unnnic-space-1;
-    }
-  }
-
-  &__header {
-    &__text {
-      &__preview {
-        font-family: $unnnic-font-family-secondary;
-        font-weight: $unnnic-font-weight-bold;
-        font-size: $unnnic-font-size-body-gt;
-        line-height: $unnnic-font-size-body-gt + $unnnic-line-height-medium;
-        color: $unnnic-color-neutral-dark;
-
-        margin: $unnnic-space-0;
-      }
-    }
-
-    &__media {
-      &__preview {
-        width: 100%;
-        object-fit: cover;
-      }
-    }
-  }
-
-  &__body {
-    font-family: $unnnic-font-family-secondary;
-    font-weight: $unnnic-font-weight-regular;
-    font-size: $unnnic-font-size-body-gt;
-    line-height: $unnnic-font-size-body-gt + $unnnic-line-height-medium;
-    color: $unnnic-color-neutral-cloudy;
-
-    &--has-media {
-      padding: $unnnic-space-0 $unnnic-space-2;
-    }
-  }
-
-  &__footer {
-    font-family: $unnnic-font-family-secondary;
-    font-weight: $unnnic-font-weight-regular;
-    font-size: $unnnic-font-size-body-md;
-    line-height: $unnnic-font-size-body-md + $unnnic-line-height-medium;
-    color: $unnnic-color-neutral-clean;
-
-    &--has-media {
-      padding: $unnnic-space-0 $unnnic-space-3 $unnnic-space-2;
-    }
-  }
-
-  &__buttons {
-    font-family: $unnnic-font-family-secondary;
-    font-weight: $unnnic-font-weight-bold;
-    font-size: $unnnic-font-size-body-gt;
-    line-height: $unnnic-font-size-body-gt + $unnnic-line-height-medium;
-
-    &__button {
-      margin: 0;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      gap: $unnnic-space-2;
-      padding: $unnnic-space-3;
-      border-top: 1px solid $unnnic-color-neutral-light;
-
-      &__text {
-        color: $unnnic-color-aux-blue-500;
-        margin: $unnnic-space-0;
-      }
-    }
-  }
-}
-</style>