@bikdotai/bik-component-library 0.0.511-beta.tcm-9 → 0.0.511

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 (79) hide show
  1. package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
  2. package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  3. package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
  4. package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  5. package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
  6. package/dist/cjs/components/bik-layout/MockMenus.d.ts +0 -1
  7. package/dist/cjs/components/helpers/FileUploaderHelper.d.ts +1 -1
  8. package/dist/cjs/components/helpers/FileUploaderHelper.js +1 -1
  9. package/dist/cjs/components/image-cropper/BikImageCropper.d.ts +1 -1
  10. package/dist/cjs/components/image-cropper/BikImageCropper.js +1 -1
  11. package/dist/cjs/components/input-with-vars/InputWithVariables.d.ts +0 -1
  12. package/dist/cjs/components/input-with-vars/InputWithVariables.js +1 -1
  13. package/dist/cjs/components/modals/styledModal.d.ts +0 -1
  14. package/dist/cjs/components/modals/styledModal.js +1 -1
  15. package/dist/cjs/components/spinner/Spinner.d.ts +0 -7
  16. package/dist/cjs/components/spinner/Spinner.js +1 -18
  17. package/dist/cjs/components/template-context-mapper/TemplateContextMapper.d.ts +1 -6
  18. package/dist/cjs/components/template-context-mapper/TemplateContextMapper.js +1 -1
  19. package/dist/cjs/components/template-context-mapper/context/templateModalContext.d.ts +0 -10
  20. package/dist/cjs/components/template-context-mapper/modalElements/Body.js +6 -9
  21. package/dist/cjs/components/template-context-mapper/modalElements/DesktopPreview.js +1 -1
  22. package/dist/cjs/components/template-context-mapper/modalElements/EditMediaModal.d.ts +0 -4
  23. package/dist/cjs/components/template-context-mapper/modalElements/EditMediaModal.js +1 -1
  24. package/dist/cjs/components/template-context-mapper/modalElements/EditMediaV2.d.ts +1 -0
  25. package/dist/cjs/components/template-context-mapper/modalElements/EditMediaV2.js +5 -6
  26. package/dist/cjs/components/template-context-mapper/modalElements/EditMediaV2.style.js +5 -6
  27. package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateMediaV2.d.ts +11 -0
  28. package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateMediaV2.js +1 -0
  29. package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +2 -2
  30. package/dist/cjs/components/template-context-mapper/modalElements/MobilePreview.js +4 -9
  31. package/dist/cjs/components/template-context-mapper/modalElements/VariableConnector.js +1 -1
  32. package/dist/cjs/components/template-context-mapper/utils/validateIsUrl.d.ts +0 -1
  33. package/dist/cjs/components/template-context-mapper/utils/validateIsUrl.js +1 -1
  34. package/dist/cjs/components/template-preview/SmsTemplatePreview.js +1 -1
  35. package/dist/cjs/components/template-preview/WhatsApp/WhatsAppLikePreviewV2.js +4 -4
  36. package/dist/cjs/index.js +1 -1
  37. package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
  38. package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  39. package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
  40. package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  41. package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
  42. package/dist/esm/components/bik-layout/MockMenus.d.ts +0 -1
  43. package/dist/esm/components/helpers/FileUploaderHelper.d.ts +1 -1
  44. package/dist/esm/components/helpers/FileUploaderHelper.js +1 -1
  45. package/dist/esm/components/image-cropper/BikImageCropper.d.ts +1 -1
  46. package/dist/esm/components/image-cropper/BikImageCropper.js +1 -1
  47. package/dist/esm/components/input-with-vars/InputWithVariables.d.ts +0 -1
  48. package/dist/esm/components/input-with-vars/InputWithVariables.js +1 -1
  49. package/dist/esm/components/modals/styledModal.d.ts +0 -1
  50. package/dist/esm/components/modals/styledModal.js +1 -1
  51. package/dist/esm/components/spinner/Spinner.d.ts +0 -7
  52. package/dist/esm/components/spinner/Spinner.js +1 -18
  53. package/dist/esm/components/template-context-mapper/TemplateContextMapper.d.ts +1 -6
  54. package/dist/esm/components/template-context-mapper/TemplateContextMapper.js +1 -1
  55. package/dist/esm/components/template-context-mapper/context/templateModalContext.d.ts +0 -10
  56. package/dist/esm/components/template-context-mapper/modalElements/Body.js +9 -12
  57. package/dist/esm/components/template-context-mapper/modalElements/DesktopPreview.js +1 -1
  58. package/dist/esm/components/template-context-mapper/modalElements/EditMediaModal.d.ts +0 -4
  59. package/dist/esm/components/template-context-mapper/modalElements/EditMediaModal.js +1 -1
  60. package/dist/esm/components/template-context-mapper/modalElements/EditMediaV2.d.ts +1 -0
  61. package/dist/esm/components/template-context-mapper/modalElements/EditMediaV2.js +5 -6
  62. package/dist/esm/components/template-context-mapper/modalElements/EditMediaV2.style.js +3 -4
  63. package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateMediaV2.d.ts +11 -0
  64. package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateMediaV2.js +1 -0
  65. package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +2 -2
  66. package/dist/esm/components/template-context-mapper/modalElements/MobilePreview.js +4 -9
  67. package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.js +3 -3
  68. package/dist/esm/components/template-context-mapper/utils/validateIsUrl.d.ts +0 -1
  69. package/dist/esm/components/template-context-mapper/utils/validateIsUrl.js +1 -1
  70. package/dist/esm/components/template-preview/SmsTemplatePreview.js +1 -1
  71. package/dist/esm/components/template-preview/WhatsApp/WhatsAppLikePreviewV2.js +5 -5
  72. package/dist/esm/index.js +1 -1
  73. package/package.json +1 -1
  74. package/dist/cjs/assets/icons/broken_media_image.svg.js +0 -1
  75. package/dist/cjs/components/template-context-mapper/modalElements/useEditWhtasappTemplateMedia.d.ts +0 -29
  76. package/dist/cjs/components/template-context-mapper/modalElements/useEditWhtasappTemplateMedia.js +0 -1
  77. package/dist/esm/assets/icons/broken_media_image.svg.js +0 -1
  78. package/dist/esm/components/template-context-mapper/modalElements/useEditWhtasappTemplateMedia.d.ts +0 -29
  79. package/dist/esm/components/template-context-mapper/modalElements/useEditWhtasappTemplateMedia.js +0 -1
@@ -4,7 +4,7 @@ import e from"styled-components";import{COLORS as r}from"../../../constants/Them
4
4
  gap: 12px;
5
5
  /* justify-content: center; */
6
6
  flex: 1;
7
- `,i=e.div`
7
+ `,o=e.div`
8
8
  width: 56px;
9
9
  height: 56px;
10
10
  display: flex;
@@ -16,7 +16,7 @@ import e from"styled-components";import{COLORS as r}from"../../../constants/Them
16
16
  border: 1px solid ${r.stroke.primary};
17
17
  box-sizing: content-box;
18
18
  cursor: ${e=>e.error?"pointer":"default"};
19
- `,o=e.div`
19
+ `,i=e.div`
20
20
  padding: 8px;
21
21
  flex-direction: row;
22
22
  display: flex;
@@ -25,9 +25,8 @@ import e from"styled-components";import{COLORS as r}from"../../../constants/Them
25
25
  border: 1px solid ${r.stroke.primary};
26
26
  border-radius: 4px;
27
27
  margin-left: 8px;
28
- align-items: center;
29
28
  `,n=e.div`
30
29
  padding-bottom: 0px;
31
30
  min-width: 285px;
32
31
  margin-bottom: 16px;
