@capillarytech/creatives-library 8.0.353-alpha.4 → 8.0.353-alpha.6

package/v2Containers/Rcs/constants.js

@@ -34,18 +34,32 @@ export const RCS_STATUSES = {
   awaitingApproval: 'awaitingApproval',
 };
 
+export const HOST_ICS="rcsicsbulk";
+export const HOST_INFOBIP="rcsinfobipbulk";
+
 export const contentType = {
   text_message: 'text_message',
   rich_card: 'rich_card',
   carousel: 'carousel',
 };
 
+export const CHANNELS = [
+  'email',
+  'mPush',
+  'viber',
+  'whatsapp',
+  'zalo',
+  'facebook',
+  'rcs',
+  'inApp',
+  'line',
+  'weChat',
+  'callTask',
+  'FTP',
+  'webpush',
+];
+
 export const STATUS_OPTIONS = [
-  // {
-  //   key: 'created',
-  //   value: RCS_STATUSES.awaitingApproval,
-  //   label: <FormattedMessage {...messages.created} />,
-  // },
   {
     key: 'approved',
     value: RCS_STATUSES.approved,
@@ -74,10 +88,31 @@ export const RCS_MEDIA_TYPES = {
   VIDEO: 'VIDEO',
 };
 
-export const rcsVarRegex = /\{\{\w+\}\}/g;
-export const rcsVarTestRegex = /\{\{\w+\}\}/;
+/** Match `{{…}}` placeholders including Liquid-style names (e.g. `tag.FORMAT_1`). Must align with split + `isAnyTemplateVarToken` / SMS fallback. */
+export const rcsVarRegex = /\{\{[^}]+\}\}/g;
+/** True when the whole string is a single RCS/mustache token (used when testing segment tokens). */
+export const rcsVarTestRegex = /^\{\{[^}]+\}\}$/;
+
+/** Matches all `{{N}}` numeric-index variable tokens in a template string (global). */
+export const RCS_NUMERIC_VAR_TOKEN_REGEX = /\{\{(\d+)\}\}/g;
+/** `cardVarMapped` slot keys that are numeric only (legacy ordering). */
+export const RCS_NUMERIC_VAR_NAME_REGEX = /^\d+$/;
+/** Semantic Liquid-style keys on RCS `cardVarMapped` (same class as `{{…}}` inner names in the editor). */
+export const RCS_CARD_VAR_MAPPED_SEMANTIC_KEY_REGEX = /^[\w.]+$/;
+/** Escape `RegExp` metacharacters when building a pattern from user/tag text. */
+export const RCS_REGEX_META_CHARS_PATTERN = /[.*+?^${}()|[\]\\]/g;
+/** Entire string is a single `{{tag}}` token (value still a placeholder). */
+export const RCS_SINGLE_MUSTACHE_PLACEHOLDER_REGEX = /^\{\{[^}]+\}\}$/;
+/** Strip leading `{{` and trailing `}}` from a token. */
+export const RCS_STRIP_MUSTACHE_DELIMITERS_REGEX = /^\{\{|\}\}$/g;
+
+/** Tag-popover target: title vs description field (matches `onTagSelect` `field` argument). */
+export const RCS_TAG_AREA_FIELD_TITLE = 'title';
+export const RCS_TAG_AREA_FIELD_DESC = 'desc';
+
 export const TEMPLATE_DESC_MAX_LENGTH = 2500;
-export const FALLBACK_MESSAGE_MAX_LENGTH = 160;
+/** Resolved SMS fallback body cap. Must allow multi-segment DLT (>160); aligns with TRAI / `TEMPLATE_MESSAGE_MAX_LENGTH`. */
+export const FALLBACK_MESSAGE_MAX_LENGTH = TEMPLATE_MESSAGE_MAX_LENGTH;
 export const TEMPLATE_TITLE_MAX_LENGTH = 200;
 export const TEMPLATE_BUTTON_TEXT_MAX_LENGTH = 25;
 export const CTA = 'CTA';
@@ -92,10 +127,12 @@ export const ALLOWED_IMAGE_EXTENSIONS_REGEX = (/\.(png|jpg|jpeg|gif)$/i);
 export const RCS_IMG_WIDTH = 1440;
 export const RCS_IMG_HEIGHT = 1024;
 export const RCS_IMG_SIZE = 2000000; // 2MB
+export const RCS_CAROUSEL_IMG_SIZE = 1 * 1024 * 1024; // 1MB
 export const MAX_FILE_SIZE_MB = 10;
 export const MAX_FILE_SIZE_BYTES = MAX_FILE_SIZE_MB * 1024 * 1024;
 export const ALLOWED_EXTENSIONS_VIDEO_REGEX = (/\.(mp4)$/i);
 export const RCS_VIDEO_SIZE = 10 * 1024 * 1024;
