@bikdotai/bik-component-library 0.0.646 → 0.0.647--beta--analytics0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (145) hide show
  1. package/dist/cjs/assets/icons/RCS_PDF.svg.js +1 -0
  2. package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
  3. package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  4. package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
  5. package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  6. package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
  7. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js +1 -1
  8. package/dist/cjs/components/bik-layout/MockMenus.d.ts +1 -0
  9. package/dist/cjs/components/carousel-preview/CarouselPreview.js +1 -1
  10. package/dist/cjs/components/carousel-preview/CarouselPreviewCard.js +1 -1
  11. package/dist/cjs/components/carousel-preview/CustomCarouselArrows.js +1 -1
  12. package/dist/cjs/components/dropdown/ChipInput.d.ts +1 -1
  13. package/dist/cjs/components/dropdown/ChipInput.js +1 -1
  14. package/dist/cjs/components/dropdown/Dropdown.d.ts +1 -1
  15. package/dist/cjs/components/dropdown/Dropdown.js +1 -1
  16. package/dist/cjs/components/dropdown/DropdownPopover/index.d.ts +6 -0
  17. package/dist/cjs/components/dropdown/OpenedDropdown/components/OpennedDropdown.js +1 -1
  18. package/dist/cjs/components/dropdown/type.d.ts +0 -3
  19. package/dist/cjs/components/input/Input.d.ts +1 -1
  20. package/dist/cjs/components/input/Input.js +1 -1
  21. package/dist/cjs/components/input/Input.styled.js +1 -1
  22. package/dist/cjs/components/modals/styledModal.d.ts +0 -1
  23. package/dist/cjs/components/modals/styledModal.js +1 -1
  24. package/dist/cjs/components/product-picker-v2/modal.d.ts +1 -5
  25. package/dist/cjs/components/product-picker-v2/modal.js +1 -1
  26. package/dist/cjs/components/product-picker-v2/utility.d.ts +1 -13
  27. package/dist/cjs/components/product-picker-v2/utility.js +1 -1
  28. package/dist/cjs/components/shimmer-image/ShimmerImage.d.ts +1 -0
  29. package/dist/cjs/components/shimmer-image/ShimmerImage.js +1 -1
  30. package/dist/cjs/components/template-context-mapper/TemplateContextMapper.js +1 -1
  31. package/dist/cjs/components/template-context-mapper/context/templateModalContext.d.ts +2 -0
  32. package/dist/cjs/components/template-context-mapper/context/templateModalContext.js +1 -1
  33. package/dist/cjs/components/template-context-mapper/modalElements/Body.js +5 -5
  34. package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js +1 -1
  35. package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +2 -2
  36. package/dist/cjs/components/template-context-mapper/modalElements/Footer.js +4 -4
  37. package/dist/cjs/components/template-context-mapper/modalElements/MobilePreview.js +5 -5
  38. package/dist/cjs/components/template-context-mapper/modalElements/VariableConnector.d.ts +2 -1
  39. package/dist/cjs/components/template-context-mapper/modalElements/VariableConnector.js +3 -3
  40. package/dist/cjs/components/template-context-mapper/modalElements/VariableConnectorWhatsApp.js +1 -1
  41. package/dist/cjs/components/template-context-mapper/utils/getDataFromTemplateComponent.d.ts +1 -0
  42. package/dist/cjs/components/template-context-mapper/utils/getDataFromTemplateComponent.js +1 -1
  43. package/dist/cjs/components/template-context-mapper/utils/getPreviewDimension.js +1 -1
  44. package/dist/cjs/components/template-preview/RCS/RCSButtons.d.ts +9 -0
  45. package/dist/cjs/components/template-preview/RCS/RCSButtons.js +1 -0
  46. package/dist/cjs/components/template-preview/RCS/RCSChatHeader.d.ts +2 -0
  47. package/dist/cjs/components/template-preview/RCS/RCSChatHeader.js +1 -0
  48. package/dist/cjs/components/template-preview/RCS/RCSChatPreview.d.ts +2 -0
  49. package/dist/cjs/components/template-preview/RCS/RCSChatPreview.js +1 -0
  50. package/dist/cjs/components/template-preview/RCS/RCSMediaCard.d.ts +14 -0
  51. package/dist/cjs/components/template-preview/RCS/RCSMediaCard.js +1 -0
  52. package/dist/cjs/components/template-preview/RCS/RCSPreview.styled.d.ts +29 -0
  53. package/dist/cjs/components/template-preview/RCS/RCSPreview.styled.js +123 -0
  54. package/dist/cjs/components/template-preview/RCS/RCSTemplateLikePreview.d.ts +3 -0
  55. package/dist/cjs/components/template-preview/RCS/RCSTemplateLikePreview.js +8 -0
  56. package/dist/cjs/components/template-preview/TemplatePreview.js +1 -1
  57. package/dist/cjs/components/template-preview/WhatsAppTemplatePreview.d.ts +2 -0
  58. package/dist/cjs/components/template-preview/WhatsAppTemplatePreview.js +1 -1
  59. package/dist/cjs/components/template-preview/helpers/TemplateCreatorHelper.d.ts +1 -0
  60. package/dist/cjs/components/template-preview/helpers/TemplateCreatorHelper.js +1 -1
  61. package/dist/cjs/components/template-preview/helpers/templateMiscHelper.d.ts +6 -0
  62. package/dist/cjs/components/template-preview/helpers/templateMiscHelper.js +1 -0
  63. package/dist/cjs/components/template-preview/models/Channels.d.ts +2 -1
  64. package/dist/cjs/components/template-preview/models/Channels.js +1 -1
  65. package/dist/cjs/components/template-preview/models/EmailTemplate.d.ts +2 -1
  66. package/dist/cjs/components/template-preview/models/RCSTemplate.d.ts +131 -0
  67. package/dist/cjs/components/template-preview/models/SmsTemplate.d.ts +2 -1
  68. package/dist/cjs/components/template-preview/models/WhatsAppTemplate.d.ts +9 -1
  69. package/dist/cjs/components/template-preview/models/WhatsappCarouselTemplate.d.ts +28 -1
  70. package/dist/cjs/components/template-preview/models/types.d.ts +2 -1
  71. package/dist/cjs/components/zeroState/ZeroState.d.ts +0 -2
  72. package/dist/cjs/components/zeroState/ZeroState.js +3 -3
  73. package/dist/esm/assets/icons/RCS_PDF.svg.js +1 -0
  74. package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
  75. package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  76. package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
  77. package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  78. package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
  79. package/dist/esm/components/analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js +1 -1
  80. package/dist/esm/components/bik-layout/MockMenus.d.ts +1 -0
  81. package/dist/esm/components/carousel-preview/CarouselPreview.js +1 -1
  82. package/dist/esm/components/carousel-preview/CarouselPreviewCard.js +1 -1
  83. package/dist/esm/components/carousel-preview/CustomCarouselArrows.js +1 -1
  84. package/dist/esm/components/dropdown/ChipInput.d.ts +1 -1
  85. package/dist/esm/components/dropdown/ChipInput.js +1 -1
  86. package/dist/esm/components/dropdown/Dropdown.d.ts +1 -1
  87. package/dist/esm/components/dropdown/Dropdown.js +1 -1
  88. package/dist/esm/components/dropdown/DropdownPopover/index.d.ts +6 -0
  89. package/dist/esm/components/dropdown/OpenedDropdown/components/OpennedDropdown.js +1 -1
  90. package/dist/esm/components/dropdown/type.d.ts +0 -3
  91. package/dist/esm/components/input/Input.d.ts +1 -1
  92. package/dist/esm/components/input/Input.js +1 -1
  93. package/dist/esm/components/input/Input.styled.js +1 -1
  94. package/dist/esm/components/modals/styledModal.d.ts +0 -1
  95. package/dist/esm/components/modals/styledModal.js +1 -1
  96. package/dist/esm/components/product-picker-v2/modal.d.ts +1 -5
  97. package/dist/esm/components/product-picker-v2/modal.js +1 -1
  98. package/dist/esm/components/product-picker-v2/utility.d.ts +1 -13
  99. package/dist/esm/components/product-picker-v2/utility.js +1 -1
  100. package/dist/esm/components/shimmer-image/ShimmerImage.d.ts +1 -0
  101. package/dist/esm/components/shimmer-image/ShimmerImage.js +1 -1
  102. package/dist/esm/components/template-context-mapper/TemplateContextMapper.js +1 -1
  103. package/dist/esm/components/template-context-mapper/context/templateModalContext.d.ts +2 -0
  104. package/dist/esm/components/template-context-mapper/context/templateModalContext.js +1 -1
  105. package/dist/esm/components/template-context-mapper/modalElements/Body.js +3 -3
  106. package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js +1 -1
  107. package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +2 -2
  108. package/dist/esm/components/template-context-mapper/modalElements/Footer.js +4 -4
  109. package/dist/esm/components/template-context-mapper/modalElements/MobilePreview.js +5 -5
  110. package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.d.ts +2 -1
  111. package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.js +5 -5
  112. package/dist/esm/components/template-context-mapper/modalElements/VariableConnectorWhatsApp.js +1 -1
  113. package/dist/esm/components/template-context-mapper/utils/getDataFromTemplateComponent.d.ts +1 -0
  114. package/dist/esm/components/template-context-mapper/utils/getDataFromTemplateComponent.js +1 -1
  115. package/dist/esm/components/template-context-mapper/utils/getPreviewDimension.js +1 -1
  116. package/dist/esm/components/template-preview/RCS/RCSButtons.d.ts +9 -0
  117. package/dist/esm/components/template-preview/RCS/RCSButtons.js +1 -0
  118. package/dist/esm/components/template-preview/RCS/RCSChatHeader.d.ts +2 -0
  119. package/dist/esm/components/template-preview/RCS/RCSChatHeader.js +1 -0
  120. package/dist/esm/components/template-preview/RCS/RCSChatPreview.d.ts +2 -0
  121. package/dist/esm/components/template-preview/RCS/RCSChatPreview.js +1 -0
  122. package/dist/esm/components/template-preview/RCS/RCSMediaCard.d.ts +14 -0
  123. package/dist/esm/components/template-preview/RCS/RCSMediaCard.js +1 -0
  124. package/dist/esm/components/template-preview/RCS/RCSPreview.styled.d.ts +29 -0
  125. package/dist/esm/components/template-preview/RCS/RCSPreview.styled.js +123 -0
  126. package/dist/esm/components/template-preview/RCS/RCSTemplateLikePreview.d.ts +3 -0
  127. package/dist/esm/components/template-preview/RCS/RCSTemplateLikePreview.js +8 -0
  128. package/dist/esm/components/template-preview/TemplatePreview.js +1 -1
  129. package/dist/esm/components/template-preview/WhatsAppTemplatePreview.d.ts +2 -0
  130. package/dist/esm/components/template-preview/WhatsAppTemplatePreview.js +1 -1
  131. package/dist/esm/components/template-preview/helpers/TemplateCreatorHelper.d.ts +1 -0
  132. package/dist/esm/components/template-preview/helpers/TemplateCreatorHelper.js +1 -1
  133. package/dist/esm/components/template-preview/helpers/templateMiscHelper.d.ts +6 -0
  134. package/dist/esm/components/template-preview/helpers/templateMiscHelper.js +1 -0
  135. package/dist/esm/components/template-preview/models/Channels.d.ts +2 -1
  136. package/dist/esm/components/template-preview/models/Channels.js +1 -1
  137. package/dist/esm/components/template-preview/models/EmailTemplate.d.ts +2 -1
  138. package/dist/esm/components/template-preview/models/RCSTemplate.d.ts +131 -0
  139. package/dist/esm/components/template-preview/models/SmsTemplate.d.ts +2 -1
  140. package/dist/esm/components/template-preview/models/WhatsAppTemplate.d.ts +9 -1
  141. package/dist/esm/components/template-preview/models/WhatsappCarouselTemplate.d.ts +28 -1
  142. package/dist/esm/components/template-preview/models/types.d.ts +2 -1
  143. package/dist/esm/components/zeroState/ZeroState.d.ts +0 -2
  144. package/dist/esm/components/zeroState/ZeroState.js +5 -5
  145. package/package.json +1 -1
