@bikdotai/bik-component-library 0.0.548-mime.3 → 0.0.548-productpicker.0

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 (19) hide show
  1. package/dist/cjs/components/TablePagination/TablePagination.d.ts +0 -1
  2. package/dist/cjs/components/TablePagination/TablePagination.js +1 -1
  3. package/dist/cjs/components/TablePagination/TablePagination.styled.js +0 -1
  4. package/dist/cjs/components/bik-layout/MockMenus.d.ts +1 -0
  5. package/dist/cjs/components/template-context-mapper/modalElements/EditMediaModal.d.ts +2 -3
  6. package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +2 -2
  7. package/dist/cjs/components/template-context-mapper/modalElements/useEditWhtasappTemplateMedia.d.ts +3 -6
  8. package/dist/cjs/components/template-context-mapper/modalElements/useEditWhtasappTemplateMedia.js +1 -1
  9. package/dist/cjs/components/template-preview/models/WhatsAppTemplate.d.ts +0 -5
  10. package/dist/esm/components/TablePagination/TablePagination.d.ts +0 -1
  11. package/dist/esm/components/TablePagination/TablePagination.js +1 -1
  12. package/dist/esm/components/TablePagination/TablePagination.styled.js +0 -1
  13. package/dist/esm/components/bik-layout/MockMenus.d.ts +1 -0
  14. package/dist/esm/components/template-context-mapper/modalElements/EditMediaModal.d.ts +2 -3
  15. package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +1 -1
  16. package/dist/esm/components/template-context-mapper/modalElements/useEditWhtasappTemplateMedia.d.ts +3 -6
  17. package/dist/esm/components/template-context-mapper/modalElements/useEditWhtasappTemplateMedia.js +1 -1
  18. package/dist/esm/components/template-preview/models/WhatsAppTemplate.d.ts +0 -5
  19. package/package.json +2 -3
@@ -7,6 +7,5 @@ export type TablePaginationProps = {
7
7
  hidePageSizeOptions?: boolean;
8
8
  updatePageNumber: (pageNumber: number) => void;
9
9
  updatePageSize: (option: DropdownOption | DropdownOption[]) => void;
10
- showTotalText?: boolean;
11
10
  };
12
11
  export declare const TablePagination: React.FC<TablePaginationProps>;
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronLeft.svg.js"),t=require("../../assets/icons/chevronRight.svg.js"),n=require("./TablePagination.styled.js"),a=require("../../constants/Theme.js"),i=require("../dropdown/Dropdown.js"),o=require("../TypographyStyle.js");exports.TablePagination=r=>{let{pageNumber:l,pageSize:c,totalRows:d,updatePageNumber:g,updatePageSize:h,hidePageSizeOptions:j,showTotalText:p}=r;const y=a.DEFAULT_THEME.colorsV2,u=(l-1)*c+1,b=(l-1)*c+c,x=Math.ceil(d/c),v=1==x;let S=[];S=x>=5?l===x?[l-4,l-3,l-2,l-1,l]:1===l?[l,l+1,l+2,l+3,l+4]:2===l?[l-1,l,l+1,l+2,l+3]:l===x-1?[l-3,l-2,l-1,l,l+1]:[l-2,l-1,l,l+1,l+2]:Array.from({length:x},((e,s)=>s+1));const w=[{label:"5 rows per page",value:"5",selected:5===c},{label:"10 rows per page",value:"10",selected:10===c},{label:"20 rows per page",value:"20",selected:20===c}];return e.jsxs(n.StyledTablePaginationContainer,{children:[!j&&e.jsx("div",{children:e.jsx(i.Dropdown,{size:"small",options:w,onSelect:h,width:"162px"})}),e.jsxs("div",Object.assign({className:"paging__container"},{children:[!j&&d&&e.jsxs(o.BodySecondary,Object.assign({style:{color:y.content.placeholder}},{children:["Showing ",u,"-",b>d?d:b," of"," ",d," results"]})),e.jsxs("div",Object.assign({className:"pages__buttons-container"},{children:[!v&&e.jsx(n.StyledPagingContainer,Object.assign({active:!1,onClick:()=>{1!==l&&g(Math.max(l-1,1))},disabled:1===l},{children:e.jsx(s.default,{color:y.content.secondary,height:14,width:14})})),S.map((s=>e.jsx(n.StyledPagingContainer,Object.assign({active:s==l,onClick:()=>g(s),style:{display:1==s&&d<=c?"none":"flex"}},{children:e.jsx(o.BodySecondary,Object.assign({style:{color:s==l?y.content.primaryInverse:y.content.secondary}},{children:s}))}),s))),!v&&e.jsx(n.StyledPagingContainer,Object.assign({isLast:!0,active:!1,onClick:()=>{l!==x&&g(Math.min(l+1,x))},disabled:l===x},{children:e.jsx(t.default,{color:y.content.secondary,height:14,width:14})}))]})),j&&d&&p&&e.jsxs(o.BodySecondary,Object.assign({style:{color:y.content.placeholder}},{children:["Showing ",u,"-",b>d?d:b," of"," ",d," results"]}))]}))]})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronLeft.svg.js"),t=require("../../assets/icons/chevronRight.svg.js"),n=require("./TablePagination.styled.js"),a=require("../../constants/Theme.js"),i=require("../dropdown/Dropdown.js"),r=require("../TypographyStyle.js");exports.TablePagination=o=>{let{pageNumber:l,pageSize:c,totalRows:d,updatePageNumber:g,updatePageSize:h,hidePageSizeOptions:j}=o;const p=a.DEFAULT_THEME.colorsV2,u=(l-1)*c+1,y=(l-1)*c+c,b=Math.ceil(d/c),x=1==b;let v=[];v=b>=5?l===b?[l-4,l-3,l-2,l-1,l]:1===l?[l,l+1,l+2,l+3,l+4]:2===l?[l-1,l,l+1,l+2,l+3]:l===b-1?[l-3,l-2,l-1,l,l+1]:[l-2,l-1,l,l+1,l+2]:Array.from({length:b},((e,s)=>s+1));const m=[{label:"5 rows per page",value:"5",selected:5===c},{label:"10 rows per page",value:"10",selected:10===c},{label:"20 rows per page",value:"20",selected:20===c}];return e.jsxs(n.StyledTablePaginationContainer,{children:[!j&&e.jsx("div",{children:e.jsx(i.Dropdown,{size:"small",options:m,onSelect:h,width:"162px"})}),e.jsxs("div",Object.assign({className:"paging__container"},{children:[!j&&d&&e.jsxs(r.BodySecondary,Object.assign({style:{color:p.content.placeholder,marginRight:8}},{children:["Showing ",u,"-",y>d?d:y," of"," ",d," results"]})),e.jsxs("div",Object.assign({className:"pages__buttons-container"},{children:[!x&&e.jsx(n.StyledPagingContainer,Object.assign({active:!1,onClick:()=>{1!==l&&g(Math.max(l-1,1))},disabled:1===l},{children:e.jsx(s.default,{color:p.content.secondary,height:14,width:14})})),v.map((s=>e.jsx(n.StyledPagingContainer,Object.assign({active:s==l,onClick:()=>g(s),style:{display:1==s&&d<=c?"none":"flex"}},{children:e.jsx(r.BodySecondary,Object.assign({style:{color:s==l?p.content.primaryInverse:p.content.secondary}},{children:s}))}),s))),!x&&e.jsx(n.StyledPagingContainer,Object.assign({isLast:!0,active:!1,onClick:()=>{l!==b&&g(Math.min(l+1,b))},disabled:l===b},{children:e.jsx(t.default,{color:p.content.secondary,height:14,width:14})}))]}))]}))]})};
@@ -13,7 +13,6 @@
13
13
  margin-bottom: 8px;
14
14
  justify-content: center;
15
15
  align-items: center;
16
- gap: 8px;
17
16
  }
18
17
 
