@capillarytech/creatives-library 9.0.47 → 9.0.49-alpha.0

package/v2Containers/SmsTrai/Edit/tests/dltVarTypes.test.js

@@ -0,0 +1,100 @@
+import {
+  DLT_VAR_TYPE_KEYS,
+  DLT_VAR_TYPE_META,
+  DLT_LEGACY_VAR_TOKEN,
+  DLT_LEGACY_VAR_REGEX,
+  ANY_DLT_HASH_TOKEN_PROBE_REGEX,
+  isAnyDltVarToken,
+  getDltVarTypeKey,
+  getDltVarTypeMeta,
+  getDltVarCharLimit,
+} from '../dltVarTypes';
+
+describe('dltVarTypes', () => {
+  it('exposes the six DLT types with short + long syntax + char limit', () => {
+    expect(DLT_VAR_TYPE_KEYS).toEqual([
+      'numeric', 'alphanumeric', 'url', 'urlott', 'cbn', 'email',
+    ]);
+    DLT_VAR_TYPE_KEYS.forEach((key) => {
+      const meta = DLT_VAR_TYPE_META[key];
+      expect(meta.short).toMatch(/^\{#[^#]+#\}$/);
+      expect(meta.long).toMatch(/^\{#[^#]+#\}$/);
+      expect(typeof meta.charLimit).toBe('number');
+    });
+  });
+
+  describe('isAnyDltVarToken', () => {
+    it('accepts short and long DLT token forms', () => {
+      expect(isAnyDltVarToken('{#num#}')).toBe(true);
+      expect(isAnyDltVarToken('{#numeric#}')).toBe(true);
+      expect(isAnyDltVarToken('{#var#}')).toBe(true);
+      expect(isAnyDltVarToken('{# alp #}')).toBe(true);
+    });
+
+    it('rejects non-DLT strings and non-strings', () => {
+      expect(isAnyDltVarToken('{{mustache}}')).toBe(false);
+      expect(isAnyDltVarToken('plain text')).toBe(false);
+      expect(isAnyDltVarToken('')).toBe(false);
+      expect(isAnyDltVarToken(null)).toBe(false);
+      expect(isAnyDltVarToken(undefined)).toBe(false);
+      expect(isAnyDltVarToken(42)).toBe(false);
+    });
+  });
+
+  describe('getDltVarTypeKey', () => {
+    it('resolves short and long spellings + legacy {#var#} to a type key', () => {
+      expect(getDltVarTypeKey('{#num#}')).toBe('numeric');
+      expect(getDltVarTypeKey('{#numeric#}')).toBe('numeric');
+      expect(getDltVarTypeKey('{#ALP#}')).toBe('alphanumeric');
+      expect(getDltVarTypeKey('{# url #}')).toBe('url');
+      expect(getDltVarTypeKey(DLT_LEGACY_VAR_TOKEN)).toBe('alphanumeric');
+    });
+
+    it('returns null for unknown / non-string tokens', () => {
+      expect(getDltVarTypeKey('{#foobar#}')).toBe(null);
+      expect(getDltVarTypeKey('')).toBe(null);
+      expect(getDltVarTypeKey(null)).toBe(null);
+      expect(getDltVarTypeKey(undefined)).toBe(null);
+    });
+  });
+
+  describe('getDltVarTypeMeta', () => {
+    it('returns the full meta object for a valid token', () => {
+      const meta = getDltVarTypeMeta('{#url#}');
+      expect(meta.charLimit).toBe(120);
+      expect(meta.placeholderKey).toBe('dltVarPlaceholderUrl');
+    });
+
+    it('returns null for an unknown token', () => {
+      expect(getDltVarTypeMeta('{#nope#}')).toBe(null);
+    });
+  });
+
+  describe('getDltVarCharLimit', () => {
+    it('returns the type-specific char limit for known tokens', () => {
+      expect(getDltVarCharLimit('{#num#}')).toBe(40);
+      expect(getDltVarCharLimit('{#url#}')).toBe(120);
+      expect(getDltVarCharLimit('{#cbn#}')).toBe(14);
+    });
+
+    it('falls back to the supplied default when the token is unknown', () => {
+      expect(getDltVarCharLimit('{#nope#}', 40)).toBe(40);
+      expect(getDltVarCharLimit('{#nope#}', 99)).toBe(99);
+      expect(getDltVarCharLimit(null)).toBe(40);
+    });
+  });
+
+  describe('exported regexes', () => {
+    it('DLT_LEGACY_VAR_REGEX matches only the legacy generic token', () => {
+      expect(DLT_LEGACY_VAR_REGEX.test('body {#var#} tail')).toBe(true);
+      expect(DLT_LEGACY_VAR_REGEX.test('body {#VAR#} tail')).toBe(true);
+      expect(DLT_LEGACY_VAR_REGEX.test('body {#num#} tail')).toBe(false);
+    });
+
+    it('ANY_DLT_HASH_TOKEN_PROBE_REGEX detects any hash token safely across calls', () => {
+      expect(ANY_DLT_HASH_TOKEN_PROBE_REGEX.test('hi {#alp#} there')).toBe(true);
+      expect(ANY_DLT_HASH_TOKEN_PROBE_REGEX.test('hi {#url#} again')).toBe(true);
+      expect(ANY_DLT_HASH_TOKEN_PROBE_REGEX.test('plain')).toBe(false);
+    });
+  });
+});

package/v2Containers/Templates/_templates.scss

@@ -160,7 +160,6 @@
             line-clamp: 3;
             }
           }
-        
         }
       
         &.no-image .ant-card-meta {    
@@ -168,6 +167,44 @@
             word-wrap: break-word;
           }
         }
