@bikdotai/bik-component-library 0.0.359-beta.29 → 0.0.359-beta.30

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.
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),i=require("react"),a=require("../../helpers/FileUploaderHelper.js"),n=require("../../image-cropper/BikImageCropper.js");require("../../image-compress/ImageCompress.js"),require("../../states/StateComponent.js"),require("../../../constants/zindex.js"),require("../../modals/styledModal.js"),require("../../spinner/Spinner.js");var o=require("../../template-preview/models/TemplateMeta.js"),r=require("../context/templateModalContext.js"),l=require("./EditMediaModal.js"),s=require("./EditMediaV2.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=d(i);exports.default=d=>{let{mediaComponent:p,template:u,updateTemplateImageUrl:m,whatsappSpecificPickerMeta:f,variableListForImage:v}=d;var g,E,j;const[h,b]=i.useState(void 0),[M,_]=i.useState(),[y,A]=i.useState(),[S,x]=i.useState(!1),C=c.default.createRef(),[I,T]=i.useState(!1),[q,O]=i.useState(""),{template:R,setTemplate:w}=r.useTemplateModalContext();let D;function H(){var e;(null===(e=null==C?void 0:C.current)||void 0===e?void 0:e.click)&&C.current.click()}function k(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){const e=new a.FileUploaderHelper;if(t instanceof Blob){const a=e.validate(t);if(a)O(a),T(!1);else{const e=p.format===o.HEADER_TYPES.IMAGE,a=yield f.uploadMediaFiles({file:t,fileName:h,isImage:e});if(a.success){const[e]=t.type.split("/");m(null!==(i=a.url)&&void 0!==i?i:"","application"===e?o.HEADER_TYPES.DOCUMENT:o.HEADER_TYPES[e.toUpperCase()])}else O("An unknown technical error occured");T(!1)}}else O("An unknown technical error occured"),T(!1)}))}return D=p.format===o.HEADER_TYPES.IMAGE?"image/png, image/jpeg":p.format===o.HEADER_TYPES.VIDEO?"video/mp4":"application/pdf",t.jsxs(t.Fragment,{children:[t.jsx(l.default,{mediaComponentFormat:null!==(g=p.format)&&void 0!==g?g:o.HEADER_TYPES.IMAGE,uploadMedia:function(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){O(""),x(!1);const e=Object.assign({},R);if(e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:void 0})),t)if(t.startsWith("https"))try{T(!0),A("");const e=yield fetch(t),i=yield e.blob();yield k(i)}catch(e){O("An unknown technical error occurred")}else if(/^{{.*}}$/.test(t)){if(A(t),e.components){const t=null===(i=null==e?void 0:e.components)||void 0===i?void 0:i.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 i=Object.assign(Object.assign({},e.components[t]),{format:p.format,example:{header_handle:["https://jkfenner.com/wp-content/uploads/2019/11/default.jpg"]}}),a=[...e.components];a[t]=i,e.components=a}}e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[t]})),T(!1)}else T(!1),O("Invalid URL or variable");else H();null==w||w(Object.assign({},e))}))},variableListForImage:v||[],setOpenEditMedia:x,openEditMedia:S}),!!M&&t.jsx(n.BikImageCropper,{aspectRatio:15/8,src:M,onCropComplete:function(t){return e.__awaiter(this,void 0,void 0,(function*(){T(!1),O("");const e=yield fetch(t);k(yield e.blob()).then((()=>{_(void 0)}))}))},onCancel:()=>{console.log("cancel"),T(!1),_("")}}),t.jsx("input",{ref:C,style:{display:"none"},type:"file",onChange:function(e){var t;O(""),T(!0);const i=null===(t=e.target.files)||void 0===t?void 0:t[0];if(p.format===o.HEADER_TYPES.IMAGE){const e=new FileReader;_(""),b(""),e.onload=()=>{_(e.result),b(null==i?void 0:i.name)},i&&e.readAsDataURL(i)}else k(i)},accept:D}),t.jsx(s.default,{imageName:null!==(j=null===(E=null==p?void 0:p.example)||void 0===E?void 0:E.header_handle)&&void 0!==j?j:[],handleImageChange:H,mediaType:null==p?void 0:p.format,error:q,isLoading:I,setOpenEditMedia:x,selectedVariable:y})]})};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js"),t=require("react/jsx-runtime"),i=require("react"),a=require("../../helpers/FileUploaderHelper.js"),n=require("../../image-cropper/BikImageCropper.js");require("../../image-compress/ImageCompress.js"),require("../../states/StateComponent.js"),require("../../../constants/zindex.js"),require("../../modals/styledModal.js"),require("../../spinner/Spinner.js");var o=require("../../template-preview/models/TemplateMeta.js"),r=require("../context/templateModalContext.js"),l=require("./EditMediaModal.js"),s=require("./EditMediaV2.js");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=d(i);exports.default=d=>{let{mediaComponent:p,template:u,updateTemplateImageUrl:m,whatsappSpecificPickerMeta:f,variableListForImage:v}=d;var E,g,j;const[h,M]=i.useState(void 0),[_,b]=i.useState(),[y,A]=i.useState(),[S,x]=i.useState(!1),C=c.default.createRef(),[I,T]=i.useState(!1),[q,R]=i.useState(""),{template:O,setTemplate:w}=r.useTemplateModalContext();let D;function H(){var e;(null===(e=null==C?void 0:C.current)||void 0===e?void 0:e.click)&&C.current.click()}function k(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){const e=new a.FileUploaderHelper;if(t instanceof Blob){const a=e.validate(t);if(a)R(a),T(!1);else{const e=p.format===o.HEADER_TYPES.IMAGE,a=yield f.uploadMediaFiles({file:t,fileName:h,isImage:e});if(a.success){const[e]=t.type.split("/");m(null!==(i=a.url)&&void 0!==i?i:"","application"===e?o.HEADER_TYPES.DOCUMENT:o.HEADER_TYPES[e.toUpperCase()])}else R("An unknown technical error occured");T(!1)}}else R("An unknown technical error occured"),T(!1)}))}return D=p.format===o.HEADER_TYPES.IMAGE?"image/png, image/jpeg":p.format===o.HEADER_TYPES.VIDEO?"video/mp4":"application/pdf",t.jsxs(t.Fragment,{children:[t.jsx(l.default,{mediaComponentFormat:null!==(E=p.format)&&void 0!==E?E:o.HEADER_TYPES.IMAGE,uploadMedia:function(t){var i;return e.__awaiter(this,void 0,void 0,(function*(){if(R(""),A(""),x(!1),t)if(t.startsWith("https"))try{T(!0);const e=yield fetch(t),i=yield e.blob();yield k(i)}catch(e){R("An unknown technical error occurred")}else if(/^{{.*}}$/.test(t)){A(t);const e=Object.assign({},O);if(e.components){const t=null===(i=null==e?void 0:e.components)||void 0===i?void 0:i.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 i=Object.assign(Object.assign({},e.components[t]),{format:p.format,example:{header_handle:["https://jkfenner.com/wp-content/uploads/2019/11/default.jpg"]}}),a=[...e.components];a[t]=i,e.components=a}}e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[t]})),T(!1),null==w||w(Object.assign({},e))}else T(!1),R("Invalid URL or variable");else H()}))},variableListForImage:v||[],setOpenEditMedia:x,openEditMedia:S}),!!_&&t.jsx(n.BikImageCropper,{aspectRatio:15/8,src:_,onCropComplete:function(t){return e.__awaiter(this,void 0,void 0,(function*(){T(!1),R("");const e=yield fetch(t);k(yield e.blob()).then((()=>{b(void 0)}))}))},onCancel:()=>{console.log("cancel"),T(!1),b("")}}),t.jsx("input",{ref:C,style:{display:"none"},type:"file",onChange:function(e){var t;R(""),T(!0);const i=null===(t=e.target.files)||void 0===t?void 0:t[0];if(p.format===o.HEADER_TYPES.IMAGE){const e=new FileReader;b(""),M(""),e.onload=()=>{b(e.result),M(null==i?void 0:i.name)},i&&e.readAsDataURL(i)}else k(i)},accept:D}),t.jsx(s.default,{imageName:null!==(j=null===(g=null==p?void 0:p.example)||void 0===g?void 0:g.header_handle)&&void 0!==j?j:[],handleImageChange:H,mediaType:null==p?void 0:p.format,error:q,isLoading:I,setOpenEditMedia:x,selectedVariable:y})]})};
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../context/templateModalContext.js"),o=require("../utils/getDataFromTemplateComponent.js"),n=require("./EditMediaV2.style.js"),i=require("./EditWhatsAppTemplateMediaV2.js"),a=require("./VariableConnectorsPanel.js"),l=require("./VariableConnectorWhatsApp.js"),s=require("./VariableEditorHeader.js"),d=require("./WhatsAppTemplateCardButtonV2.js");exports.default=r=>{let{template:p,onTemplateChange:u,whatsappSpecificPickerMeta:c,showVariableModal:m,variableList:b,variableListForImage:v}=r;var g,h,f,j,x,T,O,y,C,E,V,w;const{originalVariableList:I}=t.useTemplateModalContext(),{descriptionComponents:L,urlBtns:B,qrbBtns:M,imageComponent:q,bodyVariables:R,headerVariables:A}=o.getAllDataFromTemplateComponent(p);function U(e,t){var o,n,i,a;const l=Object.assign({},p),s=null==l?void 0:l.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==s&&s>-1){const d=null===(o=null==l?void 0:l.components[s].buttons)||void 0===o?void 0:o.findIndex((e=>"URL"===e.type));if(void 0!==d&&d>-1){const o="custom"===t&&"string"==typeof e,r=[...null!==(a=null===(i=null===(n=l.components)||void 0===n?void 0:n[s])||void 0===i?void 0:i.buttons)&&void 0!==a?a:[]];r[d]=Object.assign(Object.assign({},r[d]),{url:"https://d.bik.ai/{{1}}",example:[o?e:"string"!=typeof e?e.defaultValue:""]});const p=Object.assign(Object.assign({},l.components[s]),{buttons:r}),u=Object.assign(Object.assign({},l.mapping),{buttons:o?["((customBtnPlaceholder))"]:"string"!=typeof e?[e.placeHolder]:void 0});l.mapping=u;const c=[...l.components];c[s]=p,l.components=c}}null==u||u(l)}function P(e,t,o){var n;const i=Object.assign({},p),a=null==i?void 0:i.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==a&&a>-1){const t=null===(n=null==i?void 0:i.components[a].buttons)||void 0===n?void 0:n.filter((e=>"QUICK_REPLY"===e.type));t&&(t[o]=Object.assign(Object.assign({},t[o]),{flowId:e.flowId,flowName:e.flowName}));const l=Object.assign(Object.assign({},i.components[a]),{buttons:t}),s=[...i.components];s[a]=l,i.components=s}null==u||u(i)}return e.jsxs(a.Container,Object.assign({style:{flexDirection:"column",maxHeight:460}},{children:[!!q&&e.jsx(n.EditTemplateMediaContainer,{children:e.jsx(i.default,{whatsappSpecificPickerMeta:c,mediaComponent:q,updateTemplateImageUrl:function(e,t){var o;let n=Object.assign({},p);const i=null===(o=null==n?void 0:n.components)||void 0===o?void 0:o.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==i&&i>-1&&(null==n?void 0:n.components[i])){const o=Object.assign(Object.assign({},n.components[i]),{format:t,example:{header_handle:[e]}}),a=[...n.components];a[i]=o,n=Object.assign(Object.assign({},n),{components:a})}null==u||u(n)},template:p,variableListForImage:v})}),(R.length>0||A.length>0)&&e.jsx(s.default,{containerStyle:{paddingTop:q?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==L?void 0:L.map(((t,o)=>e.jsx(l.default,{originalVariableList:I,type:t.type,descriptionComponent:t.component,variableMapping:"HEADER"===t.type?p.mapping.header:p.mapping.body,showVariableModal:m,variableList:b},o))),(null===(h=null===(g=B[0])||void 0===g?void 0:g.component)||void 0===h?void 0:h.buttons)&&(null===(x=null===(j=null===(f=B[0])||void 0===f?void 0:f.component)||void 0===j?void 0:j.buttons)||void 0===x?void 0:x.length)>0&&e.jsx(s.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(T=null==I?void 0:I.buttons)||void 0===T?void 0:T.map(((t,o)=>{if("URL"===t.type)return e.jsx(d.default,{CTAoptions:null==c?void 0:c.CTAoptions,button:t,originalVariableList:I,updateSelectedURLTemplateBtn:U},`${o}`)})),(null===(y=null===(O=M[0])||void 0===O?void 0:O.component)||void 0===y?void 0:y.buttons)&&(null===(V=null===(E=null===(C=M[0])||void 0===C?void 0:C.component)||void 0===E?void 0:E.buttons)||void 0===V?void 0:V.length)>0&&e.jsx(s.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"}),null===(w=null==I?void 0:I.buttons)||void 0===w?void 0:w.map(((t,o)=>{if("QUICK_REPLY"===t.type)return e.jsx(d.default,{QRBoptions:null==c?void 0:c.QRBoptions,button:t,originalVariableList:I,updateSelectedQRBTemplateBtn:P},`${o}`)}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../context/templateModalContext.js"),n=require("../utils/getDataFromTemplateComponent.js"),o=require("./EditMediaV2.style.js"),i=require("./EditWhatsAppTemplateMediaV2.js"),a=require("./VariableConnectorsPanel.js"),l=require("./VariableConnectorWhatsApp.js"),s=require("./VariableEditorHeader.js"),d=require("./WhatsAppTemplateCardButtonV2.js");exports.default=r=>{let{template:p,onTemplateChange:u,whatsappSpecificPickerMeta:c,showVariableModal:m,variableList:b,variableListForImage:v}=r;var g,h,f,j,x,T,O,y,C,E,V,w;const{originalVariableList:I}=t.useTemplateModalContext(),{descriptionComponents:L,urlBtns:B,qrbBtns:M,imageComponent:q,bodyVariables:R,headerVariables:A}=n.getAllDataFromTemplateComponent(p);function U(e,t){var n,o,i,a;const l=Object.assign({},p),s=null==l?void 0:l.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==s&&s>-1){const d=null===(n=null==l?void 0:l.components[s].buttons)||void 0===n?void 0:n.findIndex((e=>"URL"===e.type));if(void 0!==d&&d>-1){const n="custom"===t&&"string"==typeof e,r=[...null!==(a=null===(i=null===(o=l.components)||void 0===o?void 0:o[s])||void 0===i?void 0:i.buttons)&&void 0!==a?a:[]];r[d]=Object.assign(Object.assign({},r[d]),{url:"https://d.bik.ai/{{1}}",example:[n?e:"string"!=typeof e?e.defaultValue:""]});const p=Object.assign(Object.assign({},l.components[s]),{buttons:r}),u=Object.assign(Object.assign({},l.mapping),{buttons:n?["((customBtnPlaceholder))"]:"string"!=typeof e?[e.placeHolder]:void 0});l.mapping=u;const c=[...l.components];c[s]=p,l.components=c}}null==u||u(l)}function P(e,t,n){var o;const i=Object.assign({},p),a=null==i?void 0:i.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==a&&a>-1){const t=null===(o=null==i?void 0:i.components[a].buttons)||void 0===o?void 0:o.filter((e=>"QUICK_REPLY"===e.type));t&&(t[n]=Object.assign(Object.assign({},t[n]),{flowId:e.flowId,flowName:e.flowName}));const l=Object.assign(Object.assign({},i.components[a]),{buttons:t}),s=[...i.components];s[a]=l,i.components=s}null==u||u(i)}return e.jsxs(a.Container,Object.assign({style:{flexDirection:"column",maxHeight:460}},{children:[!!q&&e.jsx(o.EditTemplateMediaContainer,{children:e.jsx(i.default,{whatsappSpecificPickerMeta:c,mediaComponent:q,updateTemplateImageUrl:function(e,t){var n;let o=Object.assign({},p);const i=null===(n=null==o?void 0:o.components)||void 0===n?void 0:n.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==i&&i>-1&&(null==o?void 0:o.components[i])){const n=Object.assign(Object.assign({},o.components[i]),{format:t,example:{header_handle:[e]}}),a=[...o.components];a[i]=n,o=Object.assign(Object.assign({},o),{components:a})}o.mapping&&(o.mapping=Object.assign(Object.assign({},o.mapping),{header:void 0})),null==u||u(Object.assign({},o))},template:p,variableListForImage:v})}),(R.length>0||A.length>0)&&e.jsx(s.default,{containerStyle:{paddingTop:q?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==L?void 0:L.map(((t,n)=>e.jsx(l.default,{originalVariableList:I,type:t.type,descriptionComponent:t.component,variableMapping:"HEADER"===t.type?p.mapping.header:p.mapping.body,showVariableModal:m,variableList:b},n))),(null===(h=null===(g=B[0])||void 0===g?void 0:g.component)||void 0===h?void 0:h.buttons)&&(null===(x=null===(j=null===(f=B[0])||void 0===f?void 0:f.component)||void 0===j?void 0:j.buttons)||void 0===x?void 0:x.length)>0&&e.jsx(s.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(T=null==I?void 0:I.buttons)||void 0===T?void 0:T.map(((t,n)=>{if("URL"===t.type)return e.jsx(d.default,{CTAoptions:null==c?void 0:c.CTAoptions,button:t,originalVariableList:I,updateSelectedURLTemplateBtn:U},`${n}`)})),(null===(y=null===(O=M[0])||void 0===O?void 0:O.component)||void 0===y?void 0:y.buttons)&&(null===(V=null===(E=null===(C=M[0])||void 0===C?void 0:C.component)||void 0===E?void 0:E.buttons)||void 0===V?void 0:V.length)>0&&e.jsx(s.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"}),null===(w=null==I?void 0:I.buttons)||void 0===w?void 0:w.map(((t,n)=>{if("QUICK_REPLY"===t.type)return e.jsx(d.default,{QRBoptions:null==c?void 0:c.QRBoptions,button:t,originalVariableList:I,updateSelectedQRBTemplateBtn:P},`${n}`)}))]}))};
@@ -1 +1 @@
1
- import{__awaiter as e}from"../../../_virtual/_tslib.js";import{jsxs as t,Fragment as o,jsx as i}from"react/jsx-runtime";import n,{useState as a}from"react";import{FileUploaderHelper as r}from"../../helpers/FileUploaderHelper.js";import{BikImageCropper as l}from"../../image-cropper/BikImageCropper.js";import"../../image-compress/ImageCompress.js";import"../../states/StateComponent.js";import"../../../constants/zindex.js";import"../../modals/styledModal.js";import"../../spinner/Spinner.js";import{HEADER_TYPES as s}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as p}from"../context/templateModalContext.js";import d from"./EditMediaModal.js";import c from"./EditMediaV2.js";const m=m=>{let{mediaComponent:f,template:u,updateTemplateImageUrl:v,whatsappSpecificPickerMeta:g,variableListForImage:h}=m;var j,b,M;const[E,y]=a(void 0),[I,C]=a(),[O,A]=a(),[k,w]=a(!1),x=n.createRef(),[T,F]=a(!1),[R,U]=a(""),{template:L,setTemplate:N}=p();let D;function G(){var e;(null===(e=null==x?void 0:x.current)||void 0===e?void 0:e.click)&&x.current.click()}function _(t){var o;return e(this,void 0,void 0,(function*(){const e=new r;if(t instanceof Blob){const i=e.validate(t);if(i)U(i),F(!1);else{const e=f.format===s.IMAGE,i=yield g.uploadMediaFiles({file:t,fileName:E,isImage:e});if(i.success){const[e]=t.type.split("/");v(null!==(o=i.url)&&void 0!==o?o:"","application"===e?s.DOCUMENT:s[e.toUpperCase()])}else U("An unknown technical error occured");F(!1)}}else U("An unknown technical error occured"),F(!1)}))}return D=f.format===s.IMAGE?"image/png, image/jpeg":f.format===s.VIDEO?"video/mp4":"application/pdf",t(o,{children:[i(d,{mediaComponentFormat:null!==(j=f.format)&&void 0!==j?j:s.IMAGE,uploadMedia:function(t){var o;return e(this,void 0,void 0,(function*(){U(""),w(!1);const e=Object.assign({},L);if(e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:void 0})),t)if(t.startsWith("https"))try{F(!0),A("");const e=yield fetch(t),o=yield e.blob();yield _(o)}catch(e){U("An unknown technical error occurred")}else if(/^{{.*}}$/.test(t)){if(A(t),e.components){const t=null===(o=null==e?void 0:e.components)||void 0===o?void 0:o.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 o=Object.assign(Object.assign({},e.components[t]),{format:f.format,example:{header_handle:["https://jkfenner.com/wp-content/uploads/2019/11/default.jpg"]}}),i=[...e.components];i[t]=o,e.components=i}}e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[t]})),F(!1)}else F(!1),U("Invalid URL or variable");else G();null==N||N(Object.assign({},e))}))},variableListForImage:h||[],setOpenEditMedia:w,openEditMedia:k}),!!I&&i(l,{aspectRatio:15/8,src:I,onCropComplete:function(t){return e(this,void 0,void 0,(function*(){F(!1),U("");const e=yield fetch(t);_(yield e.blob()).then((()=>{C(void 0)}))}))},onCancel:()=>{console.log("cancel"),F(!1),C("")}}),i("input",{ref:x,style:{display:"none"},type:"file",onChange:function(e){var t;U(""),F(!0);const o=null===(t=e.target.files)||void 0===t?void 0:t[0];if(f.format===s.IMAGE){const e=new FileReader;C(""),y(""),e.onload=()=>{C(e.result),y(null==o?void 0:o.name)},o&&e.readAsDataURL(o)}else _(o)},accept:D}),i(c,{imageName:null!==(M=null===(b=null==f?void 0:f.example)||void 0===b?void 0:b.header_handle)&&void 0!==M?M:[],handleImageChange:G,mediaType:null==f?void 0:f.format,error:R,isLoading:T,setOpenEditMedia:w,selectedVariable:O})]})};export{m as default};
1
+ import{__awaiter as e}from"../../../_virtual/_tslib.js";import{jsxs as t,Fragment as o,jsx as i}from"react/jsx-runtime";import n,{useState as a}from"react";import{FileUploaderHelper as r}from"../../helpers/FileUploaderHelper.js";import{BikImageCropper as l}from"../../image-cropper/BikImageCropper.js";import"../../image-compress/ImageCompress.js";import"../../states/StateComponent.js";import"../../../constants/zindex.js";import"../../modals/styledModal.js";import"../../spinner/Spinner.js";import{HEADER_TYPES as s}from"../../template-preview/models/TemplateMeta.js";import{useTemplateModalContext as p}from"../context/templateModalContext.js";import d from"./EditMediaModal.js";import c from"./EditMediaV2.js";const m=m=>{let{mediaComponent:f,template:u,updateTemplateImageUrl:v,whatsappSpecificPickerMeta:g,variableListForImage:h}=m;var j,M,b;const[E,y]=a(void 0),[I,C]=a(),[O,A]=a(),[k,w]=a(!1),x=n.createRef(),[T,F]=a(!1),[R,U]=a(""),{template:L,setTemplate:N}=p();let D;function G(){var e;(null===(e=null==x?void 0:x.current)||void 0===e?void 0:e.click)&&x.current.click()}function _(t){var o;return e(this,void 0,void 0,(function*(){const e=new r;if(t instanceof Blob){const i=e.validate(t);if(i)U(i),F(!1);else{const e=f.format===s.IMAGE,i=yield g.uploadMediaFiles({file:t,fileName:E,isImage:e});if(i.success){const[e]=t.type.split("/");v(null!==(o=i.url)&&void 0!==o?o:"","application"===e?s.DOCUMENT:s[e.toUpperCase()])}else U("An unknown technical error occured");F(!1)}}else U("An unknown technical error occured"),F(!1)}))}return D=f.format===s.IMAGE?"image/png, image/jpeg":f.format===s.VIDEO?"video/mp4":"application/pdf",t(o,{children:[i(d,{mediaComponentFormat:null!==(j=f.format)&&void 0!==j?j:s.IMAGE,uploadMedia:function(t){var o;return e(this,void 0,void 0,(function*(){if(U(""),A(""),w(!1),t)if(t.startsWith("https"))try{F(!0);const e=yield fetch(t),o=yield e.blob();yield _(o)}catch(e){U("An unknown technical error occurred")}else if(/^{{.*}}$/.test(t)){A(t);const e=Object.assign({},L);if(e.components){const t=null===(o=null==e?void 0:e.components)||void 0===o?void 0:o.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 o=Object.assign(Object.assign({},e.components[t]),{format:f.format,example:{header_handle:["https://jkfenner.com/wp-content/uploads/2019/11/default.jpg"]}}),i=[...e.components];i[t]=o,e.components=i}}e.mapping&&(e.mapping=Object.assign(Object.assign({},e.mapping),{header:[t]})),F(!1),null==N||N(Object.assign({},e))}else F(!1),U("Invalid URL or variable");else G()}))},variableListForImage:h||[],setOpenEditMedia:w,openEditMedia:k}),!!I&&i(l,{aspectRatio:15/8,src:I,onCropComplete:function(t){return e(this,void 0,void 0,(function*(){F(!1),U("");const e=yield fetch(t);_(yield e.blob()).then((()=>{C(void 0)}))}))},onCancel:()=>{console.log("cancel"),F(!1),C("")}}),i("input",{ref:x,style:{display:"none"},type:"file",onChange:function(e){var t;U(""),F(!0);const o=null===(t=e.target.files)||void 0===t?void 0:t[0];if(f.format===s.IMAGE){const e=new FileReader;C(""),y(""),e.onload=()=>{C(e.result),y(null==o?void 0:o.name)},o&&e.readAsDataURL(o)}else _(o)},accept:D}),i(c,{imageName:null!==(b=null===(M=null==f?void 0:f.example)||void 0===M?void 0:M.header_handle)&&void 0!==b?b:[],handleImageChange:G,mediaType:null==f?void 0:f.format,error:R,isLoading:T,setOpenEditMedia:w,selectedVariable:O})]})};export{m as default};
@@ -1 +1 @@
1
- import{jsxs as t,jsx as o}from"react/jsx-runtime";import{useTemplateModalContext as e}from"../context/templateModalContext.js";import{getAllDataFromTemplateComponent as n}from"../utils/getDataFromTemplateComponent.js";import{EditTemplateMediaContainer as i}from"./EditMediaV2.style.js";import a from"./EditWhatsAppTemplateMediaV2.js";import{Container as l}from"./VariableConnectorsPanel.js";import s from"./VariableConnectorWhatsApp.js";import d from"./VariableEditorHeader.js";import p from"./WhatsAppTemplateCardButtonV2.js";const r=r=>{let{template:c,onTemplateChange:u,whatsappSpecificPickerMeta:m,showVariableModal:b,variableList:v,variableListForImage:g}=r;var h,f,j,T,O,x,y,E,V,C,w,I;const{originalVariableList:L}=e(),{descriptionComponents:B,urlBtns:R,qrbBtns:A,imageComponent:M,bodyVariables:U,headerVariables:S}=n(c);function k(t,o){var e,n,i,a;const l=Object.assign({},c),s=null==l?void 0:l.components.findIndex((t=>"BUTTONS"===t.type));if(void 0!==s&&s>-1){const d=null===(e=null==l?void 0:l.components[s].buttons)||void 0===e?void 0:e.findIndex((t=>"URL"===t.type));if(void 0!==d&&d>-1){const e="custom"===o&&"string"==typeof t,p=[...null!==(a=null===(i=null===(n=l.components)||void 0===n?void 0:n[s])||void 0===i?void 0:i.buttons)&&void 0!==a?a:[]];p[d]=Object.assign(Object.assign({},p[d]),{url:"https://d.bik.ai/{{1}}",example:[e?t:"string"!=typeof t?t.defaultValue:""]});const r=Object.assign(Object.assign({},l.components[s]),{buttons:p}),c=Object.assign(Object.assign({},l.mapping),{buttons:e?["((customBtnPlaceholder))"]:"string"!=typeof t?[t.placeHolder]:void 0});l.mapping=c;const u=[...l.components];u[s]=r,l.components=u}}null==u||u(l)}function N(t,o,e){var n;const i=Object.assign({},c),a=null==i?void 0:i.components.findIndex((t=>"BUTTONS"===t.type));if(void 0!==a&&a>-1){const o=null===(n=null==i?void 0:i.components[a].buttons)||void 0===n?void 0:n.filter((t=>"QUICK_REPLY"===t.type));o&&(o[e]=Object.assign(Object.assign({},o[e]),{flowId:t.flowId,flowName:t.flowName}));const l=Object.assign(Object.assign({},i.components[a]),{buttons:o}),s=[...i.components];s[a]=l,i.components=s}null==u||u(i)}return t(l,Object.assign({style:{flexDirection:"column",maxHeight:460}},{children:[!!M&&o(i,{children:o(a,{whatsappSpecificPickerMeta:m,mediaComponent:M,updateTemplateImageUrl:function(t,o){var e;let n=Object.assign({},c);const i=null===(e=null==n?void 0:n.components)||void 0===e?void 0:e.findIndex((t=>{if("HEADER"===t.type&&"NONE"!==t.format&&"TEXT"!==t.format)return!0}));if(void 0!==i&&i>-1&&(null==n?void 0:n.components[i])){const e=Object.assign(Object.assign({},n.components[i]),{format:o,example:{header_handle:[t]}}),a=[...n.components];a[i]=e,n=Object.assign(Object.assign({},n),{components:a})}null==u||u(n)},template:c,variableListForImage:g})}),(U.length>0||S.length>0)&&o(d,{containerStyle:{paddingTop:M?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==B?void 0:B.map(((t,e)=>o(s,{originalVariableList:L,type:t.type,descriptionComponent:t.component,variableMapping:"HEADER"===t.type?c.mapping.header:c.mapping.body,showVariableModal:b,variableList:v},e))),(null===(f=null===(h=R[0])||void 0===h?void 0:h.component)||void 0===f?void 0:f.buttons)&&(null===(O=null===(T=null===(j=R[0])||void 0===j?void 0:j.component)||void 0===T?void 0:T.buttons)||void 0===O?void 0:O.length)>0&&o(d,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(x=null==L?void 0:L.buttons)||void 0===x?void 0:x.map(((t,e)=>{if("URL"===t.type)return o(p,{CTAoptions:null==m?void 0:m.CTAoptions,button:t,originalVariableList:L,updateSelectedURLTemplateBtn:k},`${e}`)})),(null===(E=null===(y=A[0])||void 0===y?void 0:y.component)||void 0===E?void 0:E.buttons)&&(null===(w=null===(C=null===(V=A[0])||void 0===V?void 0:V.component)||void 0===C?void 0:C.buttons)||void 0===w?void 0:w.length)>0&&o(d,{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"}),null===(I=null==L?void 0:L.buttons)||void 0===I?void 0:I.map(((t,e)=>{if("QUICK_REPLY"===t.type)return o(p,{QRBoptions:null==m?void 0:m.QRBoptions,button:t,originalVariableList:L,updateSelectedQRBTemplateBtn:N},`${e}`)}))]}))};export{r as default};
1
+ import{jsxs as t,jsx as e}from"react/jsx-runtime";import{useTemplateModalContext as o}from"../context/templateModalContext.js";import{getAllDataFromTemplateComponent as n}from"../utils/getDataFromTemplateComponent.js";import{EditTemplateMediaContainer as i}from"./EditMediaV2.style.js";import a from"./EditWhatsAppTemplateMediaV2.js";import{Container as l}from"./VariableConnectorsPanel.js";import s from"./VariableConnectorWhatsApp.js";import d from"./VariableEditorHeader.js";import p from"./WhatsAppTemplateCardButtonV2.js";const r=r=>{let{template:c,onTemplateChange:m,whatsappSpecificPickerMeta:u,showVariableModal:b,variableList:v,variableListForImage:g}=r;var h,f,j,T,O,x,y,E,V,C,w,I;const{originalVariableList:L}=o(),{descriptionComponents:B,urlBtns:R,qrbBtns:A,imageComponent:M,bodyVariables:U,headerVariables:S}=n(c);function k(t,e){var o,n,i,a;const l=Object.assign({},c),s=null==l?void 0:l.components.findIndex((t=>"BUTTONS"===t.type));if(void 0!==s&&s>-1){const d=null===(o=null==l?void 0:l.components[s].buttons)||void 0===o?void 0:o.findIndex((t=>"URL"===t.type));if(void 0!==d&&d>-1){const o="custom"===e&&"string"==typeof t,p=[...null!==(a=null===(i=null===(n=l.components)||void 0===n?void 0:n[s])||void 0===i?void 0:i.buttons)&&void 0!==a?a:[]];p[d]=Object.assign(Object.assign({},p[d]),{url:"https://d.bik.ai/{{1}}",example:[o?t:"string"!=typeof t?t.defaultValue:""]});const r=Object.assign(Object.assign({},l.components[s]),{buttons:p}),c=Object.assign(Object.assign({},l.mapping),{buttons:o?["((customBtnPlaceholder))"]:"string"!=typeof t?[t.placeHolder]:void 0});l.mapping=c;const m=[...l.components];m[s]=r,l.components=m}}null==m||m(l)}function N(t,e,o){var n;const i=Object.assign({},c),a=null==i?void 0:i.components.findIndex((t=>"BUTTONS"===t.type));if(void 0!==a&&a>-1){const e=null===(n=null==i?void 0:i.components[a].buttons)||void 0===n?void 0:n.filter((t=>"QUICK_REPLY"===t.type));e&&(e[o]=Object.assign(Object.assign({},e[o]),{flowId:t.flowId,flowName:t.flowName}));const l=Object.assign(Object.assign({},i.components[a]),{buttons:e}),s=[...i.components];s[a]=l,i.components=s}null==m||m(i)}return t(l,Object.assign({style:{flexDirection:"column",maxHeight:460}},{children:[!!M&&e(i,{children:e(a,{whatsappSpecificPickerMeta:u,mediaComponent:M,updateTemplateImageUrl:function(t,e){var o;let n=Object.assign({},c);const i=null===(o=null==n?void 0:n.components)||void 0===o?void 0:o.findIndex((t=>{if("HEADER"===t.type&&"NONE"!==t.format&&"TEXT"!==t.format)return!0}));if(void 0!==i&&i>-1&&(null==n?void 0:n.components[i])){const o=Object.assign(Object.assign({},n.components[i]),{format:e,example:{header_handle:[t]}}),a=[...n.components];a[i]=o,n=Object.assign(Object.assign({},n),{components:a})}n.mapping&&(n.mapping=Object.assign(Object.assign({},n.mapping),{header:void 0})),null==m||m(Object.assign({},n))},template:c,variableListForImage:g})}),(U.length>0||S.length>0)&&e(d,{containerStyle:{paddingTop:M?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==B?void 0:B.map(((t,o)=>e(s,{originalVariableList:L,type:t.type,descriptionComponent:t.component,variableMapping:"HEADER"===t.type?c.mapping.header:c.mapping.body,showVariableModal:b,variableList:v},o))),(null===(f=null===(h=R[0])||void 0===h?void 0:h.component)||void 0===f?void 0:f.buttons)&&(null===(O=null===(T=null===(j=R[0])||void 0===j?void 0:j.component)||void 0===T?void 0:T.buttons)||void 0===O?void 0:O.length)>0&&e(d,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(x=null==L?void 0:L.buttons)||void 0===x?void 0:x.map(((t,o)=>{if("URL"===t.type)return e(p,{CTAoptions:null==u?void 0:u.CTAoptions,button:t,originalVariableList:L,updateSelectedURLTemplateBtn:k},`${o}`)})),(null===(E=null===(y=A[0])||void 0===y?void 0:y.component)||void 0===E?void 0:E.buttons)&&(null===(w=null===(C=null===(V=A[0])||void 0===V?void 0:V.component)||void 0===C?void 0:C.buttons)||void 0===w?void 0:w.length)>0&&e(d,{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"}),null===(I=null==L?void 0:L.buttons)||void 0===I?void 0:I.map(((t,o)=>{if("QUICK_REPLY"===t.type)return e(p,{QRBoptions:null==u?void 0:u.QRBoptions,button:t,originalVariableList:L,updateSelectedQRBTemplateBtn:N},`${o}`)}))]}))};export{r as default};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.359-beta.29",
3
+ "version": "0.0.359-beta.30",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",