@bikdotai/bik-component-library 0.0.788-beta.8 → 0.0.788-beta.9

package/dist/cjs/components/radioButton/RadioButton.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),s=require("./RadioButton.styled.js"),t=require("../TypographyStyle.js"),l=require("../../constants/Theme.js");const a=s=>{const t=i.useMemo((()=>(null==s?void 0:s.activeColor)||l.COLORS.background.positive.vibrant),[s.activeColor]),a=i.useMemo((()=>s.isDisabled?l.COLORS.content.inactive:s.isActive?t:l.COLORS.content.primary),[s.isDisabled,s.isActive,t]);return e.jsxs("svg",Object.assign({width:s.isSmall?"16":"20",height:s.isSmall?"16":"20",viewBox:s.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?6:9,stroke:a,strokeWidth:s.isSmall?1.5:2}),s.isActive&&e.jsx("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?3:5,fill:s.isDisabled?l.COLORS.content.inactive:t})]}))};exports.RadioButton=o=>{const[r,c]=i.useState(o.isActive||!1),[n,d]=i.useState(!1),[O,S]=i.useState(!1);i.useEffect((()=>{c(o.isActive)}),[o.isActive]);return e.jsxs(s.RadioButtonContainer,Object.assign({onClick:()=>{var e;if(!o.skipSelectingOff&&!o.isDisabled){const i=!r;c(i),null===(e=o.onValueChange)||void 0===e||e.call(o,i,o.value)}},onMouseEnter:()=>d(!o.skipHoverState),onMouseLeave:()=>d(!1),onMouseDown:()=>S(!o.skipHoverState),onMouseUp:()=>S(!1),style:o.caption?{alignItems:"flex-start"}:{}},{children:[e.jsx(s.RadioButtonIcon,Object.assign({checked:r,hovered:n,clicked:O,isDisabled:o.isDisabled||!1,size:o.size,style:o.caption?{margin:"2px 0"}:{}},{children:e.jsx(a,{isSmall:"SMALL"===o.size,isActive:r,isDisabled:o.isDisabled||!1,activeColor:o.activeColor})})),e.jsxs("div",{children:[o.label?o.boldOnChecked&&r||o.alwaysBold?e.jsx(t.TitleSmall,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):"SMALL"===o.size?e.jsx(t.BodyCaption,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):"MEDIUM"===o.labelSize?e.jsx(t.BodySecondary,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):e.jsx(t.BodyPrimary,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):e.jsx(e.Fragment,{}),o.caption&&e.jsx(t.BodyCaption,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.secondary},{children:o.caption}))]})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),s=require("./RadioButton.styled.js"),t=require("../TypographyStyle.js"),l=require("../../constants/Theme.js");const a=s=>{const t=i.useMemo((()=>(null==s?void 0:s.activeColor)||l.COLORS.background.positive.vibrant),[s.activeColor]),a=i.useMemo((()=>s.isDisabled?l.COLORS.content.inactive:s.isActive?t:l.COLORS.content.primary),[s.isDisabled,s.isActive,t]);return e.jsxs("svg",Object.assign({width:s.isSmall?"16":"20",height:s.isSmall?"16":"20",viewBox:s.isSmall?"0 0 16 16":"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg"},{children:[e.jsx("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?6:9,stroke:a,strokeWidth:s.isSmall?1.5:2}),s.isActive&&e.jsx("circle",{cx:s.isSmall?"8":"10",cy:s.isSmall?"8":"10",r:s.isSmall?3:5,fill:s.isDisabled?l.COLORS.content.inactive:t})]}))};exports.RadioButton=o=>{const[n,c]=i.useState(o.isActive||!1),[r,d]=i.useState(!1),[O,b]=i.useState(!1);i.useEffect((()=>{c(o.isActive)}),[o.isActive]);return e.jsxs(s.RadioButtonContainer,Object.assign({onClick:()=>{var e;if(!o.skipSelectingOff&&!o.isDisabled){const i=!n;c(i),null===(e=o.onValueChange)||void 0===e||e.call(o,i,o.value)}},onMouseEnter:()=>d(!o.skipHoverState),onMouseLeave:()=>d(!1),onMouseDown:()=>b(!o.skipHoverState),onMouseUp:()=>b(!1),style:o.caption?{alignItems:"flex-start"}:{}},{children:[e.jsx(s.RadioButtonIcon,Object.assign({checked:n,hovered:r,clicked:O,isDisabled:o.isDisabled||!1,size:o.size,style:o.caption?{margin:"2px 0"}:{}},{children:e.jsx(a,{isSmall:"SMALL"===o.size,isActive:n,isDisabled:o.isDisabled||!1,activeColor:o.activeColor})})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:o.gapBetweenBodyAndCaption||"0px"}},{children:[o.label?o.boldOnChecked&&n||o.alwaysBold?e.jsx(t.TitleSmall,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):"SMALL"===o.size?e.jsx(t.BodyCaption,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):"MEDIUM"===o.labelSize?e.jsx(t.BodySecondary,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):e.jsx(t.BodyPrimary,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.primary},{children:o.label})):e.jsx(e.Fragment,{}),o.caption&&e.jsx(t.BodyCaption,Object.assign({color:o.isDisabled?l.COLORS.text.disabled:l.COLORS.text.secondary},{children:o.caption}))]}))]}))};

