npm - @bikdotai/bik-component-library - Versions diffs - 0.0.807 → 0.0.808-beta.0 - Mend

@bikdotai/bik-component-library 0.0.807 → 0.0.808-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1557) hide show

package/dist/esm/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import l from"lodash/cloneDeep";import{useState as s,useEffect as a}from"react";import{Dropdown as n}from"../../dropdown/Dropdown.js";import{Input as i}from"../../input/Input.js";import{editableVarPattern as o}from"../../template-preview/constants/regexPatterns.js";import{UNSUBSCRIBE_URL_OPTION as r,STATIC_URL_CTA_OPTION as u,CUSTOM_URL_NAME as c}from"../../template-preview/models/TemplateMeta.js";import{POD as d}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as b}from"../../TypographyStyle.js";import{COLORS as p}from"../../../constants/Theme.js";import{useTemplateModalContext as m}from"../context/templateModalContext.js";import{UNSUBSCRIBE_URL_VARIABLE as v,STATIC_URL_VARIABLE_NAME as j}from"../utils/constants.js";import{validateIsUrl as g}from"../utils/validateIsUrl.js";import f,{Container as O}from"./VariableConnector.js";const x=x=>{let{variableListIndex:y,button:h,updateSelectedURLTemplateBtn:L,updateSelectedQRBTemplateBtn:R,currentVariableList:U,CTAoptions:V,QRBoptions:T,disableEdit:w}=x;var C,I,E,P,H;const[N,B]=s(""),[_,Q]=s(),k=null==V?void 0:V.map((e=>Object.assign(Object.assign({},e),{selected:(null==_?void 0:_.value)===e.value&&_.label===e.label}))),S=null==T?void 0:T.map((e=>Object.assign(Object.assign({},e),{selected:(null==_?void 0:_.value)===e.value}))),{isError:K,disableEditVariable:Y,pod:$,selectedCarouselIndex:q,originalVariableList:A,setOriginalVariableList:M,isProductCarouselType:D,ctaOptionsErrors:W,setCtaOptionsErrors:z}=m();function F(e){if(B(e),null!=q&&q>-1&&D){const t=l(A);if("URL"===h.type){const l=t.cards.map((t=>{let l=t.buttons.filter((e=>"URL"===e.type))[y];l=Object.assign(Object.assign({},l),{buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]});const s=t.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==l?void 0:l.text)?l:e));return Object.assign(Object.assign({},t),{buttons:s})}));null==M||M((e=>Object.assign(Object.assign({},e),{cards:l}))),null==L||L(`https://${e}`,"custom",y)}return}let t=U.buttons.filter((e=>"URL"===e.type))[y];t=Object.assign(Object.assign({},t),{buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]});const s=U.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),a=Object.assign({},null!=q&&q>-1?A.cards[q]:A);if(a.buttons=s,null!=q&&q>-1){const e=[...A.cards];e[q]=a,null==M||M((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==M||M((e=>Object.assign(Object.assign({},e),{buttons:[...s]})));null==L||L(`https://${e}`,"custom",y)}return a((()=>{var e,t;if(h.buttonVariable===v)return Q(r),void B((null===(e=h.example)||void 0===e?void 0:e[0].split("https://")[1])||"");if(h.buttonVariable&&o.test(h.buttonVariable))h.buttonVariable===j?Q(u):Q(c),B((null===(t=h.example)||void 0===t?void 0:t[0].split("https://")[1])||"");else{let e=-1;const t="URL"===h.type?V:T;e="URL"===h.type?t.findIndex((e=>e.placeHolder===h.buttonVariable)):t.findIndex((e=>e.label===h.flowName)),e>-1?Q(t[e]):null==z||z((e=>Object.assign(Object.assign({},e),{[y]:"Required field!"})))}}),[]),$!==d.CHATBOT?e(O,{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(b,Object.assign({style:{color:p.content.primary}},{children:[h.text," button"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:t(n,{disabled:Y||w,truncatedText:!1,options:"URL"===h.type?"static_link"===(null==_?void 0:_.value)?[u]:k:S,isSearchable:!0,onSelect:function(e,t){null==z||z((e=>(delete e[y],Object.assign({},e))));const s=e;Q(s);const a=("URL"===h.type?V:T).find((e=>e.placeHolder===s.placeHolder));if(a)if("custom_link"!==a.value){if(null!=q&&q>-1&&D){const e=l(A);if("URL"===h.type){const t=e.cards.map((e=>{let t=e.buttons.filter((e=>"URL"===e.type))[y];t=Object.assign(Object.assign({},t),{buttonVariable:s.placeHolder});const l=e.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e));return Object.assign(Object.assign({},e),{buttons:l})}));null==L||L({defaultValue:a.value,placeHolder:a.placeHolder},"placeholder",y),null==M||M((e=>Object.assign(Object.assign({},e),{cards:t})))}else if("QUICK_REPLY"===h.type){const t=e.cards.map((e=>{let t=e.buttons.filter((e=>"QUICK_REPLY"===e.type))[y];t=Object.assign(Object.assign({},t),{flowName:s.label,flowId:s.value});const l=e.buttons.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e));return Object.assign(Object.assign({},e),{buttons:l})}));null==R||R({flowName:s.label,flowId:s.value},"placeholder",y),null==M||M((e=>Object.assign(Object.assign({},e),{cards:t})))}return}let e;if("URL"===h.type){let t=U.buttons.filter((e=>"URL"===e.type))[y];t=Object.assign(Object.assign({},t),{buttonVariable:s.placeHolder,example:[(null==s?void 0:s.value)||"https://d.bik.ai/"]}),e=U.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),null==L||L({defaultValue:a.value,placeHolder:a.placeHolder},"placeholder",y)}else{let t=U.buttons.filter((e=>"QUICK_REPLY"===e.type))[y];t=Object.assign(Object.assign({},t),{flowName:s.label,flowId:s.value}),e=U.buttons.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),null==R||R({flowName:s.label,flowId:s.value},"placeholder",y)}const t=Object.assign({},null!=q&&q>-1?A.cards[q]:A);if(t.buttons=e,null!=q&&q>-1){const e=[...A.cards];e[q]=t,null==M||M((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==M||M((t=>Object.assign(Object.assign({},t),{buttons:[...e]})))}else F("")},defaultOptions:_?[Object.assign(Object.assign({},_),{selected:!0})]:[],error:K?null==W?void 0:W[y]:void 0})})),("custom_link"===(null==_?void 0:_.value)||"static_link"===(null==_?void 0:_.value))&&t("div",Object.assign({style:{marginBottom:20}},{children:t(i,{state:Y||w?"disabled":"none",errorMessage:K?N?g(N)?"":"Enter valid URL":"Required field":"",value:N,prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:F,maxCharLimit:2e3})}))]}):t(f,{index:y,variable:{variableName:null!==(C=h.text)&&void 0!==C?C:"",updatedValue:"((customPlaceholderName))"===h.buttonVariable?`${null===(I=h.example)||void 0===I?void 0:I[0]}`:null!==(E=h.buttonVariable)&&void 0!==E?E:"",type:"link",isEditableVariable:!0,index:null!==(P=h.index)&&void 0!==P?P:0,queryParams:null!==(H=h.queryParams)&&void 0!==H?H:[]},showVariableModal:!0,componentType:"BUTTONS",buttonType:h.type,CTAoptions:V})};export{x as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import l from"lodash/cloneDeep";import{useState as s,useEffect as a}from"react";import{Dropdown as n}from"../../dropdown/Dropdown.js";import{Input as i}from"../../input/Input.js";import{editableVarPattern as o}from"../../template-preview/constants/regexPatterns.js";import{UNSUBSCRIBE_URL_OPTION as r,STATIC_URL_CTA_OPTION as u,CUSTOM_URL_NAME as c}from"../../template-preview/models/TemplateMeta.js";import{POD as d}from"../../template-preview/models/WhatsAppTemplate.js";import{BodySecondary as b}from"../../TypographyStyle.js";import{COLORS as p}from"../../../constants/Theme.js";import{useTemplateModalContext as m}from"../context/templateModalContext.js";import{UNSUBSCRIBE_URL_VARIABLE as v,STATIC_URL_VARIABLE_NAME as j}from"../utils/constants.js";import{validateIsUrl as g}from"../utils/validateIsUrl.js";import f,{Container as O}from"./VariableConnector.js";const x=({variableListIndex:x,button:y,updateSelectedURLTemplateBtn:h,updateSelectedQRBTemplateBtn:L,currentVariableList:R,CTAoptions:U,QRBoptions:V,disableEdit:T})=>{var w,C,I,E,P;const[H,N]=s(""),[B,_]=s(),Q=null==U?void 0:U.map((e=>Object.assign(Object.assign({},e),{selected:(null==B?void 0:B.value)===e.value&&B.label===e.label}))),k=null==V?void 0:V.map((e=>Object.assign(Object.assign({},e),{selected:(null==B?void 0:B.value)===e.value}))),{isError:S,disableEditVariable:K,pod:Y,selectedCarouselIndex:$,originalVariableList:q,setOriginalVariableList:A,isProductCarouselType:M,ctaOptionsErrors:D,setCtaOptionsErrors:W}=m();function z(e){if(N(e),null!=$&&$>-1&&M){const t=l(q);if("URL"===y.type){const l=t.cards.map((t=>{let l=t.buttons.filter((e=>"URL"===e.type))[x];l=Object.assign(Object.assign({},l),{buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]});const s=t.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==l?void 0:l.text)?l:e));return Object.assign(Object.assign({},t),{buttons:s})}));null==A||A((e=>Object.assign(Object.assign({},e),{cards:l}))),null==h||h(`https://${e}`,"custom",x)}return}let t=R.buttons.filter((e=>"URL"===e.type))[x];t=Object.assign(Object.assign({},t),{buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]});const s=R.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),a=Object.assign({},null!=$&&$>-1?q.cards[$]:q);if(a.buttons=s,null!=$&&$>-1){const e=[...q.cards];e[$]=a,null==A||A((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==A||A((e=>Object.assign(Object.assign({},e),{buttons:[...s]})));null==h||h(`https://${e}`,"custom",x)}return a((()=>{var e,t;if(y.buttonVariable===v)return _(r),void N((null===(e=y.example)||void 0===e?void 0:e[0].split("https://")[1])||"");if(y.buttonVariable&&o.test(y.buttonVariable))y.buttonVariable===j?_(u):_(c),N((null===(t=y.example)||void 0===t?void 0:t[0].split("https://")[1])||"");else{let e=-1;const t="URL"===y.type?U:V;e="URL"===y.type?t.findIndex((e=>e.placeHolder===y.buttonVariable)):t.findIndex((e=>e.label===y.flowName)),e>-1?_(t[e]):null==W||W((e=>Object.assign(Object.assign({},e),{[x]:"Required field!"})))}}),[]),Y!==d.CHATBOT?e(O,{children:[t("div",Object.assign({style:{marginBottom:8}},{children:e(b,Object.assign({style:{color:p.content.primary}},{children:[y.text," button"]}))})),t("div",Object.assign({style:{marginBottom:12}},{children:t(n,{disabled:K||T,truncatedText:!1,options:"URL"===y.type?"static_link"===(null==B?void 0:B.value)?[u]:Q:k,isSearchable:!0,onSelect:function(e,t){null==W||W((e=>(delete e[x],Object.assign({},e))));const s=e;_(s);const a=("URL"===y.type?U:V).find((e=>e.placeHolder===s.placeHolder));if(a)if("custom_link"!==a.value){if(null!=$&&$>-1&&M){const e=l(q);if("URL"===y.type){const t=e.cards.map((e=>{let t=e.buttons.filter((e=>"URL"===e.type))[x];t=Object.assign(Object.assign({},t),{buttonVariable:s.placeHolder});const l=e.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e));return Object.assign(Object.assign({},e),{buttons:l})}));null==h||h({defaultValue:a.value,placeHolder:a.placeHolder},"placeholder",x),null==A||A((e=>Object.assign(Object.assign({},e),{cards:t})))}else if("QUICK_REPLY"===y.type){const t=e.cards.map((e=>{let t=e.buttons.filter((e=>"QUICK_REPLY"===e.type))[x];t=Object.assign(Object.assign({},t),{flowName:s.label,flowId:s.value});const l=e.buttons.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e));return Object.assign(Object.assign({},e),{buttons:l})}));null==L||L({flowName:s.label,flowId:s.value},"placeholder",x),null==A||A((e=>Object.assign(Object.assign({},e),{cards:t})))}return}let e;if("URL"===y.type){let t=R.buttons.filter((e=>"URL"===e.type))[x];t=Object.assign(Object.assign({},t),{buttonVariable:s.placeHolder,example:[(null==s?void 0:s.value)||"https://d.bik.ai/"]}),e=R.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),null==h||h({defaultValue:a.value,placeHolder:a.placeHolder},"placeholder",x)}else{let t=R.buttons.filter((e=>"QUICK_REPLY"===e.type))[x];t=Object.assign(Object.assign({},t),{flowName:s.label,flowId:s.value}),e=R.buttons.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),null==L||L({flowName:s.label,flowId:s.value},"placeholder",x)}const t=Object.assign({},null!=$&&$>-1?q.cards[$]:q);if(t.buttons=e,null!=$&&$>-1){const e=[...q.cards];e[$]=t,null==A||A((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==A||A((t=>Object.assign(Object.assign({},t),{buttons:[...e]})))}else z("")},defaultOptions:B?[Object.assign(Object.assign({},B),{selected:!0})]:[],error:S?null==D?void 0:D[x]:void 0})})),("custom_link"===(null==B?void 0:B.value)||"static_link"===(null==B?void 0:B.value))&&t("div",Object.assign({style:{marginBottom:20}},{children:t(i,{state:K||T?"disabled":"none",errorMessage:S?H?g(H)?"":"Enter valid URL":"Required field":"",value:H,prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:z,maxCharLimit:2e3})}))]}):t(f,{index:x,variable:{variableName:null!==(w=y.text)&&void 0!==w?w:"",updatedValue:"((customPlaceholderName))"===y.buttonVariable?`${null===(C=y.example)||void 0===C?void 0:C[0]}`:null!==(I=y.buttonVariable)&&void 0!==I?I:"",type:"link",isEditableVariable:!0,index:null!==(E=y.index)&&void 0!==E?E:0,queryParams:null!==(P=y.queryParams)&&void 0!==P?P:[]},showVariableModal:!0,componentType:"BUTTONS",buttonType:y.type,CTAoptions:U})};export{x as default};
 //# sourceMappingURL=WhatsAppTemplateCardButtonV2.js.map