@@ -0,0 +1,123 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../../constants/Theme.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=r(e);o.default.div`
2
+ background-color: ${e=>e.isCarousal?"#E0E0E0":"white"};
3
+ border-radius: 4px;
4
+ position: relative;
5
+ height: ${e=>e.isCarousal?"100%":"auto"};
6
+ `;const i=o.default.div`
7
+ font-family: 'Inter';
8
+ font-style: normal;
9
+ font-weight: 400;
10
+ font-size: 14px;
11
+ line-height: 20px;
12
+ padding: 12px;
13
+ color: ${t.COLORS.content.primary};
14
+ word-wrap: break-word;
15
+ `,n=o.default(i)`
16
+ font-weight: 600;
17
+ margin-bottom: 8px;
18
+ `,a=o.default(i)`
19
+ font-weight: 600;
20
+ `,d=o.default.div`
21
+ background: ${t.COLORS.surface.standard};
22
+ border-radius: 12px;
23
+ position: relative;
24
+ //padding: 8px 0px;
25
+ border: 2px solid
26
+ ${e=>e.hasError?`${t.COLORS.content.negative}`:e.showBorder?`${t.COLORS.stroke.brand}`:`${t.COLORS.stroke.primary}`};
27
+ border: ${e=>e.showDashedBorder&&`2px dashed ${t.COLORS.content.brand}`};
28
+ height: 100%;
29
+ display: flex;
30
+ flex-direction: column;
31
+ :hover {
32
+ border: 2px
33
+ ${e=>e.isPreview?"unset":e.isWhatsappCarousel?e.hasError?"dashed":e.showBorder?"solid":"dashed":"solid"}
34
+ ${t.COLORS.stroke.brand};
35
+ box-shadow: ${e=>!e.isPreview&&"4px 4px 12px rgba(0, 0, 0, 0.25)"};
36
+ }
37
+ `,s=o.default.div`
38
+ padding: 8px;
39
+ display: flex;
40
+ flex-direction: row;
41
+ justify-content: center;
42
+ align-items: center;
43
+ `,p=o.default.div`
44
+ border-radius: 8px;
45
+ display: flex;
46
+ flex-direction: column;
47
+ align-items: center;
48
+ justify-content: center;
49
+ min-height: 152px;
50
+ margin-bottom: 4px;
51
+ `,l=o.default.div`
52
+ border-radius: 12px;
53
+ display: flex;
54
+ flex-direction: row;
55
+ align-items: center;
56
+ justify-content: flex-start;
57
+ padding: 4px;
58
+ background-color: #ede7e8;
59
+ margin : 4px;
60
+ max-width: 200px;
61
+ `,x=o.default.div`
62
+ display: flex;
63
+ flex-direction: row;
64
+ align-items: center;
65
+ justify-content: flex-start;
66
+ margin-left : 4px;
67
+ max-width: 180px;
68
+ `,f=o.default.p`
69
+ white-space: nowrap;
70
+ color: #4C5567;
71
+ max-width: 100px;
72
+ overflow: hidden;
73
+ text-overflow: ellipsis;
74
+ padding : 0px;
75
+ margin : 0px;
76
+ font-size: 12px;
77
+ font-weight: 500;
78
+ line-width: 20px;
79
+ `,c=o.default.div`
80
+ border: 1px solid ${t.COLORS.stroke.primary};
81
+ position: relative;
82
+ height: 500px;
83
+ overflow-y: auto;
84
+ border-radius: ${e=>{var t;return null!==(t=e.borderRadius)&&void 0!==t?t:"8px"}};
85
+ box-shadow: 0px 2px 8px 0px #0000001f;
86
+ background-color: white;
87
+ `,u=o.default.div`
88
+ height: 50px;
89
+ background-color: ${t.COLORS.background.inactive};
90
+ position: sticky;
91
+ top: 0px;
92
+ z-index: 200;
93
+ padding: 6px 4px;
94
+ display: flex;
95
+ align-items: center;
96
+ justify-content: space-between;
97
+ gap: 5px;
98
+ `,h=o.default.div`
99
+ display: flex;
100
+ align-items: center;
101
+ gap: 5px;
102
+ `,g=o.default.div`
103
+ height: 27px;
104
+ width: 27px;
105
+ border-radius: 15px;
106
+ background-color: #d1d8db;
107
+ display: flex;
108
+ justify-content: center;
109
+ align-items: center;
110
+ gap: 6px;
111
+ `,b=o.default.div`
112
+ display: flex;
113
+ flex-direction: column;
114
+ justify-content: space-between;
115
+ `,m=o.default.p`
116
+ font-family: 'Inter';
117
+ font-style: normal;
118
+ font-weight: 400;
119
+ font-size: 8px;
120
+ line-height: 11px;
121
+ color: ${t.COLORS.content.secondary};
122
+ margin-bottom: 0px;
123
+ `;exports.HeaderContainer=u,exports.HeaderTextContainer=n,exports.IconContainer=g,exports.LeftContainer=h,exports.PdfComineText=x,exports.PdfText=f,exports.RCSCarousalContainer=c,exports.RCSChatBtnContainer=s,exports.RCSMediaContainer=p,exports.RCSPdfContainer=l,exports.RCSPreviewContainer=d,exports.RcsHtmlContainer=i,exports.SubTitle=m,exports.TitleContainer=b,exports.TitleTextContainer=a;
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ import { WhatsappLikePreviewTypes } from '../models/WhatsAppTemplate';
3
+ export declare const RCSTemplateLikePreview: React.FC<WhatsappLikePreviewTypes>;
@@ -0,0 +1,8 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("styled-components"),r=require("../../template-context-mapper/context/templateModalContext.js"),s=require("../../TypographyStyle.js"),a=require("../../../constants/Theme.js"),i=require("../utils/getPreviewPropLen.js"),o=require("./RCSChatPreview.js"),n=require("./RCSChatHeader.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=p(t);const d=l.default.div`
2
+ background-color: white;
3
+ border-radius: 4px;
4
+ position: relative;
5
+ height: ${e=>e.isWhatsappCarousel?"100%":"auto"};
6
+ `,u=l.default(s.TitleRegular)`
7
+ color: ${a.COLORS.content.primary};
8
+ `;exports.RCSTemplateLikePreview=t=>{const{hideDeviceContainerInPreview:s}=r.useTemplateModalContext();return 3===i.getPreviewPropLen(t)?e.jsx(e.Fragment,{children:t.zeroStateComponent}):s?e.jsx(o.RCSChatPreview,Object.assign({showHeader:t.showHeader},t)):e.jsx(e.Fragment,{children:e.jsxs(d,Object.assign({style:t.containerStyle,showHeader:t.showHeader,isWhatsappCarousel:t.isWhatsappCarousel},{children:[t.showHeader&&e.jsx(n.default,{}),e.jsxs("div",Object.assign({style:{padding:"small"===t.size?"10px 32px 10px 10px":`10px ${t.isWhatsappCarousel?"0px":"12px"} ${t.isWhatsappCarousel?"2px":"16px"} 16px`,height:t.isWhatsappCarousel?"100%":"auto"}},{children:[!t.hidePreviewText&&e.jsx("div",Object.assign({style:{marginBottom:16}},{children:e.jsx(u,{children:"Preview"})})),e.jsx(o.RCSChatPreview,Object.assign({showHeader:t.showHeader},t))]}))]}))})};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../template-context-mapper/context/templateModalContext.js"),l=require("../../utils/StringUtils.js"),i=require("../../constants/Theme.js"),a=require("../TypographyStyle.js"),n=require("./EmailTemplateThumbnailPreview.js"),s=require("./models/Channels.js"),r=require("./SmsTemplatePreview.js"),o=require("./webpush/WebpushPreview.js"),d=require("./WhatsAppTemplatePreview.js");const u={WhatsAppWrapper:{backgroundColor:i.COLORS.surface.standard,borderRadius:4,border:`1px solid ${i.COLORS.background.inactive}`,marginTop:16}};exports.TemplatePreview=p=>{let{template:m,channel:c,whatsAppSpecificMeta:v,templateCreationsInfo:h,hideHeader:j,size:C,onlyTemplateContent:b,emailSpecificMeta:S,smsSpecificMeta:g,showSampleValues:x,carouselCardIndex:y,isWhatsappCarousel:T,isPreview:P,applyBorderBottom:w,webPushSpecificMeta:O,hidePointerEvents:E}=p;var H,f;const{setSelectedCarouselIndex:A}=t.useTemplateModalContext();return c===s.CHANNEL_TYPE.SMS?e.jsx("div",Object.assign({style:Object.assign({marginTop:h?16:0,border:h?`1px solid ${i.COLORS.stroke.primary}`:"none",borderRadius:4},null==g?void 0:g.templateContainerStyles)},{children:e.jsx(r.default,{template:m,hideHeader:j,onlyTemplateContent:b,size:null!=C?C:"large",variableStore:null==g?void 0:g.smsVariableStore,display_content:null==g?void 0:g.smsDisplayContent,uniqueId:null==g?void 0:g.uniqueId})})):c===s.CHANNEL_TYPE.EMAIL?e.jsx("div",Object.assign({style:Object.assign({marginTop:h?16:0},null==S?void 0:S.templateContainerStyles)},{children:e.jsx(n.default,{template:m,handleViewTemplate:()=>{var e;null===(e=null==S?void 0:S.handleViewTemplate)||void 0===e||e.call(S)},hideHeader:j,hideViewButton:null==S?void 0:S.hideViewButtonForEmail,containerStyle:null==S?void 0:S.containerStyle,emailDisplayContent:null==S?void 0:S.emailDisplayContent,emailHtmlContainerId:null==S?void 0:S.emailHtmlContainerId,applyBorderBottom:w,hidePointerEvents:E})})):c===s.CHANNEL_TYPE.WHATSAPP?e.jsxs("div",Object.assign({style:Object.assign(Object.assign({},null==v?void 0:v.templateContainerStyles),h?u.WhatsAppWrapper:{}),onClick:()=>{var e,t;if(A&&T){if(-1===y&&!(null===(t=null===(e=null==m?void 0:m.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length))return;A(null!=y?y:-1)}}},{children:[h?e.jsx("div",Object.assign({style:{padding:16}},{children:e.jsx(a.TitleRegular,{children:l.default.convertToTitleCase(null!==(H=null==m?void 0:m.label)&&void 0!==H?H:"")})})):e.jsx(e.Fragment,{}),e.jsx(d.default,{showSampleValues:x,showHeader:null==v?void 0:v.showWhatsAppHeader,extras:null==v?void 0:v.whatsAppExtras,template:m,size:h?"small":null!=C?C:"large",containerStyle:Object.assign(Object.assign({borderWidth:h?0:1,borderTopWidth:1},null!==(f=null==v?void 0:v.containerStyle)&&void 0!==f?f:{}),{height:"100%"}),zeroStateComponent:null==v?void 0:v.zeroStateComponent,usePlaceHolderName:null==v?void 0:v.usePlaceHolderName,carouselCardIndex:y,isWhatsappCarousel:T,isPreview:P})]})):c==s.CHANNEL_TYPE.WEBPUSH?e.jsx("div",Object.assign({style:Object.assign({},null==O?void 0:O.containerStyle)},{children:e.jsx(o.default,{template:m,extraContainerCss:null==O?void 0:O.extraContainerCss})})):e.jsx(e.Fragment,{})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../template-context-mapper/context/templateModalContext.js"),l=require("../../utils/StringUtils.js"),i=require("../../constants/Theme.js"),a=require("../TypographyStyle.js"),n=require("./EmailTemplateThumbnailPreview.js"),s=require("./models/Channels.js"),r=require("./SmsTemplatePreview.js"),o=require("./webpush/WebpushPreview.js"),d=require("./WhatsAppTemplatePreview.js");const u={WhatsAppWrapper:{backgroundColor:i.COLORS.surface.standard,borderRadius:4,border:`1px solid ${i.COLORS.background.inactive}`,marginTop:16}};exports.TemplatePreview=p=>{let{template:c,channel:m,whatsAppSpecificMeta:v,templateCreationsInfo:h,hideHeader:C,size:j,onlyTemplateContent:S,emailSpecificMeta:b,smsSpecificMeta:g,showSampleValues:x,carouselCardIndex:y,isWhatsappCarousel:T,isPreview:P,applyBorderBottom:w,webPushSpecificMeta:O,hidePointerEvents:E}=p;var H,f;const{setSelectedCarouselIndex:A}=t.useTemplateModalContext();return m===s.CHANNEL_TYPE.SMS?e.jsx("div",Object.assign({style:Object.assign({marginTop:h?16:0,border:h?`1px solid ${i.COLORS.stroke.primary}`:"none",borderRadius:4},null==g?void 0:g.templateContainerStyles)},{children:e.jsx(r.default,{template:c,hideHeader:C,onlyTemplateContent:S,size:null!=j?j:"large",variableStore:null==g?void 0:g.smsVariableStore,display_content:null==g?void 0:g.smsDisplayContent,uniqueId:null==g?void 0:g.uniqueId})})):m===s.CHANNEL_TYPE.EMAIL?e.jsx("div",Object.assign({style:Object.assign({marginTop:h?16:0},null==b?void 0:b.templateContainerStyles)},{children:e.jsx(n.default,{template:c,handleViewTemplate:()=>{var e;null===(e=null==b?void 0:b.handleViewTemplate)||void 0===e||e.call(b)},hideHeader:C,hideViewButton:null==b?void 0:b.hideViewButtonForEmail,containerStyle:null==b?void 0:b.containerStyle,emailDisplayContent:null==b?void 0:b.emailDisplayContent,emailHtmlContainerId:null==b?void 0:b.emailHtmlContainerId,applyBorderBottom:w,hidePointerEvents:E})})):m===s.CHANNEL_TYPE.WHATSAPP||m===s.CHANNEL_TYPE.RCS?e.jsxs("div",Object.assign({style:Object.assign(Object.assign({},null==v?void 0:v.templateContainerStyles),h?u.WhatsAppWrapper:{}),onClick:()=>{var e,t;if(A&&T){if(-1===y&&!(null===(t=null===(e=null==c?void 0:c.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length))return;A(null!=y?y:-1)}}},{children:[h?e.jsx("div",Object.assign({style:{padding:16}},{children:e.jsx(a.TitleRegular,{children:l.default.convertToTitleCase(null!==(H=null==c?void 0:c.label)&&void 0!==H?H:"")})})):e.jsx(e.Fragment,{}),e.jsx(d.default,{showSampleValues:x,showHeader:null==v?void 0:v.showWhatsAppHeader,extras:null==v?void 0:v.whatsAppExtras,template:c,size:h?"small":null!=j?j:"large",containerStyle:Object.assign(Object.assign({borderWidth:h?0:1,borderTopWidth:1},null!==(f=null==v?void 0:v.containerStyle)&&void 0!==f?f:{}),{height:"100%"}),zeroStateComponent:null==v?void 0:v.zeroStateComponent,usePlaceHolderName:null==v?void 0:v.usePlaceHolderName,carouselCardIndex:y,isWhatsappCarousel:T,isPreview:P,channel:m})]})):m==s.CHANNEL_TYPE.WEBPUSH?e.jsx("div",Object.assign({style:Object.assign({},null==O?void 0:O.containerStyle)},{children:e.jsx(o.default,{template:c,extraContainerCss:null==O?void 0:O.extraContainerCss})})):e.jsx(e.Fragment,{})};
@@ -1,5 +1,6 @@
1
1
  import React, { ReactElement } from 'react';
2
2
  import { CSSProperties } from 'styled-components';
3
+ import { CHANNEL_TYPE } from './models/Channels';
3
4
  import { WhatsAppTemplate } from './models/WhatsAppTemplate';
4
5
  declare const WhatsappTemplatePreview: React.FC<{
5
6
  template?: WhatsAppTemplate;
@@ -13,5 +14,6 @@ declare const WhatsappTemplatePreview: React.FC<{
13
14
  carouselCardIndex?: number;
14
15
  isWhatsappCarousel?: boolean;
15
16
  isPreview?: boolean;
17
+ channel?: CHANNEL_TYPE;
16
18
  }>;
17
19
  export default WhatsappTemplatePreview;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),t=require("../template-context-mapper/context/templateModalContext.js"),a=require("./helpers/TemplateCreatorHelper.js"),i=require("./models/TemplateMeta.js"),r=require("./utils/TemplateHelperUtils.js"),n=require("./WhatsApp/WhatsAppLikePreview.js"),o=require("./WhatsApp/WhatsAppLikePreviewV2.js");exports.default=d=>{let{template:s,extras:p,containerStyle:u,usePlaceHolderName:v,showHeader:h,zeroStateComponent:m,size:x,showSampleValues:c,carouselCardIndex:b,isWhatsappCarousel:T,isPreview:y}=d;var w,k,C,V,B,N,j,P,f,A,L,S,q,F,g,E,H,O,W,I,U,D;const{selectedCarouselIndex:M}=t.useTemplateModalContext(),[R,z]=l.useState(),_=new a.TemplateCreatorHelper,Y=new r.TemplateHelperUtils,G=[];return(null===(k=null===(w=null==R?void 0:R.ctaBtn)||void 0===w?void 0:w.phoneNumber)||void 0===k?void 0:k.isChecked)&&G.push({type:"phoneNumber",text:null!==(C=R.ctaBtn.phoneNumber.btnText)&&void 0!==C?C:"",extra:null!==(V=R.ctaBtn.phoneNumber.phoneNumber)&&void 0!==V?V:""}),(null===(N=null===(B=null==R?void 0:R.ctaBtn)||void 0===B?void 0:B.websiteLinkBtn)||void 0===N?void 0:N.isChecked)&&G.push({type:"website",text:null!==(j=R.ctaBtn.websiteLinkBtn.btnText)&&void 0!==j?j:"",extra:null!==(f=null===(P=R.ctaBtn.websiteLinkBtn)||void 0===P?void 0:P.linkOpens)&&void 0!==f?f:"",placeholder:null!==(A=R.ctaBtn.websiteLinkBtn.placeholder)&&void 0!==A?A:""}),l.useEffect((()=>{s&&_.parseUITemplateFromDBFormat({dbFormattedTemplate:s,isDuplicate:!1,showSampleValues:c,isV2:!s.htmlContentUrl}).then((e=>{z(Object.assign({},e))}))}),[s,c]),l.useEffect((()=>{s&&_.parseUITemplateFromDBFormat({dbFormattedTemplate:s,isDuplicate:!1,showSampleValues:c,isV2:!s.htmlContentUrl}).then((e=>{z(Object.assign({},e))}))}),[M]),s?s.htmlContentUrl?e.jsx(n.WhatsappLikePreview,{showHeader:h,containerPadding:"large"===x?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:u,textType:"html",bodyText:Y.whatsappOnlyFillVariablesValueInBodyText(null!==(H=null==R?void 0:R.bodyText)&&void 0!==H?H:"",null!==(O=null==R?void 0:R.bodyVariables)&&void 0!==O?O:[],v),footerText:null==R?void 0:R.footerText,headerMediaType:(null==R?void 0:R.headerType)||i.HEADER_TYPES.NONE,headerText:Y.fillVariablesValInBodyText(null!==(W=null==R?void 0:R.headerText)&&void 0!==W?W:"",null!==(I=null==R?void 0:R.headerVariables)&&void 0!==I?I:[],v),headerAssetLink:null!==(U=null==R?void 0:R.headerAssetLink)&&void 0!==U?U:"",headerAssetName:null!==(D=null==R?void 0:R.headerAssetName)&&void 0!==D?D:"",quickReplybtn:null==R?void 0:R.quickReply,ctaBtn:G,actionTypes:null==R?void 0:R.actionsType,extras:p,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},zeroStateComponent:null!=m?m:e.jsx(e.Fragment,{children:" "}),isPreview:y}):e.jsx(o.WhatsappLikePreviewV2,{showHeader:h,containerPadding:"large"===x?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:u,textType:"html",bodyText:null==R?void 0:R.bodyText,footerText:null==R?void 0:R.footerText,headerMediaType:(null==R?void 0:R.headerType)||i.HEADER_TYPES.NONE,headerText:null==R?void 0:R.headerText,headerAssetLink:null!==(L=null==R?void 0:R.headerAssetLink)&&void 0!==L?L:"",headerAssetName:null!==(S=null==R?void 0:R.headerAssetName)&&void 0!==S?S:"",quickReplybtn:null==R?void 0:R.quickReply,ctaBtn:G,actionTypes:null==R?void 0:R.actionsType,extras:p,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:b,zeroStateComponent:null!=m?m:e.jsx(e.Fragment,{children:" "}),bodyVariableList:null!==(F=null===(q=null==R?void 0:R.bodyVariables)||void 0===q?void 0:q.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==F?F:[],headerVariableList:null!==(E=null===(g=null==R?void 0:R.headerVariables)||void 0===g?void 0:g.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==E?E:[],buttons:null==R?void 0:R.allButtons,limitedTimeOfferComponent:null==R?void 0:R.limitedTimeOfferComponent,isWhatsappCarousel:T,isPreview:y}):e.jsx(e.Fragment,{children:m})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("react"),a=require("../template-context-mapper/context/templateModalContext.js"),t=require("./helpers/TemplateCreatorHelper.js"),i=require("./helpers/templateMiscHelper.js"),r=require("./models/TemplateMeta.js"),n=require("./RCS/RCSTemplateLikePreview.js"),o=require("./utils/TemplateHelperUtils.js"),d=require("./WhatsApp/WhatsAppLikePreview.js"),s=require("./WhatsApp/WhatsAppLikePreviewV2.js");exports.default=u=>{let{template:v,extras:p,containerStyle:h,usePlaceHolderName:x,showHeader:m,zeroStateComponent:c,size:b,showSampleValues:T,carouselCardIndex:y,isWhatsappCarousel:w,isPreview:N,channel:V}=u;var C,k,P,j,S,L,B,A,f,q,g,E,F,H,R,O,W,I,M,D,U,z,_,Y,G,J,K,Q,X,Z;const{selectedCarouselIndex:$}=a.useTemplateModalContext(),[ee,le]=l.useState(),ae=new t.TemplateCreatorHelper,te=new o.TemplateHelperUtils,ie=[];return(null===(k=null===(C=null==ee?void 0:ee.ctaBtn)||void 0===C?void 0:C.phoneNumber)||void 0===k?void 0:k.isChecked)&&ie.push({type:"phoneNumber",text:null!==(P=ee.ctaBtn.phoneNumber.btnText)&&void 0!==P?P:"",extra:null!==(j=ee.ctaBtn.phoneNumber.phoneNumber)&&void 0!==j?j:""}),(null===(L=null===(S=null==ee?void 0:ee.ctaBtn)||void 0===S?void 0:S.websiteLinkBtn)||void 0===L?void 0:L.isChecked)&&ie.push({type:"website",text:null!==(B=ee.ctaBtn.websiteLinkBtn.btnText)&&void 0!==B?B:"",extra:null!==(f=null===(A=ee.ctaBtn.websiteLinkBtn)||void 0===A?void 0:A.linkOpens)&&void 0!==f?f:"",placeholder:null!==(q=ee.ctaBtn.websiteLinkBtn.placeholder)&&void 0!==q?q:""}),l.useEffect((()=>{v&&ae.parseUITemplateFromDBFormat({dbFormattedTemplate:v,isDuplicate:!1,showSampleValues:T,isV2:!v.htmlContentUrl}).then((e=>{le(Object.assign({},e))}))}),[v,T]),l.useEffect((()=>{v&&ae.parseUITemplateFromDBFormat({dbFormattedTemplate:v,isDuplicate:!1,showSampleValues:T,isV2:!v.htmlContentUrl}).then((e=>{le(Object.assign({},e))}))}),[$]),v?i.isRCSChannel(V||(null==v?void 0:v.channel))?e.jsx(n.RCSTemplateLikePreview,{showHeader:m,containerPadding:"large"===b?"16px 36px 12px 16px":"12px 36px 12px 12px",containerStyle:h,textType:"html",bodyText:null==ee?void 0:ee.bodyText,titleText:null==ee?void 0:ee.titleText,footerText:null==ee?void 0:ee.footerText,headerMediaType:(null==ee?void 0:ee.headerType)||r.HEADER_TYPES.NONE,headerText:null==ee?void 0:ee.headerText,headerAssetLink:null!==(g=null==ee?void 0:ee.headerAssetLink)&&void 0!==g?g:"",headerAssetName:null!==(E=null==ee?void 0:ee.headerAssetName)&&void 0!==E?E:"",quickReplybtn:null==ee?void 0:ee.quickReply,ctaBtn:ie,actionTypes:null==ee?void 0:ee.actionsType,extras:p,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:y,zeroStateComponent:null!=c?c:e.jsx(e.Fragment,{children:" "}),bodyVariableList:null!==(H=null===(F=null==ee?void 0:ee.bodyVariables)||void 0===F?void 0:F.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==H?H:[],headerVariableList:null!==(O=null===(R=null==ee?void 0:ee.headerVariables)||void 0===R?void 0:R.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==O?O:[],titleVariableList:null!==(I=null===(W=null==ee?void 0:ee.titleVariables)||void 0===W?void 0:W.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==I?I:[],buttons:null==ee?void 0:ee.allButtons,isWhatsappCarousel:w,isPreview:N}):v.htmlContentUrl?e.jsx(d.WhatsappLikePreview,{showHeader:m,containerPadding:"large"===b?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:h,textType:"html",bodyText:te.whatsappOnlyFillVariablesValueInBodyText(null!==(G=null==ee?void 0:ee.bodyText)&&void 0!==G?G:"",null!==(J=null==ee?void 0:ee.bodyVariables)&&void 0!==J?J:[],x),footerText:null==ee?void 0:ee.footerText,headerMediaType:(null==ee?void 0:ee.headerType)||r.HEADER_TYPES.NONE,headerText:te.fillVariablesValInBodyText(null!==(K=null==ee?void 0:ee.headerText)&&void 0!==K?K:"",null!==(Q=null==ee?void 0:ee.headerVariables)&&void 0!==Q?Q:[],x),headerAssetLink:null!==(X=null==ee?void 0:ee.headerAssetLink)&&void 0!==X?X:"",headerAssetName:null!==(Z=null==ee?void 0:ee.headerAssetName)&&void 0!==Z?Z:"",quickReplybtn:null==ee?void 0:ee.quickReply,ctaBtn:ie,actionTypes:null==ee?void 0:ee.actionsType,extras:p,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},zeroStateComponent:null!=c?c:e.jsx(e.Fragment,{children:" "}),isPreview:N}):e.jsx(s.WhatsappLikePreviewV2,{showHeader:m,containerPadding:"large"===b?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:h,textType:"html",bodyText:null==ee?void 0:ee.bodyText,footerText:null==ee?void 0:ee.footerText,headerMediaType:(null==ee?void 0:ee.headerType)||r.HEADER_TYPES.NONE,headerText:null==ee?void 0:ee.headerText,headerAssetLink:null!==(M=null==ee?void 0:ee.headerAssetLink)&&void 0!==M?M:"",headerAssetName:null!==(D=null==ee?void 0:ee.headerAssetName)&&void 0!==D?D:"",quickReplybtn:null==ee?void 0:ee.quickReply,ctaBtn:ie,actionTypes:null==ee?void 0:ee.actionsType,extras:p,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:y,zeroStateComponent:null!=c?c:e.jsx(e.Fragment,{children:" "}),bodyVariableList:null!==(z=null===(U=null==ee?void 0:ee.bodyVariables)||void 0===U?void 0:U.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==z?z:[],headerVariableList:null!==(Y=null===(_=null==ee?void 0:ee.headerVariables)||void 0===_?void 0:_.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==Y?Y:[],buttons:null==ee?void 0:ee.allButtons,limitedTimeOfferComponent:null==ee?void 0:ee.limitedTimeOfferComponent,isWhatsappCarousel:w,isPreview:N}):e.jsx(e.Fragment,{children:c})};
@@ -10,6 +10,7 @@ export declare class TemplateCreatorHelper {
10
10
  errors: CreateTemplateType['error'];
11
11
  };
12
12
  private parseBodyComponent;
13
+ private parseTitleComponent;
13
14
  private parseFooterComponent;
14
15
  private parseButtonComponent;
15
16
  /**
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),t=require("date-fns"),i=require("../../../constants/Theme.js"),n=require("../constants/regexPatterns.js"),l=require("../constants/TemplateConstants.js"),o=require("../models/TemplateMeta.js"),a=require("../utils/TemplateHelperUtils.js");exports.TemplateCreatorHelper=class{parseDataFromHeaderComponent(e,t){var i,n,l,a,d,r,v,s,E,u;const p={headerType:o.HEADER_TYPES.NONE,headerVariables:[]},T=null===(i=e.components)||void 0===i?void 0:i.find((e=>"HEADER"===e.type));if(T){p.headerType=T.format,p.headerText=T.text,p.headerAssetLink=null===(l=null===(n=T.example)||void 0===n?void 0:n.header_handle)||void 0===l?void 0:l[0];const i=null===(d=null===(a=T.example)||void 0===a?void 0:a.header_text)||void 0===d?void 0:d[0],o=null===(v=null===(r=e.mapping)||void 0===r?void 0:r.header)||void 0===v?void 0:v[0],c=o;if(i&&o){const e=null==o?void 0:o.replace("[[","").replace("]]","").replace("{{","").replace("}}","").replace("((","").replace("))",""),n=/\(\(/.test(o),l={idx:0,variableVal:t?i:c,editable:n,editableDefaultValues:n?void 0:i,variableName:e};p.headerVariables=[l],(null===(E=null===(s=T.example)||void 0===s?void 0:s.header_text)||void 0===E?void 0:E.length)&&(p.headerText=null===(u=p.headerText)||void 0===u?void 0:u.replace("{{1}}",`{{${e}}}`))}}return p}validateState(e){var t,i,d,r,v,s,E,u,p,T,c,_,m,h,R,b,I,L,y,B,N,C,O;const D=/\p{Extended_Pictographic}/u;let x="valid";const A={meta:{},ctaBtn:{phoneNumber:{btnText:"",link:""},websiteLink:{btnText:"",link:""}},quickReply:[null,null,null]},f=new a.TemplateHelperUtils;let P=!1;const k=e=>{var t;null===(t=document.getElementById(e))||void 0===t||t.scrollIntoView({behavior:"smooth",block:"nearest"})};if((null===(t=e.meta)||void 0===t?void 0:t.name)?(null===(i=e.meta.name)||void 0===i?void 0:i.trim().length)>l.NAME_LEN_LIMIT?(A.meta.name=l.NAME_LEN_ERROR,x="invalid"):n.specialCharPattern.test(null===(d=e.meta.name)||void 0===d?void 0:d.trim())&&(A.meta.name=l.NO_SPECIAL_CHAR,x="invalid"):(A.meta.name=l.REQUIRED_FIELD,x="invalid"),A.meta.name&&!P&&(k(l.CREATE_TEMPLATE_DOM_IDS.name),P=!0),e.headerType===o.HEADER_TYPES.TEXT){const t=null!==(v=null===(r=e.headerText)||void 0===r?void 0:r.trim())&&void 0!==v?v:"";if(t)if(t.length>l.HEADER_TEXT_LEN_LIMIT)A.header=l.HEADER_LEN_ERROR,x="invalid";else{const e=f.getTemplateVariablesFromState(t);e&&e.length>1&&(A.header=l.ONE_VAR_ALLOWED,x="invalid")}else A.header=l.REQUIRED_FIELD,x="invalid"}else e.headerType===o.HEADER_TYPES.DOCUMENT||e.headerType===o.HEADER_TYPES.IMAGE||(e.headerType,o.HEADER_TYPES.VIDEO);if(e.headerType!==o.HEADER_TYPES.DOCUMENT&&e.headerType!==o.HEADER_TYPES.IMAGE&&e.headerType!==o.HEADER_TYPES.VIDEO||e.headerAssetLink||(A.header=l.HEADER_ASSET_LINK_ERROR,x="invalid"),A.header&&!P&&(k(l.CREATE_TEMPLATE_DOM_IDS.header),P=!0),e.bodyText?e.bodyTextRaw&&(null===(s=e.bodyTextRaw)||void 0===s?void 0:s.trim().length)>l.BODY_TEXT_LEN_LIMIT&&(A.body=l.BODY_LEN_ERROR,x="invalid"):(A.body=l.REQUIRED_FIELD,x="invalid"),A.body&&!P&&(k(l.CREATE_TEMPLATE_DOM_IDS.body),P=!0),e.footerText&&e.footerText.length>l.HEADER_TEXT_LEN_LIMIT&&(A.footer=l.HEADER_LEN_ERROR,x="invalid"),(null==A?void 0:A.footer)&&!P&&(k(l.CREATE_TEMPLATE_DOM_IDS.footer),P=!0),e.actionsType===o.ACTIONS_TYPES.CTA_BTN){if(null===(u=null===(E=e.ctaBtn)||void 0===E?void 0:E.phoneNumber)||void 0===u?void 0:u.isChecked){const t=null===(p=e.ctaBtn.phoneNumber.btnText)||void 0===p?void 0:p.trim(),i=e.ctaBtn.phoneNumber.phoneNumber;A.ctaBtn&&!t?(A.ctaBtn.phoneNumber.btnText=l.REQUIRED_FIELD,x="invalid"):A.ctaBtn&&t&&t.length>l.QUICK_REPLY_BTN_TEXT_LIMIT?(A.ctaBtn.phoneNumber.btnText=l.QUICK_REPLY_LEN_ERROR,x="invalid"):A.ctaBtn&&t&&D.test(t)&&(A.ctaBtn.phoneNumber.btnText=l.BUTTON_EMOJI_ERROR,x="invalid"),A.ctaBtn&&!i?(A.ctaBtn.phoneNumber.link=l.REQUIRED_FIELD,x="invalid"):A.ctaBtn&&i&&i.length<10&&(A.ctaBtn.phoneNumber.link=l.VALID_PHONE_NUMBER,x="invalid")}if(null===(c=null===(T=e.ctaBtn)||void 0===T?void 0:T.websiteLinkBtn)||void 0===c?void 0:c.isChecked){const t=null===(_=e.ctaBtn.websiteLinkBtn.btnText)||void 0===_?void 0:_.trim(),i=null===(m=e.ctaBtn.websiteLinkBtn.linkOpens)||void 0===m?void 0:m.trim(),n=null===(h=e.ctaBtn.websiteLinkBtn.placeholder)||void 0===h?void 0:h.trim();A.ctaBtn&&!t?(A.ctaBtn.websiteLink.btnText=l.REQUIRED_FIELD,x="invalid"):A.ctaBtn&&t&&t.length>l.QUICK_REPLY_BTN_TEXT_LIMIT?(A.ctaBtn.websiteLink.btnText=l.QUICK_REPLY_LEN_ERROR,x="invalid"):A.ctaBtn&&t&&D.test(t)&&(A.ctaBtn.websiteLink.btnText=l.BUTTON_EMOJI_ERROR,x="invalid"),!A.ctaBtn||i||n||(A.ctaBtn.websiteLink.link=l.REQUIRED_FIELD,x="invalid")}}else if(e.actionsType===o.ACTIONS_TYPES.QUICK_REPLY){const t=["","",""];e.quickReply.forEach(((i,n)=>{var o;const a=null===(o=i.text)||void 0===o?void 0:o.trim();if(a)if(a.length>l.QUICK_REPLY_NAME_LEN_LIMIT)t[n]=l.QUICK_REPLY_LEN_ERROR,x="invalid";else if(D.test(a))t[n]=l.BUTTON_EMOJI_ERROR,x="invalid";else{const i=[...e.quickReply];i.splice(n,1);i.find((e=>e.text===a))&&(t[n]=l.QUICK_REPLY_NAME_ERROR,x="invalid")}else t[n]=l.REQUIRED_FIELD,x="invalid"})),A.quickReply=t}if(e.actionsType===o.ACTIONS_TYPES.CTA_BTN||e.actionsType===o.ACTIONS_TYPES.QUICK_REPLY){const e=null===(R=A.quickReply)||void 0===R?void 0:R.reduce(((e,t)=>e||!!t),!1);((null===(I=null===(b=null==A?void 0:A.ctaBtn)||void 0===b?void 0:b.websiteLink)||void 0===I?void 0:I.link)||(null===(y=null===(L=A.ctaBtn)||void 0===L?void 0:L.websiteLink)||void 0===y?void 0:y.btnText)||(null===(N=null===(B=A.ctaBtn)||void 0===B?void 0:B.phoneNumber)||void 0===N?void 0:N.link)||(null===(O=null===(C=A.ctaBtn)||void 0===C?void 0:C.phoneNumber)||void 0===O?void 0:O.btnText)||e)&&!P&&(k(l.CREATE_TEMPLATE_DOM_IDS.actionButtons),P=!0)}return{status:x,errors:A}}parseBodyComponent(e){let t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],l=arguments.length>2?arguments[2]:void 0;var o,a,d,r,v;const s=[];let E="";const u=null===(o=e.components)||void 0===o?void 0:o.find((e=>"BODY"===e.type));return u&&(null===(d=null===(a=u.example)||void 0===a?void 0:a.body_text)||void 0===d||d[0].forEach(((t,i)=>{var o,a;let d=null===(a=null===(o=e.mapping)||void 0===o?void 0:o.body)||void 0===a?void 0:a[i];const r=d,v=d&&/\(\(/.test(d),E=null==d?void 0:d.match(n.placeHolderNamePattern);(null==E?void 0:E[2])&&(d=null==E?void 0:E[2]),s.push({idx:i,variableVal:l?t:r,editable:!!v,editableDefaultValues:v?void 0:t,variableName:null!=d?d:""})})),E=e.htmlContentUrl?e.htmlContentUrl:(null===(r=u.text)||void 0===r?void 0:r.split(/\{\{[0-9]+\}\}/).length)?null===(v=u.text)||void 0===v?void 0:v.split(/\{\{[0-9]+\}\}/).map(((e,n)=>{if(null==s?void 0:s[n]){const l=s[n].variableName;return t?`${e}{{${l}}}`:`${e} <span> </span><span style="color: ${i.COLORS.content.brand}; text-decoration: underline;">{{${l}}}</span><span> </span>`}return e})).join(""):""),{bodyVariable:s,bodyText:E}}parseFooterComponent(e){var t;const i=null===(t=e.components)||void 0===t?void 0:t.find((e=>"FOOTER"===e.type));return null==i?void 0:i.text}parseButtonComponent(e){var t,i,l,a,d,r,v;const s={actionsType:o.ACTIONS_TYPES.NONE,quickReply:[],ctaBtn:{phoneNumber:void 0,websiteLinkBtn:void 0},allButtons:[]},E=null===(t=e.components)||void 0===t?void 0:t.find((e=>"BUTTONS"===e.type));if(E&&(null===(i=null==E?void 0:E.buttons)||void 0===i?void 0:i.length)){const t="QUICK_REPLY"===(null===(l=null==E?void 0:E.buttons)||void 0===l?void 0:l[0].type)?o.ACTIONS_TYPES.QUICK_REPLY:o.ACTIONS_TYPES.CTA_BTN;if(s.actionsType=t,t===o.ACTIONS_TYPES.QUICK_REPLY){const e=null!==(d=null===(a=null==E?void 0:E.buttons)||void 0===a?void 0:a.map((e=>e)))&&void 0!==d?d:[];s.quickReply=e}else t===o.ACTIONS_TYPES.CTA_BTN&&(null===(r=null==E?void 0:E.buttons)||void 0===r||r.forEach((t=>{var i,l,o,a;if(t.phone_number&&(s.ctaBtn.phoneNumber={isChecked:!0,btnText:t.text,phoneNumber:t.phone_number}),t.url){const d=null!==(o=null===(l=null===(i=null==e?void 0:e.mapping)||void 0===i?void 0:i.buttons)||void 0===l?void 0:l[0])&&void 0!==o?o:void 0;let r=!1;d&&n.editableVarPattern.test(d)&&(r=!0),s.ctaBtn.websiteLinkBtn={isChecked:!0,btnText:t.text,linkOpens:r?null===(a=t.example)||void 0===a?void 0:a[0]:t.url,placeholder:r?void 0:d}}})));s.allButtons=null===(v=E.buttons)||void 0===v?void 0:v.map((e=>"COPY_CODE"===e.type?Object.assign(Object.assign({},e),{placeholder:Array.isArray(e.example)?e.example[0]:(null==e?void 0:e.example)||""}):e))}return s}parseLimitedTimeOfferComponent(e,i){const n={text:"",dateTime:"",code:""};return e.components.forEach((e=>{var l,o,a;if("limited_time_offer"===e.type){n.text=null!==(o=null===(l=e.limited_time_offer)||void 0===l?void 0:l.text)&&void 0!==o?o:"";const i=null===(a=e.example)||void 0===a?void 0:a.limited_time_offer;i&&i.startsWith("{{")&&i.endsWith("}}")?n.dateTime=i:n.dateTime=t.format(i?new Date(i):new Date,"MMM dd")}i.forEach((e=>{var t;"COPY_CODE"===e.type&&(n.code=null!==(t=e.placeholder)&&void 0!==t?t:"")}))})),n}parseUITemplateFromDBFormat(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){const{dbFormattedTemplate:e,isDuplicate:n,isV2:l=!1,showSampleValues:o}=t,{headerType:a,headerAssetLink:d,headerAssetName:r,headerText:v,headerVariables:s}=yield this.parseDataFromHeaderComponent(e),{bodyText:E,bodyVariable:u}=yield this.parseBodyComponent(e,l,o),{actionsType:p,quickReply:T,ctaBtn:c,allButtons:_}=yield this.parseButtonComponent(e),m=this.parseLimitedTimeOfferComponent(e,_),h={quickReply:T,ctaBtn:c,allButtons:_,meta:{name:n?`${e.label} Copy`:e.label,category:null===(i=e.category)||void 0===i?void 0:i.toUpperCase(),subCategory:e.templateCategory,language:e.language,templateId:e.templateId},error:{header:void 0,body:void 0,footer:void 0,quickReply:void 0,meta:void 0,ctaBtn:void 0},actionsType:p,footerText:this.parseFooterComponent(e),bodyVariables:u,bodyText:E,headerType:a,headerAssetLink:d,headerAssetName:r,headerText:v,headerVariables:s,alreadyAsADraft:e.isDraft,mode:"edit",initialLoading:!1,limitedTimeOfferComponent:m},{errors:R}=this.validateState(h);return h.error=R,h}))}};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),t=require("date-fns"),i=require("../../../constants/Theme.js"),n=require("../constants/regexPatterns.js"),l=require("../constants/TemplateConstants.js"),o=require("../models/TemplateMeta.js"),a=require("../utils/TemplateHelperUtils.js");exports.TemplateCreatorHelper=class{parseDataFromHeaderComponent(e,t){var i,n,l,a,d,r,v,s,u,p;const E={headerType:o.HEADER_TYPES.NONE,headerVariables:[]},T=null===(i=null==e?void 0:e.components)||void 0===i?void 0:i.find((e=>"HEADER"===e.type));if(T){E.headerType=T.format,E.headerText=T.text,E.headerAssetLink=null===(l=null===(n=T.example)||void 0===n?void 0:n.header_handle)||void 0===l?void 0:l[0];const i=null===(d=null===(a=T.example)||void 0===a?void 0:a.header_text)||void 0===d?void 0:d[0],o=null===(v=null===(r=e.mapping)||void 0===r?void 0:r.header)||void 0===v?void 0:v[0],c=o;if(i&&o){const e=null==o?void 0:o.replace("[[","").replace("]]","").replace("{{","").replace("}}","").replace("((","").replace("))",""),n=/\(\(/.test(o),l={idx:0,variableVal:t?i:c,editable:n,editableDefaultValues:n?void 0:i,variableName:e};E.headerVariables=[l],(null===(u=null===(s=T.example)||void 0===s?void 0:s.header_text)||void 0===u?void 0:u.length)&&(E.headerText=null===(p=E.headerText)||void 0===p?void 0:p.replace("{{1}}",`{{${e}}}`))}}return E}validateState(e){var t,i,d,r,v,s,u,p,E,T,c,m,_,h,b,R,y,I,L,N,x,C,B;const O=/\p{Extended_Pictographic}/u;let D="valid";const f={meta:{},ctaBtn:{phoneNumber:{btnText:"",link:""},websiteLink:{btnText:"",link:""}},quickReply:[null,null,null]},A=new a.TemplateHelperUtils;let P=!1;const k=e=>{var t;null===(t=document.getElementById(e))||void 0===t||t.scrollIntoView({behavior:"smooth",block:"nearest"})};if((null===(t=e.meta)||void 0===t?void 0:t.name)?(null===(i=e.meta.name)||void 0===i?void 0:i.trim().length)>l.NAME_LEN_LIMIT?(f.meta.name=l.NAME_LEN_ERROR,D="invalid"):n.specialCharPattern.test(null===(d=e.meta.name)||void 0===d?void 0:d.trim())&&(f.meta.name=l.NO_SPECIAL_CHAR,D="invalid"):(f.meta.name=l.REQUIRED_FIELD,D="invalid"),f.meta.name&&!P&&(k(l.CREATE_TEMPLATE_DOM_IDS.name),P=!0),e.headerType===o.HEADER_TYPES.TEXT){const t=null!==(v=null===(r=e.headerText)||void 0===r?void 0:r.trim())&&void 0!==v?v:"";if(t)if(t.length>l.HEADER_TEXT_LEN_LIMIT)f.header=l.HEADER_LEN_ERROR,D="invalid";else{const e=A.getTemplateVariablesFromState(t);e&&e.length>1&&(f.header=l.ONE_VAR_ALLOWED,D="invalid")}else f.header=l.REQUIRED_FIELD,D="invalid"}else e.headerType===o.HEADER_TYPES.DOCUMENT||e.headerType===o.HEADER_TYPES.IMAGE||(e.headerType,o.HEADER_TYPES.VIDEO);if(e.headerType!==o.HEADER_TYPES.DOCUMENT&&e.headerType!==o.HEADER_TYPES.IMAGE&&e.headerType!==o.HEADER_TYPES.VIDEO||e.headerAssetLink||(f.header=l.HEADER_ASSET_LINK_ERROR,D="invalid"),f.header&&!P&&(k(l.CREATE_TEMPLATE_DOM_IDS.header),P=!0),e.bodyText?e.bodyTextRaw&&(null===(s=e.bodyTextRaw)||void 0===s?void 0:s.trim().length)>l.BODY_TEXT_LEN_LIMIT&&(f.body=l.BODY_LEN_ERROR,D="invalid"):(f.body=l.REQUIRED_FIELD,D="invalid"),f.body&&!P&&(k(l.CREATE_TEMPLATE_DOM_IDS.body),P=!0),e.footerText&&e.footerText.length>l.HEADER_TEXT_LEN_LIMIT&&(f.footer=l.HEADER_LEN_ERROR,D="invalid"),(null==f?void 0:f.footer)&&!P&&(k(l.CREATE_TEMPLATE_DOM_IDS.footer),P=!0),e.actionsType===o.ACTIONS_TYPES.CTA_BTN){if(null===(p=null===(u=e.ctaBtn)||void 0===u?void 0:u.phoneNumber)||void 0===p?void 0:p.isChecked){const t=null===(E=e.ctaBtn.phoneNumber.btnText)||void 0===E?void 0:E.trim(),i=e.ctaBtn.phoneNumber.phoneNumber;f.ctaBtn&&!t?(f.ctaBtn.phoneNumber.btnText=l.REQUIRED_FIELD,D="invalid"):f.ctaBtn&&t&&t.length>l.QUICK_REPLY_BTN_TEXT_LIMIT?(f.ctaBtn.phoneNumber.btnText=l.QUICK_REPLY_LEN_ERROR,D="invalid"):f.ctaBtn&&t&&O.test(t)&&(f.ctaBtn.phoneNumber.btnText=l.BUTTON_EMOJI_ERROR,D="invalid"),f.ctaBtn&&!i?(f.ctaBtn.phoneNumber.link=l.REQUIRED_FIELD,D="invalid"):f.ctaBtn&&i&&i.length<10&&(f.ctaBtn.phoneNumber.link=l.VALID_PHONE_NUMBER,D="invalid")}if(null===(c=null===(T=e.ctaBtn)||void 0===T?void 0:T.websiteLinkBtn)||void 0===c?void 0:c.isChecked){const t=null===(m=e.ctaBtn.websiteLinkBtn.btnText)||void 0===m?void 0:m.trim(),i=null===(_=e.ctaBtn.websiteLinkBtn.linkOpens)||void 0===_?void 0:_.trim(),n=null===(h=e.ctaBtn.websiteLinkBtn.placeholder)||void 0===h?void 0:h.trim();f.ctaBtn&&!t?(f.ctaBtn.websiteLink.btnText=l.REQUIRED_FIELD,D="invalid"):f.ctaBtn&&t&&t.length>l.QUICK_REPLY_BTN_TEXT_LIMIT?(f.ctaBtn.websiteLink.btnText=l.QUICK_REPLY_LEN_ERROR,D="invalid"):f.ctaBtn&&t&&O.test(t)&&(f.ctaBtn.websiteLink.btnText=l.BUTTON_EMOJI_ERROR,D="invalid"),!f.ctaBtn||i||n||(f.ctaBtn.websiteLink.link=l.REQUIRED_FIELD,D="invalid")}}else if(e.actionsType===o.ACTIONS_TYPES.QUICK_REPLY){const t=["","",""];e.quickReply.forEach(((i,n)=>{var o;const a=null===(o=i.text)||void 0===o?void 0:o.trim();if(a)if(a.length>l.QUICK_REPLY_NAME_LEN_LIMIT)t[n]=l.QUICK_REPLY_LEN_ERROR,D="invalid";else if(O.test(a))t[n]=l.BUTTON_EMOJI_ERROR,D="invalid";else{const i=[...e.quickReply];i.splice(n,1);i.find((e=>e.text===a))&&(t[n]=l.QUICK_REPLY_NAME_ERROR,D="invalid")}else t[n]=l.REQUIRED_FIELD,D="invalid"})),f.quickReply=t}if(e.actionsType===o.ACTIONS_TYPES.CTA_BTN||e.actionsType===o.ACTIONS_TYPES.QUICK_REPLY){const e=null===(b=f.quickReply)||void 0===b?void 0:b.reduce(((e,t)=>e||!!t),!1);((null===(y=null===(R=null==f?void 0:f.ctaBtn)||void 0===R?void 0:R.websiteLink)||void 0===y?void 0:y.link)||(null===(L=null===(I=f.ctaBtn)||void 0===I?void 0:I.websiteLink)||void 0===L?void 0:L.btnText)||(null===(x=null===(N=f.ctaBtn)||void 0===N?void 0:N.phoneNumber)||void 0===x?void 0:x.link)||(null===(B=null===(C=f.ctaBtn)||void 0===C?void 0:C.phoneNumber)||void 0===B?void 0:B.btnText)||e)&&!P&&(k(l.CREATE_TEMPLATE_DOM_IDS.actionButtons),P=!0)}return{status:D,errors:f}}parseBodyComponent(e){let t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],l=arguments.length>2?arguments[2]:void 0;var o,a,d,r,v,s;const u=[];let p="";const E=null===(o=e.components)||void 0===o?void 0:o.find((e=>"BODY"===e.type));return E&&(null===(r=null===(d=null===(a=E.example)||void 0===a?void 0:a.body_text)||void 0===d?void 0:d[0])||void 0===r||r.forEach(((t,i)=>{var o,a;let d=null===(a=null===(o=e.mapping)||void 0===o?void 0:o.body)||void 0===a?void 0:a[i];const r=d,v=d&&/\(\(/.test(d),s=null==d?void 0:d.match(n.placeHolderNamePattern);(null==s?void 0:s[2])&&(d=null==s?void 0:s[2]),u.push({idx:i,variableVal:l?t:r,editable:!!v,editableDefaultValues:v?void 0:t,variableName:null!=d?d:""})})),p=e.htmlContentUrl?e.htmlContentUrl:(null===(v=E.text)||void 0===v?void 0:v.split(/\{\{[0-9]+\}\}/).length)?null===(s=E.text)||void 0===s?void 0:s.split(/\{\{[0-9]+\}\}/).map(((e,n)=>{if(null==u?void 0:u[n]){const l=u[n].variableName;return t?`${e}{{${l}}}`:`${e} <span> </span><span style="color: ${i.COLORS.content.brand}; text-decoration: underline;">{{${l}}}</span><span> </span>`}return e})).join(""):""),{bodyVariable:u,bodyText:p}}parseTitleComponent(e){let t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],l=arguments.length>2?arguments[2]:void 0;var o,a,d,r,v,s;const u=[];let p="";const E=null===(o=e.components)||void 0===o?void 0:o.find((e=>"TITLE"===e.type));return E&&(null===(r=null===(d=null===(a=E.example)||void 0===a?void 0:a.title_text)||void 0===d?void 0:d[0])||void 0===r||r.forEach(((t,i)=>{var o,a;let d=null===(a=null===(o=e.mapping)||void 0===o?void 0:o.body)||void 0===a?void 0:a[i];const r=d,v=d&&/\(\(/.test(d),s=null==d?void 0:d.match(n.placeHolderNamePattern);(null==s?void 0:s[2])&&(d=null==s?void 0:s[2]),u.push({idx:i,variableVal:l?t:r,editable:!!v,editableDefaultValues:v?void 0:t,variableName:null!=d?d:""})})),p=e.htmlContentUrl?e.htmlContentUrl:(null===(v=E.text)||void 0===v?void 0:v.split(/\{\{[0-9]+\}\}/).length)?null===(s=E.text)||void 0===s?void 0:s.split(/\{\{[0-9]+\}\}/).map(((e,n)=>{if(null==u?void 0:u[n]){const l=u[n].variableName;return t?`${e}{{${l}}}`:`${e} <span> </span><span style="color: ${i.COLORS.content.brand}; text-decoration: underline;">{{${l}}}</span><span> </span>`}return e})).join(""):""),{titleText:p,titleVariables:u}}parseFooterComponent(e){var t;const i=null===(t=e.components)||void 0===t?void 0:t.find((e=>"FOOTER"===e.type));return null==i?void 0:i.text}parseButtonComponent(e){var t,i,l,a,d,r,v;const s={actionsType:o.ACTIONS_TYPES.NONE,quickReply:[],ctaBtn:{phoneNumber:void 0,websiteLinkBtn:void 0},allButtons:[]},u=null===(t=e.components)||void 0===t?void 0:t.find((e=>"BUTTONS"===e.type));if(u&&(null===(i=null==u?void 0:u.buttons)||void 0===i?void 0:i.length)){const t="QUICK_REPLY"===(null===(l=null==u?void 0:u.buttons)||void 0===l?void 0:l[0].type)?o.ACTIONS_TYPES.QUICK_REPLY:o.ACTIONS_TYPES.CTA_BTN;if(s.actionsType=t,t===o.ACTIONS_TYPES.QUICK_REPLY){const e=null!==(d=null===(a=null==u?void 0:u.buttons)||void 0===a?void 0:a.map((e=>e)))&&void 0!==d?d:[];s.quickReply=e}else t===o.ACTIONS_TYPES.CTA_BTN&&(null===(r=null==u?void 0:u.buttons)||void 0===r||r.forEach((t=>{var i,l,o,a;if(t.phone_number&&(s.ctaBtn.phoneNumber={isChecked:!0,btnText:t.text,phoneNumber:t.phone_number}),t.url){const d=null!==(o=null===(l=null===(i=null==e?void 0:e.mapping)||void 0===i?void 0:i.buttons)||void 0===l?void 0:l[0])&&void 0!==o?o:void 0;let r=!1;d&&n.editableVarPattern.test(d)&&(r=!0),s.ctaBtn.websiteLinkBtn={isChecked:!0,btnText:t.text,linkOpens:r?null===(a=t.example)||void 0===a?void 0:a[0]:t.url,placeholder:r?void 0:d}}})));s.allButtons=null===(v=u.buttons)||void 0===v?void 0:v.map((e=>"COPY_CODE"===e.type?Object.assign(Object.assign({},e),{placeholder:Array.isArray(e.example)?e.example[0]:(null==e?void 0:e.example)||""}):e))}return s}parseLimitedTimeOfferComponent(e,i){const n={text:"",dateTime:"",code:""};return e.components.forEach((e=>{var l,o,a;if("limited_time_offer"===e.type){n.text=null!==(o=null===(l=e.limited_time_offer)||void 0===l?void 0:l.text)&&void 0!==o?o:"";const i=null===(a=e.example)||void 0===a?void 0:a.limited_time_offer;i&&i.startsWith("{{")&&i.endsWith("}}")?n.dateTime=i:n.dateTime=t.format(i?new Date(i):new Date,"MMM dd")}i.forEach((e=>{var t;"COPY_CODE"===e.type&&(n.code=null!==(t=e.placeholder)&&void 0!==t?t:"")}))})),n}parseUITemplateFromDBFormat(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){const{dbFormattedTemplate:e,isDuplicate:n,isV2:l=!1,showSampleValues:o}=t,{headerType:a,headerAssetLink:d,headerAssetName:r,headerText:v,headerVariables:s}=yield this.parseDataFromHeaderComponent(e),{bodyText:u,bodyVariable:p}=yield this.parseBodyComponent(e,l,o),{titleText:E,titleVariables:T}=yield this.parseTitleComponent(e,l,o),{actionsType:c,quickReply:m,ctaBtn:_,allButtons:h}=yield this.parseButtonComponent(e),b=this.parseLimitedTimeOfferComponent(e,h),R={quickReply:m,ctaBtn:_,allButtons:h,meta:{name:n?`${e.label} Copy`:e.label,category:null===(i=e.category)||void 0===i?void 0:i.toUpperCase(),subCategory:e.templateCategory,language:e.language,templateId:e.templateId},error:{header:void 0,body:void 0,footer:void 0,quickReply:void 0,meta:void 0,ctaBtn:void 0},actionsType:c,footerText:this.parseFooterComponent(e),bodyVariables:p,bodyText:u,headerType:a,headerAssetLink:d,headerAssetName:r,headerText:v,headerVariables:s,alreadyAsADraft:e.isDraft,mode:"edit",initialLoading:!1,limitedTimeOfferComponent:b,titleText:E,titleVariables:T},{errors:y}=this.validateState(R);return R.error=y,R}))}};
@@ -0,0 +1,6 @@
1
+ import { CHANNEL_TYPE } from '../models/Channels';
2
+ import { WhatsAppCarouselTemplate } from '../models/WhatsappCarouselTemplate';
3
+ export declare const isItCarousal: (channel: CHANNEL_TYPE, selectedTemplate: WhatsAppCarouselTemplate) => boolean;
4
+ export declare const determineCardIndex: (channel: CHANNEL_TYPE) => 0 | 1;
5
+ export declare const isCarouselComponent: (componentType?: string) => boolean;
6
+ export declare const isRCSChannel: (channel: CHANNEL_TYPE) => boolean;
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../models/Channels.js");const o=o=>o===e.CHANNEL_TYPE.RCS?0:1,s=e=>"carousel"===(null==e?void 0:e.toLowerCase());exports.determineCardIndex=o,exports.isCarouselComponent=s,exports.isItCarousal=(e,r)=>{var n,t;const l=o(e);return s(null===(t=null===(n=null==r?void 0:r.components)||void 0===n?void 0:n[l])||void 0===t?void 0:t.type)},exports.isRCSChannel=o=>o==e.CHANNEL_TYPE.RCS;
@@ -5,5 +5,6 @@ export declare enum CHANNEL_TYPE {
5
5
  EMAIL = "email",
6
6
  SMS = "message",
7
7
  WEBPUSH = "webpush",
8
- MESSAGE = "message"
8
+ MESSAGE = "message",
9
+ RCS = "rcs"
9
10
  }
@@ -1 +1 @@
1
- "use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),exports.CHANNEL_TYPE=void 0,(e=exports.CHANNEL_TYPE||(exports.CHANNEL_TYPE={})).WHATSAPP="whatsapp",e.INSTAGRAM="instagram",e.TIKTOK="tiktok",e.EMAIL="email",e.SMS="message",e.WEBPUSH="webpush",e.MESSAGE="message";
1
+ "use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),exports.CHANNEL_TYPE=void 0,(e=exports.CHANNEL_TYPE||(exports.CHANNEL_TYPE={})).WHATSAPP="whatsapp",e.INSTAGRAM="instagram",e.TIKTOK="tiktok",e.EMAIL="email",e.SMS="message",e.WEBPUSH="webpush",e.MESSAGE="message",e.RCS="rcs";
@@ -1,8 +1,9 @@
1
1
  /// <reference types="react" />
2
+ import { CHANNEL_TYPE } from './Channels';
2
3
  import { CUSTOM_VARIABLE, TEMPLATE_EDITOR, TEMPLATE_STATUS } from './TemplateMeta';
3
4
  export type EmailTemplateType = {
4
5
  category: string;
5
- channel: 'email';
6
+ channel: CHANNEL_TYPE;
6
7
  channelTemplateId: string;
7
8
  createdAt: {
8
9
  _seconds: number;
@@ -0,0 +1,131 @@
1
+ import { Timestamp } from 'firebase-admin/firestore';
2
+ import { TEMPLATE_STATUS } from './TemplateMeta';
3
+ import { WhatsappLikePreviewTypes, WhatsAppTemplate } from './WhatsAppTemplate';
4
+ import { CHANNEL_TYPE } from './Channels';
5
+ export interface RCSPreviewProps extends WhatsappLikePreviewTypes {
6
+ isCarousal?: boolean;
7
+ }
8
+ export interface RCSTemplateType extends WhatsAppTemplate {
9
+ id: string;
10
+ status: TEMPLATE_STATUS;
11
+ name: string;
12
+ content?: string;
13
+ mapping: {
14
+ [key: string]: string[] | object[];
15
+ };
16
+ mediaTemplateActionButtonTypes: {
17
+ [key: string]: string[] | object[];
18
+ };
19
+ customParams?: Record<string, string>;
20
+ destinationUrl?: Record<string, string>;
21
+ createdAt: number;
22
+ updatedAt: number;
23
+ templateType?: RCS_TEMPLATE_TYPE;
24
+ rcsBroadcastConfig?: {
25
+ mapping: {
26
+ [key: string]: string | object;
27
+ };
28
+ };
29
+ htmlContentUrl?: string;
30
+ templateId?: string;
31
+ channel: CHANNEL_TYPE;
32
+ headers?: string[];
33
+ }
34
+ export interface RcsTemplate {
35
+ content?: string;
36
+ components: string;
37
+ mapping: {
38
+ [key: string]: string | object;
39
+ };
40
+ mediaTemplateActionButtonTypes: {
41
+ [key: string]: string | object;
42
+ };
43
+ customParams?: Record<string, string>;
44
+ destinationUrl?: Record<string, string>;
45
+ status: TEMPLATE_STATUS;
46
+ externalStatus: RCS_TEMPLATE_STATUS;
47
+ templateType: string;
48
+ createdAt: Timestamp;
49
+ updatedAt: Timestamp;
50
+ }
51
+ export interface CreateRcsTemplatePayload {
52
+ name: string;
53
+ label: string;
54
+ storeId: string;
55
+ category: string;
56
+ channelTemplateId: string;
57
+ channel: string;
58
+ content: string;
59
+ components: string;
60
+ mapping: {
61
+ [key: string]: string | object;
62
+ };
63
+ mediaTemplateActionButtonTypes: {
64
+ [key: string]: string | object;
65
+ };
66
+ customParams?: Record<string, string>;
67
+ destinationUrl?: Record<string, string>;
68
+ botId: string;
69
+ externalStatus: RCS_TEMPLATE_STATUS;
70
+ templateType: string;
71
+ status: TEMPLATE_STATUS;
72
+ createdAt: Timestamp;
73
+ createdBy: string;
74
+ templateCategory?: string;
75
+ updatedAt: Timestamp;
76
+ templateId?: string;
77
+ }
78
+ export declare enum RCS_TEMPLATE_STATUS {
79
+ ACTIVE = "active",
80
+ APPROVED = "approved",
81
+ PENDING = "pending",
82
+ REJECTED = "rejected",
83
+ FAILED = "Failed"
84
+ }
85
+ export declare enum RCS_TEMPLATE_TYPE {
86
+ TEXT_MESSAGE = "text_message",
87
+ TEXT_MESSAGE_WITH_PDF = "text_message_with_pdf",
88
+ CAROUSEL = "carousel",
89
+ RICH_CARD = "rich_card",
90
+ UNKNOWN = "unknown"
91
+ }
92
+ export declare enum RCS_BUTTON_TYPE {
93
+ REPLY = "reply",
94
+ URL_ACTION = "url_action",
95
+ DIALER_ACTION = "dialer_action",
96
+ VIEW_LOCATION_LATLONG = "view_location_latlong",
97
+ VIEW_LOCATION_QUERY = "view_location_query",
98
+ SHARE_LOCATION = "share_location",
99
+ CALENDAR_EVENT = "calendar_event"
100
+ }
101
+ export declare enum MEDIA_FORMAT {
102
+ IMAGE = "image",
103
+ VIDEO = "video",
104
+ DOCUMENT = "document",
105
+ OTHER = "other"
106
+ }
107
+ export declare enum IMAGE_EXTENSIONS {
108
+ JPG = "jpg",
109
+ JPEG = "jpeg",
110
+ PNG = "png",
111
+ GIF = "gif",
112
+ BMP = "bmp",
113
+ WEBP = "webp"
114
+ }
115
+ export declare enum VIDEO_EXTENSIONS {
116
+ MP4 = "mp4",
117
+ MOV = "mov",
118
+ AVI = "avi",
119
+ MKV = "mkv",
120
+ WEBM = "webm"
121
+ }
122
+ export declare enum DOCUMENT_EXTENSIONS {
123
+ PDF = "pdf",
124
+ DOC = "doc",
125
+ DOCX = "docx",
126
+ XLS = "xls",
127
+ XLSX = "xlsx",
128
+ PPT = "ppt",
129
+ PPTX = "pptx",
130
+ TXT = "txt"
131
+ }
@@ -1,8 +1,9 @@
1
1
  /// <reference types="react" />
2
+ import { CHANNEL_TYPE } from './Channels';
2
3
  import { CUSTOM_VARIABLE } from './TemplateMeta';
3
4
  export type SMSTemplateType = {
4
5
  category: 'other';
5
- channel: 'message';
6
+ channel: CHANNEL_TYPE.SMS;
6
7
  channelTemplateId: string;
7
8
  content: string;
8
9
  createdAt: {
@@ -11,7 +11,7 @@ export type WhatsAppTemplate = {
11
11
  templateCategory: string;
12
12
  type?: 'email' | 'whatsapp';
13
13
  components: {
14
- type: 'HEADER' | 'BODY' | 'BUTTONS' | 'FOOTER' | 'limited_time_offer';
14
+ type: 'HEADER' | 'BODY' | 'BUTTONS' | 'FOOTER' | 'limited_time_offer' | 'TITLE';
15
15
  format?: HEADER_TYPES;
16
16
  text?: string;
17
17
  limited_time_offer?: {
@@ -33,12 +33,14 @@ export type WhatsAppTemplate = {
33
33
  body_text?: Array<string[]>;
34
34
  header_text?: Array<string>;
35
35
  limited_time_offer?: string;
36
+ title_text?: Array<string[]>;
36
37
  };
37
38
  }[];
38
39
  mapping: {
39
40
  header?: string[];
40
41
  body?: string[];
41
42
  buttons?: string[];
43
+ title?: string[];
42
44
  };
43
45
  htmlContentUrl?: string;
44
46
  language: 'en_US';
@@ -62,7 +64,9 @@ export type CreateTemplateType = {
62
64
  headerText?: string;
63
65
  headerVariables: templateVariable[];
64
66
  bodyVariables: templateVariable[];
67
+ titleVariables?: templateVariable[];
65
68
  bodyText?: string;
69
+ titleText?: string;
66
70
  bodyTextRaw?: string;
67
71
  footerText?: string;
68
72
  actionsType: ACTIONS_TYPES;
@@ -158,6 +162,7 @@ export type TemplateVariableMapping = {
158
162
  buttons: string[];
159
163
  header: string[];
160
164
  footer: string[];
165
+ title?: string[];
161
166
  };
162
167
  export type WhatsappLikePreviewTypes = {
163
168
  bodyText?: string;
@@ -191,6 +196,8 @@ export type WhatsappLikePreviewTypes = {
191
196
  limitedTimeOfferComponent?: CreateTemplateType['limitedTimeOfferComponent'];
192
197
  isWhatsappCarousel?: boolean;
193
198
  isPreview?: boolean;
199
+ titleText?: string;
200
+ titleVariableList?: variableType[];
194
201
  };
195
202
  export type WhatsappPreviewButtonType = {
196
203
  type: WhatsappTemplateButtonTypes;
@@ -241,6 +248,7 @@ export interface WhatsAppTemplateVariables {
241
248
  body: CUSTOM_VARIABLE[];
242
249
  header: CUSTOM_VARIABLE[];
243
250
  buttons: TEMPLATE_BUTTON[];
251
+ title?: CUSTOM_VARIABLE[];
244
252
  }
245
253
  export type CTABtnValType = {
246
254
  defaultValue: string;
@@ -20,7 +20,7 @@ export type WhatsAppCarouselTemplate = {
20
20
  };
21
21
  cards?: {
22
22
  components: {
23
- type: 'HEADER' | 'BODY' | 'BUTTONS' | 'FOOTER';
23
+ type: 'HEADER' | 'BODY' | 'BUTTONS' | 'FOOTER' | 'TITLE';
24
24
  format?: HEADER_TYPES;
25
25
  text?: string;
26
26
  buttons?: {
@@ -49,17 +49,21 @@ export type WhatsAppCarouselTemplate = {
49
49
  header?: string[];
50
50
  body?: string[];
51
51
  buttons?: string[];
52
+ title?: string[];
52
53
  }[];
54
+ title?: string[];
53
55
  };
54
56
  templateComponentValues: {
55
57
  components: {
56
58
  header?: string[];
57
59
  body?: string[];
58
60
  buttons?: string[];
61
+ title?: string[];
59
62
  cards?: {
60
63
  header?: string[];
61
64
  body?: string[];
62
65
  buttons?: string[];
66
+ title?: string[];
63
67
  }[];
64
68
  };
65
69
  };
@@ -80,3 +84,26 @@ export interface WhatsAppCarouselTemplateVariables {
80
84
  body: CUSTOM_VARIABLE[];
81
85
  cards: WhatsAppTemplateVariables[];
82
86
  }
87
+ export interface WhatsAppCarouselTemplateCards {
88
+ components: {
89
+ type: 'HEADER' | 'BODY' | 'BUTTONS' | 'FOOTER' | 'TITLE';
90
+ format?: HEADER_TYPES;
91
+ text?: string;
92
+ buttons?: {
93
+ type: 'QUICK_REPLY' | 'URL' | 'PHONE_NUMBER';
94
+ text?: string;
95
+ url?: string;
96
+ example?: string[];
97
+ linkMode?: 'custom' | 'home';
98
+ phone_number?: string;
99
+ flowName?: string;
100
+ flowId?: string;
101
+ }[];
102
+ example?: {
103
+ header_handle?: Array<string>;
104
+ body_text?: Array<string[]>;
105
+ header_text?: Array<string>;
106
+ title_text?: Array<string>;
107
+ };
108
+ }[];
109
+ }
@@ -1,9 +1,10 @@
1
1
  import { EmailTemplateType } from './EmailTemplate';
2
+ import { RCSTemplateType } from './RCSTemplate';
2
3
  import { SMSTemplateType } from './SmsTemplate';
3
4
  import { CUSTOM_VARIABLE } from './TemplateMeta';
4
5
  import { WebpushTemplateType, WebpushTemplateVariables } from './WebpushTemplate';
5
6
  import { WhatsAppCarouselTemplate, WhatsAppCarouselTemplateVariables } from './WhatsappCarouselTemplate';
6
7
  import { WhatsAppTemplate, WhatsAppTemplateVariables } from './WhatsAppTemplate';
7
- export type AllTemplateTypes = WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate | WebpushTemplateType | null;
8
+ export type AllTemplateTypes = WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate | WebpushTemplateType | RCSTemplateType | null;
8
9
  export type NonNullTemplateTypes = NonNullable<AllTemplateTypes>;
9
10
  export type AllTemplateVariables = CUSTOM_VARIABLE[] | WhatsAppTemplateVariables | WhatsAppCarouselTemplateVariables | WebpushTemplateVariables;
@@ -7,6 +7,4 @@ export declare const ZeroState: React.FC<{
7
7
  IconHolderStyle?: React.CSSProperties;
8
8
  style?: React.CSSProperties /** now this component is extendable through styled-component */;
9
9
  actionButton?: ButtonProps;
10
- buttonWidth?: number;
11
- Icon?: React.ReactNode;
12
10
  }>;
@@ -1,11 +1,11 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("styled-components"),i=require("../spinner/Spinner.js"),r=require("../TypographyStyle.js"),s=require("../../constants/Theme.js"),l=require("../../assets/icons/alert.svg.js"),o=require("../button/Button.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=a(n);const d=c.default.div`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),n=require("styled-components"),r=require("../spinner/Spinner.js"),i=require("../TypographyStyle.js"),s=require("../../constants/Theme.js"),l=require("../../assets/icons/alert.svg.js"),o=require("../button/Button.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=a(n);const u=c.default.div`
2
2
  background: ${s.COLORS.surface.standard};
3
3
  display: flex;
4
4
  flex-direction: column;
5
5
  align-items: center;
6
6
  justify-content: center;
7
7
  flex: 1;
8
- `,u=c.default.div`
8
+ `,d=c.default.div`
9
9
  background: ${s.COLORS.background.base};
10
10
  width: 48px;
11
11
  height: 48px;
@@ -14,4 +14,4 @@
14
14
  align-items: center;
15
15
  justify-content: center;
16
16
  border-radius: 24px;
17
- `;exports.ZeroState=n=>{var{subTitle:a,title:c,IconHolderStyle:j,style:g,isLoading:y}=n,x=e.__rest(n,["subTitle","title","IconHolderStyle","style","isLoading"]);return t.jsxs(d,Object.assign({style:null!=g?g:{}},{children:[y?t.jsx(i.Spinner,{size:"large",color:s.COLORS.stroke.brand}):t.jsx(u,Object.assign({style:null!=j?j:{}},{children:(null==x?void 0:x.Icon)||t.jsx(l.default,{color:s.COLORS.content.placeholder,height:24,width:24})})),t.jsx(r.TitleRegular,Object.assign({style:{marginTop:8,color:s.COLORS.content.primary}},{children:y?"Loading...":c||"No results found"})),!!a&&!y&&t.jsx(r.BodyCaption,Object.assign({style:{marginTop:4,color:s.COLORS.content.secondary,textAlign:"center",maxWidth:184}},{children:a})),!!(null==x?void 0:x.actionButton)&&t.jsx("div",Object.assign({style:(null==x?void 0:x.buttonWidth)?{width:null==x?void 0:x.buttonWidth,display:"flex"}:{}},{children:t.jsx(o.Button,Object.assign({},null==x?void 0:x.actionButton))}))]}))};
17
+ `;exports.ZeroState=n=>{var{subTitle:a,title:c,IconHolderStyle:j,style:g,isLoading:x}=n,y=e.__rest(n,["subTitle","title","IconHolderStyle","style","isLoading"]);return t.jsxs(u,Object.assign({style:null!=g?g:{}},{children:[x?t.jsx(r.Spinner,{size:"large",color:s.COLORS.stroke.brand}):t.jsx(d,Object.assign({style:null!=j?j:{}},{children:t.jsx(l.default,{color:s.COLORS.content.placeholder,height:24,width:24})})),t.jsx(i.TitleRegular,Object.assign({style:{marginTop:8,color:s.COLORS.content.primary}},{children:x?"Loading...":c||"No results found"})),!!a&&!x&&t.jsx(i.BodyCaption,Object.assign({style:{marginTop:4,color:s.COLORS.content.secondary,textAlign:"center",maxWidth:184}},{children:a})),!!(null==y?void 0:y.actionButton)&&t.jsx("div",{children:t.jsx(o.Button,Object.assign({},null==y?void 0:y.actionButton))})]}))};
@@ -0,0 +1 @@
1
+ import*as e from"react";var t,r,h;function a(){return a=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var h in r)Object.prototype.hasOwnProperty.call(r,h)&&(e[h]=r[h])}return e},a.apply(this,arguments)}var l=l=>e.createElement("svg",a({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},l),t||(t=e.createElement("rect",{width:24,height:24,fill:"#017AFF",rx:12})),r||(r=e.createElement("rect",{width:10,height:10,x:7,y:7,fill:"#fff",rx:2})),h||(h=e.createElement("path",{fill:"#017AFF",d:"M9.303 10.841c.405 0 .72.084.942.252.225.167.338.419.338.754 0 .35-.113.614-.338.79-.226.174-.526.261-.901.261h-.37V14H8.37v-3.159h.933Zm-.005 1.605c.217 0 .38-.044.49-.133.11-.091.164-.247.164-.466 0-.375-.218-.562-.654-.562h-.324v1.16h.324Zm2.55-1.605c.491 0 .883.111 1.175.334.296.222.444.632.444 1.23 0 .585-.145.998-.435 1.238-.29.238-.656.357-1.101.357h-.86v-3.159h.777Zm-.173.453v2.253h.297c.268 0 .478-.082.63-.246.153-.168.23-.467.23-.896 0-.3-.04-.53-.12-.69a.638.638 0 0 0-.306-.334 1.07 1.07 0 0 0-.453-.087h-.278ZM14.035 14v-3.159h1.788l-.064.448h-1.12v.946h.974v.448h-.974V14h-.603Z"})));export{l as default};
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
- import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
2
+ import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
3
3
  declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
4
4
  export default EventsTrigger;
@@ -1,2 +1,2 @@
1
- import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
1
+ import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
2
2
  export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];