33
- `;export{o as Container,n as EditTemplateMediaContainer,i as ImageContainer,t as RightComponent};
32
+ `;export{i as Container,n as EditTemplateMediaContainer,o as ImageContainer,t as RightComponent};
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ import { VariableListInterfaceV2 } from "../../add-variableV2";
3
+ import { WhatsAppPickerMeta, WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
4
+ declare const EditMediaTemplateMediaV2: React.FC<{
5
+ mediaComponent: WhatsAppTemplate['components'][0];
6
+ template: WhatsAppTemplate;
7
+ whatsappSpecificPickerMeta: WhatsAppPickerMeta;
8
+ updateTemplateImageUrl(url: string, format: WhatsAppTemplate['components'][0]['format']): void;
9
+ variableListForImage?: VariableListInterfaceV2[];
10
+ }>;
11
+ export default EditMediaTemplateMediaV2;
@@ -0,0 +1 @@
1
+ import{__awaiter as e}from"../../../_virtual/_tslib.js";import{jsxs as i,Fragment as o,jsx as n}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import l,{useState as a,useEffect as r}from"react";import{FileUploaderHelper as d}from"../../helpers/FileUploaderHelper.js";import{BikImageCropper as s}from"../../image-cropper/BikImageCropper.js";import"../../image-compress/ImageCompress.js";import"../../states/StateComponent.js";import"../../../constants/zindex.js";import"../../modals/styledModal.js";import"../../spinner/Spinner.js";import{HEADER_TYPES as p}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as c}from"../context/templateModalContext.js";import m from"./EditMediaModal.js";import u from"./EditMediaV2.js";const v=e=>/^{{.*}}$/.test(e),f=f=>{let{mediaComponent:g,template:h,updateTemplateImageUrl:b,whatsappSpecificPickerMeta:j,variableListForImage:M}=f;var E,y,C,I,O,x,k,A;const{disableEditVariable:w,selectedCarouselIndex:T}=c(),[U,D]=a(void 0),[F,L]=a(),[N,R]=a(),[_,V]=a(!1),G=l.createRef(),[z,S]=a(!1),[B,H]=a(""),{template:P,setTemplate:W}=c(),{uploadMediaFiles:X,uploadMediaLink:$}=j;let q;function J(){var e;(null===(e=null==G?void 0:G.current)||void 0===e?void 0:e.click)&&G.current.click()}function K(i){var o;return e(this,void 0,void 0,(function*(){const e=new d;if(i instanceof Blob){const n=e.validate({file:i});if(n)H(n),S(!1);else{const e=g.format===p.IMAGE,n=yield X({file:i,fileName:U,isImage:e});if(n.success){const[e]=i.type.split("/");b(null!==(o=n.url)&&void 0!==o?o:"","application"===e?p.DOCUMENT:p[e.toUpperCase()])}else H("An unknown technical error occurred");S(!1)}}else H("An unknown technical error occurred"),S(!1)}))}return q=g.format===p.IMAGE?"image/png, image/jpeg":g.format===p.VIDEO?"video/mp4":"application/pdf",r((()=>{D(void 0),L(void 0),R(void 0),V(!1),S(!1),H("")}),[T]),i(o,{children:[n(m,{mediaComponentFormat:null!==(E=g.format)&&void 0!==E?E:p.IMAGE,uploadMedia:function(i){var o,n,l,a,r,s;return e(this,void 0,void 0,(function*(){if(H(""),R(""),V(!1),i)if(i.startsWith("https"))try{if(S(!0),$){const e=yield $(i),{type:n,size:t,success:l}=e;if(l){const i=(new d).validate({linkData:{type:n,size:t}});if(i)return H(i),void S(!1);const[l]=n.split("/");b(null!==(o=e.url)&&void 0!==o?o:"",l.includes("application")?p.DOCUMENT:p[l.toUpperCase()])}else H("An unknown technical error occurred");S(!1)}else{const e=yield fetch(i),o=yield e.blob();yield K(o)}}catch(e){H("An unknown technical error occurred")}else if(v(i)){let e;if(R(i),e=null!=T&&T>-1?{components:null===(l=null===(n=P.components[1])||void 0===n?void 0:n.cards)||void 0===l?void 0:l[T].components,mapping:null===(r=null===(a=null==P?void 0:P.mapping)||void 0===a?void 0:a.cards)||void 0===r?void 0:r[T]}:Object.assign({},P),e.components){const o=null===(s=null==e?void 0:e.components)||void 0===s?void 0:s.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==o&&o>-1&&(null==e?void 0:e.components[o])){const n=Object.assign(Object.assign({},e.components[o]),{format:g.format,example:{header_handle:[i]}}),t=[...e.components];t[o]=n,e.components=t}}if(e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[i]})),S(!1),null!=T&&T>-1){const i=t(P);i.components[1].cards[T].components=e.components,i.mapping.cards[T]=e.mapping,null==W||W(Object.assign({},i))}else null==W||W(Object.assign({},e))}else S(!1),H("Invalid URL or variable");else J()}))},variableListForImage:M||[],setOpenEditMedia:V,openEditMedia:_}),!!F&&n(s,{aspectRatio:15/8,src:F,onCropComplete:function(i){return e(this,void 0,void 0,(function*(){S(!1),H("");const e=yield fetch(i);K(yield e.blob()).then((()=>{L(void 0)}))}))},onCancel:()=>{S(!1),L(""),G.current&&(G.current.value="")}}),n("input",{ref:G,style:{display:"none"},type:"file",onChange:function(e){var i;H(""),S(!0);const o=null===(i=e.target.files)||void 0===i?void 0:i[0];if(g.format===p.IMAGE){const e=new FileReader;L(""),D(""),e.onload=()=>{L(e.result),D(null==o?void 0:o.name)},o&&e.readAsDataURL(o)}else K(o)},accept:q}),n(u,{imageName:null!==(C=null===(y=null==g?void 0:g.example)||void 0===y?void 0:y.header_handle)&&void 0!==C?C:[],handleImageChange:J,mediaType:null==g?void 0:g.format,error:B,isLoading:z,setOpenEditMedia:V,selectedVariable:v(null!==(x=null===(O=null===(I=null==g?void 0:g.example)||void 0===I?void 0:I.header_handle)||void 0===O?void 0:O[0])&&void 0!==x?x:"")?null===(A=null===(k=null==g?void 0:g.example)||void 0===k?void 0:k.header_handle)||void 0===A?void 0:A[0]:N,disableEditVariable:w})]})};export{f as default};
@@ -1,7 +1,7 @@
1
- import{jsx as e,jsxs as o,Fragment as n}from"react/jsx-runtime";import{cloneDeep as t}from"lodash";import{useRef as i,useState as l,useEffect as a}from"react";import s from"styled-components";import{Input as d}from"../../input/Input.js";import{HEADER_TYPES as r}from"../../template-preview/models/TemplateMeta.js";import{POD as p}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as u}from"../context/templateModalContext.js";import{useAdditionalVariables as c}from"../custom-hooks/useAdditionalVariables.js";import{getAllDataFromTemplateComponent as m}from"../utils/getDataFromTemplateComponent.js";import{isVariable as v}from"../utils/validateIsUrl.js";import{validateInputName as b}from"../utils/validateName.js";import{BackTrackComponent as g}from"./BackTrackComponent.js";import{DiscountCodeComponent as f}from"./DiscountCodeComponent.js";import h from"./EditMediaModal.js";import j from"./EditMediaV2.js";import{EditTemplateMediaContainer as O}from"./EditMediaV2.style.js";import{useEditWhatsappTemplateMedia as C}from"./useEditWhtasappTemplateMedia.js";import T from"./VariableConnector.js";import{Container as x}from"./VariableConnectorsPanel.js";import y from"./VariableConnectorWhatsApp.js";import E from"./VariableEditorHeader.js";import V from"./WhatsAppTemplateCardButtonV2.js";const B=s=>{let{template:B,onTemplateChange:L,whatsappSpecificPickerMeta:M,showVariableModal:I,variableList:R,variableListForImage:U,discountCode:w,setDiscountCode:N,fileName:P,setFileName:A}=s;var D,_,H,S,F,Q,q,Y,K,W,$,G,X,z,J,Z,ee,oe,ne,te,ie,le,ae,se,de,re,pe,ue,ce,me,ve,be,ge;const fe=B.isCarouselType,{originalVariableList:he,pod:je,extras:Oe,selectedCarouselIndex:Ce,isProductCarouselType:Te}=u(),{descriptionComponents:xe,urlBtns:ye,qrbBtns:Ee,imageComponent:Ve,bodyVariables:Be,headerVariables:ke}=m(B),Le=i(null),Me=c({variableList:R,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"}),[Ie,Re]=l(!1),[Ue,we]=l(-1===Ce?{descriptionComponents:xe,urlBtns:ye,qrbBtns:Ee,imageComponent:Ve,bodyVariables:Be,headerVariables:ke}:{}),{uploadMediaLink:Ne,uploadMediaFiles:Pe}=M,Ae=C({uploadMediaLink:Ne,uploadMediaFiles:Pe,updateTemplateImageUrl:function(e,o){var n,i,l,a,s,d,r,p;let u;u=null!=Ce&&Ce>-1?{components:null===(i=null===(n=B.components[1])||void 0===n?void 0:n.cards)||void 0===i?void 0:i[Ce].components,mapping:null===(a=null===(l=null==B?void 0:B.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Ce]}:Object.assign({},B);const c=null===(s=null==u?void 0:u.components)||void 0===s?void 0:s.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==c&&c>-1&&(null==u?void 0:u.components[c])){const n=Object.assign(Object.assign({},u.components[c]),{format:o,example:{header_handle:[e]}}),t=[...u.components];t[c]=n,u=Object.assign(Object.assign({},u),{components:t})}u.mapping&&(u.mapping=Object.assign(Object.assign({},u.mapping),{header:void 0}));if(null!=Ce&&Ce>-1){const e=t(B);e.components[1].cards[Ce].components=u.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==e?void 0:e.mapping)||void 0===r?void 0:r.cards.length)>0&&(e.mapping.cards[Ce]=null!==(p=u.mapping)&&void 0!==p?p:{}),null==L||L(Object.assign({},e)),_e(!0)}else null==L||L(Object.assign({},u))},mediaComponent:fe?Ue.imageComponent:Ve,fileRef:Le}),[De,_e]=l(!1),[He,Se]=l(P),[Fe,Qe]=l();function qe(e,o,n){var i,l,a,s,d,r,p,u,c,m;const v=null!=Ce&&Ce>-1?{components:null===(i=Object.assign({},B).components[1].cards)||void 0===i?void 0:i[Ce].components,mapping:null===(l=Object.assign({},B).mapping.cards)||void 0===l?void 0:l[Ce]}:Object.assign({},B),b=t(v),g="custom"===o&&"string"==typeof e,f=g?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Ce&&Ce>-1&&Te){const o=Object.assign({},B).components.map((e=>{var o;return"CAROUSEL"===e.type?Object.assign(Object.assign({},e),{cards:null===(o=e.cards)||void 0===o?void 0:o.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var o,t,i;if("BUTTONS"===e.type){const l=null===(o=e.buttons)||void 0===o?void 0:o.filter((e=>"URL"===e.type));let a=null!==(t=null==l?void 0:l[n])&&void 0!==t?t:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]});const s=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},e),{buttons:s})}return e}))})))}):e})),i=null===(s=null===(a=Object.assign({},B).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((o=>{var n;return Object.assign(Object.assign({},o),{buttons:null===(n=null==o?void 0:o.buttons)||void 0===n?void 0:n.map((o=>g?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:""))})})),l=t(B);return l.components=o,l.mapping.cards=i,void(null==L||L(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==h&&h>-1){const t=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((e=>"URL"===e.type));if((null==t?void 0:t.length)>0){const i="custom"===o&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=t[n];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(u=null===(p=null===(r=b.components)||void 0===r?void 0:r[h])||void 0===p?void 0:p.buttons)&&void 0!==u?u:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},b.components[h]),{buttons:s}),m=null===(c=b.mapping)||void 0===c?void 0:c.buttons;m&&m.length>0&&(m[n]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const v=Object.assign(Object.assign({},b.mapping),{buttons:m});b.mapping=v;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(m=e.placeHolder)||void 0===m?void 0:m.slice(2,-2))?Re(!0):(Re(!1),null==N||N(""))}if(null!=Ce&&Ce>-1){const e=t(B);e.components[1].cards[Ce].components=b.components,e.mapping.cards[Ce]=b.mapping,null==L||L(Object.assign({},e))}else null==L||L(b)}function Ye(e,o,n){var i,l,a,s,d,r;const p=null!=Ce&&Ce>-1?{components:null===(i=Object.assign({},B).components[1].cards)||void 0===i?void 0:i[Ce].components,mapping:null===(l=Object.assign({},B).mapping.cards)||void 0===l?void 0:l[Ce]}:Object.assign({},B);if(null!=Ce&&Ce>-1&&Te){const o=Object.assign({},B).components.map((o=>{var t;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(t=o.cards)||void 0===t?void 0:t.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var t,i,l;if("BUTTONS"===o.type){const a=null===(t=o.buttons)||void 0===t?void 0:t.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[n])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=o.buttons)||void 0===l?void 0:l.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e));return Object.assign(Object.assign({},o),{buttons:d})}return o}))})))}):o})),i=t(B);return i.components=o,void(null==L||L(Object.assign({},i)))}const u=null==p?void 0:p.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==u&&u>-1){const o=null===(a=null==p?void 0:p.components[u].buttons)||void 0===a?void 0:a.filter((e=>"QUICK_REPLY"===e.type));if(o){let t=o[n];t=Object.assign(Object.assign({},t),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(r=null===(d=null===(s=p.components)||void 0===s?void 0:s[u])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),l=Object.assign(Object.assign({},p.components[u]),{buttons:i}),a=[...p.components];a[u]=l,p.components=a}}if(null!=Ce&&Ce>-1){const e=t(B);e.components[1].cards[Ce].components=p.components,null==L||L(Object.assign({},e))}else null==L||L(p)}a((()=>{var e,o;if(null===(e=B.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))Re(!0);else{Re(!1);const e=null===(o=null==Oe?void 0:Oe.discountCodeExtra)||void 0===o?void 0:o[1];null==e||e("")}}),[B]),a((()=>{var e,o,n,t;if(null!=Ce&&Ce>-1){const i={components:null===(o=null===(e=B.components[1])||void 0===e?void 0:e.cards)||void 0===o?void 0:o[Ce].components,mapping:null===(t=null===(n=null==B?void 0:B.mapping)||void 0===n?void 0:n.cards)||void 0===t?void 0:t[Ce]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=m(i);we({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p})}else if(null!=Ce&&-1===Ce){const{descriptionComponents:e,urlBtns:o,qrbBtns:n,imageComponent:t,bodyVariables:i,headerVariables:l}=m(B);we({descriptionComponents:e,urlBtns:o,qrbBtns:n,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Ce]),a((()=>{var e,o,n,t;if(null!=Ce&&Ce>-1&&De){const i={components:null===(o=null===(e=B.components[1])||void 0===e?void 0:e.cards)||void 0===o?void 0:o[Ce].components,mapping:null===(t=null===(n=null==B?void 0:B.mapping)||void 0===n?void 0:n.cards)||void 0===t?void 0:t[Ce]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=m(i);we({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}),_e(!1)}}),[De]);const Ke=fe?Ue.imageComponent:Ve;return Ae.openEditMedia?e(x,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e(h,{mediaComponentFormat:null!==(D=Ke.format)&&void 0!==D?D:r.IMAGE,uploadMedia:Ae.uploadMedia,variableListForImage:U||[],useEditWhatsappTemplateMediaResponse:Ae,setOpenEditMedia:Ae.setOpenEditMedia,openEditMedia:Ae.openEditMedia,editIconRef:Ae.editIconRef,fileRef:Le})})):o(x,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!Ue.imageComponent&&!Te&&o(O,{children:[e(j,{imageName:null!==(H=null===(_=null==Ke?void 0:Ke.example)||void 0===_?void 0:_.header_handle)&&void 0!==H?H:[],handleImageChange:Ae.handleImageChange,mediaType:null==Ke?void 0:Ke.format,error:Ae.error,isLoading:Ae.loading,setOpenEditMedia:Ae.setOpenEditMedia,selectedVariable:v(null!==(Q=null===(F=null===(S=null==Ke?void 0:Ke.example)||void 0===S?void 0:S.header_handle)||void 0===F?void 0:F[0])&&void 0!==Q?Q:"")?null===(Y=null===(q=null==Ke?void 0:Ke.example)||void 0===q?void 0:q.header_handle)||void 0===Y?void 0:Y[0]:(null===(W=null===(K=null==B?void 0:B.mapping)||void 0===K?void 0:K.header)||void 0===W?void 0:W[0])?null===(G=null===($=null==B?void 0:B.mapping)||void 0===$?void 0:$.header)||void 0===G?void 0:G[0]:Ae.selectedVariable}),(null==Ve?void 0:Ve.format)==r.DOCUMENT?e(k,{children:e(d,{labelText:"PDF Name",placeholder:"Enter the name",value:He,errorMessage:Fe||void 0,onBlur:()=>{if(!He)return null==A||A(""),void Qe("PDF name is Required");const e=b(He);null==A||A(He),Qe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Qe(""),Se(e)}})}):e(n,{})]}),Ue.bodyVariables.length>0&&e(E,{containerStyle:{paddingTop:Ue.mediaComponent?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null===(X=Ue.descriptionComponents)||void 0===X?void 0:X.map(((o,n)=>e(y,{originalVariableList:null!=Ce&&Ce>-1?he.cards[Ce]:he,type:o.type,descriptionComponent:o.component,showVariableModal:I,variableList:R},n))),(null===(J=null===(z=null!=Ce&&Ce>-1?he.cards[Ce].buttons:null==he?void 0:he.buttons)||void 0===z?void 0:z.filter((e=>"URL"===e.type)))||void 0===J?void 0:J.length)>0&&e(E,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(ee=null===(Z=null!=Ce&&Ce>-1?he.cards[Ce].buttons:null==he?void 0:he.buttons)||void 0===Z?void 0:Z.filter((e=>je===p.CHATBOT||"URL"===e.type)))||void 0===ee?void 0:ee.map(((o,n)=>{if("URL"===o.type)return e(V,{variableListIndex:n,CTAoptions:null==M?void 0:M.CTAoptions,button:o,currentVariableList:null!=Ce&&Ce>-1?Object.assign({},he.cards[Ce]):Object.assign({},he),updateSelectedURLTemplateBtn:qe,variableList:R},`${n}_${Ce}`)})),je===p.CHATBOT&&(null===(ne=null===(oe=Ee[0])||void 0===oe?void 0:oe.component)||void 0===ne?void 0:ne.buttons)&&(null===(le=null===(ie=null===(te=Ee[0])||void 0===te?void 0:te.component)||void 0===ie?void 0:ie.buttons)||void 0===le?void 0:le.length)>0&&e(g,{backTrackMessage:null===(ae=null==Oe?void 0:Oe.backTrackExtra)||void 0===ae?void 0:ae[0],setBackTrackMessage:null===(se=null==Oe?void 0:Oe.backTrackExtra)||void 0===se?void 0:se[1]}),(null===(re=null===(de=null!=Ce&&Ce>-1?he.cards[Ce].buttons:null==he?void 0:he.buttons)||void 0===de?void 0:de.filter((e=>"QUICK_REPLY"===e.type)))||void 0===re?void 0:re.length)>0&&(je!==p.CHATBOT?e(E,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):e(g,{backTrackMessage:null===(pe=null==Oe?void 0:Oe.backTrackExtra)||void 0===pe?void 0:pe[0],setBackTrackMessage:null===(ue=null==Oe?void 0:Oe.backTrackExtra)||void 0===ue?void 0:ue[1]})),null===(me=null===(ce=null!=Ce&&Ce>-1?he.cards[Ce].buttons:null==he?void 0:he.buttons)||void 0===ce?void 0:ce.filter((e=>"QUICK_REPLY"===e.type)))||void 0===me?void 0:me.map(((o,n)=>{if("QUICK_REPLY"===o.type&&je!==p.CHATBOT)return e(V,{variableListIndex:n,QRBoptions:null==M?void 0:M.QRBoptions,button:o,currentVariableList:null!=Ce&&Ce>-1?Object.assign({},he.cards[Ce]):Object.assign({},he),updateSelectedQRBTemplateBtn:Ye},`${n}_${Ce}`)})),je===p.CHATBOT&&Ie&&e(f,{discountCode:null===(ve=null==Oe?void 0:Oe.discountCodeExtra)||void 0===ve?void 0:ve[0],setDiscountCode:null===(be=null==Oe?void 0:Oe.discountCodeExtra)||void 0===be?void 0:be[1],variableList:R}),null===(ge=null!=Ce&&Ce>-1?he.cards[Ce].buttons:null==he?void 0:he.buttons)||void 0===ge?void 0:ge.map(((o,n)=>{var t,i,l;if("COPY_CODE"===o.type)return e(T,{index:n,variable:{variableName:null!==(t=o.text)&&void 0!==t?t:"Copy Code",updatedValue:null!==(i=o.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(l=o.index)&&void 0!==l?l:0},showVariableModal:!0,variableList:Me,componentType:"BUTTONS"},n)}))]}))},k=s.div`
1
+ import{jsxs as n,jsx as o,Fragment as t}from"react/jsx-runtime";import{cloneDeep as e}from"lodash";import{useState as i,useEffect as l}from"react";import s from"styled-components";import{Input as a}from"../../input/Input.js";import{HEADER_TYPES as d}from"../../template-preview/models/TemplateMeta.js";import{POD as r}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as p}from"../context/templateModalContext.js";import{getAllDataFromTemplateComponent as c}from"../utils/getDataFromTemplateComponent.js";import{validateInputName as u}from"../utils/validateName.js";import{BackTrackComponent as m}from"./BackTrackComponent.js";import{DiscountCodeComponent as v}from"./DiscountCodeComponent.js";import{EditTemplateMediaContainer as b}from"./EditMediaV2.style.js";import g from"./EditWhatsAppTemplateMediaV2.js";import f from"./VariableConnector.js";import{Container as h}from"./VariableConnectorsPanel.js";import j from"./VariableConnectorWhatsApp.js";import O from"./VariableEditorHeader.js";import C from"./WhatsAppTemplateCardButtonV2.js";const T=s=>{let{template:T,onTemplateChange:y,whatsappSpecificPickerMeta:V,showVariableModal:B,variableList:E,variableListForImage:k,discountCode:L,setDiscountCode:U,fileName:I,setFileName:w}=s;var R,P,N,A,M,S,D,H,_,Q,q,Y,F,K,W,$,X,z,G,J,Z;const nn=T.isCarouselType,{originalVariableList:on,pod:tn,extras:en,selectedCarouselIndex:ln,isProductCarouselType:sn}=p(),{descriptionComponents:an,urlBtns:dn,qrbBtns:rn,imageComponent:pn,bodyVariables:cn,headerVariables:un}=c(T),[mn,vn]=i(!1),[bn,gn]=i(-1===ln?{descriptionComponents:an,urlBtns:dn,qrbBtns:rn,imageComponent:pn,bodyVariables:cn,headerVariables:un}:{}),[fn,hn]=i(!1),[jn,On]=i(I),[Cn,Tn]=i();function xn(n,o,t){var i,l,s,a,d,r,p,c,u,m;const v=null!=ln&&ln>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[ln].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[ln]}:Object.assign({},T),b=e(v),g="custom"===o&&"string"==typeof n,f=g?n:"string"!=typeof n?n.defaultValue?n.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=ln&&ln>-1&&sn){const o=Object.assign({},T).components.map((n=>{var o;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(o=n.cards)||void 0===o?void 0:o.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var o,e,i;if("BUTTONS"===n.type){const l=null===(o=n.buttons)||void 0===o?void 0:o.filter((n=>"URL"===n.type));let s=null!==(e=null==l?void 0:l[t])&&void 0!==e?e:{};s=Object.assign(Object.assign({},s),{url:"https://d.bik.ai/{{1}}",example:[f]});const a=null===(i=n.buttons)||void 0===i?void 0:i.map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==s?void 0:s.text)?s:n));return Object.assign(Object.assign({},n),{buttons:a})}return n}))})))}):n})),i=null===(a=null===(s=Object.assign({},T).mapping)||void 0===s?void 0:s.cards)||void 0===a?void 0:a.map((o=>{var t;return Object.assign(Object.assign({},o),{buttons:null===(t=null==o?void 0:o.buttons)||void 0===t?void 0:t.map((o=>g?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:""))})})),l=e(T);return l.components=o,l.mapping.cards=i,void(null==y||y(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==h&&h>-1){const e=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((n=>"URL"===n.type));if((null==e?void 0:e.length)>0){const i="custom"===o&&"string"==typeof n,l=i?n:"string"!=typeof n&&n.defaultValue?n.defaultValue:"https://d.bik.ai/";let s=e[t];s=Object.assign(Object.assign({},s),{url:"https://d.bik.ai/{{1}}",example:[l]});const a=[...null!==(c=null===(p=null===(r=b.components)||void 0===r?void 0:r[h])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((n=>"URL"===n.type&&(null==n?void 0:n.text)===(null==s?void 0:s.text)?s:n)),d=Object.assign(Object.assign({},b.components[h]),{buttons:a}),m=null===(u=b.mapping)||void 0===u?void 0:u.buttons;m&&m.length>0&&(m[t]=i?"((customBtnPlaceholder))":"string"!=typeof n?n.placeHolder:"");const v=Object.assign(Object.assign({},b.mapping),{buttons:m});b.mapping=v;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof n){"checkout.checkoutUrl"===(null===(m=n.placeHolder)||void 0===m?void 0:m.slice(2,-2))?vn(!0):(vn(!1),null==U||U(""))}if(null!=ln&&ln>-1){const n=e(T);n.components[1].cards[ln].components=b.components,n.mapping.cards[ln]=b.mapping,null==y||y(Object.assign({},n))}else null==y||y(b)}function yn(n,o,t){var i,l,s,a,d,r;const p=null!=ln&&ln>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[ln].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[ln]}:Object.assign({},T);if(null!=ln&&ln>-1&&sn){const o=Object.assign({},T).components.map((o=>{var e;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(e=o.cards)||void 0===e?void 0:e.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var e,i,l;if("BUTTONS"===o.type){const s=null===(e=o.buttons)||void 0===e?void 0:e.filter((n=>"QUICK_REPLY"===n.type));let a=null!==(i=null==s?void 0:s[t])&&void 0!==i?i:{};a=Object.assign(Object.assign({},a),{flowId:n.flowId,flowName:n.flowName});const d=null===(l=o.buttons)||void 0===l?void 0:l.map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==a?void 0:a.text)?a:n));return Object.assign(Object.assign({},o),{buttons:d})}return o}))})))}):o})),i=e(T);return i.components=o,void(null==y||y(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((n=>"BUTTONS"===n.type));if(void 0!==c&&c>-1){const o=null===(s=null==p?void 0:p.components[c].buttons)||void 0===s?void 0:s.filter((n=>"QUICK_REPLY"===n.type));if(o){let e=o[t];e=Object.assign(Object.assign({},e),{flowId:n.flowId,flowName:n.flowName});const i=[...null!==(r=null===(d=null===(a=p.components)||void 0===a?void 0:a[c])||void 0===d?void 0:d.buttons)&&void 0!==r?r:[]].map((n=>"QUICK_REPLY"===n.type&&(null==n?void 0:n.text)===(null==e?void 0:e.text)?e:n)),l=Object.assign(Object.assign({},p.components[c]),{buttons:i}),s=[...p.components];s[c]=l,p.components=s}}if(null!=ln&&ln>-1){const n=e(T);n.components[1].cards[ln].components=p.components,null==y||y(Object.assign({},n))}else null==y||y(p)}l((()=>{var n,o;if(null===(n=T.mapping.buttons)||void 0===n?void 0:n.find((n=>"checkout.checkoutUrl"===n.slice(2,-2))))vn(!0);else{vn(!1);const n=null===(o=null==en?void 0:en.discountCodeExtra)||void 0===o?void 0:o[1];null==n||n("")}}),[T]),l((()=>{var n,o,t,e;if(null!=ln&&ln>-1){const i={components:null===(o=null===(n=T.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[ln].components,mapping:null===(e=null===(t=null==T?void 0:T.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[ln]},{descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);gn({descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:d,bodyVariables:r,headerVariables:p})}else if(null!=ln&&-1===ln){const{descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:l}=c(T);gn({descriptionComponents:n,urlBtns:o,qrbBtns:t,imageComponent:e,bodyVariables:i,headerVariables:l})}}),[ln]),l((()=>{var n,o,t,e;if(null!=ln&&ln>-1&&fn){const i={components:null===(o=null===(n=T.components[1])||void 0===n?void 0:n.cards)||void 0===o?void 0:o[ln].components,mapping:null===(e=null===(t=null==T?void 0:T.mapping)||void 0===t?void 0:t.cards)||void 0===e?void 0:e[ln]},{descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);gn({descriptionComponents:l,urlBtns:s,qrbBtns:a,imageComponent:d,bodyVariables:r,headerVariables:p}),hn(!1)}}),[fn]);return n(h,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!bn.imageComponent&&!sn&&n(b,{children:[o(g,{whatsappSpecificPickerMeta:V,mediaComponent:nn?bn.imageComponent:pn,updateTemplateImageUrl:function(n,o){var t,i,l,s,a,d,r,p;let c;c=null!=ln&&ln>-1?{components:null===(i=null===(t=T.components[1])||void 0===t?void 0:t.cards)||void 0===i?void 0:i[ln].components,mapping:null===(s=null===(l=null==T?void 0:T.mapping)||void 0===l?void 0:l.cards)||void 0===s?void 0:s[ln]}:Object.assign({},T);const u=null===(a=null==c?void 0:c.components)||void 0===a?void 0:a.findIndex((n=>{if("HEADER"===n.type&&"NONE"!==n.format&&"TEXT"!==n.format)return!0}));if(void 0!==u&&u>-1&&(null==c?void 0:c.components[u])){const t=Object.assign(Object.assign({},c.components[u]),{format:o,example:{header_handle:[n]}}),e=[...c.components];e[u]=t,c=Object.assign(Object.assign({},c),{components:e})}if(c.mapping&&(c.mapping=Object.assign(Object.assign({},c.mapping),{header:void 0})),null!=ln&&ln>-1){const n=e(T);n.components[1].cards[ln].components=c.components,(null===(d=null==n?void 0:n.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==n?void 0:n.mapping)||void 0===r?void 0:r.cards.length)>0&&(n.mapping.cards[ln]=null!==(p=c.mapping)&&void 0!==p?p:{}),null==y||y(Object.assign({},n)),hn(!0)}else null==y||y(Object.assign({},c))},template:T,variableListForImage:k}),(null==pn?void 0:pn.format)==d.DOCUMENT?o(x,{children:o(a,{labelText:"PDF Name",placeholder:"Enter the name",value:jn,errorMessage:Cn||void 0,onBlur:()=>{if(!jn)return null==w||w(""),void Tn("PDF name is Required");const n=u(jn);null==w||w(jn),Tn(n?"Please enter a valid PDF name":void 0)},onChangeText:n=>{Tn(""),On(n)}})}):o(t,{})]}),bn.bodyVariables.length>0&&o(O,{containerStyle:{paddingTop:bn.mediaComponent?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null===(R=bn.descriptionComponents)||void 0===R?void 0:R.map(((n,t)=>o(j,{originalVariableList:null!=ln&&ln>-1?on.cards[ln]:on,type:n.type,descriptionComponent:n.component,showVariableModal:B,variableList:E},t))),(null===(N=null===(P=null!=ln&&ln>-1?on.cards[ln].buttons:null==on?void 0:on.buttons)||void 0===P?void 0:P.filter((n=>"URL"===n.type)))||void 0===N?void 0:N.length)>0&&o(O,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(M=null===(A=null!=ln&&ln>-1?on.cards[ln].buttons:null==on?void 0:on.buttons)||void 0===A?void 0:A.filter((n=>tn===r.CHATBOT||"URL"===n.type)))||void 0===M?void 0:M.map(((n,t)=>{if("URL"===n.type)return o(C,{variableListIndex:t,CTAoptions:null==V?void 0:V.CTAoptions,button:n,currentVariableList:null!=ln&&ln>-1?Object.assign({},on.cards[ln]):Object.assign({},on),updateSelectedURLTemplateBtn:xn,variableList:E},`${t}_${ln}`)})),tn===r.CHATBOT&&(null===(D=null===(S=rn[0])||void 0===S?void 0:S.component)||void 0===D?void 0:D.buttons)&&(null===(Q=null===(_=null===(H=rn[0])||void 0===H?void 0:H.component)||void 0===_?void 0:_.buttons)||void 0===Q?void 0:Q.length)>0&&o(m,{backTrackMessage:null===(q=null==en?void 0:en.backTrackExtra)||void 0===q?void 0:q[0],setBackTrackMessage:null===(Y=null==en?void 0:en.backTrackExtra)||void 0===Y?void 0:Y[1]}),(null===(K=null===(F=null!=ln&&ln>-1?on.cards[ln].buttons:null==on?void 0:on.buttons)||void 0===F?void 0:F.filter((n=>"QUICK_REPLY"===n.type)))||void 0===K?void 0:K.length)>0&&(tn!==r.CHATBOT?o(O,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):o(m,{backTrackMessage:null===(W=null==en?void 0:en.backTrackExtra)||void 0===W?void 0:W[0],setBackTrackMessage:null===($=null==en?void 0:en.backTrackExtra)||void 0===$?void 0:$[1]})),null===(z=null===(X=null!=ln&&ln>-1?on.cards[ln].buttons:null==on?void 0:on.buttons)||void 0===X?void 0:X.filter((n=>"QUICK_REPLY"===n.type)))||void 0===z?void 0:z.map(((n,t)=>{if("QUICK_REPLY"===n.type&&tn!==r.CHATBOT)return o(C,{variableListIndex:t,QRBoptions:null==V?void 0:V.QRBoptions,button:n,currentVariableList:null!=ln&&ln>-1?Object.assign({},on.cards[ln]):Object.assign({},on),updateSelectedQRBTemplateBtn:yn},`${t}_${ln}`)})),tn===r.CHATBOT&&mn&&o(v,{discountCode:null===(G=null==en?void 0:en.discountCodeExtra)||void 0===G?void 0:G[0],setDiscountCode:null===(J=null==en?void 0:en.discountCodeExtra)||void 0===J?void 0:J[1],variableList:E}),null===(Z=null!=ln&&ln>-1?on.cards[ln].buttons:null==on?void 0:on.buttons)||void 0===Z?void 0:Z.map(((n,t)=>{var e,i,l;if("COPY_CODE"===n.type)return o(f,{index:t,variable:{variableName:null!==(e=n.text)&&void 0!==e?e:"Copy Code",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(l=n.index)&&void 0!==l?l:0},showVariableModal:!0,variableList:E,componentType:"BUTTONS"},t)}))]}))},x=s.div`
2
2
  padding-top: 24px;
3
3
  padding-left: 10px;
4
4
  padding-right: 10px;
5
5
  margin-bottom: 8px;
6
6
  line-height: normal;
7
- `;export{B as default};
7
+ `;export{T as default};
@@ -1,12 +1,12 @@
1
- import{jsx as e,Fragment as t,jsxs as i}from"react/jsx-runtime";import a from"react";import o from"styled-components";import{TemplatePreview as r}from"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../template-preview/models/TemplateMeta.js";import{POD as p}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as s}from"../context/templateModalContext.js";import{getPreviewWidth as l}from"../utils/getPreviewDimension.js";const n=o.div`
1
+ import{jsx as e,jsxs as t}from"react/jsx-runtime";import i from"react";import a from"styled-components";import{TemplatePreview as o}from"../../template-preview/TemplatePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreview.js";import"../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js";import"../../../constants/Theme.js";import"../../curtain/CurtainHelper.js";import"../../template-preview/models/TemplateMeta.js";import{POD as r}from"../../template-preview/models/WhatsAppTemplate.js";import{useTemplateModalContext as p}from"../context/templateModalContext.js";import{getPreviewWidth as s}from"../utils/getPreviewDimension.js";const l=a.div`
2
2
  position: relative;
3
3
  height: 100%;
4
4
  border-radius: 31px;
5
- width: ${e=>l(e.channel)}px;
5
+ width: ${e=>s(e.channel)}px;
6
6
  background-color: white;
7
7
  margin: auto;
8
8
  overflow-y: auto;
9
- `,m=o.div`
9
+ `,m=a.div`
10
10
  position: absolute;
11
11
  flex: 1;
12
12
  background-color: white;
@@ -17,9 +17,4 @@ import{jsx as e,Fragment as t,jsxs as i}from"react/jsx-runtime";import a from"re
17
17
  height: calc(100% - 17px);
18
18
  border-radius: 16px;
19
19
  overflow-y: auto;
20
- `,c=a.forwardRef(((a,o)=>{let{display_content:c,channel:d,template:f,showSampleValues:w}=a;const{pod:b,hideDeviceContainerInPreview:g}=s(),v={showSampleValues:w,template:f,channel:d,smsSpecificMeta:{smsDisplayContent:c},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:b!==p.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:c,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}},isPreview:!0};return g?e(h,{children:e(r,Object.assign({},v))}):e(t,{children:i(n,Object.assign({channel:d},{children:[e("img",{alt:"",src:"https://firebasestorage.googleapis.com/v0/b/staging-bikayi.appspot.com/o/bik%2FkNwEVoGlLpVjOsXoO1M8WgvWicP2%2F6f07b850-8b4b-4d58-96cc-8ba6df7b4e4a-Device___Frame.jpg?alt=media&token=253f1bfe-8481-4f54-bdef-3c0a73697d6a",style:{width:l(d),height:443}}),e(m,Object.assign({ref:o},{children:e(r,Object.assign({},v))}))]}))})}));c.displayName="MobilePreview";const h=o.div`
21
- display: flex;
22
- align-items: center;
23
- justify-content: center;
24
- flex: 1;
25
- `;export{c as default};
20
+ `,n=i.forwardRef(((i,a)=>{let{display_content:n,channel:h,template:c,showSampleValues:d}=i;const{pod:w}=p();return e("div",{children:t(l,Object.assign({channel:h},{children:[e("img",{alt:"",src:"https://firebasestorage.googleapis.com/v0/b/staging-bikayi.appspot.com/o/bik%2FkNwEVoGlLpVjOsXoO1M8WgvWicP2%2F6f07b850-8b4b-4d58-96cc-8ba6df7b4e4a-Device___Frame.jpg?alt=media&token=253f1bfe-8481-4f54-bdef-3c0a73697d6a",style:{width:s(h),height:443}}),e(m,Object.assign({ref:a},{children:e(o,{showSampleValues:d,template:c,channel:h,smsSpecificMeta:{smsDisplayContent:n},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:w!==r.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:n,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}},isPreview:!0})}))]}))})}));n.displayName="MobilePreview";export{n as default};
@@ -1,7 +1,7 @@
1
- import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import a from"../../../assets/icons/edit.svg.js";import{format as n}from"date-fns";import{cloneDeep as i}from"lodash";import{useState as o,useEffect as s}from"react";import u from"styled-components";import{AddVariableV2SideModal as d}from"../../add-variableV2/AddVariableV2SideModal.js";import{CustomDateTime as c}from"../../custom-date-time/CustomDateTime.js";import{Dropdown as r}from"../../dropdown/Dropdown.js";import{Input as p}from"../../input/Input.js";import{truncate as m}from"../../product-picker-v2/collectionScreen.js";import{placeHolderNamePattern as v}from"../../template-preview/constants/regexPatterns.js";import{CHANNEL_TYPE as b}from"../../template-preview/models/Channels.js";import{POD as g}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as O,BodyPrimary as j}from"../../TypographyStyle.js";import h from"../../../utils/StringUtils.js";import{COLORS as x}from"../../../constants/Theme.js";import{useTemplateModalContext as y}from"../context/templateModalContext.js";import{getVariableNameForEmailByIndex as f}from"../utils/getVariableNameEmail.js";const _=u.div`
1
+ import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import a from"../../../assets/icons/edit.svg.js";import{format as i}from"date-fns";import{cloneDeep as n}from"lodash";import{useState as o,useEffect as s}from"react";import u from"styled-components";import{AddVariableV2SideModal as d}from"../../add-variableV2/AddVariableV2SideModal.js";import{CustomDateTime as c}from"../../custom-date-time/CustomDateTime.js";import{Dropdown as r}from"../../dropdown/Dropdown.js";import{Input as p}from"../../input/Input.js";import{truncate as m}from"../../product-picker-v2/collectionScreen.js";import{placeHolderNamePattern as v}from"../../template-preview/constants/regexPatterns.js";import{CHANNEL_TYPE as b}from"../../template-preview/models/Channels.js";import{POD as g}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as O,BodyPrimary as j}from"../../TypographyStyle.js";import h from"../../../utils/StringUtils.js";import{COLORS as y}from"../../../constants/Theme.js";import{useTemplateModalContext as x}from"../context/templateModalContext.js";import{getVariableNameForEmailByIndex as f}from"../utils/getVariableNameEmail.js";const _=u.div`
2
2
  /* surface/$color-background-warning-light */
3
3
 
4
- background: ${e=>e.focused&&e.channel===b.EMAIL?x.background.warning.light:"transparent"};
4
+ background: ${e=>e.focused&&e.channel===b.EMAIL?y.background.warning.light:"transparent"};
5
5
  border-radius: 4px;
6
6
  padding: 8px 10px;
7
7
  `,T=u.div`
@@ -13,4 +13,4 @@ import{jsxs as e,jsx as t,Fragment as l}from"react/jsx-runtime";import a from"..
13
13
  background-color: rgba(0, 0, 0, 0.1);
14
14
  z-index: 1000;
15
15
  cursor: not-allowed;
16
- `,E={value:"custom_link",label:"Custom URL"},k={value:"custom_text",label:"Custom text"},V={value:"static_expiry",label:"Static Expiry"},S=u=>{let{onFocus:S,variable:A,index:C,showVariableModal:B,variableList:P,setShowDiscountCheckBox:w,componentType:D,CTAoptions:N}=u;var L,U,H,R,M;const[W,I]=o(!1),[$,Y]=o(""),[z,Z]=o([]),[G,q]=o(),[F,K]=o(!1),[J,Q]=o(!1),{device:X,channel:ee,isError:te,originalVariableList:le,template:ae,templateSelectionTriggered:ne,setTemplate:ie,setDisplayContent:oe,setOriginalVariableList:se,globalNormalizedPlaceholders:ue,enabledCustomText:de,pod:ce,selectedCarouselIndex:re,isProductCarouselType:pe,disableEditVariable:me,disableEditExpiry:ve,templateErrorIndexes:be}=y();function ge(){var e,t;const l=[];let a=[];if(ee!==b.MESSAGE||de){"link"===(null==A?void 0:A.type)?(l.push({label:"",options:[E,k]}),q(E)):"date_time"===(null==A?void 0:A.type)?(l.push({label:"",options:[E,k]}),q(V)):(l.push({label:"",options:[E,k,V]}),q(k));const e=null!=ue?ue:[];Z([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:h.toCapitilize(null===(l=null===(t=e.label)||void 0===t?void 0:t.replace(/([A-Z])/g," $1"))||void 0===l?void 0:l.toLowerCase())})}))]),a=[...l,...e]}else{const e=null!=ue?ue:[];Z([{label:"",options:[k,E]},...e]),a=[{label:"",options:[k,E]},...e]}if((ee===b.WHATSAPP||ee===b.EMAIL||ee===b.MESSAGE)&&A.updatedValue)if(v.test(A.updatedValue)&&ee===b.WHATSAPP||A.updatedValue.startsWith("{{")&&ee!==b.WHATSAPP){const e=function(e,t,l){var a;let n={label:"",value:""};const i=l===b.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(B){let t=e.updatedValue;if(ce===g.CHATBOT&&"BUTTONS"===D){const l=null==N?void 0:N.filter((t=>t.placeHolder===e.updatedValue));l&&l.length>0&&(t=l[0].label)}n={label:t?t.replace("{{","").replace("}}","").trim().replace("."," "):"",value:null!==(a=e.updatedValue)&&void 0!==a?a:""}}else t.map((e=>{e.options.map((e=>{var t;(null===(t=e.value)||void 0===t?void 0:t.replace("{{","").replace("}}","").trim())===i.trim()&&(n=e)}))}));return n}(A,a,ee);e.value&&q(e)}else"date_time"===A.type?(q(V),Y(A.updatedValue),xe(null!==(e=A.index)&&void 0!==e?e:0,A.updatedValue)):(null===(t=A.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(q(E),Y(A.updatedValue.split("https://")[1])):(q(k),Y(A.updatedValue))}function Oe(e,t){var l,a,n;const i=e;Y(""),q(i),ee===b.WHATSAPP?"custom_text"!==i.value&&"custom_link"!==i.value&&"static_expiry"!==i.value?(he(null!==(l=i.value)&&void 0!==l?l:"","string"),null==xe||xe(null!==(a=A.index)&&void 0!==a?a:0,i.value,!0)):(null==xe||xe(null!==(n=A.index)&&void 0!==n?n:0,"",!0,i.value),he("","url"===i.bikPlaceholderType?"link":"string")):"custom_text"!==i.value&&"custom_link"!==i.value?he(i.value,"url"===i.bikPlaceholderType?"link":"string"):(Y(""),he("",i.value))}function je(e,t){var l;Y(t);const a="custom_link"===(null==G?void 0:G.value)&&t?t.includes("https")?t:`https://${t}`:t;he(a,"static_expiry"===e?"string":e),ee===b.WHATSAPP&&(null==xe||xe(null!==(l=A.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function he(e,t){var l,a,n,o;const s="custom_link"===t?"link":"custom_text"===t?"string":t;if(ee!==b.WHATSAPP){const a=f(C+1),n=null===document||void 0===document?void 0:document.getElementById("mobile"===X?"template_html_mobile":"template_html_desktop"),i=ee===b.EMAIL?null===(l=null==n?void 0:n.contentWindow)||void 0===l?void 0:l.document.getElementById(a):document.getElementById(a);i&&(i.textContent="custom_text"!==t&&"custom_link"!==t||e?e:A.variableName);const o=le.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t));null==se||se(o)}if(ee===b.WHATSAPP){if(null!=re&&re>-1&&pe){const l=Object.assign({},le).cards.map(((l,a)=>{var n,i;return"BODY"===D?Object.assign(Object.assign({},l),{body:null===(n=l.body)||void 0===n?void 0:n.map(((t,l)=>C===l?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t))}):"BUTTONS"===D?Object.assign(Object.assign({},l),{buttons:null===(i=l.buttons)||void 0===i?void 0:i.map(((l,a)=>a===C?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))}):l}));return void(null==se||se((e=>Object.assign(Object.assign({},e),{cards:l}))))}const l=null!=re&&re>-1?le.cards[re]:le;let u=l.body,d=l.header,c=l.buttons;if("BODY"===D?u=null===(a=l.body)||void 0===a?void 0:a.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t)):"HEADER"===D?d=null===(n=l.header)||void 0===n?void 0:n.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t)):"BUTTONS"===D&&(c=null===(o=l.buttons)||void 0===o?void 0:o.map(((l,a)=>a===C?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))),null!=re&&re>-1){const e=i(le.cards);e[re]={header:d,body:u,buttons:c},null==se||se((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==se||se((e=>Object.assign(Object.assign({},e),{header:d,body:u,buttons:c})))}}function xe(e,t,l,a){var n,o,s,u,d,c,r;if(null!=re&&re>-1&&pe){const o=Object.assign({},ae).components.map((l=>{var a;return"CAROUSEL"===l.type?Object.assign(Object.assign({},l),{cards:null===(a=l.cards)||void 0===a?void 0:a.map((l=>Object.assign(Object.assign({},l),{components:l.components.map((l=>{var a,n,i,o,s,u;if("BODY"===l.type&&"BODY"===D){if(null===(n=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===n?void 0:n[0]){const a=[...null!==(s=null===(o=null===(i=l.example)||void 0===i?void 0:i.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];a[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const n=Object.assign(Object.assign({},l.example),{body_text:[a]});return Object.assign(Object.assign({},l),{example:n})}return l}if("BUTTONS"===l.type&&"BUTTONS"===D){const a=null===(u=l.buttons)||void 0===u?void 0:u.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:[t]}):l));return a?Object.assign(Object.assign({},l),{buttons:a}):l}return l}))})))}):l})),s=i(ae);if(l){const l=null===(n=Object.assign({},ae).mapping.cards)||void 0===n?void 0:n.map(((l,n)=>{var i,o,s;if("BODY"===D)return Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((l,n)=>e===n?"custom_text"===a?`((editableVariable${n+10}))`:t:l))});if("BUTTONS"===D&&(null==l?void 0:l.buttons)){let i=-1,u=-1;return null===(o=ae.components[1].cards)||void 0===o||o[n].components.forEach((t=>{var l;"BUTTONS"===t.type&&(null===(l=t.buttons)||void 0===l||l.forEach(((t,l)=>{"URL"===t.type&&(i++,l===e&&"URL"==t.type&&(u=i))})))})),Object.assign(Object.assign({},l),{buttons:null===(s=l.buttons)||void 0===s?void 0:s.map(((e,l)=>l===u?"custom_link"===a?"((customPlaceholderName))":t:e))})}return l}));s.mapping.cards=l}return s.components=o,void(null==ie||ie(s))}const p=null!=re&&re>-1?{components:null===(o=Object.assign({},ae).components[1].cards)||void 0===o?void 0:o[re].components,mapping:null===(s=Object.assign({},ae).mapping.cards)||void 0===s?void 0:s[re]}:Object.assign({},ae),m=null===(u=null==p?void 0:p.components)||void 0===u?void 0:u.map((l=>{var a,n,i,o,s,u,d,c,r;const p=Object.assign({},l);if("BODY"===l.type&&"BODY"===D){if(null===(n=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===n?void 0:n[0]){const l=[...null!==(s=null===(o=null===(i=p.example)||void 0===i?void 0:i.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},p.example),{body_text:[l]});return Object.assign(Object.assign({},p),{example:a})}}else if("HEADER"===l.type&&"HEADER"===D){if(null===(u=l.example)||void 0===u?void 0:u.header_text){const l=[...null!==(c=null===(d=p.example)||void 0===d?void 0:d.header_text)&&void 0!==c?c:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},p.example),{header_text:l});return Object.assign(Object.assign({},p),{example:a})}}else{if("BUTTONS"===l.type&&"BUTTONS"===D){const a=null===(r=l.buttons)||void 0===r?void 0:r.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:"COPY_CODE"===l.type?t:[t]}):l));return a?Object.assign(Object.assign({},p),{buttons:a}):p}if("limited_time_offer"===l.type&&"limited_time_offer"===D)return Object.assign(Object.assign({},p),{example:Object.assign(Object.assign({},p.example),{limited_time_offer:t})})}return l}));if(p.components=m,l)if("BODY"===D&&(null===(d=null==p?void 0:p.mapping)||void 0===d?void 0:d.body))p.mapping=Object.assign(Object.assign({},p.mapping),{body:p.mapping.body.map(((l,n)=>e===n?"custom_text"===a?`((editableVariable${n+10}))`:t:l))});else if("HEADER"===D&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.header))p.mapping=Object.assign(Object.assign({},p.mapping),{header:p.mapping.header.map(((l,n)=>e===n?"custom_text"===a?`((editableVariable${n+20}))`:t:l))});else if("BUTTONS"===D&&(null===(r=null==p?void 0:p.mapping)||void 0===r?void 0:r.buttons)){let l=-1,n=-1;m.forEach((t=>{var a;"BUTTONS"===t.type&&(null===(a=t.buttons)||void 0===a||a.forEach(((t,a)=>{"URL"===t.type&&(l++,a===e&&"URL"==t.type&&(n=l))})))})),p.mapping=Object.assign(Object.assign({},p.mapping),{buttons:p.mapping.buttons.map(((e,l)=>l===n?"custom_link"===a?"((customPlaceholderName))":t:e))})}if(null!=re&&re>-1&&ae){const e=i(ae);e.components[1].cards[re].components=p.components,e.mapping.cards[re]=p.mapping,null==ie||ie(e)}else null==ie||ie(Object.assign({},p))}return s((()=>{W&&(null==S||S())}),[W]),s((()=>{!function(){var e,t,l,a,n;const i="mobile"===X?"template_html_mobile":"template_html_desktop",o=document.getElementById(i),s=(null!==(a=null===(l=null===(t=null===(e=null==o?void 0:o.contentWindow)||void 0===e?void 0:e.document)||void 0===t?void 0:t.body)||void 0===l?void 0:l.innerHTML)&&void 0!==a?a:"")+(null===(n=null==o?void 0:o.contentWindow)||void 0===n?void 0:n.document.head.innerHTML);ee===b.EMAIL&&(null==oe||oe(s))}()}),[ne]),s((()=>{ge()}),[]),s((()=>{ge()}),[re]),s((()=>{X&&G&&$&&setTimeout((()=>{he("custom_link"===(null==G?void 0:G.value)&&$?$.includes("https")?$:`https://${$}`:$,G.value)}),100)}),[X]),s((()=>{!J&&G&&A.updatedValue&&setTimeout((()=>{he("custom_link"===(null==G?void 0:G.value)&&A.updatedValue?A.updatedValue.includes("https")?A.updatedValue:`https://${A.updatedValue}`:A.updatedValue,G.value),Q(!0)}),100)}),[G]),e(_,Object.assign({channel:ee,focused:W,onMouseEnter:()=>I(!0),onMouseLeave:()=>I(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(O,Object.assign({style:{color:te&&!G?x.content.negative:x.content.primary}},{children:[null===(L=A.variableName)||void 0===L?void 0:L.replace("{{","").replace("}}","")," ","link"===(null==A?void 0:A.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:B?e("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==G?void 0:G.label)?"space-between":"flex-end"}},{children:[t(j,Object.assign({numberOfLines:1},{children:ce===g.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!==(U=null==G?void 0:G.value)&&void 0!==U?U:"")?null==G?void 0:G.label:null==G?void 0:G.value:m(null!==(H=null==G?void 0:G.label)&&void 0!==H?H:"",20,!0)})),me||"date_time"===(null==A?void 0:A.type)&&ve?t(l,{}):t(a,{onClick:()=>{K(!F)},width:24,height:24,color:x.content.primary})]})):t(r,{disabled:me,options:z,isSearchable:!1,onSelect:Oe,defaultOptions:G?[Object.assign(Object.assign({},G),{selected:!0})]:[]})})),("custom_text"===(null==G?void 0:G.value)||"custom_link"===(null==G?void 0:G.value))&&t(p,{state:me?"disabled":"none",labelText:"custom_text"===(null==G?void 0:G.value)?"Custom text value":"custom_link"===(null==G?void 0:G.value)?"Custom URL value":"",id:`variable-value-${null==G?void 0:G.value}-${C}`,value:$,errorMessage:te&&(null===(R=null==be?void 0:be.buttons)||void 0===R?void 0:R.includes(null!==(M=null==A?void 0:A.index)&&void 0!==M?M:-1))?$&&0!==$.trim().length?"custom_link"!==G.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${$.trim()}`)&&0!==$.trim().length?"custom_link"!==G.value&&$.length>30?"Length cannot be more than 30":"BUTTONS"===D&&"custom_link"!==G.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==G?void 0:G.value)?2e3:"BUTTONS"===D?15:30,noKeyDownChange:!0,prefixText:"custom_link"===(null==G?void 0:G.value)?"https://":"",placeholder:"link"===A.type||"custom_link"===G.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{je(G.value,e)}}),"static_expiry"===(null==G?void 0:G.value)&&e("div",Object.assign({style:{position:"relative"}},{children:[me&&t(T,{onClick:e=>e.preventDefault()}),t(c,{placement:"auto",time:n($?new Date($):new Date,"hh:mm a"),date:$?new Date($):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{je("static_expiry",e.toISOString())}})]})),F&&t(d,{zIndex:2e3,data:null!=P?P:[],showVariable:F,setShowVariable:K,placeholder:"Add a variable",customTrigger:e=>{null==w||w(!1),"{{custom.url}}"===e.actualValue?Oe({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?Oe({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?Oe({label:e.displayName,selected:!0,value:"static_expiry"}):Oe({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})}})]}))};export{_ as Container,S as default};
16
+ `,k={value:"custom_link",label:"Custom URL"},E={value:"custom_text",label:"Custom text"},V={value:"static_expiry",label:"Static Expiry"},S=u=>{let{onFocus:S,variable:A,index:C,showVariableModal:B,variableList:P,setShowDiscountCheckBox:w,componentType:D,CTAoptions:N}=u;var L,U,H;const[R,M]=o(!1),[W,$]=o(""),[I,Y]=o([]),[z,Z]=o(),[G,q]=o(!1),[F,K]=o(!1),{device:J,channel:Q,isError:X,originalVariableList:ee,template:te,templateSelectionTriggered:le,setTemplate:ae,setDisplayContent:ie,setOriginalVariableList:ne,globalNormalizedPlaceholders:oe,enabledCustomText:se,pod:ue,selectedCarouselIndex:de,isProductCarouselType:ce,disableEditVariable:re,disableEditExpiry:pe}=x();function me(){var e,t;const l=[];let a=[];if(Q!==b.MESSAGE||se){"link"===(null==A?void 0:A.type)?(l.push({label:"",options:[k,E]}),Z(k)):"date_time"===(null==A?void 0:A.type)?(l.push({label:"",options:[k,E]}),Z(V)):(l.push({label:"",options:[k,E,V]}),Z(E));const e=null!=oe?oe:[];Y([...l,...e.map((e=>{var t,l;return Object.assign(Object.assign({},e),{label:h.toCapitilize(null===(l=null===(t=e.label)||void 0===t?void 0:t.replace(/([A-Z])/g," $1"))||void 0===l?void 0:l.toLowerCase())})}))]),a=[...l,...e]}else{const e=null!=oe?oe:[];Y([{label:"",options:[E,k]},...e]),a=[{label:"",options:[E,k]},...e]}if((Q===b.WHATSAPP||Q===b.EMAIL||Q===b.MESSAGE)&&A.updatedValue)if(v.test(A.updatedValue)&&Q===b.WHATSAPP||A.updatedValue.startsWith("{{")&&Q!==b.WHATSAPP){const e=function(e,t,l){var a;let i={label:"",value:""};const n=l===b.WHATSAPP?e.updatedValue.replace("[[","").replace("]]",""):e.updatedValue.replace("{{","").replace("}}","");if(B){let t=e.updatedValue;if(ue===g.CHATBOT&&"BUTTONS"===D){const l=null==N?void 0:N.filter((t=>t.placeHolder===e.updatedValue));l&&l.length>0&&(t=l[0].label)}i={label:t?t.replace("{{","").replace("}}","").trim().replace("."," "):"",value:null!==(a=e.updatedValue)&&void 0!==a?a:""}}else t.map((e=>{e.options.map((e=>{var t;(null===(t=e.value)||void 0===t?void 0:t.replace("{{","").replace("}}","").trim())===n.trim()&&(i=e)}))}));return i}(A,a,Q);e.value&&Z(e)}else"date_time"===A.type?(Z(V),$(A.updatedValue),Oe(null!==(e=A.index)&&void 0!==e?e:0,A.updatedValue)):(null===(t=A.updatedValue)||void 0===t?void 0:t.startsWith("https"))?(Z(k),$(A.updatedValue.split("https://")[1])):(Z(E),$(A.updatedValue))}function ve(e,t){var l,a,i;const n=e;$(""),Z(n),Q===b.WHATSAPP?"custom_text"!==n.value&&"custom_link"!==n.value&&"static_expiry"!==n.value?(ge(null!==(l=n.value)&&void 0!==l?l:"","string"),null==Oe||Oe(null!==(a=A.index)&&void 0!==a?a:0,n.value,!0)):(null==Oe||Oe(null!==(i=A.index)&&void 0!==i?i:0,W,!0,n.value),ge("","url"===n.bikPlaceholderType?"link":"string")):"custom_text"!==n.value&&"custom_link"!==n.value?ge(n.value,"url"===n.bikPlaceholderType?"link":"string"):($(""),ge("",n.value))}function be(e,t){var l;$(t);const a="custom_link"===(null==z?void 0:z.value)&&t?t.includes("https")?t:`https://${t}`:t;ge(a,"static_expiry"===e?"string":e),Q===b.WHATSAPP&&(null==Oe||Oe(null!==(l=A.index)&&void 0!==l?l:0,a,"custom_link"===e,e))}function ge(e,t){var l,a,i,o;const s="custom_link"===t?"link":"custom_text"===t?"string":t;if(Q!==b.WHATSAPP){const a=f(C+1),i=null===document||void 0===document?void 0:document.getElementById("mobile"===J?"template_html_mobile":"template_html_desktop"),n=Q===b.EMAIL?null===(l=null==i?void 0:i.contentWindow)||void 0===l?void 0:l.document.getElementById(a):document.getElementById(a);n&&(n.textContent="custom_text"!==t&&"custom_link"!==t||e?e:A.variableName);const o=ee.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t));null==ne||ne(o)}if(Q===b.WHATSAPP){if(null!=de&&de>-1&&ce){const l=Object.assign({},ee).cards.map(((l,a)=>{var i,n;return"BODY"===D?Object.assign(Object.assign({},l),{body:null===(i=l.body)||void 0===i?void 0:i.map(((t,l)=>C===l?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t))}):"BUTTONS"===D?Object.assign(Object.assign({},l),{buttons:null===(n=l.buttons)||void 0===n?void 0:n.map(((l,a)=>a===C?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))}):l}));return void(null==ne||ne((e=>Object.assign(Object.assign({},e),{cards:l}))))}const l=null!=de&&de>-1?ee.cards[de]:ee;let u=l.body,d=l.header,c=l.buttons;if("BODY"===D?u=null===(a=l.body)||void 0===a?void 0:a.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t)):"HEADER"===D?d=null===(i=l.header)||void 0===i?void 0:i.map(((t,l)=>l===C?Object.assign(Object.assign({},t),{type:s,updatedValue:e}):t)):"BUTTONS"===D&&(c=null===(o=l.buttons)||void 0===o?void 0:o.map(((l,a)=>a===C?Object.assign(Object.assign({},l),{buttonVariable:"custom_link"===t?"((customPlaceholderName))":e,example:"COPY_CODE"===l.type?e:[e]}):l))),null!=de&&de>-1){const e=n(ee.cards);e[de]={header:d,body:u,buttons:c},null==ne||ne((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==ne||ne((e=>Object.assign(Object.assign({},e),{header:d,body:u,buttons:c})))}}function Oe(e,t,l,a){var i,o,s,u,d,c,r;if(null!=de&&de>-1&&ce){const o=Object.assign({},te).components.map((l=>{var a;return"CAROUSEL"===l.type?Object.assign(Object.assign({},l),{cards:null===(a=l.cards)||void 0===a?void 0:a.map((l=>Object.assign(Object.assign({},l),{components:l.components.map((l=>{var a,i,n,o,s,u;if("BODY"===l.type&&"BODY"===D){if(null===(i=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===i?void 0:i[0]){const a=[...null!==(s=null===(o=null===(n=l.example)||void 0===n?void 0:n.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];a[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const i=Object.assign(Object.assign({},l.example),{body_text:[a]});return Object.assign(Object.assign({},l),{example:i})}return l}if("BUTTONS"===l.type&&"BUTTONS"===D){const a=null===(u=l.buttons)||void 0===u?void 0:u.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:[t]}):l));return a?Object.assign(Object.assign({},l),{buttons:a}):l}return l}))})))}):l})),s=n(te);if(l){const l=null===(i=Object.assign({},te).mapping.cards)||void 0===i?void 0:i.map(((l,i)=>{var n,o,s;if("BODY"===D)return Object.assign(Object.assign({},l),{body:null===(n=l.body)||void 0===n?void 0:n.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});if("BUTTONS"===D&&(null==l?void 0:l.buttons)){let n=-1,u=-1;return null===(o=te.components[1].cards)||void 0===o||o[i].components.forEach((t=>{var l;"BUTTONS"===t.type&&(null===(l=t.buttons)||void 0===l||l.forEach(((t,l)=>{"URL"===t.type&&(n++,l===e&&"URL"==t.type&&(u=n))})))})),Object.assign(Object.assign({},l),{buttons:null===(s=l.buttons)||void 0===s?void 0:s.map(((e,l)=>l===u?"custom_link"===a?"((customPlaceholderName))":t:e))})}return l}));s.mapping.cards=l}return s.components=o,void(null==ae||ae(s))}const p=null!=de&&de>-1?{components:null===(o=Object.assign({},te).components[1].cards)||void 0===o?void 0:o[de].components,mapping:null===(s=Object.assign({},te).mapping.cards)||void 0===s?void 0:s[de]}:Object.assign({},te),m=null===(u=null==p?void 0:p.components)||void 0===u?void 0:u.map((l=>{var a,i,n,o,s,u,d,c,r;const p=Object.assign({},l);if("BODY"===l.type&&"BODY"===D){if(null===(i=null===(a=l.example)||void 0===a?void 0:a.body_text)||void 0===i?void 0:i[0]){const l=[...null!==(s=null===(o=null===(n=p.example)||void 0===n?void 0:n.body_text)||void 0===o?void 0:o[0])&&void 0!==s?s:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},p.example),{body_text:[l]});return Object.assign(Object.assign({},p),{example:a})}}else if("HEADER"===l.type&&"HEADER"===D){if(null===(u=l.example)||void 0===u?void 0:u.header_text){const l=[...null!==(c=null===(d=p.example)||void 0===d?void 0:d.header_text)&&void 0!==c?c:[]];l[e]=t.replace("{{","").replace("}}","").replace("((","").replace("))","");const a=Object.assign(Object.assign({},p.example),{header_text:l});return Object.assign(Object.assign({},p),{example:a})}}else{if("BUTTONS"===l.type&&"BUTTONS"===D){const a=null===(r=l.buttons)||void 0===r?void 0:r.map(((l,a)=>a===e?Object.assign(Object.assign({},l),{example:"COPY_CODE"===l.type?t:[t]}):l));return a?Object.assign(Object.assign({},p),{buttons:a}):p}if("limited_time_offer"===l.type&&"limited_time_offer"===D)return Object.assign(Object.assign({},p),{example:Object.assign(Object.assign({},p.example),{limited_time_offer:t})})}return l}));if(p.components=m,l)if("BODY"===D&&(null===(d=null==p?void 0:p.mapping)||void 0===d?void 0:d.body))p.mapping=Object.assign(Object.assign({},p.mapping),{body:p.mapping.body.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+10}))`:t:l))});else if("HEADER"===D&&(null===(c=null==p?void 0:p.mapping)||void 0===c?void 0:c.header))p.mapping=Object.assign(Object.assign({},p.mapping),{header:p.mapping.header.map(((l,i)=>e===i?"custom_text"===a?`((editableVariable${i+20}))`:t:l))});else if("BUTTONS"===D&&(null===(r=null==p?void 0:p.mapping)||void 0===r?void 0:r.buttons)){let l=-1,i=-1;m.forEach((t=>{var a;"BUTTONS"===t.type&&(null===(a=t.buttons)||void 0===a||a.forEach(((t,a)=>{"URL"===t.type&&(l++,a===e&&"URL"==t.type&&(i=l))})))})),p.mapping=Object.assign(Object.assign({},p.mapping),{buttons:p.mapping.buttons.map(((e,l)=>l===i?"custom_link"===a?"((customPlaceholderName))":t:e))})}if(null!=de&&de>-1&&te){const e=n(te);e.components[1].cards[de].components=p.components,e.mapping.cards[de]=p.mapping,null==ae||ae(e)}else null==ae||ae(Object.assign({},p))}return s((()=>{R&&(null==S||S())}),[R]),s((()=>{!function(){var e,t,l,a,i;const n="mobile"===J?"template_html_mobile":"template_html_desktop",o=document.getElementById(n),s=(null!==(a=null===(l=null===(t=null===(e=null==o?void 0:o.contentWindow)||void 0===e?void 0:e.document)||void 0===t?void 0:t.body)||void 0===l?void 0:l.innerHTML)&&void 0!==a?a:"")+(null===(i=null==o?void 0:o.contentWindow)||void 0===i?void 0:i.document.head.innerHTML);Q===b.EMAIL&&(null==ie||ie(s))}()}),[le]),s((()=>{me()}),[]),s((()=>{me()}),[de]),s((()=>{J&&z&&W&&setTimeout((()=>{ge("custom_link"===(null==z?void 0:z.value)&&W?W.includes("https")?W:`https://${W}`:W,z.value)}),100)}),[J]),s((()=>{!F&&z&&A.updatedValue&&setTimeout((()=>{ge("custom_link"===(null==z?void 0:z.value)&&A.updatedValue?A.updatedValue.includes("https")?A.updatedValue:`https://${A.updatedValue}`:A.updatedValue,z.value),K(!0)}),100)}),[z]),e(_,Object.assign({channel:Q,focused:R,onMouseEnter:()=>M(!0),onMouseLeave:()=>M(!1)},{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(O,Object.assign({style:{color:X&&!z?y.content.negative:y.content.primary}},{children:[null===(L=A.variableName)||void 0===L?void 0:L.replace("{{","").replace("}}","")," ","link"===(null==A?void 0:A.type)?"link":"variable"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:B?e("div",Object.assign({style:{display:"flex",border:"#E0E0E0 1px solid",borderRadius:4,padding:10,justifyContent:(null==z?void 0:z.label)?"space-between":"flex-end"}},{children:[t(j,Object.assign({numberOfLines:1},{children:ue===g.CHATBOT?["static_expiry","custom_text","custom_link"].includes(null!==(U=null==z?void 0:z.value)&&void 0!==U?U:"")?null==z?void 0:z.label:null==z?void 0:z.value:m(null!==(H=null==z?void 0:z.label)&&void 0!==H?H:"",20,!0)})),re||"date_time"===(null==A?void 0:A.type)&&pe?t(l,{}):t(a,{onClick:()=>{q(!G)},width:24,height:24,color:y.content.primary})]})):t(r,{disabled:re,options:I,isSearchable:!1,onSelect:ve,defaultOptions:z?[Object.assign(Object.assign({},z),{selected:!0})]:[]})})),("custom_text"===(null==z?void 0:z.value)||"custom_link"===(null==z?void 0:z.value))&&t(p,{state:re?"disabled":"none",labelText:"custom_text"===(null==z?void 0:z.value)?"Custom text value":"custom_link"===(null==z?void 0:z.value)?"Custom URL value":"",id:`variable-value-${null==z?void 0:z.value}-${C}`,value:W,errorMessage:X?W&&0!==W.trim().length?"custom_link"!==z.value||/^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b(?:[-a-zA-Z0-9()@:%_\+.~#?&\/=]*)$/.test(`https://${W.trim()}`)&&0!==W.trim().length?"custom_link"!==z.value&&W.length>30?"Length cannot be more than 30":"BUTTONS"===D&&"custom_link"!==z.value?"Enter valid alpha numeric code":"":"Enter valid URL":"Required field":"",maxCharLimit:"custom_link"===(null==z?void 0:z.value)?2e3:"BUTTONS"===D?15:30,noKeyDownChange:!0,prefixText:"custom_link"===(null==z?void 0:z.value)?"https://":"",placeholder:"link"===A.type||"custom_link"===z.value?"Enter custom URL here":"Enter custom text here",onChangeText:e=>{be(z.value,e)}}),"static_expiry"===(null==z?void 0:z.value)&&e("div",Object.assign({style:{position:"relative"}},{children:[re&&t(T,{onClick:e=>e.preventDefault()}),t(c,{placement:"auto",time:i(W?new Date(W):new Date,"hh:mm a"),date:W?new Date(W):new Date,minDate:new Date,error:"",setError:()=>{},onChange:e=>{be("static_expiry",e.toISOString())}})]})),G&&t(d,{zIndex:2e3,data:null!=P?P:[],showVariable:G,setShowVariable:q,placeholder:"Add a variable",customTrigger:e=>{null==w||w(!1),"{{custom.url}}"===e.actualValue?ve({label:e.displayName,selected:!0,value:"custom_link"}):"{{custom.text}}"==e.actualValue?ve({label:e.displayName,selected:!0,value:"custom_text"}):"{{static.expiry}}"==e.actualValue?ve({label:e.displayName,selected:!0,value:"static_expiry"}):ve({label:e.displayName.replace("{{","").replace("}}","").trim().replace("."," "),selected:!0,value:e.actualValue,bikPlaceholderType:"string"})}})]}))};export{_ as Container,S as default};
@@ -1,2 +1 @@
1
1
  export declare const validateIsUrl: (receivedMediaLink: string) => boolean;
2
- export declare const isVariable: (value: string) => boolean;
@@ -1 +1 @@
1
- const t=t=>new RegExp("^(https?://)?([a-z0-9-]+\\.)+[a-z]{2,}(\\.[a-z]{2,})?(\\:[0-9]+)?(/[\\w@.-]*)*$","i").test(t),e=t=>/^{{.*}}$/.test(t);export{e as isVariable,t as validateIsUrl};
1
+ const t=t=>new RegExp("^(https?://)?([a-z0-9-]+\\.)+[a-z]{2,}(\\.[a-z]{2,})?(\\:[0-9]+)?(/[\\w@.-]*)*$","i").test(t);export{t as validateIsUrl};
@@ -1 +1 @@
1
- import{jsx as e,jsxs as t,Fragment as r}from"react/jsx-runtime";import i from"../../assets/icons/arrow_left.svg.js";import n from"../../assets/icons/more_vertical.svg.js";import o from"../../assets/icons/search.svg.js";import{COLORS as l}from"../../constants/Theme.js";import{useTemplateModalContext as s}from"../template-context-mapper/context/templateModalContext.js";import{TitleRegular as a,Caption as c}from"../TypographyStyle.js";import{renderVariableUIForPreview as m}from"./helpers/SmsTemplateHelper.js";import d from"./SMS/SMSBubble.js";import{SMSBubbleContainer as p,SMSCardHeader as h,SMSHeader as f}from"./SmsTemplatePreview.styled.js";const g=g=>{let{template:j,variableStore:v,hideHeader:y,display_content:u,onlyTemplateContent:x,size:b}=g;var w;const S=null==j?void 0:j.content,{hideDeviceContainerInPreview:z}=s();return z?e(p,Object.assign({size:b},{children:e(d,{size:null!=b?b:"large",content:null!=u?u:m(S,null!=v?v:[])})})):t(r,{children:[!y&&!x&&e(h,{children:e(a,Object.assign({style:{maxWidth:"100%"}},{children:j.name}))}),!x&&e(f,{children:t(r,{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(i,{width:16,height:16,color:l.content.secondary}),e(c,{children:null===(w=null==j?void 0:j.headers)||void 0===w?void 0:w[0]})]})),t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(o,{width:16,height:16,color:l.content.secondary}),e(n,{width:16,height:16,color:l.content.secondary})]}))]})}),e(p,Object.assign({size:b},{children:e(d,{size:null!=b?b:"large",content:null!=u?u:m(S,null!=v?v:[])})}))]})};export{g as default};
1
+ import{jsxs as e,Fragment as t,jsx as r}from"react/jsx-runtime";import s from"../../assets/icons/arrow_left.svg.js";import o from"../../assets/icons/more_vertical.svg.js";import i from"../../assets/icons/search.svg.js";import{COLORS as l}from"../../constants/Theme.js";import{TitleRegular as n,Caption as c}from"../TypographyStyle.js";import{renderVariableUIForPreview as a}from"./helpers/SmsTemplateHelper.js";import d from"./SMS/SMSBubble.js";import{SMSCardHeader as m,SMSHeader as h,SMSBubbleContainer as p}from"./SmsTemplatePreview.styled.js";const f=f=>{let{template:g,variableStore:y,hideHeader:j,display_content:v,onlyTemplateContent:u,size:S}=f;var b;const w=null==g?void 0:g.content;return e(t,{children:[!j&&!u&&r(m,{children:r(n,Object.assign({style:{maxWidth:"100%"}},{children:g.name}))}),!u&&r(h,{children:e(t,{children:[e("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[r(s,{width:16,height:16,color:l.content.secondary}),r(c,{children:null===(b=null==g?void 0:g.headers)||void 0===b?void 0:b[0]})]})),e("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[r(i,{width:16,height:16,color:l.content.secondary}),r(o,{width:16,height:16,color:l.content.secondary})]}))]})}),r(p,Object.assign({size:S},{children:r(d,{size:null!=S?S:"large",content:null!=v?v:a(w,null!=y?y:[])})}))]})};export{f as default};
@@ -1,10 +1,10 @@
1
- import{jsx as e,Fragment as o,jsxs as t}from"react/jsx-runtime";import r from"styled-components";import{useTemplateModalContext as a}from"../../template-context-mapper/context/templateModalContext.js";import{TitleRegular as s}from"../../TypographyStyle.js";import{COLORS as i}from"../../../constants/Theme.js";import{getPreviewPropLen as p}from"../utils/getPreviewPropLen.js";import n from"./ChatHeader.js";import{ChatUIV2 as d}from"./ChatUiV2.js";const m=r.div`
2
- background-image: ${e=>e.isWhatsappCarousel?"none":"url('https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F341dba50-e84e-4457-b5b5-d9d8a0b95a73?alt=media&token=6fd32f23-8bb2-4980-bbee-bef39b38fd9f')"};
1
+ import{jsx as e,Fragment as r,jsxs as o}from"react/jsx-runtime";import a from"styled-components";import{TitleRegular as t}from"../../TypographyStyle.js";import{COLORS as s}from"../../../constants/Theme.js";import{getPreviewPropLen as i}from"../utils/getPreviewPropLen.js";import p from"./ChatHeader.js";import{ChatUIV2 as n}from"./ChatUiV2.js";const d=a.div`
2
+ background-image: url(${e=>e.isWhatsappCarousel?void 0:"https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F341dba50-e84e-4457-b5b5-d9d8a0b95a73?alt=media&token=6fd32f23-8bb2-4980-bbee-bef39b38fd9f"});
3
3
  border-radius: 4px;