package/dist/esm/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"WhatsAppTemplateCardButtonV2.js","sources":["../../../../../src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx"],"sourcesContent":["import cloneDeep from 'lodash/cloneDeep';\nimport { useEffect, useState } from 'react';\nimport { Dropdown } from '@src/components/dropdown/Dropdown';\nimport type { DropdownOption, SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input/Input';\nimport { editableVarPattern } from '@src/components/template-preview/constants/regexPatterns';\nimport {\n\tButtonPlaceHolderOptions,\n\tCUSTOM_URL_NAME,\n\tSTATIC_URL_CTA_OPTION,\n\tUNSUBSCRIBE_URL_OPTION,\n} from '@src/components/template-preview/models/TemplateMeta';\nimport type { WhatsAppCarouselTemplateVariables } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport {\n\ttype CTABtnValType,\n\tPOD,\n\ttype QRBBtnValType,\n\ttype TEMPLATE_BUTTON,\n} from '@src/components/template-preview/models/WhatsAppTemplate';\nimport type { WhatsAppTemplateVariables } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport {\n\tSTATIC_URL_VARIABLE_NAME,\n\tUNSUBSCRIBE_URL_VARIABLE,\n} from '../utils/constants';\nimport { validateIsUrl } from '../utils/validateIsUrl';\nimport VariableConnector, { Container } from './VariableConnector';\n\nexport type URLBtnUpdateFunctionType = (\n\tval: CTABtnValType,\n\tmode: 'custom' \| 'placeholder',\n\tbtnIndex?: number,\n) => void;\n\nexport type QRBBtnUpdateFunctionType = (\n\tval: QRBBtnValType,\n\tmode: 'custom' \| 'placeholder',\n\tbtnIndex?: number,\n) => void;\n\ntype optionType = SingleOption & {\n\tplaceHolder: string;\n};\nexport interface WhatsAppTemplateCardButtonV2Props {\n\tcurrentVariableList: WhatsAppTemplateVariables;\n\tupdateSelectedURLTemplateBtn?: URLBtnUpdateFunctionType;\n\tupdateSelectedQRBTemplateBtn?: QRBBtnUpdateFunctionType;\n\tbutton: TEMPLATE_BUTTON;\n\tCTAoptions?: ButtonPlaceHolderOptions[];\n\tQRBoptions?: ButtonPlaceHolderOptions[];\n\tvariableListIndex: number;\n\tdisableEdit?: boolean;\n}\nconst WhatsAppTemplateCardButtonV2: React.FC<\n\tWhatsAppTemplateCardButtonV2Props\n> = ({\n\tvariableListIndex,\n\tbutton,\n\tupdateSelectedURLTemplateBtn,\n\tupdateSelectedQRBTemplateBtn,\n\tcurrentVariableList,\n\tCTAoptions,\n\tQRBoptions,\n\tdisableEdit,\n}) => {\n\tconst [customLink, setCustomLink] = useState('');\n\tconst [selectedOption, setSelectedOption] = useState<SingleOption>();\n\n\t// Updating the selected attribute in the options so that in dropdown the option will be highlighted\n\tconst updatedCTAOptions = CTAoptions?.map((option) => {\n\t\treturn {\n\t\t\t...option,\n\t\t\tselected:\n\t\t\t\tselectedOption?.value === option.value &&\n\t\t\t\tselectedOption.label === option.label,\n\t\t};\n\t});\n\tconst updatedQRBOptions = QRBoptions?.map((option) => {\n\t\treturn {\n\t\t\t...option,\n\t\t\tselected: selectedOption?.value === option.value,\n\t\t};\n\t});\n\n\tconst {\n\t\tisError,\n\t\tdisableEditVariable,\n\t\tpod,\n\t\tselectedCarouselIndex,\n\t\toriginalVariableList,\n\t\tsetOriginalVariableList,\n\t\tisProductCarouselType,\n\t\tctaOptionsErrors,\n\t\tsetCtaOptionsErrors,\n\t} = useTemplateModalContext();\n\n\tuseEffect(() => {\n\t\tif (button.buttonVariable === UNSUBSCRIBE_URL_VARIABLE) {\n\t\t\tsetSelectedOption(UNSUBSCRIBE_URL_OPTION);\n\t\t\tsetCustomLink(button.example?.[0].split('https://')[1] \|\| '');\n\t\t\treturn;\n\t\t}\n\t\tif (\n\t\t\tbutton.buttonVariable &&\n\t\t\teditableVarPattern.test(button.buttonVariable)\n\t\t) {\n\t\t\tif (button.buttonVariable === STATIC_URL_VARIABLE_NAME) {\n\t\t\t\tsetSelectedOption(STATIC_URL_CTA_OPTION);\n\t\t\t} else {\n\t\t\t\tsetSelectedOption(CUSTOM_URL_NAME);\n\t\t\t}\n\t\t\tsetCustomLink(button.example?.[0].split('https://')[1] \|\| '');\n\t\t} else {\n\t\t\tlet index = -1;\n\t\t\tconst options =\n\t\t\t\tbutton.type === 'URL'\n\t\t\t\t\t? (CTAoptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t: (QRBoptions as ButtonPlaceHolderOptions[]);\n\t\t\tif (button.type === 'URL') {\n\t\t\t\tindex = options.findIndex(\n\t\t\t\t\t(op) => op.placeHolder === button.buttonVariable,\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tindex = options.findIndex((op) => op.label === button.flowName);\n\t\t\t}\n\n\t\t\tif (index > -1) {\n\t\t\t\tsetSelectedOption(options[index]);\n\t\t\t} else {\n\t\t\t\tsetCtaOptionsErrors?.((prevState) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...prevState,\n\t\t\t\t\t\t[variableListIndex]: 'Required field!',\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t}\n\t\t}\n\t}, []);\n\n\tfunction handleCustomLink(text: string) {\n\t\tsetCustomLink(text);\n\t\tif (\n\t\t\tselectedCarouselIndex != undefined &&\n\t\t\tselectedCarouselIndex > -1 &&\n\t\t\tisProductCarouselType\n\t\t) {\n\t\t\tconst originalList = cloneDeep(\n\t\t\t\toriginalVariableList as WhatsAppCarouselTemplateVariables,\n\t\t\t);\n\t\t\tif (button.type === 'URL') {\n\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\tconst urlBtns = card.buttons.filter((btn) => btn.type === 'URL');\n\t\t\t\t\tlet currentButton = urlBtns[variableListIndex];\n\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\tbuttonVariable: '((customPlaceholderName))',\n\t\t\t\t\t\texample: [`https://${text}`],\n\t\t\t\t\t};\n\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === currentButton?.text) {\n\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...card,\n\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...pre,\n\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t`https://${text}`,\n\t\t\t\t\t'custom',\n\t\t\t\t\tvariableListIndex,\n\t\t\t\t);\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\t\tconst urlVariables = currentVariableList.buttons.filter(\n\t\t\t(btn) => btn.type === 'URL',\n\t\t);\n\t\tlet urlVariable = urlVariables[variableListIndex];\n\t\turlVariable = {\n\t\t\t...urlVariable,\n\t\t\tbuttonVariable: '((customPlaceholderName))',\n\t\t\texample: [`https://${text}`],\n\t\t};\n\t\tconst updatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\tif (btn.type === 'URL' && btn?.text === urlVariable?.text) {\n\t\t\t\treturn urlVariable;\n\t\t\t} else {\n\t\t\t\treturn btn;\n\t\t\t}\n\t\t});\n\t\tconst newList = {\n\t\t\t...(selectedCarouselIndex != undefined && selectedCarouselIndex > -1\n\t\t\t\t? (originalVariableList as WhatsAppCarouselTemplateVariables).cards[\n\t\t\t\t\t\tselectedCarouselIndex\n\t\t\t\t ]\n\t\t\t\t: (originalVariableList as WhatsAppTemplateVariables)),\n\t\t};\n\t\tnewList.buttons = updatedVariables;\n\t\tif (selectedCarouselIndex != undefined && selectedCarouselIndex > -1) {\n\t\t\tconst cardList = [\n\t\t\t\t...(originalVariableList as WhatsAppCarouselTemplateVariables).cards,\n\t\t\t];\n\t\t\tcardList[selectedCarouselIndex] = newList;\n\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\treturn {\n\t\t\t\t\t...pre,\n\t\t\t\t\tcards: cardList,\n\t\t\t\t};\n\t\t\t});\n\t\t} else {\n\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\treturn {\n\t\t\t\t\t...pre,\n\t\t\t\t\tbuttons: [...updatedVariables],\n\t\t\t\t};\n\t\t\t});\n\t\t}\n\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t`https://${text}`,\n\t\t\t'custom',\n\t\t\tvariableListIndex,\n\t\t);\n\t}\n\n\tfunction handleSelectOnChange(\n\t\toptionName: SingleOption \| SingleOption[],\n\t\tselectedIndex?: number,\n\t) {\n\t\tsetCtaOptionsErrors?.((prevState) => {\n\t\t\tdelete prevState[variableListIndex];\n\t\t\treturn {\n\t\t\t\t...prevState,\n\t\t\t};\n\t\t});\n\t\tconst singleOption = optionName as optionType;\n\t\tsetSelectedOption(singleOption);\n\t\tconst options =\n\t\t\tbutton.type === 'URL'\n\t\t\t\t? (CTAoptions as ButtonPlaceHolderOptions[])\n\t\t\t\t: (QRBoptions as ButtonPlaceHolderOptions[]);\n\t\tconst placeHolder = options.find(\n\t\t\t(option) => option.placeHolder === singleOption.placeHolder,\n\t\t);\n\t\tif (placeHolder) {\n\t\t\tif (placeHolder.value !== 'custom_link') {\n\t\t\t\tif (\n\t\t\t\t\tselectedCarouselIndex != undefined &&\n\t\t\t\t\tselectedCarouselIndex > -1 &&\n\t\t\t\t\tisProductCarouselType\n\t\t\t\t) {\n\t\t\t\t\tconst originalList = cloneDeep(\n\t\t\t\t\t\toriginalVariableList as WhatsAppCarouselTemplateVariables,\n\t\t\t\t\t);\n\t\t\t\t\tif (button.type === 'URL') {\n\t\t\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\t\t\tconst urlBtns = card.buttons.filter((btn) => btn.type === 'URL');\n\t\t\t\t\t\t\tlet currentButton = urlBtns[variableListIndex];\n\t\t\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\t\t\tbuttonVariable: singleOption.placeHolder,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === currentButton?.text) {\n\t\t\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...card,\n\t\t\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tdefaultValue: placeHolder.value,\n\t\t\t\t\t\t\t\tplaceHolder: placeHolder.placeHolder,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t\t);\n\t\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t} else if (button.type === 'QUICK_REPLY') {\n\t\t\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\t\t\tconst qrbBtns = card.buttons.filter(\n\t\t\t\t\t\t\t\t(btn) => btn.type === 'QUICK_REPLY',\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tlet currentButton = qrbBtns[variableListIndex];\n\t\t\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\tbtn.type === 'QUICK_REPLY' &&\n\t\t\t\t\t\t\t\t\tbtn?.text === currentButton?.text\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...card,\n\t\t\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t\tupdateSelectedQRBTemplateBtn?.(\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t\t);\n\t\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tlet updatedVariables;\n\t\t\t\tif (button.type === 'URL') {\n\t\t\t\t\tconst urlVariables = currentVariableList.buttons.filter(\n\t\t\t\t\t\t(btn) => btn.type === 'URL',\n\t\t\t\t\t);\n\t\t\t\t\tlet urlVariable = urlVariables[variableListIndex];\n\t\t\t\t\turlVariable = {\n\t\t\t\t\t\t...urlVariable,\n\t\t\t\t\t\tbuttonVariable: singleOption.placeHolder,\n\t\t\t\t\t\texample: [singleOption?.value \|\| 'https://d.bik.ai/'],\n\t\t\t\t\t};\n\t\t\t\t\tupdatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === urlVariable?.text) {\n\t\t\t\t\t\t\treturn urlVariable;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tdefaultValue: placeHolder.value,\n\t\t\t\t\t\t\tplaceHolder: placeHolder.placeHolder,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\tconst qrbVariables = currentVariableList.buttons.filter(\n\t\t\t\t\t\t(btn) => btn.type === 'QUICK_REPLY',\n\t\t\t\t\t);\n\t\t\t\t\tlet qrbVariable = qrbVariables[variableListIndex];\n\t\t\t\t\tqrbVariable = {\n\t\t\t\t\t\t...qrbVariable,\n\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t};\n\t\t\t\t\tupdatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'QUICK_REPLY' && btn?.text === qrbVariable?.text) {\n\t\t\t\t\t\t\treturn qrbVariable;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tupdateSelectedQRBTemplateBtn?.(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tconst newList = {\n\t\t\t\t\t...(selectedCarouselIndex != undefined && selectedCarouselIndex > -1\n\t\t\t\t\t\t? (originalVariableList as WhatsAppCarouselTemplateVariables).cards[\n\t\t\t\t\t\t\t\tselectedCarouselIndex\n\t\t\t\t\t\t ]\n\t\t\t\t\t\t: (originalVariableList as WhatsAppTemplateVariables)),\n\t\t\t\t};\n\t\t\t\tnewList.buttons = updatedVariables;\n\t\t\t\tif (selectedCarouselIndex != undefined && selectedCarouselIndex > -1) {\n\t\t\t\t\tconst cardList = [\n\t\t\t\t\t\t...(originalVariableList as WhatsAppCarouselTemplateVariables)\n\t\t\t\t\t\t\t.cards,\n\t\t\t\t\t];\n\t\t\t\t\tcardList[selectedCarouselIndex] = newList;\n\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\tcards: cardList,\n\t\t\t\t\t\t};\n\t\t\t\t\t});\n\t\t\t\t} else {\n\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\tbuttons: [...updatedVariables],\n\t\t\t\t\t\t};\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\thandleCustomLink('');\n\t\t\t}\n\t\t}\n\t}\n\n\tif (pod !== POD.CHATBOT) {\n\t\treturn (\n\t\t\t<Container>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 8,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tcolor: COLORS.content.primary,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{button.text} button\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 12,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Dropdown\n\t\t\t\t\t\tdisabled={disableEditVariable \|\| disableEdit}\n\t\t\t\t\t\ttruncatedText={false}\n\t\t\t\t\t\toptions={\n\t\t\t\t\t\t\tbutton.type === 'URL'\n\t\t\t\t\t\t\t\t? selectedOption?.value === 'static_link'\n\t\t\t\t\t\t\t\t\t? [STATIC_URL_CTA_OPTION]\n\t\t\t\t\t\t\t\t\t: (updatedCTAOptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t\t\t\t: (updatedQRBOptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisSearchable={true}\n\t\t\t\t\t\tonSelect={\n\t\t\t\t\t\t\thandleSelectOnChange as (\n\t\t\t\t\t\t\t\toption: DropdownOption \| DropdownOption[],\n\t\t\t\t\t\t\t) => void\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdefaultOptions={\n\t\t\t\t\t\t\tselectedOption\n\t\t\t\t\t\t\t\t? [{ ...selectedOption, selected: true } as DropdownOption]\n\t\t\t\t\t\t\t\t: []\n\t\t\t\t\t\t}\n\t\t\t\t\t\terror={isError ? ctaOptionsErrors?.[variableListIndex] : undefined}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t{(selectedOption?.value === 'custom_link' \|\|\n\t\t\t\t\tselectedOption?.value === 'static_link') && (\n\t\t\t\t\t<div style={{ marginBottom: 20 }}>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tstate={disableEditVariable \|\| disableEdit ? 'disabled' : 'none'}\n\t\t\t\t\t\t\terrorMessage={\n\t\t\t\t\t\t\t\tisError\n\t\t\t\t\t\t\t\t\t? !customLink\n\t\t\t\t\t\t\t\t\t\t? 'Required field'\n\t\t\t\t\t\t\t\t\t\t: !validateIsUrl(customLink)\n\t\t\t\t\t\t\t\t\t\t? 'Enter valid URL'\n\t\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={customLink}\n\t\t\t\t\t\t\tprefixText={'https://'}\n\t\t\t\t\t\t\tplaceholder={'Enter custom URL here'}\n\t\t\t\t\t\t\tonChangeText={handleCustomLink}\n\t\t\t\t\t\t\tmaxCharLimit={2000}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Container>\n\t\t);\n\t} else {\n\t\treturn (\n\t\t\t<VariableConnector\n\t\t\t\t// this index is respect to template variables -> buttons\n\t\t\t\tindex={variableListIndex}\n\t\t\t\tvariable={{\n\t\t\t\t\tvariableName: button.text ?? '',\n\t\t\t\t\tupdatedValue:\n\t\t\t\t\t\tbutton.buttonVariable === '((customPlaceholderName))' //hardcoded for backward compatibility\n\t\t\t\t\t\t\t? `${button.example?.[0]}`\n\t\t\t\t\t\t\t: button.buttonVariable ?? '',\n\t\t\t\t\ttype: 'link', // since this is a url, type will be link\n\t\t\t\t\tisEditableVariable: true,\n\t\t\t\t\tindex: button.index ?? 0, // this index is respect to components -> buttons\n\t\t\t\t\tqueryParams: button.queryParams ?? [],\n\t\t\t\t}}\n\t\t\t\tshowVariableModal={true}\n\t\t\t\tcomponentType={'BUTTONS'}\n\t\t\t\tbuttonType={button.type}\n\t\t\t\tCTAoptions={CTAoptions} // dropdown values - for readable display name of variable in backward compatibility\n\t\t\t/>\n\t\t);\n\t}\n};\n\nexport default WhatsAppTemplateCardButtonV2;\n"],"names":["WhatsAppTemplateCardButtonV2","_ref","variableListIndex","button","updateSelectedURLTemplateBtn","updateSelectedQRBTemplateBtn","currentVariableList","CTAoptions","QRBoptions","disableEdit","customLink","setCustomLink","useState","selectedOption","setSelectedOption","updatedCTAOptions","map","option","Object","assign","selected","value","label","updatedQRBOptions","isError","disableEditVariable","pod","selectedCarouselIndex","originalVariableList","setOriginalVariableList","isProductCarouselType","ctaOptionsErrors","setCtaOptionsErrors","useTemplateModalContext","handleCustomLink","text","undefined","originalList","cloneDeep","type","newList","cards","card","currentButton","buttons","filter","btn","buttonVariable","example","updatedButtons","pre","urlVariable","updatedVariables","cardList","useEffect","UNSUBSCRIBE_URL_VARIABLE","UNSUBSCRIBE_URL_OPTION","_a","split","editableVarPattern","test","STATIC_URL_VARIABLE_NAME","STATIC_URL_CTA_OPTION","CUSTOM_URL_NAME","_b","index","options","findIndex","op","placeHolder","flowName","prevState","POD","CHATBOT","_jsxs","Container","children","_jsx","style","marginBottom","BodySecondary","color","COLORS","content","primary","Dropdown","disabled","truncatedText","isSearchable","onSelect","optionName","selectedIndex","singleOption","find","defaultValue","flowId","qrbVariable","defaultOptions","error","Input","state","errorMessage","validateIsUrl","prefixText","placeholder","onChangeText","maxCharLimit","VariableConnector","variable","variableName","updatedValue","_c","isEditableVariable","_d","queryParams","_e","showVariableModal","componentType","buttonType"],"mappings":"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"}
1	+ {"version":3,"file":"WhatsAppTemplateCardButtonV2.js","sources":["../../../../../src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx"],"sourcesContent":["import cloneDeep from 'lodash/cloneDeep';\nimport { useEffect, useState } from 'react';\nimport { Dropdown } from '@src/components/dropdown/Dropdown';\nimport type { DropdownOption, SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input/Input';\nimport { editableVarPattern } from '@src/components/template-preview/constants/regexPatterns';\nimport {\n\tButtonPlaceHolderOptions,\n\tCUSTOM_URL_NAME,\n\tSTATIC_URL_CTA_OPTION,\n\tUNSUBSCRIBE_URL_OPTION,\n} from '@src/components/template-preview/models/TemplateMeta';\nimport type { WhatsAppCarouselTemplateVariables } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport {\n\ttype CTABtnValType,\n\tPOD,\n\ttype QRBBtnValType,\n\ttype TEMPLATE_BUTTON,\n} from '@src/components/template-preview/models/WhatsAppTemplate';\nimport type { WhatsAppTemplateVariables } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport {\n\tSTATIC_URL_VARIABLE_NAME,\n\tUNSUBSCRIBE_URL_VARIABLE,\n} from '../utils/constants';\nimport { validateIsUrl } from '../utils/validateIsUrl';\nimport VariableConnector, { Container } from './VariableConnector';\n\nexport type URLBtnUpdateFunctionType = (\n\tval: CTABtnValType,\n\tmode: 'custom' \| 'placeholder',\n\tbtnIndex?: number,\n) => void;\n\nexport type QRBBtnUpdateFunctionType = (\n\tval: QRBBtnValType,\n\tmode: 'custom' \| 'placeholder',\n\tbtnIndex?: number,\n) => void;\n\ntype optionType = SingleOption & {\n\tplaceHolder: string;\n};\nexport interface WhatsAppTemplateCardButtonV2Props {\n\tcurrentVariableList: WhatsAppTemplateVariables;\n\tupdateSelectedURLTemplateBtn?: URLBtnUpdateFunctionType;\n\tupdateSelectedQRBTemplateBtn?: QRBBtnUpdateFunctionType;\n\tbutton: TEMPLATE_BUTTON;\n\tCTAoptions?: ButtonPlaceHolderOptions[];\n\tQRBoptions?: ButtonPlaceHolderOptions[];\n\tvariableListIndex: number;\n\tdisableEdit?: boolean;\n}\nconst WhatsAppTemplateCardButtonV2: React.FC<\n\tWhatsAppTemplateCardButtonV2Props\n> = ({\n\tvariableListIndex,\n\tbutton,\n\tupdateSelectedURLTemplateBtn,\n\tupdateSelectedQRBTemplateBtn,\n\tcurrentVariableList,\n\tCTAoptions,\n\tQRBoptions,\n\tdisableEdit,\n}) => {\n\tconst [customLink, setCustomLink] = useState('');\n\tconst [selectedOption, setSelectedOption] = useState<SingleOption>();\n\n\t// Updating the selected attribute in the options so that in dropdown the option will be highlighted\n\tconst updatedCTAOptions = CTAoptions?.map((option) => {\n\t\treturn {\n\t\t\t...option,\n\t\t\tselected:\n\t\t\t\tselectedOption?.value === option.value &&\n\t\t\t\tselectedOption.label === option.label,\n\t\t};\n\t});\n\tconst updatedQRBOptions = QRBoptions?.map((option) => {\n\t\treturn {\n\t\t\t...option,\n\t\t\tselected: selectedOption?.value === option.value,\n\t\t};\n\t});\n\n\tconst {\n\t\tisError,\n\t\tdisableEditVariable,\n\t\tpod,\n\t\tselectedCarouselIndex,\n\t\toriginalVariableList,\n\t\tsetOriginalVariableList,\n\t\tisProductCarouselType,\n\t\tctaOptionsErrors,\n\t\tsetCtaOptionsErrors,\n\t} = useTemplateModalContext();\n\n\tuseEffect(() => {\n\t\tif (button.buttonVariable === UNSUBSCRIBE_URL_VARIABLE) {\n\t\t\tsetSelectedOption(UNSUBSCRIBE_URL_OPTION);\n\t\t\tsetCustomLink(button.example?.[0].split('https://')[1] \|\| '');\n\t\t\treturn;\n\t\t}\n\t\tif (\n\t\t\tbutton.buttonVariable &&\n\t\t\teditableVarPattern.test(button.buttonVariable)\n\t\t) {\n\t\t\tif (button.buttonVariable === STATIC_URL_VARIABLE_NAME) {\n\t\t\t\tsetSelectedOption(STATIC_URL_CTA_OPTION);\n\t\t\t} else {\n\t\t\t\tsetSelectedOption(CUSTOM_URL_NAME);\n\t\t\t}\n\t\t\tsetCustomLink(button.example?.[0].split('https://')[1] \|\| '');\n\t\t} else {\n\t\t\tlet index = -1;\n\t\t\tconst options =\n\t\t\t\tbutton.type === 'URL'\n\t\t\t\t\t? (CTAoptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t: (QRBoptions as ButtonPlaceHolderOptions[]);\n\t\t\tif (button.type === 'URL') {\n\t\t\t\tindex = options.findIndex(\n\t\t\t\t\t(op) => op.placeHolder === button.buttonVariable,\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tindex = options.findIndex((op) => op.label === button.flowName);\n\t\t\t}\n\n\t\t\tif (index > -1) {\n\t\t\t\tsetSelectedOption(options[index]);\n\t\t\t} else {\n\t\t\t\tsetCtaOptionsErrors?.((prevState) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...prevState,\n\t\t\t\t\t\t[variableListIndex]: 'Required field!',\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t}\n\t\t}\n\t}, []);\n\n\tfunction handleCustomLink(text: string) {\n\t\tsetCustomLink(text);\n\t\tif (\n\t\t\tselectedCarouselIndex != undefined &&\n\t\t\tselectedCarouselIndex > -1 &&\n\t\t\tisProductCarouselType\n\t\t) {\n\t\t\tconst originalList = cloneDeep(\n\t\t\t\toriginalVariableList as WhatsAppCarouselTemplateVariables,\n\t\t\t);\n\t\t\tif (button.type === 'URL') {\n\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\tconst urlBtns = card.buttons.filter((btn) => btn.type === 'URL');\n\t\t\t\t\tlet currentButton = urlBtns[variableListIndex];\n\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\tbuttonVariable: '((customPlaceholderName))',\n\t\t\t\t\t\texample: [`https://${text}`],\n\t\t\t\t\t};\n\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === currentButton?.text) {\n\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...card,\n\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...pre,\n\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t`https://${text}`,\n\t\t\t\t\t'custom',\n\t\t\t\t\tvariableListIndex,\n\t\t\t\t);\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\t\tconst urlVariables = currentVariableList.buttons.filter(\n\t\t\t(btn) => btn.type === 'URL',\n\t\t);\n\t\tlet urlVariable = urlVariables[variableListIndex];\n\t\turlVariable = {\n\t\t\t...urlVariable,\n\t\t\tbuttonVariable: '((customPlaceholderName))',\n\t\t\texample: [`https://${text}`],\n\t\t};\n\t\tconst updatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\tif (btn.type === 'URL' && btn?.text === urlVariable?.text) {\n\t\t\t\treturn urlVariable;\n\t\t\t} else {\n\t\t\t\treturn btn;\n\t\t\t}\n\t\t});\n\t\tconst newList = {\n\t\t\t...(selectedCarouselIndex != undefined && selectedCarouselIndex > -1\n\t\t\t\t? (originalVariableList as WhatsAppCarouselTemplateVariables).cards[\n\t\t\t\t\t\tselectedCarouselIndex\n\t\t\t\t ]\n\t\t\t\t: (originalVariableList as WhatsAppTemplateVariables)),\n\t\t};\n\t\tnewList.buttons = updatedVariables;\n\t\tif (selectedCarouselIndex != undefined && selectedCarouselIndex > -1) {\n\t\t\tconst cardList = [\n\t\t\t\t...(originalVariableList as WhatsAppCarouselTemplateVariables).cards,\n\t\t\t];\n\t\t\tcardList[selectedCarouselIndex] = newList;\n\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\treturn {\n\t\t\t\t\t...pre,\n\t\t\t\t\tcards: cardList,\n\t\t\t\t};\n\t\t\t});\n\t\t} else {\n\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\treturn {\n\t\t\t\t\t...pre,\n\t\t\t\t\tbuttons: [...updatedVariables],\n\t\t\t\t};\n\t\t\t});\n\t\t}\n\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t`https://${text}`,\n\t\t\t'custom',\n\t\t\tvariableListIndex,\n\t\t);\n\t}\n\n\tfunction handleSelectOnChange(\n\t\toptionName: SingleOption \| SingleOption[],\n\t\tselectedIndex?: number,\n\t) {\n\t\tsetCtaOptionsErrors?.((prevState) => {\n\t\t\tdelete prevState[variableListIndex];\n\t\t\treturn {\n\t\t\t\t...prevState,\n\t\t\t};\n\t\t});\n\t\tconst singleOption = optionName as optionType;\n\t\tsetSelectedOption(singleOption);\n\t\tconst options =\n\t\t\tbutton.type === 'URL'\n\t\t\t\t? (CTAoptions as ButtonPlaceHolderOptions[])\n\t\t\t\t: (QRBoptions as ButtonPlaceHolderOptions[]);\n\t\tconst placeHolder = options.find(\n\t\t\t(option) => option.placeHolder === singleOption.placeHolder,\n\t\t);\n\t\tif (placeHolder) {\n\t\t\tif (placeHolder.value !== 'custom_link') {\n\t\t\t\tif (\n\t\t\t\t\tselectedCarouselIndex != undefined &&\n\t\t\t\t\tselectedCarouselIndex > -1 &&\n\t\t\t\t\tisProductCarouselType\n\t\t\t\t) {\n\t\t\t\t\tconst originalList = cloneDeep(\n\t\t\t\t\t\toriginalVariableList as WhatsAppCarouselTemplateVariables,\n\t\t\t\t\t);\n\t\t\t\t\tif (button.type === 'URL') {\n\t\t\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\t\t\tconst urlBtns = card.buttons.filter((btn) => btn.type === 'URL');\n\t\t\t\t\t\t\tlet currentButton = urlBtns[variableListIndex];\n\t\t\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\t\t\tbuttonVariable: singleOption.placeHolder,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === currentButton?.text) {\n\t\t\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...card,\n\t\t\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tdefaultValue: placeHolder.value,\n\t\t\t\t\t\t\t\tplaceHolder: placeHolder.placeHolder,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t\t);\n\t\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t} else if (button.type === 'QUICK_REPLY') {\n\t\t\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\t\t\tconst qrbBtns = card.buttons.filter(\n\t\t\t\t\t\t\t\t(btn) => btn.type === 'QUICK_REPLY',\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tlet currentButton = qrbBtns[variableListIndex];\n\t\t\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\tbtn.type === 'QUICK_REPLY' &&\n\t\t\t\t\t\t\t\t\tbtn?.text === currentButton?.text\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...card,\n\t\t\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t\tupdateSelectedQRBTemplateBtn?.(\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t\t);\n\t\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tlet updatedVariables;\n\t\t\t\tif (button.type === 'URL') {\n\t\t\t\t\tconst urlVariables = currentVariableList.buttons.filter(\n\t\t\t\t\t\t(btn) => btn.type === 'URL',\n\t\t\t\t\t);\n\t\t\t\t\tlet urlVariable = urlVariables[variableListIndex];\n\t\t\t\t\turlVariable = {\n\t\t\t\t\t\t...urlVariable,\n\t\t\t\t\t\tbuttonVariable: singleOption.placeHolder,\n\t\t\t\t\t\texample: [singleOption?.value \|\| 'https://d.bik.ai/'],\n\t\t\t\t\t};\n\t\t\t\t\tupdatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === urlVariable?.text) {\n\t\t\t\t\t\t\treturn urlVariable;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tdefaultValue: placeHolder.value,\n\t\t\t\t\t\t\tplaceHolder: placeHolder.placeHolder,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\tconst qrbVariables = currentVariableList.buttons.filter(\n\t\t\t\t\t\t(btn) => btn.type === 'QUICK_REPLY',\n\t\t\t\t\t);\n\t\t\t\t\tlet qrbVariable = qrbVariables[variableListIndex];\n\t\t\t\t\tqrbVariable = {\n\t\t\t\t\t\t...qrbVariable,\n\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t};\n\t\t\t\t\tupdatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'QUICK_REPLY' && btn?.text === qrbVariable?.text) {\n\t\t\t\t\t\t\treturn qrbVariable;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tupdateSelectedQRBTemplateBtn?.(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tconst newList = {\n\t\t\t\t\t...(selectedCarouselIndex != undefined && selectedCarouselIndex > -1\n\t\t\t\t\t\t? (originalVariableList as WhatsAppCarouselTemplateVariables).cards[\n\t\t\t\t\t\t\t\tselectedCarouselIndex\n\t\t\t\t\t\t ]\n\t\t\t\t\t\t: (originalVariableList as WhatsAppTemplateVariables)),\n\t\t\t\t};\n\t\t\t\tnewList.buttons = updatedVariables;\n\t\t\t\tif (selectedCarouselIndex != undefined && selectedCarouselIndex > -1) {\n\t\t\t\t\tconst cardList = [\n\t\t\t\t\t\t...(originalVariableList as WhatsAppCarouselTemplateVariables)\n\t\t\t\t\t\t\t.cards,\n\t\t\t\t\t];\n\t\t\t\t\tcardList[selectedCarouselIndex] = newList;\n\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\tcards: cardList,\n\t\t\t\t\t\t};\n\t\t\t\t\t});\n\t\t\t\t} else {\n\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\tbuttons: [...updatedVariables],\n\t\t\t\t\t\t};\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\thandleCustomLink('');\n\t\t\t}\n\t\t}\n\t}\n\n\tif (pod !== POD.CHATBOT) {\n\t\treturn (\n\t\t\t<Container>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 8,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tcolor: COLORS.content.primary,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{button.text} button\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 12,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Dropdown\n\t\t\t\t\t\tdisabled={disableEditVariable \|\| disableEdit}\n\t\t\t\t\t\ttruncatedText={false}\n\t\t\t\t\t\toptions={\n\t\t\t\t\t\t\tbutton.type === 'URL'\n\t\t\t\t\t\t\t\t? selectedOption?.value === 'static_link'\n\t\t\t\t\t\t\t\t\t? [STATIC_URL_CTA_OPTION]\n\t\t\t\t\t\t\t\t\t: (updatedCTAOptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t\t\t\t: (updatedQRBOptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisSearchable={true}\n\t\t\t\t\t\tonSelect={\n\t\t\t\t\t\t\thandleSelectOnChange as (\n\t\t\t\t\t\t\t\toption: DropdownOption \| DropdownOption[],\n\t\t\t\t\t\t\t) => void\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdefaultOptions={\n\t\t\t\t\t\t\tselectedOption\n\t\t\t\t\t\t\t\t? [{ ...selectedOption, selected: true } as DropdownOption]\n\t\t\t\t\t\t\t\t: []\n\t\t\t\t\t\t}\n\t\t\t\t\t\terror={isError ? ctaOptionsErrors?.[variableListIndex] : undefined}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t{(selectedOption?.value === 'custom_link' \|\|\n\t\t\t\t\tselectedOption?.value === 'static_link') && (\n\t\t\t\t\t<div style={{ marginBottom: 20 }}>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tstate={disableEditVariable \|\| disableEdit ? 'disabled' : 'none'}\n\t\t\t\t\t\t\terrorMessage={\n\t\t\t\t\t\t\t\tisError\n\t\t\t\t\t\t\t\t\t? !customLink\n\t\t\t\t\t\t\t\t\t\t? 'Required field'\n\t\t\t\t\t\t\t\t\t\t: !validateIsUrl(customLink)\n\t\t\t\t\t\t\t\t\t\t? 'Enter valid URL'\n\t\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={customLink}\n\t\t\t\t\t\t\tprefixText={'https://'}\n\t\t\t\t\t\t\tplaceholder={'Enter custom URL here'}\n\t\t\t\t\t\t\tonChangeText={handleCustomLink}\n\t\t\t\t\t\t\tmaxCharLimit={2000}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Container>\n\t\t);\n\t} else {\n\t\treturn (\n\t\t\t<VariableConnector\n\t\t\t\t// this index is respect to template variables -> buttons\n\t\t\t\tindex={variableListIndex}\n\t\t\t\tvariable={{\n\t\t\t\t\tvariableName: button.text ?? '',\n\t\t\t\t\tupdatedValue:\n\t\t\t\t\t\tbutton.buttonVariable === '((customPlaceholderName))' //hardcoded for backward compatibility\n\t\t\t\t\t\t\t? `${button.example?.[0]}`\n\t\t\t\t\t\t\t: button.buttonVariable ?? '',\n\t\t\t\t\ttype: 'link', // since this is a url, type will be link\n\t\t\t\t\tisEditableVariable: true,\n\t\t\t\t\tindex: button.index ?? 0, // this index is respect to components -> buttons\n\t\t\t\t\tqueryParams: button.queryParams ?? [],\n\t\t\t\t}}\n\t\t\t\tshowVariableModal={true}\n\t\t\t\tcomponentType={'BUTTONS'}\n\t\t\t\tbuttonType={button.type}\n\t\t\t\tCTAoptions={CTAoptions} // dropdown values - for readable display name of variable in backward compatibility\n\t\t\t/>\n\t\t);\n\t}\n};\n\nexport default WhatsAppTemplateCardButtonV2;\n"],"names":["WhatsAppTemplateCardButtonV2","variableListIndex","button","updateSelectedURLTemplateBtn","updateSelectedQRBTemplateBtn","currentVariableList","CTAoptions","QRBoptions","disableEdit","customLink","setCustomLink","useState","selectedOption","setSelectedOption","updatedCTAOptions","map","option","Object","assign","selected","value","label","updatedQRBOptions","isError","disableEditVariable","pod","selectedCarouselIndex","originalVariableList","setOriginalVariableList","isProductCarouselType","ctaOptionsErrors","setCtaOptionsErrors","useTemplateModalContext","handleCustomLink","text","undefined","originalList","cloneDeep","type","newList","cards","card","currentButton","buttons","filter","btn","buttonVariable","example","updatedButtons","pre","urlVariable","updatedVariables","cardList","useEffect","UNSUBSCRIBE_URL_VARIABLE","UNSUBSCRIBE_URL_OPTION","_a","split","editableVarPattern","test","STATIC_URL_VARIABLE_NAME","STATIC_URL_CTA_OPTION","CUSTOM_URL_NAME","_b","index","options","findIndex","op","placeHolder","flowName","prevState","POD","CHATBOT","_jsxs","Container","children","_jsx","style","marginBottom","BodySecondary","color","COLORS","content","primary","Dropdown","disabled","truncatedText","isSearchable","onSelect","optionName","selectedIndex","singleOption","find","defaultValue","flowId","qrbVariable","defaultOptions","error","Input","state","errorMessage","validateIsUrl","prefixText","placeholder","onChangeText","maxCharLimit","VariableConnector","variable","variableName","updatedValue","_c","isEditableVariable","_d","queryParams","_e","showVariableModal","componentType","buttonType"],"mappings":"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"}