+
+        &.viber-carousel-static {
+          height: auto;
+          min-height: 21.125rem;
+          overflow: visible;
+
+          .ant-card-body {
+            height: auto;
+            overflow: visible;
+            padding-bottom: $CAP_SPACE_12;
+
+            .ant-card-meta,
+            .ant-card-meta-detail,
+            .ant-card-meta-description {
+              height: auto;
+              max-height: none;
+              overflow: visible;
+            }
+
+            .truncate-text-viber {
+              .ant-card-meta-description {
+                display: block;
+                overflow: visible;
+                max-height: none;
+                -webkit-box-orient: unset;
+                -webkit-line-clamp: unset;
+                line-clamp: unset;
+              }
+            }
+
+            .content,
+            .cards,
+            .card {
+              overflow: visible;
+              height: auto;
+            }
+          }
+        }
     
   
         &.carousel-img-section {
@@ -1222,6 +1259,147 @@
   max-height: 11rem;
   margin-bottom: $CAP_SPACE_04;
 }
+
+/* Listing carousel preview: always grow with content so title + buttons stay visible for any image */
+.cap-custom-card.ant-card.VIBER.viber-carousel-static {
+  height: auto;
+  min-height: 21.125rem;
+  overflow: visible;
+
+  > .ant-card-body {
+    height: auto;
+    max-height: none;
+    overflow: visible;
+    padding-bottom: $CAP_SPACE_12;
+  }
+
+  .ant-card-meta,
+  .ant-card-meta-detail,
+  .ant-card-meta-description,
+  .truncate-text-viber,
+  .truncate-text-viber .ant-card-meta-description {
+    height: auto;
+    max-height: none;
+    overflow: visible;
+    display: block;
+    -webkit-line-clamp: unset;
+    line-clamp: unset;
+    -webkit-box-orient: unset;
+  }
+}
+
+.viber-carousel-static {
+  .content {
+    width: 100%;
+    overflow: visible;
+    display: flex;
+    flex-direction: column;
+    height: auto;
+
+    .message-box {
+      width: 100%;
+      height: auto;
+      border-radius: $CAP_SPACE_04;
+      background: $CAP_WHITE;
+      margin-bottom: $CAP_SPACE_08;
+      display: flex;
+      align-items: flex-start;
+
+      .message {
+        display: -webkit-box;
+        width: 100%;
+        color: $CAP_G01;
+        line-height: 1.3;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        -webkit-line-clamp: 2;
+        line-clamp: 2;
+        -webkit-box-orient: vertical;
+        white-space: normal;
+        word-break: break-word;
+      }
+    }
+
+    .cards {
+      display: flex;
+      gap: $CAP_SPACE_08;
+      overflow: visible;
+      width: 100%;
+      height: auto;
+
+      .card {
+        flex: 1;
+        min-width: 0;
+        width: 100%;
+        background: $CAP_WHITE;
+        border-radius: $CAP_SPACE_04;
+        overflow: visible;
+        display: flex;
+        flex-direction: column;
+        height: auto;
+
+        .image {
+          width: 100%;
+          max-height: 11rem;
+          margin-bottom: $CAP_SPACE_04;
+          border-radius: $CAP_SPACE_04;
+          display: block;
+          flex-shrink: 0;
+        }
+
+        .image-placeholder {
+          width: 100%;
+          height: 7.143rem;
+          border-radius: $CAP_SPACE_04;
+          background: $CAP_G07;
+        }
+
+        .text {
+          display: -webkit-box;
+          color: $CAP_G01;
+          margin: $CAP_SPACE_04 0;
+          line-height: 1.3;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: normal;
+          -webkit-line-clamp: 2;
+          line-clamp: 2;
+          -webkit-box-orient: vertical;
+          flex-shrink: 0;
+          width: 100%;
+          visibility: visible;
+        }
+
+        .buttons {
+          display: flex;
+          flex-direction: column;
+          gap: $CAP_SPACE_04;
+          flex-shrink: 0;
+          width: 100%;
+          visibility: visible;
+
+          .button {
+            display: block;
+            min-height: 1.5rem;
+            border-radius: $CAP_SPACE_12;
+            background: $CAP_PURPLE01;
+            color: $CAP_WHITE;
+            text-align: center;
+            padding: 0.179rem $CAP_SPACE_08;
+            white-space: normal;
+          }
+
+          .button-secondary {
+            color: $CAP_PURPLE01;
+            background: transparent;
+            border: none;
+            box-shadow: none;
+          }
+        }
+      }
+    }
+  }
+}
 .whatsapp-doc {
   width: 100%;
   max-height: 123px;
@@ -1480,6 +1658,29 @@
   cursor: not-allowed;
 }
 
+.sms-service-explicit-retired-banner.ant-alert {
+  margin: 0 $CAP_SPACE_16 $CAP_SPACE_16 $CAP_SPACE_16;
+  padding: $CAP_SPACE_08 $CAP_SPACE_12;
+  align-items: center;
+}
+
+.sms-template-category-tag {
+  margin-bottom: $CAP_SPACE_12;
+  padding: 0 $CAP_SPACE_12;
+  border-radius: 62.5rem;
+}
+
+
+.sms-template-legacy-warning.ant-alert {
+  margin-top: $CAP_SPACE_12;
+
+  .ant-alert-title,
+  .ant-alert-title span {
+    font-weight: 400;
+    white-space: normal;
+  }
+}
+
 .template-action-dropdown {
   min-width: 14.286rem !important;
   .template-action-menu {