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

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

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-preview/WhatsApp/ChatBtn.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatBtn.js","sources":["../../../../../src/components/template-preview/WhatsApp/ChatBtn.tsx"],"sourcesContent":["import React from 'react';\nimport { BodySecondary, Caption } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { ChatBtnContainer } from './ChatUI.style';\n\nexport const ChatBtn: 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\ticonPosition?: 'left' \| 'right';\n}> = ({\n\tIcon,\n\ttext,\n\textraContent,\n\tplaceholder,\n\ttextTypography,\n\tsize,\n\ticonPosition = 'left',\n}) => {\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<ChatBtnContainer>\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 && iconPosition === 'left' && (\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\t\t\t\t\t<TextTypographyComponent\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tcolor: COLORS.special.brand.facebook,\n\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\tfontSize: size === 'small' ? 12 : 14,\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{text}\n\t\t\t\t\t</TextTypographyComponent>\n\n\t\t\t\t\t{Icon && iconPosition === 'right' && (\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={{ marginLeft: 8 }}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\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</ChatBtnContainer>\n\t);\n};\n"],"names":["ChatBtn","Icon","text","extraContent","placeholder","textTypography","size","iconPosition","TextTypographyComponent","BodySecondary","_jsx","ChatBtnContainer","_jsxs","Object","assign","style","textAlign","maxWidth","children","display","flexDirection","justifyContent","alignItems","color","COLORS","special","brand","facebook","height","width","marginRight","fontSize","textOverflow","whiteSpace","overflow","marginLeft","Caption","marginTop","content","replace","str","toUpperCase","normaliseButtonPlaceholder"],"mappings":"~~kOAKO~~,~~MAAMA~~,~~EAQRA~~,~~EACJC~~,~~OACAC~~,~~OACAC~~,~~eACAC~~,~~cACAC~~,~~iBACAC~~,~~OACAC~~,~~eAAe~~,~~WAEf~~,~~MAAMC~~,EAA0BH,GAAkBI,EAYlD,OACCC,EAACC,YACAC,EAAK,MAAAC,OAAAC,OAAA,CAAAC,MAAO,CAAEC,UAAW,SAAUC,SAAU,SAC5C,CAAAC,SAAA,CAAAN,EAAA,MAAAC,OAAAC,OAAA,CACCC,MAAO,CACNI,QAAS,OACTC,cAAe,MACfC,eAAgB,SAChBC,WAAY,WACZ,CAAAJ,SAAA,CAEAjB,GAAyB,SAAjBM,GACRG,EAACT,GACAsB,MAAOC,EAAOC,QAAQC,MAAMC,SAC5BC,OAAQ,GACRC,MAAO,GACPd,MAAO,CAAEe,YAAa,KAGxBpB,EAACF,EAAuBK,OAAAC,OAAA,CACvBC,MAAO,CACNQ,MAAOC,EAAOC,QAAQC,MAAMC,SAC5BX,UAAW,SACXe,SAAmB,UAATzB,EAAmB,GAAK,GAClC0B,aAAc,WACdC,WAAY,SACZC,SAAU,WAGV,CAAAhB,SAAAhB,KAGDD,GAAyB,UAAjBM,GACRG,EAACT,EACA,CAAAsB,MAAOC,EAAOC,QAAQC,MAAMC,SAC5BC,OAAQ,GACRC,MAAO,GACPd,MAAO,CAAEoB,WAAY,WAIrBhC,GACFO,EAAC0B,EACAvB,OAAAC,OAAA,CAAAC,MAAO,CACNsB,UAAW,EACXd,MAAOC,EAAOc,QAAQlC,YACtB4B,aAAc,WACdC,WAAY,SACZC,SAAU,WACV,CAAAhB,SAEAd,EA7DN,SAAoCA,GAQnC,OAPwBA,EAAYmC,QAAQ,KAAM,IAAIA,QAAQ,KAAM,IAElEA,QAAQ,WAAY,OACpBA,QAAQ,MAAM,SAAUC,GACxB,OAAOA,EAAIC,aACZ,GAGF,CAqDQC,CAA2BtC,GAC3BD,UAIY"}
1	+ {"version":3,"file":"ChatBtn.js","sources":["../../../../../src/components/template-preview/WhatsApp/ChatBtn.tsx"],"sourcesContent":["import React from 'react';\nimport { BodySecondary, Caption } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { ChatBtnContainer } from './ChatUI.style';\n\nexport const ChatBtn: 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\ticonPosition?: 'left' \| 'right';\n}> = ({\n\tIcon,\n\ttext,\n\textraContent,\n\tplaceholder,\n\ttextTypography,\n\tsize,\n\ticonPosition = 'left',\n}) => {\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<ChatBtnContainer>\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 && iconPosition === 'left' && (\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\t\t\t\t\t<TextTypographyComponent\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tcolor: COLORS.special.brand.facebook,\n\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\tfontSize: size === 'small' ? 12 : 14,\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{text}\n\t\t\t\t\t</TextTypographyComponent>\n\n\t\t\t\t\t{Icon && iconPosition === 'right' && (\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={{ marginLeft: 8 }}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\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</ChatBtnContainer>\n\t);\n};\n"],"names":["ChatBtn","_ref","Icon","text","extraContent","placeholder","textTypography","size","iconPosition","TextTypographyComponent","BodySecondary","_jsx","ChatBtnContainer","_jsxs","Object","assign","style","textAlign","maxWidth","children","display","flexDirection","justifyContent","alignItems","color","COLORS","special","brand","facebook","height","width","marginRight","fontSize","textOverflow","whiteSpace","overflow","marginLeft","Caption","marginTop","content","replace","str","toUpperCase","normaliseButtonPlaceholder"],"mappings":"kOAKaA,MAAAA,EAQRC,IAQA,IARCC,KACLA,EAAIC,KACJA,EAAIC,aACJA,EAAYC,YACZA,EAAWC,eACXA,EAAcC,KACdA,EAAIC,aACJA,EAAe,QACfP,EACA,MAAMQ,EAA0BH,GAAkBI,EAYlD,OACCC,EAACC,YACAC,EAAK,MAAAC,OAAAC,OAAA,CAAAC,MAAO,CAAEC,UAAW,SAAUC,SAAU,SAC5C,CAAAC,SAAA,CAAAN,EAAA,MAAAC,OAAAC,OAAA,CACCC,MAAO,CACNI,QAAS,OACTC,cAAe,MACfC,eAAgB,SAChBC,WAAY,WACZ,CAAAJ,SAAA,CAEAjB,GAAyB,SAAjBM,GACRG,EAACT,GACAsB,MAAOC,EAAOC,QAAQC,MAAMC,SAC5BC,OAAQ,GACRC,MAAO,GACPd,MAAO,CAAEe,YAAa,KAGxBpB,EAACF,EAAuBK,OAAAC,OAAA,CACvBC,MAAO,CACNQ,MAAOC,EAAOC,QAAQC,MAAMC,SAC5BX,UAAW,SACXe,SAAmB,UAATzB,EAAmB,GAAK,GAClC0B,aAAc,WACdC,WAAY,SACZC,SAAU,WAGV,CAAAhB,SAAAhB,KAGDD,GAAyB,UAAjBM,GACRG,EAACT,EACA,CAAAsB,MAAOC,EAAOC,QAAQC,MAAMC,SAC5BC,OAAQ,GACRC,MAAO,GACPd,MAAO,CAAEoB,WAAY,WAIrBhC,GACFO,EAAC0B,EACAvB,OAAAC,OAAA,CAAAC,MAAO,CACNsB,UAAW,EACXd,MAAOC,EAAOc,QAAQlC,YACtB4B,aAAc,WACdC,WAAY,SACZC,SAAU,WACV,CAAAhB,SAEAd,EA7DN,SAAoCA,GAQnC,OAPwBA,EAAYmC,QAAQ,KAAM,IAAIA,QAAQ,KAAM,IAElEA,QAAQ,WAAY,OACpBA,QAAQ,MAAM,SAAUC,GACxB,OAAOA,EAAIC,aACZ,GAGF,CAqDQC,CAA2BtC,GAC3BD,UAIY"}

package/dist/esm/components/template-preview/WhatsApp/ChatUI.style.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ChatUI.style.js","sources":["../../../../../src/components/template-preview/WhatsApp/ChatUI.style.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { Caption } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const Container = styled.div<{\n\tisCarouselCard?: boolean;\n\tshowBorder?: boolean;\n\tshowDashedBorder?: boolean;\n\tisWhatsappCarousel?: boolean;\n\thasError?: boolean;\n\tisPreview?: boolean;\n}>`\n\tbackground: ${COLORS.surface.standard};\n\tborder-top-left-radius: ${(props) => (props.isCarouselCard ? '12px' : '0px')};\n\tborder-top-right-radius: 12px;\n\tborder-bottom-right-radius: 12px;\n\tborder-bottom-left-radius: 12px;\n\tposition: relative;\n\tpadding: 8px 0px;\n\tborder: 2px solid\n\t\t${(props) =>\n\t\t\tprops.hasError\n\t\t\t\t? `${COLORS.content.negative}`\n\t\t\t\t: props.showBorder\n\t\t\t\t? `${COLORS.stroke.brand}`\n\t\t\t\t: `${COLORS.stroke.primary}`};\n\tborder: ${(props) =>\n\t\tprops.showDashedBorder && `2px dashed ${COLORS.content.brand}`};\n\theight: ${(props) => (props.isWhatsappCarousel ? '100%' : 'auto')};\n\tdisplay: flex;\n\tflex-direction: column;\n\t:hover {\n\t\tborder: 2px\n\t\t\t${(props) =>\n\t\t\t\t!props.isPreview\n\t\t\t\t\t? props.isWhatsappCarousel\n\t\t\t\t\t\t? props.hasError\n\t\t\t\t\t\t\t? 'dashed'\n\t\t\t\t\t\t\t: props.showBorder\n\t\t\t\t\t\t\t? 'solid'\n\t\t\t\t\t\t\t: 'dashed'\n\t\t\t\t\t\t: 'solid'\n\t\t\t\t\t: 'unset'}\n\t\t\t${COLORS.stroke.brand};\n\t\tbox-shadow: ${(props) =>\n\t\t\t!props.isPreview && '4px 4px 12px rgba(0, 0, 0, 0.25)'};\n\t}\n`;\n\nexport const TimeStamp = styled(Caption)`\n\tcolor: ${COLORS.content.secondary};\n\tmax-width: 80px;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n\toverflow: hidden;\n\ttext-wrap: wrap;\n`;\n\nexport const FooterText = styled(TimeStamp)`\n\tmax-width: 200px;\n`;\n\nexport const MediaContainer = styled.div`\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: 4px;\n\tmargin: 0px 8px;\n`;\n\nexport const ChatBtnContainer = styled.div`\n\tpadding: 12px;\n\tdisplay: flex;\n\tflex-direction: row;\n\tjustify-content: center;\n\talign-items: center;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n`;\n\nexport const FooterWrapper = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tjustify-content: space-between;\n\tmargin: 8px 12px;\n`;\n\nexport const MediaNameAbsWrapper = styled.div`\n\tposition: absolute;\n\tbottom: -1px;\n\tleft: 0;\n\ttext-align: center;\n\twidth: 100%;\n\tpadding: 10px;\n\talign-items: center;\n\tdisplay: flex;\n\tflex-direction: row;\n\tjustify-content: start;\n\tbackground: ${COLORS.surface.hovered};\n\tborder-bottom-right-radius: 8px;\n\tborder-bottom-left-radius: 8px;\n`;\n\nexport const DownloadMediaIconHolder = styled.div`\n\tposition: absolute;\n\ttop: 16px;\n\tright: 16px;\n`;\n"],"names":["Container","styled","div","COLORS","surface","standard","props","isCarouselCard","hasError","content","negative","showBorder","stroke","brand","primary","showDashedBorder","isWhatsappCarousel","isPreview","TimeStamp","Caption","secondary","FooterText","MediaContainer","ChatBtnContainer","FooterWrapper","hovered"],"mappings":"yIAIaA,MAAAA,EAAYC,EAAOC,GAO9B;eACaC,EAAOC,QAAQC;2BACFC,GAAWA,EAAMC,eAAiB,OAAS;;;;;;;IAOlED,GACFA,EAAME,~~SACH~~,~~GAAGL~~,EAAOM,QAAQC,WAClBJ,EAAMK,~~WACN~~,~~GAAGR~~,EAAOS,OAAOC,~~QACjB~~,~~GAAGV~~,EAAOS,OAAOE;WACXR,GACVA,EAAMS,kBAAoB,cAAcZ,EAAOM,QAAQI;WAC7CP,GAAWA,EAAMU,mBAAqB,OAAS;;;;;KAKrDV,GACDA,EAAMW,UAQJ,QAPAX,EAAMU,mBACLV,EAAME,SACL,SACAF,EAAMK,WACN,QACA,SACD;KAEHR,EAAOS,OAAOC;gBACFP,IACbA,EAAMW,WAAa;;EAIVC,EAAYjB,EAAOkB,EAAQ;UAC9BhB,EAAOM,QAAQW;;;;;;EAQZC,EAAapB,EAAOiB,EAAU;;EAI9BI,EAAiBrB,EAAOC,GAAG;;;;;;;;;EAW3BqB,EAAmBtB,EAAOC,GAAG;;;;;;yBAMjBC,EAAOS,OAAOE;EAG1BU,EAAgBvB,EAAOC,GAAG;;;;;EAOJD,EAAOC,GAAG;;;;;;;;;;;eAW9BC,EAAOC,QAAQqB;;;EAKSxB,EAAOC,GAAG;;;;"}
1	+ {"version":3,"file":"ChatUI.style.js","sources":["../../../../../src/components/template-preview/WhatsApp/ChatUI.style.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { Caption } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const Container = styled.div<{\n\tisCarouselCard?: boolean;\n\tshowBorder?: boolean;\n\tshowDashedBorder?: boolean;\n\tisWhatsappCarousel?: boolean;\n\thasError?: boolean;\n\tisPreview?: boolean;\n}>`\n\tbackground: ${COLORS.surface.standard};\n\tborder-top-left-radius: ${(props) => (props.isCarouselCard ? '12px' : '0px')};\n\tborder-top-right-radius: 12px;\n\tborder-bottom-right-radius: 12px;\n\tborder-bottom-left-radius: 12px;\n\tposition: relative;\n\tpadding: 8px 0px;\n\tborder: 2px solid\n\t\t${(props) =>\n\t\t\tprops.hasError\n\t\t\t\t? `${COLORS.content.negative}`\n\t\t\t\t: props.showBorder\n\t\t\t\t? `${COLORS.stroke.brand}`\n\t\t\t\t: `${COLORS.stroke.primary}`};\n\tborder: ${(props) =>\n\t\tprops.showDashedBorder && `2px dashed ${COLORS.content.brand}`};\n\theight: ${(props) => (props.isWhatsappCarousel ? '100%' : 'auto')};\n\tdisplay: flex;\n\tflex-direction: column;\n\t:hover {\n\t\tborder: 2px\n\t\t\t${(props) =>\n\t\t\t\t!props.isPreview\n\t\t\t\t\t? props.isWhatsappCarousel\n\t\t\t\t\t\t? props.hasError\n\t\t\t\t\t\t\t? 'dashed'\n\t\t\t\t\t\t\t: props.showBorder\n\t\t\t\t\t\t\t? 'solid'\n\t\t\t\t\t\t\t: 'dashed'\n\t\t\t\t\t\t: 'solid'\n\t\t\t\t\t: 'unset'}\n\t\t\t${COLORS.stroke.brand};\n\t\tbox-shadow: ${(props) =>\n\t\t\t!props.isPreview && '4px 4px 12px rgba(0, 0, 0, 0.25)'};\n\t}\n`;\n\nexport const TimeStamp = styled(Caption)`\n\tcolor: ${COLORS.content.secondary};\n\tmax-width: 80px;\n\ttext-overflow: ellipsis;\n\twhite-space: nowrap;\n\toverflow: hidden;\n\ttext-wrap: wrap;\n`;\n\nexport const FooterText = styled(TimeStamp)`\n\tmax-width: 200px;\n`;\n\nexport const MediaContainer = styled.div`\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: 4px;\n\tmargin: 0px 8px;\n`;\n\nexport const ChatBtnContainer = styled.div`\n\tpadding: 12px;\n\tdisplay: flex;\n\tflex-direction: row;\n\tjustify-content: center;\n\talign-items: center;\n\tborder-top: 1px solid ${COLORS.stroke.primary};\n`;\n\nexport const FooterWrapper = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tjustify-content: space-between;\n\tmargin: 8px 12px;\n`;\n\nexport const MediaNameAbsWrapper = styled.div`\n\tposition: absolute;\n\tbottom: -1px;\n\tleft: 0;\n\ttext-align: center;\n\twidth: 100%;\n\tpadding: 10px;\n\talign-items: center;\n\tdisplay: flex;\n\tflex-direction: row;\n\tjustify-content: start;\n\tbackground: ${COLORS.surface.hovered};\n\tborder-bottom-right-radius: 8px;\n\tborder-bottom-left-radius: 8px;\n`;\n\nexport const DownloadMediaIconHolder = styled.div`\n\tposition: absolute;\n\ttop: 16px;\n\tright: 16px;\n`;\n"],"names":["Container","styled","div","COLORS","surface","standard","props","isCarouselCard","hasError","content","negative","showBorder","stroke","brand","primary","showDashedBorder","isWhatsappCarousel","isPreview","TimeStamp","Caption","secondary","FooterText","MediaContainer","ChatBtnContainer","FooterWrapper","hovered"],"mappings":"yIAIaA,MAAAA,EAAYC,EAAOC,GAO9B;eACaC,EAAOC,QAAQC;2BACFC,GAAWA,EAAMC,eAAiB,OAAS;;;;;;;IAOlED,GACFA,EAAME,SACA,GAAAL,EAAOM,QAAQC,WAClBJ,EAAMK,WACH,GAAAR,EAAOS,OAAOC,QACd,GAAAV,EAAOS,OAAOE;WACXR,GACVA,EAAMS,kBAAoB,cAAcZ,EAAOM,QAAQI;WAC7CP,GAAWA,EAAMU,mBAAqB,OAAS;;;;;KAKrDV,GACDA,EAAMW,UAQJ,QAPAX,EAAMU,mBACLV,EAAME,SACL,SACAF,EAAMK,WACN,QACA,SACD;KAEHR,EAAOS,OAAOC;gBACFP,IACbA,EAAMW,WAAa;;EAIVC,EAAYjB,EAAOkB,EAAQ;UAC9BhB,EAAOM,QAAQW;;;;;;EAQZC,EAAapB,EAAOiB,EAAU;;EAI9BI,EAAiBrB,EAAOC,GAAG;;;;;;;;;EAW3BqB,EAAmBtB,EAAOC,GAAG;;;;;;yBAMjBC,EAAOS,OAAOE;EAG1BU,EAAgBvB,EAAOC,GAAG;;;;;EAOJD,EAAOC,GAAG;;;;;;;;;;;eAW9BC,EAAOC,QAAQqB;;;EAKSxB,EAAOC,GAAG;;;;"}

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

@@ -1,2 +1,2 @@
-import{jsx as e,Fragment as s,jsxs as r}from"react/jsx-runtime";import t from"../../../assets/icons/filePdf.svg.js";import i from"../../../assets/icons/image.svg.js";import o from"../../../assets/icons/videoRecorder.svg.js";import{ShimmerImage as m}from"../../shimmer-image/ShimmerImage.js";import{BodySecondary as a}from"../../TypographyStyle.js";import{COLORS as n}from"../../../constants/Theme.js";import{HEADER_TYPES as d}from"../models/TemplateMeta.js";import{MediaContainer as c}from"./ChatUI.style.js";const h=({headerAssetName:s,mediaType:m})=>{const h=m===d.IMAGE?i:m===d.VIDEO?o:t;return r(c,{children:[e(h,{height:40,width:40,color:n.icon.placeholder}),!!s&&e(a,Object.assign({style:{color:n.content.secondary,marginTop:8}},{children:s}))]})},p=({headerAssetLink:r,headerAssetName:t,mediaType:i,imagePreviewStyles:o})=>{if(!r||i===d.DOCUMENT)return e(h,Object.assign({},{headerAssetLink:r,headerAssetName:t,mediaType:i}));return e(c,{children:i===d.IMAGE?e(m,{imageUrl:r,alt:r,width:"100%",height:240,borderRadius:8}):i===d.VIDEO?e("video",Object.assign({src:r,style:{width:"100%",minHeight:"240px",height:"240px",borderRadius:8},controls:!0,muted:!0},{children:e("track",{default:!0,kind:"captions",srcLang:"en",src:r})})):e(s,{})})};export{p as MediaCard,h as NoMediaCard};
+import{jsx as e,Fragment as s,jsxs as r}from"react/jsx-runtime";import t from"../../../assets/icons/filePdf.svg.js";import i from"../../../assets/icons/image.svg.js";import o from"../../../assets/icons/videoRecorder.svg.js";import{ShimmerImage as m}from"../../shimmer-image/ShimmerImage.js";import{BodySecondary as a}from"../../TypographyStyle.js";import{COLORS as n}from"../../../constants/Theme.js";import{HEADER_TYPES as d}from"../models/TemplateMeta.js";import{MediaContainer as c}from"./ChatUI.style.js";const h=s=>{let{headerAssetName:m,mediaType:h}=s;const l=h===d.IMAGE?i:h===d.VIDEO?o:t;return r(c,{children:[e(l,{height:40,width:40,color:n.icon.placeholder}),!!m&&e(a,Object.assign({style:{color:n.content.secondary,marginTop:8}},{children:m}))]})},l=r=>{let{headerAssetLink:t,headerAssetName:i,mediaType:o,imagePreviewStyles:a}=r;if(!t||o===d.DOCUMENT)return e(h,Object.assign({},{headerAssetLink:t,headerAssetName:i,mediaType:o}));return e(c,{children:o===d.IMAGE?e(m,{imageUrl:t,alt:t,width:"100%",height:240,borderRadius:8}):o===d.VIDEO?e("video",Object.assign({src:t,style:{width:"100%",minHeight:"240px",height:"240px",borderRadius:8},controls:!0,muted:!0},{children:e("track",{default:!0,kind:"captions",srcLang:"en",src:t})})):e(s,{})})};export{l as MediaCard,h as NoMediaCard};
 //# sourceMappingURL=MediaCard.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"MediaCard.js","sources":["../../../../../src/components/template-preview/WhatsApp/MediaCard.tsx"],"sourcesContent":["import FilePDFIcon from '@src/assets/icons/filePdf.svg';\nimport ImageIcon from '@src/assets/icons/image.svg';\nimport VideoIcon from '@src/assets/icons/videoRecorder.svg';\nimport React from 'react';\nimport { CSSProperties } from 'styled-components';\nimport { ShimmerImage } from '@src/components/shimmer-image/ShimmerImage';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { HEADER_TYPES } from '../models/TemplateMeta';\nimport { MediaContainer } from './ChatUI.style';\n\nexport const NoMediaCard: React.FC<{\n\theaderAssetLink?: string;\n\theaderAssetName?: string;\n\tmediaType?: HEADER_TYPES;\n}> = ({ headerAssetName, mediaType }) => {\n\tconst Icon =\n\t\tmediaType === HEADER_TYPES.IMAGE\n\t\t\t? ImageIcon\n\t\t\t: mediaType === HEADER_TYPES.VIDEO\n\t\t\t? VideoIcon\n\t\t\t: FilePDFIcon;\n\n\treturn (\n\t\t<MediaContainer>\n\t\t\t<Icon height={40} width={40} color={COLORS.icon.placeholder} />\n\t\t\t{!!headerAssetName && (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tstyle={{ color: COLORS.content.secondary, marginTop: 8 }}\n\t\t\t\t>\n\t\t\t\t\t{headerAssetName}\n\t\t\t\t</BodySecondary>\n\t\t\t)}\n\t\t</MediaContainer>\n\t);\n};\n\nexport const MediaCard: React.FC<{\n\theaderAssetLink?: string;\n\theaderAssetName?: string;\n\tmediaType: HEADER_TYPES;\n\timagePreviewStyles?: CSSProperties;\n}> = ({ headerAssetLink, headerAssetName, mediaType, imagePreviewStyles }) => {\n\tif (!headerAssetLink \|\| mediaType === HEADER_TYPES.DOCUMENT) {\n\t\treturn <NoMediaCard {...{ headerAssetLink, headerAssetName, mediaType }} />;\n\t}\n\n\tconst commonMediaPlayerStyle = {\n\t\twidth: '100%',\n\t\tminHeight: '240px',\n\t\theight: '240px',\n\t\tborderRadius: 8,\n\t\t// objectFit: 'cover',\n\t};\n\n\treturn (\n\t\t<MediaContainer>\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={240}\n\t\t\t\t\tborderRadius={8}\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}\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</MediaContainer>\n\t);\n};\n"],"names":["NoMediaCard","headerAssetName","mediaType","Icon","HEADER_TYPES","IMAGE","ImageIcon","VIDEO","VideoIcon","FilePDFIcon","_jsxs","MediaContainer","children","_jsx","height","width","color","COLORS","icon","placeholder","BodySecondary","Object","assign","style","content","secondary","marginTop","MediaCard","headerAssetLink","imagePreviewStyles","DOCUMENT","ShimmerImage","imageUrl","alt","borderRadius","src","minHeight","controls","muted","default","kind","srcLang"],"mappings":"~~6fAWO~~,~~MAAMA~~,~~EAIRA~~,~~EAAGC~~,~~kBAAiBC~~,~~gBACxB~~,~~MAAMC~~,EACLD,IAAcE,EAAaC,MACxBC,EACAJ,IAAcE,EAAaG,MAC3BC,EACAC,EAEJ,OACCC,EAACC,EACA,CAAAC,SAAA,CAAAC,EAACV,EAAK,CAAAW,OAAQ,GAAIC,MAAO,GAAIC,MAAOC,EAAOC,KAAKC,gBAC7ClB,GACFY,EAACO,EACAC,OAAAC,OAAA,CAAAC,MAAO,CAAEP,MAAOC,EAAOO,QAAQC,UAAWC,UAAW,IAEpD,CAAAd,SAAAX,OAGa,EAIN0B,~~EAKRA~~,~~EAAGC~~,~~kBAAiB3B~~,~~kBAAiBC~~,~~YAAW2B~~,~~yBACpD~~,~~IAAKD~~,~~GAAmB1B~~,IAAcE,~~EAAa0B~~,SAClD,~~OAAOjB~~,~~EAACb~~,~~EAAWqB~~,OAAAC,OAAA,CAAA,EAAK,~~CAAEM~~,~~kBAAiB3B~~,kBAAiBC,eAW7D,OACCW,EAACF,YACCT,IAAcE,EAAaC,MAC3BQ,~~EAACkB~~,EACA,CAAAC,SAAUJ,EACVK,IAAKL,~~EACLb~~,MAAO,OACPD,OAAQ,~~IACRoB~~,aAAc,~~IAEZhC~~,IAAcE,EAAaG,MAC9BM,EACC,QAAAQ,OAAAC,OAAA,~~CAAAa~~,IAAKP,~~EACLL~~,MArB2B,CAC9BR,MAAO,~~OACPqB~~,UAAW,~~QACXtB~~,OAAQ,~~QACRoB~~,aAAc,GAkBXG,UAAQ,EACRC,OAEA,GAAA,~~CAAA1B~~,SAAAC,EAAA,QAAA,~~CAAO0B~~,SAAQ,EAAAC,KAAK,WAAWC,QAAQ,KAAKN,IAAKP,~~OAGlDf~~,SAEe"}
1	+ {"version":3,"file":"MediaCard.js","sources":["../../../../../src/components/template-preview/WhatsApp/MediaCard.tsx"],"sourcesContent":["import FilePDFIcon from '@src/assets/icons/filePdf.svg';\nimport ImageIcon from '@src/assets/icons/image.svg';\nimport VideoIcon from '@src/assets/icons/videoRecorder.svg';\nimport React from 'react';\nimport { CSSProperties } from 'styled-components';\nimport { ShimmerImage } from '@src/components/shimmer-image/ShimmerImage';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { HEADER_TYPES } from '../models/TemplateMeta';\nimport { MediaContainer } from './ChatUI.style';\n\nexport const NoMediaCard: React.FC<{\n\theaderAssetLink?: string;\n\theaderAssetName?: string;\n\tmediaType?: HEADER_TYPES;\n}> = ({ headerAssetName, mediaType }) => {\n\tconst Icon =\n\t\tmediaType === HEADER_TYPES.IMAGE\n\t\t\t? ImageIcon\n\t\t\t: mediaType === HEADER_TYPES.VIDEO\n\t\t\t? VideoIcon\n\t\t\t: FilePDFIcon;\n\n\treturn (\n\t\t<MediaContainer>\n\t\t\t<Icon height={40} width={40} color={COLORS.icon.placeholder} />\n\t\t\t{!!headerAssetName && (\n\t\t\t\t<BodySecondary\n\t\t\t\t\tstyle={{ color: COLORS.content.secondary, marginTop: 8 }}\n\t\t\t\t>\n\t\t\t\t\t{headerAssetName}\n\t\t\t\t</BodySecondary>\n\t\t\t)}\n\t\t</MediaContainer>\n\t);\n};\n\nexport const MediaCard: React.FC<{\n\theaderAssetLink?: string;\n\theaderAssetName?: string;\n\tmediaType: HEADER_TYPES;\n\timagePreviewStyles?: CSSProperties;\n}> = ({ headerAssetLink, headerAssetName, mediaType, imagePreviewStyles }) => {\n\tif (!headerAssetLink \|\| mediaType === HEADER_TYPES.DOCUMENT) {\n\t\treturn <NoMediaCard {...{ headerAssetLink, headerAssetName, mediaType }} />;\n\t}\n\n\tconst commonMediaPlayerStyle = {\n\t\twidth: '100%',\n\t\tminHeight: '240px',\n\t\theight: '240px',\n\t\tborderRadius: 8,\n\t\t// objectFit: 'cover',\n\t};\n\n\treturn (\n\t\t<MediaContainer>\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={240}\n\t\t\t\t\tborderRadius={8}\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}\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</MediaContainer>\n\t);\n};\n"],"names":["NoMediaCard","_ref","headerAssetName","mediaType","Icon","HEADER_TYPES","IMAGE","ImageIcon","VIDEO","VideoIcon","FilePDFIcon","_jsxs","MediaContainer","children","_jsx","height","width","color","COLORS","icon","placeholder","BodySecondary","Object","assign","style","content","secondary","marginTop","MediaCard","_ref2","headerAssetLink","imagePreviewStyles","DOCUMENT","ShimmerImage","imageUrl","alt","borderRadius","src","minHeight","controls","muted","default","kind","srcLang"],"mappings":"6fAWaA,MAAAA,EAIRC,IAAmC,IAAlCC,gBAAEA,EAAeC,UAAEA,GAAWF,EACnC,MAAMG,EACLD,IAAcE,EAAaC,MACxBC,EACAJ,IAAcE,EAAaG,MAC3BC,EACAC,EAEJ,OACCC,EAACC,EACA,CAAAC,SAAA,CAAAC,EAACV,EAAK,CAAAW,OAAQ,GAAIC,MAAO,GAAIC,MAAOC,EAAOC,KAAKC,gBAC7ClB,GACFY,EAACO,EACAC,OAAAC,OAAA,CAAAC,MAAO,CAAEP,MAAOC,EAAOO,QAAQC,UAAWC,UAAW,IAEpD,CAAAd,SAAAX,OAGa,EAIN0B,EAKRC,IAAwE,IAAvEC,gBAAEA,EAAe5B,gBAAEA,EAAeC,UAAEA,EAAS4B,mBAAEA,GAAoBF,EACxE,IAAKC,GAAmB3B,IAAcE,EAAa2B,SAClD,OAAOlB,EAACd,EAAWsB,OAAAC,OAAA,CAAA,EAAK,CAAEO,kBAAiB5B,kBAAiBC,eAW7D,OACCW,EAACF,YACCT,IAAcE,EAAaC,MAC3BQ,EAACmB,EACA,CAAAC,SAAUJ,EACVK,IAAKL,EACLd,MAAO,OACPD,OAAQ,IACRqB,aAAc,IAEZjC,IAAcE,EAAaG,MAC9BM,EACC,QAAAQ,OAAAC,OAAA,CAAAc,IAAKP,EACLN,MArB2B,CAC9BR,MAAO,OACPsB,UAAW,QACXvB,OAAQ,QACRqB,aAAc,GAkBXG,UAAQ,EACRC,OAEA,GAAA,CAAA3B,SAAAC,EAAA,QAAA,CAAO2B,SAAQ,EAAAC,KAAK,WAAWC,QAAQ,KAAKN,IAAKP,OAGlDhB,SAEe"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"WhatsAppLikePreviewV2.js","sources":["../../../../../src/components/template-preview/WhatsApp/WhatsAppLikePreviewV2.tsx"],"sourcesContent":["import PhoneIcon from '@src/assets/icons/phone_round.svg';\nimport React from 'react';\nimport styled from 'styled-components';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport { BACKGROUND_PREVIEW_IMAGE } from '@src/components/template-context-mapper/utils/constants';\nimport { TitleRegular, TitleSmall } from '@src/components/TypographyStyle';\nimport { BASE_COLORS, COLORS } from '@src/constants/Theme';\nimport { HEADER_TYPES } from '../models/TemplateMeta';\nimport { WhatsappLikePreviewTypes } from '../models/WhatsAppTemplate';\nimport { getPreviewPropLen } from '../utils/getPreviewPropLen';\nimport ChatHeader from './ChatHeader';\nimport { FooterText, FooterWrapper, TimeStamp } from './ChatUI.style';\nimport { ChatUIV2, HtmlContainer } from './ChatUiV2';\n\nconst Container = styled.div<{\n\tshowHeader?: boolean;\n\tisWhatsappCarousel?: boolean;\n}>`\n\tbackground-image: ${(props) =>\n\t\tprops.isWhatsappCarousel ? 'none' : `url(${BACKGROUND_PREVIEW_IMAGE})`};\n\tborder-radius: 4px;\n\tbackground-repeat: no-repeat;\n\tbackground-position: center;\n\tbackground-size: cover;\n\tposition: relative;\n\theight: ${(props) => (props.isWhatsappCarousel ? '100%' : 'auto')};\n`;\n\nconst PreviewText = styled(TitleRegular)`\n\tcolor: ${COLORS.content.primary};\n`;\n\nconst CallPermissionCard = styled.div`\n\tmargin: 4px;\n\tmargin-top: -4px;\n\tbackground-color: ${BASE_COLORS.grayscale['50']};\n\tborder-radius: 6px;\n\t.flex-align-center-gap {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 8px;\n\t}\n`;\n\nexport const WhatsappLikePreviewV2: React.FC<WhatsappLikePreviewTypes> = (\n\tprops,\n) => {\n\tconst { hideDeviceContainerInPreview } = useTemplateModalContext();\n\n\tconst propLength = getPreviewPropLen(props);\n\t/** Condition for checking empty template creation state. 2 as header and action type will have a default NONE values */\n\tif (propLength === 3) {\n\t\treturn <>{props.zeroStateComponent}</>;\n\t}\n\n\tif (hideDeviceContainerInPreview) {\n\t\treturn <ChatUIV2 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 && <ChatHeader />}\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? '12px 32px 12px 12px'\n\t\t\t\t\t\t\t\t: `16px ${props.isWhatsappCarousel ? '0px' : '56px'} ${\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: '100%',\n\t\t\t\t\t\toverflowY: '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<ChatUIV2 showHeader={props.showHeader} {...props} />\n\t\t\t\t\t{props.showCallPermissionCard && (\n\t\t\t\t\t\t<div style={{ marginTop: 16 }}>\n\t\t\t\t\t\t\t<ChatUIV2\n\t\t\t\t\t\t\t\thideFooter={true}\n\t\t\t\t\t\t\t\theaderMediaType={HEADER_TYPES.NONE}\n\t\t\t\t\t\t\t\ttextType=\"html\"\n\t\t\t\t\t\t\t\tisPreview={props.isPreview}\n\t\t\t\t\t\t\t\tzeroStateComponent={<></>}\n\t\t\t\t\t\t\t\tbuttons={[\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\ttext: 'Choose preference',\n\t\t\t\t\t\t\t\t\t\ttype: 'CALL_PERMISSION',\n\t\t\t\t\t\t\t\t\t\tflowId: '',\n\t\t\t\t\t\t\t\t\t\tflowName: '',\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CallPermissionCard>\n\t\t\t\t\t\t\t\t\t<HtmlContainer className=\"flex-align-center-gap\">\n\t\t\t\t\t\t\t\t\t\t<PhoneIcon width={30} height={30} />\n\t\t\t\t\t\t\t\t\t\t<TitleSmall>\n\t\t\t\t\t\t\t\t\t\t\t{props.callPermissionText\n\t\t\t\t\t\t\t\t\t\t\t\t? `${props.callPermissionText}`\n\t\t\t\t\t\t\t\t\t\t\t\t: 'Can Make \"Merchant Name\" call you?'}\n\t\t\t\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t\t\t\t</HtmlContainer>\n\t\t\t\t\t\t\t\t\t<FooterWrapper>\n\t\t\t\t\t\t\t\t\t\t<FooterText style={{ flex: 1 }}></FooterText>\n\t\t\t\t\t\t\t\t\t\t<TimeStamp>16:48</TimeStamp>\n\t\t\t\t\t\t\t\t\t</FooterWrapper>\n\t\t\t\t\t\t\t\t</CallPermissionCard>\n\t\t\t\t\t\t\t</ChatUIV2>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Container>\n\t\t</>\n\t);\n};\n"],"names":["Container","styled","div","props","isWhatsappCarousel","BACKGROUND_PREVIEW_IMAGE","PreviewText","TitleRegular","COLORS","content","primary","CallPermissionCard","BASE_COLORS","grayscale","WhatsappLikePreviewV2","hideDeviceContainerInPreview","useTemplateModalContext","getPreviewPropLen","_jsx","_Fragment","children","zeroStateComponent","ChatUIV2","Object","assign","showHeader","_jsxs","style","containerStyle","ChatHeader","padding","size","height","overflowY","hidePreviewText","marginBottom","showCallPermissionCard","marginTop","hideFooter","headerMediaType","HEADER_TYPES","NONE","textType","isPreview","buttons","text","type","flowId","flowName","HtmlContainer","className","PhoneIcon","width","TitleSmall","callPermissionText","FooterWrapper","FooterText","flex","TimeStamp"],"mappings":"kxBAcA,MAAMA,EAAYC,EAAOC,GAGvB;qBACoBC,GACpBA,EAAMC,mBAAqB,OAAS,OAAOC;;;;;;WAMjCF,GAAWA,EAAMC,mBAAqB,OAAS;EAGrDE,EAAcL,EAAOM,EAAa;UAC9BC,EAAOC,QAAQC;EAGnBC,EAAqBV,EAAOC,GAAG;;;qBAGhBU,EAAYC,UAAU;;;;;;;EAS9BC,EACZX,IAEA,MAAMY,6BAAEA,GAAiCC,IAIzC,OAAmB,IAFAC,EAAkBd,GAG7Be,EAAGC,EAAA,CAAAC,SAAAjB,EAAMkB,qBAGbN,EACIG,EAACI,EAAQC,OAAAC,OAAA,CAACC,WAAYtB,EAAMsB,YAAgBtB,IAInDe,EAAAC,EAAA,CAAAC,SACCM,EAAC1B,iBACA2B,MAAOxB,EAAMyB,eACbH,WAAYtB,EAAMsB,WAClBrB,mBAAoBD,EAAMC,+BAEzBD,EAAMsB,YAAcP,EAACW,EAAU,CAAA,GAChCH,EAAA,MAAAH,OAAAC,OAAA,CACCG,MAAO,CACNG,QACgB,UAAf3B,EAAM4B,KACH,~~sBACA~~,~~QAAQ5B~~,EAAMC,mBAAqB,MAAQ,UAC3CD,EAAMC,mBAAqB,MAAQ,cAEvC4B,OAAQ,OACRC,UAAW,SACX,CAAAb,SAAA,EAECjB,EAAM+B,iBACPhB,EAAA,MAAAK,OAAAC,OAAA,CAAKG,MAAO,CAAEQ,aAAc,eAC3BjB,EAACZ,EAAiC,CAAAc,SAAA,eAGpCF,EAACI,EAAQC,OAAAC,OAAA,CAACC,WAAYtB,EAAMsB,YAAgBtB,IAC3CA,EAAMiC,wBACNlB,EAAA,MAAAK,OAAAC,OAAA,CAAKG,MAAO,CAAEU,UAAW,KAAI,CAAAjB,SAC5BF,EAACI,iBACAgB,YAAY,EACZC,gBAAiBC,EAAaC,KAC9BC,SAAS,OACTC,UAAWxC,EAAMwC,UACjBtB,mBAAoBH,EAAKC,EAAA,IACzByB,QAAS,CACR,CACCC,KAAM,oBACNC,KAAM,kBACNC,OAAQ,GACRC,SAAU,MAIZ,CAAA5B,SAAAM,EAACf,EAAkB,CAAAS,SAAA,CAClBM,EAACuB,EAAc1B,OAAAC,OAAA,CAAA0B,UAAU,yBACxB,CAAA9B,SAAA,CAAAF,EAACiC,EAAS,CAACC,MAAO,GAAIpB,OAAQ,KAC9Bd,EAACmC,EAAU,CAAAjC,SACTjB,EAAMmD,mBACJ,GAAGnD,EAAMmD,qBACT,2CAGL5B,EAAC6B,EACA,CAAAnC,SAAA,CAAAF,EAACsC,EAAU,CAAC7B,MAAO,CAAE8B,KAAM,KAC3BvC,EAACwC,2CAQN"}
1	+ {"version":3,"file":"WhatsAppLikePreviewV2.js","sources":["../../../../../src/components/template-preview/WhatsApp/WhatsAppLikePreviewV2.tsx"],"sourcesContent":["import PhoneIcon from '@src/assets/icons/phone_round.svg';\nimport React from 'react';\nimport styled from 'styled-components';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport { BACKGROUND_PREVIEW_IMAGE } from '@src/components/template-context-mapper/utils/constants';\nimport { TitleRegular, TitleSmall } from '@src/components/TypographyStyle';\nimport { BASE_COLORS, COLORS } from '@src/constants/Theme';\nimport { HEADER_TYPES } from '../models/TemplateMeta';\nimport { WhatsappLikePreviewTypes } from '../models/WhatsAppTemplate';\nimport { getPreviewPropLen } from '../utils/getPreviewPropLen';\nimport ChatHeader from './ChatHeader';\nimport { FooterText, FooterWrapper, TimeStamp } from './ChatUI.style';\nimport { ChatUIV2, HtmlContainer } from './ChatUiV2';\n\nconst Container = styled.div<{\n\tshowHeader?: boolean;\n\tisWhatsappCarousel?: boolean;\n}>`\n\tbackground-image: ${(props) =>\n\t\tprops.isWhatsappCarousel ? 'none' : `url(${BACKGROUND_PREVIEW_IMAGE})`};\n\tborder-radius: 4px;\n\tbackground-repeat: no-repeat;\n\tbackground-position: center;\n\tbackground-size: cover;\n\tposition: relative;\n\theight: ${(props) => (props.isWhatsappCarousel ? '100%' : 'auto')};\n`;\n\nconst PreviewText = styled(TitleRegular)`\n\tcolor: ${COLORS.content.primary};\n`;\n\nconst CallPermissionCard = styled.div`\n\tmargin: 4px;\n\tmargin-top: -4px;\n\tbackground-color: ${BASE_COLORS.grayscale['50']};\n\tborder-radius: 6px;\n\t.flex-align-center-gap {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 8px;\n\t}\n`;\n\nexport const WhatsappLikePreviewV2: React.FC<WhatsappLikePreviewTypes> = (\n\tprops,\n) => {\n\tconst { hideDeviceContainerInPreview } = useTemplateModalContext();\n\n\tconst propLength = getPreviewPropLen(props);\n\t/** Condition for checking empty template creation state. 2 as header and action type will have a default NONE values */\n\tif (propLength === 3) {\n\t\treturn <>{props.zeroStateComponent}</>;\n\t}\n\n\tif (hideDeviceContainerInPreview) {\n\t\treturn <ChatUIV2 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 && <ChatHeader />}\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? '12px 32px 12px 12px'\n\t\t\t\t\t\t\t\t: `16px ${props.isWhatsappCarousel ? '0px' : '56px'} ${\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: '100%',\n\t\t\t\t\t\toverflowY: '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<ChatUIV2 showHeader={props.showHeader} {...props} />\n\t\t\t\t\t{props.showCallPermissionCard && (\n\t\t\t\t\t\t<div style={{ marginTop: 16 }}>\n\t\t\t\t\t\t\t<ChatUIV2\n\t\t\t\t\t\t\t\thideFooter={true}\n\t\t\t\t\t\t\t\theaderMediaType={HEADER_TYPES.NONE}\n\t\t\t\t\t\t\t\ttextType=\"html\"\n\t\t\t\t\t\t\t\tisPreview={props.isPreview}\n\t\t\t\t\t\t\t\tzeroStateComponent={<></>}\n\t\t\t\t\t\t\t\tbuttons={[\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\ttext: 'Choose preference',\n\t\t\t\t\t\t\t\t\t\ttype: 'CALL_PERMISSION',\n\t\t\t\t\t\t\t\t\t\tflowId: '',\n\t\t\t\t\t\t\t\t\t\tflowName: '',\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CallPermissionCard>\n\t\t\t\t\t\t\t\t\t<HtmlContainer className=\"flex-align-center-gap\">\n\t\t\t\t\t\t\t\t\t\t<PhoneIcon width={30} height={30} />\n\t\t\t\t\t\t\t\t\t\t<TitleSmall>\n\t\t\t\t\t\t\t\t\t\t\t{props.callPermissionText\n\t\t\t\t\t\t\t\t\t\t\t\t? `${props.callPermissionText}`\n\t\t\t\t\t\t\t\t\t\t\t\t: 'Can Make \"Merchant Name\" call you?'}\n\t\t\t\t\t\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t\t\t\t\t</HtmlContainer>\n\t\t\t\t\t\t\t\t\t<FooterWrapper>\n\t\t\t\t\t\t\t\t\t\t<FooterText style={{ flex: 1 }}></FooterText>\n\t\t\t\t\t\t\t\t\t\t<TimeStamp>16:48</TimeStamp>\n\t\t\t\t\t\t\t\t\t</FooterWrapper>\n\t\t\t\t\t\t\t\t</CallPermissionCard>\n\t\t\t\t\t\t\t</ChatUIV2>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Container>\n\t\t</>\n\t);\n};\n"],"names":["Container","styled","div","props","isWhatsappCarousel","BACKGROUND_PREVIEW_IMAGE","PreviewText","TitleRegular","COLORS","content","primary","CallPermissionCard","BASE_COLORS","grayscale","WhatsappLikePreviewV2","hideDeviceContainerInPreview","useTemplateModalContext","getPreviewPropLen","_jsx","_Fragment","children","zeroStateComponent","ChatUIV2","Object","assign","showHeader","_jsxs","style","containerStyle","ChatHeader","padding","size","height","overflowY","hidePreviewText","marginBottom","showCallPermissionCard","marginTop","hideFooter","headerMediaType","HEADER_TYPES","NONE","textType","isPreview","buttons","text","type","flowId","flowName","HtmlContainer","className","PhoneIcon","width","TitleSmall","callPermissionText","FooterWrapper","FooterText","flex","TimeStamp"],"mappings":"kxBAcA,MAAMA,EAAYC,EAAOC,GAGvB;qBACoBC,GACpBA,EAAMC,mBAAqB,OAAS,OAAOC;;;;;;WAMjCF,GAAWA,EAAMC,mBAAqB,OAAS;EAGrDE,EAAcL,EAAOM,EAAa;UAC9BC,EAAOC,QAAQC;EAGnBC,EAAqBV,EAAOC,GAAG;;;qBAGhBU,EAAYC,UAAU;;;;;;;EAS9BC,EACZX,IAEA,MAAMY,6BAAEA,GAAiCC,IAIzC,OAAmB,IAFAC,EAAkBd,GAG7Be,EAAGC,EAAA,CAAAC,SAAAjB,EAAMkB,qBAGbN,EACIG,EAACI,EAAQC,OAAAC,OAAA,CAACC,WAAYtB,EAAMsB,YAAgBtB,IAInDe,EAAAC,EAAA,CAAAC,SACCM,EAAC1B,iBACA2B,MAAOxB,EAAMyB,eACbH,WAAYtB,EAAMsB,WAClBrB,mBAAoBD,EAAMC,+BAEzBD,EAAMsB,YAAcP,EAACW,EAAU,CAAA,GAChCH,EAAA,MAAAH,OAAAC,OAAA,CACCG,MAAO,CACNG,QACgB,UAAf3B,EAAM4B,KACH,sBACQ,QAAA5B,EAAMC,mBAAqB,MAAQ,UAC3CD,EAAMC,mBAAqB,MAAQ,cAEvC4B,OAAQ,OACRC,UAAW,SACX,CAAAb,SAAA,EAECjB,EAAM+B,iBACPhB,EAAA,MAAAK,OAAAC,OAAA,CAAKG,MAAO,CAAEQ,aAAc,eAC3BjB,EAACZ,EAAiC,CAAAc,SAAA,eAGpCF,EAACI,EAAQC,OAAAC,OAAA,CAACC,WAAYtB,EAAMsB,YAAgBtB,IAC3CA,EAAMiC,wBACNlB,EAAA,MAAAK,OAAAC,OAAA,CAAKG,MAAO,CAAEU,UAAW,KAAI,CAAAjB,SAC5BF,EAACI,iBACAgB,YAAY,EACZC,gBAAiBC,EAAaC,KAC9BC,SAAS,OACTC,UAAWxC,EAAMwC,UACjBtB,mBAAoBH,EAAKC,EAAA,IACzByB,QAAS,CACR,CACCC,KAAM,oBACNC,KAAM,kBACNC,OAAQ,GACRC,SAAU,MAIZ,CAAA5B,SAAAM,EAACf,EAAkB,CAAAS,SAAA,CAClBM,EAACuB,EAAc1B,OAAAC,OAAA,CAAA0B,UAAU,yBACxB,CAAA9B,SAAA,CAAAF,EAACiC,EAAS,CAACC,MAAO,GAAIpB,OAAQ,KAC9Bd,EAACmC,EAAU,CAAAjC,SACTjB,EAAMmD,mBACJ,GAAGnD,EAAMmD,qBACT,2CAGL5B,EAAC6B,EACA,CAAAnC,SAAA,CAAAF,EAACsC,EAAU,CAAC7B,MAAO,CAAE8B,KAAM,KAC3BvC,EAACwC,2CAQN"}

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

@@ -1,2 +1,2 @@
-import{jsx as e,Fragment as l}from"react/jsx-runtime";import{useState as a,useEffect as t}from"react";import{useTemplateModalContext as i}from"../template-context-mapper/context/templateModalContext.js";import{TemplateCreatorHelper as o}from"./helpers/TemplateCreatorHelper.js";import{isRCSChannel as r}from"./helpers/templateMiscHelper.js";import{HEADER_TYPES as n}from"./models/TemplateMeta.js";import{RCSTemplateLikePreview as d}from"./RCS/RCSTemplateLikePreview.js";import{TemplateHelperUtils as s}from"./utils/TemplateHelperUtils.js";import{WhatsappLikePreview as p}from"./WhatsApp/WhatsAppLikePreview.js";import{WhatsappLikePreviewV2 as u}from"./WhatsApp/WhatsAppLikePreviewV2.js";const v=({template:v,extras:m,containerStyle:h,usePlaceHolderName:x,showHeader:c,zeroStateComponent:b,size:T,showSampleValues:y,carouselCardIndex:w,isWhatsappCarousel:C,isPreview:N,channel:V})=>{var f,k,P,B,L,A,S,j,g,F,O,H,I,R,W,q,M,U,z,D,E,G,J,K,Q,X,Y,Z,$,_;const{selectedCarouselIndex:ee,pod:le}=i(),[ae,te]=a(),ie=new o,oe=new s,re=[];if((null===(k=null===(f=null==ae?void 0:ae.ctaBtn)||void 0===f?void 0:f.phoneNumber)||void 0===k?void 0:k.isChecked)&&re.push({type:"phoneNumber",text:null!==(P=ae.ctaBtn.phoneNumber.btnText)&&void 0!==P?P:"",extra:null!==(B=ae.ctaBtn.phoneNumber.phoneNumber)&&void 0!==B?B:""}),(null===(A=null===(L=null==ae?void 0:ae.ctaBtn)||void 0===L?void 0:L.websiteLinkBtn)||void 0===A?void 0:A.isChecked)&&re.push({type:"website",text:null!==(S=ae.ctaBtn.websiteLinkBtn.btnText)&&void 0!==S?S:"",extra:null!==(g=null===(j=ae.ctaBtn.websiteLinkBtn)||void 0===j?void 0:j.linkOpens)&&void 0!==g?g:"",placeholder:null!==(F=ae.ctaBtn.websiteLinkBtn.placeholder)&&void 0!==F?F:""}),t((()=>{v&&ie.parseUITemplateFromDBFormat({dbFormattedTemplate:v,isDuplicate:!1,showSampleValues:y,isV2:!v.htmlContentUrl,pod:le}).then((e=>{te(Object.assign({},e))}))}),[v,y]),t((()=>{v&&ie.parseUITemplateFromDBFormat({dbFormattedTemplate:v,isDuplicate:!1,showSampleValues:y,isV2:!v.htmlContentUrl,pod:le}).then((e=>{te(Object.assign({},e))}))}),[ee]),!v)return e(l,{children:b});if(r(V||(null==v?void 0:v.channel))){const a=ie.parseTemplateConfiguration(v);return e(d,{showHeader:c,containerPadding:"large"===T?"16px 36px 12px 16px":"12px 36px 12px 12px",containerStyle:h,textType:"html",bodyText:null==ae?void 0:ae.bodyText,titleText:null==ae?void 0:ae.titleText,footerText:null==ae?void 0:ae.footerText,headerMediaType:(null==ae?void 0:ae.headerType)||n.NONE,headerText:null==ae?void 0:ae.headerText,headerAssetLink:null!==(O=null==ae?void 0:ae.headerAssetLink)&&void 0!==O?O:"",headerAssetName:null!==(H=null==ae?void 0:ae.headerAssetName)&&void 0!==H?H:"",quickReplybtn:null==ae?void 0:ae.quickReply,ctaBtn:re,actionTypes:null==ae?void 0:ae.actionsType,extras:m,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:w,zeroStateComponent:null!=b?b:e(l,{children:" "}),bodyVariableList:null!==(R=null===(I=null==ae?void 0:ae.bodyVariables)||void 0===I?void 0:I.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==R?R:[],headerVariableList:null!==(q=null===(W=null==ae?void 0:ae.headerVariables)||void 0===W?void 0:W.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==q?q:[],titleVariableList:null!==(U=null===(M=null==ae?void 0:ae.titleVariables)||void 0===M?void 0:M.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==U?U:[],buttons:null==ae?void 0:ae.allButtons,isWhatsappCarousel:C,isPreview:N,templateConfiguration:a})}return v.htmlContentUrl?e(p,{showHeader:c,containerPadding:"large"===T?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:h,textType:"html",bodyText:oe.whatsappOnlyFillVariablesValueInBodyText(null!==(Q=null==ae?void 0:ae.bodyText)&&void 0!==Q?Q:"",null!==(X=null==ae?void 0:ae.bodyVariables)&&void 0!==X?X:[],x),footerText:null==ae?void 0:ae.footerText,headerMediaType:(null==ae?void 0:ae.headerType)||n.NONE,headerText:oe.fillVariablesValInBodyText(null!==(Y=null==ae?void 0:ae.headerText)&&void 0!==Y?Y:"",null!==(Z=null==ae?void 0:ae.headerVariables)&&void 0!==Z?Z:[],x),headerAssetLink:null!==($=null==ae?void 0:ae.headerAssetLink)&&void 0!==$?$:"",headerAssetName:null!==(_=null==ae?void 0:ae.headerAssetName)&&void 0!==_?_:"",quickReplybtn:null==ae?void 0:ae.quickReply,ctaBtn:re,actionTypes:null==ae?void 0:ae.actionsType,extras:m,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},zeroStateComponent:null!=b?b:e(l,{children:" "}),isPreview:N}):e(u,{showHeader:c,containerPadding:"large"===T?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:h,textType:"html",bodyText:null==ae?void 0:ae.bodyText,footerText:null==ae?void 0:ae.footerText,headerMediaType:(null==ae?void 0:ae.headerType)||n.NONE,headerText:null==ae?void 0:ae.headerText,headerAssetLink:null!==(z=null==ae?void 0:ae.headerAssetLink)&&void 0!==z?z:"",headerAssetName:null!==(D=null==ae?void 0:ae.headerAssetName)&&void 0!==D?D:"",quickReplybtn:null==ae?void 0:ae.quickReply,ctaBtn:re,actionTypes:null==ae?void 0:ae.actionsType,extras:m,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:w,zeroStateComponent:null!=b?b:e(l,{children:" "}),bodyVariableList:null!==(G=null===(E=null==ae?void 0:ae.bodyVariables)||void 0===E?void 0:E.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==G?G:[],headerVariableList:null!==(K=null===(J=null==ae?void 0:ae.headerVariables)||void 0===J?void 0:J.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==K?K:[],buttons:null==ae?void 0:ae.allButtons,limitedTimeOfferComponent:null==ae?void 0:ae.limitedTimeOfferComponent,isWhatsappCarousel:C,isPreview:N,showCallPermissionCard:null==ae?void 0:ae.showCallPermissionCard,callPermissionText:null==ae?void 0:ae.callPermissionText})};export{v as default};
+import{jsx as e,Fragment as l}from"react/jsx-runtime";import{useState as a,useEffect as t}from"react";import{useTemplateModalContext as i}from"../template-context-mapper/context/templateModalContext.js";import{TemplateCreatorHelper as o}from"./helpers/TemplateCreatorHelper.js";import{isRCSChannel as r}from"./helpers/templateMiscHelper.js";import{HEADER_TYPES as n}from"./models/TemplateMeta.js";import{RCSTemplateLikePreview as d}from"./RCS/RCSTemplateLikePreview.js";import{TemplateHelperUtils as s}from"./utils/TemplateHelperUtils.js";import{WhatsappLikePreview as p}from"./WhatsApp/WhatsAppLikePreview.js";import{WhatsappLikePreviewV2 as u}from"./WhatsApp/WhatsAppLikePreviewV2.js";const v=v=>{let{template:m,extras:h,containerStyle:x,usePlaceHolderName:c,showHeader:b,zeroStateComponent:T,size:y,showSampleValues:w,carouselCardIndex:C,isWhatsappCarousel:N,isPreview:V,channel:f}=v;var k,P,B,L,A,S,j,g,F,O,H,I,R,W,q,M,U,z,D,E,G,J,K,Q,X,Y,Z,$,_,ee;const{selectedCarouselIndex:le,pod:ae}=i(),[te,ie]=a(),oe=new o,re=new s,ne=[];if((null===(P=null===(k=null==te?void 0:te.ctaBtn)||void 0===k?void 0:k.phoneNumber)||void 0===P?void 0:P.isChecked)&&ne.push({type:"phoneNumber",text:null!==(B=te.ctaBtn.phoneNumber.btnText)&&void 0!==B?B:"",extra:null!==(L=te.ctaBtn.phoneNumber.phoneNumber)&&void 0!==L?L:""}),(null===(S=null===(A=null==te?void 0:te.ctaBtn)||void 0===A?void 0:A.websiteLinkBtn)||void 0===S?void 0:S.isChecked)&&ne.push({type:"website",text:null!==(j=te.ctaBtn.websiteLinkBtn.btnText)&&void 0!==j?j:"",extra:null!==(F=null===(g=te.ctaBtn.websiteLinkBtn)||void 0===g?void 0:g.linkOpens)&&void 0!==F?F:"",placeholder:null!==(O=te.ctaBtn.websiteLinkBtn.placeholder)&&void 0!==O?O:""}),t((()=>{m&&oe.parseUITemplateFromDBFormat({dbFormattedTemplate:m,isDuplicate:!1,showSampleValues:w,isV2:!m.htmlContentUrl,pod:ae}).then((e=>{ie(Object.assign({},e))}))}),[m,w]),t((()=>{m&&oe.parseUITemplateFromDBFormat({dbFormattedTemplate:m,isDuplicate:!1,showSampleValues:w,isV2:!m.htmlContentUrl,pod:ae}).then((e=>{ie(Object.assign({},e))}))}),[le]),!m)return e(l,{children:T});if(r(f||(null==m?void 0:m.channel))){const a=oe.parseTemplateConfiguration(m);return e(d,{showHeader:b,containerPadding:"large"===y?"16px 36px 12px 16px":"12px 36px 12px 12px",containerStyle:x,textType:"html",bodyText:null==te?void 0:te.bodyText,titleText:null==te?void 0:te.titleText,footerText:null==te?void 0:te.footerText,headerMediaType:(null==te?void 0:te.headerType)||n.NONE,headerText:null==te?void 0:te.headerText,headerAssetLink:null!==(H=null==te?void 0:te.headerAssetLink)&&void 0!==H?H:"",headerAssetName:null!==(I=null==te?void 0:te.headerAssetName)&&void 0!==I?I:"",quickReplybtn:null==te?void 0:te.quickReply,ctaBtn:ne,actionTypes:null==te?void 0:te.actionsType,extras:h,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:C,zeroStateComponent:null!=T?T:e(l,{children:" "}),bodyVariableList:null!==(W=null===(R=null==te?void 0:te.bodyVariables)||void 0===R?void 0:R.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==W?W:[],headerVariableList:null!==(M=null===(q=null==te?void 0:te.headerVariables)||void 0===q?void 0:q.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==M?M:[],titleVariableList:null!==(z=null===(U=null==te?void 0:te.titleVariables)||void 0===U?void 0:U.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==z?z:[],buttons:null==te?void 0:te.allButtons,isWhatsappCarousel:N,isPreview:V,templateConfiguration:a})}return m.htmlContentUrl?e(p,{showHeader:b,containerPadding:"large"===y?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:x,textType:"html",bodyText:re.whatsappOnlyFillVariablesValueInBodyText(null!==(X=null==te?void 0:te.bodyText)&&void 0!==X?X:"",null!==(Y=null==te?void 0:te.bodyVariables)&&void 0!==Y?Y:[],c),footerText:null==te?void 0:te.footerText,headerMediaType:(null==te?void 0:te.headerType)||n.NONE,headerText:re.fillVariablesValInBodyText(null!==(Z=null==te?void 0:te.headerText)&&void 0!==Z?Z:"",null!==($=null==te?void 0:te.headerVariables)&&void 0!==$?$:[],c),headerAssetLink:null!==(_=null==te?void 0:te.headerAssetLink)&&void 0!==_?_:"",headerAssetName:null!==(ee=null==te?void 0:te.headerAssetName)&&void 0!==ee?ee:"",quickReplybtn:null==te?void 0:te.quickReply,ctaBtn:ne,actionTypes:null==te?void 0:te.actionsType,extras:h,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},zeroStateComponent:null!=T?T:e(l,{children:" "}),isPreview:V}):e(u,{showHeader:b,containerPadding:"large"===y?"16px 56px 12px 16px":"12px 56px 12px 12px",containerStyle:x,textType:"html",bodyText:null==te?void 0:te.bodyText,footerText:null==te?void 0:te.footerText,headerMediaType:(null==te?void 0:te.headerType)||n.NONE,headerText:null==te?void 0:te.headerText,headerAssetLink:null!==(D=null==te?void 0:te.headerAssetLink)&&void 0!==D?D:"",headerAssetName:null!==(E=null==te?void 0:te.headerAssetName)&&void 0!==E?E:"",quickReplybtn:null==te?void 0:te.quickReply,ctaBtn:ne,actionTypes:null==te?void 0:te.actionsType,extras:h,hidePreviewText:!0,imagePreviewStyles:{objectFit:"cover"},carouselCardIndex:C,zeroStateComponent:null!=T?T:e(l,{children:" "}),bodyVariableList:null!==(J=null===(G=null==te?void 0:te.bodyVariables)||void 0===G?void 0:G.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==J?J:[],headerVariableList:null!==(Q=null===(K=null==te?void 0:te.headerVariables)||void 0===K?void 0:K.map((e=>{var l;return{placeholder:e.variableName,value:null!==(l=e.variableVal)&&void 0!==l?l:e.variableName}})))&&void 0!==Q?Q:[],buttons:null==te?void 0:te.allButtons,limitedTimeOfferComponent:null==te?void 0:te.limitedTimeOfferComponent,isWhatsappCarousel:N,isPreview:V,showCallPermissionCard:null==te?void 0:te.showCallPermissionCard,callPermissionText:null==te?void 0:te.callPermissionText})};export{v as default};
 //# sourceMappingURL=WhatsAppTemplatePreview.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"WhatsAppTemplatePreview.js","sources":["../../../../src/components/template-preview/WhatsAppTemplatePreview.tsx"],"sourcesContent":["import React, { ReactElement, useEffect, useState } from 'react';\nimport { CSSProperties } from 'styled-components';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport { TemplateCreatorHelper } from './helpers/TemplateCreatorHelper';\nimport { isRCSChannel } from './helpers/templateMiscHelper';\nimport { CHANNEL_TYPE } from './models/Channels';\nimport { RCSTemplateType } from './models/RCSTemplate';\nimport { HEADER_TYPES } from './models/TemplateMeta';\nimport {\n\tCreateTemplateType,\n\tWhatsAppTemplate,\n} from './models/WhatsAppTemplate';\nimport { RCSTemplateLikePreview } from './RCS/RCSTemplateLikePreview';\nimport { TemplateHelperUtils } from './utils/TemplateHelperUtils';\nimport { WhatsappLikePreview } from './WhatsApp/WhatsAppLikePreview';\nimport { WhatsappLikePreviewV2 } from './WhatsApp/WhatsAppLikePreviewV2';\n\nconst WhatsappTemplatePreview: React.FC<{\n\ttemplate?: WhatsAppTemplate;\n\textras?: boolean;\n\tcontainerStyle?: CSSProperties;\n\tusePlaceHolderName?: boolean;\n\tshowHeader?: boolean;\n\tzeroStateComponent?: ReactElement;\n\tsize?: 'small' \| 'large';\n\tshowSampleValues?: boolean;\n\tcarouselCardIndex?: number;\n\tisWhatsappCarousel?: boolean;\n\tisPreview?: boolean;\n\tchannel?: CHANNEL_TYPE;\n}> = ({\n\ttemplate,\n\textras,\n\tcontainerStyle,\n\tusePlaceHolderName,\n\tshowHeader,\n\tzeroStateComponent,\n\tsize,\n\tshowSampleValues,\n\tcarouselCardIndex,\n\tisWhatsappCarousel,\n\tisPreview,\n\tchannel,\n}) => {\n\tconst { selectedCarouselIndex, pod } = useTemplateModalContext();\n\tconst [localUIState, setLocalUiState] = useState<CreateTemplateType>();\n\tconst templateCreateHelper = new TemplateCreatorHelper();\n\tconst templateCreatorUtils = new TemplateHelperUtils();\n\tconst ctaBtn: {\n\t\ttype: 'phoneNumber' \| 'website';\n\t\ttext: string;\n\t\textra?: string;\n\t\tplaceholder?: string;\n\t}[] = [];\n\tif (localUIState?.ctaBtn?.phoneNumber?.isChecked) {\n\t\tctaBtn.push({\n\t\t\ttype: 'phoneNumber',\n\t\t\ttext: localUIState.ctaBtn.phoneNumber.btnText ?? '',\n\t\t\textra: localUIState.ctaBtn.phoneNumber.phoneNumber ?? '',\n\t\t});\n\t}\n\n\tif (localUIState?.ctaBtn?.websiteLinkBtn?.isChecked) {\n\t\tctaBtn.push({\n\t\t\ttype: 'website',\n\t\t\ttext: localUIState.ctaBtn.websiteLinkBtn.btnText ?? '',\n\t\t\textra: localUIState.ctaBtn.websiteLinkBtn?.linkOpens ?? '',\n\t\t\tplaceholder: localUIState.ctaBtn.websiteLinkBtn.placeholder ?? '',\n\t\t});\n\t}\n\tuseEffect(() => {\n\t\tif (template) {\n\t\t\ttemplateCreateHelper\n\t\t\t\t.parseUITemplateFromDBFormat({\n\t\t\t\t\tdbFormattedTemplate: template,\n\t\t\t\t\tisDuplicate: false,\n\t\t\t\t\tshowSampleValues,\n\t\t\t\t\tisV2: !template.htmlContentUrl,\n\t\t\t\t\tpod: pod,\n\t\t\t\t})\n\t\t\t\t.then((state) => {\n\t\t\t\t\tsetLocalUiState({ ...state });\n\t\t\t\t});\n\t\t}\n\t}, [template, showSampleValues]);\n\n\tuseEffect(() => {\n\t\tif (template) {\n\t\t\ttemplateCreateHelper\n\t\t\t\t.parseUITemplateFromDBFormat({\n\t\t\t\t\tdbFormattedTemplate: template,\n\t\t\t\t\tisDuplicate: false,\n\t\t\t\t\tshowSampleValues,\n\t\t\t\t\tisV2: !template.htmlContentUrl,\n\t\t\t\t\tpod: pod,\n\t\t\t\t})\n\t\t\t\t.then((state) => {\n\t\t\t\t\tsetLocalUiState({ ...state });\n\t\t\t\t});\n\t\t}\n\t}, [selectedCarouselIndex]);\n\n\tif (!template) {\n\t\treturn <>{zeroStateComponent}</>;\n\t}\n\n\tif (isRCSChannel(channel \|\| template?.channel)) {\n\t\tconst templateConfiguration =\n\t\t\ttemplateCreateHelper.parseTemplateConfiguration(\n\t\t\t\ttemplate as RCSTemplateType,\n\t\t\t);\n\t\treturn (\n\t\t\t<RCSTemplateLikePreview\n\t\t\t\tshowHeader={showHeader}\n\t\t\t\tcontainerPadding={\n\t\t\t\t\tsize === 'large' ? '16px 36px 12px 16px' : '12px 36px 12px 12px'\n\t\t\t\t}\n\t\t\t\tcontainerStyle={containerStyle}\n\t\t\t\ttextType={'html'}\n\t\t\t\tbodyText={localUIState?.bodyText}\n\t\t\t\ttitleText={localUIState?.titleText}\n\t\t\t\tfooterText={localUIState?.footerText}\n\t\t\t\theaderMediaType={localUIState?.headerType \|\| HEADER_TYPES.NONE}\n\t\t\t\theaderText={localUIState?.headerText}\n\t\t\t\theaderAssetLink={localUIState?.headerAssetLink ?? ''}\n\t\t\t\theaderAssetName={localUIState?.headerAssetName ?? ''}\n\t\t\t\tquickReplybtn={localUIState?.quickReply}\n\t\t\t\tctaBtn={ctaBtn}\n\t\t\t\tactionTypes={localUIState?.actionsType}\n\t\t\t\textras={extras}\n\t\t\t\thidePreviewText\n\t\t\t\timagePreviewStyles={{\n\t\t\t\t\tobjectFit: 'cover',\n\t\t\t\t}}\n\t\t\t\tcarouselCardIndex={carouselCardIndex}\n\t\t\t\tzeroStateComponent={zeroStateComponent ?? <> </>}\n\t\t\t\tbodyVariableList={\n\t\t\t\t\tlocalUIState?.bodyVariables?.map((variable) => ({\n\t\t\t\t\t\tplaceholder: variable.variableName!,\n\t\t\t\t\t\tvalue: variable.variableVal ?? variable.variableName!,\n\t\t\t\t\t})) ?? []\n\t\t\t\t}\n\t\t\t\theaderVariableList={\n\t\t\t\t\tlocalUIState?.headerVariables?.map((variable) => ({\n\t\t\t\t\t\tplaceholder: variable.variableName!,\n\t\t\t\t\t\tvalue: variable.variableVal ?? variable.variableName!,\n\t\t\t\t\t})) ?? []\n\t\t\t\t}\n\t\t\t\ttitleVariableList={\n\t\t\t\t\tlocalUIState?.titleVariables?.map((variable) => ({\n\t\t\t\t\t\tplaceholder: variable.variableName!,\n\t\t\t\t\t\tvalue: variable.variableVal ?? variable.variableName!,\n\t\t\t\t\t})) ?? []\n\t\t\t\t}\n\t\t\t\tbuttons={localUIState?.allButtons}\n\t\t\t\tisWhatsappCarousel={isWhatsappCarousel}\n\t\t\t\tisPreview={isPreview}\n\t\t\t\ttemplateConfiguration={templateConfiguration}\n\t\t\t/>\n\t\t);\n\t}\n\n\tif (!template.htmlContentUrl) {\n\t\treturn (\n\t\t\t<WhatsappLikePreviewV2\n\t\t\t\tshowHeader={showHeader}\n\t\t\t\tcontainerPadding={\n\t\t\t\t\tsize === 'large' ? '16px 56px 12px 16px' : '12px 56px 12px 12px'\n\t\t\t\t}\n\t\t\t\tcontainerStyle={containerStyle}\n\t\t\t\ttextType={'html'}\n\t\t\t\tbodyText={localUIState?.bodyText}\n\t\t\t\tfooterText={localUIState?.footerText}\n\t\t\t\theaderMediaType={localUIState?.headerType \|\| HEADER_TYPES.NONE}\n\t\t\t\theaderText={localUIState?.headerText}\n\t\t\t\theaderAssetLink={localUIState?.headerAssetLink ?? ''}\n\t\t\t\theaderAssetName={localUIState?.headerAssetName ?? ''}\n\t\t\t\tquickReplybtn={localUIState?.quickReply}\n\t\t\t\tctaBtn={ctaBtn}\n\t\t\t\tactionTypes={localUIState?.actionsType}\n\t\t\t\textras={extras}\n\t\t\t\thidePreviewText\n\t\t\t\timagePreviewStyles={{\n\t\t\t\t\tobjectFit: 'cover',\n\t\t\t\t}}\n\t\t\t\tcarouselCardIndex={carouselCardIndex}\n\t\t\t\tzeroStateComponent={zeroStateComponent ?? <> </>}\n\t\t\t\tbodyVariableList={\n\t\t\t\t\tlocalUIState?.bodyVariables?.map((variable) => ({\n\t\t\t\t\t\tplaceholder: variable.variableName!,\n\t\t\t\t\t\tvalue: variable.variableVal ?? variable.variableName!,\n\t\t\t\t\t})) ?? []\n\t\t\t\t}\n\t\t\t\theaderVariableList={\n\t\t\t\t\tlocalUIState?.headerVariables?.map((variable) => ({\n\t\t\t\t\t\tplaceholder: variable.variableName!,\n\t\t\t\t\t\tvalue: variable.variableVal ?? variable.variableName!,\n\t\t\t\t\t})) ?? []\n\t\t\t\t}\n\t\t\t\t// This gives multiple button type support\n\t\t\t\tbuttons={localUIState?.allButtons}\n\t\t\t\tlimitedTimeOfferComponent={localUIState?.limitedTimeOfferComponent}\n\t\t\t\tisWhatsappCarousel={isWhatsappCarousel}\n\t\t\t\tisPreview={isPreview}\n\t\t\t\tshowCallPermissionCard={localUIState?.showCallPermissionCard}\n\t\t\t\tcallPermissionText={localUIState?.callPermissionText}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<WhatsappLikePreview\n\t\t\tshowHeader={showHeader}\n\t\t\tcontainerPadding={\n\t\t\t\tsize === 'large' ? '16px 56px 12px 16px' : '12px 56px 12px 12px'\n\t\t\t}\n\t\t\tcontainerStyle={containerStyle}\n\t\t\ttextType={'html'}\n\t\t\tbodyText={templateCreatorUtils.whatsappOnlyFillVariablesValueInBodyText(\n\t\t\t\tlocalUIState?.bodyText ?? '',\n\t\t\t\tlocalUIState?.bodyVariables ?? [],\n\t\t\t\tusePlaceHolderName,\n\t\t\t)}\n\t\t\tfooterText={localUIState?.footerText}\n\t\t\theaderMediaType={localUIState?.headerType \|\| HEADER_TYPES.NONE}\n\t\t\theaderText={templateCreatorUtils.fillVariablesValInBodyText(\n\t\t\t\tlocalUIState?.headerText ?? '',\n\t\t\t\tlocalUIState?.headerVariables ?? [],\n\t\t\t\tusePlaceHolderName,\n\t\t\t)}\n\t\t\theaderAssetLink={localUIState?.headerAssetLink ?? ''}\n\t\t\theaderAssetName={localUIState?.headerAssetName ?? ''}\n\t\t\tquickReplybtn={localUIState?.quickReply}\n\t\t\tctaBtn={ctaBtn}\n\t\t\tactionTypes={localUIState?.actionsType}\n\t\t\textras={extras}\n\t\t\thidePreviewText\n\t\t\timagePreviewStyles={{\n\t\t\t\tobjectFit: 'cover',\n\t\t\t}}\n\t\t\tzeroStateComponent={zeroStateComponent ?? <> </>}\n\t\t\tisPreview={isPreview}\n\t\t/>\n\t);\n};\n\nexport default WhatsappTemplatePreview;\n"],"names":["WhatsappTemplatePreview","template","extras","containerStyle","usePlaceHolderName","showHeader","zeroStateComponent","size","showSampleValues","carouselCardIndex","isWhatsappCarousel","isPreview","channel","selectedCarouselIndex","pod","useTemplateModalContext","localUIState","setLocalUiState","useState","templateCreateHelper","TemplateCreatorHelper","templateCreatorUtils","TemplateHelperUtils","ctaBtn","_b","_a","phoneNumber","isChecked","push","type","text","_c","btnText","extra","_d","_f","_e","websiteLinkBtn","_g","_j","_h","linkOpens","placeholder","_k","useEffect","parseUITemplateFromDBFormat","dbFormattedTemplate","isDuplicate","isV2","htmlContentUrl","then","state","Object","assign","_jsx","_Fragment","children","isRCSChannel","templateConfiguration","parseTemplateConfiguration","RCSTemplateLikePreview","containerPadding","textType","bodyText","titleText","footerText","headerMediaType","headerType","HEADER_TYPES","NONE","headerText","headerAssetLink","_l","headerAssetName","_m","quickReplybtn","quickReply","actionTypes","actionsType","hidePreviewText","imagePreviewStyles","objectFit","bodyVariableList","_p","_o","bodyVariables","map","variable","variableName","value","variableVal","headerVariableList","_r","_q","headerVariables","titleVariableList","_t","_s","titleVariables","buttons","allButtons","WhatsappLikePreview","whatsappOnlyFillVariablesValueInBodyText","fillVariablesValInBodyText","_4","_5","WhatsappLikePreviewV2","_u","_v","_x","_w","_z","_y","limitedTimeOfferComponent","showCallPermissionCard","callPermissionText"],"mappings":"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"}
1	+ {"version":3,"file":"WhatsAppTemplatePreview.js","sources":["../../../../src/components/template-preview/WhatsAppTemplatePreview.tsx"],"sourcesContent":["import React, { ReactElement, useEffect, useState } from 'react';\nimport { CSSProperties } from 'styled-components';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport { TemplateCreatorHelper } from './helpers/TemplateCreatorHelper';\nimport { isRCSChannel } from './helpers/templateMiscHelper';\nimport { CHANNEL_TYPE } from './models/Channels';\nimport { RCSTemplateType } from './models/RCSTemplate';\nimport { HEADER_TYPES } from './models/TemplateMeta';\nimport {\n\tCreateTemplateType,\n\tWhatsAppTemplate,\n} from './models/WhatsAppTemplate';\nimport { RCSTemplateLikePreview } from './RCS/RCSTemplateLikePreview';\nimport { TemplateHelperUtils } from './utils/TemplateHelperUtils';\nimport { WhatsappLikePreview } from './WhatsApp/WhatsAppLikePreview';\nimport { WhatsappLikePreviewV2 } from './WhatsApp/WhatsAppLikePreviewV2';\n\nconst WhatsappTemplatePreview: React.FC<{\n\ttemplate?: WhatsAppTemplate;\n\textras?: boolean;\n\tcontainerStyle?: CSSProperties;\n\tusePlaceHolderName?: boolean;\n\tshowHeader?: boolean;\n\tzeroStateComponent?: ReactElement;\n\tsize?: 'small' \| 'large';\n\tshowSampleValues?: boolean;\n\tcarouselCardIndex?: number;\n\tisWhatsappCarousel?: boolean;\n\tisPreview?: boolean;\n\tchannel?: CHANNEL_TYPE;\n}> = ({\n\ttemplate,\n\textras,\n\tcontainerStyle,\n\tusePlaceHolderName,\n\tshowHeader,\n\tzeroStateComponent,\n\tsize,\n\tshowSampleValues,\n\tcarouselCardIndex,\n\tisWhatsappCarousel,\n\tisPreview,\n\tchannel,\n}) => {\n\tconst { selectedCarouselIndex, pod } = useTemplateModalContext();\n\tconst [localUIState, setLocalUiState] = useState<CreateTemplateType>();\n\tconst templateCreateHelper = new TemplateCreatorHelper();\n\tconst templateCreatorUtils = new TemplateHelperUtils();\n\tconst ctaBtn: {\n\t\ttype: 'phoneNumber' \| 'website';\n\t\ttext: string;\n\t\textra?: string;\n\t\tplaceholder?: string;\n\t}[] = [];\n\tif (localUIState?.ctaBtn?.phoneNumber?.isChecked) {\n\t\tctaBtn.push({\n\t\t\ttype: 'phoneNumber',\n\t\t\ttext: localUIState.ctaBtn.phoneNumber.btnText ?? '',\n\t\t\textra: localUIState.ctaBtn.phoneNumber.phoneNumber ?? '',\n\t\t});\n\t}\n\n\tif (localUIState?.ctaBtn?.websiteLinkBtn?.isChecked) {\n\t\tctaBtn.push({\n\t\t\ttype: 'website',\n\t\t\ttext: localUIState.ctaBtn.websiteLinkBtn.btnText ?? '',\n\t\t\textra: localUIState.ctaBtn.websiteLinkBtn?.linkOpens ?? '',\n\t\t\tplaceholder: localUIState.ctaBtn.websiteLinkBtn.placeholder ?? '',\n\t\t});\n\t}\n\tuseEffect(() => {\n\t\tif (template) {\n\t\t\ttemplateCreateHelper\n\t\t\t\t.parseUITemplateFromDBFormat({\n\t\t\t\t\tdbFormattedTemplate: template,\n\t\t\t\t\tisDuplicate: false,\n\t\t\t\t\tshowSampleValues,\n\t\t\t\t\tisV2: !template.htmlContentUrl,\n\t\t\t\t\tpod: pod,\n\t\t\t\t})\n\t\t\t\t.then((state) => {\n\t\t\t\t\tsetLocalUiState({ ...state });\n\t\t\t\t});\n\t\t}\n\t}, [template, showSampleValues]);\n\n\tuseEffect(() => {\n\t\tif (template) {\n\t\t\ttemplateCreateHelper\n\t\t\t\t.parseUITemplateFromDBFormat({\n\t\t\t\t\tdbFormattedTemplate: template,\n\t\t\t\t\tisDuplicate: false,\n\t\t\t\t\tshowSampleValues,\n\t\t\t\t\tisV2: !template.htmlContentUrl,\n\t\t\t\t\tpod: pod,\n\t\t\t\t})\n\t\t\t\t.then((state) => {\n\t\t\t\t\tsetLocalUiState({ ...state });\n\t\t\t\t});\n\t\t}\n\t}, [selectedCarouselIndex]);\n\n\tif (!template) {\n\t\treturn <>{zeroStateComponent}</>;\n\t}\n\n\tif (isRCSChannel(channel \|\| template?.channel)) {\n\t\tconst templateConfiguration =\n\t\t\ttemplateCreateHelper.parseTemplateConfiguration(\n\t\t\t\ttemplate as RCSTemplateType,\n\t\t\t);\n\t\treturn (\n\t\t\t<RCSTemplateLikePreview\n\t\t\t\tshowHeader={showHeader}\n\t\t\t\tcontainerPadding={\n\t\t\t\t\tsize === 'large' ? '16px 36px 12px 16px' : '12px 36px 12px 12px'\n\t\t\t\t}\n\t\t\t\tcontainerStyle={containerStyle}\n\t\t\t\ttextType={'html'}\n\t\t\t\tbodyText={localUIState?.bodyText}\n\t\t\t\ttitleText={localUIState?.titleText}\n\t\t\t\tfooterText={localUIState?.footerText}\n\t\t\t\theaderMediaType={localUIState?.headerType \|\| HEADER_TYPES.NONE}\n\t\t\t\theaderText={localUIState?.headerText}\n\t\t\t\theaderAssetLink={localUIState?.headerAssetLink ?? ''}\n\t\t\t\theaderAssetName={localUIState?.headerAssetName ?? ''}\n\t\t\t\tquickReplybtn={localUIState?.quickReply}\n\t\t\t\tctaBtn={ctaBtn}\n\t\t\t\tactionTypes={localUIState?.actionsType}\n\t\t\t\textras={extras}\n\t\t\t\thidePreviewText\n\t\t\t\timagePreviewStyles={{\n\t\t\t\t\tobjectFit: 'cover',\n\t\t\t\t}}\n\t\t\t\tcarouselCardIndex={carouselCardIndex}\n\t\t\t\tzeroStateComponent={zeroStateComponent ?? <> </>}\n\t\t\t\tbodyVariableList={\n\t\t\t\t\tlocalUIState?.bodyVariables?.map((variable) => ({\n\t\t\t\t\t\tplaceholder: variable.variableName!,\n\t\t\t\t\t\tvalue: variable.variableVal ?? variable.variableName!,\n\t\t\t\t\t})) ?? []\n\t\t\t\t}\n\t\t\t\theaderVariableList={\n\t\t\t\t\tlocalUIState?.headerVariables?.map((variable) => ({\n\t\t\t\t\t\tplaceholder: variable.variableName!,\n\t\t\t\t\t\tvalue: variable.variableVal ?? variable.variableName!,\n\t\t\t\t\t})) ?? []\n\t\t\t\t}\n\t\t\t\ttitleVariableList={\n\t\t\t\t\tlocalUIState?.titleVariables?.map((variable) => ({\n\t\t\t\t\t\tplaceholder: variable.variableName!,\n\t\t\t\t\t\tvalue: variable.variableVal ?? variable.variableName!,\n\t\t\t\t\t})) ?? []\n\t\t\t\t}\n\t\t\t\tbuttons={localUIState?.allButtons}\n\t\t\t\tisWhatsappCarousel={isWhatsappCarousel}\n\t\t\t\tisPreview={isPreview}\n\t\t\t\ttemplateConfiguration={templateConfiguration}\n\t\t\t/>\n\t\t);\n\t}\n\n\tif (!template.htmlContentUrl) {\n\t\treturn (\n\t\t\t<WhatsappLikePreviewV2\n\t\t\t\tshowHeader={showHeader}\n\t\t\t\tcontainerPadding={\n\t\t\t\t\tsize === 'large' ? '16px 56px 12px 16px' : '12px 56px 12px 12px'\n\t\t\t\t}\n\t\t\t\tcontainerStyle={containerStyle}\n\t\t\t\ttextType={'html'}\n\t\t\t\tbodyText={localUIState?.bodyText}\n\t\t\t\tfooterText={localUIState?.footerText}\n\t\t\t\theaderMediaType={localUIState?.headerType \|\| HEADER_TYPES.NONE}\n\t\t\t\theaderText={localUIState?.headerText}\n\t\t\t\theaderAssetLink={localUIState?.headerAssetLink ?? ''}\n\t\t\t\theaderAssetName={localUIState?.headerAssetName ?? ''}\n\t\t\t\tquickReplybtn={localUIState?.quickReply}\n\t\t\t\tctaBtn={ctaBtn}\n\t\t\t\tactionTypes={localUIState?.actionsType}\n\t\t\t\textras={extras}\n\t\t\t\thidePreviewText\n\t\t\t\timagePreviewStyles={{\n\t\t\t\t\tobjectFit: 'cover',\n\t\t\t\t}}\n\t\t\t\tcarouselCardIndex={carouselCardIndex}\n\t\t\t\tzeroStateComponent={zeroStateComponent ?? <> </>}\n\t\t\t\tbodyVariableList={\n\t\t\t\t\tlocalUIState?.bodyVariables?.map((variable) => ({\n\t\t\t\t\t\tplaceholder: variable.variableName!,\n\t\t\t\t\t\tvalue: variable.variableVal ?? variable.variableName!,\n\t\t\t\t\t})) ?? []\n\t\t\t\t}\n\t\t\t\theaderVariableList={\n\t\t\t\t\tlocalUIState?.headerVariables?.map((variable) => ({\n\t\t\t\t\t\tplaceholder: variable.variableName!,\n\t\t\t\t\t\tvalue: variable.variableVal ?? variable.variableName!,\n\t\t\t\t\t})) ?? []\n\t\t\t\t}\n\t\t\t\t// This gives multiple button type support\n\t\t\t\tbuttons={localUIState?.allButtons}\n\t\t\t\tlimitedTimeOfferComponent={localUIState?.limitedTimeOfferComponent}\n\t\t\t\tisWhatsappCarousel={isWhatsappCarousel}\n\t\t\t\tisPreview={isPreview}\n\t\t\t\tshowCallPermissionCard={localUIState?.showCallPermissionCard}\n\t\t\t\tcallPermissionText={localUIState?.callPermissionText}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<WhatsappLikePreview\n\t\t\tshowHeader={showHeader}\n\t\t\tcontainerPadding={\n\t\t\t\tsize === 'large' ? '16px 56px 12px 16px' : '12px 56px 12px 12px'\n\t\t\t}\n\t\t\tcontainerStyle={containerStyle}\n\t\t\ttextType={'html'}\n\t\t\tbodyText={templateCreatorUtils.whatsappOnlyFillVariablesValueInBodyText(\n\t\t\t\tlocalUIState?.bodyText ?? '',\n\t\t\t\tlocalUIState?.bodyVariables ?? [],\n\t\t\t\tusePlaceHolderName,\n\t\t\t)}\n\t\t\tfooterText={localUIState?.footerText}\n\t\t\theaderMediaType={localUIState?.headerType \|\| HEADER_TYPES.NONE}\n\t\t\theaderText={templateCreatorUtils.fillVariablesValInBodyText(\n\t\t\t\tlocalUIState?.headerText ?? '',\n\t\t\t\tlocalUIState?.headerVariables ?? [],\n\t\t\t\tusePlaceHolderName,\n\t\t\t)}\n\t\t\theaderAssetLink={localUIState?.headerAssetLink ?? ''}\n\t\t\theaderAssetName={localUIState?.headerAssetName ?? ''}\n\t\t\tquickReplybtn={localUIState?.quickReply}\n\t\t\tctaBtn={ctaBtn}\n\t\t\tactionTypes={localUIState?.actionsType}\n\t\t\textras={extras}\n\t\t\thidePreviewText\n\t\t\timagePreviewStyles={{\n\t\t\t\tobjectFit: 'cover',\n\t\t\t}}\n\t\t\tzeroStateComponent={zeroStateComponent ?? <> </>}\n\t\t\tisPreview={isPreview}\n\t\t/>\n\t);\n};\n\nexport default WhatsappTemplatePreview;\n"],"names":["WhatsappTemplatePreview","_ref","template","extras","containerStyle","usePlaceHolderName","showHeader","zeroStateComponent","size","showSampleValues","carouselCardIndex","isWhatsappCarousel","isPreview","channel","selectedCarouselIndex","pod","useTemplateModalContext","localUIState","setLocalUiState","useState","templateCreateHelper","TemplateCreatorHelper","templateCreatorUtils","TemplateHelperUtils","ctaBtn","_b","_a","phoneNumber","isChecked","push","type","text","_c","btnText","extra","_d","_f","_e","websiteLinkBtn","_g","_j","_h","linkOpens","placeholder","_k","useEffect","parseUITemplateFromDBFormat","dbFormattedTemplate","isDuplicate","isV2","htmlContentUrl","then","state","Object","assign","_jsx","_Fragment","children","isRCSChannel","templateConfiguration","parseTemplateConfiguration","RCSTemplateLikePreview","containerPadding","textType","bodyText","titleText","footerText","headerMediaType","headerType","HEADER_TYPES","NONE","headerText","headerAssetLink","_l","headerAssetName","_m","quickReplybtn","quickReply","actionTypes","actionsType","hidePreviewText","imagePreviewStyles","objectFit","bodyVariableList","_p","_o","bodyVariables","map","variable","variableName","value","variableVal","headerVariableList","_r","_q","headerVariables","titleVariableList","_t","_s","titleVariables","buttons","allButtons","WhatsappLikePreview","whatsappOnlyFillVariablesValueInBodyText","fillVariablesValInBodyText","_4","_5","WhatsappLikePreviewV2","_u","_v","_x","_w","_z","_y","limitedTimeOfferComponent","showCallPermissionCard","callPermissionText"],"mappings":"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"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TemplateConstants.js","sources":["../../../../../src/components/template-preview/constants/TemplateConstants.ts"],"sourcesContent":["const CREATE_TEMPLATE = 'create-template';\n\nexport const CREATE_TEMPLATE_DOM_IDS = {\n\tname: `${CREATE_TEMPLATE}-name`,\n\theader: `${CREATE_TEMPLATE}-header`,\n\tbody: `${CREATE_TEMPLATE}-body`,\n\tactionButtons: `${CREATE_TEMPLATE}-action-buttons`,\n\tfooter: `${CREATE_TEMPLATE}-footer`,\n};\n\nexport const NAME_NOT_FOUND = 'Please enter template name';\nexport const BODY_TEXT_EMPTY = 'Template body text cant be empty';\nexport const REQUIRED_FIELD = 'Required field';\nexport const HEADER_LEN_ERROR = 'Maximum 60 characters are allowed';\nexport const NAME_LEN_ERROR = 'Maximum 512 characters allowed';\nexport const NO_SPECIAL_CHAR = 'No special characters allowed';\nexport const BODY_LEN_ERROR = 'Maximum 1,024 characters are allowed';\nexport const QUICK_REPLY_LEN_ERROR = 'Maximum 20 characters are allowed';\nexport const QUICK_REPLY_NAME_ERROR = 'Buttons with same name are not allowed';\nexport const CUSTOM_LIM_LEN_ERROR =\n\t'Maximum characters allowed is 2000 characters';\nexport const ONE_VAR_ERROR = 'Only one variable allowed in text header';\nexport const VALID_PHONE_NUMBER = 'Please enter a valid 10-digit phone number';\nexport const FOOTER_EMOJI_ERROR = 'Emojis are not allowed in footer';\nexport const HEADER_EMOJI_ERROR = 'Emojis are not allowed in header';\nexport const BUTTON_EMOJI_ERROR = 'Emojis are not allowed in button';\nexport const HEADER_ASSET_LINK_ERROR = 'Please attach the required media';\nexport const TCS_DEFAULT_INPUT_ERROR = 'Some input(s) are missing';\nexport const ONE_VAR_ALLOWED = 'Only one variable allowed in text header';\n\nexport const HEADER_TEXT_LEN_LIMIT = 60;\nexport const NAME_LEN_LIMIT = 512;\nexport const BODY_TEXT_LEN_LIMIT = 1024;\nexport const QUICK_REPLY_BTN_TEXT_LIMIT = 25;\nexport const CUSTOM_LINK_LIMIT = 2000;\nexport const QUICK_REPLY_NAME_LEN_LIMIT = 20;\nexport const QRB_NONE = 'None';\n\nexport const CUSTOM_URL_PLACEHOLDER = '{{customUrl}}';\n\nexport const CUSTOM_URL_PLACEHOLDER_VAR = '((customPlaceholderName))';\n"],"names":["CREATE_TEMPLATE","CREATE_TEMPLATE_DOM_IDS","name","header","body","actionButtons","footer","REQUIRED_FIELD","HEADER_LEN_ERROR","NAME_LEN_ERROR","NO_SPECIAL_CHAR","BODY_LEN_ERROR","QUICK_REPLY_LEN_ERROR","QUICK_REPLY_NAME_ERROR","VALID_PHONE_NUMBER","BUTTON_EMOJI_ERROR","HEADER_ASSET_LINK_ERROR","ONE_VAR_ALLOWED","HEADER_TEXT_LEN_LIMIT","NAME_LEN_LIMIT","BODY_TEXT_LEN_LIMIT","QUICK_REPLY_BTN_TEXT_LIMIT","QUICK_REPLY_NAME_LEN_LIMIT","CUSTOM_URL_PLACEHOLDER","CUSTOM_URL_PLACEHOLDER_VAR"],"mappings":"AAAA,MAAMA,EAAkB,kBAEXC,EAA0B,CACtCC,~~KAAM~~,~~GAAGF~~,SACTG,~~OAAQ~~,~~GAAGH~~,WACXI,~~KAAM~~,~~GAAGJ~~,SACTK,~~cAAe~~,~~GAAGL~~,mBAClBM,~~OAAQ~~,~~GAAGN~~,YAKCO,EAAiB,iBACjBC,EAAmB,oCACnBC,EAAiB,iCACjBC,EAAkB,gCAClBC,EAAiB,uCACjBC,EAAwB,oCACxBC,EAAyB,yCAIzBC,EAAqB,6CAGrBC,EAAqB,mCACrBC,EAA0B,mCAE1BC,EAAkB,2CAElBC,EAAwB,GACxBC,EAAiB,IACjBC,EAAsB,KACtBC,EAA6B,GAE7BC,EAA6B,GAG7BC,EAAyB,gBAEzBC,EAA6B"}
1	+ {"version":3,"file":"TemplateConstants.js","sources":["../../../../../src/components/template-preview/constants/TemplateConstants.ts"],"sourcesContent":["const CREATE_TEMPLATE = 'create-template';\n\nexport const CREATE_TEMPLATE_DOM_IDS = {\n\tname: `${CREATE_TEMPLATE}-name`,\n\theader: `${CREATE_TEMPLATE}-header`,\n\tbody: `${CREATE_TEMPLATE}-body`,\n\tactionButtons: `${CREATE_TEMPLATE}-action-buttons`,\n\tfooter: `${CREATE_TEMPLATE}-footer`,\n};\n\nexport const NAME_NOT_FOUND = 'Please enter template name';\nexport const BODY_TEXT_EMPTY = 'Template body text cant be empty';\nexport const REQUIRED_FIELD = 'Required field';\nexport const HEADER_LEN_ERROR = 'Maximum 60 characters are allowed';\nexport const NAME_LEN_ERROR = 'Maximum 512 characters allowed';\nexport const NO_SPECIAL_CHAR = 'No special characters allowed';\nexport const BODY_LEN_ERROR = 'Maximum 1,024 characters are allowed';\nexport const QUICK_REPLY_LEN_ERROR = 'Maximum 20 characters are allowed';\nexport const QUICK_REPLY_NAME_ERROR = 'Buttons with same name are not allowed';\nexport const CUSTOM_LIM_LEN_ERROR =\n\t'Maximum characters allowed is 2000 characters';\nexport const ONE_VAR_ERROR = 'Only one variable allowed in text header';\nexport const VALID_PHONE_NUMBER = 'Please enter a valid 10-digit phone number';\nexport const FOOTER_EMOJI_ERROR = 'Emojis are not allowed in footer';\nexport const HEADER_EMOJI_ERROR = 'Emojis are not allowed in header';\nexport const BUTTON_EMOJI_ERROR = 'Emojis are not allowed in button';\nexport const HEADER_ASSET_LINK_ERROR = 'Please attach the required media';\nexport const TCS_DEFAULT_INPUT_ERROR = 'Some input(s) are missing';\nexport const ONE_VAR_ALLOWED = 'Only one variable allowed in text header';\n\nexport const HEADER_TEXT_LEN_LIMIT = 60;\nexport const NAME_LEN_LIMIT = 512;\nexport const BODY_TEXT_LEN_LIMIT = 1024;\nexport const QUICK_REPLY_BTN_TEXT_LIMIT = 25;\nexport const CUSTOM_LINK_LIMIT = 2000;\nexport const QUICK_REPLY_NAME_LEN_LIMIT = 20;\nexport const QRB_NONE = 'None';\n\nexport const CUSTOM_URL_PLACEHOLDER = '{{customUrl}}';\n\nexport const CUSTOM_URL_PLACEHOLDER_VAR = '((customPlaceholderName))';\n"],"names":["CREATE_TEMPLATE","CREATE_TEMPLATE_DOM_IDS","name","header","body","actionButtons","footer","REQUIRED_FIELD","HEADER_LEN_ERROR","NAME_LEN_ERROR","NO_SPECIAL_CHAR","BODY_LEN_ERROR","QUICK_REPLY_LEN_ERROR","QUICK_REPLY_NAME_ERROR","VALID_PHONE_NUMBER","BUTTON_EMOJI_ERROR","HEADER_ASSET_LINK_ERROR","ONE_VAR_ALLOWED","HEADER_TEXT_LEN_LIMIT","NAME_LEN_LIMIT","BODY_TEXT_LEN_LIMIT","QUICK_REPLY_BTN_TEXT_LIMIT","QUICK_REPLY_NAME_LEN_LIMIT","CUSTOM_URL_PLACEHOLDER","CUSTOM_URL_PLACEHOLDER_VAR"],"mappings":"AAAA,MAAMA,EAAkB,kBAEXC,EAA0B,CACtCC,KAAS,GAAAF,SACTG,OAAW,GAAAH,WACXI,KAAS,GAAAJ,SACTK,cAAkB,GAAAL,mBAClBM,OAAW,GAAAN,YAKCO,EAAiB,iBACjBC,EAAmB,oCACnBC,EAAiB,iCACjBC,EAAkB,gCAClBC,EAAiB,uCACjBC,EAAwB,oCACxBC,EAAyB,yCAIzBC,EAAqB,6CAGrBC,EAAqB,mCACrBC,EAA0B,mCAE1BC,EAAkB,2CAElBC,EAAwB,GACxBC,EAAiB,IACjBC,EAAsB,KACtBC,EAA6B,GAE7BC,EAA6B,GAG7BC,EAAyB,gBAEzBC,EAA6B"}

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

@@ -1,2 +1,2 @@
-import{COLORS as n}from"../../../constants/Theme.js";import{variablePatternGlobal as t,variablePattern as o}from"../constants/regexPatterns.js";const a=(a,e,r=n.content.brand,s)=>{const l=(null==e?void 0:e.length)?null==e?void 0:e.map((n=>n.updatedValue)):a.match(t);return t.lastIndex=0,a.split(o).map(((n,t)=>{var o;return(null==l?void 0:l[t])?`${n}<span></span><span id="${s||""}connectors_variable_${t+1}" style="color: ${r}; text-decoration: underline; word-break: break-word;">${null!==(o=null==l?void 0:l[t])&&void 0!==o?o:""}</span><span> </span>`:n})).join("")};export{a as renderVariableUIForPreview};
+import{COLORS as n}from"../../../constants/Theme.js";import{variablePatternGlobal as t,variablePattern as o}from"../constants/regexPatterns.js";const e=function(e,a){let r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:n.content.brand,l=arguments.length>3?arguments[3]:void 0;const s=(null==a?void 0:a.length)?null==a?void 0:a.map((n=>n.updatedValue)):e.match(t);return t.lastIndex=0,e.split(o).map(((n,t)=>{var o;return(null==s?void 0:s[t])?`${n}<span></span><span id="${l||""}connectors_variable_${t+1}" style="color: ${r}; text-decoration: underline; word-break: break-word;">${null!==(o=null==s?void 0:s[t])&&void 0!==o?o:""}</span><span> </span>`:n})).join("")};export{e as renderVariableUIForPreview};
 //# sourceMappingURL=SmsTemplateHelper.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"SmsTemplateHelper.js","sources":["../../../../../src/components/template-preview/helpers/SmsTemplateHelper.ts"],"sourcesContent":["import { COLORS } from '@src/constants/Theme';\nimport {\n\tvariablePattern,\n\tvariablePatternGlobal,\n} from '../constants/regexPatterns';\nimport { CUSTOM_VARIABLE } from '../models/TemplateMeta';\n\nexport const renderVariableUIForPreview = (\n\tcontent: string,\n\tvariablStore?: CUSTOM_VARIABLE[],\n\tbrandColor = COLORS.content.brand,\n\tuniqueId?: string,\n) => {\n\tconst variables = variablStore?.length\n\t\t? variablStore?.map((v) => v.updatedValue)\n\t\t: content.match(variablePatternGlobal);\n\tvariablePatternGlobal.lastIndex = 0;\n\treturn content\n\t\t.split(variablePattern)\n\t\t.map((str, i) =>\n\t\t\tvariables?.[i]\n\t\t\t\t? `${str}<span></span><span id=\"${\n\t\t\t\t\t\tuniqueId ? uniqueId : ''\n\t\t\t\t }connectors_variable_${\n\t\t\t\t\t\ti + 1\n\t\t\t\t }\" style=\"color: ${brandColor}; text-decoration: underline; word-break: break-word;\">${\n\t\t\t\t\t\tvariables?.[i] ?? ''\n\t\t\t\t }</span><span> </span>`\n\t\t\t\t: str,\n\t\t)\n\t\t.join('');\n};\n"],"names":["renderVariableUIForPreview","content","variablStore","brandColor","COLORS","brand","uniqueId","variables","~~length","~~map","v","updatedValue","match","variablePatternGlobal","lastIndex","split","variablePattern","str","i","_a","join"],"mappings":"~~sJAOaA~~,~~EAA6BA~~,~~CACzCC~~,~~EACAC~~,EACAC,~~EAAaC~~,~~EAAOH~~,~~QAAQI~~,MAC5BC,~~KAEA~~,~~MAAMC~~,~~GAAYL~~,aAAY,EAAZA,~~EAAcM~~,~~QAC7BN~~,aAAY,EAAZA,~~EAAcO~~,KAAKC,GAAMA,EAAEC,~~eAC3BV~~,~~EAAQW~~,MAAMC,GAEjB,OADAA,EAAsBC,UAAY,~~EAC3Bb~~,~~EACLc~~,MAAMC,GACNP,KAAI,CAACQ,EAAKC,WACV,~~OAAAX~~,eAAAA,~~EAAYW~~,IACT,GAAGD,~~2BACHX~~,GAAsB,~~yBAEtBY~~,EAAI,~~oBACef~~,2DACL,~~QAAdgB~~,~~EAAAZ~~,aAAA,EAAAA,~~EAAYW~~,UAAE,IAAAC,EAAAA,EAAI,0BAElBF,CAAG,IAENG,KAAK,~~GAAG~~"}
1	+ {"version":3,"file":"SmsTemplateHelper.js","sources":["../../../../../src/components/template-preview/helpers/SmsTemplateHelper.ts"],"sourcesContent":["import { COLORS } from '@src/constants/Theme';\nimport {\n\tvariablePattern,\n\tvariablePatternGlobal,\n} from '../constants/regexPatterns';\nimport { CUSTOM_VARIABLE } from '../models/TemplateMeta';\n\nexport const renderVariableUIForPreview = (\n\tcontent: string,\n\tvariablStore?: CUSTOM_VARIABLE[],\n\tbrandColor = COLORS.content.brand,\n\tuniqueId?: string,\n) => {\n\tconst variables = variablStore?.length\n\t\t? variablStore?.map((v) => v.updatedValue)\n\t\t: content.match(variablePatternGlobal);\n\tvariablePatternGlobal.lastIndex = 0;\n\treturn content\n\t\t.split(variablePattern)\n\t\t.map((str, i) =>\n\t\t\tvariables?.[i]\n\t\t\t\t? `${str}<span></span><span id=\"${\n\t\t\t\t\t\tuniqueId ? uniqueId : ''\n\t\t\t\t }connectors_variable_${\n\t\t\t\t\t\ti + 1\n\t\t\t\t }\" style=\"color: ${brandColor}; text-decoration: underline; word-break: break-word;\">${\n\t\t\t\t\t\tvariables?.[i] ?? ''\n\t\t\t\t }</span><span> </span>`\n\t\t\t\t: str,\n\t\t)\n\t\t.join('');\n};\n"],"names":["renderVariableUIForPreview","content","variablStore","brandColor","arguments","length","undefined","COLORS","brand","uniqueId","variables","map","v","updatedValue","match","variablePatternGlobal","lastIndex","split","variablePattern","str","i","_a","join"],"mappings":"gJAOO,MAAMA,EAA6B,SACzCC,EACAC,GAGG,IAFHC,EAAUC,UAAAC,eAAAC,IAAAF,UAAA,GAAAA,UAAGG,GAAAA,EAAON,QAAQO,MAC5BC,EAAiBL,UAAAC,OAAAD,EAAAA,kBAAAE,EAEjB,MAAMI,GAAYR,aAAY,EAAZA,EAAcG,QAC7BH,aAAY,EAAZA,EAAcS,KAAKC,GAAMA,EAAEC,eAC3BZ,EAAQa,MAAMC,GAEjB,OADAA,EAAsBC,UAAY,EAC3Bf,EACLgB,MAAMC,GACNP,KAAI,CAACQ,EAAKC,WACV,OAAAV,eAAAA,EAAYU,IACT,GAAGD,2BACHV,GAAsB,yBAEtBW,EAAI,oBACejB,2DACL,QAAdkB,EAAAX,aAAA,EAAAA,EAAYU,UAAE,IAAAC,EAAAA,EAAI,0BAElBF,CAAG,IAENG,KAAK,GACR"}

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

@@ -1,2 +1,2 @@
-import{__awaiter as e}from"../../../_virtual/_tslib.js";import{format as t}from"date-fns";import{COLORS as i}from"../../../constants/Theme.js";import{specialCharPattern as n,placeHolderNamePattern as l,editableVarPattern as o}from"../constants/regexPatterns.js";import{REQUIRED_FIELD as a,NAME_LEN_LIMIT as d,NAME_LEN_ERROR as r,NO_SPECIAL_CHAR as s,HEADER_TEXT_LEN_LIMIT as v,HEADER_LEN_ERROR as p,ONE_VAR_ALLOWED as u,HEADER_ASSET_LINK_ERROR as m,BODY_TEXT_LEN_LIMIT as c,BODY_LEN_ERROR as h,QUICK_REPLY_BTN_TEXT_LIMIT as b,QUICK_REPLY_LEN_ERROR as T,BUTTON_EMOJI_ERROR as y,VALID_PHONE_NUMBER as x,QUICK_REPLY_NAME_LEN_LIMIT as f,CREATE_TEMPLATE_DOM_IDS as B,QUICK_REPLY_NAME_ERROR as C}from"../constants/TemplateConstants.js";import{HEADER_TYPES as k,ACTIONS_TYPES as g}from"../models/TemplateMeta.js";import{POD as N}from"../models/WhatsAppTemplate.js";import{TemplateHelperUtils as E}from"../utils/TemplateHelperUtils.js";class L{parseDataFromHeaderComponent(e,t,i){var n,l,o,a,d,r,s,v,p,u;const m={headerType:k.NONE,headerVariables:[]},c=null===(n=null==e?void 0:e.components)||void 0===n?void 0:n.find((e=>"HEADER"===e.type));if(c){m.headerType=c.format,m.headerText=c.text,m.headerAssetLink=null===(o=null===(l=c.example)||void 0===l?void 0:l.header_handle)||void 0===o?void 0:o[0];const n=null===(d=null===(a=c.example)||void 0===a?void 0:a.header_text)||void 0===d?void 0:d[0],h=null===(s=null===(r=e.mapping)||void 0===r?void 0:r.header)||void 0===s?void 0:s[0],b=h;if(h){const e=null==h?void 0:h.replace("[[","").replace("]]","").replace("{{","").replace("}}","").replace("((","").replace("))",""),l=/\(\(/.test(h),o=i===N.CHATBOT&&b&&(null==b?void 0:b.startsWith("(("))&&(null==b?void 0:b.endsWith("))")),a={idx:0,variableVal:t||o?n:b,editable:l,editableDefaultValues:l?void 0:n,variableName:e};m.headerVariables=[a],(null===(p=null===(v=c.example)||void 0===v?void 0:v.header_text)||void 0===p?void 0:p.length)&&(m.headerText=null===(u=m.headerText)||void 0===u?void 0:u.replace("{{1}}",`{{${e}}}`))}}return m}validateState(e){var t,i,l,o,N,L,_,O,w,V,A,R,D,I,P,U,j,$,q,S,F,M,Y;const W=/\p{Extended_Pictographic}/u;let H="valid";const Q={meta:{},ctaBtn:{phoneNumber:{btnText:"",link:""},websiteLink:{btnText:"",link:""}},quickReply:[null,null,null]},K=new E;let G=!1;const J=e=>{var t;null===(t=document.getElementById(e))||void 0===t||t.scrollIntoView({behavior:"smooth",block:"nearest"})};if((null===(t=e.meta)||void 0===t?void 0:t.name)?(null===(i=e.meta.name)||void 0===i?void 0:i.trim().length)>d?(Q.meta.name=r,H="invalid"):n.test(null===(l=e.meta.name)||void 0===l?void 0:l.trim())&&(Q.meta.name=s,H="invalid"):(Q.meta.name=a,H="invalid"),Q.meta.name&&!G&&(J(B.name),G=!0),e.headerType===k.TEXT){const t=null!==(N=null===(o=e.headerText)||void 0===o?void 0:o.trim())&&void 0!==N?N:"";if(t)if(t.length>v)Q.header=p,H="invalid";else{const e=K.getTemplateVariablesFromState(t);e&&e.length>1&&(Q.header=u,H="invalid")}else Q.header=a,H="invalid"}else e.headerType===k.DOCUMENT||e.headerType===k.IMAGE||(e.headerType,k.VIDEO);if(e.headerType!==k.DOCUMENT&&e.headerType!==k.IMAGE&&e.headerType!==k.VIDEO||e.headerAssetLink||(Q.header=m,H="invalid"),Q.header&&!G&&(J(B.header),G=!0),e.bodyText?e.bodyTextRaw&&(null===(L=e.bodyTextRaw)||void 0===L?void 0:L.trim().length)>c&&(Q.body=h,H="invalid"):(Q.body=a,H="invalid"),Q.body&&!G&&(J(B.body),G=!0),e.footerText&&e.footerText.length>v&&(Q.footer=p,H="invalid"),(null==Q?void 0:Q.footer)&&!G&&(J(B.footer),G=!0),e.actionsType===g.CTA_BTN){if(null===(O=null===(_=e.ctaBtn)||void 0===_?void 0:_.phoneNumber)||void 0===O?void 0:O.isChecked){const t=null===(w=e.ctaBtn.phoneNumber.btnText)||void 0===w?void 0:w.trim(),i=e.ctaBtn.phoneNumber.phoneNumber;Q.ctaBtn&&!t?(Q.ctaBtn.phoneNumber.btnText=a,H="invalid"):Q.ctaBtn&&t&&t.length>b?(Q.ctaBtn.phoneNumber.btnText=T,H="invalid"):Q.ctaBtn&&t&&W.test(t)&&(Q.ctaBtn.phoneNumber.btnText=y,H="invalid"),Q.ctaBtn&&!i?(Q.ctaBtn.phoneNumber.link=a,H="invalid"):Q.ctaBtn&&i&&i.length<10&&(Q.ctaBtn.phoneNumber.link=x,H="invalid")}if(null===(A=null===(V=e.ctaBtn)||void 0===V?void 0:V.websiteLinkBtn)||void 0===A?void 0:A.isChecked){const t=null===(R=e.ctaBtn.websiteLinkBtn.btnText)||void 0===R?void 0:R.trim(),i=null===(D=e.ctaBtn.websiteLinkBtn.linkOpens)||void 0===D?void 0:D.trim(),n=null===(I=e.ctaBtn.websiteLinkBtn.placeholder)||void 0===I?void 0:I.trim();Q.ctaBtn&&!t?(Q.ctaBtn.websiteLink.btnText=a,H="invalid"):Q.ctaBtn&&t&&t.length>b?(Q.ctaBtn.websiteLink.btnText=T,H="invalid"):Q.ctaBtn&&t&&W.test(t)&&(Q.ctaBtn.websiteLink.btnText=y,H="invalid"),!Q.ctaBtn||i||n||(Q.ctaBtn.websiteLink.link=a,H="invalid")}}else if(e.actionsType===g.QUICK_REPLY){const t=["","",""];e.quickReply.forEach(((i,n)=>{var l;const o=null===(l=i.text)||void 0===l?void 0:l.trim();if(o)if(o.length>f)t[n]=T,H="invalid";else if(W.test(o))t[n]=y,H="invalid";else{const i=[...e.quickReply];i.splice(n,1);i.find((e=>e.text===o))&&(t[n]=C,H="invalid")}else t[n]=a,H="invalid"})),Q.quickReply=t}if(e.actionsType===g.CTA_BTN||e.actionsType===g.QUICK_REPLY){const e=null===(P=Q.quickReply)||void 0===P?void 0:P.reduce(((e,t)=>e||!!t),!1);((null===(j=null===(U=null==Q?void 0:Q.ctaBtn)||void 0===U?void 0:U.websiteLink)||void 0===j?void 0:j.link)||(null===(q=null===($=Q.ctaBtn)||void 0===$?void 0:$.websiteLink)||void 0===q?void 0:q.btnText)||(null===(F=null===(S=Q.ctaBtn)||void 0===S?void 0:S.phoneNumber)||void 0===F?void 0:F.link)||(null===(Y=null===(M=Q.ctaBtn)||void 0===M?void 0:M.phoneNumber)||void 0===Y?void 0:Y.btnText)||e)&&!G&&(J(B.actionButtons),G=!0)}return{status:H,errors:Q}}parseBodyComponent(e,t=!1,n,o){var a,d,r,s,v,p;const u=[];let m="";const c=null===(a=e.components)||void 0===a?void 0:a.find((e=>"BODY"===e.type));return c&&(null===(s=null===(r=null===(d=c.example)||void 0===d?void 0:d.body_text)||void 0===r?void 0:r[0])||void 0===s||s.forEach(((t,i)=>{var a,d;let r=null===(d=null===(a=e.mapping)||void 0===a?void 0:a.body)||void 0===d?void 0:d[i];const s=r,v=r&&/\(\(/.test(r),p=null==r?void 0:r.match(l);(null==p?void 0:p[2])&&(r=null==p?void 0:p[2]);const m=o===N.CHATBOT&&s&&(null==s?void 0:s.startsWith("(("))&&(null==s?void 0:s.endsWith("))"));u.push({idx:i,variableVal:n||m?t:s,editable:!!v,editableDefaultValues:v?void 0:t,variableName:null!=r?r:""})})),m=e.htmlContentUrl?e.htmlContentUrl:(null===(v=c.text)||void 0===v?void 0:v.split(/\{\{[0-9]+\}\}/).length)?null===(p=c.text)||void 0===p?void 0:p.split(/\{\{[0-9]+\}\}/).map(((e,n)=>{if(null==u?void 0:u[n]){const l=u[n].variableName;return t?`${e}{{${l}}}`:`${e} <span> </span><span  style="color: ${i.content.brand}; text-decoration: underline;">{{${l}}}</span><span> </span>`}return e})).join(""):""),{bodyVariable:u,bodyText:m}}parseTitleComponent(e,t=!1,n){var o,a,d,r,s,v;const p=[];let u="";const m=null===(o=e.components)||void 0===o?void 0:o.find((e=>"TITLE"===e.type));return m&&(null===(r=null===(d=null===(a=m.example)||void 0===a?void 0:a.title_text)||void 0===d?void 0:d[0])||void 0===r||r.forEach(((t,i)=>{var o,a;let d=null===(a=null===(o=e.mapping)||void 0===o?void 0:o.body)||void 0===a?void 0:a[i];const r=d,s=d&&/\(\(/.test(d),v=null==d?void 0:d.match(l);(null==v?void 0:v[2])&&(d=null==v?void 0:v[2]),p.push({idx:i,variableVal:n?t:r,editable:!!s,editableDefaultValues:s?void 0:t,variableName:null!=d?d:""})})),u=e.htmlContentUrl?e.htmlContentUrl:(null===(s=m.text)||void 0===s?void 0:s.split(/\{\{[0-9]+\}\}/).length)?null===(v=m.text)||void 0===v?void 0:v.split(/\{\{[0-9]+\}\}/).map(((e,n)=>{if(null==p?void 0:p[n]){const l=p[n].variableName;return t?`${e}{{${l}}}`:`${e} <span> </span><span  style="color: ${i.content.brand}; text-decoration: underline;">{{${l}}}</span><span> </span>`}return e})).join(""):""),{titleText:u,titleVariables:p}}parseFooterComponent(e){var t;const i=null===(t=e.components)||void 0===t?void 0:t.find((e=>"FOOTER"===e.type));return null==i?void 0:i.text}parseButtonComponent(e){var t,i,n,l,a,d,r;const s={actionsType:g.NONE,quickReply:[],ctaBtn:{phoneNumber:void 0,websiteLinkBtn:void 0},allButtons:[]},v=null===(t=e.components)||void 0===t?void 0:t.find((e=>"BUTTONS"===e.type));if(v&&(null===(i=null==v?void 0:v.buttons)||void 0===i?void 0:i.length)){const t="QUICK_REPLY"===(null===(n=null==v?void 0:v.buttons)||void 0===n?void 0:n[0].type)?g.QUICK_REPLY:g.CTA_BTN;if(s.actionsType=t,t===g.QUICK_REPLY){const e=null!==(a=null===(l=null==v?void 0:v.buttons)||void 0===l?void 0:l.map((e=>e)))&&void 0!==a?a:[];s.quickReply=e}else t===g.CTA_BTN&&(null===(d=null==v?void 0:v.buttons)||void 0===d||d.forEach((t=>{var i,n,l,a;if(t.phone_number&&(s.ctaBtn.phoneNumber={isChecked:!0,btnText:t.text,phoneNumber:t.phone_number}),t.url){const d=null!==(l=null===(n=null===(i=null==e?void 0:e.mapping)||void 0===i?void 0:i.buttons)||void 0===n?void 0:n[0])&&void 0!==l?l:void 0;let r=!1;d&&o.test(d)&&(r=!0),s.ctaBtn.websiteLinkBtn={isChecked:!0,btnText:t.text,linkOpens:r?null===(a=t.example)||void 0===a?void 0:a[0]:t.url,placeholder:r?void 0:d}}})));s.allButtons=null===(r=v.buttons)||void 0===r?void 0:r.map((e=>"COPY_CODE"===e.type?Object.assign(Object.assign({},e),{placeholder:Array.isArray(e.example)?e.example[0]:(null==e?void 0:e.example)||""}):e))}return s}parseLimitedTimeOfferComponent(e,i){const n={text:"",dateTime:"",code:""};return e.components.forEach((e=>{var l,o,a;if("limited_time_offer"===e.type){n.text=null!==(o=null===(l=e.limited_time_offer)||void 0===l?void 0:l.text)&&void 0!==o?o:"";const i=null===(a=e.example)||void 0===a?void 0:a.limited_time_offer;i&&i.startsWith("{{")&&i.endsWith("}}")?n.dateTime=i:n.dateTime=t(i?new Date(i):new Date,"MMM dd")}i.forEach((e=>{var t;"COPY_CODE"===e.type&&(n.code=null!==(t=e.placeholder)&&void 0!==t?t:"")}))})),n}parseCallPermissionComponent(e){var t;const i=null===(t=e.components)||void 0===t?void 0:t.find((e=>"CALL_PERMISSION_REQUEST"===e.type));return{showCallPermissionCard:Boolean(i),callPermissionText:null==i?void 0:i.text}}parseUITemplateFromDBFormat(t){var i;return e(this,void 0,void 0,(function*(){const{dbFormattedTemplate:e,isDuplicate:n,isV2:l=!1,showSampleValues:o,pod:a}=t,{headerType:d,headerAssetLink:r,headerAssetName:s,headerText:v,headerVariables:p}=yield this.parseDataFromHeaderComponent(e,void 0,a),{bodyText:u,bodyVariable:m}=yield this.parseBodyComponent(e,l,o,a),{titleText:c,titleVariables:h}=yield this.parseTitleComponent(e,l,o),{actionsType:b,quickReply:T,ctaBtn:y,allButtons:x}=yield this.parseButtonComponent(e),f=this.parseLimitedTimeOfferComponent(e,x),{showCallPermissionCard:B,callPermissionText:C}=this.parseCallPermissionComponent(e),k={quickReply:T,ctaBtn:y,allButtons:x,meta:{name:n?`${e.label} Copy`:e.label,category:null===(i=e.category)||void 0===i?void 0:i.toUpperCase(),subCategory:e.templateCategory,language:e.language,templateId:e.templateId},error:{header:void 0,body:void 0,footer:void 0,quickReply:void 0,meta:void 0,ctaBtn:void 0},actionsType:b,footerText:this.parseFooterComponent(e),bodyVariables:m,bodyText:u,headerType:d,headerAssetLink:r,headerAssetName:s,headerText:v,headerVariables:p,alreadyAsADraft:e.isDraft,mode:"edit",initialLoading:!1,limitedTimeOfferComponent:f,titleText:c,titleVariables:h,showCallPermissionCard:B,callPermissionText:C},{errors:g}=this.validateState(k);return k.error=g,k}))}parseTemplateConfiguration(e){let t;const i=(null==e?void 0:e.content)||{};if("string"==typeof i)try{t=JSON.parse(i)}catch(e){console.error("Error parsing rcsTemplate component JSON:",e),t={orientation:"VERTICAL"}}else t=i;return Object.assign(Object.assign({},t),{templateType:null==e?void 0:e.templateType})}}export{L as TemplateCreatorHelper};
+import{__awaiter as e}from"../../../_virtual/_tslib.js";import{format as t}from"date-fns";import{COLORS as i}from"../../../constants/Theme.js";import{specialCharPattern as n,placeHolderNamePattern as l,editableVarPattern as o}from"../constants/regexPatterns.js";import{REQUIRED_FIELD as a,NAME_LEN_LIMIT as d,NAME_LEN_ERROR as r,NO_SPECIAL_CHAR as s,HEADER_TEXT_LEN_LIMIT as v,HEADER_LEN_ERROR as p,ONE_VAR_ALLOWED as u,HEADER_ASSET_LINK_ERROR as m,BODY_TEXT_LEN_LIMIT as c,BODY_LEN_ERROR as h,QUICK_REPLY_BTN_TEXT_LIMIT as b,QUICK_REPLY_LEN_ERROR as T,BUTTON_EMOJI_ERROR as y,VALID_PHONE_NUMBER as x,QUICK_REPLY_NAME_LEN_LIMIT as f,CREATE_TEMPLATE_DOM_IDS as B,QUICK_REPLY_NAME_ERROR as C}from"../constants/TemplateConstants.js";import{HEADER_TYPES as g,ACTIONS_TYPES as k}from"../models/TemplateMeta.js";import{POD as N}from"../models/WhatsAppTemplate.js";import{TemplateHelperUtils as E}from"../utils/TemplateHelperUtils.js";class L{parseDataFromHeaderComponent(e,t,i){var n,l,o,a,d,r,s,v,p,u;const m={headerType:g.NONE,headerVariables:[]},c=null===(n=null==e?void 0:e.components)||void 0===n?void 0:n.find((e=>"HEADER"===e.type));if(c){m.headerType=c.format,m.headerText=c.text,m.headerAssetLink=null===(o=null===(l=c.example)||void 0===l?void 0:l.header_handle)||void 0===o?void 0:o[0];const n=null===(d=null===(a=c.example)||void 0===a?void 0:a.header_text)||void 0===d?void 0:d[0],h=null===(s=null===(r=e.mapping)||void 0===r?void 0:r.header)||void 0===s?void 0:s[0],b=h;if(h){const e=null==h?void 0:h.replace("[[","").replace("]]","").replace("{{","").replace("}}","").replace("((","").replace("))",""),l=/\(\(/.test(h),o=i===N.CHATBOT&&b&&(null==b?void 0:b.startsWith("(("))&&(null==b?void 0:b.endsWith("))")),a={idx:0,variableVal:t||o?n:b,editable:l,editableDefaultValues:l?void 0:n,variableName:e};m.headerVariables=[a],(null===(p=null===(v=c.example)||void 0===v?void 0:v.header_text)||void 0===p?void 0:p.length)&&(m.headerText=null===(u=m.headerText)||void 0===u?void 0:u.replace("{{1}}",`{{${e}}}`))}}return m}validateState(e){var t,i,l,o,N,L,_,O,w,V,A,R,D,I,P,U,j,$,q,S,F,M,Y;const W=/\p{Extended_Pictographic}/u;let H="valid";const Q={meta:{},ctaBtn:{phoneNumber:{btnText:"",link:""},websiteLink:{btnText:"",link:""}},quickReply:[null,null,null]},K=new E;let G=!1;const J=e=>{var t;null===(t=document.getElementById(e))||void 0===t||t.scrollIntoView({behavior:"smooth",block:"nearest"})};if((null===(t=e.meta)||void 0===t?void 0:t.name)?(null===(i=e.meta.name)||void 0===i?void 0:i.trim().length)>d?(Q.meta.name=r,H="invalid"):n.test(null===(l=e.meta.name)||void 0===l?void 0:l.trim())&&(Q.meta.name=s,H="invalid"):(Q.meta.name=a,H="invalid"),Q.meta.name&&!G&&(J(B.name),G=!0),e.headerType===g.TEXT){const t=null!==(N=null===(o=e.headerText)||void 0===o?void 0:o.trim())&&void 0!==N?N:"";if(t)if(t.length>v)Q.header=p,H="invalid";else{const e=K.getTemplateVariablesFromState(t);e&&e.length>1&&(Q.header=u,H="invalid")}else Q.header=a,H="invalid"}else e.headerType===g.DOCUMENT||e.headerType===g.IMAGE||(e.headerType,g.VIDEO);if(e.headerType!==g.DOCUMENT&&e.headerType!==g.IMAGE&&e.headerType!==g.VIDEO||e.headerAssetLink||(Q.header=m,H="invalid"),Q.header&&!G&&(J(B.header),G=!0),e.bodyText?e.bodyTextRaw&&(null===(L=e.bodyTextRaw)||void 0===L?void 0:L.trim().length)>c&&(Q.body=h,H="invalid"):(Q.body=a,H="invalid"),Q.body&&!G&&(J(B.body),G=!0),e.footerText&&e.footerText.length>v&&(Q.footer=p,H="invalid"),(null==Q?void 0:Q.footer)&&!G&&(J(B.footer),G=!0),e.actionsType===k.CTA_BTN){if(null===(O=null===(_=e.ctaBtn)||void 0===_?void 0:_.phoneNumber)||void 0===O?void 0:O.isChecked){const t=null===(w=e.ctaBtn.phoneNumber.btnText)||void 0===w?void 0:w.trim(),i=e.ctaBtn.phoneNumber.phoneNumber;Q.ctaBtn&&!t?(Q.ctaBtn.phoneNumber.btnText=a,H="invalid"):Q.ctaBtn&&t&&t.length>b?(Q.ctaBtn.phoneNumber.btnText=T,H="invalid"):Q.ctaBtn&&t&&W.test(t)&&(Q.ctaBtn.phoneNumber.btnText=y,H="invalid"),Q.ctaBtn&&!i?(Q.ctaBtn.phoneNumber.link=a,H="invalid"):Q.ctaBtn&&i&&i.length<10&&(Q.ctaBtn.phoneNumber.link=x,H="invalid")}if(null===(A=null===(V=e.ctaBtn)||void 0===V?void 0:V.websiteLinkBtn)||void 0===A?void 0:A.isChecked){const t=null===(R=e.ctaBtn.websiteLinkBtn.btnText)||void 0===R?void 0:R.trim(),i=null===(D=e.ctaBtn.websiteLinkBtn.linkOpens)||void 0===D?void 0:D.trim(),n=null===(I=e.ctaBtn.websiteLinkBtn.placeholder)||void 0===I?void 0:I.trim();Q.ctaBtn&&!t?(Q.ctaBtn.websiteLink.btnText=a,H="invalid"):Q.ctaBtn&&t&&t.length>b?(Q.ctaBtn.websiteLink.btnText=T,H="invalid"):Q.ctaBtn&&t&&W.test(t)&&(Q.ctaBtn.websiteLink.btnText=y,H="invalid"),!Q.ctaBtn||i||n||(Q.ctaBtn.websiteLink.link=a,H="invalid")}}else if(e.actionsType===k.QUICK_REPLY){const t=["","",""];e.quickReply.forEach(((i,n)=>{var l;const o=null===(l=i.text)||void 0===l?void 0:l.trim();if(o)if(o.length>f)t[n]=T,H="invalid";else if(W.test(o))t[n]=y,H="invalid";else{const i=[...e.quickReply];i.splice(n,1);i.find((e=>e.text===o))&&(t[n]=C,H="invalid")}else t[n]=a,H="invalid"})),Q.quickReply=t}if(e.actionsType===k.CTA_BTN||e.actionsType===k.QUICK_REPLY){const e=null===(P=Q.quickReply)||void 0===P?void 0:P.reduce(((e,t)=>e||!!t),!1);((null===(j=null===(U=null==Q?void 0:Q.ctaBtn)||void 0===U?void 0:U.websiteLink)||void 0===j?void 0:j.link)||(null===(q=null===($=Q.ctaBtn)||void 0===$?void 0:$.websiteLink)||void 0===q?void 0:q.btnText)||(null===(F=null===(S=Q.ctaBtn)||void 0===S?void 0:S.phoneNumber)||void 0===F?void 0:F.link)||(null===(Y=null===(M=Q.ctaBtn)||void 0===M?void 0:M.phoneNumber)||void 0===Y?void 0:Y.btnText)||e)&&!G&&(J(B.actionButtons),G=!0)}return{status:H,errors:Q}}parseBodyComponent(e){let t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=arguments.length>2?arguments[2]:void 0,o=arguments.length>3?arguments[3]:void 0;var a,d,r,s,v,p;const u=[];let m="";const c=null===(a=e.components)||void 0===a?void 0:a.find((e=>"BODY"===e.type));return c&&(null===(s=null===(r=null===(d=c.example)||void 0===d?void 0:d.body_text)||void 0===r?void 0:r[0])||void 0===s||s.forEach(((t,i)=>{var a,d;let r=null===(d=null===(a=e.mapping)||void 0===a?void 0:a.body)||void 0===d?void 0:d[i];const s=r,v=r&&/\(\(/.test(r),p=null==r?void 0:r.match(l);(null==p?void 0:p[2])&&(r=null==p?void 0:p[2]);const m=o===N.CHATBOT&&s&&(null==s?void 0:s.startsWith("(("))&&(null==s?void 0:s.endsWith("))"));u.push({idx:i,variableVal:n||m?t:s,editable:!!v,editableDefaultValues:v?void 0:t,variableName:null!=r?r:""})})),m=e.htmlContentUrl?e.htmlContentUrl:(null===(v=c.text)||void 0===v?void 0:v.split(/\{\{[0-9]+\}\}/).length)?null===(p=c.text)||void 0===p?void 0:p.split(/\{\{[0-9]+\}\}/).map(((e,n)=>{if(null==u?void 0:u[n]){const l=u[n].variableName;return t?`${e}{{${l}}}`:`${e} <span> </span><span  style="color: ${i.content.brand}; text-decoration: underline;">{{${l}}}</span><span> </span>`}return e})).join(""):""),{bodyVariable:u,bodyText:m}}parseTitleComponent(e){let t=arguments.length>1&&void 0!==arguments[1]&&arguments[1],n=arguments.length>2?arguments[2]:void 0;var o,a,d,r,s,v;const p=[];let u="";const m=null===(o=e.components)||void 0===o?void 0:o.find((e=>"TITLE"===e.type));return m&&(null===(r=null===(d=null===(a=m.example)||void 0===a?void 0:a.title_text)||void 0===d?void 0:d[0])||void 0===r||r.forEach(((t,i)=>{var o,a;let d=null===(a=null===(o=e.mapping)||void 0===o?void 0:o.body)||void 0===a?void 0:a[i];const r=d,s=d&&/\(\(/.test(d),v=null==d?void 0:d.match(l);(null==v?void 0:v[2])&&(d=null==v?void 0:v[2]),p.push({idx:i,variableVal:n?t:r,editable:!!s,editableDefaultValues:s?void 0:t,variableName:null!=d?d:""})})),u=e.htmlContentUrl?e.htmlContentUrl:(null===(s=m.text)||void 0===s?void 0:s.split(/\{\{[0-9]+\}\}/).length)?null===(v=m.text)||void 0===v?void 0:v.split(/\{\{[0-9]+\}\}/).map(((e,n)=>{if(null==p?void 0:p[n]){const l=p[n].variableName;return t?`${e}{{${l}}}`:`${e} <span> </span><span  style="color: ${i.content.brand}; text-decoration: underline;">{{${l}}}</span><span> </span>`}return e})).join(""):""),{titleText:u,titleVariables:p}}parseFooterComponent(e){var t;const i=null===(t=e.components)||void 0===t?void 0:t.find((e=>"FOOTER"===e.type));return null==i?void 0:i.text}parseButtonComponent(e){var t,i,n,l,a,d,r;const s={actionsType:k.NONE,quickReply:[],ctaBtn:{phoneNumber:void 0,websiteLinkBtn:void 0},allButtons:[]},v=null===(t=e.components)||void 0===t?void 0:t.find((e=>"BUTTONS"===e.type));if(v&&(null===(i=null==v?void 0:v.buttons)||void 0===i?void 0:i.length)){const t="QUICK_REPLY"===(null===(n=null==v?void 0:v.buttons)||void 0===n?void 0:n[0].type)?k.QUICK_REPLY:k.CTA_BTN;if(s.actionsType=t,t===k.QUICK_REPLY){const e=null!==(a=null===(l=null==v?void 0:v.buttons)||void 0===l?void 0:l.map((e=>e)))&&void 0!==a?a:[];s.quickReply=e}else t===k.CTA_BTN&&(null===(d=null==v?void 0:v.buttons)||void 0===d||d.forEach((t=>{var i,n,l,a;if(t.phone_number&&(s.ctaBtn.phoneNumber={isChecked:!0,btnText:t.text,phoneNumber:t.phone_number}),t.url){const d=null!==(l=null===(n=null===(i=null==e?void 0:e.mapping)||void 0===i?void 0:i.buttons)||void 0===n?void 0:n[0])&&void 0!==l?l:void 0;let r=!1;d&&o.test(d)&&(r=!0),s.ctaBtn.websiteLinkBtn={isChecked:!0,btnText:t.text,linkOpens:r?null===(a=t.example)||void 0===a?void 0:a[0]:t.url,placeholder:r?void 0:d}}})));s.allButtons=null===(r=v.buttons)||void 0===r?void 0:r.map((e=>"COPY_CODE"===e.type?Object.assign(Object.assign({},e),{placeholder:Array.isArray(e.example)?e.example[0]:(null==e?void 0:e.example)||""}):e))}return s}parseLimitedTimeOfferComponent(e,i){const n={text:"",dateTime:"",code:""};return e.components.forEach((e=>{var l,o,a;if("limited_time_offer"===e.type){n.text=null!==(o=null===(l=e.limited_time_offer)||void 0===l?void 0:l.text)&&void 0!==o?o:"";const i=null===(a=e.example)||void 0===a?void 0:a.limited_time_offer;i&&i.startsWith("{{")&&i.endsWith("}}")?n.dateTime=i:n.dateTime=t(i?new Date(i):new Date,"MMM dd")}i.forEach((e=>{var t;"COPY_CODE"===e.type&&(n.code=null!==(t=e.placeholder)&&void 0!==t?t:"")}))})),n}parseCallPermissionComponent(e){var t;const i=null===(t=e.components)||void 0===t?void 0:t.find((e=>"CALL_PERMISSION_REQUEST"===e.type));return{showCallPermissionCard:Boolean(i),callPermissionText:null==i?void 0:i.text}}parseUITemplateFromDBFormat(t){var i;return e(this,void 0,void 0,(function*(){const{dbFormattedTemplate:e,isDuplicate:n,isV2:l=!1,showSampleValues:o,pod:a}=t,{headerType:d,headerAssetLink:r,headerAssetName:s,headerText:v,headerVariables:p}=yield this.parseDataFromHeaderComponent(e,void 0,a),{bodyText:u,bodyVariable:m}=yield this.parseBodyComponent(e,l,o,a),{titleText:c,titleVariables:h}=yield this.parseTitleComponent(e,l,o),{actionsType:b,quickReply:T,ctaBtn:y,allButtons:x}=yield this.parseButtonComponent(e),f=this.parseLimitedTimeOfferComponent(e,x),{showCallPermissionCard:B,callPermissionText:C}=this.parseCallPermissionComponent(e),g={quickReply:T,ctaBtn:y,allButtons:x,meta:{name:n?`${e.label} Copy`:e.label,category:null===(i=e.category)||void 0===i?void 0:i.toUpperCase(),subCategory:e.templateCategory,language:e.language,templateId:e.templateId},error:{header:void 0,body:void 0,footer:void 0,quickReply:void 0,meta:void 0,ctaBtn:void 0},actionsType:b,footerText:this.parseFooterComponent(e),bodyVariables:m,bodyText:u,headerType:d,headerAssetLink:r,headerAssetName:s,headerText:v,headerVariables:p,alreadyAsADraft:e.isDraft,mode:"edit",initialLoading:!1,limitedTimeOfferComponent:f,titleText:c,titleVariables:h,showCallPermissionCard:B,callPermissionText:C},{errors:k}=this.validateState(g);return g.error=k,g}))}parseTemplateConfiguration(e){let t;const i=(null==e?void 0:e.content)||{};if("string"==typeof i)try{t=JSON.parse(i)}catch(e){console.error("Error parsing rcsTemplate component JSON:",e),t={orientation:"VERTICAL"}}else t=i;return Object.assign(Object.assign({},t),{templateType:null==e?void 0:e.templateType})}}export{L as TemplateCreatorHelper};
 //# sourceMappingURL=TemplateCreatorHelper.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TemplateCreatorHelper.js","sources":["../../../../../src/components/template-preview/helpers/TemplateCreatorHelper.ts"],"sourcesContent":["import { format } from 'date-fns';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\teditableVarPattern,\n\tplaceHolderNamePattern,\n\tspecialCharPattern,\n} from '../constants/regexPatterns';\nimport {\n\tBODY_LEN_ERROR,\n\tBODY_TEXT_LEN_LIMIT,\n\tBUTTON_EMOJI_ERROR,\n\tCREATE_TEMPLATE_DOM_IDS,\n\tHEADER_ASSET_LINK_ERROR,\n\tHEADER_LEN_ERROR,\n\tHEADER_TEXT_LEN_LIMIT,\n\tNAME_LEN_ERROR,\n\tNAME_LEN_LIMIT,\n\tNO_SPECIAL_CHAR,\n\tONE_VAR_ALLOWED,\n\tQUICK_REPLY_BTN_TEXT_LIMIT,\n\tQUICK_REPLY_LEN_ERROR,\n\tQUICK_REPLY_NAME_ERROR,\n\tQUICK_REPLY_NAME_LEN_LIMIT,\n\tREQUIRED_FIELD,\n\tVALID_PHONE_NUMBER,\n} from '../constants/TemplateConstants';\nimport {\n\tRCS_TEMPLATE_TYPE,\n\tRCSTemplateConfig,\n\tRCSTemplateType,\n} from '../models/RCSTemplate';\nimport {\n\tACTIONS_TYPES,\n\tHEADER_TYPES,\n\tQUICK_REPLY_BUTTON,\n} from '../models/TemplateMeta';\nimport {\n\tCreateTemplateType,\n\tPOD,\n\ttemplateVariable,\n\tWhatsappPreviewButtonType,\n\tWhatsAppTemplate,\n} from '../models/WhatsAppTemplate';\nimport { TemplateHelperUtils } from '../utils/TemplateHelperUtils';\n\nexport class TemplateCreatorHelper {\n\tprivate parseDataFromHeaderComponent(\n\t\tdbFormattedTemplate: WhatsAppTemplate,\n\t\tshowSampleValues?: boolean,\n\t\tpod?: string,\n\t) {\n\t\tconst res: {\n\t\t\theaderType: HEADER_TYPES;\n\t\t\theaderAssetLink?: string;\n\t\t\theaderAssetName?: string;\n\t\t\theaderText?: string;\n\t\t\theaderVariables: templateVariable[];\n\t\t} = {\n\t\t\theaderType: HEADER_TYPES.NONE,\n\t\t\theaderVariables: [],\n\t\t};\n\n\t\tconst headerComponent = dbFormattedTemplate?.components?.find(\n\t\t\t(component) => component.type === 'HEADER',\n\t\t);\n\n\t\tif (headerComponent) {\n\t\t\tres.headerType = headerComponent.format as HEADER_TYPES;\n\t\t\tres.headerText = headerComponent.text;\n\n\t\t\tres.headerAssetLink = headerComponent.example?.header_handle?.[0];\n\n\t\t\tconst sampleValue = headerComponent.example?.header_text?.[0];\n\t\t\tconst headerVarPlaceholder = dbFormattedTemplate.mapping?.header?.[0];\n\t\t\tconst originalVariable = headerVarPlaceholder;\n\t\t\tif (headerVarPlaceholder) {\n\t\t\t\tconst normalizedName = headerVarPlaceholder\n\t\t\t\t\t?.replace('[[', '')\n\t\t\t\t\t.replace(']]', '')\n\t\t\t\t\t.replace('{{', '')\n\t\t\t\t\t.replace('}}', '')\n\t\t\t\t\t.replace('((', '')\n\t\t\t\t\t.replace('))', '');\n\t\t\t\tconst editable = /\\(\\(/.test(headerVarPlaceholder);\n\t\t\t\tconst isChatbotCustomText =\n\t\t\t\t\tpod === POD.CHATBOT &&\n\t\t\t\t\toriginalVariable &&\n\t\t\t\t\toriginalVariable?.startsWith('((') &&\n\t\t\t\t\toriginalVariable?.endsWith('))');\n\n\t\t\t\tconst reduxHeaderVar: templateVariable = {\n\t\t\t\t\tidx: 0,\n\t\t\t\t\tvariableVal:\n\t\t\t\t\t\tshowSampleValues \|\| isChatbotCustomText\n\t\t\t\t\t\t\t? sampleValue\n\t\t\t\t\t\t\t: originalVariable,\n\t\t\t\t\teditable,\n\t\t\t\t\teditableDefaultValues: editable ? undefined : sampleValue,\n\t\t\t\t\tvariableName: normalizedName,\n\t\t\t\t};\n\t\t\t\tres.headerVariables = [reduxHeaderVar];\n\t\t\t\tif (headerComponent.example?.header_text?.length) {\n\t\t\t\t\tres.headerText = res.headerText?.replace(\n\t\t\t\t\t\t/** since there will be only one variable in template so hard replace /\n\t\t\t\t\t\t'{{1}}',\n\t\t\t\t\t\t`{{${normalizedName}}}`,\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn res;\n\t}\n\n\t/\n\t Check if current template state is ready for saving as a draft/submit-template or not\n\t * @param state\n\t /\n\tvalidateState(state: CreateTemplateType): {\n\t\tstatus: 'invalid' \| 'valid';\n\t\terrors: CreateTemplateType['error'];\n\t} {\n\t\tconst emojiRegex = /\\p{Extended_Pictographic}/u;\n\t\tlet status: 'invalid' \| 'valid' = 'valid';\n\t\tconst errors: CreateTemplateType['error'] = {\n\t\t\tmeta: {},\n\t\t\tctaBtn: {\n\t\t\t\tphoneNumber: { btnText: '', link: '' },\n\t\t\t\twebsiteLink: { btnText: '', link: '' },\n\t\t\t},\n\t\t\tquickReply: [null, null, null],\n\t\t};\n\t\tconst templateHelperUtils = new TemplateHelperUtils();\n\t\tlet isScrolled = false;\n\n\t\tconst scrollByElementId = (elementId: string) => {\n\t\t\tdocument.getElementById(elementId)?.scrollIntoView({\n\t\t\t\tbehavior: 'smooth',\n\t\t\t\tblock: 'nearest',\n\t\t\t});\n\t\t};\n\n\t\tif (!state.meta?.name) {\n\t\t\terrors.meta!.name = REQUIRED_FIELD;\n\t\t\tstatus = 'invalid';\n\t\t} else if (state.meta.name?.trim().length > NAME_LEN_LIMIT) {\n\t\t\terrors.meta!.name = NAME_LEN_ERROR;\n\t\t\tstatus = 'invalid';\n\t\t} else if (specialCharPattern.test(state.meta.name?.trim())) {\n\t\t\terrors.meta!.name = NO_SPECIAL_CHAR;\n\t\t\tstatus = 'invalid';\n\t\t}\n\n\t\tif (!!errors.meta!.name && !isScrolled) {\n\t\t\tscrollByElementId(CREATE_TEMPLATE_DOM_IDS.name);\n\t\t\tisScrolled = true;\n\t\t}\n\n\t\tif (state.headerType === HEADER_TYPES.TEXT) {\n\t\t\tconst text = state.headerText?.trim() ?? '';\n\t\t\tif (!text) {\n\t\t\t\terrors.header = REQUIRED_FIELD;\n\t\t\t\tstatus = 'invalid';\n\t\t\t} else if (text.length > HEADER_TEXT_LEN_LIMIT) {\n\t\t\t\terrors.header = HEADER_LEN_ERROR;\n\t\t\t\tstatus = 'invalid';\n\t\t\t} else {\n\t\t\t\tconst variableList =\n\t\t\t\t\ttemplateHelperUtils.getTemplateVariablesFromState(text);\n\t\t\t\tif (variableList && variableList.length > 1) {\n\t\t\t\t\terrors.header = ONE_VAR_ALLOWED;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (state.headerType === HEADER_TYPES.DOCUMENT) {\n\t\t\t/* @todo add media header validations /\n\t\t} else if (state.headerType === HEADER_TYPES.IMAGE) {\n\t\t\t/* @todo add media header validations /\n\t\t} else if (state.headerType === HEADER_TYPES.VIDEO) {\n\t\t\t/* @todo add media header validations /\n\t\t}\n\n\t\tif (\n\t\t\tstate.headerType === HEADER_TYPES.DOCUMENT \|\|\n\t\t\tstate.headerType === HEADER_TYPES.IMAGE \|\|\n\t\t\tstate.headerType === HEADER_TYPES.VIDEO\n\t\t) {\n\t\t\tif (!state.headerAssetLink) {\n\t\t\t\terrors.header = HEADER_ASSET_LINK_ERROR;\n\t\t\t\tstatus = 'invalid';\n\t\t\t}\n\t\t}\n\n\t\tif (!!errors.header && !isScrolled) {\n\t\t\tscrollByElementId(CREATE_TEMPLATE_DOM_IDS.header);\n\t\t\tisScrolled = true;\n\t\t}\n\n\t\tif (!state.bodyText) {\n\t\t\terrors.body = REQUIRED_FIELD;\n\t\t\tstatus = 'invalid';\n\t\t} else {\n\t\t\tif (\n\t\t\t\tstate.bodyTextRaw &&\n\t\t\t\tstate.bodyTextRaw?.trim().length > BODY_TEXT_LEN_LIMIT\n\t\t\t) {\n\t\t\t\terrors.body = BODY_LEN_ERROR;\n\t\t\t\tstatus = 'invalid';\n\t\t\t}\n\t\t}\n\n\t\tif (!!errors.body && !isScrolled) {\n\t\t\tscrollByElementId(CREATE_TEMPLATE_DOM_IDS.body);\n\t\t\tisScrolled = true;\n\t\t}\n\n\t\tif (state.footerText && state.footerText.length > HEADER_TEXT_LEN_LIMIT) {\n\t\t\terrors.footer = HEADER_LEN_ERROR;\n\t\t\tstatus = 'invalid';\n\t\t}\n\n\t\tif (!!errors?.footer && !isScrolled) {\n\t\t\tscrollByElementId(CREATE_TEMPLATE_DOM_IDS.footer);\n\t\t\tisScrolled = true;\n\t\t}\n\n\t\tif (state.actionsType === ACTIONS_TYPES.CTA_BTN) {\n\t\t\tif (state.ctaBtn?.phoneNumber?.isChecked) {\n\t\t\t\tconst btnText = state.ctaBtn.phoneNumber.btnText?.trim();\n\t\t\t\tconst phoneNumber = state.ctaBtn.phoneNumber.phoneNumber;\n\n\t\t\t\tif (errors.ctaBtn && !btnText) {\n\t\t\t\t\terrors.ctaBtn.phoneNumber.btnText = REQUIRED_FIELD;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (\n\t\t\t\t\terrors.ctaBtn &&\n\t\t\t\t\tbtnText &&\n\t\t\t\t\tbtnText.length > QUICK_REPLY_BTN_TEXT_LIMIT\n\t\t\t\t) {\n\t\t\t\t\terrors.ctaBtn.phoneNumber.btnText = QUICK_REPLY_LEN_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (errors.ctaBtn && btnText && emojiRegex.test(btnText)) {\n\t\t\t\t\terrors.ctaBtn.phoneNumber.btnText = BUTTON_EMOJI_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t}\n\n\t\t\t\tif (errors.ctaBtn && !phoneNumber) {\n\t\t\t\t\terrors.ctaBtn.phoneNumber.link = REQUIRED_FIELD;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (errors.ctaBtn && phoneNumber && phoneNumber.length < 10) {\n\t\t\t\t\terrors.ctaBtn.phoneNumber.link = VALID_PHONE_NUMBER;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t}\n\t\t\t}\n\t\t\tif (state.ctaBtn?.websiteLinkBtn?.isChecked) {\n\t\t\t\tconst btnText = state.ctaBtn.websiteLinkBtn.btnText?.trim();\n\t\t\t\tconst customLink = state.ctaBtn.websiteLinkBtn.linkOpens?.trim();\n\t\t\t\tconst placeholder = state.ctaBtn.websiteLinkBtn.placeholder?.trim();\n\n\t\t\t\tif (errors.ctaBtn && !btnText) {\n\t\t\t\t\terrors.ctaBtn.websiteLink.btnText = REQUIRED_FIELD;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (\n\t\t\t\t\terrors.ctaBtn &&\n\t\t\t\t\tbtnText &&\n\t\t\t\t\tbtnText.length > QUICK_REPLY_BTN_TEXT_LIMIT\n\t\t\t\t) {\n\t\t\t\t\terrors.ctaBtn.websiteLink.btnText = QUICK_REPLY_LEN_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (errors.ctaBtn && btnText && emojiRegex.test(btnText)) {\n\t\t\t\t\terrors.ctaBtn.websiteLink.btnText = BUTTON_EMOJI_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t}\n\n\t\t\t\tif (errors.ctaBtn && !customLink && !placeholder) {\n\t\t\t\t\terrors.ctaBtn.websiteLink.link = REQUIRED_FIELD;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (state.actionsType === ACTIONS_TYPES.QUICK_REPLY) {\n\t\t\tconst quickReplyErrors = ['', '', ''];\n\t\t\tstate.quickReply.forEach((button, i) => {\n\t\t\t\tconst text = button.text?.trim();\n\t\t\t\tif (!text) {\n\t\t\t\t\tquickReplyErrors[i] = REQUIRED_FIELD;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (text.length > QUICK_REPLY_NAME_LEN_LIMIT) {\n\t\t\t\t\tquickReplyErrors[i] = QUICK_REPLY_LEN_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (emojiRegex.test(text)) {\n\t\t\t\t\tquickReplyErrors[i] = BUTTON_EMOJI_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else {\n\t\t\t\t\tconst buttons = [...state.quickReply];\n\t\t\t\t\tbuttons.splice(i, 1);\n\t\t\t\t\tconst exists = buttons.find(\n\t\t\t\t\t\t(el: QUICK_REPLY_BUTTON) => el.text === text,\n\t\t\t\t\t);\n\t\t\t\t\tif (exists) {\n\t\t\t\t\t\tquickReplyErrors[i] = QUICK_REPLY_NAME_ERROR;\n\t\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\n\t\t\terrors.quickReply = quickReplyErrors;\n\t\t}\n\n\t\tif (\n\t\t\tstate.actionsType === ACTIONS_TYPES.CTA_BTN \|\|\n\t\t\tstate.actionsType === ACTIONS_TYPES.QUICK_REPLY\n\t\t) {\n\t\t\tconst quickReplyErrors = errors.quickReply?.reduce(\n\t\t\t\t(qrbErrorAcc, currentError) => qrbErrorAcc \|\| !!currentError,\n\t\t\t\tfalse,\n\t\t\t);\n\t\t\tif (\n\t\t\t\t(!!errors?.ctaBtn?.websiteLink?.link \|\|\n\t\t\t\t\t!!errors.ctaBtn?.websiteLink?.btnText \|\|\n\t\t\t\t\t!!errors.ctaBtn?.phoneNumber?.link \|\|\n\t\t\t\t\t!!errors.ctaBtn?.phoneNumber?.btnText \|\|\n\t\t\t\t\t!!quickReplyErrors) &&\n\t\t\t\t!isScrolled\n\t\t\t) {\n\t\t\t\tscrollByElementId(CREATE_TEMPLATE_DOM_IDS.actionButtons);\n\t\t\t\tisScrolled = true;\n\t\t\t}\n\t\t}\n\n\t\treturn { status, errors };\n\t}\n\n\tprivate parseBodyComponent(\n\t\tdbFormattedTemplate: WhatsAppTemplate,\n\t\tisV2 = false,\n\t\tshowSampleValues?: boolean,\n\t\tpod?: string,\n\t) {\n\t\tconst bodyVariable: templateVariable[] = [];\n\t\tlet bodyText = '';\n\n\t\tconst bodyComponent = dbFormattedTemplate.components?.find(\n\t\t\t(component) => component.type === 'BODY',\n\t\t);\n\n\t\tif (bodyComponent) {\n\t\t\tbodyComponent.example?.body_text?.[0]?.forEach((sampleValue, i) => {\n\t\t\t\tlet bodyVarPlaceholder = dbFormattedTemplate.mapping?.body?.[i];\n\t\t\t\tconst originalVariable = bodyVarPlaceholder;\n\t\t\t\tconst editable = bodyVarPlaceholder && /\\(\\(/.test(bodyVarPlaceholder);\n\t\t\t\tconst matchedPlaceholderName = bodyVarPlaceholder?.match(\n\t\t\t\t\tplaceHolderNamePattern,\n\t\t\t\t);\n\n\t\t\t\tif (matchedPlaceholderName?.[2]) {\n\t\t\t\t\tbodyVarPlaceholder = matchedPlaceholderName?.[2];\n\t\t\t\t}\n\n\t\t\t\tconst isChatbotCustomText =\n\t\t\t\t\tpod === POD.CHATBOT &&\n\t\t\t\t\toriginalVariable &&\n\t\t\t\t\toriginalVariable?.startsWith('((') &&\n\t\t\t\t\toriginalVariable?.endsWith('))');\n\n\t\t\t\tbodyVariable.push({\n\t\t\t\t\tidx: i,\n\t\t\t\t\tvariableVal:\n\t\t\t\t\t\tshowSampleValues \|\| isChatbotCustomText\n\t\t\t\t\t\t\t? sampleValue\n\t\t\t\t\t\t\t: originalVariable,\n\t\t\t\t\teditable: !!editable,\n\t\t\t\t\teditableDefaultValues: editable ? undefined : sampleValue,\n\t\t\t\t\tvariableName: bodyVarPlaceholder ?? '',\n\t\t\t\t});\n\t\t\t});\n\n\t\t\tif (dbFormattedTemplate.htmlContentUrl) {\n\t\t\t\tbodyText = dbFormattedTemplate.htmlContentUrl;\n\t\t\t} else {\n\t\t\t\tbodyText = bodyComponent.text?.split(/\\{\\{[0-9]+\\}\\}/).length\n\t\t\t\t\t? bodyComponent.text\n\t\t\t\t\t\t\t?.split(/\\{\\{[0-9]+\\}\\}/)\n\t\t\t\t\t\t\t.map((t, i) => {\n\t\t\t\t\t\t\t\tif (bodyVariable?.[i]) {\n\t\t\t\t\t\t\t\t\tconst normalizeName = bodyVariable[i].variableName;\n\t\t\t\t\t\t\t\t\tconst tmp = isV2\n\t\t\t\t\t\t\t\t\t\t? `${t}{{${normalizeName}}}`\n\t\t\t\t\t\t\t\t\t\t: `${t} <span> </span><span style=\"color: ${COLORS.content.brand}; text-decoration: underline;\">{{${normalizeName}}}</span><span> </span>`;\n\n\t\t\t\t\t\t\t\t\treturn tmp;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\treturn t;\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t.join('')\n\t\t\t\t\t: '';\n\t\t\t}\n\t\t}\n\n\t\treturn { bodyVariable, bodyText };\n\t}\n\n\tprivate parseTitleComponent(\n\t\tdbFormattedTemplate: WhatsAppTemplate,\n\t\tisV2 = false,\n\t\tshowSampleValues?: boolean,\n\t) {\n\t\tconst titleVariable: templateVariable[] = [];\n\t\tlet titleText = '';\n\n\t\tconst bodyComponent = dbFormattedTemplate.components?.find(\n\t\t\t(component) => component.type === 'TITLE',\n\t\t);\n\n\t\tif (bodyComponent) {\n\t\t\tbodyComponent.example?.title_text?.[0]?.forEach((sampleValue, i) => {\n\t\t\t\tlet bodyVarPlaceholder = dbFormattedTemplate.mapping?.body?.[i];\n\t\t\t\tconst originalVariable = bodyVarPlaceholder;\n\t\t\t\tconst editable = bodyVarPlaceholder && /\\(\\(/.test(bodyVarPlaceholder);\n\t\t\t\tconst matchedPlaceholderName = bodyVarPlaceholder?.match(\n\t\t\t\t\tplaceHolderNamePattern,\n\t\t\t\t);\n\n\t\t\t\tif (matchedPlaceholderName?.[2]) {\n\t\t\t\t\tbodyVarPlaceholder = matchedPlaceholderName?.[2];\n\t\t\t\t}\n\n\t\t\t\ttitleVariable.push({\n\t\t\t\t\tidx: i,\n\t\t\t\t\tvariableVal: showSampleValues ? sampleValue : originalVariable,\n\t\t\t\t\teditable: !!editable,\n\t\t\t\t\teditableDefaultValues: editable ? undefined : sampleValue,\n\t\t\t\t\tvariableName: bodyVarPlaceholder ?? '',\n\t\t\t\t});\n\t\t\t});\n\n\t\t\tif (dbFormattedTemplate.htmlContentUrl) {\n\t\t\t\ttitleText = dbFormattedTemplate.htmlContentUrl;\n\t\t\t} else {\n\t\t\t\ttitleText = bodyComponent.text?.split(/\\{\\{[0-9]+\\}\\}/).length\n\t\t\t\t\t? bodyComponent.text\n\t\t\t\t\t\t\t?.split(/\\{\\{[0-9]+\\}\\}/)\n\t\t\t\t\t\t\t.map((t, i) => {\n\t\t\t\t\t\t\t\tif (titleVariable?.[i]) {\n\t\t\t\t\t\t\t\t\tconst normalizeName = titleVariable[i].variableName;\n\t\t\t\t\t\t\t\t\tconst tmp = isV2\n\t\t\t\t\t\t\t\t\t\t? `${t}{{${normalizeName}}}`\n\t\t\t\t\t\t\t\t\t\t: `${t} <span> </span><span style=\"color: ${COLORS.content.brand}; text-decoration: underline;\">{{${normalizeName}}}</span><span> </span>`;\n\n\t\t\t\t\t\t\t\t\treturn tmp;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\treturn t;\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t.join('')\n\t\t\t\t\t: '';\n\t\t\t}\n\t\t}\n\n\t\treturn { titleText, titleVariables: titleVariable };\n\t}\n\n\tprivate parseFooterComponent(dbFormattedTemplate: WhatsAppTemplate) {\n\t\tconst footerComponent = dbFormattedTemplate.components?.find(\n\t\t\t(component) => component.type === 'FOOTER',\n\t\t);\n\n\t\treturn footerComponent?.text;\n\t}\n\n\tprivate parseButtonComponent(dbFormattedTemplate: WhatsAppTemplate) {\n\t\tconst res: {\n\t\t\tactionsType: ACTIONS_TYPES;\n\t\t\tquickReply: Array<QUICK_REPLY_BUTTON>;\n\t\t\tctaBtn: {\n\t\t\t\tphoneNumber?: {\n\t\t\t\t\tisChecked?: boolean;\n\t\t\t\t\tbtnText?: string;\n\t\t\t\t\tphoneNumber?: string;\n\t\t\t\t};\n\t\t\t\twebsiteLinkBtn?: {\n\t\t\t\t\tisChecked?: boolean;\n\t\t\t\t\tbtnText?: string;\n\t\t\t\t\tlinkOpens?: string;\n\t\t\t\t\tplaceholder?: string;\n\t\t\t\t};\n\t\t\t};\n\t\t\tallButtons: WhatsappPreviewButtonType[];\n\t\t} = {\n\t\t\tactionsType: ACTIONS_TYPES.NONE,\n\t\t\tquickReply: [],\n\t\t\tctaBtn: {\n\t\t\t\tphoneNumber: undefined,\n\t\t\t\twebsiteLinkBtn: undefined,\n\t\t\t},\n\t\t\tallButtons: [],\n\t\t};\n\n\t\tconst buttonComponent = dbFormattedTemplate.components?.find(\n\t\t\t(component) => component.type === 'BUTTONS',\n\t\t);\n\n\t\tif (buttonComponent && buttonComponent?.buttons?.length) {\n\t\t\tconst actionsType =\n\t\t\t\tbuttonComponent?.buttons?.[0].type === 'QUICK_REPLY'\n\t\t\t\t\t? ACTIONS_TYPES.QUICK_REPLY\n\t\t\t\t\t: ACTIONS_TYPES.CTA_BTN;\n\n\t\t\tres.actionsType = actionsType;\n\n\t\t\tif (actionsType === ACTIONS_TYPES.QUICK_REPLY) {\n\t\t\t\tconst btnTexts = (buttonComponent?.buttons?.map((btn) => btn) ??\n\t\t\t\t\t[]) as QUICK_REPLY_BUTTON[];\n\t\t\t\tres.quickReply = btnTexts;\n\t\t\t} else if (actionsType === ACTIONS_TYPES.CTA_BTN) {\n\t\t\t\tbuttonComponent?.buttons?.forEach((btn) => {\n\t\t\t\t\tif (btn.phone_number) {\n\t\t\t\t\t\tres.ctaBtn.phoneNumber = {\n\t\t\t\t\t\t\tisChecked: true,\n\t\t\t\t\t\t\tbtnText: btn.text,\n\t\t\t\t\t\t\tphoneNumber: btn.phone_number,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\tif (btn.url) {\n\t\t\t\t\t\tconst btnPlaceholder =\n\t\t\t\t\t\t\tdbFormattedTemplate?.mapping?.buttons?.[0] ?? undefined;\n\t\t\t\t\t\tlet customUrl = false;\n\n\t\t\t\t\t\tif (btnPlaceholder && editableVarPattern.test(btnPlaceholder)) {\n\t\t\t\t\t\t\tcustomUrl = true;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tres.ctaBtn.websiteLinkBtn = {\n\t\t\t\t\t\t\tisChecked: true,\n\t\t\t\t\t\t\tbtnText: btn.text,\n\t\t\t\t\t\t\tlinkOpens: customUrl ? btn.example?.[0] : btn.url,\n\t\t\t\t\t\t\tplaceholder: customUrl ? undefined : btnPlaceholder,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t}\n\n\t\t\t// Parses buttons from template to a format preview can understand.\n\t\t\t// Since copy code does not come with a variable by default, we are adding placeholder from example.\n\t\t\tres.allButtons = buttonComponent.buttons?.map((button) => {\n\t\t\t\tif (button.type === 'COPY_CODE') {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...button,\n\t\t\t\t\t\tplaceholder: Array.isArray(button.example)\n\t\t\t\t\t\t\t? button.example[0]\n\t\t\t\t\t\t\t: button?.example \|\| '',\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t\treturn button;\n\t\t\t}) as WhatsappPreviewButtonType[];\n\t\t}\n\n\t\treturn res;\n\t}\n\n\t/\n\t Parses LTO component to a format preview can understand.\n\t * Points to Note -\n\t * 1. Takes the Copy Code from previously parsed buttons.\n\t * 2. LTO component does not have a dateTime expiry by default. Hence, while sending template to ContextMapper, send with a date or current Date and Time is picked here.\n\t /\n\tprivate parseLimitedTimeOfferComponent(\n\t\tdbFormattedTemplate: WhatsAppTemplate,\n\t\tallButtons: WhatsappPreviewButtonType[],\n\t) {\n\t\tconst limitedTimeOfferComponent: CreateTemplateType['limitedTimeOfferComponent'] =\n\t\t\t{\n\t\t\t\ttext: '',\n\t\t\t\tdateTime: '',\n\t\t\t\tcode: '',\n\t\t\t};\n\n\t\tdbFormattedTemplate.components.forEach((component) => {\n\t\t\tif (component.type === 'limited_time_offer') {\n\t\t\t\tlimitedTimeOfferComponent.text =\n\t\t\t\t\tcomponent.limited_time_offer?.text ?? '';\n\t\t\t\tconst dateTime = component.example?.limited_time_offer;\n\t\t\t\tif (dateTime && dateTime.startsWith('{{') && dateTime.endsWith('}}')) {\n\t\t\t\t\tlimitedTimeOfferComponent.dateTime = dateTime;\n\t\t\t\t} else {\n\t\t\t\t\tlimitedTimeOfferComponent.dateTime = format(\n\t\t\t\t\t\tdateTime ? new Date(dateTime) : new Date(),\n\t\t\t\t\t\t'MMM dd',\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tallButtons.forEach((button) => {\n\t\t\t\tif (button.type === 'COPY_CODE') {\n\t\t\t\t\tlimitedTimeOfferComponent.code = button.placeholder ?? '';\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\n\t\treturn limitedTimeOfferComponent;\n\t}\n\n\tprivate parseCallPermissionComponent(dbFormattedTemplate: WhatsAppTemplate): {\n\t\tshowCallPermissionCard: boolean;\n\t\tcallPermissionText?: string;\n\t} {\n\t\tconst callPermissionComponent = dbFormattedTemplate.components?.find(\n\t\t\t(component) => (component as any).type === 'CALL_PERMISSION_REQUEST',\n\t\t);\n\n\t\treturn {\n\t\t\tshowCallPermissionCard: Boolean(callPermissionComponent),\n\t\t\tcallPermissionText: (callPermissionComponent as any)?.text,\n\t\t};\n\t}\n\n\tasync parseUITemplateFromDBFormat(data: {\n\t\tdbFormattedTemplate: WhatsAppTemplate;\n\t\tisDuplicate?: boolean;\n\t\tshowSampleValues?: boolean;\n\t\tisV2?: boolean;\n\t\tpod?: string;\n\t}) {\n\t\tconst {\n\t\t\tdbFormattedTemplate,\n\t\t\tisDuplicate,\n\t\t\tisV2 = false,\n\t\t\tshowSampleValues,\n\t\t\tpod,\n\t\t} = data;\n\t\tconst {\n\t\t\theaderType,\n\t\t\theaderAssetLink,\n\t\t\theaderAssetName,\n\t\t\theaderText,\n\t\t\theaderVariables,\n\t\t} = await this.parseDataFromHeaderComponent(\n\t\t\tdbFormattedTemplate,\n\t\t\tundefined,\n\t\t\tpod,\n\t\t);\n\n\t\tconst { bodyText, bodyVariable: bodyVariables } =\n\t\t\tawait this.parseBodyComponent(\n\t\t\t\tdbFormattedTemplate,\n\t\t\t\tisV2,\n\t\t\t\tshowSampleValues,\n\t\t\t\tpod,\n\t\t\t);\n\t\tconst { titleText, titleVariables: titleVariables } =\n\t\t\tawait this.parseTitleComponent(\n\t\t\t\tdbFormattedTemplate,\n\t\t\t\tisV2,\n\t\t\t\tshowSampleValues,\n\t\t\t);\n\n\t\tconst { actionsType, quickReply, ctaBtn, allButtons } =\n\t\t\tawait this.parseButtonComponent(dbFormattedTemplate);\n\n\t\tconst limitedTimeOfferComponent = this.parseLimitedTimeOfferComponent(\n\t\t\tdbFormattedTemplate,\n\t\t\tallButtons,\n\t\t);\n\n\t\tconst { showCallPermissionCard, callPermissionText } =\n\t\t\tthis.parseCallPermissionComponent(dbFormattedTemplate);\n\n\t\tconst state: CreateTemplateType = {\n\t\t\tquickReply,\n\t\t\tctaBtn,\n\t\t\tallButtons,\n\t\t\tmeta: {\n\t\t\t\tname: isDuplicate\n\t\t\t\t\t? `${dbFormattedTemplate.label} Copy`\n\t\t\t\t\t: dbFormattedTemplate.label,\n\t\t\t\tcategory: dbFormattedTemplate.category?.toUpperCase(),\n\t\t\t\tsubCategory: dbFormattedTemplate.templateCategory,\n\t\t\t\tlanguage: dbFormattedTemplate.language,\n\t\t\t\ttemplateId: dbFormattedTemplate.templateId,\n\t\t\t},\n\t\t\terror: {\n\t\t\t\theader: undefined,\n\t\t\t\tbody: undefined,\n\t\t\t\tfooter: undefined,\n\t\t\t\tquickReply: undefined,\n\t\t\t\tmeta: undefined,\n\t\t\t\tctaBtn: undefined,\n\t\t\t},\n\n\t\t\tactionsType,\n\t\t\tfooterText: this.parseFooterComponent(dbFormattedTemplate),\n\t\t\t/* BODY TEXT /\n\t\t\tbodyVariables,\n\t\t\tbodyText,\n\n\t\t\t/* HEADER /\n\t\t\theaderType,\n\t\t\theaderAssetLink,\n\t\t\theaderAssetName,\n\t\t\theaderText,\n\t\t\theaderVariables,\n\t\t\talreadyAsADraft: dbFormattedTemplate.isDraft,\n\t\t\tmode: 'edit',\n\t\t\tinitialLoading: false,\n\t\t\t/ LIMITED TIME OFFER /\n\t\t\tlimitedTimeOfferComponent,\n\t\t\t/ Title for RCS /\n\t\t\ttitleText,\n\t\t\ttitleVariables,\n\t\t\t/ Call Permission */\n\t\t\tshowCallPermissionCard,\n\t\t\tcallPermissionText,\n\t\t};\n\n\t\tconst { errors } = this.validateState(state);\n\n\t\tstate.error = errors;\n\n\t\treturn state;\n\t}\n\n\tparseTemplateConfiguration(template: RCSTemplateType): RCSTemplateConfig {\n\t\tlet config: RCSTemplateConfig;\n\t\tconst templateConfig = template?.content \|\| ({} as RCSTemplateConfig);\n\t\tif (typeof templateConfig === 'string') {\n\t\t\ttry {\n\t\t\t\tconfig = JSON.parse(templateConfig) as RCSTemplateConfig;\n\t\t\t} catch (error) {\n\t\t\t\tconsole.error('Error parsing rcsTemplate component JSON:', error);\n\t\t\t\tconfig = { orientation: 'VERTICAL' } as RCSTemplateConfig;\n\t\t\t}\n\t\t} else {\n\t\t\tconfig = templateConfig;\n\t\t}\n\t\treturn {\n\t\t\t...config,\n\t\t\ttemplateType: template?.templateType as RCS_TEMPLATE_TYPE,\n\t\t};\n\t}\n}\n"],"names":["TemplateCreatorHelper","parseDataFromHeaderComponent","dbFormattedTemplate","showSampleValues","pod","res","headerType","HEADER_TYPES","NONE","headerVariables","headerComponent","_a","components","find","component","type","format","headerText","text","headerAssetLink","_c","_b","example","header_handle","sampleValue","_e","_d","header_text","headerVarPlaceholder","_g","_f","mapping","header","originalVariable","normalizedName","replace","editable","test","isChatbotCustomText","POD","CHATBOT","startsWith","endsWith","reduxHeaderVar","idx","variableVal","editableDefaultValues","undefined","variableName","_j","_h","length","_k","validateState","state","emojiRegex","status","errors","meta","ctaBtn","phoneNumber","btnText","link","websiteLink","quickReply","templateHelperUtils","TemplateHelperUtils","isScrolled","scrollByElementId","elementId","document","getElementById","scrollIntoView","behavior","block","name","trim","NAME_LEN_LIMIT","NAME_LEN_ERROR","specialCharPattern","NO_SPECIAL_CHAR","REQUIRED_FIELD","CREATE_TEMPLATE_DOM_IDS","TEXT","HEADER_TEXT_LEN_LIMIT","HEADER_LEN_ERROR","variableList","getTemplateVariablesFromState","ONE_VAR_ALLOWED","DOCUMENT","IMAGE","VIDEO","HEADER_ASSET_LINK_ERROR","bodyText","bodyTextRaw","BODY_TEXT_LEN_LIMIT","body","BODY_LEN_ERROR","footerText","footer","actionsType","ACTIONS_TYPES","CTA_BTN","isChecked","QUICK_REPLY_BTN_TEXT_LIMIT","QUICK_REPLY_LEN_ERROR","BUTTON_EMOJI_ERROR","VALID_PHONE_NUMBER","_l","websiteLinkBtn","_m","customLink","_o","linkOpens","placeholder","_p","QUICK_REPLY","quickReplyErrors","forEach","button","i","QUICK_REPLY_NAME_LEN_LIMIT","buttons","splice","el","QUICK_REPLY_NAME_ERROR","_q","reduce","qrbErrorAcc","currentError","_s","_u","_t","_w","_v","_y","_x","actionButtons","parseBodyComponent","isV2","bodyVariable","bodyComponent","body_text","bodyVarPlaceholder","matchedPlaceholderName","match","placeHolderNamePattern","push","htmlContentUrl","split","map","t","normalizeName","COLORS","content","brand","join","parseTitleComponent","titleVariable","titleText","title_text","titleVariables","parseFooterComponent","footerComponent","parseButtonComponent","allButtons","buttonComponent","btnTexts","btn","phone_number","url","btnPlaceholder","customUrl","editableVarPattern","Object","assign","Array","isArray","parseLimitedTimeOfferComponent","limitedTimeOfferComponent","dateTime","code","limited_time_offer","Date","parseCallPermissionComponent","callPermissionComponent","showCallPermissionCard","Boolean","callPermissionText","parseUITemplateFromDBFormat","data","isDuplicate","headerAssetName","this","bodyVariables","label","category","toUpperCase","subCategory","templateCategory","language","templateId","error","alreadyAsADraft","isDraft","mode","initialLoading","parseTemplateConfiguration","template","config","templateConfig","JSON","parse","console","orientation","templateType"],"mappings":"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"}
1	+ {"version":3,"file":"TemplateCreatorHelper.js","sources":["../../../../../src/components/template-preview/helpers/TemplateCreatorHelper.ts"],"sourcesContent":["import { format } from 'date-fns';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\teditableVarPattern,\n\tplaceHolderNamePattern,\n\tspecialCharPattern,\n} from '../constants/regexPatterns';\nimport {\n\tBODY_LEN_ERROR,\n\tBODY_TEXT_LEN_LIMIT,\n\tBUTTON_EMOJI_ERROR,\n\tCREATE_TEMPLATE_DOM_IDS,\n\tHEADER_ASSET_LINK_ERROR,\n\tHEADER_LEN_ERROR,\n\tHEADER_TEXT_LEN_LIMIT,\n\tNAME_LEN_ERROR,\n\tNAME_LEN_LIMIT,\n\tNO_SPECIAL_CHAR,\n\tONE_VAR_ALLOWED,\n\tQUICK_REPLY_BTN_TEXT_LIMIT,\n\tQUICK_REPLY_LEN_ERROR,\n\tQUICK_REPLY_NAME_ERROR,\n\tQUICK_REPLY_NAME_LEN_LIMIT,\n\tREQUIRED_FIELD,\n\tVALID_PHONE_NUMBER,\n} from '../constants/TemplateConstants';\nimport {\n\tRCS_TEMPLATE_TYPE,\n\tRCSTemplateConfig,\n\tRCSTemplateType,\n} from '../models/RCSTemplate';\nimport {\n\tACTIONS_TYPES,\n\tHEADER_TYPES,\n\tQUICK_REPLY_BUTTON,\n} from '../models/TemplateMeta';\nimport {\n\tCreateTemplateType,\n\tPOD,\n\ttemplateVariable,\n\tWhatsappPreviewButtonType,\n\tWhatsAppTemplate,\n} from '../models/WhatsAppTemplate';\nimport { TemplateHelperUtils } from '../utils/TemplateHelperUtils';\n\nexport class TemplateCreatorHelper {\n\tprivate parseDataFromHeaderComponent(\n\t\tdbFormattedTemplate: WhatsAppTemplate,\n\t\tshowSampleValues?: boolean,\n\t\tpod?: string,\n\t) {\n\t\tconst res: {\n\t\t\theaderType: HEADER_TYPES;\n\t\t\theaderAssetLink?: string;\n\t\t\theaderAssetName?: string;\n\t\t\theaderText?: string;\n\t\t\theaderVariables: templateVariable[];\n\t\t} = {\n\t\t\theaderType: HEADER_TYPES.NONE,\n\t\t\theaderVariables: [],\n\t\t};\n\n\t\tconst headerComponent = dbFormattedTemplate?.components?.find(\n\t\t\t(component) => component.type === 'HEADER',\n\t\t);\n\n\t\tif (headerComponent) {\n\t\t\tres.headerType = headerComponent.format as HEADER_TYPES;\n\t\t\tres.headerText = headerComponent.text;\n\n\t\t\tres.headerAssetLink = headerComponent.example?.header_handle?.[0];\n\n\t\t\tconst sampleValue = headerComponent.example?.header_text?.[0];\n\t\t\tconst headerVarPlaceholder = dbFormattedTemplate.mapping?.header?.[0];\n\t\t\tconst originalVariable = headerVarPlaceholder;\n\t\t\tif (headerVarPlaceholder) {\n\t\t\t\tconst normalizedName = headerVarPlaceholder\n\t\t\t\t\t?.replace('[[', '')\n\t\t\t\t\t.replace(']]', '')\n\t\t\t\t\t.replace('{{', '')\n\t\t\t\t\t.replace('}}', '')\n\t\t\t\t\t.replace('((', '')\n\t\t\t\t\t.replace('))', '');\n\t\t\t\tconst editable = /\\(\\(/.test(headerVarPlaceholder);\n\t\t\t\tconst isChatbotCustomText =\n\t\t\t\t\tpod === POD.CHATBOT &&\n\t\t\t\t\toriginalVariable &&\n\t\t\t\t\toriginalVariable?.startsWith('((') &&\n\t\t\t\t\toriginalVariable?.endsWith('))');\n\n\t\t\t\tconst reduxHeaderVar: templateVariable = {\n\t\t\t\t\tidx: 0,\n\t\t\t\t\tvariableVal:\n\t\t\t\t\t\tshowSampleValues \|\| isChatbotCustomText\n\t\t\t\t\t\t\t? sampleValue\n\t\t\t\t\t\t\t: originalVariable,\n\t\t\t\t\teditable,\n\t\t\t\t\teditableDefaultValues: editable ? undefined : sampleValue,\n\t\t\t\t\tvariableName: normalizedName,\n\t\t\t\t};\n\t\t\t\tres.headerVariables = [reduxHeaderVar];\n\t\t\t\tif (headerComponent.example?.header_text?.length) {\n\t\t\t\t\tres.headerText = res.headerText?.replace(\n\t\t\t\t\t\t/** since there will be only one variable in template so hard replace /\n\t\t\t\t\t\t'{{1}}',\n\t\t\t\t\t\t`{{${normalizedName}}}`,\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn res;\n\t}\n\n\t/\n\t Check if current template state is ready for saving as a draft/submit-template or not\n\t * @param state\n\t /\n\tvalidateState(state: CreateTemplateType): {\n\t\tstatus: 'invalid' \| 'valid';\n\t\terrors: CreateTemplateType['error'];\n\t} {\n\t\tconst emojiRegex = /\\p{Extended_Pictographic}/u;\n\t\tlet status: 'invalid' \| 'valid' = 'valid';\n\t\tconst errors: CreateTemplateType['error'] = {\n\t\t\tmeta: {},\n\t\t\tctaBtn: {\n\t\t\t\tphoneNumber: { btnText: '', link: '' },\n\t\t\t\twebsiteLink: { btnText: '', link: '' },\n\t\t\t},\n\t\t\tquickReply: [null, null, null],\n\t\t};\n\t\tconst templateHelperUtils = new TemplateHelperUtils();\n\t\tlet isScrolled = false;\n\n\t\tconst scrollByElementId = (elementId: string) => {\n\t\t\tdocument.getElementById(elementId)?.scrollIntoView({\n\t\t\t\tbehavior: 'smooth',\n\t\t\t\tblock: 'nearest',\n\t\t\t});\n\t\t};\n\n\t\tif (!state.meta?.name) {\n\t\t\terrors.meta!.name = REQUIRED_FIELD;\n\t\t\tstatus = 'invalid';\n\t\t} else if (state.meta.name?.trim().length > NAME_LEN_LIMIT) {\n\t\t\terrors.meta!.name = NAME_LEN_ERROR;\n\t\t\tstatus = 'invalid';\n\t\t} else if (specialCharPattern.test(state.meta.name?.trim())) {\n\t\t\terrors.meta!.name = NO_SPECIAL_CHAR;\n\t\t\tstatus = 'invalid';\n\t\t}\n\n\t\tif (!!errors.meta!.name && !isScrolled) {\n\t\t\tscrollByElementId(CREATE_TEMPLATE_DOM_IDS.name);\n\t\t\tisScrolled = true;\n\t\t}\n\n\t\tif (state.headerType === HEADER_TYPES.TEXT) {\n\t\t\tconst text = state.headerText?.trim() ?? '';\n\t\t\tif (!text) {\n\t\t\t\terrors.header = REQUIRED_FIELD;\n\t\t\t\tstatus = 'invalid';\n\t\t\t} else if (text.length > HEADER_TEXT_LEN_LIMIT) {\n\t\t\t\terrors.header = HEADER_LEN_ERROR;\n\t\t\t\tstatus = 'invalid';\n\t\t\t} else {\n\t\t\t\tconst variableList =\n\t\t\t\t\ttemplateHelperUtils.getTemplateVariablesFromState(text);\n\t\t\t\tif (variableList && variableList.length > 1) {\n\t\t\t\t\terrors.header = ONE_VAR_ALLOWED;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (state.headerType === HEADER_TYPES.DOCUMENT) {\n\t\t\t/* @todo add media header validations /\n\t\t} else if (state.headerType === HEADER_TYPES.IMAGE) {\n\t\t\t/* @todo add media header validations /\n\t\t} else if (state.headerType === HEADER_TYPES.VIDEO) {\n\t\t\t/* @todo add media header validations /\n\t\t}\n\n\t\tif (\n\t\t\tstate.headerType === HEADER_TYPES.DOCUMENT \|\|\n\t\t\tstate.headerType === HEADER_TYPES.IMAGE \|\|\n\t\t\tstate.headerType === HEADER_TYPES.VIDEO\n\t\t) {\n\t\t\tif (!state.headerAssetLink) {\n\t\t\t\terrors.header = HEADER_ASSET_LINK_ERROR;\n\t\t\t\tstatus = 'invalid';\n\t\t\t}\n\t\t}\n\n\t\tif (!!errors.header && !isScrolled) {\n\t\t\tscrollByElementId(CREATE_TEMPLATE_DOM_IDS.header);\n\t\t\tisScrolled = true;\n\t\t}\n\n\t\tif (!state.bodyText) {\n\t\t\terrors.body = REQUIRED_FIELD;\n\t\t\tstatus = 'invalid';\n\t\t} else {\n\t\t\tif (\n\t\t\t\tstate.bodyTextRaw &&\n\t\t\t\tstate.bodyTextRaw?.trim().length > BODY_TEXT_LEN_LIMIT\n\t\t\t) {\n\t\t\t\terrors.body = BODY_LEN_ERROR;\n\t\t\t\tstatus = 'invalid';\n\t\t\t}\n\t\t}\n\n\t\tif (!!errors.body && !isScrolled) {\n\t\t\tscrollByElementId(CREATE_TEMPLATE_DOM_IDS.body);\n\t\t\tisScrolled = true;\n\t\t}\n\n\t\tif (state.footerText && state.footerText.length > HEADER_TEXT_LEN_LIMIT) {\n\t\t\terrors.footer = HEADER_LEN_ERROR;\n\t\t\tstatus = 'invalid';\n\t\t}\n\n\t\tif (!!errors?.footer && !isScrolled) {\n\t\t\tscrollByElementId(CREATE_TEMPLATE_DOM_IDS.footer);\n\t\t\tisScrolled = true;\n\t\t}\n\n\t\tif (state.actionsType === ACTIONS_TYPES.CTA_BTN) {\n\t\t\tif (state.ctaBtn?.phoneNumber?.isChecked) {\n\t\t\t\tconst btnText = state.ctaBtn.phoneNumber.btnText?.trim();\n\t\t\t\tconst phoneNumber = state.ctaBtn.phoneNumber.phoneNumber;\n\n\t\t\t\tif (errors.ctaBtn && !btnText) {\n\t\t\t\t\terrors.ctaBtn.phoneNumber.btnText = REQUIRED_FIELD;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (\n\t\t\t\t\terrors.ctaBtn &&\n\t\t\t\t\tbtnText &&\n\t\t\t\t\tbtnText.length > QUICK_REPLY_BTN_TEXT_LIMIT\n\t\t\t\t) {\n\t\t\t\t\terrors.ctaBtn.phoneNumber.btnText = QUICK_REPLY_LEN_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (errors.ctaBtn && btnText && emojiRegex.test(btnText)) {\n\t\t\t\t\terrors.ctaBtn.phoneNumber.btnText = BUTTON_EMOJI_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t}\n\n\t\t\t\tif (errors.ctaBtn && !phoneNumber) {\n\t\t\t\t\terrors.ctaBtn.phoneNumber.link = REQUIRED_FIELD;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (errors.ctaBtn && phoneNumber && phoneNumber.length < 10) {\n\t\t\t\t\terrors.ctaBtn.phoneNumber.link = VALID_PHONE_NUMBER;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t}\n\t\t\t}\n\t\t\tif (state.ctaBtn?.websiteLinkBtn?.isChecked) {\n\t\t\t\tconst btnText = state.ctaBtn.websiteLinkBtn.btnText?.trim();\n\t\t\t\tconst customLink = state.ctaBtn.websiteLinkBtn.linkOpens?.trim();\n\t\t\t\tconst placeholder = state.ctaBtn.websiteLinkBtn.placeholder?.trim();\n\n\t\t\t\tif (errors.ctaBtn && !btnText) {\n\t\t\t\t\terrors.ctaBtn.websiteLink.btnText = REQUIRED_FIELD;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (\n\t\t\t\t\terrors.ctaBtn &&\n\t\t\t\t\tbtnText &&\n\t\t\t\t\tbtnText.length > QUICK_REPLY_BTN_TEXT_LIMIT\n\t\t\t\t) {\n\t\t\t\t\terrors.ctaBtn.websiteLink.btnText = QUICK_REPLY_LEN_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (errors.ctaBtn && btnText && emojiRegex.test(btnText)) {\n\t\t\t\t\terrors.ctaBtn.websiteLink.btnText = BUTTON_EMOJI_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t}\n\n\t\t\t\tif (errors.ctaBtn && !customLink && !placeholder) {\n\t\t\t\t\terrors.ctaBtn.websiteLink.link = REQUIRED_FIELD;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t}\n\t\t\t}\n\t\t} else if (state.actionsType === ACTIONS_TYPES.QUICK_REPLY) {\n\t\t\tconst quickReplyErrors = ['', '', ''];\n\t\t\tstate.quickReply.forEach((button, i) => {\n\t\t\t\tconst text = button.text?.trim();\n\t\t\t\tif (!text) {\n\t\t\t\t\tquickReplyErrors[i] = REQUIRED_FIELD;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (text.length > QUICK_REPLY_NAME_LEN_LIMIT) {\n\t\t\t\t\tquickReplyErrors[i] = QUICK_REPLY_LEN_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else if (emojiRegex.test(text)) {\n\t\t\t\t\tquickReplyErrors[i] = BUTTON_EMOJI_ERROR;\n\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t} else {\n\t\t\t\t\tconst buttons = [...state.quickReply];\n\t\t\t\t\tbuttons.splice(i, 1);\n\t\t\t\t\tconst exists = buttons.find(\n\t\t\t\t\t\t(el: QUICK_REPLY_BUTTON) => el.text === text,\n\t\t\t\t\t);\n\t\t\t\t\tif (exists) {\n\t\t\t\t\t\tquickReplyErrors[i] = QUICK_REPLY_NAME_ERROR;\n\t\t\t\t\t\tstatus = 'invalid';\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\n\t\t\terrors.quickReply = quickReplyErrors;\n\t\t}\n\n\t\tif (\n\t\t\tstate.actionsType === ACTIONS_TYPES.CTA_BTN \|\|\n\t\t\tstate.actionsType === ACTIONS_TYPES.QUICK_REPLY\n\t\t) {\n\t\t\tconst quickReplyErrors = errors.quickReply?.reduce(\n\t\t\t\t(qrbErrorAcc, currentError) => qrbErrorAcc \|\| !!currentError,\n\t\t\t\tfalse,\n\t\t\t);\n\t\t\tif (\n\t\t\t\t(!!errors?.ctaBtn?.websiteLink?.link \|\|\n\t\t\t\t\t!!errors.ctaBtn?.websiteLink?.btnText \|\|\n\t\t\t\t\t!!errors.ctaBtn?.phoneNumber?.link \|\|\n\t\t\t\t\t!!errors.ctaBtn?.phoneNumber?.btnText \|\|\n\t\t\t\t\t!!quickReplyErrors) &&\n\t\t\t\t!isScrolled\n\t\t\t) {\n\t\t\t\tscrollByElementId(CREATE_TEMPLATE_DOM_IDS.actionButtons);\n\t\t\t\tisScrolled = true;\n\t\t\t}\n\t\t}\n\n\t\treturn { status, errors };\n\t}\n\n\tprivate parseBodyComponent(\n\t\tdbFormattedTemplate: WhatsAppTemplate,\n\t\tisV2 = false,\n\t\tshowSampleValues?: boolean,\n\t\tpod?: string,\n\t) {\n\t\tconst bodyVariable: templateVariable[] = [];\n\t\tlet bodyText = '';\n\n\t\tconst bodyComponent = dbFormattedTemplate.components?.find(\n\t\t\t(component) => component.type === 'BODY',\n\t\t);\n\n\t\tif (bodyComponent) {\n\t\t\tbodyComponent.example?.body_text?.[0]?.forEach((sampleValue, i) => {\n\t\t\t\tlet bodyVarPlaceholder = dbFormattedTemplate.mapping?.body?.[i];\n\t\t\t\tconst originalVariable = bodyVarPlaceholder;\n\t\t\t\tconst editable = bodyVarPlaceholder && /\\(\\(/.test(bodyVarPlaceholder);\n\t\t\t\tconst matchedPlaceholderName = bodyVarPlaceholder?.match(\n\t\t\t\t\tplaceHolderNamePattern,\n\t\t\t\t);\n\n\t\t\t\tif (matchedPlaceholderName?.[2]) {\n\t\t\t\t\tbodyVarPlaceholder = matchedPlaceholderName?.[2];\n\t\t\t\t}\n\n\t\t\t\tconst isChatbotCustomText =\n\t\t\t\t\tpod === POD.CHATBOT &&\n\t\t\t\t\toriginalVariable &&\n\t\t\t\t\toriginalVariable?.startsWith('((') &&\n\t\t\t\t\toriginalVariable?.endsWith('))');\n\n\t\t\t\tbodyVariable.push({\n\t\t\t\t\tidx: i,\n\t\t\t\t\tvariableVal:\n\t\t\t\t\t\tshowSampleValues \|\| isChatbotCustomText\n\t\t\t\t\t\t\t? sampleValue\n\t\t\t\t\t\t\t: originalVariable,\n\t\t\t\t\teditable: !!editable,\n\t\t\t\t\teditableDefaultValues: editable ? undefined : sampleValue,\n\t\t\t\t\tvariableName: bodyVarPlaceholder ?? '',\n\t\t\t\t});\n\t\t\t});\n\n\t\t\tif (dbFormattedTemplate.htmlContentUrl) {\n\t\t\t\tbodyText = dbFormattedTemplate.htmlContentUrl;\n\t\t\t} else {\n\t\t\t\tbodyText = bodyComponent.text?.split(/\\{\\{[0-9]+\\}\\}/).length\n\t\t\t\t\t? bodyComponent.text\n\t\t\t\t\t\t\t?.split(/\\{\\{[0-9]+\\}\\}/)\n\t\t\t\t\t\t\t.map((t, i) => {\n\t\t\t\t\t\t\t\tif (bodyVariable?.[i]) {\n\t\t\t\t\t\t\t\t\tconst normalizeName = bodyVariable[i].variableName;\n\t\t\t\t\t\t\t\t\tconst tmp = isV2\n\t\t\t\t\t\t\t\t\t\t? `${t}{{${normalizeName}}}`\n\t\t\t\t\t\t\t\t\t\t: `${t} <span> </span><span style=\"color: ${COLORS.content.brand}; text-decoration: underline;\">{{${normalizeName}}}</span><span> </span>`;\n\n\t\t\t\t\t\t\t\t\treturn tmp;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\treturn t;\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t.join('')\n\t\t\t\t\t: '';\n\t\t\t}\n\t\t}\n\n\t\treturn { bodyVariable, bodyText };\n\t}\n\n\tprivate parseTitleComponent(\n\t\tdbFormattedTemplate: WhatsAppTemplate,\n\t\tisV2 = false,\n\t\tshowSampleValues?: boolean,\n\t) {\n\t\tconst titleVariable: templateVariable[] = [];\n\t\tlet titleText = '';\n\n\t\tconst bodyComponent = dbFormattedTemplate.components?.find(\n\t\t\t(component) => component.type === 'TITLE',\n\t\t);\n\n\t\tif (bodyComponent) {\n\t\t\tbodyComponent.example?.title_text?.[0]?.forEach((sampleValue, i) => {\n\t\t\t\tlet bodyVarPlaceholder = dbFormattedTemplate.mapping?.body?.[i];\n\t\t\t\tconst originalVariable = bodyVarPlaceholder;\n\t\t\t\tconst editable = bodyVarPlaceholder && /\\(\\(/.test(bodyVarPlaceholder);\n\t\t\t\tconst matchedPlaceholderName = bodyVarPlaceholder?.match(\n\t\t\t\t\tplaceHolderNamePattern,\n\t\t\t\t);\n\n\t\t\t\tif (matchedPlaceholderName?.[2]) {\n\t\t\t\t\tbodyVarPlaceholder = matchedPlaceholderName?.[2];\n\t\t\t\t}\n\n\t\t\t\ttitleVariable.push({\n\t\t\t\t\tidx: i,\n\t\t\t\t\tvariableVal: showSampleValues ? sampleValue : originalVariable,\n\t\t\t\t\teditable: !!editable,\n\t\t\t\t\teditableDefaultValues: editable ? undefined : sampleValue,\n\t\t\t\t\tvariableName: bodyVarPlaceholder ?? '',\n\t\t\t\t});\n\t\t\t});\n\n\t\t\tif (dbFormattedTemplate.htmlContentUrl) {\n\t\t\t\ttitleText = dbFormattedTemplate.htmlContentUrl;\n\t\t\t} else {\n\t\t\t\ttitleText = bodyComponent.text?.split(/\\{\\{[0-9]+\\}\\}/).length\n\t\t\t\t\t? bodyComponent.text\n\t\t\t\t\t\t\t?.split(/\\{\\{[0-9]+\\}\\}/)\n\t\t\t\t\t\t\t.map((t, i) => {\n\t\t\t\t\t\t\t\tif (titleVariable?.[i]) {\n\t\t\t\t\t\t\t\t\tconst normalizeName = titleVariable[i].variableName;\n\t\t\t\t\t\t\t\t\tconst tmp = isV2\n\t\t\t\t\t\t\t\t\t\t? `${t}{{${normalizeName}}}`\n\t\t\t\t\t\t\t\t\t\t: `${t} <span> </span><span style=\"color: ${COLORS.content.brand}; text-decoration: underline;\">{{${normalizeName}}}</span><span> </span>`;\n\n\t\t\t\t\t\t\t\t\treturn tmp;\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\treturn t;\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t\t.join('')\n\t\t\t\t\t: '';\n\t\t\t}\n\t\t}\n\n\t\treturn { titleText, titleVariables: titleVariable };\n\t}\n\n\tprivate parseFooterComponent(dbFormattedTemplate: WhatsAppTemplate) {\n\t\tconst footerComponent = dbFormattedTemplate.components?.find(\n\t\t\t(component) => component.type === 'FOOTER',\n\t\t);\n\n\t\treturn footerComponent?.text;\n\t}\n\n\tprivate parseButtonComponent(dbFormattedTemplate: WhatsAppTemplate) {\n\t\tconst res: {\n\t\t\tactionsType: ACTIONS_TYPES;\n\t\t\tquickReply: Array<QUICK_REPLY_BUTTON>;\n\t\t\tctaBtn: {\n\t\t\t\tphoneNumber?: {\n\t\t\t\t\tisChecked?: boolean;\n\t\t\t\t\tbtnText?: string;\n\t\t\t\t\tphoneNumber?: string;\n\t\t\t\t};\n\t\t\t\twebsiteLinkBtn?: {\n\t\t\t\t\tisChecked?: boolean;\n\t\t\t\t\tbtnText?: string;\n\t\t\t\t\tlinkOpens?: string;\n\t\t\t\t\tplaceholder?: string;\n\t\t\t\t};\n\t\t\t};\n\t\t\tallButtons: WhatsappPreviewButtonType[];\n\t\t} = {\n\t\t\tactionsType: ACTIONS_TYPES.NONE,\n\t\t\tquickReply: [],\n\t\t\tctaBtn: {\n\t\t\t\tphoneNumber: undefined,\n\t\t\t\twebsiteLinkBtn: undefined,\n\t\t\t},\n\t\t\tallButtons: [],\n\t\t};\n\n\t\tconst buttonComponent = dbFormattedTemplate.components?.find(\n\t\t\t(component) => component.type === 'BUTTONS',\n\t\t);\n\n\t\tif (buttonComponent && buttonComponent?.buttons?.length) {\n\t\t\tconst actionsType =\n\t\t\t\tbuttonComponent?.buttons?.[0].type === 'QUICK_REPLY'\n\t\t\t\t\t? ACTIONS_TYPES.QUICK_REPLY\n\t\t\t\t\t: ACTIONS_TYPES.CTA_BTN;\n\n\t\t\tres.actionsType = actionsType;\n\n\t\t\tif (actionsType === ACTIONS_TYPES.QUICK_REPLY) {\n\t\t\t\tconst btnTexts = (buttonComponent?.buttons?.map((btn) => btn) ??\n\t\t\t\t\t[]) as QUICK_REPLY_BUTTON[];\n\t\t\t\tres.quickReply = btnTexts;\n\t\t\t} else if (actionsType === ACTIONS_TYPES.CTA_BTN) {\n\t\t\t\tbuttonComponent?.buttons?.forEach((btn) => {\n\t\t\t\t\tif (btn.phone_number) {\n\t\t\t\t\t\tres.ctaBtn.phoneNumber = {\n\t\t\t\t\t\t\tisChecked: true,\n\t\t\t\t\t\t\tbtnText: btn.text,\n\t\t\t\t\t\t\tphoneNumber: btn.phone_number,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\n\t\t\t\t\tif (btn.url) {\n\t\t\t\t\t\tconst btnPlaceholder =\n\t\t\t\t\t\t\tdbFormattedTemplate?.mapping?.buttons?.[0] ?? undefined;\n\t\t\t\t\t\tlet customUrl = false;\n\n\t\t\t\t\t\tif (btnPlaceholder && editableVarPattern.test(btnPlaceholder)) {\n\t\t\t\t\t\t\tcustomUrl = true;\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tres.ctaBtn.websiteLinkBtn = {\n\t\t\t\t\t\t\tisChecked: true,\n\t\t\t\t\t\t\tbtnText: btn.text,\n\t\t\t\t\t\t\tlinkOpens: customUrl ? btn.example?.[0] : btn.url,\n\t\t\t\t\t\t\tplaceholder: customUrl ? undefined : btnPlaceholder,\n\t\t\t\t\t\t};\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t}\n\n\t\t\t// Parses buttons from template to a format preview can understand.\n\t\t\t// Since copy code does not come with a variable by default, we are adding placeholder from example.\n\t\t\tres.allButtons = buttonComponent.buttons?.map((button) => {\n\t\t\t\tif (button.type === 'COPY_CODE') {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...button,\n\t\t\t\t\t\tplaceholder: Array.isArray(button.example)\n\t\t\t\t\t\t\t? button.example[0]\n\t\t\t\t\t\t\t: button?.example \|\| '',\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t\treturn button;\n\t\t\t}) as WhatsappPreviewButtonType[];\n\t\t}\n\n\t\treturn res;\n\t}\n\n\t/\n\t Parses LTO component to a format preview can understand.\n\t * Points to Note -\n\t * 1. Takes the Copy Code from previously parsed buttons.\n\t * 2. LTO component does not have a dateTime expiry by default. Hence, while sending template to ContextMapper, send with a date or current Date and Time is picked here.\n\t /\n\tprivate parseLimitedTimeOfferComponent(\n\t\tdbFormattedTemplate: WhatsAppTemplate,\n\t\tallButtons: WhatsappPreviewButtonType[],\n\t) {\n\t\tconst limitedTimeOfferComponent: CreateTemplateType['limitedTimeOfferComponent'] =\n\t\t\t{\n\t\t\t\ttext: '',\n\t\t\t\tdateTime: '',\n\t\t\t\tcode: '',\n\t\t\t};\n\n\t\tdbFormattedTemplate.components.forEach((component) => {\n\t\t\tif (component.type === 'limited_time_offer') {\n\t\t\t\tlimitedTimeOfferComponent.text =\n\t\t\t\t\tcomponent.limited_time_offer?.text ?? '';\n\t\t\t\tconst dateTime = component.example?.limited_time_offer;\n\t\t\t\tif (dateTime && dateTime.startsWith('{{') && dateTime.endsWith('}}')) {\n\t\t\t\t\tlimitedTimeOfferComponent.dateTime = dateTime;\n\t\t\t\t} else {\n\t\t\t\t\tlimitedTimeOfferComponent.dateTime = format(\n\t\t\t\t\t\tdateTime ? new Date(dateTime) : new Date(),\n\t\t\t\t\t\t'MMM dd',\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tallButtons.forEach((button) => {\n\t\t\t\tif (button.type === 'COPY_CODE') {\n\t\t\t\t\tlimitedTimeOfferComponent.code = button.placeholder ?? '';\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\n\t\treturn limitedTimeOfferComponent;\n\t}\n\n\tprivate parseCallPermissionComponent(dbFormattedTemplate: WhatsAppTemplate): {\n\t\tshowCallPermissionCard: boolean;\n\t\tcallPermissionText?: string;\n\t} {\n\t\tconst callPermissionComponent = dbFormattedTemplate.components?.find(\n\t\t\t(component) => (component as any).type === 'CALL_PERMISSION_REQUEST',\n\t\t);\n\n\t\treturn {\n\t\t\tshowCallPermissionCard: Boolean(callPermissionComponent),\n\t\t\tcallPermissionText: (callPermissionComponent as any)?.text,\n\t\t};\n\t}\n\n\tasync parseUITemplateFromDBFormat(data: {\n\t\tdbFormattedTemplate: WhatsAppTemplate;\n\t\tisDuplicate?: boolean;\n\t\tshowSampleValues?: boolean;\n\t\tisV2?: boolean;\n\t\tpod?: string;\n\t}) {\n\t\tconst {\n\t\t\tdbFormattedTemplate,\n\t\t\tisDuplicate,\n\t\t\tisV2 = false,\n\t\t\tshowSampleValues,\n\t\t\tpod,\n\t\t} = data;\n\t\tconst {\n\t\t\theaderType,\n\t\t\theaderAssetLink,\n\t\t\theaderAssetName,\n\t\t\theaderText,\n\t\t\theaderVariables,\n\t\t} = await this.parseDataFromHeaderComponent(\n\t\t\tdbFormattedTemplate,\n\t\t\tundefined,\n\t\t\tpod,\n\t\t);\n\n\t\tconst { bodyText, bodyVariable: bodyVariables } =\n\t\t\tawait this.parseBodyComponent(\n\t\t\t\tdbFormattedTemplate,\n\t\t\t\tisV2,\n\t\t\t\tshowSampleValues,\n\t\t\t\tpod,\n\t\t\t);\n\t\tconst { titleText, titleVariables: titleVariables } =\n\t\t\tawait this.parseTitleComponent(\n\t\t\t\tdbFormattedTemplate,\n\t\t\t\tisV2,\n\t\t\t\tshowSampleValues,\n\t\t\t);\n\n\t\tconst { actionsType, quickReply, ctaBtn, allButtons } =\n\t\t\tawait this.parseButtonComponent(dbFormattedTemplate);\n\n\t\tconst limitedTimeOfferComponent = this.parseLimitedTimeOfferComponent(\n\t\t\tdbFormattedTemplate,\n\t\t\tallButtons,\n\t\t);\n\n\t\tconst { showCallPermissionCard, callPermissionText } =\n\t\t\tthis.parseCallPermissionComponent(dbFormattedTemplate);\n\n\t\tconst state: CreateTemplateType = {\n\t\t\tquickReply,\n\t\t\tctaBtn,\n\t\t\tallButtons,\n\t\t\tmeta: {\n\t\t\t\tname: isDuplicate\n\t\t\t\t\t? `${dbFormattedTemplate.label} Copy`\n\t\t\t\t\t: dbFormattedTemplate.label,\n\t\t\t\tcategory: dbFormattedTemplate.category?.toUpperCase(),\n\t\t\t\tsubCategory: dbFormattedTemplate.templateCategory,\n\t\t\t\tlanguage: dbFormattedTemplate.language,\n\t\t\t\ttemplateId: dbFormattedTemplate.templateId,\n\t\t\t},\n\t\t\terror: {\n\t\t\t\theader: undefined,\n\t\t\t\tbody: undefined,\n\t\t\t\tfooter: undefined,\n\t\t\t\tquickReply: undefined,\n\t\t\t\tmeta: undefined,\n\t\t\t\tctaBtn: undefined,\n\t\t\t},\n\n\t\t\tactionsType,\n\t\t\tfooterText: this.parseFooterComponent(dbFormattedTemplate),\n\t\t\t/* BODY TEXT /\n\t\t\tbodyVariables,\n\t\t\tbodyText,\n\n\t\t\t/* HEADER /\n\t\t\theaderType,\n\t\t\theaderAssetLink,\n\t\t\theaderAssetName,\n\t\t\theaderText,\n\t\t\theaderVariables,\n\t\t\talreadyAsADraft: dbFormattedTemplate.isDraft,\n\t\t\tmode: 'edit',\n\t\t\tinitialLoading: false,\n\t\t\t/ LIMITED TIME OFFER /\n\t\t\tlimitedTimeOfferComponent,\n\t\t\t/ Title for RCS /\n\t\t\ttitleText,\n\t\t\ttitleVariables,\n\t\t\t/ Call Permission */\n\t\t\tshowCallPermissionCard,\n\t\t\tcallPermissionText,\n\t\t};\n\n\t\tconst { errors } = this.validateState(state);\n\n\t\tstate.error = errors;\n\n\t\treturn state;\n\t}\n\n\tparseTemplateConfiguration(template: RCSTemplateType): RCSTemplateConfig {\n\t\tlet config: RCSTemplateConfig;\n\t\tconst templateConfig = template?.content \|\| ({} as RCSTemplateConfig);\n\t\tif (typeof templateConfig === 'string') {\n\t\t\ttry {\n\t\t\t\tconfig = JSON.parse(templateConfig) as RCSTemplateConfig;\n\t\t\t} catch (error) {\n\t\t\t\tconsole.error('Error parsing rcsTemplate component JSON:', error);\n\t\t\t\tconfig = { orientation: 'VERTICAL' } as RCSTemplateConfig;\n\t\t\t}\n\t\t} else {\n\t\t\tconfig = templateConfig;\n\t\t}\n\t\treturn {\n\t\t\t...config,\n\t\t\ttemplateType: template?.templateType as RCS_TEMPLATE_TYPE,\n\t\t};\n\t}\n}\n"],"names":["TemplateCreatorHelper","parseDataFromHeaderComponent","dbFormattedTemplate","showSampleValues","pod","res","headerType","HEADER_TYPES","NONE","headerVariables","headerComponent","_a","components","find","component","type","format","headerText","text","headerAssetLink","_c","_b","example","header_handle","sampleValue","_e","_d","header_text","headerVarPlaceholder","_g","_f","mapping","header","originalVariable","normalizedName","replace","editable","test","isChatbotCustomText","POD","CHATBOT","startsWith","endsWith","reduxHeaderVar","idx","variableVal","editableDefaultValues","undefined","variableName","_j","_h","length","_k","validateState","state","emojiRegex","status","errors","meta","ctaBtn","phoneNumber","btnText","link","websiteLink","quickReply","templateHelperUtils","TemplateHelperUtils","isScrolled","scrollByElementId","elementId","document","getElementById","scrollIntoView","behavior","block","name","trim","NAME_LEN_LIMIT","NAME_LEN_ERROR","specialCharPattern","NO_SPECIAL_CHAR","REQUIRED_FIELD","CREATE_TEMPLATE_DOM_IDS","TEXT","HEADER_TEXT_LEN_LIMIT","HEADER_LEN_ERROR","variableList","getTemplateVariablesFromState","ONE_VAR_ALLOWED","DOCUMENT","IMAGE","VIDEO","HEADER_ASSET_LINK_ERROR","bodyText","bodyTextRaw","BODY_TEXT_LEN_LIMIT","body","BODY_LEN_ERROR","footerText","footer","actionsType","ACTIONS_TYPES","CTA_BTN","isChecked","QUICK_REPLY_BTN_TEXT_LIMIT","QUICK_REPLY_LEN_ERROR","BUTTON_EMOJI_ERROR","VALID_PHONE_NUMBER","_l","websiteLinkBtn","_m","customLink","_o","linkOpens","placeholder","_p","QUICK_REPLY","quickReplyErrors","forEach","button","i","QUICK_REPLY_NAME_LEN_LIMIT","buttons","splice","el","QUICK_REPLY_NAME_ERROR","_q","reduce","qrbErrorAcc","currentError","_s","_u","_t","_w","_v","_y","_x","actionButtons","parseBodyComponent","isV2","arguments","bodyVariable","bodyComponent","body_text","bodyVarPlaceholder","matchedPlaceholderName","match","placeHolderNamePattern","push","htmlContentUrl","split","map","t","normalizeName","COLORS","content","brand","join","parseTitleComponent","titleVariable","titleText","title_text","titleVariables","parseFooterComponent","footerComponent","parseButtonComponent","allButtons","buttonComponent","btnTexts","btn","phone_number","url","btnPlaceholder","customUrl","editableVarPattern","Object","assign","Array","isArray","parseLimitedTimeOfferComponent","limitedTimeOfferComponent","dateTime","code","limited_time_offer","Date","parseCallPermissionComponent","callPermissionComponent","showCallPermissionCard","Boolean","callPermissionText","parseUITemplateFromDBFormat","data","isDuplicate","headerAssetName","this","bodyVariables","label","category","toUpperCase","subCategory","templateCategory","language","templateId","error","alreadyAsADraft","isDraft","mode","initialLoading","parseTemplateConfiguration","template","config","templateConfig","JSON","parse","console","orientation","templateType"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-import{BaseWhatsappContentLangHelper as e}from"../../../helpers/BaseWhatsappContentLang.helper.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import{variablePattern as r}from"../constants/regexPatterns.js";const l=new e;class a{format(e,a){var p;if(!e)return"";const o=new RegExp(r,"g"),t=e.match(o),n=null!==(p=null==a?void 0:a.map((({placeholder:e})=>e)))&&void 0!==p?p:[],c=e.split(r).map(((e,r)=>{var l;const p=null==t?void 0:t[r];if(p){const r=p.replace("{{","").replace("}}","").replace("[[","").replace("]]","").replace("((","").replace("))",""),o=n.findIndex((e=>e.replace("{{","").replace("}}","").replace("[[","").replace("]]","").replace("((","").replace("))","")===r));return o>-1?e+'<code style="color: #731DCF">'+(null===(l=null==a?void 0:a[o])||void 0===l?void 0:l.value)+"</code>":e+p}return e})).join("");return l.getHTML(c)}}export{a as VariableEditorHelper};
+import{BaseWhatsappContentLangHelper as e}from"../../../helpers/BaseWhatsappContentLang.helper.js";import"../../curtain/CurtainHelper.js";import"../../variable-picker-v3/model.js";import{variablePattern as r}from"../constants/regexPatterns.js";const l=new e;class a{format(e,a){var t;if(!e)return"";const p=new RegExp(r,"g"),n=e.match(p),o=null!==(t=null==a?void 0:a.map((e=>{let{placeholder:r}=e;return r})))&&void 0!==t?t:[],c=e.split(r).map(((e,r)=>{var l;const t=null==n?void 0:n[r];if(t){const r=t.replace("{{","").replace("}}","").replace("[[","").replace("]]","").replace("((","").replace("))",""),p=o.findIndex((e=>e.replace("{{","").replace("}}","").replace("[[","").replace("]]","").replace("((","").replace("))","")===r));return p>-1?e+'<code style="color: #731DCF">'+(null===(l=null==a?void 0:a[p])||void 0===l?void 0:l.value)+"</code>":e+t}return e})).join("");return l.getHTML(c)}}export{a as VariableEditorHelper};
 //# sourceMappingURL=VariableEditorHelper.js.map