package/dist/esm/components/template-context-mapper/styles/TemplateAnalyticsStyles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TemplateAnalyticsStyles.js","sources":["../../../../../src/components/template-context-mapper/styles/TemplateAnalyticsStyles.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { TitleMedium } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const TemplateContainer = styled.div`\n\tdisplay: flex;\n\tpadding: 16px 0px;\n`;\n\nexport const RightPanelContainer = styled.div<{ fullWidth?: boolean }>`\n\tmax-width: ${(props) => (props.fullWidth ? 'none' : '450px')};\n\theight: 456px;\n\tmin-width: 358px;\n\toverflow-y: auto;\n\tborder-left: ${(props) =>\n\t\tprops.fullWidth ? 'none' : `${COLORS.stroke.primary} 1px solid`};\n\tpadding: 0px 23px 32px 23px;\n\tgap: 16px;\n\t${(props) => props.fullWidth && 'flex: 1;'}\n\t.each--analytics--container {\n\t\tborder: 1px solid ${COLORS.background.inactive};\n\t\tborder-radius: 8px;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tflex-direction: row;\n\t\tpadding: 16px;\n\t\tjustify-content: space-between;\n\t\tmargin-bottom: 16px;\n\t}\n\t.each--icon--container {\n\t\tbackground-color: ${COLORS.background.brandLight};\n\t\twidth: 24px;\n\t\theight: 24px;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tborder-radius: 4px;\n\t}\n\t.align--center {\n\t\talign-items: center;\n\t}\n`;\n\nexport const LeftPanelContainer = styled.div`\n\tpadding: 0px 23px 32px 23px;\n\tflex: 1;\n\theight: 456px;\n\toverflow-y: auto;\n\tmin-width: 286px;\n\tdisplay: flex;\n\talign-items: center;\n\t.inside--container {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tgap: 16px;\n\t}\n\t.icon--container {\n\t\tbackground: ${COLORS.background.warning.light};\n\t\twidth: 64px;\n\t\theight: 64px;\n\t\tborder-radius: 50%;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t}\n`;\n\nexport const CustomTitleMedium = styled(TitleMedium)`\n\twhite-space: nowrap;\n\tmax-width: 161px;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n`;\n"],"names":["TemplateContainer","styled","div","RightPanelContainer","props","fullWidth","COLORS","stroke","primary","background","inactive","brandLight","LeftPanelContainer","warning","light","CustomTitleMedium","TitleMedium"],"mappings":"6IAIaA,MAAAA,EAAoBC,EAAOC,GAAG;;;EAK9BC,EAAsBF,EAAOC,GAA4B;cACvDE,GAAWA,EAAMC,UAAY,OAAS;;;;gBAIpCD,GACfA,EAAMC,UAAY,~~OAAY~~,~~GAAAC~~,EAAOC,OAAOC;;;GAG1CJ,GAAUA,EAAMC,WAAa;;sBAEXC,EAAOG,WAAWC;;;;;;;;;;sBAUlBJ,EAAOG,WAAWE;;;;;;;;;;;EAa3BC,EAAqBX,EAAOC,GAAG;;;;;;;;;;;;;;;;gBAgB5BI,EAAOG,WAAWI,QAAQC;;;;;;;;EAU7BC,EAAoBd,EAAOe,EAAY;;;;;"}
1	+ {"version":3,"file":"TemplateAnalyticsStyles.js","sources":["../../../../../src/components/template-context-mapper/styles/TemplateAnalyticsStyles.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { TitleMedium } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const TemplateContainer = styled.div`\n\tdisplay: flex;\n\tpadding: 16px 0px;\n`;\n\nexport const RightPanelContainer = styled.div<{ fullWidth?: boolean }>`\n\tmax-width: ${(props) => (props.fullWidth ? 'none' : '450px')};\n\theight: 456px;\n\tmin-width: 358px;\n\toverflow-y: auto;\n\tborder-left: ${(props) =>\n\t\tprops.fullWidth ? 'none' : `${COLORS.stroke.primary} 1px solid`};\n\tpadding: 0px 23px 32px 23px;\n\tgap: 16px;\n\t${(props) => props.fullWidth && 'flex: 1;'}\n\t.each--analytics--container {\n\t\tborder: 1px solid ${COLORS.background.inactive};\n\t\tborder-radius: 8px;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tflex-direction: row;\n\t\tpadding: 16px;\n\t\tjustify-content: space-between;\n\t\tmargin-bottom: 16px;\n\t}\n\t.each--icon--container {\n\t\tbackground-color: ${COLORS.background.brandLight};\n\t\twidth: 24px;\n\t\theight: 24px;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tborder-radius: 4px;\n\t}\n\t.align--center {\n\t\talign-items: center;\n\t}\n`;\n\nexport const LeftPanelContainer = styled.div`\n\tpadding: 0px 23px 32px 23px;\n\tflex: 1;\n\theight: 456px;\n\toverflow-y: auto;\n\tmin-width: 286px;\n\tdisplay: flex;\n\talign-items: center;\n\t.inside--container {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t\tgap: 16px;\n\t}\n\t.icon--container {\n\t\tbackground: ${COLORS.background.warning.light};\n\t\twidth: 64px;\n\t\theight: 64px;\n\t\tborder-radius: 50%;\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tjustify-content: center;\n\t}\n`;\n\nexport const CustomTitleMedium = styled(TitleMedium)`\n\twhite-space: nowrap;\n\tmax-width: 161px;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n`;\n"],"names":["TemplateContainer","styled","div","RightPanelContainer","props","fullWidth","COLORS","stroke","primary","background","inactive","brandLight","LeftPanelContainer","warning","light","CustomTitleMedium","TitleMedium"],"mappings":"6IAIaA,MAAAA,EAAoBC,EAAOC,GAAG;;;EAK9BC,EAAsBF,EAAOC,GAA4B;cACvDE,GAAWA,EAAMC,UAAY,OAAS;;;;gBAIpCD,GACfA,EAAMC,UAAY,OAAS,GAAGC,EAAOC,OAAOC;;;GAG1CJ,GAAUA,EAAMC,WAAa;;sBAEXC,EAAOG,WAAWC;;;;;;;;;;sBAUlBJ,EAAOG,WAAWE;;;;;;;;;;;EAa3BC,EAAqBX,EAAOC,GAAG;;;;;;;;;;;;;;;;gBAgB5BI,EAAOG,WAAWI,QAAQC;;;;;;;;EAU7BC,EAAoBd,EAAOe,EAAY;;;;;"}