package/dist/cjs/components/slider/slider.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("../../constants/Theme.js");exports.BikSlider=n=>{let{min:r=0,max:s=100,defaultValue:o,onChange:i,step:l=1,disabled:u=!1}=n;const c=void 0!==o?o:r,[b,d]=t.useState(c),[g,h]=t.useState(!1),[p,x]=t.useState(!1),[m,f]=t.useState(!1),v=t.useRef(null),w=t.useRef(null),k=(e=>({container:{position:"relative",marginTop:"30px",height:"8px",width:"100%",cursor:e?"not-allowed":"pointer",opacity:e?.5:1},track:{position:"absolute",top:0,left:0,right:0,height:"8px",backgroundColor:"#E0E0E0",borderRadius:"4px"},filledTrack:{position:"absolute",top:0,left:0,height:"8px",backgroundColor:a.COLORS.background.brand,borderRadius:"4px",transition:"width 0.1s ease"},thumb:{position:"absolute",top:"50%",width:"24px",height:"24px",backgroundColor:a.COLORS.background.brand,border:`2px solid ${a.COLORS.background.brand}`,borderRadius:"50%",transform:"translate(-50%, -50%)",cursor:e?"not-allowed":"grab",transition:"box-shadow 0.2s ease",outline:"none",zIndex:1},thumbDisabled:{cursor:"not-allowed"},valueLabel:{position:"absolute",bottom:"100%",left:"50%",marginBottom:"16px",width:"32px",height:"32px",backgroundColor:a.COLORS.background.brand,borderRadius:"50% 50% 50% 0",transform:"translate(0, 0) rotate(-45deg) scale(0)",transformOrigin:"bottom left",transition:"transform 0.2s ease",pointerEvents:"none",display:"flex",alignItems:"center",justifyContent:"center"},valueLabelVisible:{transform:"translate(0, 0) rotate(-45deg) scale(1)"},valueLabelText:{transform:"rotate(45deg)",color:"white",fontSize:"12px",lineHeight:1.2,fontWeight:500}}))(u);t.useEffect((()=>{d(void 0!==o?o:r)}),[o,r]);const j=t.useCallback((e=>{if(!v.current)return r;const t=v.current.getBoundingClientRect(),a=Math.max(0,Math.min(1,(e-t.left)/t.width)),n=r+a*(s-r),o=Math.round(n/l)*l;return Math.max(r,Math.min(s,o))}),[r,s,l]),O=t.useCallback((e=>{if(u)return;e.preventDefault(),h(!0),f(!0);const t=j(e.clientX);d(t);const a=new Event("change",{bubbles:!0});i(a,t)}),[u,j,i]),C=t.useCallback((e=>{if(!g||u)return;const t=j(e.clientX);d(t);const a=new Event("change",{bubbles:!0});i(a,t)}),[g,u,j,i]),L=t.useCallback((()=>{h(!1),f(!1)}),[]),E=t.useCallback((e=>{if(u)return;let t=b;switch(e.key){case"ArrowLeft":case"ArrowDown":t=Math.max(r,b-l);break;case"ArrowRight":case"ArrowUp":t=Math.min(s,b+l);break;case"Home":t=r;break;case"End":t=s;break;default:return}e.preventDefault(),d(t);const a=new Event("change",{bubbles:!0});i(a,t)}),[u,b,r,s,l,i]);t.useEffect((()=>{if(g)return document.addEventListener("mousemove",C),document.addEventListener("mouseup",L),()=>{document.removeEventListener("mousemove",C),document.removeEventListener("mouseup",L)}}),[g,C,L]);const M=(b-r)/(s-r)*100,y=isNaN(M)?0:Math.max(0,Math.min(100,M));return e.jsxs("div",Object.assign({ref:v,style:k.container,onMouseDown:O,role:"slider","aria-label":"bik slider","aria-valuemin":r,"aria-valuemax":s,"aria-valuenow":b,tabIndex:u?-1:0,onKeyDown:E},{children:[e.jsx("div",{style:k.track}),e.jsx("div",{style:Object.assign(Object.assign({},k.filledTrack),{width:`${y}%`})}),e.jsx("div",Object.assign({ref:w,style:(()=>{const e=Object.assign({},k.thumb);return u?Object.assign(Object.assign({},e),k.thumbDisabled):(g?(e.boxShadow="0px 0px 0px 8px rgba(115, 29, 207, 0.5)",e.cursor="grabbing"):p&&(e.boxShadow="0px 0px 0px 8px rgba(115, 29, 207, 0.08)"),e.left=`${y}%`,e)})(),onMouseEnter:()=>!u&&x(!0),onMouseLeave:()=>!u&&x(!1),onFocus:()=>!u&&f(!0),onBlur:()=>!u&&f(!1)},{children:e.jsx("div",Object.assign({style:(()=>{const e=Object.assign({},k.valueLabel);return m||p?Object.assign(Object.assign({},e),k.valueLabelVisible):e})()},{children:e.jsx("span",Object.assign({style:k.valueLabelText},{children:b}))}))}))]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("../../constants/Theme.js");exports.BikSlider=n=>{let{min:r=0,max:o=100,defaultValue:s,onChange:i,step:l=1,disabled:u=!1}=n;const b=void 0!==s?s:r,[c,d]=t.useState(b),[g,h]=t.useState(!1),[m,p]=t.useState(!1),[x,f]=t.useState(!1),v=t.useRef(null),k=t.useRef(null),w=t.useMemo((()=>(e=>({container:{position:"relative",marginTop:"30px",height:"8px",width:"100%",cursor:e?"not-allowed":"pointer",opacity:e?.5:1},track:{position:"absolute",top:0,left:0,right:0,height:"8px",backgroundColor:"#E0E0E0",borderRadius:"4px"},filledTrack:{position:"absolute",top:0,left:0,height:"8px",backgroundColor:a.COLORS.background.brand,borderRadius:"4px",transition:"width 0.1s ease"},filledTrackDragging:{position:"absolute",top:0,left:0,height:"8px",backgroundColor:a.COLORS.background.brand,borderRadius:"4px",transition:"none"},thumb:{position:"absolute",top:"50%",width:"24px",height:"24px",backgroundColor:a.COLORS.background.brand,border:`2px solid ${a.COLORS.background.brand}`,borderRadius:"50%",transform:"translate(-50%, -50%)",cursor:e?"not-allowed":"grab",transition:"box-shadow 0.2s ease",outline:"none",zIndex:1},thumbDisabled:{cursor:"not-allowed"},valueLabel:{position:"absolute",bottom:"100%",left:"50%",marginBottom:"16px",width:"32px",height:"32px",backgroundColor:a.COLORS.background.brand,borderRadius:"50% 50% 50% 0",transform:"translate(0, 0) rotate(-45deg) scale(0)",transformOrigin:"bottom left",transition:"transform 0.2s ease",pointerEvents:"none",display:"flex",alignItems:"center",justifyContent:"center"},valueLabelVisible:{transform:"translate(0, 0) rotate(-45deg) scale(1)"},valueLabelText:{transform:"rotate(45deg)",color:"white",fontSize:"12px",lineHeight:1.2,fontWeight:500}}))(u)),[u]);t.useEffect((()=>{d(void 0!==s?s:r)}),[s,r]);const O=t.useCallback((e=>{if(!v.current)return r;const t=v.current.getBoundingClientRect(),a=Math.max(0,Math.min(1,(e-t.left)/t.width)),n=r+a*(o-r),s=Math.round(n/l)*l;return Math.max(r,Math.min(o,s))}),[r,o,l]),j=t.useCallback((e=>{if(u)return;e.preventDefault(),h(!0),f(!0);const t=O(e.clientX);d(t);const a=new Event("change",{bubbles:!0});i(a,t)}),[u,O,i]),L=t.useCallback((e=>{if(!g||u)return;const t=O(e.clientX);d(t);const a=new Event("change",{bubbles:!0});i(a,t)}),[g,u,O,i]),C=t.useCallback((()=>{h(!1),f(!1)}),[]),M=t.useCallback((e=>{if(u)return;let t=c;switch(e.key){case"ArrowLeft":case"ArrowDown":t=Math.max(r,c-l);break;case"ArrowRight":case"ArrowUp":t=Math.min(o,c+l);break;case"Home":t=r;break;case"End":t=o;break;default:return}e.preventDefault(),d(t);const a=new Event("change",{bubbles:!0});i(a,t)}),[u,c,r,o,l,i]);t.useEffect((()=>{if(g)return document.addEventListener("mousemove",L),document.addEventListener("mouseup",C),()=>{document.removeEventListener("mousemove",L),document.removeEventListener("mouseup",C)}}),[g,L,C]);const E=(c-r)/(o-r)*100,R=isNaN(E)?0:Math.max(0,Math.min(100,E)),S=t.useMemo((()=>{const e=Object.assign({},w.thumb);return u?Object.assign(Object.assign({},e),w.thumbDisabled):(g?(e.boxShadow="0px 0px 0px 8px rgba(115, 29, 207, 0.5)",e.cursor="grabbing"):m&&(e.boxShadow="0px 0px 0px 8px rgba(115, 29, 207, 0.08)"),e.left=`${R}%`,e)}),[w.thumb,w.thumbDisabled,u,g,m,R]),y=t.useMemo((()=>{const e=Object.assign({},w.valueLabel);return x||m?Object.assign(Object.assign({},e),w.valueLabelVisible):e}),[w.valueLabel,w.valueLabelVisible,x,m]);return e.jsxs("div",Object.assign({ref:v,style:w.container,onMouseDown:j,role:"slider","aria-label":"bik slider","aria-valuemin":r,"aria-valuemax":o,"aria-valuenow":c,tabIndex:u?-1:0,onKeyDown:M},{children:[e.jsx("div",{style:w.track}),e.jsx("div",{style:Object.assign(Object.assign({},g?w.filledTrackDragging:w.filledTrack),{width:`${R}%`})}),e.jsx("div",Object.assign({ref:k,style:S,onMouseEnter:()=>!u&&p(!0),onMouseLeave:()=>!u&&p(!1),onFocus:()=>!u&&f(!0),onBlur:()=>!u&&f(!1)},{children:e.jsx("div",Object.assign({style:y},{children:e.jsx("span",Object.assign({style:w.valueLabelText},{children:c}))}))}))]}))};

package/dist/cjs/components/tag/Tag.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),n=require("../tooltips/Tooltip.js"),t=require("../TypographyStyle.js"),a=require("./model.js"),r=require("./Tag.styled.js"),s=require("./themes.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=c(i);const l=i=>{let{tagText:c,LeadingIcon:l,TrailingIcon:d,onLeadingIconClicked:g,leadingIconId:p,trailingIconId:j,onTrailingIconClicked:u,theme:b="light",type:m="neutral",variant:O="regular",version:h,cursor:x,alignIcon:y,noBorder:T,tagHtmlText:f,contentPadding:I,leadingIconTooltip:C,trailingIconTooltip:w,tagColor:v,numberOfLines:N}=i,k=c;const q=b;let L=m;a.ValidTagTypeMap[O][m]||(L="neutral"),"circle"===O&&"number"==typeof k&&k>99&&(k="99+");const B={height:"compressed"===O?12:16,width:"compressed"===O?12:16,color:s.getTagIconColor(b,L),style:{display:"block"}};return e.jsx(r.Tag,Object.assign({cursor:x,theme:q,type:m,variant:O,version:h,alignIcon:y,noBorder:T,contentPadding:I},{children:e.jsxs("div",Object.assign({className:"container"},{children:[l&&(C?e.jsx(n.Tooltip,Object.assign({},C,{children:e.jsx("button",Object.assign({className:"icon-leading",onClick:g,id:`${p}-wrapper`||"leading-icon-wrapper"},{children:o.default.createElement(l,Object.assign(Object.assign({},B),{id:p||"leading-icon"}))}))})):e.jsx("button",Object.assign({className:"icon-leading",onClick:g,id:`${p}-wrapper`||"leading-icon-wrapper"},{children:o.default.createElement(l,Object.assign(Object.assign({},B),{id:p||"leading-icon"}))}))),f&&("ai"===m&&"light"===b?e.jsx(t.AiBodyCaption,Object.assign({numberOfLines:N},{children:f})):e.jsx(t.BodyCaption,Object.assign({className:"text",numberOfLines:N},{children:f}))),!f&&""!==k&&("ai"===m&&"light"===b?e.jsx(t.AiBodyCaption,Object.assign({numberOfLines:N},{children:k})):e.jsx(t.BodyCaption,Object.assign({className:"text",color:v,numberOfLines:N},{children:k}))),d&&(w?e.jsx(n.Tooltip,Object.assign({},w,{children:e.jsx("button",Object.assign({className:"icon-trailing",onClick:u,id:`${j}-wrapper`||"trailing-icon-wrapper"},{children:o.default.createElement(d,Object.assign(Object.assign({},B),{id:j||"trailing-icon"}))}))})):e.jsx("button",Object.assign({className:"icon-trailing",onClick:u,id:`${j}-wrapper`||"trailing-icon-wrapper"},{children:o.default.createElement(d,Object.assign(Object.assign({},B),{id:j||"trailing-icon"}))})))]}))}))};l.displayName="Tag",exports.Tag=l;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("react"),n=require("../tooltips/Tooltip.js"),s=require("../TypographyStyle.js"),a=require("./model.js"),t=require("./Tag.styled.js"),r=require("./themes.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=c(i);const o=i=>{let{tagText:c,LeadingIcon:o,TrailingIcon:d,onLeadingIconClicked:g,leadingIconId:j,trailingIconId:b,onTrailingIconClicked:u,theme:p="light",type:m="neutral",variant:O="regular",version:h,cursor:x,alignIcon:y,noBorder:T,tagHtmlText:f,contentPadding:C,leadingIconTooltip:I,trailingIconTooltip:L,tagColor:B,numberOfLines:N,backgroundColor:k,borderRadius:w,size:v="regular"}=i,q=c;const A=p;let E=m;a.ValidTagTypeMap[O][m]||(E="neutral"),"circle"===O&&"number"==typeof q&&q>99&&(q="99+");const $={height:"compressed"===O?12:16,width:"compressed"===O?12:16,color:r.getTagIconColor(p,E),style:{display:"block"}};return e.jsx(t.Tag,Object.assign({cursor:x,theme:A,type:E,variant:O,version:h,alignIcon:y,noBorder:T,contentPadding:C,backgroundColor:k,borderRadius:w,size:v},{children:e.jsxs("div",Object.assign({className:"container"},{children:[o&&(I?e.jsx(n.Tooltip,Object.assign({},I,{children:e.jsx("button",Object.assign({className:"icon-leading",onClick:g,id:`${j}-wrapper`||"leading-icon-wrapper"},{children:l.default.createElement(o,Object.assign(Object.assign({},$),{id:j||"leading-icon"}))}))})):e.jsx("button",Object.assign({className:"icon-leading",onClick:g,id:`${j}-wrapper`||"leading-icon-wrapper"},{children:l.default.createElement(o,Object.assign(Object.assign({},$),{id:j||"leading-icon"}))}))),f&&("ai"===m&&"light"===p?"small"===v?e.jsx(s.AiBodyTiny,Object.assign({numberOfLines:N},{children:f})):e.jsx(s.AiBodyCaption,Object.assign({numberOfLines:N},{children:f})):"small"===v?e.jsx(s.BodyTiny,Object.assign({className:"text",numberOfLines:N},{children:f})):e.jsx(s.BodyCaption,Object.assign({className:"text",numberOfLines:N},{children:f}))),!f&&""!==q&&("ai"===m&&"light"===p?"small"===v?e.jsx(s.AiBodyTiny,Object.assign({numberOfLines:N},{children:q})):e.jsx(s.AiBodyCaption,Object.assign({numberOfLines:N},{children:q})):"small"===v?e.jsx(s.BodyTiny,Object.assign({className:"text",color:B,numberOfLines:N},{children:q})):e.jsx(s.BodyCaption,Object.assign({className:"text",color:B,numberOfLines:N},{children:q}))),d&&(L?e.jsx(n.Tooltip,Object.assign({},L,{children:e.jsx("button",Object.assign({className:"icon-trailing",onClick:u,id:`${b}-wrapper`||"trailing-icon-wrapper"},{children:l.default.createElement(d,Object.assign(Object.assign({},$),{id:b||"trailing-icon"}))}))})):e.jsx("button",Object.assign({className:"icon-trailing",onClick:u,id:`${b}-wrapper`||"trailing-icon-wrapper"},{children:l.default.createElement(d,Object.assign(Object.assign({},$),{id:b||"trailing-icon"}))})))]}))}))};o.displayName="Tag",exports.Tag=o;

package/dist/cjs/components/tag/Tag.styled.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var c=require("@emotion/styled/base"),l=require("./themes.js");function e(c){return c&&"object"==typeof c&&"default"in c?c:{default:c}}const d=e(c).default("div","production"===process.env.NODE_ENV?{target:"e930jd90"}:{target:"e930jd90",label:"Tag"})("cursor:",(c=>{var l;return null!==(l=c.cursor)&&void 0!==l?l:"default"}),";",(c=>"regular"===c.variant?"display: block;\n\t\t     min-height: 26px;\n\t\t":"min-height: 20px;")," .container{display:flex;align-items:",(c=>c.alignIcon?c.alignIcon:"center"),";gap:6px;padding:",(c=>l.getPadding(c.variant)),";padding:",(c=>c.contentPadding?c.contentPadding:l.getPadding(c.variant)),"px;background:",(c=>l.getBackgroundColor(c.theme,c.type)),";border-radius:",(c=>"regular"===c.variant?"4px":"12px"),";",(c=>!c.noBorder&&"light"===c.theme&&`border: ${"2.0"===c.version?.5:1}px solid ${l.generateBorder(c.type,c.theme)};`)," .text{color:",(c=>l.getTextColor(c.theme,c.type)),";}.icon-trailing{all:unset;display:flex;}.icon-leading{all:unset;display:flex;}}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy5zdHlsZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUU4QiIsImZpbGUiOiJUYWcuc3R5bGVkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgZ2VuZXJhdGVCb3JkZXIsIGdldEJhY2tncm91bmRDb2xvciwgZ2V0UGFkZGluZywgZ2V0VGV4dENvbG9yLCB9IGZyb20gJy4vdGhlbWVzJztcclxuZXhwb3J0IGNvbnN0IFRhZyA9IHN0eWxlZC5kaXYgYFxuXHRjdXJzb3I6ICR7KHByb3BzKSA9PiB7IHZhciBfYTsgcmV0dXJuIChfYSA9IHByb3BzLmN1cnNvcikgIT09IG51bGwgJiYgX2EgIT09IHZvaWQgMCA/IF9hIDogJ2RlZmF1bHQnOyB9fTtcblx0JHsocHJvcHMpID0+IHByb3BzLnZhcmlhbnQgPT09ICdyZWd1bGFyJ1xyXG4gICAgPyBgZGlzcGxheTogYmxvY2s7XG5cdFx0ICAgICBtaW4taGVpZ2h0OiAyNnB4O1xuXHRcdGBcclxuICAgIDogYG1pbi1oZWlnaHQ6IDIwcHg7YH1cblx0LmNvbnRhaW5lciB7XG5cdFx0ZGlzcGxheTogZmxleDtcblx0XHRhbGlnbi1pdGVtczogJHsocHJvcHMpID0+IChwcm9wcy5hbGlnbkljb24gPyBwcm9wcy5hbGlnbkljb24gOiAnY2VudGVyJyl9O1xuXHRcdGdhcDogNnB4O1xuXHRcdHBhZGRpbmc6ICR7KHByb3BzKSA9PiBnZXRQYWRkaW5nKHByb3BzLnZhcmlhbnQpfTtcblx0XHRwYWRkaW5nOiAkeyhwcm9wcykgPT4gcHJvcHMuY29udGVudFBhZGRpbmdcclxuICAgID8gcHJvcHMuY29udGVudFBhZGRpbmdcclxuICAgIDogZ2V0UGFkZGluZyhwcm9wcy52YXJpYW50KX1weDtcblx0XHRiYWNrZ3JvdW5kOiAkeyhwcm9wcykgPT4gZ2V0QmFja2dyb3VuZENvbG9yKHByb3BzLnRoZW1lLCBwcm9wcy50eXBlKX07XG5cblx0XHRib3JkZXItcmFkaXVzOiAkeyhwcm9wcykgPT4gKHByb3BzLnZhcmlhbnQgPT09ICdyZWd1bGFyJyA/ICc0cHgnIDogJzEycHgnKX07XG5cblx0XHQkeyhwcm9wcykgPT4gIXByb3BzLm5vQm9yZGVyICYmXHJcbiAgICBwcm9wcy50aGVtZSA9PT0gJ2xpZ2h0JyAmJlxyXG4gICAgYGJvcmRlcjogJHtwcm9wcy52ZXJzaW9uID09PSAnMi4wJyA/IDAuNSA6IDF9cHggc29saWQgJHtnZW5lcmF0ZUJvcmRlcihwcm9wcy50eXBlLCBwcm9wcy50aGVtZSl9O2B9XG5cblx0XHQudGV4dCB7XG5cdFx0XHRjb2xvcjogJHsocHJvcHMpID0+IGdldFRleHRDb2xvcihwcm9wcy50aGVtZSwgcHJvcHMudHlwZSl9O1xuXHRcdH1cblxuXHRcdC5pY29uLXRyYWlsaW5nIHtcblx0XHRcdGFsbDogdW5zZXQ7XG5cdFx0XHRkaXNwbGF5OiBmbGV4O1xuXHRcdH1cblxuXHRcdC5pY29uLWxlYWRpbmcge1xuXHRcdFx0YWxsOiB1bnNldDtcblx0XHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0fVxuXHR9XG5gO1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1UYWcuc3R5bGVkLmpzLm1hcCJdfQ== */"));exports.Tag=d;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var c=require("@emotion/styled/base"),g=require("./themes.js");function b(c){return c&&"object"==typeof c&&"default"in c?c:{default:c}}const I=b(c).default("div","production"===process.env.NODE_ENV?{target:"e930jd90"}:{target:"e930jd90",label:"Tag"})("cursor:",(c=>{var g;return null!==(g=c.cursor)&&void 0!==g?g:"default"}),";",(c=>"small"!==c.size&&("regular"===c.variant?"display: block;\n\t\t     min-height: 26px;\n\t\t":"min-height: 20px;"))," .container{display:flex;align-items:",(c=>c.alignIcon?c.alignIcon:"center"),";gap:6px;",(c=>"small"===c.size?"height: 16px; box-sizing: border-box;":"")," padding:",(c=>"small"===c.size?"2px 6px":c.contentPadding?`${c.contentPadding}px`:g.getPadding(c.variant)),";background:",(c=>{var b;return null!==(b=c.backgroundColor)&&void 0!==b?b:g.getBackgroundColor(c.theme,c.type)}),";border-radius:",(c=>void 0!==c.borderRadius?"number"==typeof c.borderRadius?`${c.borderRadius}px`:c.borderRadius:"regular"===c.variant?"4px":"12px"),";",(c=>!c.noBorder&&"light"===c.theme&&`border: ${"2.0"===c.version?.5:1}px solid ${g.generateBorder(c.type,c.theme)};`)," .text{color:",(c=>g.getTextColor(c.theme,c.type)),";}.icon-trailing{all:unset;display:flex;}.icon-leading{all:unset;display:flex;}}"+("production"===process.env.NODE_ENV?"":"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlRhZy5zdHlsZWQudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUU4QiIsImZpbGUiOiJUYWcuc3R5bGVkLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgZ2VuZXJhdGVCb3JkZXIsIGdldEJhY2tncm91bmRDb2xvciwgZ2V0UGFkZGluZywgZ2V0VGV4dENvbG9yLCB9IGZyb20gJy4vdGhlbWVzJztcclxuZXhwb3J0IGNvbnN0IFRhZyA9IHN0eWxlZC5kaXYgYFxuXHRjdXJzb3I6ICR7KHByb3BzKSA9PiB7IHZhciBfYTsgcmV0dXJuIChfYSA9IHByb3BzLmN1cnNvcikgIT09IG51bGwgJiYgX2EgIT09IHZvaWQgMCA/IF9hIDogJ2RlZmF1bHQnOyB9fTtcblx0JHsocHJvcHMpID0+IHByb3BzLnNpemUgIT09ICdzbWFsbCcgJiZcclxuICAgIChwcm9wcy52YXJpYW50ID09PSAncmVndWxhcidcclxuICAgICAgICA/IGBkaXNwbGF5OiBibG9jaztcblx0XHQgICAgIG1pbi1oZWlnaHQ6IDI2cHg7XG5cdFx0YFxyXG4gICAgICAgIDogYG1pbi1oZWlnaHQ6IDIwcHg7YCl9XG5cdC5jb250YWluZXIge1xuXHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0YWxpZ24taXRlbXM6ICR7KHByb3BzKSA9PiAocHJvcHMuYWxpZ25JY29uID8gcHJvcHMuYWxpZ25JY29uIDogJ2NlbnRlcicpfTtcblx0XHRnYXA6IDZweDtcblx0XHQkeyhwcm9wcykgPT4gcHJvcHMuc2l6ZSA9PT0gJ3NtYWxsJyA/ICdoZWlnaHQ6IDE2cHg7IGJveC1zaXppbmc6IGJvcmRlci1ib3g7JyA6ICcnfVxuXHRcdHBhZGRpbmc6ICR7KHByb3BzKSA9PiBwcm9wcy5zaXplID09PSAnc21hbGwnXHJcbiAgICA/ICcycHggNnB4J1xyXG4gICAgOiBwcm9wcy5jb250ZW50UGFkZGluZ1xyXG4gICAgICAgID8gYCR7cHJvcHMuY29udGVudFBhZGRpbmd9cHhgXHJcbiAgICAgICAgOiBnZXRQYWRkaW5nKHByb3BzLnZhcmlhbnQpfTtcblx0XHRiYWNrZ3JvdW5kOiAkeyhwcm9wcykgPT4geyB2YXIgX2E7IHJldHVybiAoX2EgPSBwcm9wcy5iYWNrZ3JvdW5kQ29sb3IpICE9PSBudWxsICYmIF9hICE9PSB2b2lkIDAgPyBfYSA6IGdldEJhY2tncm91bmRDb2xvcihwcm9wcy50aGVtZSwgcHJvcHMudHlwZSk7IH19O1xuXG5cdFx0Ym9yZGVyLXJhZGl1czogJHsocHJvcHMpID0+IHByb3BzLmJvcmRlclJhZGl1cyAhPT0gdW5kZWZpbmVkXHJcbiAgICA/IHR5cGVvZiBwcm9wcy5ib3JkZXJSYWRpdXMgPT09ICdudW1iZXInXHJcbiAgICAgICAgPyBgJHtwcm9wcy5ib3JkZXJSYWRpdXN9cHhgXHJcbiAgICAgICAgOiBwcm9wcy5ib3JkZXJSYWRpdXNcclxuICAgIDogcHJvcHMudmFyaWFudCA9PT0gJ3JlZ3VsYXInXHJcbiAgICAgICAgPyAnNHB4J1xyXG4gICAgICAgIDogJzEycHgnfTtcblxuXHRcdCR7KHByb3BzKSA9PiAhcHJvcHMubm9Cb3JkZXIgJiZcclxuICAgIHByb3BzLnRoZW1lID09PSAnbGlnaHQnICYmXHJcbiAgICBgYm9yZGVyOiAke3Byb3BzLnZlcnNpb24gPT09ICcyLjAnID8gMC41IDogMX1weCBzb2xpZCAke2dlbmVyYXRlQm9yZGVyKHByb3BzLnR5cGUsIHByb3BzLnRoZW1lKX07YH1cblxuXHRcdC50ZXh0IHtcblx0XHRcdGNvbG9yOiAkeyhwcm9wcykgPT4gZ2V0VGV4dENvbG9yKHByb3BzLnRoZW1lLCBwcm9wcy50eXBlKX07XG5cdFx0fVxuXG5cdFx0Lmljb24tdHJhaWxpbmcge1xuXHRcdFx0YWxsOiB1bnNldDtcblx0XHRcdGRpc3BsYXk6IGZsZXg7XG5cdFx0fVxuXG5cdFx0Lmljb24tbGVhZGluZyB7XG5cdFx0XHRhbGw6IHVuc2V0O1xuXHRcdFx0ZGlzcGxheTogZmxleDtcblx0XHR9XG5cdH1cbmA7XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPVRhZy5zdHlsZWQuanMubWFwIl19 */"));exports.Tag=I;

package/dist/cjs/components/template-context-mapper/TemplateContextMapper.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),l=require("react"),a=require("../../utils/StringUtils.js"),o=require("../../constants/Theme.js"),i=require("../modals/styledModal.js"),r=require("../template-preview/helpers/templateMiscHelper.js"),s=require("../template-preview/models/Channels.js"),n=require("../template-preview/models/WhatsAppTemplate.js"),d=require("./context/templateModalContext.js"),u=require("./modalElements/Footer.js"),c=require("./modalElements/TemplateAnalyticsComponent.js"),p=require("./modalElements/TemplateSelectModalContent.js"),v=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=m=>{var C,h,b,S,E,x,f,T;const{selectedTemplate:P,closeDialog:g,showVariableMapping:y,channel:I,htmlContent:D,templateVariables:L,onTemplateSelect:j,globalPlaceholders:w,showOnlyContent:A,whatsappSpecificPickerMeta:k,zIndex:M,showVariableModal:V,variableList:H,discountCode:N,setDiscountCode:O,onBackPress:q,enabledCustomText:B,variableListForImage:F,showSampleValues:_,disableEditVariable:W,pod:Y,extras:R,pickerConf:$,selectedCarouselProducts:z,disableEditExpiry:Q,cardWidth:U,onDeleteSelectedProducts:G,fileName:J,setFileName:K,hideDeviceContainerInPreview:X,maxCharLimit:Z,onDefaultVariableSelect:ee,skipDefaultVariableContent:te,disableDatePicker:le,disableCopyCode:ae,initialExpiryDateTime:oe,showDiscountCodeExpiryInfo:ie,footerButtonText:re,footerInfoText:se,templateAnalytics:ne}=m;l.useEffect((()=>{be(D)}),[D]);const de=r.determineCardIndex(I),ue=r.isItCarousal(I,P),ce=null==P?void 0:P.isProductCarouselType,[pe,ve]=l.useState(I===s.CHANNEL_TYPE.EMAIL||I==s.CHANNEL_TYPE.WEBPUSH||ue?"desktop":"mobile"),[me,Ce]=l.useState(!1),[he,be]=l.useState(D),[Se,Ee]=l.useState(!1),[xe,fe]=l.useState([]),[Te,Pe]=l.useState({}),[ge,ye]=l.useState(P),[Ie,De]=l.useState([]),[Le,je]=l.useState(null),[we,Ae]=l.useState(!1),[ke,Me]=l.useState(null!=L?L:[]),[Ve,He]=l.useState(!1),[Ne,Oe]=l.useState(ue?(null===(h=null===(C=null==ge?void 0:ge.mapping)||void 0===C?void 0:C.body)||void 0===h?void 0:h.length)?-1:0:-1),[qe,Be]=l.useState([]),[Fe,_e]=l.useState(void 0),We=l.useRef(null),[Ye,Re]=l.useState(!1),[$e,ze]=l.useState(!1),[Qe,Ue]=l.useState(!1),[Ge,Je]=l.useState(!0),[Ke,Xe]=l.useState(!0),[Ze,et]=l.useState({});l.useEffect((()=>{z?Be(z):ce&&Be([])}),[z]),l.useEffect((()=>{var e;if(!we&&ce&&(!z||0===Be.length)){const t=null===(e=null==ge?void 0:ge.components)||void 0===e?void 0:e[de].cards,l=[];null==t||t.forEach((e=>{var t;null===(t=null==e?void 0:e.components)||void 0===t||t.forEach((e=>{var t,a,o;"HEADER"===e.type&&l.push(null!==(o=null===(a=null===(t=e.example)||void 0===t?void 0:t.header_handle)||void 0===a?void 0:a[0])&&void 0!==o?o:"")}))})),De(l),Ae(!0)}}),[we]);const tt=l.useMemo((()=>v.convertPlaceholdersToBikDropdown(w)),[w]);return l.useEffect((()=>{_e(t.cloneDeep(H))}),[H]),(null==ne?void 0:ne.show)&&Ge&&ne.templateQuality&&Object.values(n.TEMPLATE_QUALITY).find((e=>e===String(ne.templateQuality)))?e.jsx(c.TemplateAnalyticsComponent,{headingTitle:null==ge?void 0:ge.label,headingSubtitle:I===s.CHANNEL_TYPE.WHATSAPP?`${a.default.capitaliseFirstLetterOfString(null!==(b=null==ge?void 0:ge.category)&&void 0!==b?b:"")} • ${null!==(S=null==ge?void 0:ge.templateCategory)&&void 0!==S?S:""}`:"",templateAnalytics:ne,analyticsData:ne.data,onClose:()=>{null==g||g(),Je(!1),Xe(!1)},onCancel:()=>{Je(!1),Xe(!1)},onProceed:()=>{Je(!1),Xe(!0)},templateId:(null==ge?void 0:ge.templateId)||""}):e.jsx(d.TemplateModalContext.Provider,Object.assign({value:{hideFooterButton:Qe,setHideFooterButton:Ue,hideCrossButton:$e,setHideCrossButton:ze,variableList:Fe,setVariableList:_e,variableCallback:Le,setVariableCallback:je,showVariablePicker:me,setShowVariablePicker:Ce,template:ge,setTemplate:ye,device:pe,setDevice:ve,display_content:he,setDisplayContent:be,originalVariableList:ke,setOriginalVariableList:Me,isError:Se,setIsError:Ee,channel:I,globalNormalizedPlaceholders:tt,templateSelectionTriggered:Ve,setTemplateSelectionTriggered:He,enabledCustomText:B,disableEditVariable:W,pod:Y,extras:R,isWhatsappCarousel:ue,selectedCarouselIndex:Ne,setSelectedCarouselIndex:Oe,isProductCarouselType:ce,templateErrorIndexes:Te,cardCount:ue?null===(x=null===(E=P.components)||void 0===E?void 0:E[de].cards)||void 0===x?void 0:x.length:void 0,errorIndexes:xe,setErrorIndexes:fe,pickerConf:$,carouselProducts:qe,setCarouselProducts:Be,disableEditExpiry:Q,cardWidth:U,cardImages:Ie,onDeleteSelectedProducts:G,hideDeviceContainerInPreview:X,sliderRef:We,isCarouselHovered:Ye,setIsCarouselHovered:Re,maxCharLimit:Z,ctaOptionsErrors:Ze,setCtaOptionsErrors:et,onDefaultVariableSelect:ee,disableDatePicker:le,disableCopyCode:ae,initialExpiryDateTime:oe,showDiscountCodeExpiryInfo:ie,cardIndex:de}},{children:A?e.jsx(p.default,{variableListFromProps:H,channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(i.StyledModal,Object.assign({hideCrossButton:$e,zIndex:M,centralContainerStyles:{width:ue?900:I===s.CHANNEL_TYPE.EMAIL&&y?1e3:800},open:Ke,onClose:()=>{Xe(!1),null==g||g()},headingTitle:null==ge?void 0:ge.label,headingSubtitle:I===s.CHANNEL_TYPE.WHATSAPP||r.isRCSChannel(I)?`${a.default.capitaliseFirstLetterOfString(null!==(f=null==ge?void 0:ge.category)&&void 0!==f?f:"")} • ${null!==(T=null==ge?void 0:ge.templateCategory)&&void 0!==T?T:""}`:"",onBackPress:()=>{if(null==ne?void 0:ne.show)return Je(!0),void Xe(!1);null==q||q()},modalHeaderStyles:{borderBottom:`1px solid ${o.COLORS.stroke.primary}`}},{children:[e.jsx(p.default,{variableListFromProps:H,showSampleValues:_,showVariableMapping:y,channel:I,whatsappSpecificPickerMeta:k,showVariableModal:V,discountCode:N,setDiscountCode:O,variableListForImage:F&&(null==F?void 0:F.length)>0?F:Fe,fileName:J,setFileName:e=>{null==K||K(e)},skipDefaultVariableContent:te}),j?e.jsx(u.default,{isWhatsappCarousel:null!=ue&&ue,onSelect:function(){var e;if((null==qe?void 0:qe.length)<1&&ce)return void Ee(!0);if(Object.keys(Ze).length>0&&Y!==n.POD.CHATBOT)return void Ee(!0);const t=null==j?void 0:j(ge,ke,null!=he?he:"",qe);Pe(null!==(e=null==t?void 0:t.templateErrorIndexes)&&void 0!==e?e:{body:[],buttons:[]}),(null==t?void 0:t.errorIndexes)||(null==t?void 0:t.error)?((null==t?void 0:t.errorIndexes)&&fe(t.errorIndexes),(null==t?void 0:t.error)&&Ee(!!(null==t?void 0:t.error))):He(!0)},footerButtonText:re,footerInfoText:se}):e.jsx(e.Fragment,{})]}))}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash/cloneDeep"),l=require("react"),a=require("../../utils/StringUtils.js"),o=require("../../constants/Theme.js"),i=require("../modals/styledModal.js"),r=require("../template-preview/helpers/templateMiscHelper.js"),s=require("../template-preview/models/Channels.js"),n=require("../template-preview/models/WhatsAppTemplate.js"),d=require("./context/templateModalContext.js"),u=require("./modalElements/Footer.js"),c=require("./modalElements/TemplateAnalyticsComponent.js"),p=require("./modalElements/TemplateSelectModalContent.js"),v=require("./utils/convertPlaceholdersToBikDropdown.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var C=m(t);exports.TemplateContextMapper=t=>{var m,h,b,S,f,E,x,T;const{selectedTemplate:P,closeDialog:g,showVariableMapping:y,channel:I,htmlContent:j,templateVariables:D,onTemplateSelect:L,globalPlaceholders:w,showOnlyContent:A,whatsappSpecificPickerMeta:k,zIndex:M,showVariableModal:V,variableList:H,discountCode:N,setDiscountCode:O,onBackPress:q,enabledCustomText:B,variableListForImage:F,showSampleValues:_,disableEditVariable:W,pod:Y,extras:R,pickerConf:$,selectedCarouselProducts:z,disableEditExpiry:Q,cardWidth:U,onDeleteSelectedProducts:G,fileName:J,setFileName:K,hideDeviceContainerInPreview:X,maxCharLimit:Z,onDefaultVariableSelect:ee,skipDefaultVariableContent:te,disableDatePicker:le,disableCopyCode:ae,initialExpiryDateTime:oe,showDiscountCodeExpiryInfo:ie,footerButtonText:re,footerInfoText:se,templateAnalytics:ne}=t;l.useEffect((()=>{be(j)}),[j]);const de=r.determineCardIndex(I),ue=r.isItCarousal(I,P),ce=null==P?void 0:P.isProductCarouselType,[pe,ve]=l.useState(I===s.CHANNEL_TYPE.EMAIL||I==s.CHANNEL_TYPE.WEBPUSH||ue?"desktop":"mobile"),[me,Ce]=l.useState(!1),[he,be]=l.useState(j),[Se,fe]=l.useState(!1),[Ee,xe]=l.useState([]),[Te,Pe]=l.useState({}),[ge,ye]=l.useState(P),[Ie,je]=l.useState([]),[De,Le]=l.useState(null),[we,Ae]=l.useState(!1),[ke,Me]=l.useState(null!=D?D:[]),[Ve,He]=l.useState(!1),[Ne,Oe]=l.useState(ue?(null===(h=null===(m=null==ge?void 0:ge.mapping)||void 0===m?void 0:m.body)||void 0===h?void 0:h.length)?-1:0:-1),[qe,Be]=l.useState([]),[Fe,_e]=l.useState(void 0),We=l.useRef(null),[Ye,Re]=l.useState(!1),[$e,ze]=l.useState(!1),[Qe,Ue]=l.useState(!1),[Ge,Je]=l.useState(!0),[Ke,Xe]=l.useState(!0),[Ze,et]=l.useState({});l.useEffect((()=>{z?Be(z):ce&&Be([])}),[z]),l.useEffect((()=>{var e;if(!we&&ce&&(!z||0===Be.length)){const t=null===(e=null==ge?void 0:ge.components)||void 0===e?void 0:e[de].cards,l=[];null==t||t.forEach((e=>{var t;null===(t=null==e?void 0:e.components)||void 0===t||t.forEach((e=>{var t,a,o;"HEADER"===e.type&&l.push(null!==(o=null===(a=null===(t=e.example)||void 0===t?void 0:t.header_handle)||void 0===a?void 0:a[0])&&void 0!==o?o:"")}))})),je(l),Ae(!0)}}),[we]);const tt=l.useMemo((()=>v.convertPlaceholdersToBikDropdown(w)),[w]);return l.useEffect((()=>{_e(C.default(H))}),[H]),(null==ne?void 0:ne.show)&&Ge&&ne.templateQuality&&Object.values(n.TEMPLATE_QUALITY).find((e=>e===String(ne.templateQuality)))?e.jsx(c.TemplateAnalyticsComponent,{headingTitle:null==ge?void 0:ge.label,headingSubtitle:I===s.CHANNEL_TYPE.WHATSAPP?`${a.default.capitaliseFirstLetterOfString(null!==(b=null==ge?void 0:ge.category)&&void 0!==b?b:"")} • ${null!==(S=null==ge?void 0:ge.templateCategory)&&void 0!==S?S:""}`:"",templateAnalytics:ne,analyticsData:ne.data,onClose:()=>{null==g||g(),Je(!1),Xe(!1)},onCancel:()=>{Je(!1),Xe(!1)},onProceed:()=>{Je(!1),Xe(!0)},templateId:(null==ge?void 0:ge.templateId)||""}):e.jsx(d.TemplateModalContext.Provider,Object.assign({value:{hideFooterButton:Qe,setHideFooterButton:Ue,hideCrossButton:$e,setHideCrossButton:ze,variableList:Fe,setVariableList:_e,variableCallback:De,setVariableCallback:Le,showVariablePicker:me,setShowVariablePicker:Ce,template:ge,setTemplate:ye,device:pe,setDevice:ve,display_content:he,setDisplayContent:be,originalVariableList:ke,setOriginalVariableList:Me,isError:Se,setIsError:fe,channel:I,globalNormalizedPlaceholders:tt,templateSelectionTriggered:Ve,setTemplateSelectionTriggered:He,enabledCustomText:B,disableEditVariable:W,pod:Y,extras:R,isWhatsappCarousel:ue,selectedCarouselIndex:Ne,setSelectedCarouselIndex:Oe,isProductCarouselType:ce,templateErrorIndexes:Te,cardCount:ue?null===(E=null===(f=P.components)||void 0===f?void 0:f[de].cards)||void 0===E?void 0:E.length:void 0,errorIndexes:Ee,setErrorIndexes:xe,pickerConf:$,carouselProducts:qe,setCarouselProducts:Be,disableEditExpiry:Q,cardWidth:U,cardImages:Ie,onDeleteSelectedProducts:G,hideDeviceContainerInPreview:X,sliderRef:We,isCarouselHovered:Ye,setIsCarouselHovered:Re,maxCharLimit:Z,ctaOptionsErrors:Ze,setCtaOptionsErrors:et,onDefaultVariableSelect:ee,disableDatePicker:le,disableCopyCode:ae,initialExpiryDateTime:oe,showDiscountCodeExpiryInfo:ie,cardIndex:de}},{children:A?e.jsx(p.default,{variableListFromProps:H,channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(i.StyledModal,Object.assign({hideCrossButton:$e,zIndex:M,centralContainerStyles:{width:ue?900:I===s.CHANNEL_TYPE.EMAIL&&y?1e3:800},open:Ke,onClose:()=>{Xe(!1),null==g||g()},headingTitle:null==ge?void 0:ge.label,headingSubtitle:I===s.CHANNEL_TYPE.WHATSAPP||r.isRCSChannel(I)?`${a.default.capitaliseFirstLetterOfString(null!==(x=null==ge?void 0:ge.category)&&void 0!==x?x:"")} • ${null!==(T=null==ge?void 0:ge.templateCategory)&&void 0!==T?T:""}`:"",onBackPress:()=>{if(null==ne?void 0:ne.show)return Je(!0),void Xe(!1);null==q||q()},modalHeaderStyles:{borderBottom:`1px solid ${o.COLORS.stroke.primary}`}},{children:[e.jsx(p.default,{variableListFromProps:H,showSampleValues:_,showVariableMapping:y,channel:I,whatsappSpecificPickerMeta:k,showVariableModal:V,discountCode:N,setDiscountCode:O,variableListForImage:F&&(null==F?void 0:F.length)>0?F:Fe,fileName:J,setFileName:e=>{null==K||K(e)},skipDefaultVariableContent:te}),L?e.jsx(u.default,{isWhatsappCarousel:null!=ue&&ue,onSelect:function(){var e;if((null==qe?void 0:qe.length)<1&&ce)return void fe(!0);if(Object.keys(Ze).length>0&&Y!==n.POD.CHATBOT)return void fe(!0);const t=null==L?void 0:L(ge,ke,null!=he?he:"",qe);Pe(null!==(e=null==t?void 0:t.templateErrorIndexes)&&void 0!==e?e:{body:[],buttons:[]}),(null==t?void 0:t.errorIndexes)||(null==t?void 0:t.error)?((null==t?void 0:t.errorIndexes)&&xe(t.errorIndexes),(null==t?void 0:t.error)&&fe(!!(null==t?void 0:t.error))):He(!0)},footerButtonText:re,footerInfoText:se}):e.jsx(e.Fragment,{})]}))}))};

package/dist/cjs/components/template-context-mapper/helpers/WebpushTemplateHelper.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../_virtual/_tslib.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../../constants/Theme.js"),require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var t=require("../../template-preview/models/WhatsAppTemplate.js");require("../../template-preview/models/Channels.js");var i=require("../../template-preview/constants/TemplateConstants.js"),l=require("../../../utils/variableUtils.js");exports.default=()=>{function n(e,t,i,n){const r=t.map(((t,r)=>{const u=a(t);if(n)return{variableName:t,isEditableVariable:!1,updatedValue:t,index:r,variableValue:t,type:"string"};const s=function(e,t,i){const n=i&&i.length?i:l.extractVariables(e);if(!n||!n.length)return[];const a=[];return n.forEach(((e,i)=>{const l=o(t,`{{${e}}}`);if(l){const{actualValue:e,defaultValue:t}=l,n="{{custom.text}}"===e||"{{custom.url}}"===e;a.push({editable:n,variableVal:t,editableDefaultValues:t,variableName:e,idx:i})}})),a}(u?t:i,e);if(s.length>0){const e=s[0];return{variableName:e.variableName,isEditableVariable:!0,updatedValue:(null==e?void 0:e.updatedValue)?null==e?void 0:e.updatedValue:u?e.variableName:t,index:r,variableValue:e.variableVal,type:"string"}}return null})).filter((e=>null!==e));return r}const a=e=>e.includes("{{")&&e.includes("}}"),r=(e,t)=>e&&e.length?e.flatMap(((e,i)=>{var n;return a(e)?e.includes("editableVariable")?(null===(n=null==t?void 0:t[i])||void 0===n?void 0:n.value)||e:l.extractVariables(e).map((e=>`{{${e}}}`))||[]:e})):[];const o=(e,t)=>{for(const i of e)for(const e in i.variables){const l=i.variables[e];if(l.actualValue===t||t.includes("editableVariable")&&l.actualValue.includes("custom.text"))return l}return null};return{processWebpushTemplate:function(o,u,s,d){var b,v,c,p,m,h,f,L;return e.__awaiter(this,void 0,void 0,(function*(){const e=Object.assign({},o);e.components=function(e){let t;if("string"==typeof e)try{t=JSON.parse(e)}catch(e){console.error("Error parsing webpush component JSON:",e),t={}}else t=e;return t}(e.components);const{components:{title:V,body:g,buttons:w,icon:y,image:_},webpushBroadcastConfig:C}=e;let x={title:r(null!==(b=null==C?void 0:C.title)&&void 0!==b?b:[]),body:r(null!==(v=null==C?void 0:C.body)&&void 0!==v?v:[],null==g?void 0:g.variables),buttonsW:null!==(c=null==C?void 0:C.buttons)&&void 0!==c?c:[]};if(!e.webpushBroadcastConfig){const t=null!==(p=null==g?void 0:g.text)&&void 0!==p?p:"string"==typeof g?g:"",n=w&&(null==w?void 0:w.length)?w.map((e=>(null==e?void 0:e.websiteLink)==i.CUSTOM_URL_PLACEHOLDER?null==e?void 0:e.redirectionLink:null==e?void 0:e.websiteLink)).filter((e=>void 0!==e)):[],a=l.extractVariables(t).map(((e,t)=>{var i,l;return e.includes("editableVariable")?(null===(l=null===(i=null==g?void 0:g.variables)||void 0===i?void 0:i[t])||void 0===l?void 0:l.value)||e:`{{${e}}}`}));x={title:l.extractVariables(V).map((e=>`{{${e}}}`)),body:a,buttonsW:[]};const r={title:null!==(m=x.title)&&void 0!==m?m:[],body:null!==(h=x.body)&&void 0!==h?h:[],buttons:n,icon:y?[y]:void 0,image:_?[_]:void 0,redirectionLink:(null==g?void 0:g.redirectionLink)?[null==g?void 0:g.redirectionLink]:[]};e.webpushBroadcastConfig=r}const W=w&&w.length?w.map(((e,l)=>({type:t.BUTTON_TYPE.URL,text:null==e?void 0:e.text,url:"https://d.bik.ai/{{1}}",example:x.buttonsW&&x.buttonsW.length?a(x.buttonsW[l])?[""]:[x.buttonsW[l]]:e.redirectionLink?[e.redirectionLink]:void 0,buttonVariable:x.buttonsW&&x.buttonsW.length?a(x.buttonsW[l])?x.buttonsW[l]:i.CUSTOM_URL_PLACEHOLDER_VAR:e.websiteLink?e.websiteLink==i.CUSTOM_URL_PLACEHOLDER?i.CUSTOM_URL_PLACEHOLDER_VAR:e.websiteLink:i.CUSTOM_URL_PLACEHOLDER_VAR,index:l}))):[],k={title:n(u,x.title,V,d),body:n(u,x.body,(null==g?void 0:g.text)||"",d),buttons:W};return{templateVariableMapping:{title:(null===(f=null==s?void 0:s.title)||void 0===f?void 0:f.length)?s.title:k.title,body:(null===(L=null==s?void 0:s.body)||void 0===L?void 0:L.length)?s.body:k.body,buttons:k.buttons,icon:[],header:[]},webpushBroadcastConfig:e.webpushBroadcastConfig,template:e}}))},isValidUrl:e=>{try{return new URL(e),!0}catch(e){return!1}}}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../../_virtual/_tslib.js"),e=require("../../template-preview/constants/TemplateConstants.js"),i=require("../../template-preview/models/WhatsAppTemplate.js"),l=require("../../../utils/variableUtils.js");exports.default=()=>{function n(t,e,i,n){const o=e.map(((e,o)=>{const u=a(e);if(n)return{variableName:e,isEditableVariable:!1,updatedValue:e,index:o,variableValue:e,type:"string"};const s=function(t,e,i){const n=i&&i.length?i:l.extractVariables(t);if(!n||!n.length)return[];const a=[];return n.forEach(((t,i)=>{const l=r(e,`{{${t}}}`);if(l){const{actualValue:t,defaultValue:e}=l,n="{{custom.text}}"===t||"{{custom.url}}"===t;a.push({editable:n,variableVal:e,editableDefaultValues:e,variableName:t,idx:i})}})),a}(u?e:i,t);if(s.length>0){const t=s[0];return{variableName:t.variableName,isEditableVariable:!0,updatedValue:(null==t?void 0:t.updatedValue)?null==t?void 0:t.updatedValue:u?t.variableName:e,index:o,variableValue:t.variableVal,type:"string"}}return null})).filter((t=>null!==t));return o}const a=t=>t.includes("{{")&&t.includes("}}"),o=(t,e)=>t&&t.length?t.flatMap(((t,i)=>{var n;return a(t)?t.includes("editableVariable")?(null===(n=null==e?void 0:e[i])||void 0===n?void 0:n.value)||t:l.extractVariables(t).map((t=>`{{${t}}}`))||[]:t})):[];const r=(t,e)=>{for(const i of t)for(const t in i.variables){const l=i.variables[t];if(l.actualValue===e||e.includes("editableVariable")&&l.actualValue.includes("custom.text"))return l}return null};return{processWebpushTemplate:function(r,u,s,d){var b,c,v,p,f,m,L,V;return t.__awaiter(this,void 0,void 0,(function*(){const t=Object.assign({},r);t.components=function(t){let e;if("string"==typeof t)try{e=JSON.parse(t)}catch(t){console.error("Error parsing webpush component JSON:",t),e={}}else e=t;return e}(t.components);const{components:{title:h,body:g,buttons:y,icon:_,image:x},webpushBroadcastConfig:C}=t;let w={title:o(null!==(b=null==C?void 0:C.title)&&void 0!==b?b:[]),body:o(null!==(c=null==C?void 0:C.body)&&void 0!==c?c:[],null==g?void 0:g.variables),buttonsW:null!==(v=null==C?void 0:C.buttons)&&void 0!==v?v:[]};if(!t.webpushBroadcastConfig){const i=null!==(p=null==g?void 0:g.text)&&void 0!==p?p:"string"==typeof g?g:"",n=y&&(null==y?void 0:y.length)?y.map((t=>(null==t?void 0:t.websiteLink)==e.CUSTOM_URL_PLACEHOLDER?null==t?void 0:t.redirectionLink:null==t?void 0:t.websiteLink)).filter((t=>void 0!==t)):[],a=l.extractVariables(i).map(((t,e)=>{var i,l;return t.includes("editableVariable")?(null===(l=null===(i=null==g?void 0:g.variables)||void 0===i?void 0:i[e])||void 0===l?void 0:l.value)||t:`{{${t}}}`}));w={title:l.extractVariables(h).map((t=>`{{${t}}}`)),body:a,buttonsW:[]};const o={title:null!==(f=w.title)&&void 0!==f?f:[],body:null!==(m=w.body)&&void 0!==m?m:[],buttons:n,icon:_?[_]:void 0,image:x?[x]:void 0,redirectionLink:(null==g?void 0:g.redirectionLink)?[null==g?void 0:g.redirectionLink]:[]};t.webpushBroadcastConfig=o}const E=y&&y.length?y.map(((t,l)=>({type:i.BUTTON_TYPE.URL,text:null==t?void 0:t.text,url:"https://d.bik.ai/{{1}}",example:w.buttonsW&&w.buttonsW.length?a(w.buttonsW[l])?[""]:[w.buttonsW[l]]:t.redirectionLink?[t.redirectionLink]:void 0,buttonVariable:w.buttonsW&&w.buttonsW.length?a(w.buttonsW[l])?w.buttonsW[l]:e.CUSTOM_URL_PLACEHOLDER_VAR:t.websiteLink?t.websiteLink==e.CUSTOM_URL_PLACEHOLDER?e.CUSTOM_URL_PLACEHOLDER_VAR:t.websiteLink:e.CUSTOM_URL_PLACEHOLDER_VAR,index:l}))):[],O={title:n(u,w.title,h,d),body:n(u,w.body,(null==g?void 0:g.text)||"",d),buttons:E};return{templateVariableMapping:{title:(null===(L=null==s?void 0:s.title)||void 0===L?void 0:L.length)?s.title:O.title,body:(null===(V=null==s?void 0:s.body)||void 0===V?void 0:V.length)?s.body:O.body,buttons:O.buttons,icon:[],header:[]},webpushBroadcastConfig:t.webpushBroadcastConfig,template:t}}))},isValidUrl:t=>{try{return new URL(t),!0}catch(t){return!1}}}};

package/dist/cjs/components/template-context-mapper/modalElements/Body.js

@@ -1,22 +1,22 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("../../curtain/CurtainHelper.js");var a=require("../../variable-picker-v3/model.js"),t=require("lodash"),i=require("react"),l=require("styled-components"),r=require("../../carousel-preview/CarouselPreview.js"),s=require("./EditWhatsAppCarouselTemplateV2.js"),o=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var n=require("../../../constants/Theme.js");require("../../template-preview/models/TemplateMeta.js"),require("../../template-preview/models/WhatsAppTemplate.js");var p=require("../../template-preview/models/Channels.js"),d=require("../../TypographyStyle.js"),u=require("../../variable-picker-v3/VariablePicker.js"),c=require("../context/templateModalContext.js"),h=require("../utils/constants.js"),m=require("../utils/getVariableNameEmail.js"),C=require("../utils/highlightFor.js"),v=require("./DesktopPreview.js"),P=require("./EditWebpushTemplate.js"),w=require("./EditWhatsAppTemplateV2.js"),E=require("./MobilePreview.js"),b=require("./VariableConnectorsPanel.js");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x=f(l);const A=x.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("../../curtain/CurtainHelper.js");var a=require("../../variable-picker-v3/model.js"),t=require("lodash/cloneDeep"),i=require("react"),l=require("styled-components"),r=require("../../carousel-preview/CarouselPreview.js"),o=require("./EditWhatsAppCarouselTemplateV2.js"),s=require("../../template-preview/TemplatePreview.js"),n=require("../../template-preview/models/Channels.js"),d=require("../../TypographyStyle.js"),p=require("../../variable-picker-v3/VariablePicker.js"),u=require("../../../constants/Theme.js"),c=require("../context/templateModalContext.js"),h=require("../utils/constants.js"),C=require("../utils/getVariableNameEmail.js"),m=require("../utils/highlightFor.js"),P=require("./DesktopPreview.js"),E=require("./EditWebpushTemplate.js"),v=require("./EditWhatsAppTemplateV2.js"),w=require("./MobilePreview.js"),b=require("./VariableConnectorsPanel.js");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var x=f(t),N=f(l);const g=N.default.div`
 	display: flex;
 	//	height: 100%;
-`,j=x.default.div`
+`,j=N.default.div`
 	max-width: 450px;
-	max-width: ${e=>e.channel===p.CHANNEL_TYPE.EMAIL?"400px":"450px"};
+	max-width: ${e=>e.channel===n.CHANNEL_TYPE.EMAIL?"400px":"450px"};
 
-	height: ${e=>e.channel===p.CHANNEL_TYPE.WHATSAPP?"500px":"475px"};
+	height: ${e=>e.channel===n.CHANNEL_TYPE.WHATSAPP?"500px":"475px"};
 	overflow-y: auto;
 	padding-bottom: 24px;
-	border-left: ${n.COLORS.stroke.primary} 1px solid;
-	border-top: ${e=>e.isWhatsappCarousel?`${n.COLORS.stroke.primary} 1px solid`:void 0};
+	border-left: ${u.COLORS.stroke.primary} 1px solid;
+	border-top: ${e=>e.isWhatsappCarousel?`${u.COLORS.stroke.primary} 1px solid`:void 0};
 	${e=>!e.showVariableMapping&&"width: 340px; height: 500px"};
-`,N=x.default.div`
+`,A=N.default.div`
 	padding: ${e=>e.isWhatsappCarousel?void 0:e.showOnlyContent?"16px 14px":"16px 32px"};
 	flex: 1;
 	height: ${e=>e.isWhatsappCarousel||e.hideDeviceContainerInPreview?"500px":"475px"};
 	overflow-y: auto;
-	background-image: ${e=>e.hideDeviceContainerInPreview&&e.channel===p.CHANNEL_TYPE.WHATSAPP?`url(${h.BACKGROUND_PREVIEW_IMAGE});`:"none"};
-	display: ${e=>!e.hideDeviceContainerInPreview||e.channel!==p.CHANNEL_TYPE.WHATSAPP&&e.channel!==p.CHANNEL_TYPE.RCS?"initial":"flex"};
+	background-image: ${e=>e.hideDeviceContainerInPreview&&e.channel===n.CHANNEL_TYPE.WHATSAPP?`url(${h.BACKGROUND_PREVIEW_IMAGE});`:"none"};
+	display: ${e=>!e.hideDeviceContainerInPreview||e.channel!==n.CHANNEL_TYPE.WHATSAPP&&e.channel!==n.CHANNEL_TYPE.RCS?"initial":"flex"};
 	align-items: flex-start;
-`;exports.default=l=>{const{showVariableMapping:h,showOnlyContent:f,whatsappSpecificPickerMeta:x,showVariableModal:T,discountCode:g,setDiscountCode:S,variableListForImage:L,showSampleValues:y,variableListFromProps:H,fileName:k,setFileName:V,skipDefaultVariableContent:_}=l,W=i.useRef(),q=i.useRef(),{variableList:M,setVariableList:D,variableCallback:O,showVariablePicker:Y,setShowVariablePicker:I,device:B,display_content:R,channel:F,template:$,setTemplate:G,isWhatsappCarousel:U,isProductCarouselType:K,hideDeviceContainerInPreview:z,onDefaultVariableSelect:J}=c.useTemplateModalContext();const Q=e=>{let a=0;for(;e;)a+=e.offsetTop,e=e.offsetParent;return a};return e.jsxs(A,{children:[e.jsx(N,Object.assign({showOnlyContent:f,showVariableMapping:h,isWhatsappCarousel:U,hideDeviceContainerInPreview:z,channel:F,skipDefaultVariableContent:_},{children:"mobile"===B?e.jsx(E.default,{ref:q,display_content:null!=R?R:"",channel:F,template:$,showSampleValues:y}):F!==p.CHANNEL_TYPE.WHATSAPP&&F!==p.CHANNEL_TYPE.RCS||!U?F===p.CHANNEL_TYPE.WEBPUSH?e.jsx(o.TemplatePreview,{showSampleValues:y,channel:F,hideHeader:!0,template:$}):F!==p.CHANNEL_TYPE.MESSAGE?e.jsx(v.default,{ref:W,channel:F,display_content:null!=R?R:"",showSampleValues:y}):e.jsx(e.Fragment,{}):e.jsx(r.CarouselPreview,{ref:W,channel:F,template:$,showSampleValues:y,isPreview:!1,showArrows:!0})})),(K||h)&&e.jsxs(j,Object.assign({channel:F,isWhatsappCarousel:U,showVariableMapping:!0},{children:[e.jsx("div",Object.assign({style:{height:"100%",width:"whatsapp"===F?428:400,display:Y?"block":"none"}},{children:e.jsx(u.VariablePicker,{hideHeaderCross:!0,showHeader:!0,showBackButton:!0,onBackButtonClick:()=>{D(t.cloneDeep(H)),I(!1)},onSelect:e=>{O(e),D(t.cloneDeep(H)),I(!1)},type:a.PickerType.EMBEDDED,data:null!=M?M:[],onDefaultVariableSelect:J,skipDefaultVariableContent:_},Math.random())})),e.jsx("div",Object.assign({style:{padding:"16px 14px",width:"whatsapp"===F||"webpush"==F||"rcs"==F?428:400,display:Y?"none":"block"}},{children:F!==p.CHANNEL_TYPE.WHATSAPP&&F!==(null===p.CHANNEL_TYPE||void 0===p.CHANNEL_TYPE?void 0:p.CHANNEL_TYPE.RCS)?F==p.CHANNEL_TYPE.WEBPUSH?e.jsx(P.default,{whatsappSpecificPickerMeta:x,template:$,onTemplateChange:e=>{null==G||G(e)},showVariableModal:T}):e.jsx(b.default,{onFocus:F===p.CHANNEL_TYPE.EMAIL?function(e){var a,t,i;const l=null===document||void 0===document?void 0:document.getElementById("mobile"===B?"template_html_mobile":"template_html_desktop"),r=m.getVariableNameForEmailByIndex(e+1),s=F===p.CHANNEL_TYPE.EMAIL?null===(a=null==l?void 0:l.contentWindow)||void 0===a?void 0:a.document.getElementById(r):document.getElementById(r),o=Q(s),d=null==s?void 0:s.offsetLeft;"desktop"===B?o&&W.current&&(null===(t=null==l?void 0:l.contentWindow)||void 0===t||t.scrollTo(null!=d?d:0,o),C.highlightFor(r,n.COLORS.background.warning.light,2,F,B)):o&&q.current&&(null===(i=null==l?void 0:l.contentWindow)||void 0===i||i.scrollTo(null!=d?d:0,o),C.highlightFor(r,n.COLORS.background.warning.light,2,F,B))}:void 0,showVariableModal:T,discountCode:g,setDiscountCode:S}):F!==p.CHANNEL_TYPE.WHATSAPP&&F!==p.CHANNEL_TYPE.RCS||!U?e.jsx(w.default,{whatsappSpecificPickerMeta:x,template:$,onTemplateChange:e=>{null==G||G(e)},showVariableModal:T,variableListForImage:L,discountCode:g,setDiscountCode:S,fileName:k,setFileName:V}):e.jsx(s.default,{whatsappSpecificPickerMeta:x,template:$,showVariableModal:T,variableListForImage:L,discountCode:g,setDiscountCode:S})}))]})),[p.CHANNEL_TYPE.WHATSAPP,p.CHANNEL_TYPE.SMS].includes(F)&&!h&&!K&&e.jsx(j,{children:e.jsx(d.BodySecondary,Object.assign({color:n.COLORS.content.secondary,style:{fontStyle:"italic"}},{children:"Click on ‘Select template’ below to use it"}))})]})};
+`;exports.default=t=>{const{showVariableMapping:l,showOnlyContent:h,whatsappSpecificPickerMeta:f,showVariableModal:N,discountCode:T,setDiscountCode:S,variableListForImage:L,showSampleValues:y,variableListFromProps:H,fileName:_,setFileName:V,skipDefaultVariableContent:k}=t,M=i.useRef(),q=i.useRef(),{variableList:W,setVariableList:D,variableCallback:O,showVariablePicker:Y,setShowVariablePicker:I,device:B,display_content:R,channel:F,template:$,setTemplate:G,isWhatsappCarousel:U,isProductCarouselType:K,hideDeviceContainerInPreview:z,onDefaultVariableSelect:J}=c.useTemplateModalContext();const Q=e=>{let a=0;for(;e;)a+=e.offsetTop,e=e.offsetParent;return a};return e.jsxs(g,{children:[e.jsx(A,Object.assign({showOnlyContent:h,showVariableMapping:l,isWhatsappCarousel:U,hideDeviceContainerInPreview:z,channel:F,skipDefaultVariableContent:k},{children:"mobile"===B?e.jsx(w.default,{ref:q,display_content:null!=R?R:"",channel:F,template:$,showSampleValues:y}):F!==n.CHANNEL_TYPE.WHATSAPP&&F!==n.CHANNEL_TYPE.RCS||!U?F===n.CHANNEL_TYPE.WEBPUSH?e.jsx(s.TemplatePreview,{showSampleValues:y,channel:F,hideHeader:!0,template:$}):F!==n.CHANNEL_TYPE.MESSAGE?e.jsx(P.default,{ref:M,channel:F,display_content:null!=R?R:"",showSampleValues:y}):e.jsx(e.Fragment,{}):e.jsx(r.CarouselPreview,{ref:M,channel:F,template:$,showSampleValues:y,isPreview:!1,showArrows:!0})})),(K||l)&&e.jsxs(j,Object.assign({channel:F,isWhatsappCarousel:U,showVariableMapping:!0},{children:[e.jsx("div",Object.assign({style:{height:"100%",width:"whatsapp"===F?428:400,display:Y?"block":"none"}},{children:e.jsx(p.VariablePicker,{hideHeaderCross:!0,showHeader:!0,showBackButton:!0,onBackButtonClick:()=>{D(x.default(H)),I(!1)},onSelect:e=>{O(e),D(x.default(H)),I(!1)},type:a.PickerType.EMBEDDED,data:null!=W?W:[],onDefaultVariableSelect:J,skipDefaultVariableContent:k},Math.random())})),e.jsx("div",Object.assign({style:{padding:"16px 14px",width:"whatsapp"===F||"webpush"==F||"rcs"==F?428:400,display:Y?"none":"block"}},{children:F!==n.CHANNEL_TYPE.WHATSAPP&&F!==(null===n.CHANNEL_TYPE||void 0===n.CHANNEL_TYPE?void 0:n.CHANNEL_TYPE.RCS)?F==n.CHANNEL_TYPE.WEBPUSH?e.jsx(E.default,{whatsappSpecificPickerMeta:f,template:$,onTemplateChange:e=>{null==G||G(e)},showVariableModal:N}):e.jsx(b.default,{onFocus:F===n.CHANNEL_TYPE.EMAIL?function(e){var a,t,i;const l=null===document||void 0===document?void 0:document.getElementById("mobile"===B?"template_html_mobile":"template_html_desktop"),r=C.getVariableNameForEmailByIndex(e+1),o=F===n.CHANNEL_TYPE.EMAIL?null===(a=null==l?void 0:l.contentWindow)||void 0===a?void 0:a.document.getElementById(r):document.getElementById(r),s=Q(o),d=null==o?void 0:o.offsetLeft;"desktop"===B?s&&M.current&&(null===(t=null==l?void 0:l.contentWindow)||void 0===t||t.scrollTo(null!=d?d:0,s),m.highlightFor(r,u.COLORS.background.warning.light,2,F,B)):s&&q.current&&(null===(i=null==l?void 0:l.contentWindow)||void 0===i||i.scrollTo(null!=d?d:0,s),m.highlightFor(r,u.COLORS.background.warning.light,2,F,B))}:void 0,showVariableModal:N,discountCode:T,setDiscountCode:S}):F!==n.CHANNEL_TYPE.WHATSAPP&&F!==n.CHANNEL_TYPE.RCS||!U?e.jsx(v.default,{whatsappSpecificPickerMeta:f,template:$,onTemplateChange:e=>{null==G||G(e)},showVariableModal:N,variableListForImage:L,discountCode:T,setDiscountCode:S,fileName:_,setFileName:V}):e.jsx(o.default,{whatsappSpecificPickerMeta:f,template:$,showVariableModal:N,variableListForImage:L,discountCode:T,setDiscountCode:S})}))]})),[n.CHANNEL_TYPE.WHATSAPP,n.CHANNEL_TYPE.SMS].includes(F)&&!l&&!K&&e.jsx(j,{children:e.jsx(d.BodySecondary,Object.assign({color:u.COLORS.content.secondary,style:{fontStyle:"italic"}},{children:"Click on ‘Select template’ below to use it"}))})]})};

package/dist/cjs/components/template-context-mapper/modalElements/DesktopPreview.js

@@ -1,20 +1,20 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("styled-components"),i=require("../../spinner/Spinner.js"),a=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var s=require("../../../constants/Theme.js");require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js"),require("../../template-preview/models/WhatsAppTemplate.js");var p=require("../../template-preview/models/Channels.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=l(r),o=l(t);const n=o.default.div`
-	background: ${s.COLORS.surface.standard};
-	border: 1px solid ${s.COLORS.stroke.primary};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("styled-components"),i=require("../../spinner/Spinner.js"),a=require("../../template-preview/TemplatePreview.js"),s=require("../../template-preview/models/Channels.js"),d=require("../../../constants/Theme.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=l(r),n=l(t);const p=n.default.div`
+	background: ${d.COLORS.surface.standard};
+	border: 1px solid ${d.COLORS.stroke.primary};
 	border-radius: 8px;
 	overflow-y: auto;
 	/* max-height: 420px; */
 	scroll-behavior: smooth;
 	height: 100%;
-`,u=o.default.div`
+`,u=n.default.div`
 	padding: 18px 24px 12px;
 	display: flex;
 	gap: 4px;
 	border-bottom-width: 1px;
-	border-bottom-color: ${s.COLORS.stroke.primary};
-`,m=o.default.div`
+	border-bottom-color: ${d.COLORS.stroke.primary};
+`,h=n.default.div`
 	width: 6px;
 	height: 6px;
 	background: #d9d9d9;
 	border-radius: 3px;
-`,h=d.default.forwardRef(((r,t)=>{let{display_content:s,showSampleValues:l}=r;return e.jsxs(n,Object.assign({ref:t},{children:[e.jsxs(u,{children:[e.jsx(m,{}),e.jsx(m,{}),e.jsx(m,{})]}),e.jsx("div",{children:s?e.jsx(a.TemplatePreview,{showSampleValues:l,channel:p.CHANNEL_TYPE.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:s,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}},hidePointerEvents:!0}):e.jsx("div",Object.assign({style:{padding:20}},{children:e.jsx(i.Spinner,{size:"small"})}))})]}))}));h.displayName="DesktopPreview",exports.default=h;
+`,m=o.default.forwardRef(((r,t)=>{let{display_content:d,showSampleValues:l}=r;return e.jsxs(p,Object.assign({ref:t},{children:[e.jsxs(u,{children:[e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{})]}),e.jsx("div",{children:d?e.jsx(a.TemplatePreview,{showSampleValues:l,channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:d,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}},hidePointerEvents:!0}):e.jsx("div",Object.assign({style:{padding:20}},{children:e.jsx(i.Spinner,{size:"small"})}))})]}))}));m.displayName="DesktopPreview",exports.default=m;

package/dist/cjs/components/template-context-mapper/modalElements/EditMediaModal.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/arrow_back.svg.js"),i=require("../../../assets/icons/info.svg.js");require("../../curtain/CurtainHelper.js");var s=require("../../variable-picker-v3/model.js"),a=require("react"),r=require("../../button/Button.js"),o=require("../../image-cropper/BikImageCropper.js");require("../../image-compress/ImageCompress.js"),require("../../states/StateComponent.js"),require("../../../_virtual/_tslib.js"),require("../../../constants/zindex.js"),require("../../modals/styledModal.js");var l=require("../../spinner/Spinner.js"),n=require("../../input-with-vars/InputWithVariables.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var d=require("../../../constants/Theme.js"),p=require("../../template-preview/models/TemplateMeta.js"),c=require("../../template-preview/models/WhatsAppTemplate.js");require("../../template-preview/models/Channels.js");var u=require("../../TypographyStyle.js"),g=require("../../../utils/validator.js"),m=require("../../../assets/icons/file.svg.js"),j=require("../../../assets/icons/filePdf.svg.js"),h=require("../../../assets/icons/image.svg.js"),x=require("../../../assets/icons/upload.svg.js"),E=require("../context/templateModalContext.js"),v=require("../utils/validateIsUrl.js");exports.default=b=>{let{setOpenEditMedia:f,mediaComponentFormat:y,variableListForImage:T,openEditMedia:C,uploadMedia:M,fileRef:A,useEditWhatsappTemplateMediaResponse:q,skipAddVariable:I}=b;const{pod:D,setHideCrossButton:O,setHideFooterButton:S}=E.useTemplateModalContext(),[P,R]=a.useState(""),[w,k]=a.useState(void 0),[H,L]=a.useState(!1),[_,B]=a.useState("");let V;if(a.useEffect((()=>(S(!0),()=>{S(!1)})),[]),a.useEffect((()=>{const e=document.querySelector('[class*="ModalWrapper"]');e&&k(e)}),[q.loading]),V=y===p.HEADER_TYPES.IMAGE?"image/png, image/jpeg":y===p.HEADER_TYPES.VIDEO?"video/mp4":"application/pdf",!C)return e.jsx(e.Fragment,{});const U=()=>y===p.HEADER_TYPES.IMAGE?"Image":y===p.HEADER_TYPES.VIDEO?"Video":"Document";return e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",gap:"10px",alignItems:"center",marginBottom:"16px"}},{children:[e.jsx(t.default,{onClick:e=>{e.stopPropagation(),f(!1),R("")},style:{cursor:"pointer"},width:16,height:16}),e.jsx(u.TitleRegular,{children:"Update Media"})]})),e.jsxs("div",Object.assign({style:{position:"relative",padding:16,borderRadius:4,border:H?`1px dashed ${d.DEFAULT_THEME.colorsV2.stroke.negative.vibrant}`:`1px dashed ${d.DEFAULT_THEME.colorsV2.stroke.primary}`,backgroundColor:d.DEFAULT_THEME.colorsV2.surface.subdued,width:"100%",height:"100%",alignItems:"center",display:q.loading?"flex":"initial"}},{children:[e.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:"center",flexDirection:"column",alignItems:"center",gap:16}},{children:[q.loading?e.jsx(l.PureSpinner,{width:"40px",height:"40px",color:d.COLORS.content.brand}):e.jsx("div",Object.assign({style:{height:64,width:64,borderRadius:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:d.DEFAULT_THEME.colorsV2.background.base}},{children:y===p.HEADER_TYPES.IMAGE?e.jsx(h.default,{width:40,height:40}):y===p.HEADER_TYPES.VIDEO?e.jsx(m.default,{width:40,height:40}):e.jsx(j.default,{width:40,height:40})})),e.jsx(u.TitleMedium,{children:q.loading?"Upload in progress...":y===p.HEADER_TYPES.IMAGE?"Upload an image":y===p.HEADER_TYPES.VIDEO?"Upload a video":"Upload a document"}),e.jsx(u.BodySecondary,Object.assign({color:d.COLORS.content.secondary},{children:q.loading?`Your ${y.toLowerCase()} is getting loaded. This may take a couple of minutes.`:y===p.HEADER_TYPES.IMAGE?"JPEG/ PNG format • Max 5MB":y===p.HEADER_TYPES.VIDEO?"MP4 format video • Max 16MB":"PDF format document • Max 100MB"}))]})),!q.loading&&e.jsxs(e.Fragment,{children:[e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"6px"}},{children:e.jsx(n.InputWithVariables,{labelText:`${U()} URL`,onPickerToggle:e=>{O(!!e)},pickerType:s.PickerType.EMBEDDED,portalElement:null!=w?w:document.body,noMaxCharCheck:!0,allowMix:!1,onChange:e=>{B(e.actualValue),L(!1)},showVarHeader:!0,varHeaderText:"Select variable",errorMessage:P,prevVariable:{actualValue:"",variableType:"string"},variablesList:T,placeHolder:I?"Enter URL":"Enter URL/Add variable",showAddButton:D!==c.POD.CAMPAIGN||!I&&y===p.HEADER_TYPES.IMAGE})})),e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:"4px",marginBottom:"12px"}},{children:[e.jsx("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}}),e.jsx(u.BodyCaption,{children:"Or upload media from device"}),e.jsx("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}})]})),e.jsx("div",Object.assign({style:{display:"flex",width:"100%"}},{children:e.jsx(r.Button,{matchParentWidth:!0,buttonText:"Upload",buttonType:"dashBold",LeadingIcon:x.default,onClick:()=>{M(),L(!1)},size:"medium"})}))]}),H&&e.jsxs("div",Object.assign({style:{position:"absolute",display:"flex",alignItems:"center",bottom:-24,left:0,gap:4}},{children:[e.jsx(i.default,{width:16,height:16,color:d.COLORS.content.negative}),e.jsx(u.BodyCaption,Object.assign({style:{color:d.COLORS.content.negative}},{children:`Select ${U()}`}))]}))]})),!q.loading&&e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end",marginTop:8}},{children:e.jsx(r.Button,{buttonText:`Add ${U()}`,onClick:()=>{_?g.validateURL(_)||v.isVariable(_)?(M(_),f(!1),R(""),L(!1)):R("Enter valid URL"):L(!0)}})})),e.jsx("input",{ref:A,style:{display:"none"},type:"file",onChange:q.handleImageUpload,accept:V}),!!q.selectedImage&&e.jsx(o.BikImageCropper,{aspectRatio:15/8,src:q.selectedImage,onCropComplete:q.onCropComplete,onCancel:()=>{q.setLoading(!1),q.setSelectedImage(""),A.current&&(A.current.value="")}})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/arrow_back.svg.js"),i=require("../../../assets/icons/info.svg.js");require("../../curtain/CurtainHelper.js");var a=require("../../variable-picker-v3/model.js"),s=require("react"),r=require("../../button/Button.js"),o=require("../../image-cropper/BikImageCropper.js"),n=require("../../input-with-vars/InputWithVariables.js"),l=require("../../spinner/Spinner.js"),d=require("../../template-preview/models/TemplateMeta.js"),c=require("../../template-preview/models/WhatsAppTemplate.js"),p=require("../../TypographyStyle.js"),u=require("../../../utils/validator.js"),g=require("../../../constants/Theme.js"),x=require("../../../assets/icons/file.svg.js"),E=require("../../../assets/icons/filePdf.svg.js"),m=require("../../../assets/icons/image.svg.js"),h=require("../../../assets/icons/upload.svg.js"),j=require("../context/templateModalContext.js"),b=require("../utils/validateIsUrl.js");exports.default=f=>{let{setOpenEditMedia:y,mediaComponentFormat:v,variableListForImage:T,openEditMedia:C,uploadMedia:M,fileRef:I,useEditWhatsappTemplateMediaResponse:A,skipAddVariable:D}=f;const{pod:O,setHideCrossButton:S,setHideFooterButton:R}=j.useTemplateModalContext(),[P,k]=s.useState(""),[q,H]=s.useState(void 0),[B,w]=s.useState(!1),[L,V]=s.useState("");let _;if(s.useEffect((()=>(R(!0),()=>{R(!1)})),[]),s.useEffect((()=>{const e=document.querySelector('[class*="ModalWrapper"]');e&&H(e)}),[A.loading]),_=v===d.HEADER_TYPES.IMAGE?"image/png, image/jpeg":v===d.HEADER_TYPES.VIDEO?"video/mp4":"application/pdf",!C)return e.jsx(e.Fragment,{});const U=()=>v===d.HEADER_TYPES.IMAGE?"Image":v===d.HEADER_TYPES.VIDEO?"Video":"Document";return e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",gap:"10px",alignItems:"center",marginBottom:"16px"}},{children:[e.jsx(t.default,{onClick:e=>{e.stopPropagation(),y(!1),k("")},style:{cursor:"pointer"},width:16,height:16}),e.jsx(p.TitleRegular,{children:"Update Media"})]})),e.jsxs("div",Object.assign({style:{position:"relative",padding:16,borderRadius:4,border:B?`1px dashed ${g.DEFAULT_THEME.colorsV2.stroke.negative.vibrant}`:`1px dashed ${g.DEFAULT_THEME.colorsV2.stroke.primary}`,backgroundColor:g.DEFAULT_THEME.colorsV2.surface.subdued,width:"100%",height:"100%",alignItems:"center",display:A.loading?"flex":"initial"}},{children:[e.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:"center",flexDirection:"column",alignItems:"center",gap:16}},{children:[A.loading?e.jsx(l.PureSpinner,{width:"40px",height:"40px",color:g.COLORS.content.brand}):e.jsx("div",Object.assign({style:{height:64,width:64,borderRadius:"100%",display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:g.DEFAULT_THEME.colorsV2.background.base}},{children:v===d.HEADER_TYPES.IMAGE?e.jsx(m.default,{width:40,height:40}):v===d.HEADER_TYPES.VIDEO?e.jsx(x.default,{width:40,height:40}):e.jsx(E.default,{width:40,height:40})})),e.jsx(p.TitleMedium,{children:A.loading?"Upload in progress...":v===d.HEADER_TYPES.IMAGE?"Upload an image":v===d.HEADER_TYPES.VIDEO?"Upload a video":"Upload a document"}),e.jsx(p.BodySecondary,Object.assign({color:g.COLORS.content.secondary},{children:A.loading?`Your ${v.toLowerCase()} is getting loaded. This may take a couple of minutes.`:v===d.HEADER_TYPES.IMAGE?"JPEG/ PNG format • Max 5MB":v===d.HEADER_TYPES.VIDEO?"MP4 format video • Max 16MB":"PDF format document • Max 100MB"}))]})),!A.loading&&e.jsxs(e.Fragment,{children:[e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"6px"}},{children:e.jsx(n.InputWithVariables,{labelText:`${U()} URL`,onPickerToggle:e=>{S(!!e)},pickerType:a.PickerType.EMBEDDED,portalElement:null!=q?q:document.body,noMaxCharCheck:!0,allowMix:!1,onChange:e=>{V(e.actualValue),w(!1)},showVarHeader:!0,varHeaderText:"Select variable",errorMessage:P,prevVariable:{actualValue:"",variableType:"string"},variablesList:T,placeHolder:D?"Enter URL":"Enter URL/Add variable",showAddButton:O!==c.POD.CAMPAIGN||!D&&v===d.HEADER_TYPES.IMAGE})})),e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",justifyContent:"space-between",gap:"4px",marginBottom:"12px"}},{children:[e.jsx("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}}),e.jsx(p.BodyCaption,{children:"Or upload media from device"}),e.jsx("hr",{style:{height:"2px",flex:.5,backgroundColor:"black"}})]})),e.jsx("div",Object.assign({style:{display:"flex",width:"100%"}},{children:e.jsx(r.Button,{matchParentWidth:!0,buttonText:"Upload",buttonType:"dashBold",LeadingIcon:h.default,onClick:()=>{M(),w(!1)},size:"medium"})}))]}),B&&e.jsxs("div",Object.assign({style:{position:"absolute",display:"flex",alignItems:"center",bottom:-24,left:0,gap:4}},{children:[e.jsx(i.default,{width:16,height:16,color:g.COLORS.content.negative}),e.jsx(p.BodyCaption,Object.assign({style:{color:g.COLORS.content.negative}},{children:`Select ${U()}`}))]}))]})),!A.loading&&e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end",marginTop:8}},{children:e.jsx(r.Button,{buttonText:`Add ${U()}`,onClick:()=>{L?u.validateURL(L)||b.isVariable(L)?(M(L),y(!1),k(""),w(!1)):k("Enter valid URL"):w(!0)}})})),e.jsx("input",{ref:I,style:{display:"none"},type:"file",onChange:A.handleImageUpload,accept:_}),!!A.selectedImage&&e.jsx(o.BikImageCropper,{aspectRatio:15/8,src:A.selectedImage,onCropComplete:A.onCropComplete,onCancel:()=>{A.setLoading(!1),A.setSelectedImage(""),I.current&&(I.current.value="")}})]})};