4
4
  background-repeat: no-repeat;
5
5
  background-position: center;
6
6
  background-size: cover;
7
7
  position: relative;
8
- `,c=r(s)`
9
- color: ${i.content.primary};
10
- `,l=r=>{const{hideDeviceContainerInPreview:s}=a();return 3===p(r)?e(o,{children:r.zeroStateComponent}):s?e(d,Object.assign({showHeader:r.showHeader},r)):e(o,{children:t(m,Object.assign({style:r.containerStyle,showHeader:r.showHeader,isWhatsappCarousel:r.isWhatsappCarousel},{children:[r.showHeader&&e(n,{}),t("div",Object.assign({style:{padding:"small"===r.size?"12px 32px 12px 12px":`16px ${r.isWhatsappCarousel?"0px":"56px"} ${r.isWhatsappCarousel?"2px":"16px"} 16px`}},{children:[!r.hidePreviewText&&e("div",Object.assign({style:{marginBottom:16}},{children:e(c,{children:"Preview"})})),e(d,Object.assign({showHeader:r.showHeader},r))]}))]}))})};export{l as WhatsappLikePreviewV2};
8
+ `,c=a(t)`
9
+ color: ${s.content.primary};
10
+ `,m=a=>{const t=i(a);return e(r,3===t?{children:a.zeroStateComponent}:{children:o(d,Object.assign({style:a.containerStyle,showHeader:a.showHeader,isWhatsappCarousel:a.isWhatsappCarousel},{children:[a.showHeader&&e(p,{}),o("div",Object.assign({style:{padding:"small"===a.size?"12px 32px 12px 12px":`16px ${a.isWhatsappCarousel?"0px":"56px"} ${a.isWhatsappCarousel?"2px":"16px"} 16px`}},{children:[!a.hidePreviewText&&e("div",Object.assign({style:{marginBottom:16}},{children:e(c,{children:"Preview"})})),e(n,Object.assign({showHeader:a.showHeader},a))]}))]}))})};export{m as WhatsappLikePreviewV2};
package/dist/esm/index.js CHANGED
@@ -1 +1 @@
1
- import*as o from"./components/template-preview/constants/regexPatterns.js";export{o as regexPatterns};export{default as StringUtils}from"./utils/StringUtils.js";export{BASE_COLORS,COLORS,DEFAULT_THEME,FONTS}from"./constants/Theme.js";export{ComponentZindex}from"./constants/zindex.js";export{CheckBox}from"./components/checkBox/CheckBox.js";export{ListItem}from"./components/list-item/ListItem.js";export{Pagination}from"./components/pagination/Pagination.js";export{RadioButton}from"./components/radioButton/RadioButton.js";export{Toaster}from"./components/toaster/Toaster.js";export{Tooltip}from"./components/tooltips/Tooltip.js";export{PureSpinner,Spinner}from"./components/spinner/Spinner.js";export{Stepper}from"./components/stepper/Stepper.js";export{Tag}from"./components/tag/Tag.js";export{IconButton}from"./components/icon-button/IconButton.js";export{TemplatePreview}from"./components/template-preview/TemplatePreview.js";export{WhatsappLikePreview}from"./components/template-preview/WhatsApp/WhatsAppLikePreview.js";export{WhatsappLikePreviewV2}from"./components/template-preview/WhatsApp/WhatsAppLikePreviewV2.js";export{renderVariableUIForPreview}from"./components/template-preview/helpers/SmsTemplateHelper.js";export{WhatsAppFormatToHTML}from"./components/template-preview/helpers/WhatsAppFormatToHTML.js";export{VariableEditorHelper}from"./components/template-preview/helpers/VariableEditorHelper.js";export{ACTIONS_TYPES,CUSTOM_URL_NAME,HEADER_TYPES,TEMPLATE_EDITOR,TEMPLATE_STATUS}from"./components/template-preview/models/TemplateMeta.js";export{BUTTON_TYPE,POD}from"./components/template-preview/models/WhatsAppTemplate.js";export{TemplateContextMapper}from"./components/template-context-mapper/TemplateContextMapper.js";export{getAllDataFromTemplateComponent}from"./components/template-context-mapper/utils/getDataFromTemplateComponent.js";export{isVariable,validateIsUrl}from"./components/template-context-mapper/utils/validateIsUrl.js";export{FABMenu}from"./components/fab-menu/FABMenu.js";export{FloatingActionButton}from"./components/floating-action-button/FloatingActionButton.js";export{DROP_POSITION,DropdownToggleContainer,FAB_POSITION,FloatingActionButtonContainer,FloatingActionButtonOuterContainer,MENU_ALIGNMENT,StyledDropdown,TooltipStyled}from"./components/floating-action-button/FloatingActionButton.styles.js";export{ImageService}from"./components/image-compress/ImageCompress.js";export{BodyCaption,BodyLarge,BodyPrimary,BodyPrimaryLink,BodyRegular,BodySecondary,BodySecondaryLink,BodyTiny,ButtonLarge,ButtonRegular,Caption,Display,SmallRegular,SubHeading,TitleLarge,TitleMedium,TitleRegular,TitleSmall}from"./components/TypographyStyle.js";export{Button}from"./components/button/Button.js";export{ProgressBarComponent,ProgressCompletedBar}from"./components/progress-bar/ProgressBarComponent.js";import"react/jsx-runtime";export{QueryBuilder}from"./components/QueryBuilder/QueryBuilder.js";export{BaseQueryBuilderNode}from"./components/QueryBuilder/components/QueryBuilderNode/Base/BaseQueryBuilderNode.js";export{PropertyNode,PropertyNodeHeadless}from"./components/QueryBuilder/components/QueryBuilderNode/Property/PropertyNode.js";export{queryBuilderSlice}from"./components/QueryBuilder/redux/queryBuilder.reducer.js";export{queryBuilderCacheSlice}from"./components/QueryBuilder/redux/queryBuilderCache.reducer.js";export{AD_STRING_OPERATORS,ANY_AD_OPERATORS,ANY_IG_OPERATORS,BOOLEAN_OPERATORS,DATE_OPERATORS,EVENT_VALUES,EXACTLY_OPERATORS,FREQUENCY_OPERATORS,ICE_BREAKER_OPERATORS,IG_STRING_OPERATORS,INTEGER_OPERATORS,MAIL_SUBJECT_OPERATORS,REACTION_OPERATORS,SPECIFIC_IG_OPERATORS,STRING_OPERATORS,STRING_RESTRICTED_OPERATORS,STRING_RESTRICTED_OPERATORS_2,STRING_RESTRICTED_OPERATORS_3}from"./components/QueryBuilder/types/QueryBuilderOperator.type.js";export{StyledModal}from"./components/modals/styledModal.js";export{DropdownPopover}from"./components/dropdown/DropdownPopover/index.js";export{Dropdown}from"./components/dropdown/Dropdown.js";export{ChipDropdown}from"./components/dropdown/ChipDropdown.js";export{OpenedDropdown}from"./components/dropdown/OpenedDropdown/components/OpennedDropdown.js";export{MenuItemDropdown}from"./components/dropdown/MenuItem/MenuItem.js";export{AnalyticsCard}from"./components/analytics-card/AnalyticsCard.js";export{AnalyticsContainer,CardDataContainer}from"./components/analytics-card/AnalyticsCard.styled.js";export{Input}from"./components/input/Input.js";export{AnalyticsChip}from"./components/analytics-chips-and-dropdowns/AnalyticsChip.js";export{AnalyticsDropdown,EachItem,formatDate}from"./components/analytics-chips-and-dropdowns/AnalyticsDropdown.js";export{AnalyticsMultiChip}from"./components/analytics-chips-and-dropdowns/AnalyticsMultiChip.js";export{AnalyticsMetric}from"./components/analytics-chips-and-dropdowns/AnalyticsMetric.js";export{AnalyticsTrend}from"./components/analytics-chips-and-dropdowns/AnalyticsTrend.js";export{LineChart}from"./components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.js";export{LinearChipGroupedChart}from"./components/analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.js";export{Card,PieChartAnalytics}from"./components/analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js";export{PieChart}from"./components/analytics-chips-and-dropdowns/chart/Pie/PieChart.js";export{HorizontalGraph}from"./components/analytics-chips-and-dropdowns/chart/HorizontalBarGraph/HorizontalGraph.js";export{StackedBarChart}from"./components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js";export{StackedBarDistributionChart}from"./components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.js";export{GRAPH_ORIENTATION}from"./components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.model.js";export{VerticalGraph}from"./components/analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.js";export{HEAT,HEAT_COLORS,HEAT_GRADING_TYPE,HeatMap}from"./components/analytics-chips-and-dropdowns/chart/heatmap/HeatMap.js";export{HeatBoxStyled,HeatMapVertical}from"./components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.js";export{VerticalBarAndLinearGraph}from"./components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js";export{calculatePercentage,roundNumber,truncateValueTo10K,truncateValueToK}from"./components/analytics-chips-and-dropdowns/chart/utils/calcPercentage.js";export{AVATAR_SIZE_VS_ICON_SIZE_MAP,Avatar,BACKGROUND_VS_TEXT_COLOR_MAP}from"./components/avatar/Avatar.js";export{AVATAR_BACKGROUND,AVATAR_SIZE_MAP,AVATAR_TYPES,SIZE}from"./components/avatar/AvatarHelper.js";export{Alert}from"./components/alerts/Alert.js";export{ALERT_TYPES,COLOR_CONFIG_MAP,CONTENT_POSITION}from"./components/alerts/AlertHelper.js";export{RATIO,Thumbnail}from"./components/thumbnail/Thumbnail.js";export{Curtain}from"./components/curtain/Curtain.js";export{DatePicker}from"./components/datePicker/DatePicker.js";export{Loader,Switch,SwitchContainer,Thumb}from"./components/switch/Switch.js";export{SubscriptionPlan}from"./components/plans/SubscriptionPlan.js";export{BottomWrapper,HeaderWrapper,SubscriptionPlanSelector,defaultTabs}from"./components/plans/SubscriptionPlanSelector.js";export{NewSubscriptionPlan}from"./components/plans/NewSubscriptionPlan.js";export{SubscriptionPlansCollected}from"./components/plans/SubscriptionPlansCollected.js";export{TabItemComponent,Tabs}from"./components/tabs/Tabs.js";export{DynamicTabs}from"./components/dynamic-tabs/DynamicTabs.js";export{BikShimmer}from"./components/shimmer/ShimmerComponent/BikShimmer.js";export{TablePagination}from"./components/TablePagination/TablePagination.js";export{TablePaginationCard,TablePaginationCardStyled}from"./components/TablePagination/TablePaginationCard.js";export{StateModalComponent}from"./components/states-modal/StateModalComponent.js";export{DeleteConfirmationModal}from"./components/states-modal/DeleteConfirmationModal.js";export{ButtonActions,ButtonTypes,StateComponent,StateInterface}from"./components/states/StateComponent.js";export{ShopifyScopeWrapper}from"./components/states/ShopifyScopeWrapper.js";export{WhatsAppTextEditor}from"./components/WhatsAppTextEditor/WhatsAppTextEditor.js";export{EditorActionTypes,WhatsAppTextEditorHeader}from"./components/WhatsAppTextEditor/WhatsAppTextEditorHeader.js";export{BaseWhatsappContentLangHelper}from"./helpers/BaseWhatsappContentLang.helper.js";export{CURTAIN_COLOR_CONFIG_MAP,CURTAIN_MODE,CURTAIN_TYPES}from"./components/curtain/CurtainHelper.js";export{resizeImage}from"./utils/resizeImage.js";export{CardSelectionModal}from"./components/card-selection-modal/CardSelectionModal.js";export{BikImageCropper}from"./components/image-cropper/BikImageCropper.js";export{BikImagePipeline}from"./components/image-cropper/BikImagePipeline/BikImagePipeline.js";export{ButtonGroup}from"./components/buttonGroup/ButtonGroup.js";export{BikAccordion}from"./components/accordion/Accordion.js";export{FileUploader}from"./components/file-uploader/FileUploader.js";export{ColourInput}from"./components/colourInput/ColourInput.js";export{BikHeader}from"./components/bik-layout/BikHeader.js";export{BikLayout}from"./components/bik-layout/BikLayout.js";export{BikProfile}from"./components/bik-layout/BikProfile.js";export{SimpleSidebar}from"./components/bik-layout/SimpleSidebar.js";export{BikSidebar}from"./components/bik-layout/BikSidebar.js";export{FeatureModal}from"./components/bik-layout/FeatureModal.js";export{SidebarSkeleton}from"./components/bik-layout/SidebarSkeleton.js";export{ShowShopifyRestrictedModal}from"./components/bik-layout/ShowShopifyRestrictedModal.js";export{FeatureModalV2}from"./components/bik-layout/FeatureModalV2.js";export{SearchBar}from"./components/searchBar/searchBar.js";export{CustomDateTime}from"./components/custom-date-time/CustomDateTime.js";export{PricePleaseProductPicker,ProductPickerContent}from"./components/product-picker/ProductPickerModal.js";export{DiscountModal}from"./components/discount-modal/DiscountModal.js";export{COUPON_EXPIRATION,CouponExpiration}from"./components/discount-modal/CouponExpiration/CouponExpiration.js";export{DISCOUNT_TARGET_SELECTION,DISCOUNT_TARGET_TYPES,DISCOUNT_TYPES,DISCOUNT_VALUE_TYPES,MIN_PURCHASE_REQUIREMENT}from"./components/discount-modal/type.js";export{CountryCodePicker}from"./components/country-code-picker/CountryCodePicker.js";export{CountriesData}from"./components/country-code-picker/CountryCodePicker.modal.js";export{DEFAULT_IMAGE,ShimmerImage}from"./components/shimmer-image/ShimmerImage.js";export{ProductPickerModal,ScreenName}from"./components/product-picker-v2/modal.js";export{Carousel}from"./components/carousel/carousel.js";export{CarouselSecondary}from"./components/carousel-secondary/CarouselSecondary.js";export{AccessTokenTroubleshootDialog}from"./components/access-token-troubleshoot-dialog/AccessTokenTroubleshootDialog.js";export{RadioList}from"./components/radioList/RadioList.js";export{CheckList}from"./components/checkList/CheckList.js";export{DateKeys,MEDIA_TYPES,PostPicker,dateOptions}from"./components/postPicker/postPicker.js";export{DropdownButton}from"./components/dropdown-button/DropdownButton.js";export{SideModal}from"./components/side-modal/SideModal.js";export{KeywordsInput}from"./components/keywords-input/KeywordsInput.js";export{AddVariableV2SideModal}from"./components/add-variableV2/AddVariableV2SideModal.js";export{AddVariableV2}from"./components/add-variableV2/AddVariableV2.js";export{NaLinkWrapper,NavigationHyperlink}from"./components/navigation-hyperlink/NavigationHyperlink.js";export{SearchFilter}from"./components/SearchFilter/index.js";export{InputWithVariables}from"./components/input-with-vars/InputWithVariables.js";export{DashboardReviewPopUp}from"./components/dashboard-review-popup/DashboardReviewPopUp.js";export{StarRating}from"./components/star-rating/StarRating.js";export{TestimonialCard}from"./components/testimonial-card/TestimonialCard.js";export{BikSlider}from"./components/slider/slider.js";export{ResizableImage}from"./components/resizeImage/index.js";export{validateURL}from"./utils/validator.js";export{CarouselPreview}from"./components/carousel-preview/CarouselPreview.js";export{Floater}from"./components/floater/floater.js";export{CardSelector}from"./components/card-selector/CardSelector.js";export{CardSelectorGroup}from"./components/card-selector/CardSelectorGroup.js";
1
+ import*as o from"./components/template-preview/constants/regexPatterns.js";export{o as regexPatterns};export{default as StringUtils}from"./utils/StringUtils.js";export{BASE_COLORS,COLORS,DEFAULT_THEME,FONTS}from"./constants/Theme.js";export{ComponentZindex}from"./constants/zindex.js";export{CheckBox}from"./components/checkBox/CheckBox.js";export{ListItem}from"./components/list-item/ListItem.js";export{Pagination}from"./components/pagination/Pagination.js";export{RadioButton}from"./components/radioButton/RadioButton.js";export{Toaster}from"./components/toaster/Toaster.js";export{Tooltip}from"./components/tooltips/Tooltip.js";export{Spinner}from"./components/spinner/Spinner.js";export{Stepper}from"./components/stepper/Stepper.js";export{Tag}from"./components/tag/Tag.js";export{IconButton}from"./components/icon-button/IconButton.js";export{TemplatePreview}from"./components/template-preview/TemplatePreview.js";export{WhatsappLikePreview}from"./components/template-preview/WhatsApp/WhatsAppLikePreview.js";export{WhatsappLikePreviewV2}from"./components/template-preview/WhatsApp/WhatsAppLikePreviewV2.js";export{renderVariableUIForPreview}from"./components/template-preview/helpers/SmsTemplateHelper.js";export{WhatsAppFormatToHTML}from"./components/template-preview/helpers/WhatsAppFormatToHTML.js";export{VariableEditorHelper}from"./components/template-preview/helpers/VariableEditorHelper.js";export{ACTIONS_TYPES,CUSTOM_URL_NAME,HEADER_TYPES,TEMPLATE_EDITOR,TEMPLATE_STATUS}from"./components/template-preview/models/TemplateMeta.js";export{BUTTON_TYPE,POD}from"./components/template-preview/models/WhatsAppTemplate.js";export{TemplateContextMapper}from"./components/template-context-mapper/TemplateContextMapper.js";export{getAllDataFromTemplateComponent}from"./components/template-context-mapper/utils/getDataFromTemplateComponent.js";export{validateIsUrl}from"./components/template-context-mapper/utils/validateIsUrl.js";export{FABMenu}from"./components/fab-menu/FABMenu.js";export{FloatingActionButton}from"./components/floating-action-button/FloatingActionButton.js";export{DROP_POSITION,DropdownToggleContainer,FAB_POSITION,FloatingActionButtonContainer,FloatingActionButtonOuterContainer,MENU_ALIGNMENT,StyledDropdown,TooltipStyled}from"./components/floating-action-button/FloatingActionButton.styles.js";export{ImageService}from"./components/image-compress/ImageCompress.js";export{BodyCaption,BodyLarge,BodyPrimary,BodyPrimaryLink,BodyRegular,BodySecondary,BodySecondaryLink,BodyTiny,ButtonLarge,ButtonRegular,Caption,Display,SmallRegular,SubHeading,TitleLarge,TitleMedium,TitleRegular,TitleSmall}from"./components/TypographyStyle.js";export{Button}from"./components/button/Button.js";export{ProgressBarComponent,ProgressCompletedBar}from"./components/progress-bar/ProgressBarComponent.js";import"react/jsx-runtime";export{QueryBuilder}from"./components/QueryBuilder/QueryBuilder.js";export{BaseQueryBuilderNode}from"./components/QueryBuilder/components/QueryBuilderNode/Base/BaseQueryBuilderNode.js";export{PropertyNode,PropertyNodeHeadless}from"./components/QueryBuilder/components/QueryBuilderNode/Property/PropertyNode.js";export{queryBuilderSlice}from"./components/QueryBuilder/redux/queryBuilder.reducer.js";export{queryBuilderCacheSlice}from"./components/QueryBuilder/redux/queryBuilderCache.reducer.js";export{AD_STRING_OPERATORS,ANY_AD_OPERATORS,ANY_IG_OPERATORS,BOOLEAN_OPERATORS,DATE_OPERATORS,EVENT_VALUES,EXACTLY_OPERATORS,FREQUENCY_OPERATORS,ICE_BREAKER_OPERATORS,IG_STRING_OPERATORS,INTEGER_OPERATORS,MAIL_SUBJECT_OPERATORS,REACTION_OPERATORS,SPECIFIC_IG_OPERATORS,STRING_OPERATORS,STRING_RESTRICTED_OPERATORS,STRING_RESTRICTED_OPERATORS_2,STRING_RESTRICTED_OPERATORS_3}from"./components/QueryBuilder/types/QueryBuilderOperator.type.js";export{StyledModal}from"./components/modals/styledModal.js";export{DropdownPopover}from"./components/dropdown/DropdownPopover/index.js";export{Dropdown}from"./components/dropdown/Dropdown.js";export{ChipDropdown}from"./components/dropdown/ChipDropdown.js";export{OpenedDropdown}from"./components/dropdown/OpenedDropdown/components/OpennedDropdown.js";export{MenuItemDropdown}from"./components/dropdown/MenuItem/MenuItem.js";export{AnalyticsCard}from"./components/analytics-card/AnalyticsCard.js";export{AnalyticsContainer,CardDataContainer}from"./components/analytics-card/AnalyticsCard.styled.js";export{Input}from"./components/input/Input.js";export{AnalyticsChip}from"./components/analytics-chips-and-dropdowns/AnalyticsChip.js";export{AnalyticsDropdown,EachItem,formatDate}from"./components/analytics-chips-and-dropdowns/AnalyticsDropdown.js";export{AnalyticsMultiChip}from"./components/analytics-chips-and-dropdowns/AnalyticsMultiChip.js";export{AnalyticsMetric}from"./components/analytics-chips-and-dropdowns/AnalyticsMetric.js";export{AnalyticsTrend}from"./components/analytics-chips-and-dropdowns/AnalyticsTrend.js";export{LineChart}from"./components/analytics-chips-and-dropdowns/chart/LineChart/LineChart.js";export{LinearChipGroupedChart}from"./components/analytics-chips-and-dropdowns/chart/linearChipGroupedChart/LinearChipGroupedChart.js";export{Card,PieChartAnalytics}from"./components/analytics-chips-and-dropdowns/chart/Pie/PieChartAnalytics.js";export{PieChart}from"./components/analytics-chips-and-dropdowns/chart/Pie/PieChart.js";export{HorizontalGraph}from"./components/analytics-chips-and-dropdowns/chart/HorizontalBarGraph/HorizontalGraph.js";export{StackedBarChart}from"./components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js";export{StackedBarDistributionChart}from"./components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.js";export{GRAPH_ORIENTATION}from"./components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarDistributionChart.model.js";export{VerticalGraph}from"./components/analytics-chips-and-dropdowns/chart/VerticalBarGraph/VerticalGraph.js";export{HEAT,HEAT_COLORS,HEAT_GRADING_TYPE,HeatMap}from"./components/analytics-chips-and-dropdowns/chart/heatmap/HeatMap.js";export{HeatBoxStyled,HeatMapVertical}from"./components/analytics-chips-and-dropdowns/chart/heatmap/HeatMapVertical.js";export{VerticalBarAndLinearGraph}from"./components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js";export{calculatePercentage,roundNumber,truncateValueTo10K,truncateValueToK}from"./components/analytics-chips-and-dropdowns/chart/utils/calcPercentage.js";export{AVATAR_SIZE_VS_ICON_SIZE_MAP,Avatar,BACKGROUND_VS_TEXT_COLOR_MAP}from"./components/avatar/Avatar.js";export{AVATAR_BACKGROUND,AVATAR_SIZE_MAP,AVATAR_TYPES,SIZE}from"./components/avatar/AvatarHelper.js";export{Alert}from"./components/alerts/Alert.js";export{ALERT_TYPES,COLOR_CONFIG_MAP,CONTENT_POSITION}from"./components/alerts/AlertHelper.js";export{RATIO,Thumbnail}from"./components/thumbnail/Thumbnail.js";export{Curtain}from"./components/curtain/Curtain.js";export{DatePicker}from"./components/datePicker/DatePicker.js";export{Loader,Switch,SwitchContainer,Thumb}from"./components/switch/Switch.js";export{SubscriptionPlan}from"./components/plans/SubscriptionPlan.js";export{BottomWrapper,HeaderWrapper,SubscriptionPlanSelector,defaultTabs}from"./components/plans/SubscriptionPlanSelector.js";export{NewSubscriptionPlan}from"./components/plans/NewSubscriptionPlan.js";export{SubscriptionPlansCollected}from"./components/plans/SubscriptionPlansCollected.js";export{TabItemComponent,Tabs}from"./components/tabs/Tabs.js";export{DynamicTabs}from"./components/dynamic-tabs/DynamicTabs.js";export{BikShimmer}from"./components/shimmer/ShimmerComponent/BikShimmer.js";export{TablePagination}from"./components/TablePagination/TablePagination.js";export{TablePaginationCard,TablePaginationCardStyled}from"./components/TablePagination/TablePaginationCard.js";export{StateModalComponent}from"./components/states-modal/StateModalComponent.js";export{DeleteConfirmationModal}from"./components/states-modal/DeleteConfirmationModal.js";export{ButtonActions,ButtonTypes,StateComponent,StateInterface}from"./components/states/StateComponent.js";export{ShopifyScopeWrapper}from"./components/states/ShopifyScopeWrapper.js";export{WhatsAppTextEditor}from"./components/WhatsAppTextEditor/WhatsAppTextEditor.js";export{EditorActionTypes,WhatsAppTextEditorHeader}from"./components/WhatsAppTextEditor/WhatsAppTextEditorHeader.js";export{BaseWhatsappContentLangHelper}from"./helpers/BaseWhatsappContentLang.helper.js";export{CURTAIN_COLOR_CONFIG_MAP,CURTAIN_MODE,CURTAIN_TYPES}from"./components/curtain/CurtainHelper.js";export{resizeImage}from"./utils/resizeImage.js";export{CardSelectionModal}from"./components/card-selection-modal/CardSelectionModal.js";export{BikImageCropper}from"./components/image-cropper/BikImageCropper.js";export{BikImagePipeline}from"./components/image-cropper/BikImagePipeline/BikImagePipeline.js";export{ButtonGroup}from"./components/buttonGroup/ButtonGroup.js";export{BikAccordion}from"./components/accordion/Accordion.js";export{FileUploader}from"./components/file-uploader/FileUploader.js";export{ColourInput}from"./components/colourInput/ColourInput.js";export{BikHeader}from"./components/bik-layout/BikHeader.js";export{BikLayout}from"./components/bik-layout/BikLayout.js";export{BikProfile}from"./components/bik-layout/BikProfile.js";export{SimpleSidebar}from"./components/bik-layout/SimpleSidebar.js";export{BikSidebar}from"./components/bik-layout/BikSidebar.js";export{FeatureModal}from"./components/bik-layout/FeatureModal.js";export{SidebarSkeleton}from"./components/bik-layout/SidebarSkeleton.js";export{ShowShopifyRestrictedModal}from"./components/bik-layout/ShowShopifyRestrictedModal.js";export{FeatureModalV2}from"./components/bik-layout/FeatureModalV2.js";export{SearchBar}from"./components/searchBar/searchBar.js";export{CustomDateTime}from"./components/custom-date-time/CustomDateTime.js";export{PricePleaseProductPicker,ProductPickerContent}from"./components/product-picker/ProductPickerModal.js";export{DiscountModal}from"./components/discount-modal/DiscountModal.js";export{COUPON_EXPIRATION,CouponExpiration}from"./components/discount-modal/CouponExpiration/CouponExpiration.js";export{DISCOUNT_TARGET_SELECTION,DISCOUNT_TARGET_TYPES,DISCOUNT_TYPES,DISCOUNT_VALUE_TYPES,MIN_PURCHASE_REQUIREMENT}from"./components/discount-modal/type.js";export{CountryCodePicker}from"./components/country-code-picker/CountryCodePicker.js";export{CountriesData}from"./components/country-code-picker/CountryCodePicker.modal.js";export{DEFAULT_IMAGE,ShimmerImage}from"./components/shimmer-image/ShimmerImage.js";export{ProductPickerModal,ScreenName}from"./components/product-picker-v2/modal.js";export{Carousel}from"./components/carousel/carousel.js";export{CarouselSecondary}from"./components/carousel-secondary/CarouselSecondary.js";export{AccessTokenTroubleshootDialog}from"./components/access-token-troubleshoot-dialog/AccessTokenTroubleshootDialog.js";export{RadioList}from"./components/radioList/RadioList.js";export{CheckList}from"./components/checkList/CheckList.js";export{DateKeys,MEDIA_TYPES,PostPicker,dateOptions}from"./components/postPicker/postPicker.js";export{DropdownButton}from"./components/dropdown-button/DropdownButton.js";export{SideModal}from"./components/side-modal/SideModal.js";export{KeywordsInput}from"./components/keywords-input/KeywordsInput.js";export{AddVariableV2SideModal}from"./components/add-variableV2/AddVariableV2SideModal.js";export{AddVariableV2}from"./components/add-variableV2/AddVariableV2.js";export{NaLinkWrapper,NavigationHyperlink}from"./components/navigation-hyperlink/NavigationHyperlink.js";export{SearchFilter}from"./components/SearchFilter/index.js";export{InputWithVariables}from"./components/input-with-vars/InputWithVariables.js";export{DashboardReviewPopUp}from"./components/dashboard-review-popup/DashboardReviewPopUp.js";export{StarRating}from"./components/star-rating/StarRating.js";export{TestimonialCard}from"./components/testimonial-card/TestimonialCard.js";export{BikSlider}from"./components/slider/slider.js";export{ResizableImage}from"./components/resizeImage/index.js";export{validateURL}from"./utils/validator.js";export{CarouselPreview}from"./components/carousel-preview/CarouselPreview.js";export{Floater}from"./components/floater/floater.js";export{CardSelector}from"./components/card-selector/CardSelector.js";export{CardSelectorGroup}from"./components/card-selector/CardSelectorGroup.js";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.511-beta.tcm-9",
3
+ "version": "0.0.511",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",
@@ -1 +0,0 @@
1
- "use strict";function e(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=e(require("react"));function n(){return n=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},n.apply(this,arguments)}var a=e=>r.createElement("svg",n({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},e),t||(t=r.createElement("path",{fill:"#000",d:"M21.35 21.35a.92.92 0 0 0 0-1.3L3.95 2.65a.92.92 0 1 0-1.3 1.3L3 4.3V19c0 1.1.9 2 2 2h14.7l.35.35a.92.92 0 0 0 1.3 0ZM5 19V6.3l7.6 7.6-1.5 1.9L9 13.1 6 17h9.7l2 2H5ZM8.8 5l-2-2H19c1.1 0 2 .9 2 2v12.2l-2-2V5H8.8Z"})));exports.default=a;
@@ -1,29 +0,0 @@
1
- import React from 'react';
2
- import { WhatsAppPickerMeta, WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
3
- export type UseEditWhatsappTemplateMediaResponse = ReturnType<typeof useEditWhatsappTemplateMedia>;
4
- export declare const useEditWhatsappTemplateMedia: (props: {
5
- uploadMediaLink?: WhatsAppPickerMeta['uploadMediaLink'];
6
- uploadMediaFiles: WhatsAppPickerMeta['uploadMediaFiles'];
7
- updateTemplateImageUrl: (url: string, format: WhatsAppTemplate['components'][0]['format']) => void;
8
- fileRef: React.RefObject<HTMLInputElement | null>;
9
- mediaComponent: any;
10
- }) => {
11
- uploadMedia: (urlOrVariable?: string) => Promise<void>;
12
- processImageUpload: (file?: Blob | File) => Promise<void>;
13
- handleImageUpload: ($event: React.ChangeEvent<HTMLInputElement>) => void;
14
- handleImageChange: () => void;
15
- onCropComplete: (base64: string) => Promise<void>;
16
- editIconRef: React.MutableRefObject<null>;
17
- fileName: string | undefined;
18
- setFileName: React.Dispatch<React.SetStateAction<string | undefined>>;
19
- selectedVariable: string | undefined;
20
- setSelectedVariable: React.Dispatch<React.SetStateAction<string | undefined>>;
21
- openEditMedia: boolean;
22
- setOpenEditMedia: React.Dispatch<React.SetStateAction<boolean>>;
23
- selectedImage: string | undefined;
24
- setSelectedImage: React.Dispatch<React.SetStateAction<string | undefined>>;
25
- loading: boolean;
26
- setLoading: React.Dispatch<React.SetStateAction<boolean>>;
27
- error: string;
28
- setError: React.Dispatch<React.SetStateAction<string>>;
29
- };
@@ -1 +0,0 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),n=require("lodash"),t=require("react"),i=require("../../helpers/FileUploaderHelper.js"),o=require("../../template-preview/models/TemplateMeta.js"),l=require("../context/templateModalContext.js"),a=require("../utils/validateIsUrl.js");exports.useEditWhatsappTemplateMedia=s=>{const{uploadMediaLink:r,updateTemplateImageUrl:d,mediaComponent:c,uploadMediaFiles:u,fileRef:p}=s,{template:m,selectedCarouselIndex:v,setTemplate:f}=l.useTemplateModalContext(),[E,g]=t.useState(void 0),[h,b]=t.useState(),[_,M]=t.useState(!1),[I,T]=t.useState(""),[y,A]=t.useState(!1),[S,j]=t.useState(),R=t.useRef(null);function U(n){var t;return e.__awaiter(this,void 0,void 0,(function*(){const e=new i.FileUploaderHelper;if(n instanceof Blob){const i=e.validate({file:n});if(i)T(i),A(!1),M(!1);else{const e=c.format===o.HEADER_TYPES.IMAGE,i=yield u({file:n,fileName:E,isImage:e});if(i.success){const[e]=n.type.split("/");d(null!==(t=i.url)&&void 0!==t?t:"","application"===e?o.HEADER_TYPES.DOCUMENT:o.HEADER_TYPES[e.toUpperCase()])}else A(!1),T("An unknown technical error occurred");A(!1),M(!1)}}else T("An unknown technical error occurred"),A(!1)}))}function C(){var e;console.log("handleImageChange",p,null==p?void 0:p.current),(null===(e=null==p?void 0:p.current)||void 0===e?void 0:e.click)&&p.current.click()}return t.useEffect((()=>{g(void 0),j(void 0),b(void 0),M(!1),A(!1),T("")}),[v]),{uploadMedia:function(t){var l,s,u,E,g,h;return e.__awaiter(this,void 0,void 0,(function*(){if(T(""),b(""),console.log("uef uploadMedia",p,null==p?void 0:p.current),t)if(t.startsWith("https"))try{if(A(!0),console.log("uploadMediaLink",r),r){const e=yield r(t),{type:n,size:a,success:s}=e;if(s){const t=(new i.FileUploaderHelper).validate({linkData:{type:n,size:a}});if(t)return T(t),void A(!1);const[s]=n.split("/");d(null!==(l=e.url)&&void 0!==l?l:"",s.includes("application")?o.HEADER_TYPES.DOCUMENT:o.HEADER_TYPES[s.toUpperCase()])}else A(!1),T("An unknown technical error occurred");A(!1)}else{const e=yield fetch(t),n=yield e.blob();yield U(n)}}catch(e){A(!1),T("An unknown technical error occurred")}else if(a.isVariable(t)){let e;if(b(t),e=null!=v&&v>-1?{components:null===(u=null===(s=m.components[1])||void 0===s?void 0:s.cards)||void 0===u?void 0:u[v].components,mapping:null===(g=null===(E=null==m?void 0:m.mapping)||void 0===E?void 0:E.cards)||void 0===g?void 0:g[v]}:Object.assign({},m),e.components){const n=null===(h=null==e?void 0:e.components)||void 0===h?void 0:h.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==n&&n>-1&&(null==e?void 0:e.components[n])){const i=Object.assign(Object.assign({},e.components[n]),{format:c.format,example:{header_handle:[t]}}),o=[...e.components];o[n]=i,e.components=o}}if(e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[t]})),A(!1),null!=v&&v>-1){const t=n.cloneDeep(m);t.components[1].cards[v].components=e.components,t.mapping.cards[v]=e.mapping,null==f||f(Object.assign({},t))}else null==f||f(Object.assign({},e))}else A(!1),T("Invalid URL or variable");else C()}))},processImageUpload:U,handleImageUpload:function(e){var n;T(""),A(!0);const t=null===(n=e.target.files)||void 0===n?void 0:n[0];if(c.format===o.HEADER_TYPES.IMAGE){const e=new FileReader;j(""),g(""),e.onload=()=>{j(e.result),g(null==t?void 0:t.name)},t&&e.readAsDataURL(t)}else U(t)},handleImageChange:C,onCropComplete:function(n){return e.__awaiter(this,void 0,void 0,(function*(){A(!1),T("");const e=yield fetch(n),t=yield e.blob();yield U(t),j(void 0),M(!1)}))},editIconRef:R,fileName:E,setFileName:g,selectedVariable:h,setSelectedVariable:b,openEditMedia:_,setOpenEditMedia:M,selectedImage:S,setSelectedImage:j,loading:y,setLoading:A,error:I,setError:T}};
@@ -1 +0,0 @@
1
- import*as t from"react";var e;function r(){return r=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(t[a]=r[a])}return t},r.apply(this,arguments)}var a=a=>t.createElement("svg",r({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},a),e||(e=t.createElement("path",{fill:"#000",d:"M21.35 21.35a.92.92 0 0 0 0-1.3L3.95 2.65a.92.92 0 1 0-1.3 1.3L3 4.3V19c0 1.1.9 2 2 2h14.7l.35.35a.92.92 0 0 0 1.3 0ZM5 19V6.3l7.6 7.6-1.5 1.9L9 13.1 6 17h9.7l2 2H5ZM8.8 5l-2-2H19c1.1 0 2 .9 2 2v12.2l-2-2V5H8.8Z"})));export{a as default};
@@ -1,29 +0,0 @@
1
- import React from 'react';
2
- import { WhatsAppPickerMeta, WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
3
- export type UseEditWhatsappTemplateMediaResponse = ReturnType<typeof useEditWhatsappTemplateMedia>;
4
- export declare const useEditWhatsappTemplateMedia: (props: {
5
- uploadMediaLink?: WhatsAppPickerMeta['uploadMediaLink'];
6
- uploadMediaFiles: WhatsAppPickerMeta['uploadMediaFiles'];
7
- updateTemplateImageUrl: (url: string, format: WhatsAppTemplate['components'][0]['format']) => void;
8
- fileRef: React.RefObject<HTMLInputElement | null>;
9
- mediaComponent: any;
10
- }) => {
11
- uploadMedia: (urlOrVariable?: string) => Promise<void>;
12
- processImageUpload: (file?: Blob | File) => Promise<void>;
13
- handleImageUpload: ($event: React.ChangeEvent<HTMLInputElement>) => void;
14
- handleImageChange: () => void;
15
- onCropComplete: (base64: string) => Promise<void>;
16
- editIconRef: React.MutableRefObject<null>;
17
- fileName: string | undefined;
18
- setFileName: React.Dispatch<React.SetStateAction<string | undefined>>;
19
- selectedVariable: string | undefined;
20
- setSelectedVariable: React.Dispatch<React.SetStateAction<string | undefined>>;
21
- openEditMedia: boolean;
22
- setOpenEditMedia: React.Dispatch<React.SetStateAction<boolean>>;
23
- selectedImage: string | undefined;
24
- setSelectedImage: React.Dispatch<React.SetStateAction<string | undefined>>;
25
- loading: boolean;
26
- setLoading: React.Dispatch<React.SetStateAction<boolean>>;
27
- error: string;
28
- setError: React.Dispatch<React.SetStateAction<string>>;
29
- };
@@ -1 +0,0 @@
1
- import{__awaiter as e}from"../../../_virtual/_tslib.js";import{cloneDeep as o}from"lodash";import{useState as n,useRef as i,useEffect as l}from"react";import{FileUploaderHelper as t}from"../../helpers/FileUploaderHelper.js";import{HEADER_TYPES as a}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as s}from"../context/templateModalContext.js";import{isVariable as r}from"../utils/validateIsUrl.js";const d=d=>{const{uploadMediaLink:c,updateTemplateImageUrl:p,mediaComponent:u,uploadMediaFiles:m,fileRef:f}=d,{template:v,selectedCarouselIndex:g,setTemplate:h}=s(),[b,I]=n(void 0),[y,M]=n(),[j,C]=n(!1),[E,O]=n(""),[U,k]=n(!1),[w,A]=n(),N=i(null);function T(o){var n;return e(this,void 0,void 0,(function*(){const e=new t;if(o instanceof Blob){const i=e.validate({file:o});if(i)O(i),k(!1),C(!1);else{const e=u.format===a.IMAGE,i=yield m({file:o,fileName:b,isImage:e});if(i.success){const[e]=o.type.split("/");p(null!==(n=i.url)&&void 0!==n?n:"","application"===e?a.DOCUMENT:a[e.toUpperCase()])}else k(!1),O("An unknown technical error occurred");k(!1),C(!1)}}else O("An unknown technical error occurred"),k(!1)}))}function x(){var e;console.log("handleImageChange",f,null==f?void 0:f.current),(null===(e=null==f?void 0:f.current)||void 0===e?void 0:e.click)&&f.current.click()}return l((()=>{I(void 0),A(void 0),M(void 0),C(!1),k(!1),O("")}),[g]),{uploadMedia:function(n){var i,l,s,d,m,b;return e(this,void 0,void 0,(function*(){if(O(""),M(""),console.log("uef uploadMedia",f,null==f?void 0:f.current),n)if(n.startsWith("https"))try{if(k(!0),console.log("uploadMediaLink",c),c){const e=yield c(n),{type:o,size:l,success:s}=e;if(s){const n=(new t).validate({linkData:{type:o,size:l}});if(n)return O(n),void k(!1);const[s]=o.split("/");p(null!==(i=e.url)&&void 0!==i?i:"",s.includes("application")?a.DOCUMENT:a[s.toUpperCase()])}else k(!1),O("An unknown technical error occurred");k(!1)}else{const e=yield fetch(n),o=yield e.blob();yield T(o)}}catch(e){k(!1),O("An unknown technical error occurred")}else if(r(n)){let e;if(M(n),e=null!=g&&g>-1?{components:null===(s=null===(l=v.components[1])||void 0===l?void 0:l.cards)||void 0===s?void 0:s[g].components,mapping:null===(m=null===(d=null==v?void 0:v.mapping)||void 0===d?void 0:d.cards)||void 0===m?void 0:m[g]}:Object.assign({},v),e.components){const o=null===(b=null==e?void 0:e.components)||void 0===b?void 0:b.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==o&&o>-1&&(null==e?void 0:e.components[o])){const i=Object.assign(Object.assign({},e.components[o]),{format:u.format,example:{header_handle:[n]}}),l=[...e.components];l[o]=i,e.components=l}}if(e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[n]})),k(!1),null!=g&&g>-1){const n=o(v);n.components[1].cards[g].components=e.components,n.mapping.cards[g]=e.mapping,null==h||h(Object.assign({},n))}else null==h||h(Object.assign({},e))}else k(!1),O("Invalid URL or variable");else x()}))},processImageUpload:T,handleImageUpload:function(e){var o;O(""),k(!0);const n=null===(o=e.target.files)||void 0===o?void 0:o[0];if(u.format===a.IMAGE){const e=new FileReader;A(""),I(""),e.onload=()=>{A(e.result),I(null==n?void 0:n.name)},n&&e.readAsDataURL(n)}else T(n)},handleImageChange:x,onCropComplete:function(o){return e(this,void 0,void 0,(function*(){k(!1),O("");const e=yield fetch(o),n=yield e.blob();yield T(n),A(void 0),C(!1)}))},editIconRef:N,fileName:b,setFileName:I,selectedVariable:y,setSelectedVariable:M,openEditMedia:j,setOpenEditMedia:C,selectedImage:w,setSelectedImage:A,loading:U,setLoading:k,error:E,setError:O}};export{d as useEditWhatsappTemplateMedia};