package/dist/esm/components/template-preview/EmailTemplatePreview.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmailTemplatePreview.styled.js","sources":["../../../../src/components/template-preview/EmailTemplatePreview.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { BASE_COLORS, COLORS } from '@src/constants/Theme';\n\nexport const Header = styled.div`\n\tpadding: 16px;\n\tpadding-bottom: 12px;\n\tborder-top-left-radius: 4px;\n\tborder-top-right-radius: 4px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n`;\n\nexport const ImageContainer = styled.div<{ hideHeader?: boolean }>`\n\twidth: 100%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder-left: 1px solid ${COLORS.stroke.primary};\n\tborder-right: 1px solid ${COLORS.stroke.primary};\n\tborder-top-color: ${COLORS.stroke.primary};\n\tborder-top-width: ${(props) => (props.hideHeader ? '1px' : '0px')};\n\toverflow: scroll;\n`;\n\nexport const CardLoadingContainer = styled.div<{ hideHeader?: boolean }>`\n\twidth: 100%;\n\theight: 100%;\n\tbackground-color: ${BASE_COLORS.grayscale['100']};\n`;\n\nexport const IframeContainer = styled.div<{ applyBorderBottom?: boolean }>`\n\theight: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-grow: 1;\n\tmin-height: 180px;\n\tborder-left: 1px solid ${COLORS.stroke.primary};\n\tborder-right: 1px solid ${COLORS.stroke.primary};\n\n\tborder-radius: ${(props) =>\n\t\tprops.applyBorderBottom ? '0 0 8px 8px' : 'unset'};\n\tborder-bottom: ${(props) =>\n\t\tprops.applyBorderBottom ? `1px solid ${COLORS.stroke.primary}` : ''};\n`;\n\nexport const ViewButton = styled.div`\n\tdisplay: flex;\n\tjustify-content: center;\n\twidth: 100%;\n\tbackground: ${COLORS.surface.standard};\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n`;\n\nexport const EmailContainer = styled.div<{ hideHeader?: boolean }>`\n\tborder-radius: 4px;\n\tbackground-color: ${COLORS.surface.standard};\n\tmargin-top: ${(props) => (props.hideHeader ? 0 : 16)};\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n"],"names":["Header","styled","div","COLORS","stroke","primary","ImageContainer","props","hideHeader","CardLoadingContainer","BASE_COLORS","grayscale","IframeContainer","applyBorderBottom","ViewButton","surface","standard","EmailContainer"],"mappings":"oGAGaA,MAAAA,EAASC,EAAOC,GAAG;;;;;qBAKXC,EAAOC,OAAOC;EAGtBC,EAAiBL,EAAOC,GAA6B;;;;;0BAKxCC,EAAOC,OAAOC;2BACbF,EAAOC,OAAOC;qBACpBF,EAAOC,OAAOC;qBACbE,GAAWA,EAAMC,WAAa,MAAQ;;EAI/CC,EAAuBR,EAAOC,GAA6B;;;qBAGnDQ,EAAYC,UAAU;EAG9BC,EAAkBX,EAAOC,GAAoC;;;;;;;;0BAQhDC,EAAOC,OAAOC;2BACbF,EAAOC,OAAOC;;kBAEtBE,GACjBA,EAAMM,kBAAoB,cAAgB;kBACzBN,GACjBA,EAAMM~~,+BAAiCV~~,EAAOC,OAAOC,UAAY;EAGtDS,EAAab,EAAOC,GAAG;;;;eAIrBC,EAAOY,QAAQC;;;qBAGTb,EAAOC,OAAOC;EAGtBY,EAAiBhB,EAAOC,GAA6B;;qBAE7CC,EAAOY,QAAQC;eACpBT,GAAWA,EAAMC,WAAa,EAAI;;;"}
1	+ {"version":3,"file":"EmailTemplatePreview.styled.js","sources":["../../../../src/components/template-preview/EmailTemplatePreview.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { BASE_COLORS, COLORS } from '@src/constants/Theme';\n\nexport const Header = styled.div`\n\tpadding: 16px;\n\tpadding-bottom: 12px;\n\tborder-top-left-radius: 4px;\n\tborder-top-right-radius: 4px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n`;\n\nexport const ImageContainer = styled.div<{ hideHeader?: boolean }>`\n\twidth: 100%;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tborder-left: 1px solid ${COLORS.stroke.primary};\n\tborder-right: 1px solid ${COLORS.stroke.primary};\n\tborder-top-color: ${COLORS.stroke.primary};\n\tborder-top-width: ${(props) => (props.hideHeader ? '1px' : '0px')};\n\toverflow: scroll;\n`;\n\nexport const CardLoadingContainer = styled.div<{ hideHeader?: boolean }>`\n\twidth: 100%;\n\theight: 100%;\n\tbackground-color: ${BASE_COLORS.grayscale['100']};\n`;\n\nexport const IframeContainer = styled.div<{ applyBorderBottom?: boolean }>`\n\theight: 100%;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\tflex-grow: 1;\n\tmin-height: 180px;\n\tborder-left: 1px solid ${COLORS.stroke.primary};\n\tborder-right: 1px solid ${COLORS.stroke.primary};\n\n\tborder-radius: ${(props) =>\n\t\tprops.applyBorderBottom ? '0 0 8px 8px' : 'unset'};\n\tborder-bottom: ${(props) =>\n\t\tprops.applyBorderBottom ? `1px solid ${COLORS.stroke.primary}` : ''};\n`;\n\nexport const ViewButton = styled.div`\n\tdisplay: flex;\n\tjustify-content: center;\n\twidth: 100%;\n\tbackground: ${COLORS.surface.standard};\n\tborder-bottom-left-radius: 4px;\n\tborder-bottom-right-radius: 4px;\n\tborder: 1px solid ${COLORS.stroke.primary};\n`;\n\nexport const EmailContainer = styled.div<{ hideHeader?: boolean }>`\n\tborder-radius: 4px;\n\tbackground-color: ${COLORS.surface.standard};\n\tmargin-top: ${(props) => (props.hideHeader ? 0 : 16)};\n\tdisplay: flex;\n\tflex-direction: column;\n`;\n"],"names":["Header","styled","div","COLORS","stroke","primary","ImageContainer","props","hideHeader","CardLoadingContainer","BASE_COLORS","grayscale","IframeContainer","applyBorderBottom","ViewButton","surface","standard","EmailContainer"],"mappings":"oGAGaA,MAAAA,EAASC,EAAOC,GAAG;;;;;qBAKXC,EAAOC,OAAOC;EAGtBC,EAAiBL,EAAOC,GAA6B;;;;;0BAKxCC,EAAOC,OAAOC;2BACbF,EAAOC,OAAOC;qBACpBF,EAAOC,OAAOC;qBACbE,GAAWA,EAAMC,WAAa,MAAQ;;EAI/CC,EAAuBR,EAAOC,GAA6B;;;qBAGnDQ,EAAYC,UAAU;EAG9BC,EAAkBX,EAAOC,GAAoC;;;;;;;;0BAQhDC,EAAOC,OAAOC;2BACbF,EAAOC,OAAOC;;kBAEtBE,GACjBA,EAAMM,kBAAoB,cAAgB;kBACzBN,GACjBA,EAAMM,kBAAoB,aAAaV,EAAOC,OAAOC,UAAY;EAGtDS,EAAab,EAAOC,GAAG;;;;eAIrBC,EAAOY,QAAQC;;;qBAGTb,EAAOC,OAAOC;EAGtBY,EAAiBhB,EAAOC,GAA6B;;qBAE7CC,EAAOY,QAAQC;eACpBT,GAAWA,EAAMC,WAAa,EAAI;;;"}

package/dist/esm/components/template-preview/EmailTemplateThumbnailPreview.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as t}from"react/jsx-runtime";import{Button as a}from"../button/Button.js";import{TitleRegular as n}from"../TypographyStyle.js";import{EmailContainer as s,Header as r,IframeContainer as o,ImageContainer as i,CardLoadingContainer as p,ViewButton as l}from"./EmailTemplatePreview.styled.js";const d="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c",c=c=>{let{template:m,handleViewTemplate:u,hideHeader:h,hideViewButton:y,containerStyle:b,emailHtmlContainerId:g,emailDisplayContent:f,applyBorderBottom:C,hidePointerEvents:j}=c;return e(s,Object.assign({hideHeader:h,style:Object.assign({},null!=b?b:{})},{children:[!h&&t(r,{children:t(n,Object.assign({style:{maxWidth:"100%"}},{children:m.name}))}),t(o,Object.assign({applyBorderBottom:C},{children:f?t("iframe",{title:"Email template preview",id:null!=g?g:"",width:"100%",srcDoc:(x=f,x.replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/src="<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{product.photoUrl}}<\/span><span> <\/span>"/g,`src=${d}`).replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"")),height:"100%",style:{pointerEvents:j?void 0:"none"}}):t(i,Object.assign({hideHeader:h},{children:t(p,{})}))})),!y&&t(l,{children:t(a,{buttonType:"tertiary",buttonText:"View",onClick:()=>{u&&u()}})})]}));var x};export{d as DEFAULT_IMAGE,c as default};
+import{jsxs as e,jsx as t}from"react/jsx-runtime";import{Button as a}from"../button/Button.js";import{TitleRegular as n}from"../TypographyStyle.js";import{EmailContainer as s,Header as r,IframeContainer as o,ImageContainer as i,CardLoadingContainer as p,ViewButton as l}from"./EmailTemplatePreview.styled.js";const d="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c",c=({template:c,handleViewTemplate:m,hideHeader:u,hideViewButton:h,containerStyle:y,emailHtmlContainerId:b,emailDisplayContent:g,applyBorderBottom:f,hidePointerEvents:C})=>{return e(s,Object.assign({hideHeader:u,style:Object.assign({},null!=y?y:{})},{children:[!u&&t(r,{children:t(n,Object.assign({style:{maxWidth:"100%"}},{children:c.name}))}),t(o,Object.assign({applyBorderBottom:f},{children:g?t("iframe",{title:"Email template preview",id:null!=b?b:"",width:"100%",srcDoc:(j=g,j.replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/src="<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{product.photoUrl}}<\/span><span> <\/span>"/g,`src=${d}`).replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/orderProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"").replace(/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/abandonedCartProducts}}<\/span><span>\s*<\/span>/g,"")),height:"100%",style:{pointerEvents:C?void 0:"none"}}):t(i,Object.assign({hideHeader:u},{children:t(p,{})}))})),!h&&t(l,{children:t(a,{buttonType:"tertiary",buttonText:"View",onClick:()=>{m&&m()}})})]}));var j};export{d as DEFAULT_IMAGE,c as default};
 //# sourceMappingURL=EmailTemplateThumbnailPreview.js.map

package/dist/esm/components/template-preview/EmailTemplateThumbnailPreview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmailTemplateThumbnailPreview.js","sources":["../../../../src/components/template-preview/EmailTemplateThumbnailPreview.tsx"],"sourcesContent":["import React from 'react';\nimport { CSSProperties } from 'styled-components';\nimport { Button } from '../button';\nimport { TitleRegular } from '../TypographyStyle';\nimport {\n\tCardLoadingContainer,\n\tEmailContainer,\n\tHeader,\n\tIframeContainer,\n\tImageContainer,\n\tViewButton,\n} from './EmailTemplatePreview.styled';\nimport { EmailTemplateType } from './models/EmailTemplate';\n\nexport const DEFAULT_IMAGE =\n\t'https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c';\n\nconst sanitiseEmailContent = (content: string) => {\n\tconst toRemove =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{##orderProducts}}<\\/span><span>\\s<\\/span>/g;\n\tconst imageReplace =\n\t\t/src=\"<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{product.photoUrl}}<\\/span><span> <\\/span>\"/g;\n\tconst toRemove2 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{\\/\\/orderProducts}}<\\/span><span>\\s<\\/span>/g;\n\tconst toRemove3 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{##abandonedCartProducts}}<\\/span><span>\\s<\\/span>/g;\n\tconst toRemove4 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{\\/\\/abandonedCartProducts}}<\\/span><span>\\s<\\/span>/g;\n\treturn content\n\t\t.replace(toRemove, '')\n\t\t.replace(imageReplace, `src=${DEFAULT_IMAGE}`)\n\t\t.replace(toRemove2, '')\n\t\t.replace(toRemove3, '')\n\t\t.replace(toRemove4, '');\n};\n\nconst EmailTemplateThumbnailPreview: React.FC<{\n\ttemplate: EmailTemplateType;\n\thideHeader?: boolean;\n\thandleViewTemplate: () => void;\n\thideViewButton?: boolean;\n\tcontainerStyle?: CSSProperties;\n\temailHtmlContainerId?: string;\n\temailDisplayContent?: string;\n\tapplyBorderBottom?: boolean;\n\thidePointerEvents?: boolean;\n}> = ({\n\ttemplate,\n\thandleViewTemplate,\n\thideHeader,\n\thideViewButton,\n\tcontainerStyle,\n\temailHtmlContainerId,\n\temailDisplayContent,\n\tapplyBorderBottom,\n\thidePointerEvents,\n}) => {\n\treturn (\n\t\t<EmailContainer\n\t\t\thideHeader={hideHeader}\n\t\t\tstyle={{\n\t\t\t\t...(containerStyle ?? {}),\n\t\t\t}}\n\t\t>\n\t\t\t{!hideHeader && (\n\t\t\t\t<Header>\n\t\t\t\t\t<TitleRegular style={{ maxWidth: '100%' }}>\n\t\t\t\t\t\t{template.name}\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t</Header>\n\t\t\t)}\n\n\t\t\t<IframeContainer applyBorderBottom={applyBorderBottom}>\n\t\t\t\t{emailDisplayContent ? (\n\t\t\t\t\t<iframe\n\t\t\t\t\t\ttitle=\"Email template preview\"\n\t\t\t\t\t\tid={emailHtmlContainerId ?? ''}\n\t\t\t\t\t\twidth={'100%'}\n\t\t\t\t\t\tsrcDoc={sanitiseEmailContent(emailDisplayContent)}\n\t\t\t\t\t\theight={'100%'}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpointerEvents: hidePointerEvents ? undefined : 'none',\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<ImageContainer hideHeader={hideHeader}>\n\t\t\t\t\t\t{/* <img\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tsrc={template.thumbnailUrl}\n\t\t\t\t\t\tstyle={{ objectFit: 'contain', width: '100%' }}\n\t\t\t\t\t/> /}\n\t\t\t\t\t\t{/ <Spinner size={'small'} /> */}\n\t\t\t\t\t\t<CardLoadingContainer />\n\t\t\t\t\t</ImageContainer>\n\t\t\t\t\t// <div\n\t\t\t\t\t// \tstyle={{\n\t\t\t\t\t// \t\tdisplay: 'flex',\n\t\t\t\t\t// \t\tjustifyContent: 'center',\n\t\t\t\t\t// \t\talignItems: 'center',\n\t\t\t\t\t// \t\theight: 40,\n\t\t\t\t\t// \t}}\n\t\t\t\t\t// >\n\t\t\t\t\t// </div>\n\t\t\t\t)}\n\t\t\t</IframeContainer>\n\t\t\t{!hideViewButton && (\n\t\t\t\t<ViewButton>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonType=\"tertiary\"\n\t\t\t\t\t\tbuttonText=\"View\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\thandleViewTemplate && handleViewTemplate();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</ViewButton>\n\t\t\t)}\n\t\t</EmailContainer>\n\t);\n};\n\nexport default EmailTemplateThumbnailPreview;\n"],"names":["DEFAULT_IMAGE","EmailTemplateThumbnailPreview","~~_ref","~~template","handleViewTemplate","hideHeader","hideViewButton","containerStyle","emailHtmlContainerId","emailDisplayContent","applyBorderBottom","hidePointerEvents","_jsxs","EmailContainer","style","children","_jsx","Header","TitleRegular","maxWidth","name","IframeContainer","Object","assign","title","id","width","srcDoc","content","replace","height","pointerEvents","undefined","ImageContainer","CardLoadingContainer","ViewButton","Button","buttonType","buttonText","onClick"],"mappings":"qTAcO,MAAMA,EACZ,+KAqBKC,~~EAUDC~~,~~IAUA~~,~~IAVCC~~,~~SACLA~~,~~EAAQC~~,~~mBACRA~~,~~EAAkBC~~,~~WAClBA~~,~~EAAUC~~,~~eACVA~~,~~EAAcC~~,~~eACdA~~,~~EAAcC,qBACdA,EAAoBC,oBACpBA,EAAmBC,kBACnBA,EAAiBC,kBACjBA,GACAT,EACA,OACCU,~~EAACC,iBACAR,WAAYA,EACZS,uBACKP,QAAAA,EAAkB,KAGtB,CAAAQ,SAAA,EAACV,GACDW,EAACC,YACAD,EAACE,iBAAaJ,MAAO,CAAEK,SAAU,SAAQ,CAAAJ,SACvCZ,EAASiB,UAKbJ,EAACK,EAAgBC,OAAAC,OAAA,CAAAb,kBAAmBA,GAAiB,CAAAK,SACnDN,EACAO,EAAA,SAAA,CACCQ,MAAM,yBACNC,GAAIjB,QAAAA,EAAwB,GAC5BkB,MAAO,OACPC,QA7DwBC,EA6DKnB,EAlD3BmB,EACLC,QAVD,wHAUmB,IAClBA,QATD,~~6HAS8B~~,~~OAAA7B~~,~~KAC7B6B~~,QARD,0HAQoB,IACnBA,QAPD,gIAOoB,IACnBA,QAND,kIAMoB,KA8ChBC,OAAQ,OACRhB,MAAO,CACNiB,cAAepB,OAAoBqB,EAAY,UAIjDhB,EAACiB,EAAeX,OAAAC,OAAA,CAAAlB,WAAYA,GAAU,CAAAU,SAOrCC,EAACkB,aAaF5B,GACDU,EAACmB,EACA,CAAApB,SAAAC,EAACoB,EAAM,CACNC,WAAW,WACXC,WAAW,OACXC,QAASA,KACRnC,GAAsBA,GAAoB,UA9FnBwB,KAmGX"}
1	+ {"version":3,"file":"EmailTemplateThumbnailPreview.js","sources":["../../../../src/components/template-preview/EmailTemplateThumbnailPreview.tsx"],"sourcesContent":["import React from 'react';\nimport { CSSProperties } from 'styled-components';\nimport { Button } from '../button';\nimport { TitleRegular } from '../TypographyStyle';\nimport {\n\tCardLoadingContainer,\n\tEmailContainer,\n\tHeader,\n\tIframeContainer,\n\tImageContainer,\n\tViewButton,\n} from './EmailTemplatePreview.styled';\nimport { EmailTemplateType } from './models/EmailTemplate';\n\nexport const DEFAULT_IMAGE =\n\t'https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c';\n\nconst sanitiseEmailContent = (content: string) => {\n\tconst toRemove =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{##orderProducts}}<\\/span><span>\\s<\\/span>/g;\n\tconst imageReplace =\n\t\t/src=\"<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{product.photoUrl}}<\\/span><span> <\\/span>\"/g;\n\tconst toRemove2 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{\\/\\/orderProducts}}<\\/span><span>\\s<\\/span>/g;\n\tconst toRemove3 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{##abandonedCartProducts}}<\\/span><span>\\s<\\/span>/g;\n\tconst toRemove4 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{\\/\\/abandonedCartProducts}}<\\/span><span>\\s<\\/span>/g;\n\treturn content\n\t\t.replace(toRemove, '')\n\t\t.replace(imageReplace, `src=${DEFAULT_IMAGE}`)\n\t\t.replace(toRemove2, '')\n\t\t.replace(toRemove3, '')\n\t\t.replace(toRemove4, '');\n};\n\nconst EmailTemplateThumbnailPreview: React.FC<{\n\ttemplate: EmailTemplateType;\n\thideHeader?: boolean;\n\thandleViewTemplate: () => void;\n\thideViewButton?: boolean;\n\tcontainerStyle?: CSSProperties;\n\temailHtmlContainerId?: string;\n\temailDisplayContent?: string;\n\tapplyBorderBottom?: boolean;\n\thidePointerEvents?: boolean;\n}> = ({\n\ttemplate,\n\thandleViewTemplate,\n\thideHeader,\n\thideViewButton,\n\tcontainerStyle,\n\temailHtmlContainerId,\n\temailDisplayContent,\n\tapplyBorderBottom,\n\thidePointerEvents,\n}) => {\n\treturn (\n\t\t<EmailContainer\n\t\t\thideHeader={hideHeader}\n\t\t\tstyle={{\n\t\t\t\t...(containerStyle ?? {}),\n\t\t\t}}\n\t\t>\n\t\t\t{!hideHeader && (\n\t\t\t\t<Header>\n\t\t\t\t\t<TitleRegular style={{ maxWidth: '100%' }}>\n\t\t\t\t\t\t{template.name}\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t</Header>\n\t\t\t)}\n\n\t\t\t<IframeContainer applyBorderBottom={applyBorderBottom}>\n\t\t\t\t{emailDisplayContent ? (\n\t\t\t\t\t<iframe\n\t\t\t\t\t\ttitle=\"Email template preview\"\n\t\t\t\t\t\tid={emailHtmlContainerId ?? ''}\n\t\t\t\t\t\twidth={'100%'}\n\t\t\t\t\t\tsrcDoc={sanitiseEmailContent(emailDisplayContent)}\n\t\t\t\t\t\theight={'100%'}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpointerEvents: hidePointerEvents ? undefined : 'none',\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<ImageContainer hideHeader={hideHeader}>\n\t\t\t\t\t\t{/* <img\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tsrc={template.thumbnailUrl}\n\t\t\t\t\t\tstyle={{ objectFit: 'contain', width: '100%' }}\n\t\t\t\t\t/> /}\n\t\t\t\t\t\t{/ <Spinner size={'small'} /> */}\n\t\t\t\t\t\t<CardLoadingContainer />\n\t\t\t\t\t</ImageContainer>\n\t\t\t\t\t// <div\n\t\t\t\t\t// \tstyle={{\n\t\t\t\t\t// \t\tdisplay: 'flex',\n\t\t\t\t\t// \t\tjustifyContent: 'center',\n\t\t\t\t\t// \t\talignItems: 'center',\n\t\t\t\t\t// \t\theight: 40,\n\t\t\t\t\t// \t}}\n\t\t\t\t\t// >\n\t\t\t\t\t// </div>\n\t\t\t\t)}\n\t\t\t</IframeContainer>\n\t\t\t{!hideViewButton && (\n\t\t\t\t<ViewButton>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonType=\"tertiary\"\n\t\t\t\t\t\tbuttonText=\"View\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\thandleViewTemplate && handleViewTemplate();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</ViewButton>\n\t\t\t)}\n\t\t</EmailContainer>\n\t);\n};\n\nexport default EmailTemplateThumbnailPreview;\n"],"names":["DEFAULT_IMAGE","EmailTemplateThumbnailPreview","template","handleViewTemplate","hideHeader","hideViewButton","containerStyle","emailHtmlContainerId","emailDisplayContent","applyBorderBottom","hidePointerEvents","_jsxs","EmailContainer","style","children","_jsx","Header","TitleRegular","maxWidth","name","IframeContainer","Object","assign","title","id","width","srcDoc","content","replace","height","pointerEvents","undefined","ImageContainer","CardLoadingContainer","ViewButton","Button","buttonType","buttonText","onClick"],"mappings":"qTAcO,MAAMA,EACZ,+KAqBKC,EAUDA,EACJC,WACAC,qBACAC,aACAC,iBACAC,iBACAC,uBACAC,sBACAC,oBACAC,wBAEA,OACCC,EAACC,iBACAR,WAAYA,EACZS,uBACKP,QAAAA,EAAkB,KAGtB,CAAAQ,SAAA,EAACV,GACDW,EAACC,YACAD,EAACE,iBAAaJ,MAAO,CAAEK,SAAU,SAAQ,CAAAJ,SACvCZ,EAASiB,UAKbJ,EAACK,EAAgBC,OAAAC,OAAA,CAAAb,kBAAmBA,GAAiB,CAAAK,SACnDN,EACAO,EAAA,SAAA,CACCQ,MAAM,yBACNC,GAAIjB,QAAAA,EAAwB,GAC5BkB,MAAO,OACPC,QA7DwBC,EA6DKnB,EAlD3BmB,EACLC,QAVD,wHAUmB,IAClBA,QATD,6HASuB,OAAO5B,KAC7B4B,QARD,0HAQoB,IACnBA,QAPD,gIAOoB,IACnBA,QAND,kIAMoB,KA8ChBC,OAAQ,OACRhB,MAAO,CACNiB,cAAepB,OAAoBqB,EAAY,UAIjDhB,EAACiB,EAAeX,OAAAC,OAAA,CAAAlB,WAAYA,GAAU,CAAAU,SAOrCC,EAACkB,aAaF5B,GACDU,EAACmB,EACA,CAAApB,SAAAC,EAACoB,EAAM,CACNC,WAAW,WACXC,WAAW,OACXC,QAASA,KACRnC,GAAsBA,GAAoB,UA9FnBwB,KAmGX"}

package/dist/esm/components/template-preview/RCS/RCSButtons.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import{Caption as i,BodySecondary as n}from"../../TypographyStyle.js";import{COLORS as o}from"../../../constants/Theme.js";const l=l=>{let{Icon:c,text:s,extraContent:a,placeholder:p,textTypography:d,size:h}=l;const g=d||n;return e(t,{children:r("div",Object.assign({style:{textAlign:"center",maxWidth:"100%"}},{children:[r("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"}},{children:[c&&e(c,{color:o.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e("div",Object.assign({style:{border:"1px solid #E0E0E0",width:"100%",borderRadius:30,padding:"8px 12px"}},{children:e(g,Object.assign({style:{color:o.special.brand.facebook,textAlign:"center",fontSize:"small"===h?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:s}))}))]})),!!a&&e(i,Object.assign({style:{marginTop:2,color:o.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:p?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(p):a}))]}))})};export{l as RCSButtons};
+import{jsx as e,Fragment as t,jsxs as r}from"react/jsx-runtime";import{Caption as i,BodySecondary as n}from"../../TypographyStyle.js";import{COLORS as o}from"../../../constants/Theme.js";const l=({Icon:l,text:c,extraContent:s,placeholder:a,textTypography:p,size:d})=>{const h=p||n;return e(t,{children:r("div",Object.assign({style:{textAlign:"center",maxWidth:"100%"}},{children:[r("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"}},{children:[l&&e(l,{color:o.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e("div",Object.assign({style:{border:"1px solid #E0E0E0",width:"100%",borderRadius:30,padding:"8px 12px"}},{children:e(h,Object.assign({style:{color:o.special.brand.facebook,textAlign:"center",fontSize:"small"===d?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:c}))}))]})),!!s&&e(i,Object.assign({style:{marginTop:2,color:o.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:a?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(a):s}))]}))})};export{l as RCSButtons};
 //# sourceMappingURL=RCSButtons.js.map

package/dist/esm/components/template-preview/RCS/RCSButtons.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RCSButtons.js","sources":["../../../../../src/components/template-preview/RCS/RCSButtons.tsx"],"sourcesContent":["import React from 'react';\nimport { BodySecondary, Caption } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const RCSButtons: React.FC<{\n\tIcon?: React.FC<React.SVGProps<SVGSVGElement>>;\n\ttext: string;\n\textraContent?: string;\n\tplaceholder?: string;\n\ttextTypography?: React.FC;\n\tsize?: 'small' \| 'large';\n}> = ({ Icon, text, extraContent, placeholder, textTypography, size }) => {\n\tconst TextTypographyComponent = textTypography \|\| BodySecondary;\n\n\tfunction normaliseButtonPlaceholder(placeholder: string) {\n\t\tconst placeholderText = placeholder.replace('[[', '').replace(']]', '');\n\t\tconst placeHolderToDisplay = placeholderText\n\t\t\t.replace(/([A-Z])/g, ' $1')\n\t\t\t.replace(/^./, function (str) {\n\t\t\t\treturn str.toUpperCase();\n\t\t\t});\n\n\t\treturn placeHolderToDisplay;\n\t}\n\treturn (\n\t\t<>\n\t\t\t<div style={{ textAlign: 'center', maxWidth: '100%' }}>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{Icon && (\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tcolor={COLORS.special.brand.facebook}\n\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\tstyle={{ marginRight: 8 }}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tborder: '1px solid #E0E0E0',\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tborderRadius: 30,\n\t\t\t\t\t\t\tpadding: '8px 12px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TextTypographyComponent\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tcolor: COLORS.special.brand.facebook,\n\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\tfontSize: size === 'small' ? 12 : 14,\n\t\t\t\t\t\t\t\ttextOverflow: 'ellipsis',\n\t\t\t\t\t\t\t\twhiteSpace: 'nowrap',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{text}\n\t\t\t\t\t\t</TextTypographyComponent>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t{!!extraContent && (\n\t\t\t\t\t<Caption\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tmarginTop: 2,\n\t\t\t\t\t\t\tcolor: COLORS.content.placeholder,\n\t\t\t\t\t\t\ttextOverflow: 'ellipsis',\n\t\t\t\t\t\t\twhiteSpace: 'nowrap',\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{placeholder\n\t\t\t\t\t\t\t? normaliseButtonPlaceholder(placeholder)\n\t\t\t\t\t\t\t: extraContent}\n\t\t\t\t\t</Caption>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</>\n\t);\n};\n"],"names":["RCSButtons","~~_ref","~~Icon","text","extraContent","placeholder","textTypography","size","TextTypographyComponent","BodySecondary","_jsx","_Fragment","children","_jsxs","Object","assign","style","textAlign","maxWidth","display","flexDirection","justifyContent","alignItems","color","COLORS","special","brand","facebook","height","width","marginRight","border","borderRadius","padding","fontSize","textOverflow","whiteSpace","overflow","Caption","marginTop","content","replace","str","toUpperCase","normaliseButtonPlaceholder"],"mappings":"~~2LAIaA~~,~~MAAAA~~,~~EAORC~~,~~IAAoE~~,~~IAAnEC~~,~~KAAEA~~,~~EAAIC~~,~~KAAEA~~,~~EAAIC~~,~~aAAEA~~,~~EAAYC~~,~~YAAEA,EAAWC,eAAEA,EAAcC,KAAEA,GAAMN,EACpE,MAAMO,~~EAA0BF,GAAkBG,EAYlD,OACCC,EACCC,EAAA,CAAAC,SAAAC,EAAA,MAAAC,OAAAC,OAAA,CAAKC,MAAO,CAAEC,UAAW,SAAUC,SAAU,SAC5C,CAAAN,SAAA,CAAAC,EAAA,MAAAC,OAAAC,OAAA,CACCC,MAAO,CACNG,QAAS,OACTC,cAAe,MACfC,eAAgB,SAChBC,WAAY,WACZ,CAAAV,SAAA,CAEAV,GACAQ,EAACR,GACAqB,MAAOC,EAAOC,QAAQC,MAAMC,SAC5BC,OAAQ,GACRC,MAAO,GACPb,MAAO,CAAEc,YAAa,KAIxBpB,EAAA,MAAAI,OAAAC,OAAA,CACCC,MAAO,CACNe,OAAQ,oBACRF,MAAO,OACPG,aAAc,GACdC,QAAS,aACT,CAAArB,SAEDF,EAACF,EACAM,OAAAC,OAAA,CAAAC,MAAO,CACNO,MAAOC,EAAOC,QAAQC,MAAMC,SAC5BV,UAAW,SACXiB,SAAmB,UAAT3B,EAAmB,GAAK,GAClC4B,aAAc,WACdC,WAAY,SACZC,SAAU,WACV,CAAAzB,SAEAT,cAIDC,GACFM,EAAC4B,EAAOxB,OAAAC,OAAA,CACPC,MAAO,CACNuB,UAAW,EACXhB,MAAOC,EAAOgB,QAAQnC,YACtB8B,aAAc,WACdC,WAAY,SACZC,SAAU,WACV,CAAAzB,SAEAP,EA9DN,SAAoCA,GAQnC,OAPwBA,EAAYoC,QAAQ,KAAM,IAAIA,QAAQ,KAAM,IAElEA,QAAQ,WAAY,OACpBA,QAAQ,MAAM,SAAUC,GACxB,OAAOA,EAAIC,aACZ,GAGF,CAsDQC,CAA2BvC,GAC3BD,UAIJ"}
1	+ {"version":3,"file":"RCSButtons.js","sources":["../../../../../src/components/template-preview/RCS/RCSButtons.tsx"],"sourcesContent":["import React from 'react';\nimport { BodySecondary, Caption } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const RCSButtons: React.FC<{\n\tIcon?: React.FC<React.SVGProps<SVGSVGElement>>;\n\ttext: string;\n\textraContent?: string;\n\tplaceholder?: string;\n\ttextTypography?: React.FC;\n\tsize?: 'small' \| 'large';\n}> = ({ Icon, text, extraContent, placeholder, textTypography, size }) => {\n\tconst TextTypographyComponent = textTypography \|\| BodySecondary;\n\n\tfunction normaliseButtonPlaceholder(placeholder: string) {\n\t\tconst placeholderText = placeholder.replace('[[', '').replace(']]', '');\n\t\tconst placeHolderToDisplay = placeholderText\n\t\t\t.replace(/([A-Z])/g, ' $1')\n\t\t\t.replace(/^./, function (str) {\n\t\t\t\treturn str.toUpperCase();\n\t\t\t});\n\n\t\treturn placeHolderToDisplay;\n\t}\n\treturn (\n\t\t<>\n\t\t\t<div style={{ textAlign: 'center', maxWidth: '100%' }}>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{Icon && (\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tcolor={COLORS.special.brand.facebook}\n\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\tstyle={{ marginRight: 8 }}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tborder: '1px solid #E0E0E0',\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tborderRadius: 30,\n\t\t\t\t\t\t\tpadding: '8px 12px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TextTypographyComponent\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tcolor: COLORS.special.brand.facebook,\n\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\tfontSize: size === 'small' ? 12 : 14,\n\t\t\t\t\t\t\t\ttextOverflow: 'ellipsis',\n\t\t\t\t\t\t\t\twhiteSpace: 'nowrap',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{text}\n\t\t\t\t\t\t</TextTypographyComponent>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t{!!extraContent && (\n\t\t\t\t\t<Caption\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tmarginTop: 2,\n\t\t\t\t\t\t\tcolor: COLORS.content.placeholder,\n\t\t\t\t\t\t\ttextOverflow: 'ellipsis',\n\t\t\t\t\t\t\twhiteSpace: 'nowrap',\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{placeholder\n\t\t\t\t\t\t\t? normaliseButtonPlaceholder(placeholder)\n\t\t\t\t\t\t\t: extraContent}\n\t\t\t\t\t</Caption>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</>\n\t);\n};\n"],"names":["RCSButtons","Icon","text","extraContent","placeholder","textTypography","size","TextTypographyComponent","BodySecondary","_jsx","_Fragment","children","_jsxs","Object","assign","style","textAlign","maxWidth","display","flexDirection","justifyContent","alignItems","color","COLORS","special","brand","facebook","height","width","marginRight","border","borderRadius","padding","fontSize","textOverflow","whiteSpace","overflow","Caption","marginTop","content","replace","str","toUpperCase","normaliseButtonPlaceholder"],"mappings":"2LAIO,MAAMA,EAORA,EAAGC,OAAMC,OAAMC,eAAcC,cAAaC,iBAAgBC,WAC9D,MAAMC,EAA0BF,GAAkBG,EAYlD,OACCC,EACCC,EAAA,CAAAC,SAAAC,EAAA,MAAAC,OAAAC,OAAA,CAAKC,MAAO,CAAEC,UAAW,SAAUC,SAAU,SAC5C,CAAAN,SAAA,CAAAC,EAAA,MAAAC,OAAAC,OAAA,CACCC,MAAO,CACNG,QAAS,OACTC,cAAe,MACfC,eAAgB,SAChBC,WAAY,WACZ,CAAAV,SAAA,CAEAV,GACAQ,EAACR,GACAqB,MAAOC,EAAOC,QAAQC,MAAMC,SAC5BC,OAAQ,GACRC,MAAO,GACPb,MAAO,CAAEc,YAAa,KAIxBpB,EAAA,MAAAI,OAAAC,OAAA,CACCC,MAAO,CACNe,OAAQ,oBACRF,MAAO,OACPG,aAAc,GACdC,QAAS,aACT,CAAArB,SAEDF,EAACF,EACAM,OAAAC,OAAA,CAAAC,MAAO,CACNO,MAAOC,EAAOC,QAAQC,MAAMC,SAC5BV,UAAW,SACXiB,SAAmB,UAAT3B,EAAmB,GAAK,GAClC4B,aAAc,WACdC,WAAY,SACZC,SAAU,WACV,CAAAzB,SAEAT,cAIDC,GACFM,EAAC4B,EAAOxB,OAAAC,OAAA,CACPC,MAAO,CACNuB,UAAW,EACXhB,MAAOC,EAAOgB,QAAQnC,YACtB8B,aAAc,WACdC,WAAY,SACZC,SAAU,WACV,CAAAzB,SAEAP,EA9DN,SAAoCA,GAQnC,OAPwBA,EAAYoC,QAAQ,KAAM,IAAIA,QAAQ,KAAM,IAElEA,QAAQ,WAAY,OACpBA,QAAQ,MAAM,SAAUC,GACxB,OAAOA,EAAIC,aACZ,GAGF,CAsDQC,CAA2BvC,GAC3BD,UAIJ"}

package/dist/esm/components/template-preview/RCS/RCSMediaCard.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsxs as e,jsx as i,Fragment as r}from"react/jsx-runtime";import t from"../../../assets/icons/RCS_PDF.svg.js";import{ShimmerImage as s}from"../../shimmer-image/ShimmerImage.js";import{COLORS as o}from"../../../constants/Theme.js";import{HEADER_TYPES as a}from"../models/TemplateMeta.js";import{RCSPdfContainer as d,PdfComineText as n,PdfText as m,RCSMediaContainer as l}from"./RCSPreview.styled.js";const c=r=>{let{headerAssetLink:s,headerAssetName:a}=r;var l;const c=t,h=a||(null===(l=null==s?void 0:s.split("/").pop())||void 0===l?void 0:l.replace(".pdf",""))||"xxxxxxxx";return e(d,{children:[i(c,{height:24,width:24,color:o.icon.placeholder}),!!h&&e(n,{children:[i(m,{children:h}),i(m,{children:".pdf"})]})]})},h=e=>{let{headerAssetLink:t,headerAssetName:o,mediaType:d,imagePreviewStyles:n,isHorizontal:m}=e;const c={width:"100%",minHeight:m?"100%":"240px",height:m?"100%":"240px",objectFit:"cover",borderRadius:m?"8px":""};return i(l,Object.assign({isHorizontal:!!m},{children:d===a.IMAGE?i(s,{imageUrl:t,alt:t,width:"100%",height:m?"100%":240,imagePreviewStyles:Object.assign(Object.assign({},n),{borderTopRightRadius:8,borderTopLeftRadius:8})}):d===a.VIDEO?i("video",Object.assign({src:t,style:c,controls:!0,muted:!0},{children:i("track",{default:!0,kind:"captions",srcLang:"en",src:t})})):i(r,{})}))};export{c as PdfMediaCard,h as RCSMediaCard};
+import{jsxs as e,jsx as i,Fragment as r}from"react/jsx-runtime";import t from"../../../assets/icons/RCS_PDF.svg.js";import{ShimmerImage as s}from"../../shimmer-image/ShimmerImage.js";import{COLORS as o}from"../../../constants/Theme.js";import{HEADER_TYPES as a}from"../models/TemplateMeta.js";import{RCSPdfContainer as d,PdfComineText as n,PdfText as m,RCSMediaContainer as c}from"./RCSPreview.styled.js";const l=({headerAssetLink:r,headerAssetName:s})=>{var a;const c=t,l=s||(null===(a=null==r?void 0:r.split("/").pop())||void 0===a?void 0:a.replace(".pdf",""))||"xxxxxxxx";return e(d,{children:[i(c,{height:24,width:24,color:o.icon.placeholder}),!!l&&e(n,{children:[i(m,{children:l}),i(m,{children:".pdf"})]})]})},h=({headerAssetLink:e,headerAssetName:t,mediaType:o,imagePreviewStyles:d,isHorizontal:n})=>{const m={width:"100%",minHeight:n?"100%":"240px",height:n?"100%":"240px",objectFit:"cover",borderRadius:n?"8px":""};return i(c,Object.assign({isHorizontal:!!n},{children:o===a.IMAGE?i(s,{imageUrl:e,alt:e,width:"100%",height:n?"100%":240,imagePreviewStyles:Object.assign(Object.assign({},d),{borderTopRightRadius:8,borderTopLeftRadius:8})}):o===a.VIDEO?i("video",Object.assign({src:e,style:m,controls:!0,muted:!0},{children:i("track",{default:!0,kind:"captions",srcLang:"en",src:e})})):i(r,{})}))};export{l as PdfMediaCard,h as RCSMediaCard};
 //# sourceMappingURL=RCSMediaCard.js.map

package/dist/esm/components/template-preview/RCS/RCSMediaCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RCSMediaCard.js","sources":["../../../../../src/components/template-preview/RCS/RCSMediaCard.tsx"],"sourcesContent":["import FilePDFIcon from '@src/assets/icons/RCS_PDF.svg';\nimport React from 'react';\nimport { CSSProperties } from 'styled-components';\nimport { ShimmerImage } from '@src/components/shimmer-image';\nimport { COLORS } from '@src/constants/Theme';\nimport { HEADER_TYPES } from '../models/TemplateMeta';\nimport {\n\tPdfComineText,\n\tPdfText,\n\tRCSMediaContainer,\n\tRCSPdfContainer,\n} from './RCSPreview.styled';\n\nexport const PdfMediaCard: React.FC<{\n\theaderAssetLink?: string;\n\theaderAssetName?: string;\n}> = ({ headerAssetLink, headerAssetName }) => {\n\tconst Icon = FilePDFIcon;\n\tconst headerName =\n\t\theaderAssetName \|\|\n\t\theaderAssetLink?.split('/').pop()?.replace('.pdf', '') \|\|\n\t\t'xxxxxxxx';\n\n\treturn (\n\t\t<RCSPdfContainer>\n\t\t\t<Icon height={24} width={24} color={COLORS.icon.placeholder} />\n\t\t\t{!!headerName && (\n\t\t\t\t<PdfComineText>\n\t\t\t\t\t<PdfText>{headerName}</PdfText>\n\t\t\t\t\t<PdfText>.pdf</PdfText>\n\t\t\t\t</PdfComineText>\n\t\t\t)}\n\t\t</RCSPdfContainer>\n\t);\n};\n\nexport const RCSMediaCard: React.FC<{\n\theaderAssetLink: string;\n\theaderAssetName?: string;\n\tmediaType: HEADER_TYPES;\n\timagePreviewStyles?: CSSProperties;\n\tisHorizontal?: boolean;\n}> = ({\n\theaderAssetLink,\n\theaderAssetName,\n\tmediaType,\n\timagePreviewStyles,\n\tisHorizontal,\n}) => {\n\tconst commonMediaPlayerStyle = {\n\t\twidth: isHorizontal ? '100%' : '100%',\n\t\tminHeight: isHorizontal ? '100%' : '240px',\n\t\theight: isHorizontal ? '100%' : '240px',\n\t\tobjectFit: 'cover',\n\t\tborderRadius: isHorizontal ? '8px' : '',\n\t};\n\n\treturn (\n\t\t<RCSMediaContainer isHorizontal={!!isHorizontal}>\n\t\t\t{mediaType === HEADER_TYPES.IMAGE ? (\n\t\t\t\t<ShimmerImage\n\t\t\t\t\timageUrl={headerAssetLink}\n\t\t\t\t\talt={headerAssetLink}\n\t\t\t\t\twidth={'100%'}\n\t\t\t\t\theight={isHorizontal ? '100%' : 240}\n\t\t\t\t\timagePreviewStyles={{\n\t\t\t\t\t\t...imagePreviewStyles,\n\t\t\t\t\t\tborderTopRightRadius: 8,\n\t\t\t\t\t\tborderTopLeftRadius: 8,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t) : mediaType === HEADER_TYPES.VIDEO ? (\n\t\t\t\t<video\n\t\t\t\t\tsrc={headerAssetLink}\n\t\t\t\t\tstyle={commonMediaPlayerStyle as CSSProperties}\n\t\t\t\t\tcontrols\n\t\t\t\t\tmuted\n\t\t\t\t>\n\t\t\t\t\t<track default kind=\"captions\" srcLang=\"en\" src={headerAssetLink} />\n\t\t\t\t</video>\n\t\t\t) : (\n\t\t\t\t<></>\n\t\t\t)}\n\t\t</RCSMediaContainer>\n\t);\n};\n"],"names":["PdfMediaCard","~~_ref","~~headerAssetLink","headerAssetName","Icon","FilePDFIcon","headerName","_a","split","pop","replace","_jsxs","RCSPdfContainer","children","_jsx","height","width","color","COLORS","icon","placeholder","PdfComineText","PdfText","RCSMediaCard","~~_ref2","~~mediaType","imagePreviewStyles","isHorizontal","commonMediaPlayerStyle","minHeight","objectFit","borderRadius","RCSMediaContainer","Object","assign","HEADER_TYPES","IMAGE","ShimmerImage","imageUrl","alt","borderTopRightRadius","borderTopLeftRadius","VIDEO","src","style","controls","muted","default","kind","srcLang","_Fragment"],"mappings":"~~qZAaaA~~,~~MAAAA~~,~~EAGRC~~,~~IAAyC~~,~~IAAxCC~~,~~gBAAEA~~,~~EAAeC~~,~~gBAAEA,GAAiBF,QACzC,MAAMG,~~EAAOC,EACPC,EACLH,YACAI,EAAAL,eAAAA,EAAiBM,MAAM,KAAKC,4BAAOC,QAAQ,OAAQ,MACnD,WAED,OACCC,EAACC,EAAe,CAAAC,SAAA,CACfC,EAACV,EAAI,CAACW,OAAQ,GAAIC,MAAO,GAAIC,MAAOC,EAAOC,KAAKC,gBAC7Cd,GACFK,EAACU,aACAP,EAACQ,YAAShB,IACVQ,EAACQ,0BAGc,EAIPC,~~EAMRC~~,~~IAMA~~,~~IANCtB~~,~~gBACLA~~,~~EAAeC~~,~~gBACfA~~,~~EAAesB~~,~~UACfA~~,~~EAASC,mBACTA,EAAkBC,aAClBA,GACAH,EACA,MAAMI,~~EAAyB,~~CAC9BZ~~,MAAsB,~~OACtBa~~,UAAWF,EAAe,OAAS,~~QACnCZ~~,~~OAAQY~~,EAAe,OAAS,QAChCG,UAAW,QACXC,aAAcJ,EAAe,MAAQ,IAGtC,~~OACCb~~,~~EAACkB~~,EAAkBC,OAAAC,OAAA,CAAAP,eAAgBA,GAAY,~~CAAAd~~,~~SAC7CY~~,IAAcU,EAAaC,~~MAC3BtB~~,~~EAACuB~~,EAAY,CACZC,~~SAAUpC~~,~~EACVqC~~,~~IAAKrC~~,EACLc,MAAO,OACPD,~~OAAQY~~,EAAe,OAAS,IAChCD,kDACIA,GAAkB,CACrBc,qBAAsB,EACtBC,oBAAqB,MAGpBhB,IAAcU,EAAaO,~~MAC9B5B~~,EACC,~~QAAAmB~~,OAAAC,OAAA,CAAAS,~~IAAKzC~~,~~EACL0C~~,MAAOhB,EACPiB,UAAQ,EACRC,OAEA,GAAA,~~CAAAjC~~,SAAAC,EAAA,QAAA,~~CAAOiC~~,SAAO,EAACC,KAAK,WAAWC,QAAQ,KAAKN,~~IAAKzC~~,OAGlDY,~~EAAKoC~~,EAAA,MAEa"}
1	+ {"version":3,"file":"RCSMediaCard.js","sources":["../../../../../src/components/template-preview/RCS/RCSMediaCard.tsx"],"sourcesContent":["import FilePDFIcon from '@src/assets/icons/RCS_PDF.svg';\nimport React from 'react';\nimport { CSSProperties } from 'styled-components';\nimport { ShimmerImage } from '@src/components/shimmer-image';\nimport { COLORS } from '@src/constants/Theme';\nimport { HEADER_TYPES } from '../models/TemplateMeta';\nimport {\n\tPdfComineText,\n\tPdfText,\n\tRCSMediaContainer,\n\tRCSPdfContainer,\n} from './RCSPreview.styled';\n\nexport const PdfMediaCard: React.FC<{\n\theaderAssetLink?: string;\n\theaderAssetName?: string;\n}> = ({ headerAssetLink, headerAssetName }) => {\n\tconst Icon = FilePDFIcon;\n\tconst headerName =\n\t\theaderAssetName \|\|\n\t\theaderAssetLink?.split('/').pop()?.replace('.pdf', '') \|\|\n\t\t'xxxxxxxx';\n\n\treturn (\n\t\t<RCSPdfContainer>\n\t\t\t<Icon height={24} width={24} color={COLORS.icon.placeholder} />\n\t\t\t{!!headerName && (\n\t\t\t\t<PdfComineText>\n\t\t\t\t\t<PdfText>{headerName}</PdfText>\n\t\t\t\t\t<PdfText>.pdf</PdfText>\n\t\t\t\t</PdfComineText>\n\t\t\t)}\n\t\t</RCSPdfContainer>\n\t);\n};\n\nexport const RCSMediaCard: React.FC<{\n\theaderAssetLink: string;\n\theaderAssetName?: string;\n\tmediaType: HEADER_TYPES;\n\timagePreviewStyles?: CSSProperties;\n\tisHorizontal?: boolean;\n}> = ({\n\theaderAssetLink,\n\theaderAssetName,\n\tmediaType,\n\timagePreviewStyles,\n\tisHorizontal,\n}) => {\n\tconst commonMediaPlayerStyle = {\n\t\twidth: isHorizontal ? '100%' : '100%',\n\t\tminHeight: isHorizontal ? '100%' : '240px',\n\t\theight: isHorizontal ? '100%' : '240px',\n\t\tobjectFit: 'cover',\n\t\tborderRadius: isHorizontal ? '8px' : '',\n\t};\n\n\treturn (\n\t\t<RCSMediaContainer isHorizontal={!!isHorizontal}>\n\t\t\t{mediaType === HEADER_TYPES.IMAGE ? (\n\t\t\t\t<ShimmerImage\n\t\t\t\t\timageUrl={headerAssetLink}\n\t\t\t\t\talt={headerAssetLink}\n\t\t\t\t\twidth={'100%'}\n\t\t\t\t\theight={isHorizontal ? '100%' : 240}\n\t\t\t\t\timagePreviewStyles={{\n\t\t\t\t\t\t...imagePreviewStyles,\n\t\t\t\t\t\tborderTopRightRadius: 8,\n\t\t\t\t\t\tborderTopLeftRadius: 8,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t) : mediaType === HEADER_TYPES.VIDEO ? (\n\t\t\t\t<video\n\t\t\t\t\tsrc={headerAssetLink}\n\t\t\t\t\tstyle={commonMediaPlayerStyle as CSSProperties}\n\t\t\t\t\tcontrols\n\t\t\t\t\tmuted\n\t\t\t\t>\n\t\t\t\t\t<track default kind=\"captions\" srcLang=\"en\" src={headerAssetLink} />\n\t\t\t\t</video>\n\t\t\t) : (\n\t\t\t\t<></>\n\t\t\t)}\n\t\t</RCSMediaContainer>\n\t);\n};\n"],"names":["PdfMediaCard","headerAssetLink","headerAssetName","Icon","FilePDFIcon","headerName","_a","split","pop","replace","_jsxs","RCSPdfContainer","children","_jsx","height","width","color","COLORS","icon","placeholder","PdfComineText","PdfText","RCSMediaCard","mediaType","imagePreviewStyles","isHorizontal","commonMediaPlayerStyle","minHeight","objectFit","borderRadius","RCSMediaContainer","Object","assign","HEADER_TYPES","IMAGE","ShimmerImage","imageUrl","alt","borderTopRightRadius","borderTopLeftRadius","VIDEO","src","style","controls","muted","default","kind","srcLang","_Fragment"],"mappings":"qZAaO,MAAMA,EAGRA,EAAGC,kBAAiBC,4BACxB,MAAMC,EAAOC,EACPC,EACLH,YACAI,EAAAL,eAAAA,EAAiBM,MAAM,KAAKC,4BAAOC,QAAQ,OAAQ,MACnD,WAED,OACCC,EAACC,EAAe,CAAAC,SAAA,CACfC,EAACV,EAAI,CAACW,OAAQ,GAAIC,MAAO,GAAIC,MAAOC,EAAOC,KAAKC,gBAC7Cd,GACFK,EAACU,aACAP,EAACQ,YAAShB,IACVQ,EAACQ,0BAGc,EAIPC,EAMRA,EACJrB,kBACAC,kBACAqB,YACAC,qBACAC,mBAEA,MAAMC,EAAyB,CAC9BX,MAAsB,OACtBY,UAAWF,EAAe,OAAS,QACnCX,OAAQW,EAAe,OAAS,QAChCG,UAAW,QACXC,aAAcJ,EAAe,MAAQ,IAGtC,OACCZ,EAACiB,EAAkBC,OAAAC,OAAA,CAAAP,eAAgBA,GAAY,CAAAb,SAC7CW,IAAcU,EAAaC,MAC3BrB,EAACsB,EAAY,CACZC,SAAUnC,EACVoC,IAAKpC,EACLc,MAAO,OACPD,OAAQW,EAAe,OAAS,IAChCD,kDACIA,GAAkB,CACrBc,qBAAsB,EACtBC,oBAAqB,MAGpBhB,IAAcU,EAAaO,MAC9B3B,EACC,QAAAkB,OAAAC,OAAA,CAAAS,IAAKxC,EACLyC,MAAOhB,EACPiB,UAAQ,EACRC,OAEA,GAAA,CAAAhC,SAAAC,EAAA,QAAA,CAAOgC,SAAO,EAACC,KAAK,WAAWC,QAAQ,KAAKN,IAAKxC,OAGlDY,EAAKmC,EAAA,MAEa"}

package/dist/esm/components/template-preview/RCS/RCSPreview.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RCSPreview.styled.js","sources":["../../../../../src/components/template-preview/RCS/RCSPreview.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\nimport { RCS_TEMPLATE_TYPE } from '../models/RCSTemplate';\n\nexport const RCSContainer = styled.div<{\n\tisCarousal?: boolean;\n\ttemplateType?: RCS_TEMPLATE_TYPE;\n}>`\n\tbackground-color: ${(props) => (props.isCarousal ? '#E0E0E0' : `white`)};\n\tborder-radius: 4px;\n\tposition: relative;\n\theight: ${(props) => (props.isCarousal ? '100%' : 'auto')};\n`;\n\nexport const RcsHtmlContainer = styled.div`\n\tfont-family: 'Inter';\n\tfont-style: normal;\n\tfont-weight: 400;\n\tfont-size: 14px;\n\tline-height: 20px;\n\tpadding: 12px;\n\tcolor: ${COLORS.content.primary};\n\tword-wrap: break-word;\n`;\n\nexport const HeaderTextContainer = styled(RcsHtmlContainer)`\n\tfont-weight: 600;\n\tmargin-bottom: 8px;\n`;\n\nexport const TitleTextContainer = styled(RcsHtmlContainer)`\n\tfont-weight: 600;\n`;\nexport const RCSPreviewContainer = styled.div<{\n\tisCarouselCard?: boolean;\n\tshowBorder?: boolean;\n\tshowDashedBorder?: boolean;\n\tisWhatsappCarousel?: boolean;\n\thasError?: boolean;\n\tisPreview?: boolean;\n\tneedBorder?: boolean;\n\tisHorizontalOrientation?: boolean;\n}>`\n\tbackground: ${COLORS.surface.standard};\n\tborder-radius: 12px;\n\tposition: relative;\n\theight: 100%;\n\tdisplay: flex;\n\tflex-direction: ${(props) =>\n\t\tprops.isHorizontalOrientation ? 'row' : 'column'};\n\n\t${(props) => {\n\t\tif (!props.needBorder) return `border: none;`;\n\t\tif (props.showDashedBorder)\n\t\t\treturn `border: 2px dashed ${COLORS.content.brand};`;\n\t\tif (props.hasError) return `border: 2px solid ${COLORS.content.negative};`;\n\t\tif (props.showBorder) return `border: 2px solid ${COLORS.stroke.brand};`;\n\t\treturn `border: 2px solid ${COLORS.stroke.primary};`;\n\t}}\n\n\t:hover {\n\t\t${(props) => {\n\t\t\tif (props.isPreview \|\| !props.needBorder) return '';\n\n\t\t\tconst borderStyle = props.isWhatsappCarousel\n\t\t\t\t? props.hasError\n\t\t\t\t\t? 'dashed'\n\t\t\t\t\t: props.showBorder\n\t\t\t\t\t? 'solid'\n\t\t\t\t\t: 'dashed'\n\t\t\t\t: 'solid';\n\n\t\t\treturn `\n\t\t\t\tborder: 2px ${borderStyle} ${COLORS.stroke.brand};\n\t\t\t\tbox-shadow: 4px 4px 12px rgba(0, 0, 0, 0.25);\n\t\t\t`;\n\t\t}}\n\t}\n\n\t.text--template {\n\t\tborder: 2px solid ${COLORS.stroke.primary};\n\t\tborder-radius: 12px;\n\t\tflex: 1;\n\t}\n`;\n\nexport const RCSChatBtnContainer = styled.div`\n\tpadding: 12px 0px;\n\tdisplay: flex;\n\tflex-direction: row;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tgap: 12px;\n\tflex-wrap: wrap;\n`;\n\nexport const RCSMediaContainer = styled.div<{ isHorizontal: boolean }>`\n\tborder-radius: 8px;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\tmin-height: 152px;\n\tmargin-bottom: ${(props) => (props.isHorizontal ? '' : '4px')};\n\twidth: ${(props) => (props.isHorizontal ? '50%' : 'auto')};\n`;\nexport const RCSPdfContainer = styled.div`\n\tborder-radius: 12px;\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tjustify-content: flex-start;\n\tpadding: 4px;\n\tbackground-color: #ede7e8;\n\tmargin: 4px;\n\tmax-width: 200px;\n`;\nexport const PdfComineText = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tjustify-content: flex-start;\n\tmargin-left: 4px;\n\tmax-width: 180px;\n`;\nexport const PdfText = styled.p`\n\twhite-space: nowrap;\n\tcolor: #4c5567;\n\tmax-width: 100px;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\tpadding: 0px;\n\tmargin: 0px;\n\tfont-size: 12px;\n\tfont-weight: 500;\n\tline-width: 20px;\n`;\n\nexport const RCSCarousalContainer = styled.div<{ borderRadius?: string }>`\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tposition: relative;\n\theight: 500px;\n\toverflow-y: auto;\n\tborder-radius: ${(props) => props.borderRadius ?? '8px'};\n\tbox-shadow: 0px 2px 8px 0px #0000001f;\n\tbackground-color: white;\n`;\n\n/* header */\nexport const HeaderContainer = styled.div`\n\theight: 50px;\n\tbackground-color: ${COLORS.background.inactive};\n\tposition: sticky;\n\ttop: 0px;\n\tz-index: 200;\n\tpadding: 6px 4px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tgap: 5px;\n`;\n\nexport const LeftContainer = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 5px;\n`;\n\nexport const IconContainer = styled.div`\n\theight: 27px;\n\twidth: 27px;\n\tborder-radius: 15px;\n\tbackground-color: #d1d8db;\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tgap: 6px;\n`;\n\nexport const TitleContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n`;\n\nexport const SubTitle = styled.p`\n\tfont-family: 'Inter';\n\tfont-style: normal;\n\tfont-weight: 400;\n\tfont-size: 8px;\n\tline-height: 11px;\n\tcolor: ${COLORS.content.secondary};\n\tmargin-bottom: 0px;\n`;\n"],"names":["styled","div","props","isCarousal","RcsHtmlContainer","COLORS","content","primary","HeaderTextContainer","TitleTextContainer","RCSPreviewContainer","surface","standard","isHorizontalOrientation","needBorder","showDashedBorder","brand","hasError","negative","showBorder","stroke","isPreview","isWhatsappCarousel","RCSChatBtnContainer","RCSMediaContainer","isHorizontal","RCSPdfContainer","PdfComineText","PdfText","p","RCSCarousalContainer","_a","borderRadius","HeaderContainer","background","inactive","LeftContainer","IconContainer","TitleContainer","SubTitle","secondary"],"mappings":"sFAI4BA,EAAOC,GAGjC;qBACoBC,GAAWA,EAAMC,WAAa;;;~~WAGxCD~~,GAAWA,EAAMC,WAAa,OAAS;EAGtCC,MAAAA,EAAmBJ,EAAOC,GAAG;;;;;;;UAOhCI,EAAOC,QAAQC;;EAIZC,EAAsBR,EAAOI,EAAiB;;;EAK9CK,EAAqBT,EAAOI,EAAiB;;EAG7CM,EAAsBV,EAAOC,GASxC;eACaI,EAAOM,QAAQC;;;;;mBAKVV,GAClBA,EAAMW,wBAA0B,MAAQ;;GAEtCX,GACGA,EAAMY,WACPZ,EAAMa,~~uCACoBV~~,EAAOC,QAAQU,SACzCd,EAAMe,~~8BAAsCZ~~,EAAOC,QAAQY,YAC3DhB,EAAMiB,~~gCAAwCd~~,EAAOe,OAAOJ,~~8BACpCX~~,EAAOe,OAAOb;;;~~IAIvCL~~,IACF,GAAIA,EAAMmB,YAAcnB,EAAMY,WAAY,MAAO,GAUjD,MAAO,yBARaZ,EAAMoB,mBACvBpB,EAAMe,SACL,SACAf,EAAMiB,WACN,QACA,SACD,WAG2Bd,EAAOe,OAAOJ,uEAE3C;;;;sBAKkBX,EAAOe,OAAOb;;;;EAMvBgB,EAAsBvB,EAAOC,GAAG;;;;;;;;EAUhCuB,EAAoBxB,EAAOC,GAA8B;;;;;;;kBAOnDC,GAAWA,EAAMuB,aAAe,GAAK;UAC7CvB,GAAWA,EAAMuB,aAAe,MAAQ;EAEtCC,EAAkB1B,EAAOC,GAAG;;;;;;;;;;EAW5B0B,EAAgB3B,EAAOC,GAAG;;;;;;;EAQ1B2B,EAAU5B,EAAO6B,CAAC;;;;;;;;;;;EAalBC,EAAuB9B,EAAOC,GAA8B;qBACpDI,EAAOe,OAAOb;;;;kBAIhBL,IAAS,IAAA6B,EAAC,OAAkB,QAAlBA,EAAA7B,EAAM8B,oBAAY,IAAAD,EAAAA,EAAI,KAAK;;;EAM3CE,EAAkBjC,EAAOC,GAAG;;qBAEpBI,EAAO6B,WAAWC;;;;;;;;;EAW1BC,EAAgBpC,EAAOC,GAAG;;;;EAM1BoC,EAAgBrC,EAAOC,GAAG;;;;;;;;;EAW1BqC,EAAiBtC,EAAOC,GAAG;;;;EAM3BsC,EAAWvC,EAAO6B,CAAC;;;;;;UAMtBxB,EAAOC,QAAQkC;;"}
1	+ {"version":3,"file":"RCSPreview.styled.js","sources":["../../../../../src/components/template-preview/RCS/RCSPreview.styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { COLORS } from '@src/constants/Theme';\nimport { RCS_TEMPLATE_TYPE } from '../models/RCSTemplate';\n\nexport const RCSContainer = styled.div<{\n\tisCarousal?: boolean;\n\ttemplateType?: RCS_TEMPLATE_TYPE;\n}>`\n\tbackground-color: ${(props) => (props.isCarousal ? '#E0E0E0' : `white`)};\n\tborder-radius: 4px;\n\tposition: relative;\n\theight: ${(props) => (props.isCarousal ? '100%' : 'auto')};\n`;\n\nexport const RcsHtmlContainer = styled.div`\n\tfont-family: 'Inter';\n\tfont-style: normal;\n\tfont-weight: 400;\n\tfont-size: 14px;\n\tline-height: 20px;\n\tpadding: 12px;\n\tcolor: ${COLORS.content.primary};\n\tword-wrap: break-word;\n`;\n\nexport const HeaderTextContainer = styled(RcsHtmlContainer)`\n\tfont-weight: 600;\n\tmargin-bottom: 8px;\n`;\n\nexport const TitleTextContainer = styled(RcsHtmlContainer)`\n\tfont-weight: 600;\n`;\nexport const RCSPreviewContainer = styled.div<{\n\tisCarouselCard?: boolean;\n\tshowBorder?: boolean;\n\tshowDashedBorder?: boolean;\n\tisWhatsappCarousel?: boolean;\n\thasError?: boolean;\n\tisPreview?: boolean;\n\tneedBorder?: boolean;\n\tisHorizontalOrientation?: boolean;\n}>`\n\tbackground: ${COLORS.surface.standard};\n\tborder-radius: 12px;\n\tposition: relative;\n\theight: 100%;\n\tdisplay: flex;\n\tflex-direction: ${(props) =>\n\t\tprops.isHorizontalOrientation ? 'row' : 'column'};\n\n\t${(props) => {\n\t\tif (!props.needBorder) return `border: none;`;\n\t\tif (props.showDashedBorder)\n\t\t\treturn `border: 2px dashed ${COLORS.content.brand};`;\n\t\tif (props.hasError) return `border: 2px solid ${COLORS.content.negative};`;\n\t\tif (props.showBorder) return `border: 2px solid ${COLORS.stroke.brand};`;\n\t\treturn `border: 2px solid ${COLORS.stroke.primary};`;\n\t}}\n\n\t:hover {\n\t\t${(props) => {\n\t\t\tif (props.isPreview \|\| !props.needBorder) return '';\n\n\t\t\tconst borderStyle = props.isWhatsappCarousel\n\t\t\t\t? props.hasError\n\t\t\t\t\t? 'dashed'\n\t\t\t\t\t: props.showBorder\n\t\t\t\t\t? 'solid'\n\t\t\t\t\t: 'dashed'\n\t\t\t\t: 'solid';\n\n\t\t\treturn `\n\t\t\t\tborder: 2px ${borderStyle} ${COLORS.stroke.brand};\n\t\t\t\tbox-shadow: 4px 4px 12px rgba(0, 0, 0, 0.25);\n\t\t\t`;\n\t\t}}\n\t}\n\n\t.text--template {\n\t\tborder: 2px solid ${COLORS.stroke.primary};\n\t\tborder-radius: 12px;\n\t\tflex: 1;\n\t}\n`;\n\nexport const RCSChatBtnContainer = styled.div`\n\tpadding: 12px 0px;\n\tdisplay: flex;\n\tflex-direction: row;\n\tjustify-content: flex-start;\n\talign-items: center;\n\tgap: 12px;\n\tflex-wrap: wrap;\n`;\n\nexport const RCSMediaContainer = styled.div<{ isHorizontal: boolean }>`\n\tborder-radius: 8px;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\tmin-height: 152px;\n\tmargin-bottom: ${(props) => (props.isHorizontal ? '' : '4px')};\n\twidth: ${(props) => (props.isHorizontal ? '50%' : 'auto')};\n`;\nexport const RCSPdfContainer = styled.div`\n\tborder-radius: 12px;\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tjustify-content: flex-start;\n\tpadding: 4px;\n\tbackground-color: #ede7e8;\n\tmargin: 4px;\n\tmax-width: 200px;\n`;\nexport const PdfComineText = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tjustify-content: flex-start;\n\tmargin-left: 4px;\n\tmax-width: 180px;\n`;\nexport const PdfText = styled.p`\n\twhite-space: nowrap;\n\tcolor: #4c5567;\n\tmax-width: 100px;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n\tpadding: 0px;\n\tmargin: 0px;\n\tfont-size: 12px;\n\tfont-weight: 500;\n\tline-width: 20px;\n`;\n\nexport const RCSCarousalContainer = styled.div<{ borderRadius?: string }>`\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tposition: relative;\n\theight: 500px;\n\toverflow-y: auto;\n\tborder-radius: ${(props) => props.borderRadius ?? '8px'};\n\tbox-shadow: 0px 2px 8px 0px #0000001f;\n\tbackground-color: white;\n`;\n\n/* header */\nexport const HeaderContainer = styled.div`\n\theight: 50px;\n\tbackground-color: ${COLORS.background.inactive};\n\tposition: sticky;\n\ttop: 0px;\n\tz-index: 200;\n\tpadding: 6px 4px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tgap: 5px;\n`;\n\nexport const LeftContainer = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 5px;\n`;\n\nexport const IconContainer = styled.div`\n\theight: 27px;\n\twidth: 27px;\n\tborder-radius: 15px;\n\tbackground-color: #d1d8db;\n\tdisplay: flex;\n\tjustify-content: center;\n\talign-items: center;\n\tgap: 6px;\n`;\n\nexport const TitleContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\tjustify-content: space-between;\n`;\n\nexport const SubTitle = styled.p`\n\tfont-family: 'Inter';\n\tfont-style: normal;\n\tfont-weight: 400;\n\tfont-size: 8px;\n\tline-height: 11px;\n\tcolor: ${COLORS.content.secondary};\n\tmargin-bottom: 0px;\n`;\n"],"names":["styled","div","props","isCarousal","RcsHtmlContainer","COLORS","content","primary","HeaderTextContainer","TitleTextContainer","RCSPreviewContainer","surface","standard","isHorizontalOrientation","needBorder","showDashedBorder","brand","hasError","negative","showBorder","stroke","isPreview","isWhatsappCarousel","RCSChatBtnContainer","RCSMediaContainer","isHorizontal","RCSPdfContainer","PdfComineText","PdfText","p","RCSCarousalContainer","_a","borderRadius","HeaderContainer","background","inactive","LeftContainer","IconContainer","TitleContainer","SubTitle","secondary"],"mappings":"sFAI4BA,EAAOC,GAGjC;qBACoBC,GAAWA,EAAMC,WAAa,UAAY;;;WAGpDD,GAAWA,EAAMC,WAAa,OAAS;EAGtCC,MAAAA,EAAmBJ,EAAOC,GAAG;;;;;;;UAOhCI,EAAOC,QAAQC;;EAIZC,EAAsBR,EAAOI,EAAiB;;;EAK9CK,EAAqBT,EAAOI,EAAiB;;EAG7CM,EAAsBV,EAAOC,GASxC;eACaI,EAAOM,QAAQC;;;;;mBAKVV,GAClBA,EAAMW,wBAA0B,MAAQ;;GAEtCX,GACGA,EAAMY,WACPZ,EAAMa,iBACF,sBAAsBV,EAAOC,QAAQU,SACzCd,EAAMe,SAAiB,qBAAqBZ,EAAOC,QAAQY,YAC3DhB,EAAMiB,WAAmB,qBAAqBd,EAAOe,OAAOJ,SACzD,qBAAqBX,EAAOe,OAAOb,WALZ;;;IAS3BL,IACF,GAAIA,EAAMmB,YAAcnB,EAAMY,WAAY,MAAO,GAUjD,MAAO,yBARaZ,EAAMoB,mBACvBpB,EAAMe,SACL,SACAf,EAAMiB,WACN,QACA,SACD,WAG2Bd,EAAOe,OAAOJ,uEAE3C;;;;sBAKkBX,EAAOe,OAAOb;;;;EAMvBgB,EAAsBvB,EAAOC,GAAG;;;;;;;;EAUhCuB,EAAoBxB,EAAOC,GAA8B;;;;;;;kBAOnDC,GAAWA,EAAMuB,aAAe,GAAK;UAC7CvB,GAAWA,EAAMuB,aAAe,MAAQ;EAEtCC,EAAkB1B,EAAOC,GAAG;;;;;;;;;;EAW5B0B,EAAgB3B,EAAOC,GAAG;;;;;;;EAQ1B2B,EAAU5B,EAAO6B,CAAC;;;;;;;;;;;EAalBC,EAAuB9B,EAAOC,GAA8B;qBACpDI,EAAOe,OAAOb;;;;kBAIhBL,IAAS,IAAA6B,EAAC,OAAkB,QAAlBA,EAAA7B,EAAM8B,oBAAY,IAAAD,EAAAA,EAAI,KAAK;;;EAM3CE,EAAkBjC,EAAOC,GAAG;;qBAEpBI,EAAO6B,WAAWC;;;;;;;;;EAW1BC,EAAgBpC,EAAOC,GAAG;;;;EAM1BoC,EAAgBrC,EAAOC,GAAG;;;;;;;;;EAW1BqC,EAAiBtC,EAAOC,GAAG;;;;EAM3BsC,EAAWvC,EAAO6B,CAAC;;;;;;UAMtBxB,EAAOC,QAAQkC;;"}