package/dist/cjs/components/template-context-mapper/modalElements/EditWebpushTemplate.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash"),a=require("react"),i=require("../../input/Input.js"),n=require("../../template-preview/models/Channels.js"),l=require("../../template-preview/models/TemplateMeta.js"),o=require("../context/templateModalContext.js"),s=require("../helpers/WebpushTemplateHelper.js"),d=require("../utils/getDataFromTemplateComponent.js"),r=require("./EditMediaModal.js"),p=require("./EditMediaV2.js"),u=require("./EditMediaV2.style.js"),c=require("./useEditWhtasappTemplateMedia.js"),m=require("./VariableConnectorsPanel.js"),h=require("./VariableConnectorWhatsApp.js"),b=require("./VariableEditorHeader.js"),g=require("./WhatsAppTemplateCardButtonV2.js");exports.default=f=>{let{template:M,onTemplateChange:E,whatsappSpecificPickerMeta:j,showVariableModal:C}=f;var T,x,v;const[V,L]=a.useState(null),[y,I]=a.useState(null),{variableList:w,disableEditVariable:O,originalVariableList:q,setOriginalVariableList:R}=o.useTemplateModalContext(),{processWebpushTemplate:A,isValidUrl:S}=s.default(),[k,B]=a.useState(null),[D,W]=a.useState(null),[H,P]=a.useState(null);a.useEffect((()=>{w&&A(M,w,q,O).then((e=>{let{templateVariableMapping:t,template:a,webpushBroadcastConfig:i}=e;L(t),null==R||R(t),null==E||E(Object.assign({},a)),I(i)}))}),[w,O]);const{descriptionComponents:F,bodyVariables:U,titleVariables:_}=a.useMemo((()=>{if(V&&y){const e=d.getAllDataFromWebpushTemplateComponent(y,V);return k||B(e.iconImage),D||W(e.bannerImage),H||P(e.redirectionLink),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[V,y]),{uploadMediaLink:N,uploadMediaFiles:Y,validateMimeType:G}=j,$=a.useRef(null),K=c.useEditWhatsappTemplateMedia({uploadMediaLink:N,uploadMediaFiles:Y,updateTemplateImageUrl:e=>J(e,"icon"),validateMimeType:G,mediaComponent:k,fileRef:$}),z=c.useEditWhatsappTemplateMedia({uploadMediaLink:N,uploadMediaFiles:Y,updateTemplateImageUrl:e=>J(e,"image"),validateMimeType:G,mediaComponent:D,fileRef:$});function J(e,a){const i=Object.assign({},M),n=t.cloneDeep(i);"icon"===a?(n.webpushBroadcastConfig.icon=[e],B([e])):"image"===a&&(n.webpushBroadcastConfig.image=[e],W([e])),null==E||E(Object.assign({},n))}function Q(e,a,i){var n;const l=Object.assign({},M),o=t.cloneDeep(l),s="custom"===a&&"string"==typeof e,d=null===(n=null==o?void 0:o.webpushBroadcastConfig)||void 0===n?void 0:n.buttons;if(d&&d.length>0){d[i]=s?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},o.webpushBroadcastConfig),{buttons:d});o.webpushBroadcastConfig=t}null==E||E(o)}const X=K.openEditMedia?K:z.openEditMedia?z:null;if(X)return e.jsx(m.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(r.default,{mediaComponentFormat:l.HEADER_TYPES.IMAGE,uploadMedia:X.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:X,setOpenEditMedia:X.setOpenEditMedia,openEditMedia:X.openEditMedia,editIconRef:X.editIconRef,fileRef:$,skipAddVariable:!0})}));return e.jsxs(m.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[k&&k.length?e.jsx(u.EditTemplateMediaContainer,{children:e.jsx(p.default,{imageName:k,handleImageChange:K.handleImageChange,mediaType:l.HEADER_TYPES.IMAGE,error:K.error,isLoading:K.loading,setOpenEditMedia:K.setOpenEditMedia})}):null,D&&D.length?e.jsx(u.EditTemplateMediaContainer,{children:e.jsx(p.default,{imageName:D,handleImageChange:z.handleImageChange,mediaType:l.HEADER_TYPES.IMAGE,error:z.error,isLoading:z.loading,setOpenEditMedia:z.setOpenEditMedia})}):null,(null==U?void 0:U.length)||(null==_?void 0:_.length)?e.jsx(b.default,{containerStyle:{paddingTop: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,null==F?void 0:F.map(((t,a)=>e.jsx(h.default,{originalVariableList:V,originalList:q,channel:n.CHANNEL_TYPE.WEBPUSH,type:t.type,descriptionComponent:t.component,showVariableModal:C},a))),H&&H.length?e.jsx("div",Object.assign({style:{padding:"16px 14px"}},{children:e.jsx(i.Input,{labelText:"Redirection Link",id:"redirection-link",value:H[0].replace("https://",""),errorMessage:S(H[0])?"":"Please enter a valid URL",maxCharLimit:2e3,noKeyDownChange:!0,state:O?"disabled":"none",prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:e=>{!function(e){var a;const i=`https://${e}`;P([i]);const n=t.cloneDeep(M);(null===(a=n.webpushBroadcastConfig)||void 0===a?void 0:a.redirectionLink)&&(n.webpushBroadcastConfig.redirectionLink=[i]),null==E||E(Object.assign({},n))}(e)}})})):e.jsx(e.Fragment,{}),(null===(x=null===(T=null==V?void 0:V.buttons)||void 0===T?void 0:T.filter((e=>"URL"===e.type)))||void 0===x?void 0:x.length)>0&&e.jsx(b.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(v=null==V?void 0:V.buttons)||void 0===v?void 0:v.map(((t,a)=>e.jsx(g.default,{variableListIndex:a,CTAoptions:null==j?void 0:j.CTAoptions,button:t,currentVariableList:V,updateSelectedURLTemplateBtn:Q},`${a}`)))]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash/cloneDeep"),a=require("react"),i=require("../../input/Input.js"),n=require("../../template-preview/models/Channels.js"),l=require("../../template-preview/models/TemplateMeta.js"),o=require("../context/templateModalContext.js"),s=require("../helpers/WebpushTemplateHelper.js"),d=require("../utils/getDataFromTemplateComponent.js"),r=require("./EditMediaModal.js"),u=require("./EditMediaV2.js"),p=require("./EditMediaV2.style.js"),c=require("./useEditWhtasappTemplateMedia.js"),m=require("./VariableConnectorsPanel.js"),h=require("./VariableConnectorWhatsApp.js"),b=require("./VariableEditorHeader.js"),g=require("./WhatsAppTemplateCardButtonV2.js");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var M=f(t);exports.default=t=>{let{template:f,onTemplateChange:E,whatsappSpecificPickerMeta:j,showVariableModal:C}=t;var T,v,x;const[V,L]=a.useState(null),[y,I]=a.useState(null),{variableList:w,disableEditVariable:O,originalVariableList:q,setOriginalVariableList:R}=o.useTemplateModalContext(),{processWebpushTemplate:A,isValidUrl:S}=s.default(),[k,B]=a.useState(null),[W,H]=a.useState(null),[D,P]=a.useState(null);a.useEffect((()=>{w&&A(f,w,q,O).then((e=>{let{templateVariableMapping:t,template:a,webpushBroadcastConfig:i}=e;L(t),null==R||R(t),null==E||E(Object.assign({},a)),I(i)}))}),[w,O]);const{descriptionComponents:F,bodyVariables:U,titleVariables:_}=a.useMemo((()=>{if(V&&y){const e=d.getAllDataFromWebpushTemplateComponent(y,V);return k||B(e.iconImage),W||H(e.bannerImage),D||P(e.redirectionLink),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[V,y]),{uploadMediaLink:N,uploadMediaFiles:Y,validateMimeType:G}=j,$=a.useRef(null),K=c.useEditWhatsappTemplateMedia({uploadMediaLink:N,uploadMediaFiles:Y,updateTemplateImageUrl:e=>J(e,"icon"),validateMimeType:G,mediaComponent:k,fileRef:$}),z=c.useEditWhatsappTemplateMedia({uploadMediaLink:N,uploadMediaFiles:Y,updateTemplateImageUrl:e=>J(e,"image"),validateMimeType:G,mediaComponent:W,fileRef:$});function J(e,t){const a=Object.assign({},f),i=M.default(a);"icon"===t?(i.webpushBroadcastConfig.icon=[e],B([e])):"image"===t&&(i.webpushBroadcastConfig.image=[e],H([e])),null==E||E(Object.assign({},i))}function Q(e,t,a){var i;const n=Object.assign({},f),l=M.default(n),o="custom"===t&&"string"==typeof e,s=null===(i=null==l?void 0:l.webpushBroadcastConfig)||void 0===i?void 0:i.buttons;if(s&&s.length>0){s[a]=o?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},l.webpushBroadcastConfig),{buttons:s});l.webpushBroadcastConfig=t}null==E||E(l)}const X=K.openEditMedia?K:z.openEditMedia?z:null;if(X)return e.jsx(m.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(r.default,{mediaComponentFormat:l.HEADER_TYPES.IMAGE,uploadMedia:X.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:X,setOpenEditMedia:X.setOpenEditMedia,openEditMedia:X.openEditMedia,editIconRef:X.editIconRef,fileRef:$,skipAddVariable:!0})}));return e.jsxs(m.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[k&&k.length?e.jsx(p.EditTemplateMediaContainer,{children:e.jsx(u.default,{imageName:k,handleImageChange:K.handleImageChange,mediaType:l.HEADER_TYPES.IMAGE,error:K.error,isLoading:K.loading,setOpenEditMedia:K.setOpenEditMedia})}):null,W&&W.length?e.jsx(p.EditTemplateMediaContainer,{children:e.jsx(u.default,{imageName:W,handleImageChange:z.handleImageChange,mediaType:l.HEADER_TYPES.IMAGE,error:z.error,isLoading:z.loading,setOpenEditMedia:z.setOpenEditMedia})}):null,(null==U?void 0:U.length)||(null==_?void 0:_.length)?e.jsx(b.default,{containerStyle:{paddingTop: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,null==F?void 0:F.map(((t,a)=>e.jsx(h.default,{originalVariableList:V,originalList:q,channel:n.CHANNEL_TYPE.WEBPUSH,type:t.type,descriptionComponent:t.component,showVariableModal:C},a))),D&&D.length?e.jsx("div",Object.assign({style:{padding:"16px 14px"}},{children:e.jsx(i.Input,{labelText:"Redirection Link",id:"redirection-link",value:D[0].replace("https://",""),errorMessage:S(D[0])?"":"Please enter a valid URL",maxCharLimit:2e3,noKeyDownChange:!0,state:O?"disabled":"none",prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:e=>{!function(e){var t;const a=`https://${e}`;P([a]);const i=M.default(f);(null===(t=i.webpushBroadcastConfig)||void 0===t?void 0:t.redirectionLink)&&(i.webpushBroadcastConfig.redirectionLink=[a]),null==E||E(Object.assign({},i))}(e)}})})):e.jsx(e.Fragment,{}),(null===(v=null===(T=null==V?void 0:V.buttons)||void 0===T?void 0:T.filter((e=>"URL"===e.type)))||void 0===v?void 0:v.length)>0&&e.jsx(b.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(x=null==V?void 0:V.buttons)||void 0===x?void 0:x.map(((t,a)=>e.jsx(g.default,{variableListIndex:a,CTAoptions:null==j?void 0:j.CTAoptions,button:t,currentVariableList:V,updateSelectedURLTemplateBtn:Q},`${a}`)))]}))};