19
18
  .pages__buttons-container {
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  export declare const Menus: ({
2
3
  displayName: string;
3
4
  key: number;
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { VariableListInterfaceV2 } from "../../add-variableV2";
3
3
  import { HEADER_TYPES } from "../../template-preview";
4
4
  import { UseEditWhatsappTemplateMediaResponse } from './useEditWhtasappTemplateMedia';
5
- interface EditMediaModalProps {
5
+ declare const EditMediaModal: React.FC<{
6
6
  setOpenEditMedia: React.Dispatch<React.SetStateAction<boolean>>;
7
7
  openEditMedia: boolean;
8
8
  mediaComponentFormat: HEADER_TYPES;
@@ -11,6 +11,5 @@ interface EditMediaModalProps {
11
11
  editIconRef: React.MutableRefObject<HTMLDivElement | null>;
12
12
  fileRef: React.MutableRefObject<HTMLInputElement | null>;
13
13
  useEditWhatsappTemplateMediaResponse: UseEditWhatsappTemplateMediaResponse;
14
- }
15
- declare const EditMediaModal: React.FC<EditMediaModalProps>;
14
+ }>;
16
15
  export default EditMediaModal;
@@ -1,7 +1,7 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("lodash"),o=require("react"),t=require("styled-components"),i=require("../../input/Input.js"),l=require("../../template-preview/models/TemplateMeta.js"),a=require("../../template-preview/models/WhatsAppTemplate.js"),s=require("../context/templateModalContext.js"),d=require("../utils/getDataFromTemplateComponent.js"),u=require("../utils/validateIsUrl.js"),r=require("../utils/validateName.js"),p=require("./BackTrackComponent.js"),c=require("./DiscountCodeComponent.js"),v=require("./EditMediaModal.js"),m=require("./EditMediaV2.js"),b=require("./EditMediaV2.style.js"),g=require("./useEditWhtasappTemplateMedia.js"),f=require("./VariableConnector.js"),h=require("./VariableConnectorsPanel.js"),j=require("./VariableConnectorWhatsApp.js"),O=require("./VariableEditorHeader.js"),C=require("./WhatsAppTemplateCardButtonV2.js");function T(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const x=T(t).default.div`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("lodash"),o=require("react"),t=require("styled-components"),i=require("../../input/Input.js"),l=require("../../template-preview/models/TemplateMeta.js"),a=require("../../template-preview/models/WhatsAppTemplate.js"),s=require("../context/templateModalContext.js"),d=require("../utils/getDataFromTemplateComponent.js"),u=require("../utils/validateIsUrl.js"),r=require("../utils/validateName.js"),p=require("./BackTrackComponent.js"),c=require("./DiscountCodeComponent.js"),v=require("./EditMediaModal.js"),m=require("./EditMediaV2.js"),b=require("./EditMediaV2.style.js"),g=require("./useEditWhtasappTemplateMedia.js"),f=require("./VariableConnector.js"),h=require("./VariableConnectorsPanel.js"),j=require("./VariableConnectorWhatsApp.js"),O=require("./VariableEditorHeader.js"),C=require("./WhatsAppTemplateCardButtonV2.js");function x(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const T=x(t).default.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
- `;exports.default=t=>{let{template:T,onTemplateChange:y,whatsappSpecificPickerMeta:E,showVariableModal:V,variableListForImage:B,setDiscountCode:M,fileName:k,setFileName:q}=t;var I,D,R,L,U,P,w,A,N,S,_,F,H,Q,Y,K,W,$,G,X,z,J,Z,ee,ne,oe,te,ie,le,ae,se,de,ue,re,pe,ce,ve,me,be;const ge=T.isCarouselType,{originalVariableList:fe,pod:he,extras:je,selectedCarouselIndex:Oe,isProductCarouselType:Ce}=s.useTemplateModalContext(),{descriptionComponents:Te,urlBtns:xe,qrbBtns:ye,imageComponent:Ee,bodyVariables:Ve,headerVariables:Be}=d.getAllDataFromTemplateComponent(T),Me=o.useRef(null),[ke,qe]=o.useState(!1),[Ie,De]=o.useState(-1===Oe?{descriptionComponents:Te,urlBtns:xe,qrbBtns:ye,imageComponent:Ee,bodyVariables:Ve,headerVariables:Be}:{}),{uploadMediaLink:Re,uploadMediaFiles:Le,validateMimeType:Ue}=E,Pe=g.useEditWhatsappTemplateMedia({uploadMediaLink:Re,uploadMediaFiles:Le,updateTemplateImageUrl:function(e,o){var t,i,l,a,s,d,u,r;let p;p=null!=Oe&&Oe>-1?{components:null===(i=null===(t=T.components[1])||void 0===t?void 0:t.cards)||void 0===i?void 0:i[Oe].components,mapping:null===(a=null===(l=null==T?void 0:T.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},T);const c=null===(s=null==p?void 0:p.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==p?void 0:p.components[c])){const n=Object.assign(Object.assign({},p.components[c]),{format:o,example:{header_handle:[e]}}),t=[...p.components];t[c]=n,p=Object.assign(Object.assign({},p),{components:t})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(u=null==e?void 0:e.mapping)||void 0===u?void 0:u.cards.length)>0&&(e.mapping.cards[Oe]=null!==(r=p.mapping)&&void 0!==r?r:{}),null==y||y(Object.assign({},e)),Ae(!0)}else null==y||y(Object.assign({},p))},validateMimeType:Ue,mediaComponent:ge?Ie.imageComponent:Ee,fileRef:Me}),[we,Ae]=o.useState(!1),[Ne,Se]=o.useState(k),[_e,Fe]=o.useState();function He(e,o,t){var i,l,a,s,d,u,r,p,c,v;const m=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},T),b=n.cloneDeep(m),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!=Oe&&Oe>-1&&Ce){const o=Object.assign({},T).components.map((e=>{var n;return"CAROUSEL"===e.type?Object.assign(Object.assign({},e),{cards:null===(n=e.cards)||void 0===n?void 0:n.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var n,o,i;if("BUTTONS"===e.type){const l=null===(n=e.buttons)||void 0===n?void 0:n.filter((e=>"URL"===e.type));let a=null!==(o=null==l?void 0:l[t])&&void 0!==o?o:{};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({},T).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((n=>{var o;return Object.assign(Object.assign({},n),{buttons:null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:""))})})),l=n.cloneDeep(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((e=>"BUTTONS"===e.type));if(void 0!==h&&h>-1){const n=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((e=>"URL"===e.type));if((null==n?void 0:n.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=n[t];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(p=null===(r=null===(u=b.components)||void 0===u?void 0:u[h])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].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}),v=null===(c=b.mapping)||void 0===c?void 0:c.buttons;v&&v.length>0&&(v[t]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},b.mapping),{buttons:v});b.mapping=m;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(v=e.placeHolder)||void 0===v?void 0:v.slice(2,-2))?qe(!0):(qe(!1),null==M||M(""))}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=b.components,e.mapping.cards[Oe]=b.mapping,null==y||y(Object.assign({},e))}else null==y||y(b)}function Qe(e,o,t){var i,l,a,s,d,u,r;const p=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},T).components[1].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},T).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},T);if(null!=Oe&&Oe>-1&&Ce){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,i,l;if("BUTTONS"===n.type){const a=null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[t])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=null==n?void 0:n.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({},n),{buttons:d})}return n}))})))}):n})),i=n.cloneDeep(T);return i.components=o,void(null==y||y(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==c&&c>-1){const n=null===(s=null===(a=null==p?void 0:p.components[c])||void 0===a?void 0:a.buttons)||void 0===s?void 0:s.filter((e=>"QUICK_REPLY"===e.type));if(n){let o=n[t];o=Object.assign(Object.assign({},o),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(r=null===(u=null===(d=p.components)||void 0===d?void 0:d[c])||void 0===u?void 0:u.buttons)&&void 0!==r?r:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==o?void 0:o.text)?o:e)),l=Object.assign(Object.assign({},p.components[c]),{buttons:i}),a=[...p.components];a[c]=l,p.components=a}}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(T);e.components[1].cards[Oe].components=p.components,null==y||y(Object.assign({},e))}else null==y||y(p)}o.useEffect((()=>{var e,n;if(null===(e=T.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))qe(!0);else{qe(!1);const e=null===(n=null==je?void 0:je.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[T]),o.useEffect((()=>{var e,n,o,t;if(null!=Oe&&Oe>-1){const i={components:null===(n=null===(e=T.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(t=null===(o=null==T?void 0:T.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);De({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p})}else if(null!=Oe&&-1===Oe){const{descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l}=d.getAllDataFromTemplateComponent(T);De({descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Oe]),o.useEffect((()=>{var e,n,o,t;if(null!=Oe&&Oe>-1&&we){const i={components:null===(n=null===(e=T.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(t=null===(o=null==T?void 0:T.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);De({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}),Ae(!1)}}),[we]);const Ye=ge?Ie.imageComponent:Ee;return Pe.openEditMedia?e.jsx(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(v.default,{mediaComponentFormat:null!==(I=Ye.format)&&void 0!==I?I:l.HEADER_TYPES.IMAGE,uploadMedia:Pe.uploadMedia,variableListForImage:B||[],useEditWhatsappTemplateMediaResponse:Pe,setOpenEditMedia:Pe.setOpenEditMedia,openEditMedia:Pe.openEditMedia,editIconRef:Pe.editIconRef,fileRef:Me})})):e.jsxs(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Ce?"420px":"auto"}},{children:[!!Ie.imageComponent&&!Ce&&e.jsxs(b.EditTemplateMediaContainer,{children:[e.jsx(m.default,{imageName:null!==(R=null===(D=null==Ye?void 0:Ye.example)||void 0===D?void 0:D.header_handle)&&void 0!==R?R:[],handleImageChange:Pe.handleImageChange,mediaType:null==Ye?void 0:Ye.format,error:Pe.error,isLoading:Pe.loading,setOpenEditMedia:Pe.setOpenEditMedia,selectedVariable:u.isVariable(null!==(P=null===(U=null===(L=null==Ye?void 0:Ye.example)||void 0===L?void 0:L.header_handle)||void 0===U?void 0:U[0])&&void 0!==P?P:"")?null===(A=null===(w=null==Ye?void 0:Ye.example)||void 0===w?void 0:w.header_handle)||void 0===A?void 0:A[0]:(null===(S=null===(N=null==T?void 0:T.mapping)||void 0===N?void 0:N.header)||void 0===S?void 0:S[0])?null===(F=null===(_=null==T?void 0:T.mapping)||void 0===_?void 0:_.header)||void 0===F?void 0:F[0]:Pe.selectedVariable}),(null==Ee?void 0:Ee.format)==l.HEADER_TYPES.DOCUMENT?e.jsx(x,{children:e.jsx(i.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ne,errorMessage:_e||void 0,onBlur:()=>{if(!Ne)return null==q||q(""),void Fe("PDF name is Required");const e=r.validateInputName(Ne);null==q||q(Ne),Fe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Fe(""),Se(e)}})}):e.jsx(e.Fragment,{})]}),(null===(H=Ie.bodyVariables)||void 0===H?void 0:H.length)>0&&e.jsx(O.default,{containerStyle:{paddingTop:Ie.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===(Q=Ie.descriptionComponents)||void 0===Q?void 0:Q.map(((n,o)=>e.jsx(j.default,{originalVariableList:null!=Oe&&Oe>-1?fe.cards[Oe]:fe,type:n.type,descriptionComponent:n.component,showVariableModal:V},o))),(null===(W=null===(K=null!=Oe&&Oe>-1?null===(Y=fe.cards[Oe])||void 0===Y?void 0:Y.buttons:null==fe?void 0:fe.buttons)||void 0===K?void 0:K.filter((e=>"URL"===e.type)))||void 0===W?void 0:W.length)>0&&e.jsx(O.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(X=null===(G=null!=Oe&&Oe>-1?null===($=fe.cards[Oe])||void 0===$?void 0:$.buttons:null==fe?void 0:fe.buttons)||void 0===G?void 0:G.filter((e=>he===a.POD.CHATBOT||"URL"===e.type)))||void 0===X?void 0:X.map(((n,o)=>{if("URL"===n.type)return e.jsx(C.default,{variableListIndex:o,CTAoptions:null==E?void 0:E.CTAoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},fe.cards[Oe]):Object.assign({},fe),updateSelectedURLTemplateBtn:He},`${o}_${Oe}`)})),he===a.POD.CHATBOT&&(null===(J=null===(z=ye[0])||void 0===z?void 0:z.component)||void 0===J?void 0:J.buttons)&&(null===(ne=null===(ee=null===(Z=ye[0])||void 0===Z?void 0:Z.component)||void 0===ee?void 0:ee.buttons)||void 0===ne?void 0:ne.length)>0&&e.jsx(p.BackTrackComponent,{backTrackMessage:null===(oe=null==je?void 0:je.backTrackExtra)||void 0===oe?void 0:oe[0],setBackTrackMessage:null===(te=null==je?void 0:je.backTrackExtra)||void 0===te?void 0:te[1]}),(null===(ae=null===(le=null!=Oe&&Oe>-1?null===(ie=fe.cards[Oe])||void 0===ie?void 0:ie.buttons:null==fe?void 0:fe.buttons)||void 0===le?void 0:le.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ae?void 0:ae.length)>0&&(he!==a.POD.CHATBOT?e.jsx(O.default,{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.jsx(p.BackTrackComponent,{backTrackMessage:null===(se=null==je?void 0:je.backTrackExtra)||void 0===se?void 0:se[0],setBackTrackMessage:null===(de=null==je?void 0:je.backTrackExtra)||void 0===de?void 0:de[1]})),null===(pe=null===(re=null!=Oe&&Oe>-1?null===(ue=fe.cards[Oe])||void 0===ue?void 0:ue.buttons:null==fe?void 0:fe.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===pe?void 0:pe.map(((n,o)=>{if("QUICK_REPLY"===n.type&&he!==a.POD.CHATBOT)return e.jsx(C.default,{variableListIndex:o,QRBoptions:null==E?void 0:E.QRBoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},fe.cards[Oe]):Object.assign({},fe),updateSelectedQRBTemplateBtn:Qe},`${o}_${Oe}`)})),he===a.POD.CHATBOT&&ke&&e.jsx(c.DiscountCodeComponent,{discountCode:null===(ce=null==je?void 0:je.discountCodeExtra)||void 0===ce?void 0:ce[0],setDiscountCode:null===(ve=null==je?void 0:je.discountCodeExtra)||void 0===ve?void 0:ve[1]}),null===(be=null!=Oe&&Oe>-1?null===(me=fe.cards[Oe])||void 0===me?void 0:me.buttons:null==fe?void 0:fe.buttons)||void 0===be?void 0:be.map(((n,o)=>{var t,i,l;if("COPY_CODE"===n.type)return e.jsx(f.default,{index:o,variable:{variableName:null!==(t=n.text)&&void 0!==t?t:"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,componentType:"BUTTONS",buttonType:n.type},o)}))]}))};
7
+ `;exports.default=t=>{let{template:x,onTemplateChange:y,whatsappSpecificPickerMeta:E,showVariableModal:V,variableListForImage:B,setDiscountCode:k,fileName:M,setFileName:q}=t;var I,D,R,L,U,P,w,A,N,S,_,F,H,Q,Y,K,W,$,G,X,z,J,Z,ee,ne,oe,te,ie,le,ae,se,de,ue,re,pe,ce,ve,me,be;const ge=x.isCarouselType,{originalVariableList:fe,pod:he,extras:je,selectedCarouselIndex:Oe,isProductCarouselType:Ce}=s.useTemplateModalContext(),{descriptionComponents:xe,urlBtns:Te,qrbBtns:ye,imageComponent:Ee,bodyVariables:Ve,headerVariables:Be}=d.getAllDataFromTemplateComponent(x),ke=o.useRef(null),[Me,qe]=o.useState(!1),[Ie,De]=o.useState(-1===Oe?{descriptionComponents:xe,urlBtns:Te,qrbBtns:ye,imageComponent:Ee,bodyVariables:Ve,headerVariables:Be}:{}),{uploadMediaLink:Re,uploadMediaFiles:Le}=E,Ue=g.useEditWhatsappTemplateMedia({uploadMediaLink:Re,uploadMediaFiles:Le,updateTemplateImageUrl:function(e,o){var t,i,l,a,s,d,u,r;let p;p=null!=Oe&&Oe>-1?{components:null===(i=null===(t=x.components[1])||void 0===t?void 0:t.cards)||void 0===i?void 0:i[Oe].components,mapping:null===(a=null===(l=null==x?void 0:x.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},x);const c=null===(s=null==p?void 0:p.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==p?void 0:p.components[c])){const n=Object.assign(Object.assign({},p.components[c]),{format:o,example:{header_handle:[e]}}),t=[...p.components];t[c]=n,p=Object.assign(Object.assign({},p),{components:t})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Oe&&Oe>-1){const e=n.cloneDeep(x);e.components[1].cards[Oe].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(u=null==e?void 0:e.mapping)||void 0===u?void 0:u.cards.length)>0&&(e.mapping.cards[Oe]=null!==(r=p.mapping)&&void 0!==r?r:{}),null==y||y(Object.assign({},e)),we(!0)}else null==y||y(Object.assign({},p))},mediaComponent:ge?Ie.imageComponent:Ee,fileRef:ke}),[Pe,we]=o.useState(!1),[Ae,Ne]=o.useState(M),[Se,_e]=o.useState();function Fe(e,o,t){var i,l,a,s,d,u,r,p,c,v;const m=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},x).components[1].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},x).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},x),b=n.cloneDeep(m),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!=Oe&&Oe>-1&&Ce){const o=Object.assign({},x).components.map((e=>{var n;return"CAROUSEL"===e.type?Object.assign(Object.assign({},e),{cards:null===(n=e.cards)||void 0===n?void 0:n.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var n,o,i;if("BUTTONS"===e.type){const l=null===(n=e.buttons)||void 0===n?void 0:n.filter((e=>"URL"===e.type));let a=null!==(o=null==l?void 0:l[t])&&void 0!==o?o:{};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({},x).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((n=>{var o;return Object.assign(Object.assign({},n),{buttons:null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:""))})})),l=n.cloneDeep(x);return l.components=o,l.mapping.cards=i,void(null==y||y(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==h&&h>-1){const n=null===(d=null==b?void 0:b.components[h].buttons)||void 0===d?void 0:d.filter((e=>"URL"===e.type));if((null==n?void 0:n.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=n[t];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(p=null===(r=null===(u=b.components)||void 0===u?void 0:u[h])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].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}),v=null===(c=b.mapping)||void 0===c?void 0:c.buttons;v&&v.length>0&&(v[t]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},b.mapping),{buttons:v});b.mapping=m;const g=[...b.components];g[h]=d,b.components=g}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(v=e.placeHolder)||void 0===v?void 0:v.slice(2,-2))?qe(!0):(qe(!1),null==k||k(""))}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(x);e.components[1].cards[Oe].components=b.components,e.mapping.cards[Oe]=b.mapping,null==y||y(Object.assign({},e))}else null==y||y(b)}function He(e,o,t){var i,l,a,s,d,u,r;const p=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},x).components[1].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},x).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},x);if(null!=Oe&&Oe>-1&&Ce){const o=Object.assign({},x).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,i,l;if("BUTTONS"===n.type){const a=null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[t])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=null==n?void 0:n.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({},n),{buttons:d})}return n}))})))}):n})),i=n.cloneDeep(x);return i.components=o,void(null==y||y(Object.assign({},i)))}const c=null==p?void 0:p.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==c&&c>-1){const n=null===(s=null===(a=null==p?void 0:p.components[c])||void 0===a?void 0:a.buttons)||void 0===s?void 0:s.filter((e=>"QUICK_REPLY"===e.type));if(n){let o=n[t];o=Object.assign(Object.assign({},o),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(r=null===(u=null===(d=p.components)||void 0===d?void 0:d[c])||void 0===u?void 0:u.buttons)&&void 0!==r?r:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==o?void 0:o.text)?o:e)),l=Object.assign(Object.assign({},p.components[c]),{buttons:i}),a=[...p.components];a[c]=l,p.components=a}}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(x);e.components[1].cards[Oe].components=p.components,null==y||y(Object.assign({},e))}else null==y||y(p)}o.useEffect((()=>{var e,n;if(null===(e=x.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))qe(!0);else{qe(!1);const e=null===(n=null==je?void 0:je.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[x]),o.useEffect((()=>{var e,n,o,t;if(null!=Oe&&Oe>-1){const i={components:null===(n=null===(e=x.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(t=null===(o=null==x?void 0:x.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);De({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p})}else if(null!=Oe&&-1===Oe){const{descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l}=d.getAllDataFromTemplateComponent(x);De({descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Oe]),o.useEffect((()=>{var e,n,o,t;if(null!=Oe&&Oe>-1&&Pe){const i={components:null===(n=null===(e=x.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(t=null===(o=null==x?void 0:x.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}=d.getAllDataFromTemplateComponent(i);De({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:u,bodyVariables:r,headerVariables:p}),we(!1)}}),[Pe]);const Qe=ge?Ie.imageComponent:Ee;return Ue.openEditMedia?e.jsx(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(v.default,{mediaComponentFormat:null!==(I=Qe.format)&&void 0!==I?I:l.HEADER_TYPES.IMAGE,uploadMedia:Ue.uploadMedia,variableListForImage:B||[],useEditWhatsappTemplateMediaResponse:Ue,setOpenEditMedia:Ue.setOpenEditMedia,openEditMedia:Ue.openEditMedia,editIconRef:Ue.editIconRef,fileRef:ke})})):e.jsxs(h.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Ce?"420px":"auto"}},{children:[!!Ie.imageComponent&&!Ce&&e.jsxs(b.EditTemplateMediaContainer,{children:[e.jsx(m.default,{imageName:null!==(R=null===(D=null==Qe?void 0:Qe.example)||void 0===D?void 0:D.header_handle)&&void 0!==R?R:[],handleImageChange:Ue.handleImageChange,mediaType:null==Qe?void 0:Qe.format,error:Ue.error,isLoading:Ue.loading,setOpenEditMedia:Ue.setOpenEditMedia,selectedVariable:u.isVariable(null!==(P=null===(U=null===(L=null==Qe?void 0:Qe.example)||void 0===L?void 0:L.header_handle)||void 0===U?void 0:U[0])&&void 0!==P?P:"")?null===(A=null===(w=null==Qe?void 0:Qe.example)||void 0===w?void 0:w.header_handle)||void 0===A?void 0:A[0]:(null===(S=null===(N=null==x?void 0:x.mapping)||void 0===N?void 0:N.header)||void 0===S?void 0:S[0])?null===(F=null===(_=null==x?void 0:x.mapping)||void 0===_?void 0:_.header)||void 0===F?void 0:F[0]:Ue.selectedVariable}),(null==Ee?void 0:Ee.format)==l.HEADER_TYPES.DOCUMENT?e.jsx(T,{children:e.jsx(i.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ae,errorMessage:Se||void 0,onBlur:()=>{if(!Ae)return null==q||q(""),void _e("PDF name is Required");const e=r.validateInputName(Ae);null==q||q(Ae),_e(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{_e(""),Ne(e)}})}):e.jsx(e.Fragment,{})]}),(null===(H=Ie.bodyVariables)||void 0===H?void 0:H.length)>0&&e.jsx(O.default,{containerStyle:{paddingTop:Ie.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===(Q=Ie.descriptionComponents)||void 0===Q?void 0:Q.map(((n,o)=>e.jsx(j.default,{originalVariableList:null!=Oe&&Oe>-1?fe.cards[Oe]:fe,type:n.type,descriptionComponent:n.component,showVariableModal:V},o))),(null===(W=null===(K=null!=Oe&&Oe>-1?null===(Y=fe.cards[Oe])||void 0===Y?void 0:Y.buttons:null==fe?void 0:fe.buttons)||void 0===K?void 0:K.filter((e=>"URL"===e.type)))||void 0===W?void 0:W.length)>0&&e.jsx(O.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(X=null===(G=null!=Oe&&Oe>-1?null===($=fe.cards[Oe])||void 0===$?void 0:$.buttons:null==fe?void 0:fe.buttons)||void 0===G?void 0:G.filter((e=>he===a.POD.CHATBOT||"URL"===e.type)))||void 0===X?void 0:X.map(((n,o)=>{if("URL"===n.type)return e.jsx(C.default,{variableListIndex:o,CTAoptions:null==E?void 0:E.CTAoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},fe.cards[Oe]):Object.assign({},fe),updateSelectedURLTemplateBtn:Fe},`${o}_${Oe}`)})),he===a.POD.CHATBOT&&(null===(J=null===(z=ye[0])||void 0===z?void 0:z.component)||void 0===J?void 0:J.buttons)&&(null===(ne=null===(ee=null===(Z=ye[0])||void 0===Z?void 0:Z.component)||void 0===ee?void 0:ee.buttons)||void 0===ne?void 0:ne.length)>0&&e.jsx(p.BackTrackComponent,{backTrackMessage:null===(oe=null==je?void 0:je.backTrackExtra)||void 0===oe?void 0:oe[0],setBackTrackMessage:null===(te=null==je?void 0:je.backTrackExtra)||void 0===te?void 0:te[1]}),(null===(ae=null===(le=null!=Oe&&Oe>-1?null===(ie=fe.cards[Oe])||void 0===ie?void 0:ie.buttons:null==fe?void 0:fe.buttons)||void 0===le?void 0:le.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ae?void 0:ae.length)>0&&(he!==a.POD.CHATBOT?e.jsx(O.default,{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.jsx(p.BackTrackComponent,{backTrackMessage:null===(se=null==je?void 0:je.backTrackExtra)||void 0===se?void 0:se[0],setBackTrackMessage:null===(de=null==je?void 0:je.backTrackExtra)||void 0===de?void 0:de[1]})),null===(pe=null===(re=null!=Oe&&Oe>-1?null===(ue=fe.cards[Oe])||void 0===ue?void 0:ue.buttons:null==fe?void 0:fe.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===pe?void 0:pe.map(((n,o)=>{if("QUICK_REPLY"===n.type&&he!==a.POD.CHATBOT)return e.jsx(C.default,{variableListIndex:o,QRBoptions:null==E?void 0:E.QRBoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},fe.cards[Oe]):Object.assign({},fe),updateSelectedQRBTemplateBtn:He},`${o}_${Oe}`)})),he===a.POD.CHATBOT&&Me&&e.jsx(c.DiscountCodeComponent,{discountCode:null===(ce=null==je?void 0:je.discountCodeExtra)||void 0===ce?void 0:ce[0],setDiscountCode:null===(ve=null==je?void 0:je.discountCodeExtra)||void 0===ve?void 0:ve[1]}),null===(be=null!=Oe&&Oe>-1?null===(me=fe.cards[Oe])||void 0===me?void 0:me.buttons:null==fe?void 0:fe.buttons)||void 0===be?void 0:be.map(((n,o)=>{var t,i,l;if("COPY_CODE"===n.type)return e.jsx(f.default,{index:o,variable:{variableName:null!==(t=n.text)&&void 0!==t?t:"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,componentType:"BUTTONS",buttonType:n.type},o)}))]}))};
@@ -1,15 +1,13 @@
1
1
  import React from 'react';
2
- import { IMimeTypeResponse, WhatsAppPickerMeta, WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
2
+ import { WhatsAppPickerMeta, WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
3
3
  export type UseEditWhatsappTemplateMediaResponse = ReturnType<typeof useEditWhatsappTemplateMedia>;
4
- interface UseEditWhatsappTemplateMediaProps {
4
+ export declare const useEditWhatsappTemplateMedia: (props: {
5
5
  uploadMediaLink?: WhatsAppPickerMeta['uploadMediaLink'];
6
6
  uploadMediaFiles: WhatsAppPickerMeta['uploadMediaFiles'];
7
- validateMimeType?: (blob: Blob) => Promise<IMimeTypeResponse>;
8
7
  updateTemplateImageUrl: (url: string, format: WhatsAppTemplate['components'][0]['format']) => void;
9
8
  fileRef: React.RefObject<HTMLInputElement | null>;
10
9
  mediaComponent: any;
11
- }
12
- export declare const useEditWhatsappTemplateMedia: (props: UseEditWhatsappTemplateMediaProps) => {
10
+ }) => {
13
11
  uploadMedia: (urlOrVariable?: string) => Promise<void>;
14
12
  processImageUpload: (file?: Blob | File) => Promise<void>;
15
13
  handleImageUpload: ($event: React.ChangeEvent<HTMLInputElement>) => void;
@@ -29,4 +27,3 @@ export declare const useEditWhatsappTemplateMedia: (props: UseEditWhatsappTempla
29
27
  error: string;
30
28
  setError: React.Dispatch<React.SetStateAction<string>>;
31
29
  };
32
- export {};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),i=require("lodash"),t=require("react"),n=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,validateMimeType:c,mediaComponent:p,uploadMediaFiles:u,fileRef:m}=s,{template:v,selectedCarouselIndex:f,setTemplate:E}=l.useTemplateModalContext(),[g,h]=t.useState(void 0),[b,y]=t.useState(),[M,T]=t.useState(!1),[_,I]=t.useState(""),[A,R]=t.useState(!1),[S,j]=t.useState(),U=t.useRef(null);function D(i){var t;return e.__awaiter(this,void 0,void 0,(function*(){const e=new n.FileUploaderHelper;if(i instanceof Blob){if(c){const{isValid:e,mimeType:t}=yield c(i);if(!e)return void I(`MIME type ${t} is not supported`)}const n=e.validate({file:i});if(n)I(n),R(!1),T(!1);else{const e=p.format===o.HEADER_TYPES.IMAGE,n=yield u({file:i,fileName:g,isImage:e});if(n.success){const[e]=i.type.split("/");d(null!==(t=n.url)&&void 0!==t?t:"","application"===e?o.HEADER_TYPES.DOCUMENT:o.HEADER_TYPES[e.toUpperCase()])}else R(!1),I("An unknown technical error occurred");R(!1),T(!1)}}else I("An unknown technical error occurred"),R(!1)}))}function O(){var e;console.log("fileRef",m),(null===(e=null==m?void 0:m.current)||void 0===e?void 0:e.click)&&m.current.click()}return t.useEffect((()=>{h(void 0),j(void 0),y(void 0),T(!1),R(!1),I("")}),[f]),{uploadMedia:function(t){var l,s,c,u,m,g;return e.__awaiter(this,void 0,void 0,(function*(){if(I(""),y(""),t)if(t.startsWith("https"))try{if(R(!0),r){const e=yield r(t),{type:i,size:a,success:s}=e;if(s){const t=(new n.FileUploaderHelper).validate({linkData:{type:i,size:a}});if(t)return I(t),void R(!1);const[s]=i.split("/");d(null!==(l=e.url)&&void 0!==l?l:"",s.includes("application")?o.HEADER_TYPES.DOCUMENT:o.HEADER_TYPES[s.toUpperCase()])}else R(!1),I("An unknown technical error occurred");R(!1)}else{const e=yield fetch(t),i=yield e.blob();yield D(i)}}catch(e){R(!1),I("An unknown technical error occurred")}else if(a.isVariable(t)){let e;if(y(t),e=null!=f&&f>-1?{components:null===(c=null===(s=v.components[1])||void 0===s?void 0:s.cards)||void 0===c?void 0:c[f].components,mapping:null===(m=null===(u=null==v?void 0:v.mapping)||void 0===u?void 0:u.cards)||void 0===m?void 0:m[f]}:Object.assign({},v),e.components){const i=null===(g=null==e?void 0:e.components)||void 0===g?void 0:g.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==i&&i>-1&&(null==e?void 0:e.components[i])){const n=Object.assign(Object.assign({},e.components[i]),{format:p.format,example:{header_handle:[t]}}),o=[...e.components];o[i]=n,e.components=o}}if(e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[t]})),R(!1),null!=f&&f>-1){const t=i.cloneDeep(v);t.components[1].cards[f].components=e.components,t.mapping.cards[f]=e.mapping,null==E||E(Object.assign({},t))}else null==E||E(Object.assign({},e))}else R(!1),I("Invalid URL or variable");else O()}))},processImageUpload:D,handleImageUpload:function(e){var i;I(""),R(!0);const t=null===(i=e.target.files)||void 0===i?void 0:i[0];if(p.format===o.HEADER_TYPES.IMAGE){const e=new FileReader;j(""),h(""),e.onload=()=>{j(e.result),h(null==t?void 0:t.name)},t&&e.readAsDataURL(t)}else D(t)},handleImageChange:O,onCropComplete:function(i){return e.__awaiter(this,void 0,void 0,(function*(){R(!1),I("");const e=yield fetch(i),t=yield e.blob();yield D(t),j(void 0),T(!1)}))},editIconRef:U,fileName:g,setFileName:h,selectedVariable:b,setSelectedVariable:y,openEditMedia:M,setOpenEditMedia:T,selectedImage:S,setSelectedImage:j,loading:A,setLoading:R,error:_,setError:I}};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),t=require("lodash"),i=require("react"),n=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:p,fileRef:u}=s,{template:m,selectedCarouselIndex:v,setTemplate:f}=l.useTemplateModalContext(),[E,g]=i.useState(void 0),[h,b]=i.useState(),[_,T]=i.useState(!1),[y,A]=i.useState(""),[I,M]=i.useState(!1),[S,j]=i.useState(),R=i.useRef(null);function U(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){const e=new n.FileUploaderHelper;if(t instanceof Blob){const n=e.validate({file:t});if(n)A(n),M(!1),T(!1);else{const e=c.format===o.HEADER_TYPES.IMAGE,n=yield p({file:t,fileName:E,isImage:e});if(n.success){const[e]=t.type.split("/");d(null!==(i=n.url)&&void 0!==i?i:"","application"===e?o.HEADER_TYPES.DOCUMENT:o.HEADER_TYPES[e.toUpperCase()])}else M(!1),A("An unknown technical error occurred");M(!1),T(!1)}}else A("An unknown technical error occurred"),M(!1)}))}function D(){var e;(null===(e=null==u?void 0:u.current)||void 0===e?void 0:e.click)&&u.current.click()}return i.useEffect((()=>{g(void 0),j(void 0),b(void 0),T(!1),M(!1),A("")}),[v]),{uploadMedia:function(i){var l,s,p,u,E,g;return e.__awaiter(this,void 0,void 0,(function*(){if(A(""),b(""),i)if(i.startsWith("https"))try{if(M(!0),r){const e=yield r(i),{type:t,size:a,success:s}=e;if(s){const i=(new n.FileUploaderHelper).validate({linkData:{type:t,size:a}});if(i)return A(i),void M(!1);const[s]=t.split("/");d(null!==(l=e.url)&&void 0!==l?l:"",s.includes("application")?o.HEADER_TYPES.DOCUMENT:o.HEADER_TYPES[s.toUpperCase()])}else M(!1),A("An unknown technical error occurred");M(!1)}else{const e=yield fetch(i),t=yield e.blob();yield U(t)}}catch(e){M(!1),A("An unknown technical error occurred")}else if(a.isVariable(i)){let e;if(b(i),e=null!=v&&v>-1?{components:null===(p=null===(s=m.components[1])||void 0===s?void 0:s.cards)||void 0===p?void 0:p[v].components,mapping:null===(E=null===(u=null==m?void 0:m.mapping)||void 0===u?void 0:u.cards)||void 0===E?void 0:E[v]}:Object.assign({},m),e.components){const t=null===(g=null==e?void 0:e.components)||void 0===g?void 0:g.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==t&&t>-1&&(null==e?void 0:e.components[t])){const n=Object.assign(Object.assign({},e.components[t]),{format:c.format,example:{header_handle:[i]}}),o=[...e.components];o[t]=n,e.components=o}}if(e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[i]})),M(!1),null!=v&&v>-1){const i=t.cloneDeep(m);i.components[1].cards[v].components=e.components,i.mapping.cards[v]=e.mapping,null==f||f(Object.assign({},i))}else null==f||f(Object.assign({},e))}else M(!1),A("Invalid URL or variable");else D()}))},processImageUpload:U,handleImageUpload:function(e){var t;A(""),M(!0);const i=null===(t=e.target.files)||void 0===t?void 0:t[0];if(c.format===o.HEADER_TYPES.IMAGE){const e=new FileReader;j(""),g(""),e.onload=()=>{j(e.result),g(null==i?void 0:i.name)},i&&e.readAsDataURL(i)}else U(i)},handleImageChange:D,onCropComplete:function(t){return e.__awaiter(this,void 0,void 0,(function*(){M(!1),A("");const e=yield fetch(t),i=yield e.blob();yield U(i),j(void 0),T(!1)}))},editIconRef:R,fileName:E,setFileName:g,selectedVariable:h,setSelectedVariable:b,openEditMedia:_,setOpenEditMedia:T,selectedImage:S,setSelectedImage:j,loading:I,setLoading:M,error:y,setError:A}};
@@ -206,14 +206,9 @@ export type WhatsappMeta = {
206
206
  zeroStateComponent?: ReactElement;
207
207
  usePlaceHolderName?: boolean;
208
208
  };
209
- export interface IMimeTypeResponse {
210
- isValid: boolean;
211
- mimeType: string;
212
- }
213
209
  export type WhatsAppPickerMeta = {
214
210
  uploadMediaFiles: (params: WhatsAppMediaUploadRequest, index?: number) => Promise<WhatsAppMediaUploadResponse>;
215
211
  uploadMediaLink?: (link: string) => Promise<MediaLinkUploadResponse>;
216
- validateMimeType: (file: File | Blob) => Promise<IMimeTypeResponse>;
217
212
  CTAoptions?: ButtonPlaceHolderOptions[];
218
213
  QRBoptions?: ButtonPlaceHolderOptions[];
219
214
  };
@@ -7,6 +7,5 @@ export type TablePaginationProps = {
7
7
  hidePageSizeOptions?: boolean;
8
8
  updatePageNumber: (pageNumber: number) => void;
9
9
  updatePageSize: (option: DropdownOption | DropdownOption[]) => void;
10
- showTotalText?: boolean;
11
10
  };
12
11
  export declare const TablePagination: React.FC<TablePaginationProps>;
@@ -1 +1 @@
1
- import{jsxs as e,jsx as t}from"react/jsx-runtime";import o from"../../assets/icons/chevronLeft.svg.js";import s from"../../assets/icons/chevronRight.svg.js";import{StyledTablePaginationContainer as n,StyledPagingContainer as i}from"./TablePagination.styled.js";import{DEFAULT_THEME as r}from"../../constants/Theme.js";import{Dropdown as a}from"../dropdown/Dropdown.js";import{BodySecondary as l}from"../TypographyStyle.js";const c=c=>{let{pageNumber:d,pageSize:h,totalRows:p,updatePageNumber:g,updatePageSize:m,hidePageSizeOptions:b,showTotalText:j}=c;const v=r.colorsV2,y=(d-1)*h+1,f=(d-1)*h+h,u=Math.ceil(p/h),w=1==u;let O=[];O=u>=5?d===u?[d-4,d-3,d-2,d-1,d]:1===d?[d,d+1,d+2,d+3,d+4]:2===d?[d-1,d,d+1,d+2,d+3]:d===u-1?[d-3,d-2,d-1,d,d+1]:[d-2,d-1,d,d+1,d+2]:Array.from({length:u},((e,t)=>t+1));return e(n,{children:[!b&&t("div",{children:t(a,{size:"small",options:[{label:"5 rows per page",value:"5",selected:5===h},{label:"10 rows per page",value:"10",selected:10===h},{label:"20 rows per page",value:"20",selected:20===h}],onSelect:m,width:"162px"})}),e("div",Object.assign({className:"paging__container"},{children:[!b&&p&&e(l,Object.assign({style:{color:v.content.placeholder}},{children:["Showing ",y,"-",f>p?p:f," of"," ",p," results"]})),e("div",Object.assign({className:"pages__buttons-container"},{children:[!w&&t(i,Object.assign({active:!1,onClick:()=>{1!==d&&g(Math.max(d-1,1))},disabled:1===d},{children:t(o,{color:v.content.secondary,height:14,width:14})})),O.map((e=>t(i,Object.assign({active:e==d,onClick:()=>g(e),style:{display:1==e&&p<=h?"none":"flex"}},{children:t(l,Object.assign({style:{color:e==d?v.content.primaryInverse:v.content.secondary}},{children:e}))}),e))),!w&&t(i,Object.assign({isLast:!0,active:!1,onClick:()=>{d!==u&&g(Math.min(d+1,u))},disabled:d===u},{children:t(s,{color:v.content.secondary,height:14,width:14})}))]})),b&&p&&j&&e(l,Object.assign({style:{color:v.content.placeholder}},{children:["Showing ",y,"-",f>p?p:f," of"," ",p," results"]}))]}))]})};export{c as TablePagination};
1
+ import{jsxs as e,jsx as t}from"react/jsx-runtime";import s from"../../assets/icons/chevronLeft.svg.js";import o from"../../assets/icons/chevronRight.svg.js";import{StyledTablePaginationContainer as i,StyledPagingContainer as n}from"./TablePagination.styled.js";import{DEFAULT_THEME as a}from"../../constants/Theme.js";import{Dropdown as r}from"../dropdown/Dropdown.js";import{BodySecondary as c}from"../TypographyStyle.js";const l=l=>{let{pageNumber:d,pageSize:p,totalRows:g,updatePageNumber:h,updatePageSize:m,hidePageSizeOptions:b}=l;const j=a.colorsV2,v=(d-1)*p+1,y=(d-1)*p+p,f=Math.ceil(g/p),u=1==f;let w=[];w=f>=5?d===f?[d-4,d-3,d-2,d-1,d]:1===d?[d,d+1,d+2,d+3,d+4]:2===d?[d-1,d,d+1,d+2,d+3]:d===f-1?[d-3,d-2,d-1,d,d+1]:[d-2,d-1,d,d+1,d+2]:Array.from({length:f},((e,t)=>t+1));return e(i,{children:[!b&&t("div",{children:t(r,{size:"small",options:[{label:"5 rows per page",value:"5",selected:5===p},{label:"10 rows per page",value:"10",selected:10===p},{label:"20 rows per page",value:"20",selected:20===p}],onSelect:m,width:"162px"})}),e("div",Object.assign({className:"paging__container"},{children:[!b&&g&&e(c,Object.assign({style:{color:j.content.placeholder,marginRight:8}},{children:["Showing ",v,"-",y>g?g:y," of"," ",g," results"]})),e("div",Object.assign({className:"pages__buttons-container"},{children:[!u&&t(n,Object.assign({active:!1,onClick:()=>{1!==d&&h(Math.max(d-1,1))},disabled:1===d},{children:t(s,{color:j.content.secondary,height:14,width:14})})),w.map((e=>t(n,Object.assign({active:e==d,onClick:()=>h(e),style:{display:1==e&&g<=p?"none":"flex"}},{children:t(c,Object.assign({style:{color:e==d?j.content.primaryInverse:j.content.secondary}},{children:e}))}),e))),!u&&t(n,Object.assign({isLast:!0,active:!1,onClick:()=>{d!==f&&h(Math.min(d+1,f))},disabled:d===f},{children:t(o,{color:j.content.secondary,height:14,width:14})}))]}))]}))]})};export{l as TablePagination};
@@ -13,7 +13,6 @@ import r from"styled-components";import{DEFAULT_THEME as t}from"../../constants/
13
13
  margin-bottom: 8px;
14
14
  justify-content: center;
15
15
  align-items: center;
16
- gap: 8px;
17
16
  }
18
17
 
19
18
  .pages__buttons-container {
@@ -1,3 +1,4 @@
1
+ /// <reference types="react" />
1
2
  export declare const Menus: ({
2
3
  displayName: string;
3
4
  key: number;
@@ -2,7 +2,7 @@ import React from 'react';
2
2
  import { VariableListInterfaceV2 } from "../../add-variableV2";
3
3
  import { HEADER_TYPES } from "../../template-preview";
4
4
  import { UseEditWhatsappTemplateMediaResponse } from './useEditWhtasappTemplateMedia';
5
- interface EditMediaModalProps {
5
+ declare const EditMediaModal: React.FC<{
6
6
  setOpenEditMedia: React.Dispatch<React.SetStateAction<boolean>>;
7
7
  openEditMedia: boolean;
8
8
  mediaComponentFormat: HEADER_TYPES;
@@ -11,6 +11,5 @@ interface EditMediaModalProps {
11
11
  editIconRef: React.MutableRefObject<HTMLDivElement | null>;
12
12
  fileRef: React.MutableRefObject<HTMLInputElement | null>;
13
13
  useEditWhatsappTemplateMediaResponse: UseEditWhatsappTemplateMediaResponse;
14
- }
15
- declare const EditMediaModal: React.FC<EditMediaModalProps>;
14
+ }>;
16
15
  export default EditMediaModal;
@@ -1,4 +1,4 @@
1
- import{jsx as o,jsxs as n,Fragment as e}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{getAllDataFromTemplateComponent as c}from"../utils/getDataFromTemplateComponent.js";import{isVariable as m}from"../utils/validateIsUrl.js";import{validateInputName as v}from"../utils/validateName.js";import{BackTrackComponent as b}from"./BackTrackComponent.js";import{DiscountCodeComponent as g}from"./DiscountCodeComponent.js";import f from"./EditMediaModal.js";import h from"./EditMediaV2.js";import{EditTemplateMediaContainer as O}from"./EditMediaV2.style.js";import{useEditWhatsappTemplateMedia as j}from"./useEditWhtasappTemplateMedia.js";import C from"./VariableConnector.js";import{Container as T}from"./VariableConnectorsPanel.js";import x from"./VariableConnectorWhatsApp.js";import y from"./VariableEditorHeader.js";import E from"./WhatsAppTemplateCardButtonV2.js";const V=s=>{let{template:V,onTemplateChange:M,whatsappSpecificPickerMeta:k,showVariableModal:I,variableListForImage:L,setDiscountCode:R,fileName:U,setFileName:w}=s;var N,P,A,_,D,H,S,F,Q,q,Y,K,W,$,G,X,z,J,Z,oo,no,eo,to,io,lo,ao,so,ro,po,uo,co,mo,vo,bo,go,fo,ho,Oo,jo;const Co=V.isCarouselType,{originalVariableList:To,pod:xo,extras:yo,selectedCarouselIndex:Eo,isProductCarouselType:Vo}=u(),{descriptionComponents:Bo,urlBtns:Mo,qrbBtns:ko,imageComponent:Io,bodyVariables:Lo,headerVariables:Ro}=c(V),Uo=i(null),[wo,No]=l(!1),[Po,Ao]=l(-1===Eo?{descriptionComponents:Bo,urlBtns:Mo,qrbBtns:ko,imageComponent:Io,bodyVariables:Lo,headerVariables:Ro}:{}),{uploadMediaLink:_o,uploadMediaFiles:Do,validateMimeType:Ho}=k,So=j({uploadMediaLink:_o,uploadMediaFiles:Do,updateTemplateImageUrl:function(o,n){var e,i,l,a,s,d,r,p;let u;u=null!=Eo&&Eo>-1?{components:null===(i=null===(e=V.components[1])||void 0===e?void 0:e.cards)||void 0===i?void 0:i[Eo].components,mapping:null===(a=null===(l=null==V?void 0:V.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Eo]}:Object.assign({},V);const c=null===(s=null==u?void 0:u.components)||void 0===s?void 0:s.findIndex((o=>{if("HEADER"===o.type&&"NONE"!==o.format&&"TEXT"!==o.format)return!0}));if(void 0!==c&&c>-1&&(null==u?void 0:u.components[c])){const e=Object.assign(Object.assign({},u.components[c]),{format:n,example:{header_handle:[o]}}),t=[...u.components];t[c]=e,u=Object.assign(Object.assign({},u),{components:t})}u.mapping&&(u.mapping=Object.assign(Object.assign({},u.mapping),{header:void 0}));if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,(null===(d=null==o?void 0:o.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==o?void 0:o.mapping)||void 0===r?void 0:r.cards.length)>0&&(o.mapping.cards[Eo]=null!==(p=u.mapping)&&void 0!==p?p:{}),null==M||M(Object.assign({},o)),Qo(!0)}else null==M||M(Object.assign({},u))},validateMimeType:Ho,mediaComponent:Co?Po.imageComponent:Io,fileRef:Uo}),[Fo,Qo]=l(!1),[qo,Yo]=l(U),[Ko,Wo]=l();function $o(o,n,e){var i,l,a,s,d,r,p,u,c,m;const v=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V),b=t(v),g="custom"===n&&"string"==typeof o,f=g?o:"string"!=typeof o?o.defaultValue?o.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Eo&&Eo>-1&&Vo){const n=Object.assign({},V).components.map((o=>{var n;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(n=o.cards)||void 0===n?void 0:n.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var n,t,i;if("BUTTONS"===o.type){const l=null===(n=o.buttons)||void 0===n?void 0:n.filter((o=>"URL"===o.type));let a=null!==(t=null==l?void 0:l[e])&&void 0!==t?t:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]});const s=null===(i=o.buttons)||void 0===i?void 0:i.map((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o));return Object.assign(Object.assign({},o),{buttons:s})}return o}))})))}):o})),i=null===(s=null===(a=Object.assign({},V).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((n=>{var e;return Object.assign(Object.assign({},n),{buttons:null===(e=null==n?void 0:n.buttons)||void 0===e?void 0:e.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof o?o.placeHolder:""))})})),l=t(V);return l.components=n,l.mapping.cards=i,void(null==M||M(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((o=>"BUTTONS"===o.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((o=>"URL"===o.type));if((null==t?void 0:t.length)>0){const i="custom"===n&&"string"==typeof o,l=i?o:"string"!=typeof o&&o.defaultValue?o.defaultValue:"https://d.bik.ai/";let a=t[e];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((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o)),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[e]=i?"((customBtnPlaceholder))":"string"!=typeof o?o.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 o){"checkout.checkoutUrl"===(null===(m=o.placeHolder)||void 0===m?void 0:m.slice(2,-2))?No(!0):(No(!1),null==R||R(""))}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=b.components,o.mapping.cards[Eo]=b.mapping,null==M||M(Object.assign({},o))}else null==M||M(b)}function Go(o,n,e){var i,l,a,s,d,r,p;const u=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V);if(null!=Eo&&Eo>-1&&Vo){const n=Object.assign({},V).components.map((n=>{var t;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(t=n.cards)||void 0===t?void 0:t.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var t,i,l;if("BUTTONS"===n.type){const a=null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.filter((o=>"QUICK_REPLY"===o.type));let s=null!==(i=null==a?void 0:a[e])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:o.flowId,flowName:o.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==s?void 0:s.text)?s:o));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=t(V);return i.components=n,void(null==M||M(Object.assign({},i)))}const c=null==u?void 0:u.components.findIndex((o=>"BUTTONS"===o.type));if(void 0!==c&&c>-1){const n=null===(s=null===(a=null==u?void 0:u.components[c])||void 0===a?void 0:a.buttons)||void 0===s?void 0:s.filter((o=>"QUICK_REPLY"===o.type));if(n){let t=n[e];t=Object.assign(Object.assign({},t),{flowId:o.flowId,flowName:o.flowName});const i=[...null!==(p=null===(r=null===(d=u.components)||void 0===d?void 0:d[c])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==t?void 0:t.text)?t:o)),l=Object.assign(Object.assign({},u.components[c]),{buttons:i}),a=[...u.components];a[c]=l,u.components=a}}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,null==M||M(Object.assign({},o))}else null==M||M(u)}a((()=>{var o,n;if(null===(o=V.mapping.buttons)||void 0===o?void 0:o.find((o=>"checkout.checkoutUrl"===o.slice(2,-2))))No(!0);else{No(!1);const o=null===(n=null==yo?void 0:yo.discountCodeExtra)||void 0===n?void 0:n[1];null==o||o("")}}),[V]),a((()=>{var o,n,e,t;if(null!=Eo&&Eo>-1){const i={components:null===(n=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===n?void 0:n[Eo].components,mapping:null===(t=null===(e=null==V?void 0:V.mapping)||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);Ao({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p})}else if(null!=Eo&&-1===Eo){const{descriptionComponents:o,urlBtns:n,qrbBtns:e,imageComponent:t,bodyVariables:i,headerVariables:l}=c(V);Ao({descriptionComponents:o,urlBtns:n,qrbBtns:e,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Eo]),a((()=>{var o,n,e,t;if(null!=Eo&&Eo>-1&&Fo){const i={components:null===(n=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===n?void 0:n[Eo].components,mapping:null===(t=null===(e=null==V?void 0:V.mapping)||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);Ao({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}),Qo(!1)}}),[Fo]);const Xo=Co?Po.imageComponent:Io;return So.openEditMedia?o(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:o(f,{mediaComponentFormat:null!==(N=Xo.format)&&void 0!==N?N:r.IMAGE,uploadMedia:So.uploadMedia,variableListForImage:L||[],useEditWhatsappTemplateMediaResponse:So,setOpenEditMedia:So.setOpenEditMedia,openEditMedia:So.openEditMedia,editIconRef:So.editIconRef,fileRef:Uo})})):n(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Vo?"420px":"auto"}},{children:[!!Po.imageComponent&&!Vo&&n(O,{children:[o(h,{imageName:null!==(A=null===(P=null==Xo?void 0:Xo.example)||void 0===P?void 0:P.header_handle)&&void 0!==A?A:[],handleImageChange:So.handleImageChange,mediaType:null==Xo?void 0:Xo.format,error:So.error,isLoading:So.loading,setOpenEditMedia:So.setOpenEditMedia,selectedVariable:m(null!==(H=null===(D=null===(_=null==Xo?void 0:Xo.example)||void 0===_?void 0:_.header_handle)||void 0===D?void 0:D[0])&&void 0!==H?H:"")?null===(F=null===(S=null==Xo?void 0:Xo.example)||void 0===S?void 0:S.header_handle)||void 0===F?void 0:F[0]:(null===(q=null===(Q=null==V?void 0:V.mapping)||void 0===Q?void 0:Q.header)||void 0===q?void 0:q[0])?null===(K=null===(Y=null==V?void 0:V.mapping)||void 0===Y?void 0:Y.header)||void 0===K?void 0:K[0]:So.selectedVariable}),(null==Io?void 0:Io.format)==r.DOCUMENT?o(B,{children:o(d,{labelText:"PDF Name",placeholder:"Enter the name",value:qo,errorMessage:Ko||void 0,onBlur:()=>{if(!qo)return null==w||w(""),void Wo("PDF name is Required");const o=v(qo);null==w||w(qo),Wo(o?"Please enter a valid PDF name":void 0)},onChangeText:o=>{Wo(""),Yo(o)}})}):o(e,{})]}),(null===(W=Po.bodyVariables)||void 0===W?void 0:W.length)>0&&o(y,{containerStyle:{paddingTop:Po.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===($=Po.descriptionComponents)||void 0===$?void 0:$.map(((n,e)=>o(x,{originalVariableList:null!=Eo&&Eo>-1?To.cards[Eo]:To,type:n.type,descriptionComponent:n.component,showVariableModal:I},e))),(null===(z=null===(X=null!=Eo&&Eo>-1?null===(G=To.cards[Eo])||void 0===G?void 0:G.buttons:null==To?void 0:To.buttons)||void 0===X?void 0:X.filter((o=>"URL"===o.type)))||void 0===z?void 0:z.length)>0&&o(y,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(oo=null===(Z=null!=Eo&&Eo>-1?null===(J=To.cards[Eo])||void 0===J?void 0:J.buttons:null==To?void 0:To.buttons)||void 0===Z?void 0:Z.filter((o=>xo===p.CHATBOT||"URL"===o.type)))||void 0===oo?void 0:oo.map(((n,e)=>{if("URL"===n.type)return o(E,{variableListIndex:e,CTAoptions:null==k?void 0:k.CTAoptions,button:n,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedURLTemplateBtn:$o},`${e}_${Eo}`)})),xo===p.CHATBOT&&(null===(eo=null===(no=ko[0])||void 0===no?void 0:no.component)||void 0===eo?void 0:eo.buttons)&&(null===(lo=null===(io=null===(to=ko[0])||void 0===to?void 0:to.component)||void 0===io?void 0:io.buttons)||void 0===lo?void 0:lo.length)>0&&o(b,{backTrackMessage:null===(ao=null==yo?void 0:yo.backTrackExtra)||void 0===ao?void 0:ao[0],setBackTrackMessage:null===(so=null==yo?void 0:yo.backTrackExtra)||void 0===so?void 0:so[1]}),(null===(uo=null===(po=null!=Eo&&Eo>-1?null===(ro=To.cards[Eo])||void 0===ro?void 0:ro.buttons:null==To?void 0:To.buttons)||void 0===po?void 0:po.filter((o=>"QUICK_REPLY"===o.type)))||void 0===uo?void 0:uo.length)>0&&(xo!==p.CHATBOT?o(y,{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(b,{backTrackMessage:null===(co=null==yo?void 0:yo.backTrackExtra)||void 0===co?void 0:co[0],setBackTrackMessage:null===(mo=null==yo?void 0:yo.backTrackExtra)||void 0===mo?void 0:mo[1]})),null===(go=null===(bo=null!=Eo&&Eo>-1?null===(vo=To.cards[Eo])||void 0===vo?void 0:vo.buttons:null==To?void 0:To.buttons)||void 0===bo?void 0:bo.filter((o=>"QUICK_REPLY"===o.type)))||void 0===go?void 0:go.map(((n,e)=>{if("QUICK_REPLY"===n.type&&xo!==p.CHATBOT)return o(E,{variableListIndex:e,QRBoptions:null==k?void 0:k.QRBoptions,button:n,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedQRBTemplateBtn:Go},`${e}_${Eo}`)})),xo===p.CHATBOT&&wo&&o(g,{discountCode:null===(fo=null==yo?void 0:yo.discountCodeExtra)||void 0===fo?void 0:fo[0],setDiscountCode:null===(ho=null==yo?void 0:yo.discountCodeExtra)||void 0===ho?void 0:ho[1]}),null===(jo=null!=Eo&&Eo>-1?null===(Oo=To.cards[Eo])||void 0===Oo?void 0:Oo.buttons:null==To?void 0:To.buttons)||void 0===jo?void 0:jo.map(((n,e)=>{var t,i,l;if("COPY_CODE"===n.type)return o(C,{index:e,variable:{variableName:null!==(t=n.text)&&void 0!==t?t:"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,componentType:"BUTTONS",buttonType:n.type},e)}))]}))},B=s.div`
1
+ import{jsx as o,jsxs as n,Fragment as e}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{getAllDataFromTemplateComponent as c}from"../utils/getDataFromTemplateComponent.js";import{isVariable as m}from"../utils/validateIsUrl.js";import{validateInputName as v}from"../utils/validateName.js";import{BackTrackComponent as b}from"./BackTrackComponent.js";import{DiscountCodeComponent as g}from"./DiscountCodeComponent.js";import f from"./EditMediaModal.js";import h from"./EditMediaV2.js";import{EditTemplateMediaContainer as O}from"./EditMediaV2.style.js";import{useEditWhatsappTemplateMedia as j}from"./useEditWhtasappTemplateMedia.js";import C from"./VariableConnector.js";import{Container as T}from"./VariableConnectorsPanel.js";import x from"./VariableConnectorWhatsApp.js";import y from"./VariableEditorHeader.js";import E from"./WhatsAppTemplateCardButtonV2.js";const V=s=>{let{template:V,onTemplateChange:k,whatsappSpecificPickerMeta:M,showVariableModal:I,variableListForImage:L,setDiscountCode:R,fileName:U,setFileName:w}=s;var N,P,A,_,D,H,S,F,Q,q,Y,K,W,$,G,X,z,J,Z,oo,no,eo,to,io,lo,ao,so,ro,po,uo,co,mo,vo,bo,go,fo,ho,Oo,jo;const Co=V.isCarouselType,{originalVariableList:To,pod:xo,extras:yo,selectedCarouselIndex:Eo,isProductCarouselType:Vo}=u(),{descriptionComponents:Bo,urlBtns:ko,qrbBtns:Mo,imageComponent:Io,bodyVariables:Lo,headerVariables:Ro}=c(V),Uo=i(null),[wo,No]=l(!1),[Po,Ao]=l(-1===Eo?{descriptionComponents:Bo,urlBtns:ko,qrbBtns:Mo,imageComponent:Io,bodyVariables:Lo,headerVariables:Ro}:{}),{uploadMediaLink:_o,uploadMediaFiles:Do}=M,Ho=j({uploadMediaLink:_o,uploadMediaFiles:Do,updateTemplateImageUrl:function(o,n){var e,i,l,a,s,d,r,p;let u;u=null!=Eo&&Eo>-1?{components:null===(i=null===(e=V.components[1])||void 0===e?void 0:e.cards)||void 0===i?void 0:i[Eo].components,mapping:null===(a=null===(l=null==V?void 0:V.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Eo]}:Object.assign({},V);const c=null===(s=null==u?void 0:u.components)||void 0===s?void 0:s.findIndex((o=>{if("HEADER"===o.type&&"NONE"!==o.format&&"TEXT"!==o.format)return!0}));if(void 0!==c&&c>-1&&(null==u?void 0:u.components[c])){const e=Object.assign(Object.assign({},u.components[c]),{format:n,example:{header_handle:[o]}}),t=[...u.components];t[c]=e,u=Object.assign(Object.assign({},u),{components:t})}u.mapping&&(u.mapping=Object.assign(Object.assign({},u.mapping),{header:void 0}));if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,(null===(d=null==o?void 0:o.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==o?void 0:o.mapping)||void 0===r?void 0:r.cards.length)>0&&(o.mapping.cards[Eo]=null!==(p=u.mapping)&&void 0!==p?p:{}),null==k||k(Object.assign({},o)),Fo(!0)}else null==k||k(Object.assign({},u))},mediaComponent:Co?Po.imageComponent:Io,fileRef:Uo}),[So,Fo]=l(!1),[Qo,qo]=l(U),[Yo,Ko]=l();function Wo(o,n,e){var i,l,a,s,d,r,p,u,c,m;const v=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V),b=t(v),g="custom"===n&&"string"==typeof o,f=g?o:"string"!=typeof o?o.defaultValue?o.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Eo&&Eo>-1&&Vo){const n=Object.assign({},V).components.map((o=>{var n;return"CAROUSEL"===o.type?Object.assign(Object.assign({},o),{cards:null===(n=o.cards)||void 0===n?void 0:n.map((o=>Object.assign(Object.assign({},o),{components:o.components.map((o=>{var n,t,i;if("BUTTONS"===o.type){const l=null===(n=o.buttons)||void 0===n?void 0:n.filter((o=>"URL"===o.type));let a=null!==(t=null==l?void 0:l[e])&&void 0!==t?t:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]});const s=null===(i=o.buttons)||void 0===i?void 0:i.map((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o));return Object.assign(Object.assign({},o),{buttons:s})}return o}))})))}):o})),i=null===(s=null===(a=Object.assign({},V).mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s.map((n=>{var e;return Object.assign(Object.assign({},n),{buttons:null===(e=null==n?void 0:n.buttons)||void 0===e?void 0:e.map((n=>g?"((customBtnPlaceholder))":"string"!=typeof o?o.placeHolder:""))})})),l=t(V);return l.components=n,l.mapping.cards=i,void(null==k||k(Object.assign({},l)))}const h=null==b?void 0:b.components.findIndex((o=>"BUTTONS"===o.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((o=>"URL"===o.type));if((null==t?void 0:t.length)>0){const i="custom"===n&&"string"==typeof o,l=i?o:"string"!=typeof o&&o.defaultValue?o.defaultValue:"https://d.bik.ai/";let a=t[e];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((o=>"URL"===o.type&&(null==o?void 0:o.text)===(null==a?void 0:a.text)?a:o)),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[e]=i?"((customBtnPlaceholder))":"string"!=typeof o?o.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 o){"checkout.checkoutUrl"===(null===(m=o.placeHolder)||void 0===m?void 0:m.slice(2,-2))?No(!0):(No(!1),null==R||R(""))}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=b.components,o.mapping.cards[Eo]=b.mapping,null==k||k(Object.assign({},o))}else null==k||k(b)}function $o(o,n,e){var i,l,a,s,d,r,p;const u=null!=Eo&&Eo>-1?{components:null===(i=Object.assign({},V).components[1].cards)||void 0===i?void 0:i[Eo].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Eo]}:Object.assign({},V);if(null!=Eo&&Eo>-1&&Vo){const n=Object.assign({},V).components.map((n=>{var t;return"CAROUSEL"===n.type?Object.assign(Object.assign({},n),{cards:null===(t=n.cards)||void 0===t?void 0:t.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var t,i,l;if("BUTTONS"===n.type){const a=null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.filter((o=>"QUICK_REPLY"===o.type));let s=null!==(i=null==a?void 0:a[e])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:o.flowId,flowName:o.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==s?void 0:s.text)?s:o));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=t(V);return i.components=n,void(null==k||k(Object.assign({},i)))}const c=null==u?void 0:u.components.findIndex((o=>"BUTTONS"===o.type));if(void 0!==c&&c>-1){const n=null===(s=null===(a=null==u?void 0:u.components[c])||void 0===a?void 0:a.buttons)||void 0===s?void 0:s.filter((o=>"QUICK_REPLY"===o.type));if(n){let t=n[e];t=Object.assign(Object.assign({},t),{flowId:o.flowId,flowName:o.flowName});const i=[...null!==(p=null===(r=null===(d=u.components)||void 0===d?void 0:d[c])||void 0===r?void 0:r.buttons)&&void 0!==p?p:[]].map((o=>"QUICK_REPLY"===o.type&&(null==o?void 0:o.text)===(null==t?void 0:t.text)?t:o)),l=Object.assign(Object.assign({},u.components[c]),{buttons:i}),a=[...u.components];a[c]=l,u.components=a}}if(null!=Eo&&Eo>-1){const o=t(V);o.components[1].cards[Eo].components=u.components,null==k||k(Object.assign({},o))}else null==k||k(u)}a((()=>{var o,n;if(null===(o=V.mapping.buttons)||void 0===o?void 0:o.find((o=>"checkout.checkoutUrl"===o.slice(2,-2))))No(!0);else{No(!1);const o=null===(n=null==yo?void 0:yo.discountCodeExtra)||void 0===n?void 0:n[1];null==o||o("")}}),[V]),a((()=>{var o,n,e,t;if(null!=Eo&&Eo>-1){const i={components:null===(n=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===n?void 0:n[Eo].components,mapping:null===(t=null===(e=null==V?void 0:V.mapping)||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);Ao({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p})}else if(null!=Eo&&-1===Eo){const{descriptionComponents:o,urlBtns:n,qrbBtns:e,imageComponent:t,bodyVariables:i,headerVariables:l}=c(V);Ao({descriptionComponents:o,urlBtns:n,qrbBtns:e,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Eo]),a((()=>{var o,n,e,t;if(null!=Eo&&Eo>-1&&So){const i={components:null===(n=null===(o=V.components[1])||void 0===o?void 0:o.cards)||void 0===n?void 0:n[Eo].components,mapping:null===(t=null===(e=null==V?void 0:V.mapping)||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Eo]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}=c(i);Ao({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:p}),Fo(!1)}}),[So]);const Go=Co?Po.imageComponent:Io;return Ho.openEditMedia?o(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:o(f,{mediaComponentFormat:null!==(N=Go.format)&&void 0!==N?N:r.IMAGE,uploadMedia:Ho.uploadMedia,variableListForImage:L||[],useEditWhatsappTemplateMediaResponse:Ho,setOpenEditMedia:Ho.setOpenEditMedia,openEditMedia:Ho.openEditMedia,editIconRef:Ho.editIconRef,fileRef:Uo})})):n(T,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Vo?"420px":"auto"}},{children:[!!Po.imageComponent&&!Vo&&n(O,{children:[o(h,{imageName:null!==(A=null===(P=null==Go?void 0:Go.example)||void 0===P?void 0:P.header_handle)&&void 0!==A?A:[],handleImageChange:Ho.handleImageChange,mediaType:null==Go?void 0:Go.format,error:Ho.error,isLoading:Ho.loading,setOpenEditMedia:Ho.setOpenEditMedia,selectedVariable:m(null!==(H=null===(D=null===(_=null==Go?void 0:Go.example)||void 0===_?void 0:_.header_handle)||void 0===D?void 0:D[0])&&void 0!==H?H:"")?null===(F=null===(S=null==Go?void 0:Go.example)||void 0===S?void 0:S.header_handle)||void 0===F?void 0:F[0]:(null===(q=null===(Q=null==V?void 0:V.mapping)||void 0===Q?void 0:Q.header)||void 0===q?void 0:q[0])?null===(K=null===(Y=null==V?void 0:V.mapping)||void 0===Y?void 0:Y.header)||void 0===K?void 0:K[0]:Ho.selectedVariable}),(null==Io?void 0:Io.format)==r.DOCUMENT?o(B,{children:o(d,{labelText:"PDF Name",placeholder:"Enter the name",value:Qo,errorMessage:Yo||void 0,onBlur:()=>{if(!Qo)return null==w||w(""),void Ko("PDF name is Required");const o=v(Qo);null==w||w(Qo),Ko(o?"Please enter a valid PDF name":void 0)},onChangeText:o=>{Ko(""),qo(o)}})}):o(e,{})]}),(null===(W=Po.bodyVariables)||void 0===W?void 0:W.length)>0&&o(y,{containerStyle:{paddingTop:Po.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===($=Po.descriptionComponents)||void 0===$?void 0:$.map(((n,e)=>o(x,{originalVariableList:null!=Eo&&Eo>-1?To.cards[Eo]:To,type:n.type,descriptionComponent:n.component,showVariableModal:I},e))),(null===(z=null===(X=null!=Eo&&Eo>-1?null===(G=To.cards[Eo])||void 0===G?void 0:G.buttons:null==To?void 0:To.buttons)||void 0===X?void 0:X.filter((o=>"URL"===o.type)))||void 0===z?void 0:z.length)>0&&o(y,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(oo=null===(Z=null!=Eo&&Eo>-1?null===(J=To.cards[Eo])||void 0===J?void 0:J.buttons:null==To?void 0:To.buttons)||void 0===Z?void 0:Z.filter((o=>xo===p.CHATBOT||"URL"===o.type)))||void 0===oo?void 0:oo.map(((n,e)=>{if("URL"===n.type)return o(E,{variableListIndex:e,CTAoptions:null==M?void 0:M.CTAoptions,button:n,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedURLTemplateBtn:Wo},`${e}_${Eo}`)})),xo===p.CHATBOT&&(null===(eo=null===(no=Mo[0])||void 0===no?void 0:no.component)||void 0===eo?void 0:eo.buttons)&&(null===(lo=null===(io=null===(to=Mo[0])||void 0===to?void 0:to.component)||void 0===io?void 0:io.buttons)||void 0===lo?void 0:lo.length)>0&&o(b,{backTrackMessage:null===(ao=null==yo?void 0:yo.backTrackExtra)||void 0===ao?void 0:ao[0],setBackTrackMessage:null===(so=null==yo?void 0:yo.backTrackExtra)||void 0===so?void 0:so[1]}),(null===(uo=null===(po=null!=Eo&&Eo>-1?null===(ro=To.cards[Eo])||void 0===ro?void 0:ro.buttons:null==To?void 0:To.buttons)||void 0===po?void 0:po.filter((o=>"QUICK_REPLY"===o.type)))||void 0===uo?void 0:uo.length)>0&&(xo!==p.CHATBOT?o(y,{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(b,{backTrackMessage:null===(co=null==yo?void 0:yo.backTrackExtra)||void 0===co?void 0:co[0],setBackTrackMessage:null===(mo=null==yo?void 0:yo.backTrackExtra)||void 0===mo?void 0:mo[1]})),null===(go=null===(bo=null!=Eo&&Eo>-1?null===(vo=To.cards[Eo])||void 0===vo?void 0:vo.buttons:null==To?void 0:To.buttons)||void 0===bo?void 0:bo.filter((o=>"QUICK_REPLY"===o.type)))||void 0===go?void 0:go.map(((n,e)=>{if("QUICK_REPLY"===n.type&&xo!==p.CHATBOT)return o(E,{variableListIndex:e,QRBoptions:null==M?void 0:M.QRBoptions,button:n,currentVariableList:null!=Eo&&Eo>-1?Object.assign({},To.cards[Eo]):Object.assign({},To),updateSelectedQRBTemplateBtn:$o},`${e}_${Eo}`)})),xo===p.CHATBOT&&wo&&o(g,{discountCode:null===(fo=null==yo?void 0:yo.discountCodeExtra)||void 0===fo?void 0:fo[0],setDiscountCode:null===(ho=null==yo?void 0:yo.discountCodeExtra)||void 0===ho?void 0:ho[1]}),null===(jo=null!=Eo&&Eo>-1?null===(Oo=To.cards[Eo])||void 0===Oo?void 0:Oo.buttons:null==To?void 0:To.buttons)||void 0===jo?void 0:jo.map(((n,e)=>{var t,i,l;if("COPY_CODE"===n.type)return o(C,{index:e,variable:{variableName:null!==(t=n.text)&&void 0!==t?t:"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,componentType:"BUTTONS",buttonType:n.type},e)}))]}))},B=s.div`
2
2
  padding-top: 24px;
3
3
  padding-left: 10px;
4
4
  padding-right: 10px;
@@ -1,15 +1,13 @@
1
1
  import React from 'react';
2
- import { IMimeTypeResponse, WhatsAppPickerMeta, WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
2
+ import { WhatsAppPickerMeta, WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
3
3
  export type UseEditWhatsappTemplateMediaResponse = ReturnType<typeof useEditWhatsappTemplateMedia>;
4
- interface UseEditWhatsappTemplateMediaProps {
4
+ export declare const useEditWhatsappTemplateMedia: (props: {
5
5
  uploadMediaLink?: WhatsAppPickerMeta['uploadMediaLink'];
6
6
  uploadMediaFiles: WhatsAppPickerMeta['uploadMediaFiles'];
7
- validateMimeType?: (blob: Blob) => Promise<IMimeTypeResponse>;
8
7
  updateTemplateImageUrl: (url: string, format: WhatsAppTemplate['components'][0]['format']) => void;
9
8
  fileRef: React.RefObject<HTMLInputElement | null>;
10
9
  mediaComponent: any;
11
- }
12
- export declare const useEditWhatsappTemplateMedia: (props: UseEditWhatsappTemplateMediaProps) => {
10
+ }) => {
13
11
  uploadMedia: (urlOrVariable?: string) => Promise<void>;
14
12
  processImageUpload: (file?: Blob | File) => Promise<void>;
15
13
  handleImageUpload: ($event: React.ChangeEvent<HTMLInputElement>) => void;
@@ -29,4 +27,3 @@ export declare const useEditWhatsappTemplateMedia: (props: UseEditWhatsappTempla
29
27
  error: string;
30
28
  setError: React.Dispatch<React.SetStateAction<string>>;
31
29
  };
32
- export {};
@@ -1 +1 @@
1
- import{__awaiter as e}from"../../../_virtual/_tslib.js";import{cloneDeep as o}from"lodash";import{useState as i,useRef as n,useEffect as t}from"react";import{FileUploaderHelper as l}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,validateMimeType:m,mediaComponent:u,uploadMediaFiles:f,fileRef:v}=d,{template:g,selectedCarouselIndex:h,setTemplate:y}=s(),[b,I]=i(void 0),[M,j]=i(),[E,O]=i(!1),[U,C]=i(""),[T,k]=i(!1),[w,A]=i(),N=n(null);function R(o){var i;return e(this,void 0,void 0,(function*(){const e=new l;if(o instanceof Blob){if(m){const{isValid:e,mimeType:i}=yield m(o);if(!e)return void C(`MIME type ${i} is not supported`)}const n=e.validate({file:o});if(n)C(n),k(!1),O(!1);else{const e=u.format===a.IMAGE,n=yield f({file:o,fileName:b,isImage:e});if(n.success){const[e]=o.type.split("/");p(null!==(i=n.url)&&void 0!==i?i:"","application"===e?a.DOCUMENT:a[e.toUpperCase()])}else k(!1),C("An unknown technical error occurred");k(!1),O(!1)}}else C("An unknown technical error occurred"),k(!1)}))}function x(){var e;console.log("fileRef",v),(null===(e=null==v?void 0:v.current)||void 0===e?void 0:e.click)&&v.current.click()}return t((()=>{I(void 0),A(void 0),j(void 0),O(!1),k(!1),C("")}),[h]),{uploadMedia:function(i){var n,t,s,d,m,f;return e(this,void 0,void 0,(function*(){if(C(""),j(""),i)if(i.startsWith("https"))try{if(k(!0),c){const e=yield c(i),{type:o,size:t,success:s}=e;if(s){const i=(new l).validate({linkData:{type:o,size:t}});if(i)return C(i),void k(!1);const[s]=o.split("/");p(null!==(n=e.url)&&void 0!==n?n:"",s.includes("application")?a.DOCUMENT:a[s.toUpperCase()])}else k(!1),C("An unknown technical error occurred");k(!1)}else{const e=yield fetch(i),o=yield e.blob();yield R(o)}}catch(e){k(!1),C("An unknown technical error occurred")}else if(r(i)){let e;if(j(i),e=null!=h&&h>-1?{components:null===(s=null===(t=g.components[1])||void 0===t?void 0:t.cards)||void 0===s?void 0:s[h].components,mapping:null===(m=null===(d=null==g?void 0:g.mapping)||void 0===d?void 0:d.cards)||void 0===m?void 0:m[h]}:Object.assign({},g),e.components){const o=null===(f=null==e?void 0:e.components)||void 0===f?void 0:f.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:u.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]})),k(!1),null!=h&&h>-1){const i=o(g);i.components[1].cards[h].components=e.components,i.mapping.cards[h]=e.mapping,null==y||y(Object.assign({},i))}else null==y||y(Object.assign({},e))}else k(!1),C("Invalid URL or variable");else x()}))},processImageUpload:R,handleImageUpload:function(e){var o;C(""),k(!0);const i=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==i?void 0:i.name)},i&&e.readAsDataURL(i)}else R(i)},handleImageChange:x,onCropComplete:function(o){return e(this,void 0,void 0,(function*(){k(!1),C("");const e=yield fetch(o),i=yield e.blob();yield R(i),A(void 0),O(!1)}))},editIconRef:N,fileName:b,setFileName:I,selectedVariable:M,setSelectedVariable:j,openEditMedia:E,setOpenEditMedia:O,selectedImage:w,setSelectedImage:A,loading:T,setLoading:k,error:U,setError:C}};export{d as useEditWhatsappTemplateMedia};
1
+ import{__awaiter as e}from"../../../_virtual/_tslib.js";import{cloneDeep as o}from"lodash";import{useState as n,useRef as i,useEffect as t}from"react";import{FileUploaderHelper as l}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:m,uploadMediaFiles:u,fileRef:f}=d,{template:v,selectedCarouselIndex:g,setTemplate:h}=s(),[b,I]=n(void 0),[y,j]=n(),[E,M]=n(!1),[O,U]=n(""),[C,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 l;if(o instanceof Blob){const i=e.validate({file:o});if(i)U(i),k(!1),M(!1);else{const e=m.format===a.IMAGE,i=yield u({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),U("An unknown technical error occurred");k(!1),M(!1)}}else U("An unknown technical error occurred"),k(!1)}))}function x(){var e;(null===(e=null==f?void 0:f.current)||void 0===e?void 0:e.click)&&f.current.click()}return t((()=>{I(void 0),A(void 0),j(void 0),M(!1),k(!1),U("")}),[g]),{uploadMedia:function(n){var i,t,s,d,u,f;return e(this,void 0,void 0,(function*(){if(U(""),j(""),n)if(n.startsWith("https"))try{if(k(!0),c){const e=yield c(n),{type:o,size:t,success:s}=e;if(s){const n=(new l).validate({linkData:{type:o,size:t}});if(n)return U(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),U("An unknown technical error occurred");k(!1)}else{const e=yield fetch(n),o=yield e.blob();yield T(o)}}catch(e){k(!1),U("An unknown technical error occurred")}else if(r(n)){let e;if(j(n),e=null!=g&&g>-1?{components:null===(s=null===(t=v.components[1])||void 0===t?void 0:t.cards)||void 0===s?void 0:s[g].components,mapping:null===(u=null===(d=null==v?void 0:v.mapping)||void 0===d?void 0:d.cards)||void 0===u?void 0:u[g]}:Object.assign({},v),e.components){const o=null===(f=null==e?void 0:e.components)||void 0===f?void 0:f.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:m.format,example:{header_handle:[n]}}),t=[...e.components];t[o]=i,e.components=t}}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),U("Invalid URL or variable");else x()}))},processImageUpload:T,handleImageUpload:function(e){var o;U(""),k(!0);const n=null===(o=e.target.files)||void 0===o?void 0:o[0];if(m.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),U("");const e=yield fetch(o),n=yield e.blob();yield T(n),A(void 0),M(!1)}))},editIconRef:N,fileName:b,setFileName:I,selectedVariable:y,setSelectedVariable:j,openEditMedia:E,setOpenEditMedia:M,selectedImage:w,setSelectedImage:A,loading:C,setLoading:k,error:O,setError:U}};export{d as useEditWhatsappTemplateMedia};
@@ -206,14 +206,9 @@ export type WhatsappMeta = {
206
206
  zeroStateComponent?: ReactElement;
207
207
  usePlaceHolderName?: boolean;
208
208
  };
209
- export interface IMimeTypeResponse {
210
- isValid: boolean;
211
- mimeType: string;
212
- }
213
209
  export type WhatsAppPickerMeta = {
214
210
  uploadMediaFiles: (params: WhatsAppMediaUploadRequest, index?: number) => Promise<WhatsAppMediaUploadResponse>;
215
211
  uploadMediaLink?: (link: string) => Promise<MediaLinkUploadResponse>;
216
- validateMimeType: (file: File | Blob) => Promise<IMimeTypeResponse>;
217
212
  CTAoptions?: ButtonPlaceHolderOptions[];
218
213
  QRBoptions?: ButtonPlaceHolderOptions[];
219
214
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.548-mime.3",
3
+ "version": "0.0.548-productpicker.0",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",
@@ -59,7 +59,6 @@
59
59
  "chart.js": "^3.9.1",
60
60
  "chartjs-plugin-datalabels": "^2.2.0",
61
61
  "emoji-picker-react": "^4.4.9",
62
- "file-type": "^19.3.0",
63
62
  "lodash": "^4.17.21",
64
63
  "phone": "^3.1.37",
65
64
  "react-beautiful-dnd": "^13.1.1",
@@ -173,6 +172,6 @@
173
172
  "styled-components": "^5.3.3"
174
173
  },
175
174
  "engines": {
176
- "node": ">=22"
175
+ "node": ">=20"
177
176
  }
178
177
  }