package/dist/esm/components/template-preview/RCS/RCSTemplateLikePreview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RCSTemplateLikePreview.js","sources":["../../../../../src/components/template-preview/RCS/RCSTemplateLikePreview.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport { TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { RCSPreviewPropsV2 } from '../models/RCSTemplate';\nimport { getPreviewPropLen } from '../utils/getPreviewPropLen';\nimport RCSChatHeader from './RCSChatHeader';\nimport { RCSChatPreview } from './RCSChatPreview';\n\nconst Container = styled.div<{\n\tshowHeader?: boolean;\n\tisWhatsappCarousel?: boolean;\n}>`\n\tbackground-color: white;\n\tborder-radius: 4px;\n\tposition: relative;\n\theight: ${(props) => (props.isWhatsappCarousel ? '100%' : 'auto')};\n`;\n\nconst PreviewText = styled(TitleRegular)`\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const RCSTemplateLikePreview: React.FC<RCSPreviewPropsV2> = (props) => {\n\tconst { hideDeviceContainerInPreview } = useTemplateModalContext();\n\n\tconst propLength = getPreviewPropLen(props);\n\tif (propLength === 3) {\n\t\treturn <>{props.zeroStateComponent}</>;\n\t}\n\n\tif (hideDeviceContainerInPreview) {\n\t\treturn <RCSChatPreview showHeader={props.showHeader} {...props} />;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<Container\n\t\t\t\tstyle={props.containerStyle}\n\t\t\t\tshowHeader={props.showHeader}\n\t\t\t\tisWhatsappCarousel={props.isWhatsappCarousel}\n\t\t\t>\n\t\t\t\t{props.showHeader && <RCSChatHeader />}\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tpadding:\n\t\t\t\t\t\t\tprops.size === 'small'\n\t\t\t\t\t\t\t\t? '10px 32px 10px 10px'\n\t\t\t\t\t\t\t\t: `10px ${props.isWhatsappCarousel ? '0px' : '12px'} ${\n\t\t\t\t\t\t\t\t\t\tprops.isWhatsappCarousel ? '2px' : '16px'\n\t\t\t\t\t\t\t\t } 16px`,\n\t\t\t\t\t\theight: props.isWhatsappCarousel ? '100%' : 'auto',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{!props.hidePreviewText && (\n\t\t\t\t\t\t<div style={{ marginBottom: 16 }}>\n\t\t\t\t\t\t\t<PreviewText>Preview</PreviewText>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t<RCSChatPreview showHeader={props.showHeader} {...props} />\n\t\t\t\t</div>\n\t\t\t</Container>\n\t\t</>\n\t);\n};\n"],"names":["Container","styled","div","props","isWhatsappCarousel","PreviewText","TitleRegular","COLORS","content","primary","RCSTemplateLikePreview","hideDeviceContainerInPreview","useTemplateModalContext","getPreviewPropLen","_jsx","_Fragment","children","zeroStateComponent","RCSChatPreview","Object","assign","showHeader","_jsxs","style","containerStyle","RCSChatHeader","padding","size","height","hidePreviewText","marginBottom"],"mappings":"+cAUA,MAAMA,EAAYC,EAAOC,GAGvB;;;;WAIUC,GAAWA,EAAMC,mBAAqB,OAAS;EAGrDC,EAAcJ,EAAOK,EAAa;UAC9BC,EAAOC,QAAQC;EAGZC,EAAuDP,IACnE,MAAMQ,6BAAEA,GAAiCC,IAGzC,OAAmB,IADAC,EAAkBV,GAE7BW,EAAGC,EAAA,CAAAC,SAAAb,EAAMc,qBAGbN,EACIG,EAACI,EAAcC,OAAAC,OAAA,CAACC,WAAYlB,EAAMkB,YAAgBlB,IAIzDW,EAAAC,EAAA,CAAAC,SACCM,EAACtB,iBACAuB,MAAOpB,EAAMqB,eACbH,WAAYlB,EAAMkB,WAClBjB,mBAAoBD,EAAMC,+BAEzBD,EAAMkB,YAAcP,EAACW,EAAa,CAAA,GAEnCH,EAAA,MAAAH,OAAAC,OAAA,CACCG,MAAO,CACNG,QACgB,UAAfvB,EAAMwB,KACH,~~sBACQ~~,~~QAAAxB~~,EAAMC,mBAAqB,MAAQ,UAC3CD,EAAMC,mBAAqB,MAAQ,cAEvCwB,OAAQzB,EAAMC,mBAAqB,OAAS,SAC5C,CAAAY,SAAA,EAECb,EAAM0B,iBACPf,EAAK,MAAAK,OAAAC,OAAA,CAAAG,MAAO,CAAEO,aAAc,KAAI,CAAAd,SAC/BF,EAACT,EAAW,CAAAW,SAAA,eAGdF,EAACI,EAAeC,OAAAC,OAAA,CAAAC,WAAYlB,EAAMkB,YAAgBlB,aAGlD"}
1	+ {"version":3,"file":"RCSTemplateLikePreview.js","sources":["../../../../../src/components/template-preview/RCS/RCSTemplateLikePreview.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport { TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { RCSPreviewPropsV2 } from '../models/RCSTemplate';\nimport { getPreviewPropLen } from '../utils/getPreviewPropLen';\nimport RCSChatHeader from './RCSChatHeader';\nimport { RCSChatPreview } from './RCSChatPreview';\n\nconst Container = styled.div<{\n\tshowHeader?: boolean;\n\tisWhatsappCarousel?: boolean;\n}>`\n\tbackground-color: white;\n\tborder-radius: 4px;\n\tposition: relative;\n\theight: ${(props) => (props.isWhatsappCarousel ? '100%' : 'auto')};\n`;\n\nconst PreviewText = styled(TitleRegular)`\n\tcolor: ${COLORS.content.primary};\n`;\n\nexport const RCSTemplateLikePreview: React.FC<RCSPreviewPropsV2> = (props) => {\n\tconst { hideDeviceContainerInPreview } = useTemplateModalContext();\n\n\tconst propLength = getPreviewPropLen(props);\n\tif (propLength === 3) {\n\t\treturn <>{props.zeroStateComponent}</>;\n\t}\n\n\tif (hideDeviceContainerInPreview) {\n\t\treturn <RCSChatPreview showHeader={props.showHeader} {...props} />;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<Container\n\t\t\t\tstyle={props.containerStyle}\n\t\t\t\tshowHeader={props.showHeader}\n\t\t\t\tisWhatsappCarousel={props.isWhatsappCarousel}\n\t\t\t>\n\t\t\t\t{props.showHeader && <RCSChatHeader />}\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tpadding:\n\t\t\t\t\t\t\tprops.size === 'small'\n\t\t\t\t\t\t\t\t? '10px 32px 10px 10px'\n\t\t\t\t\t\t\t\t: `10px ${props.isWhatsappCarousel ? '0px' : '12px'} ${\n\t\t\t\t\t\t\t\t\t\tprops.isWhatsappCarousel ? '2px' : '16px'\n\t\t\t\t\t\t\t\t } 16px`,\n\t\t\t\t\t\theight: props.isWhatsappCarousel ? '100%' : 'auto',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{!props.hidePreviewText && (\n\t\t\t\t\t\t<div style={{ marginBottom: 16 }}>\n\t\t\t\t\t\t\t<PreviewText>Preview</PreviewText>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t<RCSChatPreview showHeader={props.showHeader} {...props} />\n\t\t\t\t</div>\n\t\t\t</Container>\n\t\t</>\n\t);\n};\n"],"names":["Container","styled","div","props","isWhatsappCarousel","PreviewText","TitleRegular","COLORS","content","primary","RCSTemplateLikePreview","hideDeviceContainerInPreview","useTemplateModalContext","getPreviewPropLen","_jsx","_Fragment","children","zeroStateComponent","RCSChatPreview","Object","assign","showHeader","_jsxs","style","containerStyle","RCSChatHeader","padding","size","height","hidePreviewText","marginBottom"],"mappings":"+cAUA,MAAMA,EAAYC,EAAOC,GAGvB;;;;WAIUC,GAAWA,EAAMC,mBAAqB,OAAS;EAGrDC,EAAcJ,EAAOK,EAAa;UAC9BC,EAAOC,QAAQC;EAGZC,EAAuDP,IACnE,MAAMQ,6BAAEA,GAAiCC,IAGzC,OAAmB,IADAC,EAAkBV,GAE7BW,EAAGC,EAAA,CAAAC,SAAAb,EAAMc,qBAGbN,EACIG,EAACI,EAAcC,OAAAC,OAAA,CAACC,WAAYlB,EAAMkB,YAAgBlB,IAIzDW,EAAAC,EAAA,CAAAC,SACCM,EAACtB,iBACAuB,MAAOpB,EAAMqB,eACbH,WAAYlB,EAAMkB,WAClBjB,mBAAoBD,EAAMC,+BAEzBD,EAAMkB,YAAcP,EAACW,EAAa,CAAA,GAEnCH,EAAA,MAAAH,OAAAC,OAAA,CACCG,MAAO,CACNG,QACgB,UAAfvB,EAAMwB,KACH,sBACA,QAAQxB,EAAMC,mBAAqB,MAAQ,UAC3CD,EAAMC,mBAAqB,MAAQ,cAEvCwB,OAAQzB,EAAMC,mBAAqB,OAAS,SAC5C,CAAAY,SAAA,EAECb,EAAM0B,iBACPf,EAAK,MAAAK,OAAAC,OAAA,CAAAG,MAAO,CAAEO,aAAc,KAAI,CAAAd,SAC/BF,EAACT,EAAW,CAAAW,SAAA,eAGdF,EAACI,EAAeC,OAAAC,OAAA,CAAAC,WAAYlB,EAAMkB,YAAgBlB,aAGlD"}

package/dist/esm/components/template-preview/SmsTemplatePreview.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import l from"../../assets/icons/arrow_left.svg.js";import n from"../../assets/icons/more_vertical.svg.js";import o from"../../assets/icons/search.svg.js";import{COLORS as r}from"../../constants/Theme.js";import{useTemplateModalContext as s}from"../template-context-mapper/context/templateModalContext.js";import{TitleRegular as a,Caption as c}from"../TypographyStyle.js";import{renderVariableUIForPreview as d}from"./helpers/SmsTemplateHelper.js";import m from"./SMS/SMSBubble.js";import{SMSBubbleContainer as p,SMSCardHeader as h,SMSHeader as u}from"./SmsTemplatePreview.styled.js";const v=v=>{let{template:f,variableStore:g,hideHeader:j,display_content:y,onlyTemplateContent:x,size:b,uniqueId:w}=v;var S;const z=null==f?void 0:f.content,{hideDeviceContainerInPreview:O}=s();return O?e(p,Object.assign({size:b},{children:e(m,{size:null!=b?b:"large",content:null!=y?y:d(z,null!=g?g:[],void 0,null!=w?w:"")})})):t(i,{children:[!j&&!x&&e(h,{children:e(a,Object.assign({style:{maxWidth:"100%"}},{children:f.name}))}),!x&&e(u,{children:t(i,{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(l,{width:16,height:16,color:r.content.secondary}),e(c,{children:null===(S=null==f?void 0:f.headers)||void 0===S?void 0:S[0]})]})),t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(o,{width:16,height:16,color:r.content.secondary}),e(n,{width:16,height:16,color:r.content.secondary})]}))]})}),e(p,Object.assign({size:b},{children:e(m,{size:null!=b?b:"large",content:null!=y?y:d(z,null!=g?g:[],void 0,null!=w?w:"")})}))]})};export{v as default};
+import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import n from"../../assets/icons/arrow_left.svg.js";import l from"../../assets/icons/more_vertical.svg.js";import o from"../../assets/icons/search.svg.js";import{COLORS as r}from"../../constants/Theme.js";import{useTemplateModalContext as s}from"../template-context-mapper/context/templateModalContext.js";import{TitleRegular as a,Caption as c}from"../TypographyStyle.js";import{renderVariableUIForPreview as d}from"./helpers/SmsTemplateHelper.js";import m from"./SMS/SMSBubble.js";import{SMSBubbleContainer as p,SMSCardHeader as h,SMSHeader as u}from"./SmsTemplatePreview.styled.js";const v=({template:v,variableStore:f,hideHeader:g,display_content:j,onlyTemplateContent:y,size:x,uniqueId:b})=>{var w;const S=null==v?void 0:v.content,{hideDeviceContainerInPreview:z}=s();return z?e(p,Object.assign({size:x},{children:e(m,{size:null!=x?x:"large",content:null!=j?j:d(S,null!=f?f:[],void 0,null!=b?b:"")})})):t(i,{children:[!g&&!y&&e(h,{children:e(a,Object.assign({style:{maxWidth:"100%"}},{children:v.name}))}),!y&&e(u,{children:t(i,{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(n,{width:16,height:16,color:r.content.secondary}),e(c,{children:null===(w=null==v?void 0:v.headers)||void 0===w?void 0:w[0]})]})),t("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:8}},{children:[e(o,{width:16,height:16,color:r.content.secondary}),e(l,{width:16,height:16,color:r.content.secondary})]}))]})}),e(p,Object.assign({size:x},{children:e(m,{size:null!=x?x:"large",content:null!=j?j:d(S,null!=f?f:[],void 0,null!=b?b:"")})}))]})};export{v as default};
 //# sourceMappingURL=SmsTemplatePreview.js.map

package/dist/esm/components/template-preview/SmsTemplatePreview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SmsTemplatePreview.js","sources":["../../../../src/components/template-preview/SmsTemplatePreview.tsx"],"sourcesContent":["import BackIcon from '@src/assets/icons/arrow_left.svg';\nimport MoreActionsIcon from '@src/assets/icons/more_vertical.svg';\nimport SearchIcon from '@src/assets/icons/search.svg';\nimport React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { useTemplateModalContext } from '../template-context-mapper/context/templateModalContext';\nimport { Caption, TitleRegular } from '../TypographyStyle';\nimport { renderVariableUIForPreview } from './helpers/SmsTemplateHelper';\nimport { SMSTemplateType } from './models/SmsTemplate';\nimport { CUSTOM_VARIABLE } from './models/TemplateMeta';\nimport SMSBubble from './SMS/SMSBubble';\nimport {\n\tSMSBubbleContainer,\n\tSMSCardHeader,\n\tSMSHeader,\n} from './SmsTemplatePreview.styled';\n\nconst SmsTemplatePreview: React.FC<{\n\ttemplate: SMSTemplateType;\n\tvariableStore?: CUSTOM_VARIABLE[];\n\thideHeader?: boolean;\n\tonlyTemplateContent?: boolean;\n\tdisplay_content?: string;\n\tsize?: 'small' \| 'large';\n\tuniqueId?: string;\n}> = ({\n\ttemplate,\n\tvariableStore,\n\thideHeader,\n\tdisplay_content,\n\tonlyTemplateContent,\n\tsize,\n\tuniqueId,\n}) => {\n\tconst templateContent = template?.content;\n\n\tconst { hideDeviceContainerInPreview } = useTemplateModalContext();\n\n\tif (hideDeviceContainerInPreview) {\n\t\treturn (\n\t\t\t<SMSBubbleContainer size={size}>\n\t\t\t\t<SMSBubble\n\t\t\t\t\tsize={size ?? 'large'}\n\t\t\t\t\tcontent={\n\t\t\t\t\t\tdisplay_content ??\n\t\t\t\t\t\trenderVariableUIForPreview(\n\t\t\t\t\t\t\ttemplateContent,\n\t\t\t\t\t\t\tvariableStore ?? [],\n\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\tuniqueId ?? '',\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</SMSBubbleContainer>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{!hideHeader && !onlyTemplateContent && (\n\t\t\t\t<SMSCardHeader>\n\t\t\t\t\t<TitleRegular style={{ maxWidth: '100%' }}>\n\t\t\t\t\t\t{template.name}\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t</SMSCardHeader>\n\t\t\t)}\n\t\t\t{!onlyTemplateContent && (\n\t\t\t\t<SMSHeader>\n\t\t\t\t\t<>\n\t\t\t\t\t\t<div style={{ display: 'flex', flexDirection: 'row', gap: 8 }}>\n\t\t\t\t\t\t\t<BackIcon\n\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<Caption>{template?.headers?.[0]}</Caption>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div style={{ display: 'flex', flexDirection: 'row', gap: 8 }}>\n\t\t\t\t\t\t\t<SearchIcon\n\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<MoreActionsIcon\n\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</>\n\t\t\t\t</SMSHeader>\n\t\t\t)}\n\t\t\t<SMSBubbleContainer size={size}>\n\t\t\t\t<SMSBubble\n\t\t\t\t\tsize={size ?? 'large'}\n\t\t\t\t\tcontent={\n\t\t\t\t\t\tdisplay_content ??\n\t\t\t\t\t\trenderVariableUIForPreview(\n\t\t\t\t\t\t\ttemplateContent,\n\t\t\t\t\t\t\t// template.content,\n\t\t\t\t\t\t\tvariableStore ?? [],\n\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\tuniqueId ?? '',\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</SMSBubbleContainer>\n\t\t</>\n\t);\n};\n\nexport default SmsTemplatePreview;\n"],"names":["SmsTemplatePreview","~~_ref","~~template","variableStore","hideHeader","display_content","onlyTemplateContent","size","uniqueId","templateContent","content","hideDeviceContainerInPreview","useTemplateModalContext","_jsx","SMSBubbleContainer","Object","assign","children","SMSBubble","renderVariableUIForPreview","undefined","_jsxs","_Fragment","SMSCardHeader","TitleRegular","style","maxWidth","name","SMSHeader","display","flexDirection","gap","BackIcon","width","height","color","COLORS","secondary","Caption","_a","headers","SearchIcon","MoreActionsIcon"],"mappings":"woBAiBMA,MAAAA,~~EAQDC~~,~~IAQA~~,~~IARCC~~,~~SACLA~~,~~EAAQC~~,~~cACRA~~,~~EAAaC~~,~~WACbA~~,~~EAAUC~~,~~gBACVA~~,~~EAAeC,oBACfA,EAAmBC,KACnBA,EAAIC,SACJA,GACAP,QACA,MAAMQ,~~EAAkBP,aAAA,EAAAA,EAAUQ,SAE5BC,6BAAEA,GAAiCC,IAEzC,OAAID,EAEFE,EAACC,EAAmBC,OAAAC,OAAA,CAAAT,KAAMA,GAAI,CAAAU,SAC7BJ,EAACK,EACA,CAAAX,KAAMA,QAAAA,EAAQ,QACdG,QACCL,QAAAA,EACAc,EACCV,EACAN,QAAAA,EAAiB,QACjBiB,EACAZ,QAAAA,EAAY,SASjBa,EACEC,EAAA,CAAAL,SAAA,EAACb,IAAeE,GAChBO,EAACU,EAAa,CAAAN,SACbJ,EAACW,EAAYT,OAAAC,OAAA,CAACS,MAAO,CAAEC,SAAU,SAAQ,CAAAT,SACvCf,EAASyB,WAIXrB,GACDO,EAACe,EACA,CAAAX,SAAAI,EAAAC,EAAA,CAAAL,SAAA,CACCI,uBAAKI,MAAO,CAAEI,QAAS,OAAQC,cAAe,MAAOC,IAAK,IAAG,CAAAd,SAAA,CAC5DJ,EAACmB,EAAQ,CACRC,MAAO,GACPC,OAAQ,GACRC,MAAOC,EAAO1B,QAAQ2B,YAEvBxB,EAACyB,EAAS,CAAArB,SAAoB,QAApBsB,EAAArC,eAAAA,EAAUsC,eAAU,IAAAD,OAAA,EAAAA,EAAA,SAE/BlB,EAAA,MAAAN,OAAAC,OAAA,CAAKS,MAAO,CAAEI,QAAS,OAAQC,cAAe,MAAOC,IAAK,eACzDlB,EAAC4B,GACAR,MAAO,GACPC,OAAQ,GACRC,MAAOC,EAAO1B,QAAQ2B,YAEvBxB,EAAC6B,EAAe,CACfT,MAAO,GACPC,OAAQ,GACRC,MAAOC,EAAO1B,QAAQ2B,qBAM3BxB,EAACC,iBAAmBP,KAAMA,GACzB,CAAAU,SAAAJ,EAACK,EACA,CAAAX,KAAMA,QAAAA,EAAQ,QACdG,QACCL,QAAAA,EACAc,EACCV,EAEAN,QAAAA,EAAiB,QACjBiB,EACAZ,QAAAA,EAAY,WAKd"}
1	+ {"version":3,"file":"SmsTemplatePreview.js","sources":["../../../../src/components/template-preview/SmsTemplatePreview.tsx"],"sourcesContent":["import BackIcon from '@src/assets/icons/arrow_left.svg';\nimport MoreActionsIcon from '@src/assets/icons/more_vertical.svg';\nimport SearchIcon from '@src/assets/icons/search.svg';\nimport React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { useTemplateModalContext } from '../template-context-mapper/context/templateModalContext';\nimport { Caption, TitleRegular } from '../TypographyStyle';\nimport { renderVariableUIForPreview } from './helpers/SmsTemplateHelper';\nimport { SMSTemplateType } from './models/SmsTemplate';\nimport { CUSTOM_VARIABLE } from './models/TemplateMeta';\nimport SMSBubble from './SMS/SMSBubble';\nimport {\n\tSMSBubbleContainer,\n\tSMSCardHeader,\n\tSMSHeader,\n} from './SmsTemplatePreview.styled';\n\nconst SmsTemplatePreview: React.FC<{\n\ttemplate: SMSTemplateType;\n\tvariableStore?: CUSTOM_VARIABLE[];\n\thideHeader?: boolean;\n\tonlyTemplateContent?: boolean;\n\tdisplay_content?: string;\n\tsize?: 'small' \| 'large';\n\tuniqueId?: string;\n}> = ({\n\ttemplate,\n\tvariableStore,\n\thideHeader,\n\tdisplay_content,\n\tonlyTemplateContent,\n\tsize,\n\tuniqueId,\n}) => {\n\tconst templateContent = template?.content;\n\n\tconst { hideDeviceContainerInPreview } = useTemplateModalContext();\n\n\tif (hideDeviceContainerInPreview) {\n\t\treturn (\n\t\t\t<SMSBubbleContainer size={size}>\n\t\t\t\t<SMSBubble\n\t\t\t\t\tsize={size ?? 'large'}\n\t\t\t\t\tcontent={\n\t\t\t\t\t\tdisplay_content ??\n\t\t\t\t\t\trenderVariableUIForPreview(\n\t\t\t\t\t\t\ttemplateContent,\n\t\t\t\t\t\t\tvariableStore ?? [],\n\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\tuniqueId ?? '',\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</SMSBubbleContainer>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t{!hideHeader && !onlyTemplateContent && (\n\t\t\t\t<SMSCardHeader>\n\t\t\t\t\t<TitleRegular style={{ maxWidth: '100%' }}>\n\t\t\t\t\t\t{template.name}\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t</SMSCardHeader>\n\t\t\t)}\n\t\t\t{!onlyTemplateContent && (\n\t\t\t\t<SMSHeader>\n\t\t\t\t\t<>\n\t\t\t\t\t\t<div style={{ display: 'flex', flexDirection: 'row', gap: 8 }}>\n\t\t\t\t\t\t\t<BackIcon\n\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<Caption>{template?.headers?.[0]}</Caption>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div style={{ display: 'flex', flexDirection: 'row', gap: 8 }}>\n\t\t\t\t\t\t\t<SearchIcon\n\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<MoreActionsIcon\n\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</>\n\t\t\t\t</SMSHeader>\n\t\t\t)}\n\t\t\t<SMSBubbleContainer size={size}>\n\t\t\t\t<SMSBubble\n\t\t\t\t\tsize={size ?? 'large'}\n\t\t\t\t\tcontent={\n\t\t\t\t\t\tdisplay_content ??\n\t\t\t\t\t\trenderVariableUIForPreview(\n\t\t\t\t\t\t\ttemplateContent,\n\t\t\t\t\t\t\t// template.content,\n\t\t\t\t\t\t\tvariableStore ?? [],\n\t\t\t\t\t\t\tundefined,\n\t\t\t\t\t\t\tuniqueId ?? '',\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</SMSBubbleContainer>\n\t\t</>\n\t);\n};\n\nexport default SmsTemplatePreview;\n"],"names":["SmsTemplatePreview","template","variableStore","hideHeader","display_content","onlyTemplateContent","size","uniqueId","templateContent","content","hideDeviceContainerInPreview","useTemplateModalContext","_jsx","SMSBubbleContainer","Object","assign","children","SMSBubble","renderVariableUIForPreview","undefined","_jsxs","_Fragment","SMSCardHeader","TitleRegular","style","maxWidth","name","SMSHeader","display","flexDirection","gap","BackIcon","width","height","color","COLORS","secondary","Caption","_a","headers","SearchIcon","MoreActionsIcon"],"mappings":"woBAiBMA,MAAAA,EAQDA,EACJC,WACAC,gBACAC,aACAC,kBACAC,sBACAC,OACAC,qBAEA,MAAMC,EAAkBP,aAAA,EAAAA,EAAUQ,SAE5BC,6BAAEA,GAAiCC,IAEzC,OAAID,EAEFE,EAACC,EAAmBC,OAAAC,OAAA,CAAAT,KAAMA,GAAI,CAAAU,SAC7BJ,EAACK,EACA,CAAAX,KAAMA,QAAAA,EAAQ,QACdG,QACCL,QAAAA,EACAc,EACCV,EACAN,QAAAA,EAAiB,QACjBiB,EACAZ,QAAAA,EAAY,SASjBa,EACEC,EAAA,CAAAL,SAAA,EAACb,IAAeE,GAChBO,EAACU,EAAa,CAAAN,SACbJ,EAACW,EAAYT,OAAAC,OAAA,CAACS,MAAO,CAAEC,SAAU,SAAQ,CAAAT,SACvCf,EAASyB,WAIXrB,GACDO,EAACe,EACA,CAAAX,SAAAI,EAAAC,EAAA,CAAAL,SAAA,CACCI,uBAAKI,MAAO,CAAEI,QAAS,OAAQC,cAAe,MAAOC,IAAK,IAAG,CAAAd,SAAA,CAC5DJ,EAACmB,EAAQ,CACRC,MAAO,GACPC,OAAQ,GACRC,MAAOC,EAAO1B,QAAQ2B,YAEvBxB,EAACyB,EAAS,CAAArB,SAAoB,QAApBsB,EAAArC,eAAAA,EAAUsC,eAAU,IAAAD,OAAA,EAAAA,EAAA,SAE/BlB,EAAA,MAAAN,OAAAC,OAAA,CAAKS,MAAO,CAAEI,QAAS,OAAQC,cAAe,MAAOC,IAAK,eACzDlB,EAAC4B,GACAR,MAAO,GACPC,OAAQ,GACRC,MAAOC,EAAO1B,QAAQ2B,YAEvBxB,EAAC6B,EAAe,CACfT,MAAO,GACPC,OAAQ,GACRC,MAAOC,EAAO1B,QAAQ2B,qBAM3BxB,EAACC,iBAAmBP,KAAMA,GACzB,CAAAU,SAAAJ,EAACK,EACA,CAAAX,KAAMA,QAAAA,EAAQ,QACdG,QACCL,QAAAA,EACAc,EACCV,EAEAN,QAAAA,EAAiB,QACjBiB,EACAZ,QAAAA,EAAY,WAKd"}

package/dist/esm/components/template-preview/TemplatePreview.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import{useTemplateModalContext as l}from"../template-context-mapper/context/templateModalContext.js";import n from"../../utils/StringUtils.js";import{COLORS as o}from"../../constants/Theme.js";import a from"../../assets/icons/aiContentIcon.svg.js";import{TitleRegular as r}from"../TypographyStyle.js";import s from"./EmailTemplateThumbnailPreview.js";import{CHANNEL_TYPE as d}from"./models/Channels.js";import p from"./SmsTemplatePreview.js";import{AiContentBadge as m}from"./TemplatePreview.styled.js";import u from"./webpush/WebpushPreview.js";import c from"./WhatsAppTemplatePreview.js";const v=v=>{let{template:C,channel:b,whatsAppSpecificMeta:g,templateCreationsInfo:y,hideHeader:S,size:j,onlyTemplateContent:f,emailSpecificMeta:w,smsSpecificMeta:T,showSampleValues:P,carouselCardIndex:x,isWhatsappCarousel:O,isPreview:W,applyBorderBottom:H,webPushSpecificMeta:I,hidePointerEvents:A}=v;var B,E;const{setSelectedCarouselIndex:M}=l();return b===d.SMS?e("div",Object.assign({style:Object.assign({marginTop:y?16:0,border:y?`1px solid ${o.stroke.primary}`:"none",borderRadius:4},null==T?void 0:T.templateContainerStyles)},{children:e(p,{template:C,hideHeader:S,onlyTemplateContent:f,size:null!=j?j:"large",variableStore:null==T?void 0:T.smsVariableStore,display_content:null==T?void 0:T.smsDisplayContent,uniqueId:null==T?void 0:T.uniqueId})})):b===d.EMAIL?e("div",Object.assign({style:Object.assign({marginTop:y?16:0},null==w?void 0:w.templateContainerStyles)},{children:e(s,{template:C,handleViewTemplate:()=>{var e;null===(e=null==w?void 0:w.handleViewTemplate)||void 0===e||e.call(w)},hideHeader:S,hideViewButton:null==w?void 0:w.hideViewButtonForEmail,containerStyle:null==w?void 0:w.containerStyle,emailDisplayContent:null==w?void 0:w.emailDisplayContent,emailHtmlContainerId:null==w?void 0:w.emailHtmlContainerId,applyBorderBottom:H,hidePointerEvents:A})})):b===d.WHATSAPP||b===d.RCS?t("div",Object.assign({style:Object.assign(Object.assign(Object.assign({},null==g?void 0:g.templateContainerStyles),y?h.WhatsAppWrapper:{}),{position:"relative"}),onClick:()=>{var e,t;if(M&&O){if(-1===x&&!(null===(t=null===(e=null==C?void 0:C.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length))return;M(null!=x?x:-1)}}},{children:[y?e("div",Object.assign({style:{padding:16}},{children:e(r,{children:n.convertToTitleCase(null!==(B=null==C?void 0:C.label)&&void 0!==B?B:"")})})):e(i,{}),e(c,{showSampleValues:P,showHeader:null==g?void 0:g.showWhatsAppHeader,extras:null==g?void 0:g.whatsAppExtras,template:C,size:y?"small":null!=j?j:"large",containerStyle:Object.assign(Object.assign({borderWidth:y?0:1,borderTopWidth:1},null!==(E=null==g?void 0:g.containerStyle)&&void 0!==E?E:{}),{height:"100%"}),zeroStateComponent:null==g?void 0:g.zeroStateComponent,usePlaceHolderName:null==g?void 0:g.usePlaceHolderName,carouselCardIndex:x,isWhatsappCarousel:O,isPreview:W,channel:b}),(!!(null==C?void 0:C.aiContentConfigId)||!!(null==C?void 0:C.isAiGenerated))&&!O&&e(m,{children:e(a,{width:48,height:48})})]})):b==d.WEBPUSH?e("div",Object.assign({style:Object.assign({},null==I?void 0:I.containerStyle)},{children:e(u,{template:C,extraContainerCss:null==I?void 0:I.extraContainerCss})})):e(i,{})},h={WhatsAppWrapper:{backgroundColor:o.surface.standard,borderRadius:4,border:`1px solid ${o.background.inactive}`,marginTop:16}};export{v as TemplatePreview};
+import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import{useTemplateModalContext as l}from"../template-context-mapper/context/templateModalContext.js";import n from"../../utils/StringUtils.js";import{COLORS as o}from"../../constants/Theme.js";import a from"../../assets/icons/aiContentIcon.svg.js";import{TitleRegular as r}from"../TypographyStyle.js";import s from"./EmailTemplateThumbnailPreview.js";import{CHANNEL_TYPE as d}from"./models/Channels.js";import p from"./SmsTemplatePreview.js";import{AiContentBadge as m}from"./TemplatePreview.styled.js";import u from"./webpush/WebpushPreview.js";import c from"./WhatsAppTemplatePreview.js";const v=({template:v,channel:C,whatsAppSpecificMeta:b,templateCreationsInfo:g,hideHeader:y,size:S,onlyTemplateContent:j,emailSpecificMeta:f,smsSpecificMeta:w,showSampleValues:T,carouselCardIndex:P,isWhatsappCarousel:x,isPreview:O,applyBorderBottom:W,webPushSpecificMeta:H,hidePointerEvents:I})=>{var A,B;const{setSelectedCarouselIndex:E}=l();return C===d.SMS?e("div",Object.assign({style:Object.assign({marginTop:g?16:0,border:g?`1px solid ${o.stroke.primary}`:"none",borderRadius:4},null==w?void 0:w.templateContainerStyles)},{children:e(p,{template:v,hideHeader:y,onlyTemplateContent:j,size:null!=S?S:"large",variableStore:null==w?void 0:w.smsVariableStore,display_content:null==w?void 0:w.smsDisplayContent,uniqueId:null==w?void 0:w.uniqueId})})):C===d.EMAIL?e("div",Object.assign({style:Object.assign({marginTop:g?16:0},null==f?void 0:f.templateContainerStyles)},{children:e(s,{template:v,handleViewTemplate:()=>{var e;null===(e=null==f?void 0:f.handleViewTemplate)||void 0===e||e.call(f)},hideHeader:y,hideViewButton:null==f?void 0:f.hideViewButtonForEmail,containerStyle:null==f?void 0:f.containerStyle,emailDisplayContent:null==f?void 0:f.emailDisplayContent,emailHtmlContainerId:null==f?void 0:f.emailHtmlContainerId,applyBorderBottom:W,hidePointerEvents:I})})):C===d.WHATSAPP||C===d.RCS?t("div",Object.assign({style:Object.assign(Object.assign(Object.assign({},null==b?void 0:b.templateContainerStyles),g?h.WhatsAppWrapper:{}),{position:"relative"}),onClick:()=>{var e,t;if(E&&x){if(-1===P&&!(null===(t=null===(e=null==v?void 0:v.mapping)||void 0===e?void 0:e.body)||void 0===t?void 0:t.length))return;E(null!=P?P:-1)}}},{children:[g?e("div",Object.assign({style:{padding:16}},{children:e(r,{children:n.convertToTitleCase(null!==(A=null==v?void 0:v.label)&&void 0!==A?A:"")})})):e(i,{}),e(c,{showSampleValues:T,showHeader:null==b?void 0:b.showWhatsAppHeader,extras:null==b?void 0:b.whatsAppExtras,template:v,size:g?"small":null!=S?S:"large",containerStyle:Object.assign(Object.assign({borderWidth:g?0:1,borderTopWidth:1},null!==(B=null==b?void 0:b.containerStyle)&&void 0!==B?B:{}),{height:"100%"}),zeroStateComponent:null==b?void 0:b.zeroStateComponent,usePlaceHolderName:null==b?void 0:b.usePlaceHolderName,carouselCardIndex:P,isWhatsappCarousel:x,isPreview:O,channel:C}),(!!(null==v?void 0:v.aiContentConfigId)||!!(null==v?void 0:v.isAiGenerated))&&!x&&e(m,{children:e(a,{width:48,height:48})})]})):C==d.WEBPUSH?e("div",Object.assign({style:Object.assign({},null==H?void 0:H.containerStyle)},{children:e(u,{template:v,extraContainerCss:null==H?void 0:H.extraContainerCss})})):e(i,{})},h={WhatsAppWrapper:{backgroundColor:o.surface.standard,borderRadius:4,border:`1px solid ${o.background.inactive}`,marginTop:16}};export{v as TemplatePreview};
 //# sourceMappingURL=TemplatePreview.js.map

package/dist/esm/components/template-preview/TemplatePreview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TemplatePreview.js","sources":["../../../../src/components/template-preview/TemplatePreview.tsx"],"sourcesContent":["import React from 'react';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport StringUtils from '@src/utils/StringUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport AiContentIcon from '../../assets/icons/aiContentIcon.svg';\nimport { TitleRegular } from '../TypographyStyle';\nimport EmailTemplateThumbnailPreview from './EmailTemplateThumbnailPreview';\nimport { CHANNEL_TYPE } from './models/Channels';\nimport { EmailMeta, EmailTemplateType } from './models/EmailTemplate';\nimport { SMSMeta, SMSTemplateType } from './models/SmsTemplate';\nimport { AllTemplateTypes } from './models/types';\nimport { WebpushMetaType, WebpushTemplateType } from './models/WebpushTemplate';\nimport { WhatsappMeta, WhatsAppTemplate } from './models/WhatsAppTemplate';\nimport SmsTemplatePreview from './SmsTemplatePreview';\nimport { AiContentBadge } from './TemplatePreview.styled';\nimport WebpushPreview from './webpush/WebpushPreview';\nimport WhatsappTemplatePreview from './WhatsAppTemplatePreview';\n\nexport interface TemplatePreviewProps {\n\ttemplate?: AllTemplateTypes;\n\tchannel: CHANNEL_TYPE;\n\tonlyTemplateContent?: boolean;\n\toutsidePreview?: boolean;\n\ttemplateCreationsInfo?: boolean;\n\twhatsAppSpecificMeta?: WhatsappMeta;\n\temailSpecificMeta?: EmailMeta;\n\tsmsSpecificMeta?: SMSMeta;\n\thideHeader?: boolean;\n\tsize?: 'small' \| 'large';\n\ttemplateContainerStyles?: React.CSSProperties;\n\tshowSampleValues?: boolean;\n\tcarouselCardIndex?: number;\n\tisWhatsappCarousel?: boolean;\n\tisPreview?: boolean;\n\tapplyBorderBottom?: boolean;\n\twebPushSpecificMeta?: WebpushMetaType;\n\thidePointerEvents?: boolean;\n}\nexport const TemplatePreview = ({\n\ttemplate,\n\tchannel,\n\twhatsAppSpecificMeta,\n\ttemplateCreationsInfo,\n\thideHeader,\n\tsize,\n\tonlyTemplateContent,\n\temailSpecificMeta,\n\tsmsSpecificMeta,\n\tshowSampleValues,\n\tcarouselCardIndex,\n\tisWhatsappCarousel,\n\tisPreview,\n\tapplyBorderBottom,\n\twebPushSpecificMeta,\n\thidePointerEvents,\n}: TemplatePreviewProps) => {\n\tconst { setSelectedCarouselIndex } = useTemplateModalContext();\n\tif (channel === CHANNEL_TYPE.SMS) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tmarginTop: templateCreationsInfo ? 16 : 0,\n\t\t\t\t\tborder: templateCreationsInfo\n\t\t\t\t\t\t? `1px solid ${COLORS.stroke.primary}`\n\t\t\t\t\t\t: 'none',\n\t\t\t\t\tborderRadius: 4,\n\t\t\t\t\t...smsSpecificMeta?.templateContainerStyles,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<SmsTemplatePreview\n\t\t\t\t\ttemplate={template as SMSTemplateType}\n\t\t\t\t\thideHeader={hideHeader}\n\t\t\t\t\tonlyTemplateContent={onlyTemplateContent}\n\t\t\t\t\tsize={size ?? 'large'}\n\t\t\t\t\tvariableStore={smsSpecificMeta?.smsVariableStore}\n\t\t\t\t\tdisplay_content={smsSpecificMeta?.smsDisplayContent}\n\t\t\t\t\tuniqueId={smsSpecificMeta?.uniqueId}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t} else if (channel === CHANNEL_TYPE.EMAIL) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tmarginTop: templateCreationsInfo ? 16 : 0,\n\t\t\t\t\t...emailSpecificMeta?.templateContainerStyles,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<EmailTemplateThumbnailPreview\n\t\t\t\t\ttemplate={template as EmailTemplateType}\n\t\t\t\t\thandleViewTemplate={() => {\n\t\t\t\t\t\temailSpecificMeta?.handleViewTemplate?.();\n\t\t\t\t\t}}\n\t\t\t\t\thideHeader={hideHeader}\n\t\t\t\t\thideViewButton={emailSpecificMeta?.hideViewButtonForEmail}\n\t\t\t\t\tcontainerStyle={emailSpecificMeta?.containerStyle}\n\t\t\t\t\temailDisplayContent={emailSpecificMeta?.emailDisplayContent}\n\t\t\t\t\temailHtmlContainerId={emailSpecificMeta?.emailHtmlContainerId}\n\t\t\t\t\tapplyBorderBottom={applyBorderBottom}\n\t\t\t\t\thidePointerEvents={hidePointerEvents}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t} else if (\n\t\tchannel === CHANNEL_TYPE.WHATSAPP \|\|\n\t\tchannel === CHANNEL_TYPE.RCS\n\t) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\t...whatsAppSpecificMeta?.templateContainerStyles,\n\t\t\t\t\t...(templateCreationsInfo ? styles.WhatsAppWrapper : {}),\n\t\t\t\t\tposition: 'relative',\n\t\t\t\t}}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tif (setSelectedCarouselIndex && isWhatsappCarousel) {\n\t\t\t\t\t\tif (carouselCardIndex === -1 && !template?.mapping?.body?.length) {\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tsetSelectedCarouselIndex(carouselCardIndex ?? -1);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{templateCreationsInfo ? (\n\t\t\t\t\t<div style={{ padding: 16 }}>\n\t\t\t\t\t\t<TitleRegular>\n\t\t\t\t\t\t\t{StringUtils.convertToTitleCase(template?.label ?? '')}\n\t\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<></>\n\t\t\t\t)}\n\t\t\t\t<WhatsappTemplatePreview\n\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\tshowHeader={whatsAppSpecificMeta?.showWhatsAppHeader}\n\t\t\t\t\textras={whatsAppSpecificMeta?.whatsAppExtras}\n\t\t\t\t\ttemplate={template as WhatsAppTemplate}\n\t\t\t\t\tsize={templateCreationsInfo ? 'small' : size ?? 'large'}\n\t\t\t\t\tcontainerStyle={{\n\t\t\t\t\t\tborderWidth: templateCreationsInfo ? 0 : 1,\n\t\t\t\t\t\tborderTopWidth: 1,\n\t\t\t\t\t\t...(whatsAppSpecificMeta?.containerStyle ?? {}),\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t}}\n\t\t\t\t\tzeroStateComponent={whatsAppSpecificMeta?.zeroStateComponent}\n\t\t\t\t\tusePlaceHolderName={whatsAppSpecificMeta?.usePlaceHolderName}\n\t\t\t\t\tcarouselCardIndex={carouselCardIndex}\n\t\t\t\t\tisWhatsappCarousel={isWhatsappCarousel}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\tchannel={channel}\n\t\t\t\t/>\n\t\t\t\t{(!!template?.['aiContentConfigId'] \|\| !!template?.['isAiGenerated']) &&\n\t\t\t\t\t!isWhatsappCarousel && (\n\t\t\t\t\t\t<AiContentBadge>\n\t\t\t\t\t\t\t<AiContentIcon width={48} height={48} />\n\t\t\t\t\t\t</AiContentBadge>\n\t\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t} else if (channel == CHANNEL_TYPE.WEBPUSH) {\n\t\treturn (\n\t\t\t<div style={{ ...webPushSpecificMeta?.containerStyle }}>\n\t\t\t\t<WebpushPreview\n\t\t\t\t\ttemplate={template as WebpushTemplateType}\n\t\t\t\t\textraContainerCss={webPushSpecificMeta?.extraContainerCss}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\t{\n\t\treturn <></>;\n\t}\n};\n\nconst styles = {\n\tWhatsAppWrapper: {\n\t\tbackgroundColor: COLORS.surface.standard,\n\t\tborderRadius: 4,\n\t\tborder: `1px solid ${COLORS.background.inactive}`,\n\t\tmarginTop: 16,\n\t},\n};\n"],"names":["TemplatePreview","_ref","template","channel","whatsAppSpecificMeta","templateCreationsInfo","hideHeader","size","onlyTemplateContent","emailSpecificMeta","smsSpecificMeta","showSampleValues","carouselCardIndex","isWhatsappCarousel","isPreview","applyBorderBottom","webPushSpecificMeta","hidePointerEvents","setSelectedCarouselIndex","useTemplateModalContext","CHANNEL_TYPE","SMS","_jsx","Object","assign","style","marginTop","border","COLORS","stroke","primary","borderRadius","templateContainerStyles","SmsTemplatePreview","variableStore","smsVariableStore","display_content","smsDisplayContent","uniqueId","EMAIL","EmailTemplateThumbnailPreview","handleViewTemplate","_a","hideViewButton","hideViewButtonForEmail","containerStyle","emailDisplayContent","emailHtmlContainerId","WHATSAPP","RCS","_jsxs","styles","WhatsAppWrapper","position","onClick","mapping","body","_b","length","children","padding","TitleRegular","StringUtils","convertToTitleCase","label","WhatsappTemplatePreview","showHeader","showWhatsAppHeader","extras","whatsAppExtras","borderWidth","borderTopWidth","height","zeroStateComponent","usePlaceHolderName","AiContentBadge","AiContentIcon","width","WEBPUSH","WebpushPreview","extraContainerCss","backgroundColor","surface","standard","background","inactive"],"mappings":"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"}
1	+ {"version":3,"file":"TemplatePreview.js","sources":["../../../../src/components/template-preview/TemplatePreview.tsx"],"sourcesContent":["import React from 'react';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport StringUtils from '@src/utils/StringUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport AiContentIcon from '../../assets/icons/aiContentIcon.svg';\nimport { TitleRegular } from '../TypographyStyle';\nimport EmailTemplateThumbnailPreview from './EmailTemplateThumbnailPreview';\nimport { CHANNEL_TYPE } from './models/Channels';\nimport { EmailMeta, EmailTemplateType } from './models/EmailTemplate';\nimport { SMSMeta, SMSTemplateType } from './models/SmsTemplate';\nimport { AllTemplateTypes } from './models/types';\nimport { WebpushMetaType, WebpushTemplateType } from './models/WebpushTemplate';\nimport { WhatsappMeta, WhatsAppTemplate } from './models/WhatsAppTemplate';\nimport SmsTemplatePreview from './SmsTemplatePreview';\nimport { AiContentBadge } from './TemplatePreview.styled';\nimport WebpushPreview from './webpush/WebpushPreview';\nimport WhatsappTemplatePreview from './WhatsAppTemplatePreview';\n\nexport interface TemplatePreviewProps {\n\ttemplate?: AllTemplateTypes;\n\tchannel: CHANNEL_TYPE;\n\tonlyTemplateContent?: boolean;\n\toutsidePreview?: boolean;\n\ttemplateCreationsInfo?: boolean;\n\twhatsAppSpecificMeta?: WhatsappMeta;\n\temailSpecificMeta?: EmailMeta;\n\tsmsSpecificMeta?: SMSMeta;\n\thideHeader?: boolean;\n\tsize?: 'small' \| 'large';\n\ttemplateContainerStyles?: React.CSSProperties;\n\tshowSampleValues?: boolean;\n\tcarouselCardIndex?: number;\n\tisWhatsappCarousel?: boolean;\n\tisPreview?: boolean;\n\tapplyBorderBottom?: boolean;\n\twebPushSpecificMeta?: WebpushMetaType;\n\thidePointerEvents?: boolean;\n}\nexport const TemplatePreview = ({\n\ttemplate,\n\tchannel,\n\twhatsAppSpecificMeta,\n\ttemplateCreationsInfo,\n\thideHeader,\n\tsize,\n\tonlyTemplateContent,\n\temailSpecificMeta,\n\tsmsSpecificMeta,\n\tshowSampleValues,\n\tcarouselCardIndex,\n\tisWhatsappCarousel,\n\tisPreview,\n\tapplyBorderBottom,\n\twebPushSpecificMeta,\n\thidePointerEvents,\n}: TemplatePreviewProps) => {\n\tconst { setSelectedCarouselIndex } = useTemplateModalContext();\n\tif (channel === CHANNEL_TYPE.SMS) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tmarginTop: templateCreationsInfo ? 16 : 0,\n\t\t\t\t\tborder: templateCreationsInfo\n\t\t\t\t\t\t? `1px solid ${COLORS.stroke.primary}`\n\t\t\t\t\t\t: 'none',\n\t\t\t\t\tborderRadius: 4,\n\t\t\t\t\t...smsSpecificMeta?.templateContainerStyles,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<SmsTemplatePreview\n\t\t\t\t\ttemplate={template as SMSTemplateType}\n\t\t\t\t\thideHeader={hideHeader}\n\t\t\t\t\tonlyTemplateContent={onlyTemplateContent}\n\t\t\t\t\tsize={size ?? 'large'}\n\t\t\t\t\tvariableStore={smsSpecificMeta?.smsVariableStore}\n\t\t\t\t\tdisplay_content={smsSpecificMeta?.smsDisplayContent}\n\t\t\t\t\tuniqueId={smsSpecificMeta?.uniqueId}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t} else if (channel === CHANNEL_TYPE.EMAIL) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tmarginTop: templateCreationsInfo ? 16 : 0,\n\t\t\t\t\t...emailSpecificMeta?.templateContainerStyles,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<EmailTemplateThumbnailPreview\n\t\t\t\t\ttemplate={template as EmailTemplateType}\n\t\t\t\t\thandleViewTemplate={() => {\n\t\t\t\t\t\temailSpecificMeta?.handleViewTemplate?.();\n\t\t\t\t\t}}\n\t\t\t\t\thideHeader={hideHeader}\n\t\t\t\t\thideViewButton={emailSpecificMeta?.hideViewButtonForEmail}\n\t\t\t\t\tcontainerStyle={emailSpecificMeta?.containerStyle}\n\t\t\t\t\temailDisplayContent={emailSpecificMeta?.emailDisplayContent}\n\t\t\t\t\temailHtmlContainerId={emailSpecificMeta?.emailHtmlContainerId}\n\t\t\t\t\tapplyBorderBottom={applyBorderBottom}\n\t\t\t\t\thidePointerEvents={hidePointerEvents}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t} else if (\n\t\tchannel === CHANNEL_TYPE.WHATSAPP \|\|\n\t\tchannel === CHANNEL_TYPE.RCS\n\t) {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\t...whatsAppSpecificMeta?.templateContainerStyles,\n\t\t\t\t\t...(templateCreationsInfo ? styles.WhatsAppWrapper : {}),\n\t\t\t\t\tposition: 'relative',\n\t\t\t\t}}\n\t\t\t\tonClick={() => {\n\t\t\t\t\tif (setSelectedCarouselIndex && isWhatsappCarousel) {\n\t\t\t\t\t\tif (carouselCardIndex === -1 && !template?.mapping?.body?.length) {\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tsetSelectedCarouselIndex(carouselCardIndex ?? -1);\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{templateCreationsInfo ? (\n\t\t\t\t\t<div style={{ padding: 16 }}>\n\t\t\t\t\t\t<TitleRegular>\n\t\t\t\t\t\t\t{StringUtils.convertToTitleCase(template?.label ?? '')}\n\t\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<></>\n\t\t\t\t)}\n\t\t\t\t<WhatsappTemplatePreview\n\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\tshowHeader={whatsAppSpecificMeta?.showWhatsAppHeader}\n\t\t\t\t\textras={whatsAppSpecificMeta?.whatsAppExtras}\n\t\t\t\t\ttemplate={template as WhatsAppTemplate}\n\t\t\t\t\tsize={templateCreationsInfo ? 'small' : size ?? 'large'}\n\t\t\t\t\tcontainerStyle={{\n\t\t\t\t\t\tborderWidth: templateCreationsInfo ? 0 : 1,\n\t\t\t\t\t\tborderTopWidth: 1,\n\t\t\t\t\t\t...(whatsAppSpecificMeta?.containerStyle ?? {}),\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t}}\n\t\t\t\t\tzeroStateComponent={whatsAppSpecificMeta?.zeroStateComponent}\n\t\t\t\t\tusePlaceHolderName={whatsAppSpecificMeta?.usePlaceHolderName}\n\t\t\t\t\tcarouselCardIndex={carouselCardIndex}\n\t\t\t\t\tisWhatsappCarousel={isWhatsappCarousel}\n\t\t\t\t\tisPreview={isPreview}\n\t\t\t\t\tchannel={channel}\n\t\t\t\t/>\n\t\t\t\t{(!!template?.['aiContentConfigId'] \|\| !!template?.['isAiGenerated']) &&\n\t\t\t\t\t!isWhatsappCarousel && (\n\t\t\t\t\t\t<AiContentBadge>\n\t\t\t\t\t\t\t<AiContentIcon width={48} height={48} />\n\t\t\t\t\t\t</AiContentBadge>\n\t\t\t\t\t)}\n\t\t\t</div>\n\t\t);\n\t} else if (channel == CHANNEL_TYPE.WEBPUSH) {\n\t\treturn (\n\t\t\t<div style={{ ...webPushSpecificMeta?.containerStyle }}>\n\t\t\t\t<WebpushPreview\n\t\t\t\t\ttemplate={template as WebpushTemplateType}\n\t\t\t\t\textraContainerCss={webPushSpecificMeta?.extraContainerCss}\n\t\t\t\t/>\n\t\t\t</div>\n\t\t);\n\t}\n\t{\n\t\treturn <></>;\n\t}\n};\n\nconst styles = {\n\tWhatsAppWrapper: {\n\t\tbackgroundColor: COLORS.surface.standard,\n\t\tborderRadius: 4,\n\t\tborder: `1px solid ${COLORS.background.inactive}`,\n\t\tmarginTop: 16,\n\t},\n};\n"],"names":["TemplatePreview","template","channel","whatsAppSpecificMeta","templateCreationsInfo","hideHeader","size","onlyTemplateContent","emailSpecificMeta","smsSpecificMeta","showSampleValues","carouselCardIndex","isWhatsappCarousel","isPreview","applyBorderBottom","webPushSpecificMeta","hidePointerEvents","setSelectedCarouselIndex","useTemplateModalContext","CHANNEL_TYPE","SMS","_jsx","Object","assign","style","marginTop","border","COLORS","stroke","primary","borderRadius","templateContainerStyles","SmsTemplatePreview","variableStore","smsVariableStore","display_content","smsDisplayContent","uniqueId","EMAIL","EmailTemplateThumbnailPreview","handleViewTemplate","_a","hideViewButton","hideViewButtonForEmail","containerStyle","emailDisplayContent","emailHtmlContainerId","WHATSAPP","RCS","_jsxs","styles","WhatsAppWrapper","position","onClick","mapping","body","_b","length","children","padding","TitleRegular","StringUtils","convertToTitleCase","label","WhatsappTemplatePreview","showHeader","showWhatsAppHeader","extras","whatsAppExtras","borderWidth","borderTopWidth","height","zeroStateComponent","usePlaceHolderName","AiContentBadge","AiContentIcon","width","WEBPUSH","WebpushPreview","extraContainerCss","backgroundColor","surface","standard","background","inactive"],"mappings":"8oBAsCO,MAAMA,EAAkBA,EAC9BC,WACAC,UACAC,uBACAC,wBACAC,aACAC,OACAC,sBACAC,oBACAC,kBACAC,mBACAC,oBACAC,qBACAC,YACAC,oBACAC,sBACAC,gCAEA,MAAMC,yBAAEA,GAA6BC,IACrC,OAAIhB,IAAYiB,EAAaC,IAE3BC,EACC,MAAAC,OAAAC,OAAA,CAAAC,qBACCC,UAAWrB,EAAwB,GAAK,EACxCsB,OAAQtB,EACL,aAAauB,EAAOC,OAAOC,UAC3B,OACHC,aAAc,GACXrB,aAAA,EAAAA,EAAiBsB,oCAGrBV,EAACW,EACA,CAAA/B,SAAUA,EACVI,WAAYA,EACZE,oBAAqBA,EACrBD,KAAMA,QAAAA,EAAQ,QACd2B,cAAexB,aAAA,EAAAA,EAAiByB,iBAChCC,gBAAiB1B,aAAA,EAAAA,EAAiB2B,kBAClCC,SAAU5B,aAAe,EAAfA,EAAiB4B,cAIpBnC,IAAYiB,EAAamB,MAElCjB,EAAA,MAAAC,OAAAC,OAAA,CACCC,MAAKF,OAAAC,OAAA,CACJE,UAAWrB,EAAwB,GAAK,GACrCI,aAAA,EAAAA,EAAmBuB,oCAGvBV,EAACkB,EACA,CAAAtC,SAAUA,EACVuC,mBAAoBA,mBACnBC,EAAAjC,aAAiB,EAAjBA,EAAmBgC,0CAAsB,EAE1CnC,WAAYA,EACZqC,eAAgBlC,aAAA,EAAAA,EAAmBmC,uBACnCC,eAAgBpC,aAAiB,EAAjBA,EAAmBoC,eACnCC,oBAAqBrC,aAAA,EAAAA,EAAmBqC,oBACxCC,qBAAsBtC,aAAA,EAAAA,EAAmBsC,qBACzChC,kBAAmBA,EACnBE,kBAAmBA,OAKtBd,IAAYiB,EAAa4B,UACzB7C,IAAYiB,EAAa6B,IAGxBC,EAAA,MAAA3B,OAAAC,OAAA,CACCC,MAAKF,OAAAC,OAAAD,OAAAC,OAAAD,OAAAC,OAAA,GACDpB,aAAA,EAAAA,EAAsB4B,yBACrB3B,EAAwB8C,EAAOC,gBAAkB,CAAA,GACrD,CAAAC,SAAU,aAEXC,QAASA,aACR,GAAIpC,GAA4BL,EAAoB,CACnD,IAA2B,IAAvBD,KAAoD,kBAAvB8B,EAAAxC,aAAQ,EAARA,EAAUqD,8BAASC,YAAI,IAAAC,OAAA,EAAAA,EAAEC,QACzD,OAGDxC,EAAyBN,QAAAA,GAAsB,EAC/C,IACD,CAAA+C,SAAA,CAEAtD,EACAiB,EAAA,MAAAC,OAAAC,OAAA,CAAKC,MAAO,CAAEmC,QAAS,KACtB,CAAAD,SAAArC,EAACuC,EACC,CAAAF,SAAAG,EAAYC,mBAAkC,UAAf7D,aAAA,EAAAA,EAAU8D,aAAK,IAAAtB,EAAAA,EAAI,SAIrDpB,QAEDA,EAAC2C,EAAuB,CACvBtD,iBAAkBA,EAClBuD,WAAY9D,eAAAA,EAAsB+D,mBAClCC,OAAQhE,aAAA,EAAAA,EAAsBiE,eAC9BnE,SAAUA,EACVK,KAAMF,EAAwB,QAAUE,QAAAA,EAAQ,QAChDsC,eACCtB,OAAAC,OAAAD,OAAAC,OAAA,CAAA8C,YAAajE,EAAwB,EAAI,EACzCkE,eAAgB,WACZd,EAAArD,aAAoB,EAApBA,EAAsByC,8BAAkB,CAAA,IAC5C2B,OAAQ,SAETC,mBAAoBrE,aAAA,EAAAA,EAAsBqE,mBAC1CC,mBAAoBtE,aAAoB,EAApBA,EAAsBsE,mBAC1C9D,kBAAmBA,EACnBC,mBAAoBA,EACpBC,UAAWA,EACXX,QAASA,QAEND,aAAA,EAAAA,EAA8B,uBAAOA,aAAQ,EAARA,EAA0B,kBACjEW,GACAS,EAACqD,EACA,CAAAhB,SAAArC,EAACsD,EAAc,CAAAC,MAAO,GAAIL,OAAQ,WAK7BrE,GAAWiB,EAAa0D,QAEjCxD,EAAA,MAAAC,OAAAC,OAAA,CAAKC,MAAKF,OAAAC,OAAA,CAAA,EAAOR,aAAmB,EAAnBA,EAAqB6B,iBAAc,CAAAc,SACnDrC,EAACyD,EAAc,CACd7E,SAAUA,EACV8E,kBAAmBhE,aAAA,EAAAA,EAAqBgE,uBAMpC1D,OACP,EAGI6B,EAAS,CACdC,gBAAiB,CAChB6B,gBAAiBrD,EAAOsD,QAAQC,SAChCpD,aAAc,EACdJ,OAAQ,aAAaC,EAAOwD,WAAWC,WACvC3D,UAAW"}

package/dist/esm/components/template-preview/WhatsApp/ChatBtn.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Caption as r,BodySecondary as o}from"../../TypographyStyle.js";import{COLORS as i}from"../../../constants/Theme.js";import{ChatBtnContainer as n}from"./ChatUI.style.js";const l=l=>{let{Icon:c,text:a,extraContent:s,placeholder:p,textTypography:h,size:d,iconPosition:f="left"}=l;const g=h||o;return e(n,{children:t("div",Object.assign({style:{textAlign:"center",maxWidth:"100%"}},{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"}},{children:[c&&"left"===f&&e(c,{color:i.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e(g,Object.assign({style:{color:i.special.brand.facebook,textAlign:"center",fontSize:"small"===d?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:a})),c&&"right"===f&&e(c,{color:i.special.brand.facebook,height:16,width:16,style:{marginLeft:8}})]})),!!s&&e(r,Object.assign({style:{marginTop:2,color:i.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:p?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(p):s}))]}))})};export{l as ChatBtn};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{Caption as r,BodySecondary as o}from"../../TypographyStyle.js";import{COLORS as i}from"../../../constants/Theme.js";import{ChatBtnContainer as n}from"./ChatUI.style.js";const l=({Icon:l,text:c,extraContent:a,placeholder:s,textTypography:p,size:h,iconPosition:d="left"})=>{const f=p||o;return e(n,{children:t("div",Object.assign({style:{textAlign:"center",maxWidth:"100%"}},{children:[t("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"}},{children:[l&&"left"===d&&e(l,{color:i.special.brand.facebook,height:16,width:16,style:{marginRight:8}}),e(f,Object.assign({style:{color:i.special.brand.facebook,textAlign:"center",fontSize:"small"===h?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:c})),l&&"right"===d&&e(l,{color:i.special.brand.facebook,height:16,width:16,style:{marginLeft:8}})]})),!!a&&e(r,Object.assign({style:{marginTop:2,color:i.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"}},{children:s?function(e){return e.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,(function(e){return e.toUpperCase()}))}(s):a}))]}))})};export{l as ChatBtn};
 //# sourceMappingURL=ChatBtn.js.map