package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@bikdotai/bik-models/growth/models/bik-store"),l=require("../../../assets/icons/arrow_back.svg.js"),n=require("../../../assets/icons/chevronLeft.svg.js"),i=require("../../../assets/icons/chevronRight.svg.js"),o=require("../../../assets/icons/PlusIcon.js"),r=require("lodash"),a=require("react"),s=require("../../button/Button.js"),d=require("../../icon-button/IconButton.js"),c=require("../../product-picker-v2/modal.js"),u=require("../../product-picker-v2/type.js"),p=require("../Badge/index.js"),v=require("../context/templateModalContext.js"),h=require("./EditWhatsAppTemplateV2.js"),m=require("./ProductBox.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var g=require("../../../constants/Theme.js");require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var y=require("../../template-preview/models/WhatsAppTemplate.js");require("../../template-preview/models/Channels.js");var x=require("../../template-preview/helpers/templateMiscHelper.js"),j=require("../../TypographyStyle.js");exports.default=f=>{let{template:b,whatsappSpecificPickerMeta:C,showVariableModal:O,variableListForImage:I,discountCode:S,setDiscountCode:k}=f;var q,w,P,T,B,L,R,E;const{selectedCarouselIndex:M,setTemplate:A,pickerConf:D,isProductCarouselType:F,pod:V,cardCount:W,carouselProducts:N,setCarouselProducts:$,isError:_,cardImages:z,disableEditVariable:G,onDeleteSelectedProducts:H,setSelectedCarouselIndex:K,setVariableCallback:J,setShowVariablePicker:Q,sliderRef:U}=v.useTemplateModalContext(),[X,Y]=a.useState(x.isRCSChannel(null==b?void 0:b.channel)?"Carousel Cards":-1==M?"First Message (Step 1/2)":F?"Product Carousel "+((null===(w=null===(q=null==b?void 0:b.mapping)||void 0===q?void 0:q.body)||void 0===w?void 0:w.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(T=null===(P=null==b?void 0:b.mapping)||void 0===P?void 0:P.body)||void 0===T?void 0:T.length)?"(Step 2/2)":"")),[Z,ee]=a.useState(!1),[te,le]=a.useState(!1),ne=M===(null!=W?W:-1)-1,ie=(null!=M?M:-1)<1;a.useEffect((()=>{var e,t,l,n;Y(x.isRCSChannel(null==b?void 0:b.channel)?"Carousel Cards":-1==M?"First Message (Step 1/2)":F?"Product Carousel "+((null===(t=null===(e=null==b?void 0:b.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(n=null===(l=null==b?void 0:b.mapping)||void 0===l?void 0:l.body)||void 0===n?void 0:n.length)?"(Step 2/2)":""))}),[M]),a.useEffect((()=>{Q(!1)}),[M]);const oe=e=>{null==$||$([{name:"variable",productName:e.actualValue}])};return a.useEffect((()=>{-1===M&&x.isRCSChannel(null==b?void 0:b.channel)&&(null==K||K(0))}),[M,null==b?void 0:b.channel]),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[!x.isRCSChannel(null==b?void 0:b.channel)&&null!=M&&M>=0&&!!(null===(L=null===(B=null==b?void 0:b.mapping)||void 0===B?void 0:B.body)||void 0===L?void 0:L.length)&&e.jsx(d.IconButton,{Icon:l.default,onClick:()=>{null==K||K(-1)}}),e.jsx(j.TitleMedium,Object.assign({style:{marginLeft:10}},{children:X}))]})),F&&(null!==(R=null==N?void 0:N.length)&&void 0!==R?R:0)>0&&null!=M&&M>=0&&e.jsxs("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsx(m.ProductBox,{editItem:()=>{1===(null==N?void 0:N.length)&&"variable"===N[0].name?(J((()=>oe)),Q(!0)):ee(!Z)},cardBody:1===(null==N?void 0:N.length)&&"variable"===N[0].name?`${N[0].productName}`:`${null==N?void 0:N.length} Products Selected`,hideIcon:1===(null==N?void 0:N.length)&&"variable"===N[0].name,deleteItem:()=>{var e;if(1===(null==N?void 0:N.length)&&"variable"===N[0].name)return void(null==$||$([]));const t=r.cloneDeep(Object.assign({},b));t&&(z&&z.length>0?null==z||z.forEach(((e,l)=>{var n;t.components[1].cards[l].components[0].example.header_handle=[null!==(n=z[l])&&void 0!==n?n:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==t?void 0:t.components[1].cards)||void 0===e||e.forEach(((e,l)=>{t.components[1].cards[l].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==A||A(t)),null==$||$([]),null==H||H()}}),N&&(null==N?void 0:N.length)>0&&"variable"!=N[0].name&&e.jsx(s.Button,{disabled:(null!==(E=null==N?void 0:N.length)&&void 0!==E?E:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{le(!0),ee(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!G&&F&&0===(null==N?void 0:N.length)&&null!=M&&M>=0&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsx(j.TitleRegular,{children:"Product(s)"}),e.jsx(j.BodySecondary,{children:`Select ${null!=W?W:1} products`})]})),e.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:_?16:12,marginRight:_?16:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsx(s.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:_?`2px dashed ${g.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:_?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:e.jsx(o.default,{width:18,height:18,color:g.COLORS.content.secondary})})),onClick:e=>{ee(!0)}}),V===y.POD.CHATBOT&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8,flex:1}}),e.jsx(j.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8,flex:1}})]})),e.jsx(s.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:_?`2px dashed ${g.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:_?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsx(o.default,{width:18,height:18,color:g.COLORS.content.secondary})})),onClick:e=>{J((()=>oe)),Q(!0)}})]})]})),_&&e.jsx("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:e.jsx(p.Badge,{padding:"8px",errorText:"Please add products"})}))]}),!F&&(null!=M?M:-1)>-1&&e.jsxs("div",Object.assign({style:{display:"flex",background:g.COLORS.surface.hovered,alignItems:"center"}},{children:[e.jsx(d.IconButton,{Icon:n.default,disabled:ie,width:8,height:14,svgStyle:ie?{}:{color:g.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==U?void 0:U.current)||void 0===e||e.slickPrev(),(null!=M?M:-1)<1||null==K||K((e=>e-1))}}),e.jsx(j.TitleRegular,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:g.COLORS.content.secondary},{children:`Card ${(null!=M?M:0)+1}/${W}`})),e.jsx(d.IconButton,{Icon:i.default,width:8,height:14,disabled:ne,svgStyle:ne?{}:{color:g.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==U?void 0:U.current)||void 0===e||e.slickNext(),(null!=M?M:-1)>=(null!=W?W:-1)-1||null==K||K((e=>e+1))}})]})),e.jsx(h.default,{whatsappSpecificPickerMeta:C,template:b,onTemplateChange:e=>{null==A||A(e)},showVariableModal:O,variableListForImage:I,discountCode:S,setDiscountCode:k}),Z&&D&&e.jsx(c.ProductPickerModal,{zIndex:200,startupScreen:te?u.ScreenName.RearrangeProducts:u.ScreenName.Collections,rearrangeEnabled:!0,storeId:D.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const l of e){const e=null==l?void 0:l.collectionId,n=l.productId,i=l.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),n in t[e].products||(t[e].products[n]={variants:{},name:(null==l?void 0:l.productName)||"",image:(null==l?void 0:l.productImage)||""}),t[e].products[n].variants[i]={name:(null==l?void 0:l.name)||"",price:"",image:(null==l?void 0:l.image)||"",quantity:l.quantity||0,displayOrder:l.displayOrder}}return t}return{}})(null!=N?N:[]),collectionFetcher:D.fetchCollections,productFetcher:D.fetchProducts,onAdd:(e,t)=>{var l,n,i,o,a,s;le(!1);const d=[];delete e.isCustom;for(const t of Object.keys(e)){const r=e[t].products;if(void 0!==r&&Object.keys(r).length)for(const e of Object.keys(r)){const c=r[e].variants;if(void 0!==c&&Object.keys(c).length)for(const u of Object.keys(c)){const{name:p,image:v,quantity:h,displayOrder:m}=c[u],g={name:p,image:null!==(n=null!=v?v:null===(l=r[e])||void 0===l?void 0:l.image)&&void 0!==n?n:"",quantity:h,variantId:u,productId:e,displayOrder:m,collectionId:t,productName:null!==(o=null===(i=r[e])||void 0===i?void 0:i.name)&&void 0!==o?o:"",productImage:null!==(s=null===(a=r[e])||void 0===a?void 0:a.image)&&void 0!==s?s:""};d.push(g)}}}const c=d.sort(((e,t)=>e.displayOrder-t.displayOrder)),u=d.map((e=>e.image)),p=r.cloneDeep(Object.assign({},b));p&&(u.forEach(((e,t)=>{var l;p.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(l=null==z?void 0:z[t])&&void 0!==l?l:""]})),null==A||A(p)),null==$||$(c),ee(!1)},searchInCollectionFetcher:D.searchInCollection,searchFetcher:D.searchProducts,visible:Z,onClose:()=>{ee(!1)},exactLimit:null!=W?W:1,appType:D.appType||t.ApplicationType.BIK})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@bikdotai/bik-models/growth/models/bik-store"),l=require("../../../assets/icons/arrow_back.svg.js"),n=require("../../../assets/icons/chevronLeft.svg.js"),o=require("../../../assets/icons/chevronRight.svg.js"),i=require("../../../assets/icons/PlusIcon.js"),a=require("lodash/cloneDeep"),r=require("react"),s=require("../../button/Button.js"),d=require("../../icon-button/IconButton.js"),c=require("../../product-picker-v2/modal.js"),u=require("../../product-picker-v2/type.js"),p=require("../Badge/index.js"),v=require("../context/templateModalContext.js"),h=require("./EditWhatsAppTemplateV2.js"),g=require("./ProductBox.js"),m=require("../../template-preview/helpers/templateMiscHelper.js"),y=require("../../template-preview/models/WhatsAppTemplate.js"),x=require("../../TypographyStyle.js"),f=require("../../../constants/Theme.js");function j(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var b=j(a);exports.default=a=>{let{template:j,whatsappSpecificPickerMeta:C,showVariableModal:O,variableListForImage:I,discountCode:S,setDiscountCode:k}=a;var P,q,T,w,B,R,L,E;const{selectedCarouselIndex:M,setTemplate:D,pickerConf:F,isProductCarouselType:V,pod:A,cardCount:N,carouselProducts:$,setCarouselProducts:_,isError:W,cardImages:z,disableEditVariable:G,onDeleteSelectedProducts:H,setSelectedCarouselIndex:K,setVariableCallback:J,setShowVariablePicker:Q,sliderRef:U}=v.useTemplateModalContext(),[X,Y]=r.useState(m.isRCSChannel(null==j?void 0:j.channel)?"Carousel Cards":-1==M?"First Message (Step 1/2)":V?"Product Carousel "+((null===(q=null===(P=null==j?void 0:j.mapping)||void 0===P?void 0:P.body)||void 0===q?void 0:q.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(w=null===(T=null==j?void 0:j.mapping)||void 0===T?void 0:T.body)||void 0===w?void 0:w.length)?"(Step 2/2)":"")),[Z,ee]=r.useState(!1),[te,le]=r.useState(!1),ne=M===(null!=N?N:-1)-1,oe=(null!=M?M:-1)<1;r.useEffect((()=>{var e,t,l,n;Y(m.isRCSChannel(null==j?void 0:j.channel)?"Carousel Cards":-1==M?"First Message (Step 1/2)":V?"Product Carousel "+((null===(t=null===(e=null==j?void 0:j.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(n=null===(l=null==j?void 0:j.mapping)||void 0===l?void 0:l.body)||void 0===n?void 0:n.length)?"(Step 2/2)":""))}),[M]),r.useEffect((()=>{Q(!1)}),[M]);const ie=e=>{null==_||_([{name:"variable",productName:e.actualValue}])};return r.useEffect((()=>{-1===M&&m.isRCSChannel(null==j?void 0:j.channel)&&(null==K||K(0))}),[M,null==j?void 0:j.channel]),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[!m.isRCSChannel(null==j?void 0:j.channel)&&null!=M&&M>=0&&!!(null===(R=null===(B=null==j?void 0:j.mapping)||void 0===B?void 0:B.body)||void 0===R?void 0:R.length)&&e.jsx(d.IconButton,{Icon:l.default,onClick:()=>{null==K||K(-1)}}),e.jsx(x.TitleMedium,Object.assign({style:{marginLeft:10}},{children:X}))]})),V&&(null!==(L=null==$?void 0:$.length)&&void 0!==L?L:0)>0&&null!=M&&M>=0&&e.jsxs("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsx(g.ProductBox,{editItem:()=>{1===(null==$?void 0:$.length)&&"variable"===$[0].name?(J((()=>ie)),Q(!0)):ee(!Z)},cardBody:1===(null==$?void 0:$.length)&&"variable"===$[0].name?`${$[0].productName}`:`${null==$?void 0:$.length} Products Selected`,hideIcon:1===(null==$?void 0:$.length)&&"variable"===$[0].name,deleteItem:()=>{var e;if(1===(null==$?void 0:$.length)&&"variable"===$[0].name)return void(null==_||_([]));const t=b.default(Object.assign({},j));t&&(z&&z.length>0?null==z||z.forEach(((e,l)=>{var n;t.components[1].cards[l].components[0].example.header_handle=[null!==(n=z[l])&&void 0!==n?n:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==t?void 0:t.components[1].cards)||void 0===e||e.forEach(((e,l)=>{t.components[1].cards[l].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==D||D(t)),null==_||_([]),null==H||H()}}),$&&(null==$?void 0:$.length)>0&&"variable"!=$[0].name&&e.jsx(s.Button,{disabled:(null!==(E=null==$?void 0:$.length)&&void 0!==E?E:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{le(!0),ee(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!G&&V&&0===(null==$?void 0:$.length)&&null!=M&&M>=0&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsx(x.TitleRegular,{children:"Product(s)"}),e.jsx(x.BodySecondary,{children:`Select ${null!=N?N:1} products`})]})),e.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:W?16:12,marginRight:W?16:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsx(s.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:W?`2px dashed ${f.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:W?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:e.jsx(i.default,{width:18,height:18,color:f.COLORS.content.secondary})})),onClick:e=>{ee(!0)}}),A===y.POD.CHATBOT&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8,flex:1}}),e.jsx(x.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8,flex:1}})]})),e.jsx(s.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:W?`2px dashed ${f.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:W?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsx(i.default,{width:18,height:18,color:f.COLORS.content.secondary})})),onClick:e=>{J((()=>ie)),Q(!0)}})]})]})),W&&e.jsx("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:e.jsx(p.Badge,{padding:"8px",errorText:"Please add products"})}))]}),!V&&(null!=M?M:-1)>-1&&e.jsxs("div",Object.assign({style:{display:"flex",background:f.COLORS.surface.hovered,alignItems:"center"}},{children:[e.jsx(d.IconButton,{Icon:n.default,disabled:oe,width:8,height:14,svgStyle:oe?{}:{color:f.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==U?void 0:U.current)||void 0===e||e.slickPrev(),(null!=M?M:-1)<1||null==K||K((e=>e-1))}}),e.jsx(x.TitleRegular,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:f.COLORS.content.secondary},{children:`Card ${(null!=M?M:0)+1}/${N}`})),e.jsx(d.IconButton,{Icon:o.default,width:8,height:14,disabled:ne,svgStyle:ne?{}:{color:f.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==U?void 0:U.current)||void 0===e||e.slickNext(),(null!=M?M:-1)>=(null!=N?N:-1)-1||null==K||K((e=>e+1))}})]})),e.jsx(h.default,{whatsappSpecificPickerMeta:C,template:j,onTemplateChange:e=>{null==D||D(e)},showVariableModal:O,variableListForImage:I,discountCode:S,setDiscountCode:k}),Z&&F&&e.jsx(c.ProductPickerModal,{zIndex:200,startupScreen:te?u.ScreenName.RearrangeProducts:u.ScreenName.Collections,rearrangeEnabled:!0,storeId:F.storeId,selectedItems:(e=>{if(e.length>0){const t={};for(const l of e){const e=null==l?void 0:l.collectionId,n=l.productId,o=l.variantId;e in t||(t[e]={products:{},name:"",image:"",isSmartCollection:!1}),n in t[e].products||(t[e].products[n]={variants:{},name:(null==l?void 0:l.productName)||"",image:(null==l?void 0:l.productImage)||""}),t[e].products[n].variants[o]={name:(null==l?void 0:l.name)||"",price:"",image:(null==l?void 0:l.image)||"",quantity:l.quantity||0,displayOrder:l.displayOrder}}return t}return{}})(null!=$?$:[]),collectionFetcher:F.fetchCollections,productFetcher:F.fetchProducts,onAdd:(e,t)=>{var l,n,o,i,a,r;le(!1);const s=[];delete e.isCustom;for(const t of Object.keys(e)){const d=e[t].products;if(void 0!==d&&Object.keys(d).length)for(const e of Object.keys(d)){const c=d[e].variants;if(void 0!==c&&Object.keys(c).length)for(const u of Object.keys(c)){const{name:p,image:v,quantity:h,displayOrder:g}=c[u],m={name:p,image:null!==(n=null!=v?v:null===(l=d[e])||void 0===l?void 0:l.image)&&void 0!==n?n:"",quantity:h,variantId:u,productId:e,displayOrder:g,collectionId:t,productName:null!==(i=null===(o=d[e])||void 0===o?void 0:o.name)&&void 0!==i?i:"",productImage:null!==(r=null===(a=d[e])||void 0===a?void 0:a.image)&&void 0!==r?r:""};s.push(m)}}}const d=s.sort(((e,t)=>e.displayOrder-t.displayOrder)),c=s.map((e=>e.image)),u=b.default(Object.assign({},j));u&&(c.forEach(((e,t)=>{var l;u.components[1].cards[t].components[0].example.header_handle=e?[e]:[null!==(l=null==z?void 0:z[t])&&void 0!==l?l:""]})),null==D||D(u)),null==_||_(d),ee(!1)},searchInCollectionFetcher:F.searchInCollection,searchFetcher:F.searchProducts,visible:Z,onClose:()=>{ee(!1)},exactLimit:null!=N?N:1,appType:F.appType||t.ApplicationType.BIK})]}))};

package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("../../curtain/CurtainHelper.js");var n=require("../../variable-picker-v3/model.js"),t=require("lodash"),o=require("react"),i=require("styled-components"),l=require("../../input/Input.js"),a=require("../../input-with-vars/InputWithVariables.js"),s=require("../../template-preview/helpers/templateMiscHelper.js"),d=require("../../template-preview/models/TemplateMeta.js"),r=require("../../template-preview/models/WhatsAppTemplate.js"),u=require("../context/templateModalContext.js"),p=require("../utils/constants.js"),c=require("../utils/getDataFromTemplateComponent.js"),v=require("../utils/validateIsUrl.js"),m=require("../utils/validateName.js"),b=require("./BackTrackComponent.js"),g=require("./DiscountCodeComponent.js"),h=require("./EditMediaModal.js"),f=require("./EditMediaV2.js"),j=require("./EditMediaV2.style.js"),C=require("./useEditWhtasappTemplateMedia.js"),x=require("./VariableConnector.js"),T=require("./VariableConnectorsPanel.js"),O=require("./VariableConnectorWhatsApp.js"),E=require("./VariableEditorHeader.js"),y=require("./WhatsAppTemplateCardButtonV2.js");function V(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const B=V(i).default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime");require("../../curtain/CurtainHelper.js");var n=require("../../variable-picker-v3/model.js"),t=require("lodash/cloneDeep"),o=require("react"),i=require("styled-components"),l=require("../../input/Input.js"),a=require("../../input-with-vars/InputWithVariables.js"),s=require("../../template-preview/helpers/templateMiscHelper.js"),d=require("../../template-preview/models/TemplateMeta.js"),r=require("../../template-preview/models/WhatsAppTemplate.js"),u=require("../context/templateModalContext.js"),p=require("../utils/constants.js"),c=require("../utils/getDataFromTemplateComponent.js"),v=require("../utils/validateIsUrl.js"),m=require("../utils/validateName.js"),b=require("./BackTrackComponent.js"),g=require("./DiscountCodeComponent.js"),h=require("./EditMediaModal.js"),f=require("./EditMediaV2.js"),j=require("./EditMediaV2.style.js"),C=require("./useEditWhtasappTemplateMedia.js"),x=require("./VariableConnector.js"),T=require("./VariableConnectorsPanel.js"),O=require("./VariableConnectorWhatsApp.js"),E=require("./VariableEditorHeader.js"),y=require("./WhatsAppTemplateCardButtonV2.js");function V(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var B=V(t);const M=V(i).default.div`
 	padding-top: 24px;
 	padding-left: 10px;
 	padding-right: 10px;
 	margin-bottom: 8px;
 	line-height: normal;
-`;exports.default=i=>{let{template:V,onTemplateChange:M,whatsappSpecificPickerMeta:k,showVariableModal:I,variableListForImage:D,setDiscountCode:R,fileName:q,setFileName:P}=i;var L,U,A,w,N,S,_,H,F,Q,Y,W,K,$,G,X,z,J,Z,ee,ne,te,oe,ie,le,ae,se,de,re,ue,pe,ce,ve,me,be,ge,he,fe,je;const Ce=V.isCarouselType,{originalVariableList:xe,pod:Te,extras:Oe,selectedCarouselIndex:Ee,isProductCarouselType:ye,disableCopyCode:Ve,isError:Be,cardIndex:Me}=u.useTemplateModalContext(),{descriptionComponents:ke,urlBtns:Ie,qrbBtns:De,imageComponent:Re,bodyVariables:qe,headerVariables:Pe,titleVariables:Le}=c.getAllDataFromTemplateComponent(V),Ue=o.useRef(null),[Ae,we]=o.useState(!1),[Ne,Se]=o.useState(-1===Ee?{descriptionComponents:ke,urlBtns:Ie,qrbBtns:De,imageComponent:Re,bodyVariables:qe,headerVariables:Pe,titleVariables:Le}:{}),{uploadMediaLink:_e,uploadMediaFiles:He,validateMimeType:Fe}=k,Qe=C.useEditWhatsappTemplateMedia({uploadMediaLink:_e,uploadMediaFiles:He,updateTemplateImageUrl:function(e,n){var o,i,l,a,s,d,r,u;let p;p=null!=Ee&&Ee>-1?{components:null===(i=null===(o=V.components[Me])||void 0===o?void 0:o.cards)||void 0===i?void 0:i[Ee].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[Ee]}:Object.assign({},V);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 t=Object.assign(Object.assign({},p.components[c]),{format:n,example:{header_handle:[e]}}),o=[...p.components];o[c]=t,p=Object.assign(Object.assign({},p),{components:o})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Ee&&Ee>-1){const e=t.cloneDeep(V);e.components[Me].cards[Ee].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==e?void 0:e.mapping)||void 0===r?void 0:r.cards.length)>0&&(e.mapping.cards[Ee]=null!==(u=p.mapping)&&void 0!==u?u:{}),null==M||M(Object.assign({},e)),We(!0)}else null==M||M(Object.assign({},p))},validateMimeType:Fe,mediaComponent:Ce?Ne.imageComponent:Re,fileRef:Ue}),[Ye,We]=o.useState(!1),[Ke,$e]=o.useState(q),[Ge,Xe]=o.useState();function ze(e,n,o){var i,l,a,d,r,u,p,c,v,m;const b=null!=Ee&&Ee>-1?{components:null===(i=Object.assign({},V).components[Me].cards)||void 0===i?void 0:i[Ee].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Ee]}:Object.assign({},V),g=t.cloneDeep(b),h="custom"===n&&"string"==typeof e,f=h?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Ee&&Ee>-1&&ye){const n=Object.assign({},V).components.map((e=>{var n;return s.isCarouselComponent(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,t,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!==(t=null==l?void 0:l[o])&&void 0!==t?t:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]});const s=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},e),{buttons:s})}return e}))})))}):e})),i=null===(d=null===(a=Object.assign({},V).mapping)||void 0===a?void 0:a.cards)||void 0===d?void 0:d.map((n=>{var t;return Object.assign(Object.assign({},n),{buttons:null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.map(((n,t)=>t===o?h?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"":n))})})),l=t.cloneDeep(V);return l.components=n,l.mapping.cards=i,void(null==M||M(Object.assign({},l)))}const j=null==g?void 0:g.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==j&&j>-1){const t=null===(r=null==g?void 0:g.components[j].buttons)||void 0===r?void 0:r.filter((e=>"URL"===e.type));if((null==t?void 0:t.length)>0){const i="custom"===n&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=t[o];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(c=null===(p=null===(u=g.components)||void 0===u?void 0:u[j])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},g.components[j]),{buttons:s}),r=null===(v=g.mapping)||void 0===v?void 0:v.buttons;r&&r.length>0&&(r[o]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},g.mapping),{buttons:r});g.mapping=m;const b=[...g.components];b[j]=d,g.components=b}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(m=e.placeHolder)||void 0===m?void 0:m.slice(2,-2))?we(!0):(we(!1),null==R||R(""))}if(null!=Ee&&Ee>-1){const e=t.cloneDeep(V);e.components[Me].cards[Ee].components=g.components,e.mapping.cards[Ee]=g.mapping,null==M||M(Object.assign({},e))}else null==M||M(g)}function Je(e,n,o){var i,l,a,d,r,u,p;const c=null!=Ee&&Ee>-1?{components:null===(i=Object.assign({},V).components[Me].cards)||void 0===i?void 0:i[Ee].components,mapping:null===(l=Object.assign({},V).mapping.cards)||void 0===l?void 0:l[Ee]}:Object.assign({},V);if(null!=Ee&&Ee>-1&&ye){const n=Object.assign({},V).components.map((n=>{var t;return s.isCarouselComponent(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((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[o])&&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=t.cloneDeep(V);return i.components=n,void(null==M||M(Object.assign({},i)))}const v=null==c?void 0:c.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==v&&v>-1){const n=null===(d=null===(a=null==c?void 0:c.components[v])||void 0===a?void 0:a.buttons)||void 0===d?void 0:d.filter((e=>"QUICK_REPLY"===e.type));if(n){let t=n[o];t=Object.assign(Object.assign({},t),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(p=null===(u=null===(r=c.components)||void 0===r?void 0:r[v])||void 0===u?void 0:u.buttons)&&void 0!==p?p:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),l=Object.assign(Object.assign({},c.components[v]),{buttons:i}),a=[...c.components];a[v]=l,c.components=a}}if(null!=Ee&&Ee>-1){const e=t.cloneDeep(V);e.components[Me].cards[Ee].components=c.components,null==M||M(Object.assign({},e))}else null==M||M(c)}o.useEffect((()=>{var e,n;if(null===(e=V.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))we(!0);else{we(!1);const e=null===(n=null==Oe?void 0:Oe.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[V]),o.useEffect((()=>{var e,n,t,o;if(null!=Ee&&Ee>-1){const i={components:null===(n=null===(e=V.components[Me])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Ee].components,mapping:null===(o=null===(t=null==V?void 0:V.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Ee]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}=c.getAllDataFromTemplateComponent(i);Se({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p})}else if(null!=Ee&&-1===Ee){const{descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:i,headerVariables:l,titleVariables:a}=c.getAllDataFromTemplateComponent(V);Se({descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:i,headerVariables:l,titleVariables:a})}}),[Ee]),o.useEffect((()=>{var e,n,t,o;if(null!=Ee&&Ee>-1&&Ye){const i={components:null===(n=null===(e=V.components[Me])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Ee].components,mapping:null===(o=null===(t=null==V?void 0:V.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Ee]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}=c.getAllDataFromTemplateComponent(i);Se({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}),We(!1)}}),[Ye]);o.useEffect((()=>{Be&&Te===r.POD.CHATBOT&&(()=>{if(!q)return void Xe("PDF name is Required");const e=m.validateInputNameChatbot(q);null==P||P(null!=q?q:""),Xe(e?"Please enter a valid PDF name":void 0)})()}),[Be]);const Ze=Ce?Ne.imageComponent:Re;return Qe.openEditMedia?e.jsx(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(h.default,{mediaComponentFormat:null!==(L=Ze.format)&&void 0!==L?L:d.HEADER_TYPES.IMAGE,uploadMedia:Qe.uploadMedia,variableListForImage:D||[],useEditWhatsappTemplateMediaResponse:Qe,setOpenEditMedia:Qe.setOpenEditMedia,openEditMedia:Qe.openEditMedia,editIconRef:Qe.editIconRef,fileRef:Ue})})):e.jsxs(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:ye?"420px":"auto"}},{children:[!!Ne.imageComponent&&!ye&&!s.isRCSChannel(null==V?void 0:V.channel)&&e.jsxs(j.EditTemplateMediaContainer,{children:[e.jsx(f.default,{imageName:null!==(A=null===(U=null==Ze?void 0:Ze.example)||void 0===U?void 0:U.header_handle)&&void 0!==A?A:[],handleImageChange:Qe.handleImageChange,mediaType:null==Ze?void 0:Ze.format,error:Qe.error,isLoading:Qe.loading,setOpenEditMedia:Qe.setOpenEditMedia,selectedVariable:v.isVariable(null!==(S=null===(N=null===(w=null==Ze?void 0:Ze.example)||void 0===w?void 0:w.header_handle)||void 0===N?void 0:N[0])&&void 0!==S?S:"")?null===(H=null===(_=null==Ze?void 0:Ze.example)||void 0===_?void 0:_.header_handle)||void 0===H?void 0:H[0]:(null===(Q=null===(F=null==V?void 0:V.mapping)||void 0===F?void 0:F.header)||void 0===Q?void 0:Q[0])?null===(W=null===(Y=null==V?void 0:V.mapping)||void 0===Y?void 0:Y.header)||void 0===W?void 0:W[0]:Qe.selectedVariable}),(null==Re?void 0:Re.format)==d.HEADER_TYPES.DOCUMENT?e.jsx(B,{children:Te===r.POD.CHATBOT?e.jsx(a.InputWithVariables,{labelText:"PDF Name",placeHolder:"Enter the name",errorMessage:Ge||void 0,onChange:e=>{var n;Xe(""),null==P||P(null!==(n=null==e?void 0:e.actualValue)&&void 0!==n?n:"")},pickerType:n.PickerType.EMBEDDED,noMaxCharCheck:!0,allowMix:!0,showVarHeader:!0,varHeaderText:"Select variable",prevVariable:{actualValue:null!=q?q:"",variableType:"string"},variablesList:D,showAddButton:!0}):e.jsx(l.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ke,errorMessage:Ge||void 0,onBlur:()=>{if(!Ke)return null==P||P(""),void Xe("PDF name is Required");const e=m.validateInputName(Ke);null==P||P(Ke),Xe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Xe(""),$e(e)}})}):e.jsx(e.Fragment,{})]}),(null===(K=Ne.bodyVariables)||void 0===K?void 0:K.length)>0&&e.jsx(E.default,{containerStyle:{paddingTop:Ne.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===($=Ne.descriptionComponents)||void 0===$?void 0:$.map(((n,t)=>e.jsx(O.default,{originalVariableList:null!=Ee&&Ee>-1?xe.cards[Ee]:xe,type:n.type,descriptionComponent:n.component,showVariableModal:I},t))),(null===(z=null===(X=null!=Ee&&Ee>-1?null===(G=xe.cards[Ee])||void 0===G?void 0:G.buttons:null==xe?void 0:xe.buttons)||void 0===X?void 0:X.filter((e=>"URL"===e.type)))||void 0===z?void 0:z.length)>0&&e.jsx(E.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(ee=null===(Z=null!=Ee&&Ee>-1?null===(J=xe.cards[Ee])||void 0===J?void 0:J.buttons:null==xe?void 0:xe.buttons)||void 0===Z?void 0:Z.filter((e=>Te===r.POD.CHATBOT||"URL"===e.type)))||void 0===ee?void 0:ee.map(((n,t)=>{const o=n.buttonVariable===p.STATIC_URL_VARIABLE_NAME,i=n.buttonVariable===p.UNSUBSCRIBE_URL_VARIABLE;if("URL"===n.type)return e.jsx(y.default,{variableListIndex:t,disableEdit:o||i,CTAoptions:null==k?void 0:k.CTAoptions,button:n,currentVariableList:null!=Ee&&Ee>-1?Object.assign({},xe.cards[Ee]):Object.assign({},xe),updateSelectedURLTemplateBtn:ze},`${t}_${Ee}`)})),Te===r.POD.CHATBOT&&(null===(te=null===(ne=De[0])||void 0===ne?void 0:ne.component)||void 0===te?void 0:te.buttons)&&(null===(le=null===(ie=null===(oe=De[0])||void 0===oe?void 0:oe.component)||void 0===ie?void 0:ie.buttons)||void 0===le?void 0:le.length)>0&&e.jsx(b.BackTrackComponent,{backTrackMessage:null===(ae=null==Oe?void 0:Oe.backTrackExtra)||void 0===ae?void 0:ae[0],setBackTrackMessage:null===(se=null==Oe?void 0:Oe.backTrackExtra)||void 0===se?void 0:se[1]}),!s.isRCSChannel(null==V?void 0:V.channel)&&(null===(ue=null===(re=null!=Ee&&Ee>-1?null===(de=xe.cards[Ee])||void 0===de?void 0:de.buttons:null==xe?void 0:xe.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ue?void 0:ue.length)>0&&(Te!==r.POD.CHATBOT?e.jsx(E.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(b.BackTrackComponent,{backTrackMessage:null===(pe=null==Oe?void 0:Oe.backTrackExtra)||void 0===pe?void 0:pe[0],setBackTrackMessage:null===(ce=null==Oe?void 0:Oe.backTrackExtra)||void 0===ce?void 0:ce[1]})),!s.isRCSChannel(null==V?void 0:V.channel)&&(null===(be=null===(me=null!=Ee&&Ee>-1?null===(ve=xe.cards[Ee])||void 0===ve?void 0:ve.buttons:null==xe?void 0:xe.buttons)||void 0===me?void 0:me.filter((e=>"QUICK_REPLY"===e.type)))||void 0===be?void 0:be.map(((n,t)=>{if("QUICK_REPLY"===n.type&&Te!==r.POD.CHATBOT)return e.jsx(y.default,{variableListIndex:t,QRBoptions:null==k?void 0:k.QRBoptions,button:n,currentVariableList:null!=Ee&&Ee>-1?Object.assign({},xe.cards[Ee]):Object.assign({},xe),updateSelectedQRBTemplateBtn:Je},`${t}_${Ee}`)}))),Te===r.POD.CHATBOT&&Ae&&e.jsx(g.DiscountCodeComponent,{discountCode:null===(ge=null==Oe?void 0:Oe.discountCodeExtra)||void 0===ge?void 0:ge[0],setDiscountCode:null===(he=null==Oe?void 0:Oe.discountCodeExtra)||void 0===he?void 0:he[1]}),null===(je=null!=Ee&&Ee>-1?null===(fe=xe.cards[Ee])||void 0===fe?void 0:fe.buttons:null==xe?void 0:xe.buttons)||void 0===je?void 0:je.map(((n,t)=>{var o,i,a,s,d;if("COPY_CODE"===n.type)return e.jsx(e.Fragment,{children:Ve?e.jsx("div",Object.assign({style:{marginBottom:20,borderRadius:4,padding:"8px 10px"}},{children:e.jsx(l.Input,{state:"disabled",labelText:null!==(o=n.text)&&void 0!==o?o:"Copy Code",value:null!==(i=n.buttonVariable)&&void 0!==i?i:"",onChangeText:()=>{}})})):e.jsx(x.default,{index:t,variable:{variableName:null!==(a=n.text)&&void 0!==a?a:"Copy Code",updatedValue:null!==(s=n.buttonVariable)&&void 0!==s?s:"",type:"string",isEditableVariable:!0,index:null!==(d=n.index)&&void 0!==d?d:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},t)})}))]}))};
+`;exports.default=t=>{let{template:i,onTemplateChange:V,whatsappSpecificPickerMeta:k,showVariableModal:I,variableListForImage:R,setDiscountCode:q,fileName:D,setFileName:P}=t;var L,U,A,w,N,S,_,H,F,Q,Y,W,K,$,G,X,z,J,Z,ee,ne,te,oe,ie,le,ae,se,de,re,ue,pe,ce,ve,me,be,ge,he,fe,je;const Ce=i.isCarouselType,{originalVariableList:xe,pod:Te,extras:Oe,selectedCarouselIndex:Ee,isProductCarouselType:ye,disableCopyCode:Ve,isError:Be,cardIndex:Me}=u.useTemplateModalContext(),{descriptionComponents:ke,urlBtns:Ie,qrbBtns:Re,imageComponent:qe,bodyVariables:De,headerVariables:Pe,titleVariables:Le}=c.getAllDataFromTemplateComponent(i),Ue=o.useRef(null),[Ae,we]=o.useState(!1),[Ne,Se]=o.useState(-1===Ee?{descriptionComponents:ke,urlBtns:Ie,qrbBtns:Re,imageComponent:qe,bodyVariables:De,headerVariables:Pe,titleVariables:Le}:{}),{uploadMediaLink:_e,uploadMediaFiles:He,validateMimeType:Fe}=k,Qe=C.useEditWhatsappTemplateMedia({uploadMediaLink:_e,uploadMediaFiles:He,updateTemplateImageUrl:function(e,n){var t,o,l,a,s,d,r,u;let p;p=null!=Ee&&Ee>-1?{components:null===(o=null===(t=i.components[Me])||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Ee].components,mapping:null===(a=null===(l=null==i?void 0:i.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Ee]}:Object.assign({},i);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 t=Object.assign(Object.assign({},p.components[c]),{format:n,example:{header_handle:[e]}}),o=[...p.components];o[c]=t,p=Object.assign(Object.assign({},p),{components:o})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Ee&&Ee>-1){const e=B.default(i);e.components[Me].cards[Ee].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==e?void 0:e.mapping)||void 0===r?void 0:r.cards.length)>0&&(e.mapping.cards[Ee]=null!==(u=p.mapping)&&void 0!==u?u:{}),null==V||V(Object.assign({},e)),We(!0)}else null==V||V(Object.assign({},p))},validateMimeType:Fe,mediaComponent:Ce?Ne.imageComponent:qe,fileRef:Ue}),[Ye,We]=o.useState(!1),[Ke,$e]=o.useState(D),[Ge,Xe]=o.useState();function ze(e,n,t){var o,l,a,d,r,u,p,c,v,m;const b=null!=Ee&&Ee>-1?{components:null===(o=Object.assign({},i).components[Me].cards)||void 0===o?void 0:o[Ee].components,mapping:null===(l=Object.assign({},i).mapping.cards)||void 0===l?void 0:l[Ee]}:Object.assign({},i),g=B.default(b),h="custom"===n&&"string"==typeof e,f=h?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Ee&&Ee>-1&&ye){const n=Object.assign({},i).components.map((e=>{var n;return s.isCarouselComponent(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})),o=null===(d=null===(a=Object.assign({},i).mapping)||void 0===a?void 0:a.cards)||void 0===d?void 0:d.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,o)=>o===t?h?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"":n))})})),l=B.default(i);return l.components=n,l.mapping.cards=o,void(null==V||V(Object.assign({},l)))}const j=null==g?void 0:g.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==j&&j>-1){const o=null===(r=null==g?void 0:g.components[j].buttons)||void 0===r?void 0:r.filter((e=>"URL"===e.type));if((null==o?void 0:o.length)>0){const i="custom"===n&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=o[t];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(c=null===(p=null===(u=g.components)||void 0===u?void 0:u[j])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},g.components[j]),{buttons:s}),r=null===(v=g.mapping)||void 0===v?void 0:v.buttons;r&&r.length>0&&(r[t]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},g.mapping),{buttons:r});g.mapping=m;const b=[...g.components];b[j]=d,g.components=b}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(m=e.placeHolder)||void 0===m?void 0:m.slice(2,-2))?we(!0):(we(!1),null==q||q(""))}if(null!=Ee&&Ee>-1){const e=B.default(i);e.components[Me].cards[Ee].components=g.components,e.mapping.cards[Ee]=g.mapping,null==V||V(Object.assign({},e))}else null==V||V(g)}function Je(e,n,t){var o,l,a,d,r,u,p;const c=null!=Ee&&Ee>-1?{components:null===(o=Object.assign({},i).components[Me].cards)||void 0===o?void 0:o[Ee].components,mapping:null===(l=Object.assign({},i).mapping.cards)||void 0===l?void 0:l[Ee]}:Object.assign({},i);if(null!=Ee&&Ee>-1&&ye){const n=Object.assign({},i).components.map((n=>{var o;return s.isCarouselComponent(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})),o=B.default(i);return o.components=n,void(null==V||V(Object.assign({},o)))}const v=null==c?void 0:c.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==v&&v>-1){const n=null===(d=null===(a=null==c?void 0:c.components[v])||void 0===a?void 0:a.buttons)||void 0===d?void 0:d.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!==(p=null===(u=null===(r=c.components)||void 0===r?void 0:r[v])||void 0===u?void 0:u.buttons)&&void 0!==p?p:[]].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({},c.components[v]),{buttons:i}),a=[...c.components];a[v]=l,c.components=a}}if(null!=Ee&&Ee>-1){const e=B.default(i);e.components[Me].cards[Ee].components=c.components,null==V||V(Object.assign({},e))}else null==V||V(c)}o.useEffect((()=>{var e,n;if(null===(e=i.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))we(!0);else{we(!1);const e=null===(n=null==Oe?void 0:Oe.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[i]),o.useEffect((()=>{var e,n,t,o;if(null!=Ee&&Ee>-1){const l={components:null===(n=null===(e=i.components[Me])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Ee].components,mapping:null===(o=null===(t=null==i?void 0:i.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Ee]},{descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v}=c.getAllDataFromTemplateComponent(l);Se({descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v})}else if(null!=Ee&&-1===Ee){const{descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:l,headerVariables:a,titleVariables:s}=c.getAllDataFromTemplateComponent(i);Se({descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:l,headerVariables:a,titleVariables:s})}}),[Ee]),o.useEffect((()=>{var e,n,t,o;if(null!=Ee&&Ee>-1&&Ye){const l={components:null===(n=null===(e=i.components[Me])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Ee].components,mapping:null===(o=null===(t=null==i?void 0:i.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Ee]},{descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v}=c.getAllDataFromTemplateComponent(l);Se({descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v}),We(!1)}}),[Ye]);o.useEffect((()=>{Be&&Te===r.POD.CHATBOT&&(()=>{if(!D)return void Xe("PDF name is Required");const e=m.validateInputNameChatbot(D);null==P||P(null!=D?D:""),Xe(e?"Please enter a valid PDF name":void 0)})()}),[Be]);const Ze=Ce?Ne.imageComponent:qe;return Qe.openEditMedia?e.jsx(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(h.default,{mediaComponentFormat:null!==(L=Ze.format)&&void 0!==L?L:d.HEADER_TYPES.IMAGE,uploadMedia:Qe.uploadMedia,variableListForImage:R||[],useEditWhatsappTemplateMediaResponse:Qe,setOpenEditMedia:Qe.setOpenEditMedia,openEditMedia:Qe.openEditMedia,editIconRef:Qe.editIconRef,fileRef:Ue})})):e.jsxs(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:ye?"420px":"auto"}},{children:[!!Ne.imageComponent&&!ye&&!s.isRCSChannel(null==i?void 0:i.channel)&&e.jsxs(j.EditTemplateMediaContainer,{children:[e.jsx(f.default,{imageName:null!==(A=null===(U=null==Ze?void 0:Ze.example)||void 0===U?void 0:U.header_handle)&&void 0!==A?A:[],handleImageChange:Qe.handleImageChange,mediaType:null==Ze?void 0:Ze.format,error:Qe.error,isLoading:Qe.loading,setOpenEditMedia:Qe.setOpenEditMedia,selectedVariable:v.isVariable(null!==(S=null===(N=null===(w=null==Ze?void 0:Ze.example)||void 0===w?void 0:w.header_handle)||void 0===N?void 0:N[0])&&void 0!==S?S:"")?null===(H=null===(_=null==Ze?void 0:Ze.example)||void 0===_?void 0:_.header_handle)||void 0===H?void 0:H[0]:(null===(Q=null===(F=null==i?void 0:i.mapping)||void 0===F?void 0:F.header)||void 0===Q?void 0:Q[0])?null===(W=null===(Y=null==i?void 0:i.mapping)||void 0===Y?void 0:Y.header)||void 0===W?void 0:W[0]:Qe.selectedVariable}),(null==qe?void 0:qe.format)==d.HEADER_TYPES.DOCUMENT?e.jsx(M,{children:Te===r.POD.CHATBOT?e.jsx(a.InputWithVariables,{labelText:"PDF Name",placeHolder:"Enter the name",errorMessage:Ge||void 0,onChange:e=>{var n;Xe(""),null==P||P(null!==(n=null==e?void 0:e.actualValue)&&void 0!==n?n:"")},pickerType:n.PickerType.EMBEDDED,noMaxCharCheck:!0,allowMix:!0,showVarHeader:!0,varHeaderText:"Select variable",prevVariable:{actualValue:null!=D?D:"",variableType:"string"},variablesList:R,showAddButton:!0}):e.jsx(l.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ke,errorMessage:Ge||void 0,onBlur:()=>{if(!Ke)return null==P||P(""),void Xe("PDF name is Required");const e=m.validateInputName(Ke);null==P||P(Ke),Xe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Xe(""),$e(e)}})}):e.jsx(e.Fragment,{})]}),(null===(K=Ne.bodyVariables)||void 0===K?void 0:K.length)>0&&e.jsx(E.default,{containerStyle:{paddingTop:Ne.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===($=Ne.descriptionComponents)||void 0===$?void 0:$.map(((n,t)=>e.jsx(O.default,{originalVariableList:null!=Ee&&Ee>-1?xe.cards[Ee]:xe,type:n.type,descriptionComponent:n.component,showVariableModal:I},t))),(null===(z=null===(X=null!=Ee&&Ee>-1?null===(G=xe.cards[Ee])||void 0===G?void 0:G.buttons:null==xe?void 0:xe.buttons)||void 0===X?void 0:X.filter((e=>"URL"===e.type)))||void 0===z?void 0:z.length)>0&&e.jsx(E.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(ee=null===(Z=null!=Ee&&Ee>-1?null===(J=xe.cards[Ee])||void 0===J?void 0:J.buttons:null==xe?void 0:xe.buttons)||void 0===Z?void 0:Z.filter((e=>Te===r.POD.CHATBOT||"URL"===e.type)))||void 0===ee?void 0:ee.map(((n,t)=>{const o=n.buttonVariable===p.STATIC_URL_VARIABLE_NAME,i=n.buttonVariable===p.UNSUBSCRIBE_URL_VARIABLE;if("URL"===n.type)return e.jsx(y.default,{variableListIndex:t,disableEdit:o||i,CTAoptions:null==k?void 0:k.CTAoptions,button:n,currentVariableList:null!=Ee&&Ee>-1?Object.assign({},xe.cards[Ee]):Object.assign({},xe),updateSelectedURLTemplateBtn:ze},`${t}_${Ee}`)})),Te===r.POD.CHATBOT&&(null===(te=null===(ne=Re[0])||void 0===ne?void 0:ne.component)||void 0===te?void 0:te.buttons)&&(null===(le=null===(ie=null===(oe=Re[0])||void 0===oe?void 0:oe.component)||void 0===ie?void 0:ie.buttons)||void 0===le?void 0:le.length)>0&&e.jsx(b.BackTrackComponent,{backTrackMessage:null===(ae=null==Oe?void 0:Oe.backTrackExtra)||void 0===ae?void 0:ae[0],setBackTrackMessage:null===(se=null==Oe?void 0:Oe.backTrackExtra)||void 0===se?void 0:se[1]}),!s.isRCSChannel(null==i?void 0:i.channel)&&(null===(ue=null===(re=null!=Ee&&Ee>-1?null===(de=xe.cards[Ee])||void 0===de?void 0:de.buttons:null==xe?void 0:xe.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ue?void 0:ue.length)>0&&(Te!==r.POD.CHATBOT?e.jsx(E.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(b.BackTrackComponent,{backTrackMessage:null===(pe=null==Oe?void 0:Oe.backTrackExtra)||void 0===pe?void 0:pe[0],setBackTrackMessage:null===(ce=null==Oe?void 0:Oe.backTrackExtra)||void 0===ce?void 0:ce[1]})),!s.isRCSChannel(null==i?void 0:i.channel)&&(null===(be=null===(me=null!=Ee&&Ee>-1?null===(ve=xe.cards[Ee])||void 0===ve?void 0:ve.buttons:null==xe?void 0:xe.buttons)||void 0===me?void 0:me.filter((e=>"QUICK_REPLY"===e.type)))||void 0===be?void 0:be.map(((n,t)=>{if("QUICK_REPLY"===n.type&&Te!==r.POD.CHATBOT)return e.jsx(y.default,{variableListIndex:t,QRBoptions:null==k?void 0:k.QRBoptions,button:n,currentVariableList:null!=Ee&&Ee>-1?Object.assign({},xe.cards[Ee]):Object.assign({},xe),updateSelectedQRBTemplateBtn:Je},`${t}_${Ee}`)}))),Te===r.POD.CHATBOT&&Ae&&e.jsx(g.DiscountCodeComponent,{discountCode:null===(ge=null==Oe?void 0:Oe.discountCodeExtra)||void 0===ge?void 0:ge[0],setDiscountCode:null===(he=null==Oe?void 0:Oe.discountCodeExtra)||void 0===he?void 0:he[1]}),null===(je=null!=Ee&&Ee>-1?null===(fe=xe.cards[Ee])||void 0===fe?void 0:fe.buttons:null==xe?void 0:xe.buttons)||void 0===je?void 0:je.map(((n,t)=>{var o,i,a,s,d;if("COPY_CODE"===n.type)return e.jsx(e.Fragment,{children:Ve?e.jsx("div",Object.assign({style:{marginBottom:20,borderRadius:4,padding:"8px 10px"}},{children:e.jsx(l.Input,{state:"disabled",labelText:null!==(o=n.text)&&void 0!==o?o:"Copy Code",value:null!==(i=n.buttonVariable)&&void 0!==i?i:"",onChangeText:()=>{}})})):e.jsx(x.default,{index:t,variable:{variableName:null!==(a=n.text)&&void 0!==a?a:"Copy Code",updatedValue:null!==(s=n.buttonVariable)&&void 0!==s?s:"",type:"string",isEditableVariable:!0,index:null!==(d=n.index)&&void 0!==d?d:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},t)})}))]}))};

package/dist/cjs/components/template-context-mapper/modalElements/Footer.js

@@ -1,7 +1,7 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/info.svg.js"),r=require("react"),i=require("styled-components"),s=require("../../button/Button.js"),l=require("../../tag/Tag.js");require("../../template-preview/TemplatePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js");var a=require("../../../constants/Theme.js");require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js"),require("../../template-preview/models/WhatsAppTemplate.js");var o=require("../../template-preview/models/Channels.js"),n=require("../../template-preview/helpers/templateMiscHelper.js"),p=require("../../TypographyStyle.js"),u=require("../Badge/index.js"),d=require("../context/templateModalContext.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const x=c(i).default.div`
-	background: ${a.COLORS.surface.standard};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../../assets/icons/info.svg.js"),r=require("react"),s=require("styled-components"),l=require("../../button/Button.js"),i=require("../../tag/Tag.js"),n=require("../../template-preview/models/Channels.js"),o=require("../../template-preview/helpers/templateMiscHelper.js"),a=require("../../TypographyStyle.js"),d=require("../../../constants/Theme.js"),u=require("../Badge/index.js"),p=require("../context/templateModalContext.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const x=c(s).default.div`
+	background: ${d.COLORS.surface.standard};
 	border-top-width: 1px;
-	border-top-color: ${a.COLORS.stroke.primary};
+	border-top-color: ${d.COLORS.stroke.primary};
 	box-shadow: 0px -4px 12px rgba(0, 0, 0, 0.12);
 	width: 100%;
 	padding: 0 24px;
@@ -12,4 +12,4 @@
 	border-bottom-left-radius: 4px;
 	border-bottom-right-radius: 4px;
 	height: ${e=>e.isWhatsappCarousel?64:80}px;
-`;exports.default=i=>{let{isWhatsappCarousel:c,onSelect:m,footerButtonText:v,footerInfoText:j}=i;var g,h,b,f;const{isError:q,selectedCarouselIndex:C,setSelectedCarouselIndex:T,setErrorIndexes:y,template:w,showVariablePicker:S,hideFooterButton:O}=d.useTemplateModalContext(),[P,W]=r.useState(c?"Next":"Select template");return r.useEffect((()=>{v?W(v):c&&-1===C?W("Next"):c&&null!=C&&C>-1&&W("Save & Select Template")}),[C]),e.jsxs(x,Object.assign({isWhatsappCarousel:c,justifyContent:c&&(null===(h=null===(g=null==w?void 0:w.mapping)||void 0===g?void 0:g.body)||void 0===h?void 0:h.length)?"space-between":"end"},{children:[n.isRCSChannel((null==w?void 0:w.channel)||o.CHANNEL_TYPE.WHATSAPP)?e.jsx(p.TitleRegular,{}):c&&null!=C&&C>=-1&&!!(null===(f=null===(b=null==w?void 0:w.mapping)||void 0===b?void 0:b.body)||void 0===f?void 0:f.length)&&e.jsx(p.TitleRegular,Object.assign({color:a.COLORS.text.secondary},{children:`Step ${-1===C?1:2}/2`})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[q&&e.jsx(u.Badge,{errorText:"Some inputs are missing or incorrect. Please check"}),!q&&j&&e.jsx("div",Object.assign({style:{marginRight:12}},{children:e.jsx(l.Tag,{tagText:j,LeadingIcon:t.default})})),!O&&e.jsx(s.Button,{disabled:S,id:"select-template-btn",buttonText:P,size:c?"small":"large",onClick:function(){c&&-1===C&&T?T(0):(null==y||y([]),m())}})]}))]}))};
+`;exports.default=s=>{let{isWhatsappCarousel:c,onSelect:g,footerButtonText:j,footerInfoText:h}=s;var m,b,f,v;const{isError:y,selectedCarouselIndex:C,setSelectedCarouselIndex:T,setErrorIndexes:S,template:q,showVariablePicker:O,hideFooterButton:w}=p.useTemplateModalContext(),[R,B]=r.useState(c?"Next":"Select template");return r.useEffect((()=>{j?B(j):c&&-1===C?B("Next"):c&&null!=C&&C>-1&&B("Save & Select Template")}),[C]),e.jsxs(x,Object.assign({isWhatsappCarousel:c,justifyContent:c&&(null===(b=null===(m=null==q?void 0:q.mapping)||void 0===m?void 0:m.body)||void 0===b?void 0:b.length)?"space-between":"end"},{children:[o.isRCSChannel((null==q?void 0:q.channel)||n.CHANNEL_TYPE.WHATSAPP)?e.jsx(a.TitleRegular,{}):c&&null!=C&&C>=-1&&!!(null===(v=null===(f=null==q?void 0:q.mapping)||void 0===f?void 0:f.body)||void 0===v?void 0:v.length)&&e.jsx(a.TitleRegular,Object.assign({color:d.COLORS.text.secondary},{children:`Step ${-1===C?1:2}/2`})),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[y&&e.jsx(u.Badge,{errorText:"Some inputs are missing or incorrect. Please check"}),!y&&h&&e.jsx("div",Object.assign({style:{marginRight:12}},{children:e.jsx(i.Tag,{tagText:h,LeadingIcon:t.default})})),!w&&e.jsx(l.Button,{disabled:O,id:"select-template-btn",buttonText:R,size:c?"small":"large",onClick:function(){c&&-1===C&&T?T(0):(null==S||S([]),g())}})]}))]}))};

package/dist/cjs/components/template-context-mapper/modalElements/MobilePreview.js

@@ -1,8 +1,8 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("styled-components"),a=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../../constants/Theme.js"),require("../../curtain/CurtainHelper.js"),require("../../variable-picker-v3/model.js"),require("../../template-preview/models/TemplateMeta.js");var r=require("../../template-preview/models/WhatsAppTemplate.js"),s=require("../../template-preview/models/Channels.js"),l=require("../context/templateModalContext.js"),o=require("../utils/getPreviewDimension.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=n(t),d=n(i);const c=d.default.div`
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),i=require("styled-components"),a=require("../../template-preview/TemplatePreview.js"),r=require("../../template-preview/models/Channels.js"),s=require("../../template-preview/models/WhatsAppTemplate.js"),o=require("../context/templateModalContext.js"),l=require("../utils/getPreviewDimension.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=n(t),d=n(i);const c=d.default.div`
 	position: relative;
 	height: 100%;
 	border-radius: 31px;
-	width: ${e=>o.getPreviewWidth(e.channel)}px;
+	width: ${e=>l.getPreviewWidth(e.channel)}px;
 	background-color: white;
 	margin: auto;
 	overflow-y: auto;
@@ -17,7 +17,7 @@
 	height: calc(100% - 17px);
 	border-radius: 16px;
 	overflow-y: auto;
-`,m=p.default.forwardRef(((t,i)=>{let{display_content:n,channel:p,template:d,showSampleValues:m}=t;const{pod:v,hideDeviceContainerInPreview:w}=l.useTemplateModalContext(),f={showSampleValues:m,template:d,channel:p,smsSpecificMeta:{smsDisplayContent:n},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:v!==r.POD.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:p==s.CHANNEL_TYPE.RCS?"unset":240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:n,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}},isPreview:!0,hidePointerEvents:!0};return w?e.jsx(u,{children:e.jsx(a.TemplatePreview,Object.assign({},f))}):e.jsx(e.Fragment,{children:e.jsxs(c,Object.assign({channel:p},{children:[e.jsx("img",{alt:"",src:"https://firebasestorage.googleapis.com/v0/b/staging-bikayi.appspot.com/o/bik%2FkNwEVoGlLpVjOsXoO1M8WgvWicP2%2F6f07b850-8b4b-4d58-96cc-8ba6df7b4e4a-Device___Frame.jpg?alt=media&token=253f1bfe-8481-4f54-bdef-3c0a73697d6a",style:{width:o.getPreviewWidth(p),height:443}}),e.jsx(h,Object.assign({ref:i},{children:e.jsx(a.TemplatePreview,Object.assign({},f))}))]}))})}));m.displayName="MobilePreview";const u=d.default.div`
+`,m=p.default.forwardRef(((t,i)=>{let{display_content:n,channel:p,template:d,showSampleValues:m}=t;const{pod:f,hideDeviceContainerInPreview:w}=o.useTemplateModalContext(),b={showSampleValues:m,template:d,channel:p,smsSpecificMeta:{smsDisplayContent:n},whatsAppSpecificMeta:{showWhatsAppHeader:!0,whatsAppExtras:f!==s.POD.CHATBOT,containerStyle:{border:"none",borderBottomRightRadius:0,borderBottomLeftRadius:0,minHeight:426,width:p==r.CHANNEL_TYPE.RCS?"unset":240}},size:"small",hideHeader:!0,emailSpecificMeta:{emailDisplayContent:n,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_mobile",containerStyle:{height:"100%",width:"100%"},templateContainerStyles:{height:"100%"}},isPreview:!0,hidePointerEvents:!0};return w?e.jsx(u,{children:e.jsx(a.TemplatePreview,Object.assign({},b))}):e.jsx(e.Fragment,{children:e.jsxs(c,Object.assign({channel:p},{children:[e.jsx("img",{alt:"",src:"https://firebasestorage.googleapis.com/v0/b/staging-bikayi.appspot.com/o/bik%2FkNwEVoGlLpVjOsXoO1M8WgvWicP2%2F6f07b850-8b4b-4d58-96cc-8ba6df7b4e4a-Device___Frame.jpg?alt=media&token=253f1bfe-8481-4f54-bdef-3c0a73697d6a",style:{width:l.getPreviewWidth(p),height:443}}),e.jsx(h,Object.assign({ref:i},{children:e.jsx(a.TemplatePreview,Object.assign({},b))}))]}))})}));m.displayName="MobilePreview";const u=d.default.div`
 	display: flex;
 	align-items: center;
 	justify-content: center;