+export const RCS_CAROUSEL_VIDEO_SIZE = 5 * 1024 * 1024; // 5MB
 export const RCS_THUMBNAIL_MIN_SIZE = 40 * 1024;
 export const RCS_THUMBNAIL_MAX_SIZE = 100 * 1024;
 
@@ -142,13 +179,38 @@ export const RCS_IMAGE_DIMENSIONS = {
   },
 };
 
+// Carousel image dimensions (pixel values shown in UI). Keys follow `${HEIGHT}_${WIDTH}`.
+// HEIGHT: SHORT|MEDIUM, WIDTH: SMALL|MEDIUM
+export const RCS_CAROUSEL_IMAGE_DIMENSIONS = {
+  SHORT_SMALL: {
+    width: 1160,
+    height: 720,
+    description: 'Image (1160 x 720)',
+  },
+  SHORT_MEDIUM: {
+    width: 1800,
+    height: 720,
+    description: 'Image (1800 x 720)',
+  },
+  MEDIUM_SMALL: {
+    width: 770,
+    height: 720,
+    description: 'Image (770 x 720)',
+  },
+  MEDIUM_MEDIUM: {
+    width: 1280,
+    height: 720,
+    description: 'Image (1280 x 720)',
+  },
+};
+
 export const RCS_VIDEO_THUMBNAIL_DIMENSIONS = {
   SHORT_HEIGHT: {
-    width: 770,
-    height: 257,
     type: 'SHORT_HEIGHT',
     heightType: 'SHORT',
     label: 'Vertical Short',
+    width: 1140,
+    height: 448,
     description: 'Thumbnail (770 x 257)',
     orientation: 'VERTICAL',
     maxFileSize: 100 * 1024,
@@ -189,6 +251,29 @@ export const RCS_VIDEO_THUMBNAIL_DIMENSIONS = {
   },
 };
 
+// Carousel thumbnail dimensions for video cards (pixel values shown in UI).
+// Keys follow `${HEIGHT}_${WIDTH}`.
+// Human-readable labels: formatMessage(messages.rcsCarouselVideoThumbnailLabel, { width, height })
+// or formatRcsCarouselVideoThumbnailLabel(formatMessage, entry) from ./utils.
+export const RCS_CAROUSEL_VIDEO_THUMBNAIL_DIMENSIONS = {
+  SHORT_SMALL: {
+    width: 718,
+    height: 448,
+  },
+  SHORT_MEDIUM: {
+    width: 1140,
+    height: 448,
+  },
+  MEDIUM_SMALL: {
+    width: 480,
+    height: 448,
+  },
+  MEDIUM_MEDIUM: {
+    width: 796,
+    height: 448,
+  },
+};
+
 const prefix = 'app/v2Containers/Rcs';
 export const UPLOAD_RCS_ASSET_REQUEST = `${prefix}/UPLOAD_RCS_ASSET_REQUEST`;
 export const UPLOAD_RCS_ASSET_SUCCESS = `${prefix}/UPLOAD_RCS_ASSET_SUCCESS`;
@@ -215,6 +300,7 @@ export const CLEAR_EDIT_RESPONSE_REQUEST = `${prefix}/Edit/CLEAR_EDIT_RESPONSE_R
 export const AI_CONTENT_BOT_DISABLED = "AI_CONTENT_BOT_DISABLED";
 
 export const RCS_TEXT_MESSAGE_MAX_LENGTH = 160;
+export const RCS_TEXT_MESSAGE_MAX_LENGTH_INFOBIP = 3072;
 export const RCS_RICH_CARD_MAX_LENGTH = 2000;
 export const MAX_BUTTONS = 4;
 
@@ -250,3 +336,26 @@ export const RCS_BUTTON_TYPES = {
   PHONE_NUMBER: 'PHONE_NUMBER',
   CTA: 'CTA',
 };
+
+/** Default action row for carousel card 1 (mandatory button UX): phone CTA, unsaved until user completes + Save. */
+export const RCS_CAROUSEL_FIRST_CARD_DEFAULT_SUGGESTIONS = [
+  {
+    index: 0,
+    type: RCS_BUTTON_TYPES.PHONE_NUMBER,
+    text: '',
+    phoneNumber: '',
+    url: null,
+    postback: '',
+    isSaved: false,
+  },
+];
+
+
+export const CAROUSEL_HEIGHT_OPTIONS = [
+  { value: 'SHORT', label: 'Short' },
+  { value: 'MEDIUM', label: 'Medium' },
+];
+export const CAROUSEL_WIDTH_OPTIONS = [
+  { value: 'SMALL', label: 'Small' },
+  { value: 'MEDIUM', label: 'Medium' },
+];