@bikdotai/bik-component-library 0.0.817-beta.7 → 0.0.817-beta.9

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

@@ -1,8 +1,8 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-dev-runtime"),W=require("../../../assets/icons/info.svg.js"),a=require("react"),S=require("styled-components"),w=require("../../checkBox/CheckBox.js"),h=require("../../input/Input.js"),T=require("../../tooltips/Tooltip.js"),s=require("../../TypographyStyle.js"),m=require("../../../constants/Theme.js"),q=require("../../../assets/icons/plus.svg.js"),R=require("../context/templateModalContext.js"),B=require("./VariableConnector.js"),O=r=>r&&typeof r=="object"&&"default"in r?r:{default:r},k=O(S),x=k.default.div`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-dev-runtime"),U=require("../../../assets/icons/info.svg.js"),o=require("react"),S=require("styled-components"),T=require("../../checkBox/CheckBox.js"),x=require("../../input/Input.js"),q=require("../../tooltips/Tooltip.js"),i=require("../../TypographyStyle.js"),m=require("../../../constants/Theme.js"),R=require("../../../assets/icons/plus.svg.js"),B=require("../context/templateModalContext.js"),O=require("./VariableConnector.js"),L=a=>a&&typeof a=="object"&&"default"in a?a:{default:a},y=L(S),N=y.default.div`
 	display: flex;
 	flex-direction: column;
 	height: 100%;
-`,L=({onFocus:r,showVariableModal:y,discountCode:l,setDiscountCode:t})=>{const{originalVariableList:c,disableEditVariable:N,setVariableCallback:V,setShowVariablePicker:E}=R.useTemplateModalContext(),[D,p]=a.useState(!1),[C,u]=a.useState(!1),[f,g]=a.useState(""),[i,d]=a.useState(!1),b=a.useRef(),j=a.useRef();a.useEffect(()=>{t&&t(l+f)},[f]);const P=()=>c.some(n=>n.updatedValue.replace("{{","").replace("}}","")==="checkout.checkoutUrl");a.useEffect(()=>{P()?(p(!0),l&&d(!0)):(p(!1),d?.(!1),t?.(""))},[c]);const U=n=>{g(n.actualValue)};return e.jsxDEV(x,{children:[e.jsxDEV("div",{style:{padding:8},children:[e.jsxDEV("div",{style:{display:"flex",gap:8,alignItems:"center",marginBottom:4},children:[e.jsxDEV(s.TitleRegular,{style:{color:m.COLORS.content.primary},children:"Edit variables and links"},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:95,columnNumber:6},void 0),e.jsxDEV(T.Tooltip,{body:"Variables are placeholder texts which can either be filled by data, eg: customer name or can have any custom text within them",children:e.jsxDEV("div",{style:{display:"flex"},children:e.jsxDEV(W.default,{width:20,height:20,color:m.COLORS.content.placeholder},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:104,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:103,columnNumber:7},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:98,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:87,columnNumber:5},void 0),e.jsxDEV(s.BodySecondary,{style:{color:m.COLORS.content.secondary},children:"You can view variables and links on the left underlined in purple colour."},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:112,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:86,columnNumber:4},void 0),c?.map((n,o)=>!n.isEditableVariable||N?e.jsxDEV("div",{style:{margin:"16px 8px"},children:[e.jsxDEV(s.BodySecondary,{style:{color:m.COLORS.content.primary},children:["Locked variable ",o+1]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:122,columnNumber:8},void 0),e.jsxDEV(h.Input,{state:"disabled",placeholder:n.variableName,onChangeText:()=>{}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:125,columnNumber:8},void 0)]},o,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:121,columnNumber:7},void 0):e.jsxDEV("div",{style:{marginTop:16},children:e.jsxDEV(B.default,{index:o,variable:n,onFocus:()=>r?.(o),showVariableModal:y,setShowDiscountCheckBox:p},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:139,columnNumber:7},void 0)},o,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:138,columnNumber:6},void 0)),(D||l)&&e.jsxDEV("div",{style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8},children:[e.jsxDEV(w.CheckBox,{isChecked:i,onValueChange:()=>{i&&t&&t(""),d(!i)}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:158,columnNumber:6},void 0),e.jsxDEV(s.TitleSmall,{style:{marginLeft:8},children:"Add discount code"},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:167,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:150,columnNumber:5},void 0),i&&e.jsxDEV("div",{ref:b,style:{margin:10},children:[e.jsxDEV(h.Input,{placeholder:"Enter your discount code",onChangeText:n=>{t&&t(n)},value:l,onFocus:()=>{u(!0)},onBlur:n=>{n.relatedTarget?.id==="addVar"?(b.current&&b.current.focus(),u(!0)):u(!1)},noErrorHint:!0,validate:n=>[!0,""]},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:172,columnNumber:6},void 0),C&&e.jsxDEV(v,{ref:j,id:"addVar",onClick:n=>{n.stopPropagation(),V(()=>U),E(!0)},children:e.jsxDEV("div",{className:"add",children:[e.jsxDEV(q.default,{width:20,height:20,color:"white"},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:209,columnNumber:9},void 0),e.jsxDEV("div",{className:"variable",children:"Add variable"},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:210,columnNumber:9},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:208,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:199,columnNumber:7},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:171,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:85,columnNumber:3},void 0)},v=k.default.button`
+`,A=({onFocus:a,showVariableModal:h,discountCode:t,setDiscountCode:r})=>{const{originalVariableList:c,disableEditVariable:E,setVariableCallback:D,setShowVariablePicker:v}=B.useTemplateModalContext(),[k,d]=o.useState(!1),[w,u]=o.useState(!1),[f,C]=o.useState(""),[s,p]=o.useState(!1),b=o.useRef(),g=o.useRef();o.useEffect(()=>{r&&r(t+f)},[f]);const j=()=>c.some(n=>n.updatedValue.replace("{{","").replace("}}","")==="checkout.checkoutUrl");o.useEffect(()=>{j()?(d(!0),t&&p(!0)):(d(!1),p?.(!1),r?.(""))},[c]);const P=n=>{C(n.actualValue)};return e.jsxDEV(N,{children:[e.jsxDEV("div",{style:{padding:8},children:[e.jsxDEV("div",{style:{display:"flex",gap:8,alignItems:"center",marginBottom:4},children:[e.jsxDEV(i.TitleRegular,{style:{color:m.COLORS.content.primary},children:"Edit variables and links"},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:95,columnNumber:6},void 0),e.jsxDEV(q.Tooltip,{body:"Variables are placeholder texts which can either be filled by data, eg: customer name or can have any custom text within them",children:e.jsxDEV("div",{style:{display:"flex"},children:e.jsxDEV(U.default,{width:20,height:20,color:m.COLORS.content.placeholder},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:104,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:103,columnNumber:7},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:98,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:87,columnNumber:5},void 0),e.jsxDEV(i.BodySecondary,{style:{color:m.COLORS.content.secondary},children:"You can view variables and links on the left underlined in purple colour."},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:112,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:86,columnNumber:4},void 0),c?.map((n,l)=>!n.isEditableVariable||E?e.jsxDEV("div",{style:{margin:"16px 8px"},children:[e.jsxDEV(i.BodySecondary,{style:{color:m.COLORS.content.primary},children:["Locked variable ",l+1]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:122,columnNumber:8},void 0),e.jsxDEV(x.Input,{state:"disabled",placeholder:n.variableName,onChangeText:()=>{}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:125,columnNumber:8},void 0)]},l,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:121,columnNumber:7},void 0):e.jsxDEV("div",{style:{marginTop:16},children:e.jsxDEV(O.default,{index:l,variable:n,onFocus:()=>a?.(l),showVariableModal:h,setShowDiscountCheckBox:d},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:139,columnNumber:7},void 0)},l,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:138,columnNumber:6},void 0)),(k||t)&&e.jsxDEV("div",{style:{display:"flex",flexDirection:"row",marginLeft:10,marginTop:8},children:[e.jsxDEV(T.CheckBox,{isChecked:s,onValueChange:()=>{s&&r&&r(""),p(!s)}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:158,columnNumber:6},void 0),e.jsxDEV(i.TitleSmall,{style:{marginLeft:8},children:"Add discount code"},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:167,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:150,columnNumber:5},void 0),s&&e.jsxDEV("div",{ref:b,style:{margin:10},children:[e.jsxDEV(x.Input,{placeholder:"Enter your discount code",onChangeText:n=>{r&&r(n)},value:t,onFocus:()=>{u(!0)},onBlur:n=>{n.relatedTarget?.id==="addVar"?(b.current&&b.current.focus(),u(!0)):u(!1)},noErrorHint:!0,validate:n=>[!0,""]},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:172,columnNumber:6},void 0),w&&e.jsxDEV(V,{ref:g,id:"addVar",onClick:n=>{n.stopPropagation(),D(()=>P),v(!0)},children:e.jsxDEV("div",{className:"add",children:[e.jsxDEV(R.default,{width:20,height:20,color:"white"},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:209,columnNumber:9},void 0),e.jsxDEV("div",{className:"variable",children:"Add variable"},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:210,columnNumber:9},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:208,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:199,columnNumber:7},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:171,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx",lineNumber:85,columnNumber:3},void 0)},V=y.default.button`
 	padding: 2px 8px;
 	cursor: pointer;
 	color: white;
@@ -25,5 +25,5 @@
 		align-items: center;
 		gap: 5px;
 	}
-`;exports.AddVariableStyled=v;exports.Container=x;exports.default=L;
+`;exports.AddVariableStyled=V;exports.Container=N;exports.default=A;
 //# sourceMappingURL=VariableConnectorsPanel.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"VariableConnectorsPanel.js","sources":["../../../../../src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx"],"sourcesContent":["import InfoIcon from '@src/assets/icons/info.svg';\nimport { useEffect, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { CheckBox } from '@src/components/checkBox/CheckBox';\nimport { Input } from '@src/components/input/Input';\nimport { CUSTOM_VARIABLE } from '@src/components/template-preview/models/TemplateMeta';\nimport { Tooltip } from '@src/components/tooltips/Tooltip';\nimport {\n\tBodySecondary,\n\tTitleRegular,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport PlusIcon from '../../../assets/icons/plus.svg';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport VariableConnector from './VariableConnector';\n\nexport const Container = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n`;\n\nexport interface VariableConnectorsProps {\n\tonFocus?: (variableIndex: number) => void;\n\tshowVariableModal?: boolean;\n\tdiscountCode?: string;\n\tsetDiscountCode?: (code: string) => void;\n}\n\nconst VariableConnectors = ({\n\tonFocus,\n\tshowVariableModal,\n\tdiscountCode,\n\tsetDiscountCode,\n}: VariableConnectorsProps) => {\n\tconst {\n\t\toriginalVariableList,\n\t\tdisableEditVariable,\n\t\tsetVariableCallback,\n\t\tsetShowVariablePicker,\n\t} = useTemplateModalContext();\n\tconst [showDiscountCheckBox, setShowDiscountCheckBox] =\n\t\tuseState<boolean>(false);\n\tconst [showAddVariable, setShowAddVariable] = useState<boolean>(false);\n\tconst [variableValue, setVariableValue] = useState<string>('');\n\tconst [isChecked, setIsChecked] = useState<boolean>(false);\n\n\tconst superRef = useRef<any>();\n\tconst varRef = useRef<any>();\n\n\tuseEffect(() => {\n\t\tif (setDiscountCode) {\n\t\t\tsetDiscountCode(discountCode + variableValue);\n\t\t}\n\t}, [variableValue]);\n\n\tconst shouldShowDiscountBox = () => {\n\t\treturn (originalVariableList as CUSTOM_VARIABLE[]).some((variable) => {\n\t\t\treturn (\n\t\t\t\tvariable.updatedValue.replace('{{', '').replace('}}', '') ===\n\t\t\t\t'checkout.checkoutUrl'\n\t\t\t);\n\t\t});\n\t};\n\n\tuseEffect(() => {\n\t\tif (shouldShowDiscountBox()) {\n\t\t\tsetShowDiscountCheckBox(true);\n\t\t\tif (discountCode) {\n\t\t\t\tsetIsChecked(true);\n\t\t\t}\n\t\t} else {\n\t\t\tsetShowDiscountCheckBox(false);\n\t\t\tsetIsChecked?.(false);\n\t\t\tsetDiscountCode?.('');\n\t\t}\n\t}, [originalVariableList]);\n\n\tconst handleVariableCallback = (variable: any) => {\n\t\tsetVariableValue(variable.actualValue);\n\t};\n\n\treturn (\n\t\t<Container>\n\t\t\t<div style={{ padding: 8 }}>\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\tgap: 8,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tmarginBottom: 4,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<TitleRegular style={{ color: COLORS.content.primary }}>\n\t\t\t\t\t\tEdit variables and links\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t<Tooltip\n\t\t\t\t\t\tbody={\n\t\t\t\t\t\t\t'Variables are placeholder texts which can either be filled by data, eg: customer name or can have any custom text within them'\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div style={{ display: 'flex' }}>\n\t\t\t\t\t\t\t<InfoIcon\n\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t</div>\n\t\t\t\t<BodySecondary style={{ color: COLORS.content.secondary }}>\n\t\t\t\t\tYou can view variables and links on the left underlined in purple\n\t\t\t\t\tcolour.\n\t\t\t\t</BodySecondary>\n\t\t\t</div>\n\n\t\t\t{(originalVariableList as CUSTOM_VARIABLE[])?.map((variable, i) => {\n\t\t\t\tif (!variable.isEditableVariable || disableEditVariable) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div style={{ margin: `16px 8px` }} key={i}>\n\t\t\t\t\t\t\t<BodySecondary style={{ color: COLORS.content.primary }}>\n\t\t\t\t\t\t\t\tLocked variable {i + 1}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\tstate={'disabled'}\n\t\t\t\t\t\t\t\t// disableMarginBottom\n\t\t\t\t\t\t\t\tplaceholder={variable.variableName}\n\t\t\t\t\t\t\t\tonChangeText={() => {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}} // containerStyle={styles.inputStyle}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn (\n\t\t\t\t\t<div style={{ marginTop: 16 }} key={i}>\n\t\t\t\t\t\t<VariableConnector\n\t\t\t\t\t\t\tindex={i}\n\t\t\t\t\t\t\tvariable={variable}\n\t\t\t\t\t\t\tonFocus={() => onFocus?.(i)}\n\t\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\t\tsetShowDiscountCheckBox={setShowDiscountCheckBox}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t})}\n\t\t\t{(showDiscountCheckBox || discountCode) && (\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\tmarginLeft: 10,\n\t\t\t\t\t\tmarginTop: 8,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<CheckBox\n\t\t\t\t\t\tisChecked={isChecked}\n\t\t\t\t\t\tonValueChange={() => {\n\t\t\t\t\t\t\tif (isChecked && setDiscountCode) {\n\t\t\t\t\t\t\t\tsetDiscountCode('');\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsetIsChecked(!isChecked);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t\t<TitleSmall style={{ marginLeft: 8 }}>Add discount code</TitleSmall>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{isChecked && (\n\t\t\t\t<div ref={superRef} style={{ margin: 10 }}>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tplaceholder={'Enter your discount code'}\n\t\t\t\t\t\tonChangeText={(value) => {\n\t\t\t\t\t\t\tif (setDiscountCode) {\n\t\t\t\t\t\t\t\tsetDiscountCode(value);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tvalue={discountCode}\n\t\t\t\t\t\tonFocus={() => {\n\t\t\t\t\t\t\tsetShowAddVariable(true);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonBlur={(e) => {\n\t\t\t\t\t\t\tif (e.relatedTarget?.id === 'addVar') {\n\t\t\t\t\t\t\t\tif (superRef.current) {\n\t\t\t\t\t\t\t\t\t(superRef.current as any).focus();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tsetShowAddVariable(true);\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tsetShowAddVariable(false);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tnoErrorHint\n\t\t\t\t\t\tvalidate={(_) => {\n\t\t\t\t\t\t\treturn [true, ''];\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t\t{showAddVariable && (\n\t\t\t\t\t\t<AddVariableStyled\n\t\t\t\t\t\t\tref={varRef}\n\t\t\t\t\t\t\tid={'addVar'}\n\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\t\tsetVariableCallback(() => handleVariableCallback);\n\t\t\t\t\t\t\t\tsetShowVariablePicker(true);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"add\">\n\t\t\t\t\t\t\t\t<PlusIcon width={20} height={20} color=\"white\" />\n\t\t\t\t\t\t\t\t<div className=\"variable\">Add variable</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</AddVariableStyled>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</Container>\n\t);\n};\n\nexport default VariableConnectors;\n\nexport const AddVariableStyled = styled.button`\n\tpadding: 2px 8px;\n\tcursor: pointer;\n\tcolor: white;\n\tbackground-color: black;\n\twidth: fit-content;\n\tfloat: right;\n\tmargin-top: 0px;\n\tfont-family: Inter;\n\tfont-style: normal;\n\tfont-weight: 600;\n\tfont-size: 14px;\n\tline-height: 20px;\n\talign-self: flex-end;\n\tborder-radius: 4px;\n\tborder: 1px solid #ccc;\n\tmargin-right: 1px;\n\n\t.add {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 5px;\n\t}\n`;\n"],"names":["Container","styled","VariableConnectors","onFocus","showVariableModal","discountCode","setDiscountCode","originalVariableList","disableEditVariable","setVariableCallback","setShowVariablePicker","useTemplateModalContext","showDiscountCheckBox","setShowDiscountCheckBox","useState","showAddVariable","setShowAddVariable","variableValue","setVariableValue","isChecked","setIsChecked","superRef","useRef","varRef","useEffect","shouldShowDiscountBox","variable","handleVariableCallback","jsxDEV","TitleRegular","COLORS","this","Tooltip","InfoIcon","BodySecondary","i","Input","VariableConnector","CheckBox","TitleSmall","value","e","_","AddVariableStyled","PlusIcon"],"mappings":"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"}
+{"version":3,"file":"VariableConnectorsPanel.js","sources":["../../../../../src/components/template-context-mapper/modalElements/VariableConnectorsPanel.tsx"],"sourcesContent":["import InfoIcon from '@src/assets/icons/info.svg';\nimport { useEffect, useRef, useState } from 'react';\nimport styled from 'styled-components';\nimport { CheckBox } from '@src/components/checkBox/CheckBox';\nimport { Input } from '@src/components/input/Input';\nimport { CUSTOM_VARIABLE } from '@src/components/template-preview/models/TemplateMeta';\nimport { Tooltip } from '@src/components/tooltips/Tooltip';\nimport {\n\tBodySecondary,\n\tTitleRegular,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport PlusIcon from '../../../assets/icons/plus.svg';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport VariableConnector from './VariableConnector';\n\nexport const Container = styled.div`\n\tdisplay: flex;\n\tflex-direction: column;\n\theight: 100%;\n`;\n\nexport interface VariableConnectorsProps {\n\tonFocus?: (variableIndex: number) => void;\n\tshowVariableModal?: boolean;\n\tdiscountCode?: string;\n\tsetDiscountCode?: (code: string) => void;\n}\n\nconst VariableConnectors = ({\n\tonFocus,\n\tshowVariableModal,\n\tdiscountCode,\n\tsetDiscountCode,\n}: VariableConnectorsProps) => {\n\tconst {\n\t\toriginalVariableList,\n\t\tdisableEditVariable,\n\t\tsetVariableCallback,\n\t\tsetShowVariablePicker,\n\t} = useTemplateModalContext();\n\tconst [showDiscountCheckBox, setShowDiscountCheckBox] =\n\t\tuseState<boolean>(false);\n\tconst [showAddVariable, setShowAddVariable] = useState<boolean>(false);\n\tconst [variableValue, setVariableValue] = useState<string>('');\n\tconst [isChecked, setIsChecked] = useState<boolean>(false);\n\n\tconst superRef = useRef<any>();\n\tconst varRef = useRef<any>();\n\n\tuseEffect(() => {\n\t\tif (setDiscountCode) {\n\t\t\tsetDiscountCode(discountCode + variableValue);\n\t\t}\n\t}, [variableValue]);\n\n\tconst shouldShowDiscountBox = () => {\n\t\treturn (originalVariableList as CUSTOM_VARIABLE[]).some((variable) => {\n\t\t\treturn (\n\t\t\t\tvariable.updatedValue.replace('{{', '').replace('}}', '') ===\n\t\t\t\t'checkout.checkoutUrl'\n\t\t\t);\n\t\t});\n\t};\n\n\tuseEffect(() => {\n\t\tif (shouldShowDiscountBox()) {\n\t\t\tsetShowDiscountCheckBox(true);\n\t\t\tif (discountCode) {\n\t\t\t\tsetIsChecked(true);\n\t\t\t}\n\t\t} else {\n\t\t\tsetShowDiscountCheckBox(false);\n\t\t\tsetIsChecked?.(false);\n\t\t\tsetDiscountCode?.('');\n\t\t}\n\t}, [originalVariableList]);\n\n\tconst handleVariableCallback = (variable: any) => {\n\t\tsetVariableValue(variable.actualValue);\n\t};\n\n\treturn (\n\t\t<Container>\n\t\t\t<div style={{ padding: 8 }}>\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\tgap: 8,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tmarginBottom: 4,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<TitleRegular style={{ color: COLORS.content.primary }}>\n\t\t\t\t\t\tEdit variables and links\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t<Tooltip\n\t\t\t\t\t\tbody={\n\t\t\t\t\t\t\t'Variables are placeholder texts which can either be filled by data, eg: customer name or can have any custom text within them'\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div style={{ display: 'flex' }}>\n\t\t\t\t\t\t\t<InfoIcon\n\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t</div>\n\t\t\t\t<BodySecondary style={{ color: COLORS.content.secondary }}>\n\t\t\t\t\tYou can view variables and links on the left underlined in purple\n\t\t\t\t\tcolour.\n\t\t\t\t</BodySecondary>\n\t\t\t</div>\n\n\t\t\t{(originalVariableList as CUSTOM_VARIABLE[])?.map((variable, i) => {\n\t\t\t\tif (!variable.isEditableVariable || disableEditVariable) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div style={{ margin: `16px 8px` }} key={i}>\n\t\t\t\t\t\t\t<BodySecondary style={{ color: COLORS.content.primary }}>\n\t\t\t\t\t\t\t\tLocked variable {i + 1}\n\t\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\t\tstate={'disabled'}\n\t\t\t\t\t\t\t\t// disableMarginBottom\n\t\t\t\t\t\t\t\tplaceholder={variable.variableName}\n\t\t\t\t\t\t\t\tonChangeText={() => {\n\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t}} // containerStyle={styles.inputStyle}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn (\n\t\t\t\t\t<div style={{ marginTop: 16 }} key={i}>\n\t\t\t\t\t\t<VariableConnector\n\t\t\t\t\t\t\tindex={i}\n\t\t\t\t\t\t\tvariable={variable}\n\t\t\t\t\t\t\tonFocus={() => onFocus?.(i)}\n\t\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\t\tsetShowDiscountCheckBox={setShowDiscountCheckBox}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t})}\n\t\t\t{(showDiscountCheckBox || discountCode) && (\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\tmarginLeft: 10,\n\t\t\t\t\t\tmarginTop: 8,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<CheckBox\n\t\t\t\t\t\tisChecked={isChecked}\n\t\t\t\t\t\tonValueChange={() => {\n\t\t\t\t\t\t\tif (isChecked && setDiscountCode) {\n\t\t\t\t\t\t\t\tsetDiscountCode('');\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsetIsChecked(!isChecked);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t\t<TitleSmall style={{ marginLeft: 8 }}>Add discount code</TitleSmall>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{isChecked && (\n\t\t\t\t<div ref={superRef} style={{ margin: 10 }}>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tplaceholder={'Enter your discount code'}\n\t\t\t\t\t\tonChangeText={(value) => {\n\t\t\t\t\t\t\tif (setDiscountCode) {\n\t\t\t\t\t\t\t\tsetDiscountCode(value);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tvalue={discountCode}\n\t\t\t\t\t\tonFocus={() => {\n\t\t\t\t\t\t\tsetShowAddVariable(true);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonBlur={(e) => {\n\t\t\t\t\t\t\tif (e.relatedTarget?.id === 'addVar') {\n\t\t\t\t\t\t\t\tif (superRef.current) {\n\t\t\t\t\t\t\t\t\t(superRef.current as any).focus();\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tsetShowAddVariable(true);\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tsetShowAddVariable(false);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tnoErrorHint\n\t\t\t\t\t\tvalidate={(_) => {\n\t\t\t\t\t\t\treturn [true, ''];\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t\t{showAddVariable && (\n\t\t\t\t\t\t<AddVariableStyled\n\t\t\t\t\t\t\tref={varRef}\n\t\t\t\t\t\t\tid={'addVar'}\n\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\t\tsetVariableCallback(() => handleVariableCallback);\n\t\t\t\t\t\t\t\tsetShowVariablePicker(true);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"add\">\n\t\t\t\t\t\t\t\t<PlusIcon width={20} height={20} color=\"white\" />\n\t\t\t\t\t\t\t\t<div className=\"variable\">Add variable</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</AddVariableStyled>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</Container>\n\t);\n};\n\nexport default VariableConnectors;\n\nexport const AddVariableStyled = styled.button`\n\tpadding: 2px 8px;\n\tcursor: pointer;\n\tcolor: white;\n\tbackground-color: black;\n\twidth: fit-content;\n\tfloat: right;\n\tmargin-top: 0px;\n\tfont-family: Inter;\n\tfont-style: normal;\n\tfont-weight: 600;\n\tfont-size: 14px;\n\tline-height: 20px;\n\talign-self: flex-end;\n\tborder-radius: 4px;\n\tborder: 1px solid #ccc;\n\tmargin-right: 1px;\n\n\t.add {\n\t\tdisplay: flex;\n\t\talign-items: center;\n\t\tgap: 5px;\n\t}\n`;\n"],"names":["Container","styled","VariableConnectors","onFocus","showVariableModal","discountCode","setDiscountCode","originalVariableList","disableEditVariable","setVariableCallback","setShowVariablePicker","useTemplateModalContext","showDiscountCheckBox","setShowDiscountCheckBox","useState","showAddVariable","setShowAddVariable","variableValue","setVariableValue","isChecked","setIsChecked","superRef","useRef","varRef","useEffect","shouldShowDiscountBox","variable","handleVariableCallback","jsxDEV","TitleRegular","COLORS","this","Tooltip","InfoIcon","BodySecondary","i","Input","VariableConnector","CheckBox","TitleSmall","value","e","_","AddVariableStyled","PlusIcon"],"mappings":"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"}

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

@@ -1,10 +1,10 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-dev-runtime"),s=require("../../../assets/icons/info.svg.js"),m=require("styled-components"),d=require("../../tooltips/Tooltip.js"),n=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},i=c(m),p=i.default(n.BodySecondary)`
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-dev-runtime"),d=require("../../../assets/icons/info.svg.js"),s=require("styled-components"),m=require("../../tooltips/Tooltip.js"),r=require("../../TypographyStyle.js"),n=require("../../../constants/Theme.js"),c=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},a=c(s),p=a.default(r.BodySecondary)`
 	line-height: 1.5 !important;
-`,u=i.default.div`
+`,u=a.default.div`
 	padding-top: 24px;
 	padding-left: 10px;
 	padding-right: 10px;
 	margin-bottom: 8px;
 	line-height: normal;
-`,b=({headerText:e,subText:a,toolTipInfo:o,containerStyle:l})=>t.jsxDEV(u,{style:{...l},children:[t.jsxDEV("div",{style:{display:"flex",gap:8},children:[t.jsxDEV(n.TitleRegular,{style:{color:r.COLORS.content.primary},children:e},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:44,columnNumber:5},void 0),o&&t.jsxDEV(d.Tooltip,{body:o,children:t.jsxDEV("div",{children:t.jsxDEV(s.default,{width:20,height:20,color:r.COLORS.content.placeholder},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:50,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:49,columnNumber:7},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:48,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:38,columnNumber:4},void 0),t.jsxDEV(p,{style:{color:r.COLORS.content.secondary,marginBottom:0,lineHeight:20,display:"block"},children:a},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:59,columnNumber:4},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:33,columnNumber:3},void 0);exports.default=b;
+`,b=({headerText:e,subText:l,toolTipInfo:t,containerStyle:i})=>o.jsxDEV(u,{style:{...i},children:[o.jsxDEV("div",{style:{display:"flex",gap:8},children:[o.jsxDEV(r.TitleRegular,{style:{color:n.COLORS.content.primary},children:e},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:44,columnNumber:5},void 0),t&&o.jsxDEV(m.Tooltip,{body:t,children:o.jsxDEV("div",{children:o.jsxDEV(d.default,{width:20,height:20,color:n.COLORS.content.placeholder},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:50,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:49,columnNumber:7},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:48,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:38,columnNumber:4},void 0),o.jsxDEV(p,{style:{color:n.COLORS.content.secondary,marginBottom:0,lineHeight:20,display:"block"},children:l},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:59,columnNumber:4},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx",lineNumber:33,columnNumber:3},void 0);exports.default=b;
 //# sourceMappingURL=VariableEditorHeader.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"VariableEditorHeader.js","sources":["../../../../../src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx"],"sourcesContent":["import InfoIcon from '@src/assets/icons/info.svg';\nimport { type CSSProperties } from 'react';\nimport styled from 'styled-components';\nimport { Tooltip } from '@src/components/tooltips/Tooltip';\nimport { BodySecondary, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nconst SubTitle = styled(BodySecondary)`\n\tline-height: 1.5 !important;\n`;\n\nconst VariableEditorHeaderContainer = styled.div`\n\tpadding-top: 24px;\n\tpadding-left: 10px;\n\tpadding-right: 10px;\n\tmargin-bottom: 8px;\n\tline-height: normal;\n`;\n\nexport interface VariableEditorHeaderProps {\n\theaderText: string;\n\tsubText: string;\n\ttoolTipInfo?: string;\n\tcontainerStyle?: CSSProperties;\n}\nconst VariableEditorHeader = ({\n\theaderText,\n\tsubText,\n\ttoolTipInfo,\n\tcontainerStyle,\n}: VariableEditorHeaderProps) => {\n\treturn (\n\t\t<VariableEditorHeaderContainer\n\t\t\tstyle={{\n\t\t\t\t...containerStyle,\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tgap: 8,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<TitleRegular style={{ color: COLORS.content.primary }}>\n\t\t\t\t\t{headerText}\n\t\t\t\t</TitleRegular>\n\t\t\t\t{toolTipInfo && (\n\t\t\t\t\t<Tooltip body={toolTipInfo}>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<InfoIcon\n\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t<SubTitle\n\t\t\t\tstyle={{\n\t\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t\t\tmarginBottom: 0,\n\t\t\t\t\tlineHeight: 20,\n\t\t\t\t\tdisplay: 'block',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{subText}\n\t\t\t</SubTitle>\n\t\t</VariableEditorHeaderContainer>\n\t);\n};\n\nexport default VariableEditorHeader;\n"],"names":["SubTitle","styled","BodySecondary","VariableEditorHeaderContainer","VariableEditorHeader","headerText","subText","toolTipInfo","containerStyle","jsxDEV","TitleRegular","COLORS","this","Tooltip","InfoIcon"],"mappings":"wZAOMA,EAAWC,EAAAA,QAAOC,eAAa;AAAA;AAAA,EAI/BC,EAAgCF,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAcvCG,EAAuB,CAAC,CAC7B,WAAAC,EACA,QAAAC,EACA,YAAAC,EACA,eAAAC,CACD,IAEEC,EAAAA,OAACN,EAAA,CACA,MAAO,CACN,GAAGK,CAAA,EAGJ,SAAA,CAAAC,EAAAA,OAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,IAAK,CAAA,EAGN,SAAA,CAAAA,EAAAA,OAACC,EAAAA,aAAA,CAAa,MAAO,CAAE,MAAOC,EAAAA,OAAO,QAAQ,OAAA,EAC3C,SAAAN,CAAA,EADF,OAAA,GAAA,CAAA,SAAA,mKAAA,WAAA,GAAA,aAAA,CAAA,EAAAO,MAEA,EACCL,GACAE,EAAAA,OAACI,UAAA,CAAQ,KAAMN,EACd,kBAAC,MAAA,CACA,SAAAE,EAAAA,OAACK,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOH,EAAAA,OAAO,QAAQ,WAAA,EAHvB,OAAA,GAAA,CAAA,SAAA,mKAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,CAIA,EALD,OAAA,GAAA,CAAA,SAAA,mKAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAMA,CAAA,EAPD,OAAA,GAAA,CAAA,SAAA,mKAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAQA,CAAA,CAAA,EAlBF,OAAA,GAAA,CAAA,SAAA,mKAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,EAqBAH,EAAAA,OAACT,EAAA,CACA,MAAO,CACN,MAAOW,EAAAA,OAAO,QAAQ,UACtB,aAAc,EACd,WAAY,GACZ,QAAS,OAAA,EAGT,SAAAL,CAAA,EARF,OAAA,GAAA,CAAA,SAAA,mKAAA,WAAA,GAAA,aAAA,CAAA,EAAAM,MAAA,CASA,CAAA,EAnCD,OAAA,GAAA,CAAA,SAAA,mKAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA"}
+{"version":3,"file":"VariableEditorHeader.js","sources":["../../../../../src/components/template-context-mapper/modalElements/VariableEditorHeader.tsx"],"sourcesContent":["import InfoIcon from '@src/assets/icons/info.svg';\nimport { type CSSProperties } from 'react';\nimport styled from 'styled-components';\nimport { Tooltip } from '@src/components/tooltips/Tooltip';\nimport { BodySecondary, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nconst SubTitle = styled(BodySecondary)`\n\tline-height: 1.5 !important;\n`;\n\nconst VariableEditorHeaderContainer = styled.div`\n\tpadding-top: 24px;\n\tpadding-left: 10px;\n\tpadding-right: 10px;\n\tmargin-bottom: 8px;\n\tline-height: normal;\n`;\n\nexport interface VariableEditorHeaderProps {\n\theaderText: string;\n\tsubText: string;\n\ttoolTipInfo?: string;\n\tcontainerStyle?: CSSProperties;\n}\nconst VariableEditorHeader = ({\n\theaderText,\n\tsubText,\n\ttoolTipInfo,\n\tcontainerStyle,\n}: VariableEditorHeaderProps) => {\n\treturn (\n\t\t<VariableEditorHeaderContainer\n\t\t\tstyle={{\n\t\t\t\t...containerStyle,\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tgap: 8,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<TitleRegular style={{ color: COLORS.content.primary }}>\n\t\t\t\t\t{headerText}\n\t\t\t\t</TitleRegular>\n\t\t\t\t{toolTipInfo && (\n\t\t\t\t\t<Tooltip body={toolTipInfo}>\n\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t<InfoIcon\n\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\t\tcolor={COLORS.content.placeholder}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t<SubTitle\n\t\t\t\tstyle={{\n\t\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t\t\tmarginBottom: 0,\n\t\t\t\t\tlineHeight: 20,\n\t\t\t\t\tdisplay: 'block',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{subText}\n\t\t\t</SubTitle>\n\t\t</VariableEditorHeaderContainer>\n\t);\n};\n\nexport default VariableEditorHeader;\n"],"names":["SubTitle","styled","BodySecondary","VariableEditorHeaderContainer","VariableEditorHeader","headerText","subText","toolTipInfo","containerStyle","jsxDEV","TitleRegular","COLORS","this","Tooltip","InfoIcon"],"mappings":"wZAOMA,EAAWC,EAAAA,QAAOC,eAAa;AAAA;AAAA,EAI/BC,EAAgCF,EAAAA,QAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAcvCG,EAAuB,CAAC,CAC7B,WAAAC,EACA,QAAAC,EACA,YAAAC,EACA,eAAAC,CACD,IAEEC,EAAAA,OAACN,EAAA,CACA,MAAO,CACN,GAAGK,CAAA,EAGJ,SAAA,CAAAC,EAAAA,OAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,IAAK,CAAA,EAGN,SAAA,CAAAA,EAAAA,OAACC,EAAAA,aAAA,CAAa,MAAO,CAAE,MAAOC,EAAAA,OAAO,QAAQ,OAAA,EAC3C,SAAAN,CAAA,EADF,OAAA,GAAA,CAAA,SAAA,oIAAA,WAAA,GAAA,aAAA,CAAA,EAAAO,MAEA,EACCL,GACAE,EAAAA,OAACI,UAAA,CAAQ,KAAMN,EACd,kBAAC,MAAA,CACA,SAAAE,EAAAA,OAACK,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOH,EAAAA,OAAO,QAAQ,WAAA,EAHvB,OAAA,GAAA,CAAA,SAAA,oIAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,CAIA,EALD,OAAA,GAAA,CAAA,SAAA,oIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAMA,CAAA,EAPD,OAAA,GAAA,CAAA,SAAA,oIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAQA,CAAA,CAAA,EAlBF,OAAA,GAAA,CAAA,SAAA,oIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,EAqBAH,EAAAA,OAACT,EAAA,CACA,MAAO,CACN,MAAOW,EAAAA,OAAO,QAAQ,UACtB,aAAc,EACd,WAAY,GACZ,QAAS,OAAA,EAGT,SAAAL,CAAA,EARF,OAAA,GAAA,CAAA,SAAA,oIAAA,WAAA,GAAA,aAAA,CAAA,EAAAM,MAAA,CASA,CAAA,EAnCD,OAAA,GAAA,CAAA,SAAA,oIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("react/jsx-dev-runtime"),Y=require("lodash/cloneDeep"),B=require("react"),$=require("../../dropdown/Dropdown.js"),Q=require("../../input/Input.js"),z=require("../../template-preview/constants/regexPatterns.js"),N=require("../../template-preview/models/TemplateMeta.js"),F=require("../../template-preview/models/WhatsAppTemplate.js"),G=require("../../TypographyStyle.js"),J=require("../../../constants/Theme.js"),X=require("../context/templateModalContext.js"),w=require("../utils/constants.js"),Z=require("../utils/validateIsUrl.js"),g=require("./VariableConnector.js"),ee=a=>a&&typeof a=="object"&&"default"in a?a:{default:a},S=ee(Y),te=({variableListIndex:a,button:t,updateSelectedURLTemplateBtn:x,updateSelectedQRBTemplateBtn:q,currentVariableList:h,CTAoptions:k,QRBoptions:U,disableEdit:D})=>{const[C,E]=B.useState(""),[c,V]=B.useState(),I=k?.map(s=>({...s,selected:c?.value===s.value&&c.label===s.label})),j=U?.map(s=>({...s,selected:c?.value===s.value})),{isError:L,disableEditVariable:O,pod:H,selectedCarouselIndex:o,originalVariableList:d,setOriginalVariableList:b,isProductCarouselType:A,ctaOptionsErrors:M,setCtaOptionsErrors:P}=X.useTemplateModalContext();B.useEffect(()=>{if(t.buttonVariable===w.UNSUBSCRIBE_URL_VARIABLE){V(N.UNSUBSCRIBE_URL_OPTION),E(t.example?.[0].split("https://")[1]||"");return}if(t.buttonVariable&&z.editableVarPattern.test(t.buttonVariable))t.buttonVariable===w.STATIC_URL_VARIABLE_NAME?V(N.STATIC_URL_CTA_OPTION):V(N.CUSTOM_URL_NAME),E(t.example?.[0].split("https://")[1]||"");else{let s=-1;const v=t.type==="URL"?k:U;t.type==="URL"?s=v.findIndex(r=>r.placeHolder===t.buttonVariable):s=v.findIndex(r=>r.label===t.flowName),s>-1?V(v[s]):P?.(r=>({...r,[a]:"Required field!"}))}},[]);function W(s){if(E(s),o!=null&&o>-1&&A){const l=S.default(d);if(t.type==="URL"){const y=l.cards.map(i=>{let e=i.buttons.filter(u=>u.type==="URL")[a];e={...e,buttonVariable:"((customPlaceholderName))",example:[`https://${s}`]};const T=i.buttons.map(u=>u.type==="URL"&&u?.text===e?.text?e:u);return{...i,buttons:T}});b?.(i=>({...i,cards:y})),x?.(`https://${s}`,"custom",a)}return}let r=h.buttons.filter(l=>l.type==="URL")[a];r={...r,buttonVariable:"((customPlaceholderName))",example:[`https://${s}`]};const R=h.buttons.map(l=>l.type==="URL"&&l?.text===r?.text?r:l),m={...o!=null&&o>-1?d.cards[o]:d};if(m.buttons=R,o!=null&&o>-1){const l=[...d.cards];l[o]=m,b?.(y=>({...y,cards:l}))}else b?.(l=>({...l,buttons:[...R]}));x?.(`https://${s}`,"custom",a)}function K(s,v){P?.(l=>(delete l[a],{...l}));const r=s;V(r);const m=(t.type==="URL"?k:U).find(l=>l.placeHolder===r.placeHolder);if(m)if(m.value!=="custom_link"){if(o!=null&&o>-1&&A){const i=S.default(d);if(t.type==="URL"){const n=i.cards.map(e=>{let u=e.buttons.filter(p=>p.type==="URL")[a];u={...u,buttonVariable:r.placeHolder};const _=e.buttons.map(p=>p.type==="URL"&&p?.text===u?.text?u:p);return{...e,buttons:_}});x?.({defaultValue:m.value,placeHolder:m.placeHolder},"placeholder",a),b?.(e=>({...e,cards:n}))}else if(t.type==="QUICK_REPLY"){const n=i.cards.map(e=>{let u=e.buttons.filter(p=>p.type==="QUICK_REPLY")[a];u={...u,flowName:r.label,flowId:r.value};const _=e.buttons.map(p=>p.type==="QUICK_REPLY"&&p?.text===u?.text?u:p);return{...e,buttons:_}});q?.({flowName:r.label,flowId:r.value},"placeholder",a),b?.(e=>({...e,cards:n}))}return}let l;if(t.type==="URL"){let n=h.buttons.filter(e=>e.type==="URL")[a];n={...n,buttonVariable:r.placeHolder,example:[r?.value||"https://d.bik.ai/"]},l=h.buttons.map(e=>e.type==="URL"&&e?.text===n?.text?n:e),x?.({defaultValue:m.value,placeHolder:m.placeHolder},"placeholder",a)}else{let n=h.buttons.filter(e=>e.type==="QUICK_REPLY")[a];n={...n,flowName:r.label,flowId:r.value},l=h.buttons.map(e=>e.type==="QUICK_REPLY"&&e?.text===n?.text?n:e),q?.({flowName:r.label,flowId:r.value},"placeholder",a)}const y={...o!=null&&o>-1?d.cards[o]:d};if(y.buttons=l,o!=null&&o>-1){const i=[...d.cards];i[o]=y,b?.(n=>({...n,cards:i}))}else b?.(i=>({...i,buttons:[...l]}))}else W("")}return H!==F.POD.CHATBOT?f.jsxDEV(g.Container,{children:[f.jsxDEV("div",{style:{marginBottom:8},children:f.jsxDEV(G.BodySecondary,{style:{color:J.COLORS.content.primary},children:[t.text," button"]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:437,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:432,columnNumber:5},void 0),f.jsxDEV("div",{style:{marginBottom:12},children:f.jsxDEV($.Dropdown,{disabled:O||D,truncatedText:!1,options:t.type==="URL"?c?.value==="static_link"?[N.STATIC_URL_CTA_OPTION]:I:j,isSearchable:!0,onSelect:K,defaultOptions:c?[{...c,selected:!0}]:[],error:L?M?.[a]:void 0},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:451,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:446,columnNumber:5},void 0),(c?.value==="custom_link"||c?.value==="static_link")&&f.jsxDEV("div",{style:{marginBottom:20},children:f.jsxDEV(Q.Input,{state:O||D?"disabled":"none",errorMessage:L?C?Z.validateIsUrl(C)?"":"Enter valid URL":"Required field":"",value:C,prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:W,maxCharLimit:2e3},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:479,columnNumber:7},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:478,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:431,columnNumber:4},void 0):f.jsxDEV(g.default,{index:a,variable:{variableName:t.text??"",updatedValue:t.buttonVariable==="((customPlaceholderName))"?`${t.example?.[0]}`:t.buttonVariable??"",type:"link",isEditableVariable:!0,index:t.index??0,queryParams:t.queryParams??[]},showVariableModal:!0,componentType:"BUTTONS",buttonType:t.type,CTAoptions:k},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:502,columnNumber:4},void 0)};exports.default=te;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const f=require("react/jsx-dev-runtime"),Y=require("lodash/cloneDeep"),w=require("react"),$=require("../../dropdown/Dropdown.js"),Q=require("../../input/Input.js"),z=require("../../template-preview/constants/regexPatterns.js"),C=require("../../template-preview/models/TemplateMeta.js"),F=require("../../template-preview/models/WhatsAppTemplate.js"),G=require("../../TypographyStyle.js"),J=require("../../../constants/Theme.js"),X=require("../context/templateModalContext.js"),g=require("../utils/constants.js"),Z=require("../utils/validateIsUrl.js"),S=require("./VariableConnector.js"),ee=l=>l&&typeof l=="object"&&"default"in l?l:{default:l},I=ee(Y),te=({variableListIndex:l,button:t,updateSelectedURLTemplateBtn:N,updateSelectedQRBTemplateBtn:q,currentVariableList:y,CTAoptions:U,QRBoptions:E,disableEdit:D})=>{const[R,T]=w.useState(""),[c,x]=w.useState(),j=U?.map(o=>({...o,selected:c?.value===o.value&&c.label===o.label})),H=E?.map(o=>({...o,selected:c?.value===o.value})),{isError:L,disableEditVariable:O,pod:M,selectedCarouselIndex:s,originalVariableList:m,setOriginalVariableList:b,isProductCarouselType:A,ctaOptionsErrors:W,setCtaOptionsErrors:P}=X.useTemplateModalContext();w.useEffect(()=>{if(t.buttonVariable===g.UNSUBSCRIBE_URL_VARIABLE){x(C.UNSUBSCRIBE_URL_OPTION),T(t.example?.[0].split("https://")[1]||"");return}if(t.buttonVariable&&z.editableVarPattern.test(t.buttonVariable))t.buttonVariable===g.STATIC_URL_VARIABLE_NAME?x(C.STATIC_URL_CTA_OPTION):x(C.CUSTOM_URL_NAME),T(t.example?.[0].split("https://")[1]||"");else{let o=-1;const h=t.type==="URL"?U:E;t.type==="URL"?o=h.findIndex(r=>r.placeHolder===t.buttonVariable):o=h.findIndex(r=>r.label===t.flowName),o>-1?x(h[o]):P?.(r=>({...r,[l]:"Required field!"}))}},[]);function k(o){if(T(o),s!=null&&s>-1&&A){const a=I.default(m);if(t.type==="URL"){const V=a.cards.map(u=>{let e=u.buttons.filter(i=>i.type==="URL")[l];e={...e,buttonVariable:"((customPlaceholderName))",example:[`https://${o}`]};const B=u.buttons.map(i=>i.type==="URL"&&i?.text===e?.text?e:i);return{...u,buttons:B}});b?.(u=>({...u,cards:V})),N?.(`https://${o}`,"custom",l)}return}let r=y.buttons.filter(a=>a.type==="URL")[l];r={...r,buttonVariable:"((customPlaceholderName))",example:[`https://${o}`]};const _=y.buttons.map(a=>a.type==="URL"&&a?.text===r?.text?r:a),d={...s!=null&&s>-1?m.cards[s]:m};if(d.buttons=_,s!=null&&s>-1){const a=[...m.cards];a[s]=d,b?.(V=>({...V,cards:a}))}else b?.(a=>({...a,buttons:[..._]}));N?.(`https://${o}`,"custom",l)}function K(o,h){P?.(a=>(delete a[l],{...a}));const r=o;x(r);const d=(t.type==="URL"?U:E).find(a=>a.placeHolder===r.placeHolder);if(d)if(d.value!=="custom_link"){if(s!=null&&s>-1&&A){const u=I.default(m);if(t.type==="URL"){const n=u.cards.map(e=>{let i=e.buttons.filter(p=>p.type==="URL")[l];i={...i,buttonVariable:r.placeHolder};const v=e.buttons.map(p=>p.type==="URL"&&p?.text===i?.text?i:p);return{...e,buttons:v}});N?.({defaultValue:d.value,placeHolder:d.placeHolder},"placeholder",l),b?.(e=>({...e,cards:n}))}else if(t.type==="QUICK_REPLY"){const n=u.cards.map(e=>{let i=e.buttons.filter(p=>p.type==="QUICK_REPLY")[l];i={...i,flowName:r.label,flowId:r.value};const v=e.buttons.map(p=>p.type==="QUICK_REPLY"&&p?.text===i?.text?i:p);return{...e,buttons:v}});q?.({flowName:r.label,flowId:r.value},"placeholder",l),b?.(e=>({...e,cards:n}))}return}let a;if(t.type==="URL"){let n=y.buttons.filter(e=>e.type==="URL")[l];n={...n,buttonVariable:r.placeHolder,example:[r?.value||"https://d.bik.ai/"]},a=y.buttons.map(e=>e.type==="URL"&&e?.text===n?.text?n:e),N?.({defaultValue:d.value,placeHolder:d.placeHolder},"placeholder",l)}else{let n=y.buttons.filter(e=>e.type==="QUICK_REPLY")[l];n={...n,flowName:r.label,flowId:r.value},a=y.buttons.map(e=>e.type==="QUICK_REPLY"&&e?.text===n?.text?n:e),q?.({flowName:r.label,flowId:r.value},"placeholder",l)}const V={...s!=null&&s>-1?m.cards[s]:m};if(V.buttons=a,s!=null&&s>-1){const u=[...m.cards];u[s]=V,b?.(n=>({...n,cards:u}))}else b?.(u=>({...u,buttons:[...a]}))}else k("")}return M!==F.POD.CHATBOT?f.jsxDEV(S.Container,{children:[f.jsxDEV("div",{style:{marginBottom:8},children:f.jsxDEV(G.BodySecondary,{style:{color:J.COLORS.content.primary},children:[t.text," button"]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:437,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:432,columnNumber:5},void 0),f.jsxDEV("div",{style:{marginBottom:12},children:f.jsxDEV($.Dropdown,{disabled:O||D,truncatedText:!1,options:t.type==="URL"?c?.value==="static_link"?[C.STATIC_URL_CTA_OPTION]:j:H,isSearchable:!0,onSelect:K,defaultOptions:c?[{...c,selected:!0}]:[],error:L?W?.[l]:void 0},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:451,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:446,columnNumber:5},void 0),(c?.value==="custom_link"||c?.value==="static_link")&&f.jsxDEV("div",{style:{marginBottom:20},children:f.jsxDEV(Q.Input,{state:O||D?"disabled":"none",errorMessage:L?R?Z.validateIsUrl(R)?"":"Enter valid URL":"Required field":"",value:R,prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:k,maxCharLimit:2e3},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:479,columnNumber:7},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:478,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:431,columnNumber:4},void 0):f.jsxDEV(S.default,{index:l,variable:{variableName:t.text??"",updatedValue:t.buttonVariable==="((customPlaceholderName))"?`${t.example?.[0]}`:t.buttonVariable??"",type:"link",isEditableVariable:!0,index:t.index??0,queryParams:t.queryParams??[]},showVariableModal:!0,componentType:"BUTTONS",buttonType:t.type,CTAoptions:U},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx",lineNumber:502,columnNumber:4},void 0)};exports.default=te;
 //# sourceMappingURL=WhatsAppTemplateCardButtonV2.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"WhatsAppTemplateCardButtonV2.js","sources":["../../../../../src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx"],"sourcesContent":["import cloneDeep from 'lodash/cloneDeep';\nimport { useEffect, useState } from 'react';\nimport { Dropdown } from '@src/components/dropdown/Dropdown';\nimport type { DropdownOption, SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input/Input';\nimport { editableVarPattern } from '@src/components/template-preview/constants/regexPatterns';\nimport {\n\tButtonPlaceHolderOptions,\n\tCUSTOM_URL_NAME,\n\tSTATIC_URL_CTA_OPTION,\n\tUNSUBSCRIBE_URL_OPTION,\n} from '@src/components/template-preview/models/TemplateMeta';\nimport type { WhatsAppCarouselTemplateVariables } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport {\n\ttype CTABtnValType,\n\tPOD,\n\ttype QRBBtnValType,\n\ttype TEMPLATE_BUTTON,\n} from '@src/components/template-preview/models/WhatsAppTemplate';\nimport type { WhatsAppTemplateVariables } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport {\n\tSTATIC_URL_VARIABLE_NAME,\n\tUNSUBSCRIBE_URL_VARIABLE,\n} from '../utils/constants';\nimport { validateIsUrl } from '../utils/validateIsUrl';\nimport VariableConnector, { Container } from './VariableConnector';\n\nexport type URLBtnUpdateFunctionType = (\n\tval: CTABtnValType,\n\tmode: 'custom' | 'placeholder',\n\tbtnIndex?: number,\n) => void;\n\nexport type QRBBtnUpdateFunctionType = (\n\tval: QRBBtnValType,\n\tmode: 'custom' | 'placeholder',\n\tbtnIndex?: number,\n) => void;\n\ntype optionType = SingleOption & {\n\tplaceHolder: string;\n};\nexport interface WhatsAppTemplateCardButtonV2Props {\n\tcurrentVariableList: WhatsAppTemplateVariables;\n\tupdateSelectedURLTemplateBtn?: URLBtnUpdateFunctionType;\n\tupdateSelectedQRBTemplateBtn?: QRBBtnUpdateFunctionType;\n\tbutton: TEMPLATE_BUTTON;\n\tCTAoptions?: ButtonPlaceHolderOptions[];\n\tQRBoptions?: ButtonPlaceHolderOptions[];\n\tvariableListIndex: number;\n\tdisableEdit?: boolean;\n}\nconst WhatsAppTemplateCardButtonV2: React.FC<\n\tWhatsAppTemplateCardButtonV2Props\n> = ({\n\tvariableListIndex,\n\tbutton,\n\tupdateSelectedURLTemplateBtn,\n\tupdateSelectedQRBTemplateBtn,\n\tcurrentVariableList,\n\tCTAoptions,\n\tQRBoptions,\n\tdisableEdit,\n}) => {\n\tconst [customLink, setCustomLink] = useState('');\n\tconst [selectedOption, setSelectedOption] = useState<SingleOption>();\n\n\t// Updating the selected attribute in the options so that in dropdown the option will be highlighted\n\tconst updatedCTAOptions = CTAoptions?.map((option) => {\n\t\treturn {\n\t\t\t...option,\n\t\t\tselected:\n\t\t\t\tselectedOption?.value === option.value &&\n\t\t\t\tselectedOption.label === option.label,\n\t\t};\n\t});\n\tconst updatedQRBOptions = QRBoptions?.map((option) => {\n\t\treturn {\n\t\t\t...option,\n\t\t\tselected: selectedOption?.value === option.value,\n\t\t};\n\t});\n\n\tconst {\n\t\tisError,\n\t\tdisableEditVariable,\n\t\tpod,\n\t\tselectedCarouselIndex,\n\t\toriginalVariableList,\n\t\tsetOriginalVariableList,\n\t\tisProductCarouselType,\n\t\tctaOptionsErrors,\n\t\tsetCtaOptionsErrors,\n\t} = useTemplateModalContext();\n\n\tuseEffect(() => {\n\t\tif (button.buttonVariable === UNSUBSCRIBE_URL_VARIABLE) {\n\t\t\tsetSelectedOption(UNSUBSCRIBE_URL_OPTION);\n\t\t\tsetCustomLink(button.example?.[0].split('https://')[1] || '');\n\t\t\treturn;\n\t\t}\n\t\tif (\n\t\t\tbutton.buttonVariable &&\n\t\t\teditableVarPattern.test(button.buttonVariable)\n\t\t) {\n\t\t\tif (button.buttonVariable === STATIC_URL_VARIABLE_NAME) {\n\t\t\t\tsetSelectedOption(STATIC_URL_CTA_OPTION);\n\t\t\t} else {\n\t\t\t\tsetSelectedOption(CUSTOM_URL_NAME);\n\t\t\t}\n\t\t\tsetCustomLink(button.example?.[0].split('https://')[1] || '');\n\t\t} else {\n\t\t\tlet index = -1;\n\t\t\tconst options =\n\t\t\t\tbutton.type === 'URL'\n\t\t\t\t\t? (CTAoptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t: (QRBoptions as ButtonPlaceHolderOptions[]);\n\t\t\tif (button.type === 'URL') {\n\t\t\t\tindex = options.findIndex(\n\t\t\t\t\t(op) => op.placeHolder === button.buttonVariable,\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tindex = options.findIndex((op) => op.label === button.flowName);\n\t\t\t}\n\n\t\t\tif (index > -1) {\n\t\t\t\tsetSelectedOption(options[index]);\n\t\t\t} else {\n\t\t\t\tsetCtaOptionsErrors?.((prevState) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...prevState,\n\t\t\t\t\t\t[variableListIndex]: 'Required field!',\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t}\n\t\t}\n\t}, []);\n\n\tfunction handleCustomLink(text: string) {\n\t\tsetCustomLink(text);\n\t\tif (\n\t\t\tselectedCarouselIndex != undefined &&\n\t\t\tselectedCarouselIndex > -1 &&\n\t\t\tisProductCarouselType\n\t\t) {\n\t\t\tconst originalList = cloneDeep(\n\t\t\t\toriginalVariableList as WhatsAppCarouselTemplateVariables,\n\t\t\t);\n\t\t\tif (button.type === 'URL') {\n\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\tconst urlBtns = card.buttons.filter((btn) => btn.type === 'URL');\n\t\t\t\t\tlet currentButton = urlBtns[variableListIndex];\n\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\tbuttonVariable: '((customPlaceholderName))',\n\t\t\t\t\t\texample: [`https://${text}`],\n\t\t\t\t\t};\n\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === currentButton?.text) {\n\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...card,\n\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...pre,\n\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t`https://${text}`,\n\t\t\t\t\t'custom',\n\t\t\t\t\tvariableListIndex,\n\t\t\t\t);\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\t\tconst urlVariables = currentVariableList.buttons.filter(\n\t\t\t(btn) => btn.type === 'URL',\n\t\t);\n\t\tlet urlVariable = urlVariables[variableListIndex];\n\t\turlVariable = {\n\t\t\t...urlVariable,\n\t\t\tbuttonVariable: '((customPlaceholderName))',\n\t\t\texample: [`https://${text}`],\n\t\t};\n\t\tconst updatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\tif (btn.type === 'URL' && btn?.text === urlVariable?.text) {\n\t\t\t\treturn urlVariable;\n\t\t\t} else {\n\t\t\t\treturn btn;\n\t\t\t}\n\t\t});\n\t\tconst newList = {\n\t\t\t...(selectedCarouselIndex != undefined && selectedCarouselIndex > -1\n\t\t\t\t? (originalVariableList as WhatsAppCarouselTemplateVariables).cards[\n\t\t\t\t\t\tselectedCarouselIndex\n\t\t\t\t  ]\n\t\t\t\t: (originalVariableList as WhatsAppTemplateVariables)),\n\t\t};\n\t\tnewList.buttons = updatedVariables;\n\t\tif (selectedCarouselIndex != undefined && selectedCarouselIndex > -1) {\n\t\t\tconst cardList = [\n\t\t\t\t...(originalVariableList as WhatsAppCarouselTemplateVariables).cards,\n\t\t\t];\n\t\t\tcardList[selectedCarouselIndex] = newList;\n\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\treturn {\n\t\t\t\t\t...pre,\n\t\t\t\t\tcards: cardList,\n\t\t\t\t};\n\t\t\t});\n\t\t} else {\n\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\treturn {\n\t\t\t\t\t...pre,\n\t\t\t\t\tbuttons: [...updatedVariables],\n\t\t\t\t};\n\t\t\t});\n\t\t}\n\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t`https://${text}`,\n\t\t\t'custom',\n\t\t\tvariableListIndex,\n\t\t);\n\t}\n\n\tfunction handleSelectOnChange(\n\t\toptionName: SingleOption | SingleOption[],\n\t\tselectedIndex?: number,\n\t) {\n\t\tsetCtaOptionsErrors?.((prevState) => {\n\t\t\tdelete prevState[variableListIndex];\n\t\t\treturn {\n\t\t\t\t...prevState,\n\t\t\t};\n\t\t});\n\t\tconst singleOption = optionName as optionType;\n\t\tsetSelectedOption(singleOption);\n\t\tconst options =\n\t\t\tbutton.type === 'URL'\n\t\t\t\t? (CTAoptions as ButtonPlaceHolderOptions[])\n\t\t\t\t: (QRBoptions as ButtonPlaceHolderOptions[]);\n\t\tconst placeHolder = options.find(\n\t\t\t(option) => option.placeHolder === singleOption.placeHolder,\n\t\t);\n\t\tif (placeHolder) {\n\t\t\tif (placeHolder.value !== 'custom_link') {\n\t\t\t\tif (\n\t\t\t\t\tselectedCarouselIndex != undefined &&\n\t\t\t\t\tselectedCarouselIndex > -1 &&\n\t\t\t\t\tisProductCarouselType\n\t\t\t\t) {\n\t\t\t\t\tconst originalList = cloneDeep(\n\t\t\t\t\t\toriginalVariableList as WhatsAppCarouselTemplateVariables,\n\t\t\t\t\t);\n\t\t\t\t\tif (button.type === 'URL') {\n\t\t\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\t\t\tconst urlBtns = card.buttons.filter((btn) => btn.type === 'URL');\n\t\t\t\t\t\t\tlet currentButton = urlBtns[variableListIndex];\n\t\t\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\t\t\tbuttonVariable: singleOption.placeHolder,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === currentButton?.text) {\n\t\t\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...card,\n\t\t\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tdefaultValue: placeHolder.value,\n\t\t\t\t\t\t\t\tplaceHolder: placeHolder.placeHolder,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t\t);\n\t\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t} else if (button.type === 'QUICK_REPLY') {\n\t\t\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\t\t\tconst qrbBtns = card.buttons.filter(\n\t\t\t\t\t\t\t\t(btn) => btn.type === 'QUICK_REPLY',\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tlet currentButton = qrbBtns[variableListIndex];\n\t\t\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\tbtn.type === 'QUICK_REPLY' &&\n\t\t\t\t\t\t\t\t\tbtn?.text === currentButton?.text\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...card,\n\t\t\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t\tupdateSelectedQRBTemplateBtn?.(\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t\t);\n\t\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tlet updatedVariables;\n\t\t\t\tif (button.type === 'URL') {\n\t\t\t\t\tconst urlVariables = currentVariableList.buttons.filter(\n\t\t\t\t\t\t(btn) => btn.type === 'URL',\n\t\t\t\t\t);\n\t\t\t\t\tlet urlVariable = urlVariables[variableListIndex];\n\t\t\t\t\turlVariable = {\n\t\t\t\t\t\t...urlVariable,\n\t\t\t\t\t\tbuttonVariable: singleOption.placeHolder,\n\t\t\t\t\t\texample: [singleOption?.value || 'https://d.bik.ai/'],\n\t\t\t\t\t};\n\t\t\t\t\tupdatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === urlVariable?.text) {\n\t\t\t\t\t\t\treturn urlVariable;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tdefaultValue: placeHolder.value,\n\t\t\t\t\t\t\tplaceHolder: placeHolder.placeHolder,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\tconst qrbVariables = currentVariableList.buttons.filter(\n\t\t\t\t\t\t(btn) => btn.type === 'QUICK_REPLY',\n\t\t\t\t\t);\n\t\t\t\t\tlet qrbVariable = qrbVariables[variableListIndex];\n\t\t\t\t\tqrbVariable = {\n\t\t\t\t\t\t...qrbVariable,\n\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t};\n\t\t\t\t\tupdatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'QUICK_REPLY' && btn?.text === qrbVariable?.text) {\n\t\t\t\t\t\t\treturn qrbVariable;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tupdateSelectedQRBTemplateBtn?.(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tconst newList = {\n\t\t\t\t\t...(selectedCarouselIndex != undefined && selectedCarouselIndex > -1\n\t\t\t\t\t\t? (originalVariableList as WhatsAppCarouselTemplateVariables).cards[\n\t\t\t\t\t\t\t\tselectedCarouselIndex\n\t\t\t\t\t\t  ]\n\t\t\t\t\t\t: (originalVariableList as WhatsAppTemplateVariables)),\n\t\t\t\t};\n\t\t\t\tnewList.buttons = updatedVariables;\n\t\t\t\tif (selectedCarouselIndex != undefined && selectedCarouselIndex > -1) {\n\t\t\t\t\tconst cardList = [\n\t\t\t\t\t\t...(originalVariableList as WhatsAppCarouselTemplateVariables)\n\t\t\t\t\t\t\t.cards,\n\t\t\t\t\t];\n\t\t\t\t\tcardList[selectedCarouselIndex] = newList;\n\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\tcards: cardList,\n\t\t\t\t\t\t};\n\t\t\t\t\t});\n\t\t\t\t} else {\n\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\tbuttons: [...updatedVariables],\n\t\t\t\t\t\t};\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\thandleCustomLink('');\n\t\t\t}\n\t\t}\n\t}\n\n\tif (pod !== POD.CHATBOT) {\n\t\treturn (\n\t\t\t<Container>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 8,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tcolor: COLORS.content.primary,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{button.text} button\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 12,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Dropdown\n\t\t\t\t\t\tdisabled={disableEditVariable || disableEdit}\n\t\t\t\t\t\ttruncatedText={false}\n\t\t\t\t\t\toptions={\n\t\t\t\t\t\t\tbutton.type === 'URL'\n\t\t\t\t\t\t\t\t? selectedOption?.value === 'static_link'\n\t\t\t\t\t\t\t\t\t? [STATIC_URL_CTA_OPTION]\n\t\t\t\t\t\t\t\t\t: (updatedCTAOptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t\t\t\t: (updatedQRBOptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisSearchable={true}\n\t\t\t\t\t\tonSelect={\n\t\t\t\t\t\t\thandleSelectOnChange as (\n\t\t\t\t\t\t\t\toption: DropdownOption | DropdownOption[],\n\t\t\t\t\t\t\t) => void\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdefaultOptions={\n\t\t\t\t\t\t\tselectedOption\n\t\t\t\t\t\t\t\t? [{ ...selectedOption, selected: true } as DropdownOption]\n\t\t\t\t\t\t\t\t: []\n\t\t\t\t\t\t}\n\t\t\t\t\t\terror={isError ? ctaOptionsErrors?.[variableListIndex] : undefined}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t{(selectedOption?.value === 'custom_link' ||\n\t\t\t\t\tselectedOption?.value === 'static_link') && (\n\t\t\t\t\t<div style={{ marginBottom: 20 }}>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tstate={disableEditVariable || disableEdit ? 'disabled' : 'none'}\n\t\t\t\t\t\t\terrorMessage={\n\t\t\t\t\t\t\t\tisError\n\t\t\t\t\t\t\t\t\t? !customLink\n\t\t\t\t\t\t\t\t\t\t? 'Required field'\n\t\t\t\t\t\t\t\t\t\t: !validateIsUrl(customLink)\n\t\t\t\t\t\t\t\t\t\t? 'Enter valid URL'\n\t\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={customLink}\n\t\t\t\t\t\t\tprefixText={'https://'}\n\t\t\t\t\t\t\tplaceholder={'Enter custom URL here'}\n\t\t\t\t\t\t\tonChangeText={handleCustomLink}\n\t\t\t\t\t\t\tmaxCharLimit={2000}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Container>\n\t\t);\n\t} else {\n\t\treturn (\n\t\t\t<VariableConnector\n\t\t\t\t// this index is respect to template variables -> buttons\n\t\t\t\tindex={variableListIndex}\n\t\t\t\tvariable={{\n\t\t\t\t\tvariableName: button.text ?? '',\n\t\t\t\t\tupdatedValue:\n\t\t\t\t\t\tbutton.buttonVariable === '((customPlaceholderName))' //hardcoded for backward compatibility\n\t\t\t\t\t\t\t? `${button.example?.[0]}`\n\t\t\t\t\t\t\t: button.buttonVariable ?? '',\n\t\t\t\t\ttype: 'link', // since this is a url, type will be link\n\t\t\t\t\tisEditableVariable: true,\n\t\t\t\t\tindex: button.index ?? 0, // this index is respect to components -> buttons\n\t\t\t\t\tqueryParams: button.queryParams ?? [],\n\t\t\t\t}}\n\t\t\t\tshowVariableModal={true}\n\t\t\t\tcomponentType={'BUTTONS'}\n\t\t\t\tbuttonType={button.type}\n\t\t\t\tCTAoptions={CTAoptions} // dropdown values - for readable display name of variable in backward compatibility\n\t\t\t/>\n\t\t);\n\t}\n};\n\nexport default WhatsAppTemplateCardButtonV2;\n"],"names":["WhatsAppTemplateCardButtonV2","variableListIndex","button","updateSelectedURLTemplateBtn","updateSelectedQRBTemplateBtn","currentVariableList","CTAoptions","QRBoptions","disableEdit","customLink","setCustomLink","useState","selectedOption","setSelectedOption","updatedCTAOptions","option","updatedQRBOptions","isError","disableEditVariable","pod","selectedCarouselIndex","originalVariableList","setOriginalVariableList","isProductCarouselType","ctaOptionsErrors","setCtaOptionsErrors","useTemplateModalContext","useEffect","UNSUBSCRIBE_URL_VARIABLE","UNSUBSCRIBE_URL_OPTION","editableVarPattern","STATIC_URL_VARIABLE_NAME","STATIC_URL_CTA_OPTION","CUSTOM_URL_NAME","index","options","op","prevState","handleCustomLink","text","originalList","cloneDeep","newList","card","currentButton","btn","updatedButtons","pre","urlVariable","updatedVariables","cardList","handleSelectOnChange","optionName","selectedIndex","singleOption","placeHolder","qrbVariable","POD","Container","jsxDEV","BodySecondary","COLORS","this","Dropdown","Input","validateIsUrl","VariableConnector"],"mappings":"uvBAuDMA,GAEF,CAAC,CACJ,kBAAAC,EACA,OAAAC,EACA,6BAAAC,EACA,6BAAAC,EACA,oBAAAC,EACA,WAAAC,EACA,WAAAC,EACA,YAAAC,CACD,IAAM,CACL,KAAM,CAACC,EAAYC,CAAa,EAAIC,EAAAA,SAAS,EAAE,EACzC,CAACC,EAAgBC,CAAiB,EAAIF,WAAA,EAGtCG,EAAoBR,GAAY,IAAKS,IACnC,CACN,GAAGA,EACH,SACCH,GAAgB,QAAUG,EAAO,OACjCH,EAAe,QAAUG,EAAO,KAAA,EAElC,EACKC,EAAoBT,GAAY,IAAKQ,IACnC,CACN,GAAGA,EACH,SAAUH,GAAgB,QAAUG,EAAO,KAAA,EAE5C,EAEK,CACL,QAAAE,EACA,oBAAAC,EACA,IAAAC,EACA,sBAAAC,EACA,qBAAAC,EACA,wBAAAC,EACA,sBAAAC,EACA,iBAAAC,EACA,oBAAAC,CAAA,EACGC,0BAAA,EAEJC,EAAAA,UAAU,IAAM,CACf,GAAIzB,EAAO,iBAAmB0B,2BAA0B,CACvDf,EAAkBgB,EAAAA,sBAAsB,EACxCnB,EAAcR,EAAO,UAAU,CAAC,EAAE,MAAM,UAAU,EAAE,CAAC,GAAK,EAAE,EAC5D,MACD,CACA,GACCA,EAAO,gBACP4B,EAAAA,mBAAmB,KAAK5B,EAAO,cAAc,EAEzCA,EAAO,iBAAmB6B,2BAC7BlB,EAAkBmB,EAAAA,qBAAqB,EAEvCnB,EAAkBoB,EAAAA,eAAe,EAElCvB,EAAcR,EAAO,UAAU,CAAC,EAAE,MAAM,UAAU,EAAE,CAAC,GAAK,EAAE,MACtD,CACN,IAAIgC,EAAQ,GACZ,MAAMC,EACLjC,EAAO,OAAS,MACZI,EACAC,EACDL,EAAO,OAAS,MACnBgC,EAAQC,EAAQ,UACdC,GAAOA,EAAG,cAAgBlC,EAAO,cAAA,EAGnCgC,EAAQC,EAAQ,UAAWC,GAAOA,EAAG,QAAUlC,EAAO,QAAQ,EAG3DgC,EAAQ,GACXrB,EAAkBsB,EAAQD,CAAK,CAAC,EAEhCT,IAAuBY,IACf,CACN,GAAGA,EACH,CAACpC,CAAiB,EAAG,iBAAA,EAEtB,CAEH,CACD,EAAG,CAAA,CAAE,EAEL,SAASqC,EAAiBC,EAAc,CAEvC,GADA7B,EAAc6B,CAAI,EAEjBnB,GAAyB,MACzBA,EAAwB,IACxBG,EACC,CACD,MAAMiB,EAAeC,EAAAA,QACpBpB,CAAA,EAED,GAAInB,EAAO,OAAS,MAAO,CAC1B,MAAMwC,EAAUF,EAAa,MAAM,IAAKG,GAAS,CAEhD,IAAIC,EADYD,EAAK,QAAQ,OAAQE,GAAQA,EAAI,OAAS,KAAK,EACnC5C,CAAiB,EAC7C2C,EAAgB,CACf,GAAGA,EACH,eAAgB,4BAChB,QAAS,CAAC,WAAWL,CAAI,EAAE,CAAA,EAE5B,MAAMO,EAAiBH,EAAK,QAAQ,IAAKE,GACpCA,EAAI,OAAS,OAASA,GAAK,OAASD,GAAe,KAC/CA,EAEAC,CAER,EACD,MAAO,CACN,GAAGF,EACH,QAASG,CAAA,CAEX,CAAC,EACDxB,IAA2ByB,IACnB,CACN,GAAGA,EACH,MAAOL,CAAA,EAER,EACDvC,IACC,WAAWoC,CAAI,GACf,SACAtC,CAAA,CAEF,CACA,MACD,CAIA,IAAI+C,EAHiB3C,EAAoB,QAAQ,OAC/CwC,GAAQA,EAAI,OAAS,KAAA,EAEQ5C,CAAiB,EAChD+C,EAAc,CACb,GAAGA,EACH,eAAgB,4BAChB,QAAS,CAAC,WAAWT,CAAI,EAAE,CAAA,EAE5B,MAAMU,EAAmB5C,EAAoB,QAAQ,IAAKwC,GACrDA,EAAI,OAAS,OAASA,GAAK,OAASG,GAAa,KAC7CA,EAEAH,CAER,EACKH,EAAU,CACf,GAAItB,GAAyB,MAAaA,EAAwB,GAC9DC,EAA2D,MAC5DD,CACA,EACCC,CAAA,EAGL,GADAqB,EAAQ,QAAUO,EACd7B,GAAyB,MAAaA,EAAwB,GAAI,CACrE,MAAM8B,EAAW,CAChB,GAAI7B,EAA2D,KAAA,EAEhE6B,EAAS9B,CAAqB,EAAIsB,EAClCpB,IAA2ByB,IACnB,CACN,GAAGA,EACH,MAAOG,CAAA,EAER,CACF,MACC5B,IAA2ByB,IACnB,CACN,GAAGA,EACH,QAAS,CAAC,GAAGE,CAAgB,CAAA,EAE9B,EAEF9C,IACC,WAAWoC,CAAI,GACf,SACAtC,CAAA,CAEF,CAEA,SAASkD,EACRC,EACAC,EACC,CACD5B,IAAuBY,IACtB,OAAOA,EAAUpC,CAAiB,EAC3B,CACN,GAAGoC,CAAA,EAEJ,EACD,MAAMiB,EAAeF,EACrBvC,EAAkByC,CAAY,EAK9B,MAAMC,GAHLrD,EAAO,OAAS,MACZI,EACAC,GACuB,KAC1BQ,GAAWA,EAAO,cAAgBuC,EAAa,WAAA,EAEjD,GAAIC,EACH,GAAIA,EAAY,QAAU,cAAe,CACxC,GACCnC,GAAyB,MACzBA,EAAwB,IACxBG,EACC,CACD,MAAMiB,EAAeC,EAAAA,QACpBpB,CAAA,EAED,GAAInB,EAAO,OAAS,MAAO,CAC1B,MAAMwC,EAAUF,EAAa,MAAM,IAAKG,GAAS,CAEhD,IAAIC,EADYD,EAAK,QAAQ,OAAQE,GAAQA,EAAI,OAAS,KAAK,EACnC5C,CAAiB,EAC7C2C,EAAgB,CACf,GAAGA,EACH,eAAgBU,EAAa,WAAA,EAE9B,MAAMR,EAAiBH,EAAK,QAAQ,IAAKE,GACpCA,EAAI,OAAS,OAASA,GAAK,OAASD,GAAe,KAC/CA,EAEAC,CAER,EACD,MAAO,CACN,GAAGF,EACH,QAASG,CAAA,CAEX,CAAC,EACD3C,IACC,CACC,aAAcoD,EAAY,MAC1B,YAAaA,EAAY,WAAA,EAE1B,cACAtD,CAAA,EAEDqB,IAA2ByB,IACnB,CACN,GAAGA,EACH,MAAOL,CAAA,EAER,CACF,SAAWxC,EAAO,OAAS,cAAe,CACzC,MAAMwC,EAAUF,EAAa,MAAM,IAAKG,GAAS,CAIhD,IAAIC,EAHYD,EAAK,QAAQ,OAC3BE,GAAQA,EAAI,OAAS,aAAA,EAEK5C,CAAiB,EAC7C2C,EAAgB,CACf,GAAGA,EACH,SAAUU,EAAa,MACvB,OAAQA,EAAa,KAAA,EAEtB,MAAMR,EAAiBH,EAAK,QAAQ,IAAKE,GAEvCA,EAAI,OAAS,eACbA,GAAK,OAASD,GAAe,KAEtBA,EAEAC,CAER,EACD,MAAO,CACN,GAAGF,EACH,QAASG,CAAA,CAEX,CAAC,EACD1C,IACC,CACC,SAAUkD,EAAa,MACvB,OAAQA,EAAa,KAAA,EAEtB,cACArD,CAAA,EAEDqB,IAA2ByB,IACnB,CACN,GAAGA,EACH,MAAOL,CAAA,EAER,CACF,CACA,MACD,CACA,IAAIO,EACJ,GAAI/C,EAAO,OAAS,MAAO,CAI1B,IAAI8C,EAHiB3C,EAAoB,QAAQ,OAC/CwC,GAAQA,EAAI,OAAS,KAAA,EAEQ5C,CAAiB,EAChD+C,EAAc,CACb,GAAGA,EACH,eAAgBM,EAAa,YAC7B,QAAS,CAACA,GAAc,OAAS,mBAAmB,CAAA,EAErDL,EAAmB5C,EAAoB,QAAQ,IAAKwC,GAC/CA,EAAI,OAAS,OAASA,GAAK,OAASG,GAAa,KAC7CA,EAEAH,CAER,EACD1C,IACC,CACC,aAAcoD,EAAY,MAC1B,YAAaA,EAAY,WAAA,EAE1B,cACAtD,CAAA,CAEF,KAAO,CAIN,IAAIuD,EAHiBnD,EAAoB,QAAQ,OAC/CwC,GAAQA,EAAI,OAAS,aAAA,EAEQ5C,CAAiB,EAChDuD,EAAc,CACb,GAAGA,EACH,SAAUF,EAAa,MACvB,OAAQA,EAAa,KAAA,EAEtBL,EAAmB5C,EAAoB,QAAQ,IAAKwC,GAC/CA,EAAI,OAAS,eAAiBA,GAAK,OAASW,GAAa,KACrDA,EAEAX,CAER,EACDzC,IACC,CACC,SAAUkD,EAAa,MACvB,OAAQA,EAAa,KAAA,EAEtB,cACArD,CAAA,CAEF,CACA,MAAMyC,EAAU,CACf,GAAItB,GAAyB,MAAaA,EAAwB,GAC9DC,EAA2D,MAC5DD,CACA,EACCC,CAAA,EAGL,GADAqB,EAAQ,QAAUO,EACd7B,GAAyB,MAAaA,EAAwB,GAAI,CACrE,MAAM8B,EAAW,CAChB,GAAI7B,EACF,KAAA,EAEH6B,EAAS9B,CAAqB,EAAIsB,EAClCpB,IAA2ByB,IACnB,CACN,GAAGA,EACH,MAAOG,CAAA,EAER,CACF,MACC5B,IAA2ByB,IACnB,CACN,GAAGA,EACH,QAAS,CAAC,GAAGE,CAAgB,CAAA,EAE9B,CAEH,MACCX,EAAiB,EAAE,CAGtB,CAEA,OAAInB,IAAQsC,EAAAA,IAAI,iBAEbC,YAAA,CACA,SAAA,CAAAC,EAAAA,OAAC,MAAA,CACA,MAAO,CACN,aAAc,CAAA,EAGf,SAAAA,EAAAA,OAACC,EAAAA,cAAA,CACA,MAAO,CACN,MAAOC,EAAAA,OAAO,QAAQ,OAAA,EAGtB,SAAA,CAAA3D,EAAO,KAAK,SAAA,CAAA,EALd,OAAA,GAAA,CAAA,SAAA,2KAAA,WAAA,IAAA,aAAA,CAAA,EAAA4D,MAAA,CAMA,EAXD,OAAA,GAAA,CAAA,SAAA,2KAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MAAA,EAcAH,EAAAA,OAAC,MAAA,CACA,MAAO,CACN,aAAc,EAAA,EAGf,SAAAA,EAAAA,OAACI,EAAAA,SAAA,CACA,SAAU7C,GAAuBV,EACjC,cAAe,GACf,QACCN,EAAO,OAAS,MACbU,GAAgB,QAAU,cACzB,CAACoB,EAAAA,qBAAqB,EACrBlB,EACDE,EAEL,aAAc,GACd,SACCmC,EAID,eACCvC,EACG,CAAC,CAAE,GAAGA,EAAgB,SAAU,EAAA,CAAwB,EACxD,CAAA,EAEJ,MAAOK,EAAUO,IAAmBvB,CAAiB,EAAI,MAAA,EArB1D,OAAA,GAAA,CAAA,SAAA,2KAAA,WAAA,IAAA,aAAA,CAAA,EAAA6D,MAAA,CAsBA,EA3BD,OAAA,GAAA,CAAA,SAAA,2KAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MAAA,GA8BElD,GAAgB,QAAU,eAC3BA,GAAgB,QAAU,gBAC1B+C,EAAAA,OAAC,MAAA,CAAI,MAAO,CAAE,aAAc,EAAA,EAC3B,SAAAA,EAAAA,OAACK,EAAAA,MAAA,CACA,MAAO9C,GAAuBV,EAAc,WAAa,OACzD,aACCS,EACIR,EAECwD,EAAAA,cAAcxD,CAAU,EAEzB,GADA,kBAFA,iBAID,GAEJ,MAAOA,EACP,WAAY,WACZ,YAAa,wBACb,aAAc6B,EACd,aAAc,GAAA,EAff,OAAA,GAAA,CAAA,SAAA,2KAAA,WAAA,IAAA,aAAA,CAAA,EAAAwB,MAAA,CAgBA,EAjBD,OAAA,GAAA,CAAA,SAAA,2KAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MAkBA,CAAA,CAAA,EAjEF,OAAA,GAAA,CAAA,SAAA,2KAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MAmEA,EAIAH,EAAAA,OAACO,EAAAA,QAAA,CAEA,MAAOjE,EACP,SAAU,CACT,aAAcC,EAAO,MAAQ,GAC7B,aACCA,EAAO,iBAAmB,4BACvB,GAAGA,EAAO,UAAU,CAAC,CAAC,GACtBA,EAAO,gBAAkB,GAC7B,KAAM,OACN,mBAAoB,GACpB,MAAOA,EAAO,OAAS,EACvB,YAAaA,EAAO,aAAe,CAAA,CAAC,EAErC,kBAAmB,GACnB,cAAe,UACf,WAAYA,EAAO,KACnB,WAAAI,CAAA,EAjBD,OAAA,GAAA,CAAA,SAAA,2KAAA,WAAA,IAAA,aAAA,CAAA,EAAAwD,MAAA,CAqBH"}
+{"version":3,"file":"WhatsAppTemplateCardButtonV2.js","sources":["../../../../../src/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.tsx"],"sourcesContent":["import cloneDeep from 'lodash/cloneDeep';\nimport { useEffect, useState } from 'react';\nimport { Dropdown } from '@src/components/dropdown/Dropdown';\nimport type { DropdownOption, SingleOption } from '@src/components/dropdown/type';\nimport { Input } from '@src/components/input/Input';\nimport { editableVarPattern } from '@src/components/template-preview/constants/regexPatterns';\nimport {\n\tButtonPlaceHolderOptions,\n\tCUSTOM_URL_NAME,\n\tSTATIC_URL_CTA_OPTION,\n\tUNSUBSCRIBE_URL_OPTION,\n} from '@src/components/template-preview/models/TemplateMeta';\nimport type { WhatsAppCarouselTemplateVariables } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport {\n\ttype CTABtnValType,\n\tPOD,\n\ttype QRBBtnValType,\n\ttype TEMPLATE_BUTTON,\n} from '@src/components/template-preview/models/WhatsAppTemplate';\nimport type { WhatsAppTemplateVariables } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport {\n\tSTATIC_URL_VARIABLE_NAME,\n\tUNSUBSCRIBE_URL_VARIABLE,\n} from '../utils/constants';\nimport { validateIsUrl } from '../utils/validateIsUrl';\nimport VariableConnector, { Container } from './VariableConnector';\n\nexport type URLBtnUpdateFunctionType = (\n\tval: CTABtnValType,\n\tmode: 'custom' | 'placeholder',\n\tbtnIndex?: number,\n) => void;\n\nexport type QRBBtnUpdateFunctionType = (\n\tval: QRBBtnValType,\n\tmode: 'custom' | 'placeholder',\n\tbtnIndex?: number,\n) => void;\n\ntype optionType = SingleOption & {\n\tplaceHolder: string;\n};\nexport interface WhatsAppTemplateCardButtonV2Props {\n\tcurrentVariableList: WhatsAppTemplateVariables;\n\tupdateSelectedURLTemplateBtn?: URLBtnUpdateFunctionType;\n\tupdateSelectedQRBTemplateBtn?: QRBBtnUpdateFunctionType;\n\tbutton: TEMPLATE_BUTTON;\n\tCTAoptions?: ButtonPlaceHolderOptions[];\n\tQRBoptions?: ButtonPlaceHolderOptions[];\n\tvariableListIndex: number;\n\tdisableEdit?: boolean;\n}\nconst WhatsAppTemplateCardButtonV2: React.FC<\n\tWhatsAppTemplateCardButtonV2Props\n> = ({\n\tvariableListIndex,\n\tbutton,\n\tupdateSelectedURLTemplateBtn,\n\tupdateSelectedQRBTemplateBtn,\n\tcurrentVariableList,\n\tCTAoptions,\n\tQRBoptions,\n\tdisableEdit,\n}) => {\n\tconst [customLink, setCustomLink] = useState('');\n\tconst [selectedOption, setSelectedOption] = useState<SingleOption>();\n\n\t// Updating the selected attribute in the options so that in dropdown the option will be highlighted\n\tconst updatedCTAOptions = CTAoptions?.map((option) => {\n\t\treturn {\n\t\t\t...option,\n\t\t\tselected:\n\t\t\t\tselectedOption?.value === option.value &&\n\t\t\t\tselectedOption.label === option.label,\n\t\t};\n\t});\n\tconst updatedQRBOptions = QRBoptions?.map((option) => {\n\t\treturn {\n\t\t\t...option,\n\t\t\tselected: selectedOption?.value === option.value,\n\t\t};\n\t});\n\n\tconst {\n\t\tisError,\n\t\tdisableEditVariable,\n\t\tpod,\n\t\tselectedCarouselIndex,\n\t\toriginalVariableList,\n\t\tsetOriginalVariableList,\n\t\tisProductCarouselType,\n\t\tctaOptionsErrors,\n\t\tsetCtaOptionsErrors,\n\t} = useTemplateModalContext();\n\n\tuseEffect(() => {\n\t\tif (button.buttonVariable === UNSUBSCRIBE_URL_VARIABLE) {\n\t\t\tsetSelectedOption(UNSUBSCRIBE_URL_OPTION);\n\t\t\tsetCustomLink(button.example?.[0].split('https://')[1] || '');\n\t\t\treturn;\n\t\t}\n\t\tif (\n\t\t\tbutton.buttonVariable &&\n\t\t\teditableVarPattern.test(button.buttonVariable)\n\t\t) {\n\t\t\tif (button.buttonVariable === STATIC_URL_VARIABLE_NAME) {\n\t\t\t\tsetSelectedOption(STATIC_URL_CTA_OPTION);\n\t\t\t} else {\n\t\t\t\tsetSelectedOption(CUSTOM_URL_NAME);\n\t\t\t}\n\t\t\tsetCustomLink(button.example?.[0].split('https://')[1] || '');\n\t\t} else {\n\t\t\tlet index = -1;\n\t\t\tconst options =\n\t\t\t\tbutton.type === 'URL'\n\t\t\t\t\t? (CTAoptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t: (QRBoptions as ButtonPlaceHolderOptions[]);\n\t\t\tif (button.type === 'URL') {\n\t\t\t\tindex = options.findIndex(\n\t\t\t\t\t(op) => op.placeHolder === button.buttonVariable,\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tindex = options.findIndex((op) => op.label === button.flowName);\n\t\t\t}\n\n\t\t\tif (index > -1) {\n\t\t\t\tsetSelectedOption(options[index]);\n\t\t\t} else {\n\t\t\t\tsetCtaOptionsErrors?.((prevState) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...prevState,\n\t\t\t\t\t\t[variableListIndex]: 'Required field!',\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t}\n\t\t}\n\t}, []);\n\n\tfunction handleCustomLink(text: string) {\n\t\tsetCustomLink(text);\n\t\tif (\n\t\t\tselectedCarouselIndex != undefined &&\n\t\t\tselectedCarouselIndex > -1 &&\n\t\t\tisProductCarouselType\n\t\t) {\n\t\t\tconst originalList = cloneDeep(\n\t\t\t\toriginalVariableList as WhatsAppCarouselTemplateVariables,\n\t\t\t);\n\t\t\tif (button.type === 'URL') {\n\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\tconst urlBtns = card.buttons.filter((btn) => btn.type === 'URL');\n\t\t\t\t\tlet currentButton = urlBtns[variableListIndex];\n\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\tbuttonVariable: '((customPlaceholderName))',\n\t\t\t\t\t\texample: [`https://${text}`],\n\t\t\t\t\t};\n\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === currentButton?.text) {\n\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...card,\n\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...pre,\n\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t};\n\t\t\t\t});\n\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t`https://${text}`,\n\t\t\t\t\t'custom',\n\t\t\t\t\tvariableListIndex,\n\t\t\t\t);\n\t\t\t}\n\t\t\treturn;\n\t\t}\n\t\tconst urlVariables = currentVariableList.buttons.filter(\n\t\t\t(btn) => btn.type === 'URL',\n\t\t);\n\t\tlet urlVariable = urlVariables[variableListIndex];\n\t\turlVariable = {\n\t\t\t...urlVariable,\n\t\t\tbuttonVariable: '((customPlaceholderName))',\n\t\t\texample: [`https://${text}`],\n\t\t};\n\t\tconst updatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\tif (btn.type === 'URL' && btn?.text === urlVariable?.text) {\n\t\t\t\treturn urlVariable;\n\t\t\t} else {\n\t\t\t\treturn btn;\n\t\t\t}\n\t\t});\n\t\tconst newList = {\n\t\t\t...(selectedCarouselIndex != undefined && selectedCarouselIndex > -1\n\t\t\t\t? (originalVariableList as WhatsAppCarouselTemplateVariables).cards[\n\t\t\t\t\t\tselectedCarouselIndex\n\t\t\t\t  ]\n\t\t\t\t: (originalVariableList as WhatsAppTemplateVariables)),\n\t\t};\n\t\tnewList.buttons = updatedVariables;\n\t\tif (selectedCarouselIndex != undefined && selectedCarouselIndex > -1) {\n\t\t\tconst cardList = [\n\t\t\t\t...(originalVariableList as WhatsAppCarouselTemplateVariables).cards,\n\t\t\t];\n\t\t\tcardList[selectedCarouselIndex] = newList;\n\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\treturn {\n\t\t\t\t\t...pre,\n\t\t\t\t\tcards: cardList,\n\t\t\t\t};\n\t\t\t});\n\t\t} else {\n\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\treturn {\n\t\t\t\t\t...pre,\n\t\t\t\t\tbuttons: [...updatedVariables],\n\t\t\t\t};\n\t\t\t});\n\t\t}\n\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t`https://${text}`,\n\t\t\t'custom',\n\t\t\tvariableListIndex,\n\t\t);\n\t}\n\n\tfunction handleSelectOnChange(\n\t\toptionName: SingleOption | SingleOption[],\n\t\tselectedIndex?: number,\n\t) {\n\t\tsetCtaOptionsErrors?.((prevState) => {\n\t\t\tdelete prevState[variableListIndex];\n\t\t\treturn {\n\t\t\t\t...prevState,\n\t\t\t};\n\t\t});\n\t\tconst singleOption = optionName as optionType;\n\t\tsetSelectedOption(singleOption);\n\t\tconst options =\n\t\t\tbutton.type === 'URL'\n\t\t\t\t? (CTAoptions as ButtonPlaceHolderOptions[])\n\t\t\t\t: (QRBoptions as ButtonPlaceHolderOptions[]);\n\t\tconst placeHolder = options.find(\n\t\t\t(option) => option.placeHolder === singleOption.placeHolder,\n\t\t);\n\t\tif (placeHolder) {\n\t\t\tif (placeHolder.value !== 'custom_link') {\n\t\t\t\tif (\n\t\t\t\t\tselectedCarouselIndex != undefined &&\n\t\t\t\t\tselectedCarouselIndex > -1 &&\n\t\t\t\t\tisProductCarouselType\n\t\t\t\t) {\n\t\t\t\t\tconst originalList = cloneDeep(\n\t\t\t\t\t\toriginalVariableList as WhatsAppCarouselTemplateVariables,\n\t\t\t\t\t);\n\t\t\t\t\tif (button.type === 'URL') {\n\t\t\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\t\t\tconst urlBtns = card.buttons.filter((btn) => btn.type === 'URL');\n\t\t\t\t\t\t\tlet currentButton = urlBtns[variableListIndex];\n\t\t\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\t\t\tbuttonVariable: singleOption.placeHolder,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === currentButton?.text) {\n\t\t\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...card,\n\t\t\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tdefaultValue: placeHolder.value,\n\t\t\t\t\t\t\t\tplaceHolder: placeHolder.placeHolder,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t\t);\n\t\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t} else if (button.type === 'QUICK_REPLY') {\n\t\t\t\t\t\tconst newList = originalList.cards.map((card) => {\n\t\t\t\t\t\t\tconst qrbBtns = card.buttons.filter(\n\t\t\t\t\t\t\t\t(btn) => btn.type === 'QUICK_REPLY',\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tlet currentButton = qrbBtns[variableListIndex];\n\t\t\t\t\t\t\tcurrentButton = {\n\t\t\t\t\t\t\t\t...currentButton,\n\t\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\tconst updatedButtons = card.buttons.map((btn) => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\tbtn.type === 'QUICK_REPLY' &&\n\t\t\t\t\t\t\t\t\tbtn?.text === currentButton?.text\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\treturn currentButton;\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...card,\n\t\t\t\t\t\t\t\tbuttons: updatedButtons,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t\tupdateSelectedQRBTemplateBtn?.(\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t\t);\n\t\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\t\tcards: newList,\n\t\t\t\t\t\t\t};\n\t\t\t\t\t\t});\n\t\t\t\t\t}\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tlet updatedVariables;\n\t\t\t\tif (button.type === 'URL') {\n\t\t\t\t\tconst urlVariables = currentVariableList.buttons.filter(\n\t\t\t\t\t\t(btn) => btn.type === 'URL',\n\t\t\t\t\t);\n\t\t\t\t\tlet urlVariable = urlVariables[variableListIndex];\n\t\t\t\t\turlVariable = {\n\t\t\t\t\t\t...urlVariable,\n\t\t\t\t\t\tbuttonVariable: singleOption.placeHolder,\n\t\t\t\t\t\texample: [singleOption?.value || 'https://d.bik.ai/'],\n\t\t\t\t\t};\n\t\t\t\t\tupdatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'URL' && btn?.text === urlVariable?.text) {\n\t\t\t\t\t\t\treturn urlVariable;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tupdateSelectedURLTemplateBtn?.(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tdefaultValue: placeHolder.value,\n\t\t\t\t\t\t\tplaceHolder: placeHolder.placeHolder,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t);\n\t\t\t\t} else {\n\t\t\t\t\tconst qrbVariables = currentVariableList.buttons.filter(\n\t\t\t\t\t\t(btn) => btn.type === 'QUICK_REPLY',\n\t\t\t\t\t);\n\t\t\t\t\tlet qrbVariable = qrbVariables[variableListIndex];\n\t\t\t\t\tqrbVariable = {\n\t\t\t\t\t\t...qrbVariable,\n\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t};\n\t\t\t\t\tupdatedVariables = currentVariableList.buttons.map((btn) => {\n\t\t\t\t\t\tif (btn.type === 'QUICK_REPLY' && btn?.text === qrbVariable?.text) {\n\t\t\t\t\t\t\treturn qrbVariable;\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\treturn btn;\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tupdateSelectedQRBTemplateBtn?.(\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tflowName: singleOption.label,\n\t\t\t\t\t\t\tflowId: singleOption.value,\n\t\t\t\t\t\t},\n\t\t\t\t\t\t'placeholder',\n\t\t\t\t\t\tvariableListIndex,\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t\tconst newList = {\n\t\t\t\t\t...(selectedCarouselIndex != undefined && selectedCarouselIndex > -1\n\t\t\t\t\t\t? (originalVariableList as WhatsAppCarouselTemplateVariables).cards[\n\t\t\t\t\t\t\t\tselectedCarouselIndex\n\t\t\t\t\t\t  ]\n\t\t\t\t\t\t: (originalVariableList as WhatsAppTemplateVariables)),\n\t\t\t\t};\n\t\t\t\tnewList.buttons = updatedVariables;\n\t\t\t\tif (selectedCarouselIndex != undefined && selectedCarouselIndex > -1) {\n\t\t\t\t\tconst cardList = [\n\t\t\t\t\t\t...(originalVariableList as WhatsAppCarouselTemplateVariables)\n\t\t\t\t\t\t\t.cards,\n\t\t\t\t\t];\n\t\t\t\t\tcardList[selectedCarouselIndex] = newList;\n\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\tcards: cardList,\n\t\t\t\t\t\t};\n\t\t\t\t\t});\n\t\t\t\t} else {\n\t\t\t\t\tsetOriginalVariableList?.((pre) => {\n\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t...pre,\n\t\t\t\t\t\t\tbuttons: [...updatedVariables],\n\t\t\t\t\t\t};\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t} else {\n\t\t\t\thandleCustomLink('');\n\t\t\t}\n\t\t}\n\t}\n\n\tif (pod !== POD.CHATBOT) {\n\t\treturn (\n\t\t\t<Container>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 8,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tcolor: COLORS.content.primary,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{button.text} button\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 12,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Dropdown\n\t\t\t\t\t\tdisabled={disableEditVariable || disableEdit}\n\t\t\t\t\t\ttruncatedText={false}\n\t\t\t\t\t\toptions={\n\t\t\t\t\t\t\tbutton.type === 'URL'\n\t\t\t\t\t\t\t\t? selectedOption?.value === 'static_link'\n\t\t\t\t\t\t\t\t\t? [STATIC_URL_CTA_OPTION]\n\t\t\t\t\t\t\t\t\t: (updatedCTAOptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t\t\t\t: (updatedQRBOptions as ButtonPlaceHolderOptions[])\n\t\t\t\t\t\t}\n\t\t\t\t\t\tisSearchable={true}\n\t\t\t\t\t\tonSelect={\n\t\t\t\t\t\t\thandleSelectOnChange as (\n\t\t\t\t\t\t\t\toption: DropdownOption | DropdownOption[],\n\t\t\t\t\t\t\t) => void\n\t\t\t\t\t\t}\n\t\t\t\t\t\tdefaultOptions={\n\t\t\t\t\t\t\tselectedOption\n\t\t\t\t\t\t\t\t? [{ ...selectedOption, selected: true } as DropdownOption]\n\t\t\t\t\t\t\t\t: []\n\t\t\t\t\t\t}\n\t\t\t\t\t\terror={isError ? ctaOptionsErrors?.[variableListIndex] : undefined}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\n\t\t\t\t{(selectedOption?.value === 'custom_link' ||\n\t\t\t\t\tselectedOption?.value === 'static_link') && (\n\t\t\t\t\t<div style={{ marginBottom: 20 }}>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tstate={disableEditVariable || disableEdit ? 'disabled' : 'none'}\n\t\t\t\t\t\t\terrorMessage={\n\t\t\t\t\t\t\t\tisError\n\t\t\t\t\t\t\t\t\t? !customLink\n\t\t\t\t\t\t\t\t\t\t? 'Required field'\n\t\t\t\t\t\t\t\t\t\t: !validateIsUrl(customLink)\n\t\t\t\t\t\t\t\t\t\t? 'Enter valid URL'\n\t\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t\t\t: ''\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={customLink}\n\t\t\t\t\t\t\tprefixText={'https://'}\n\t\t\t\t\t\t\tplaceholder={'Enter custom URL here'}\n\t\t\t\t\t\t\tonChangeText={handleCustomLink}\n\t\t\t\t\t\t\tmaxCharLimit={2000}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Container>\n\t\t);\n\t} else {\n\t\treturn (\n\t\t\t<VariableConnector\n\t\t\t\t// this index is respect to template variables -> buttons\n\t\t\t\tindex={variableListIndex}\n\t\t\t\tvariable={{\n\t\t\t\t\tvariableName: button.text ?? '',\n\t\t\t\t\tupdatedValue:\n\t\t\t\t\t\tbutton.buttonVariable === '((customPlaceholderName))' //hardcoded for backward compatibility\n\t\t\t\t\t\t\t? `${button.example?.[0]}`\n\t\t\t\t\t\t\t: button.buttonVariable ?? '',\n\t\t\t\t\ttype: 'link', // since this is a url, type will be link\n\t\t\t\t\tisEditableVariable: true,\n\t\t\t\t\tindex: button.index ?? 0, // this index is respect to components -> buttons\n\t\t\t\t\tqueryParams: button.queryParams ?? [],\n\t\t\t\t}}\n\t\t\t\tshowVariableModal={true}\n\t\t\t\tcomponentType={'BUTTONS'}\n\t\t\t\tbuttonType={button.type}\n\t\t\t\tCTAoptions={CTAoptions} // dropdown values - for readable display name of variable in backward compatibility\n\t\t\t/>\n\t\t);\n\t}\n};\n\nexport default WhatsAppTemplateCardButtonV2;\n"],"names":["WhatsAppTemplateCardButtonV2","variableListIndex","button","updateSelectedURLTemplateBtn","updateSelectedQRBTemplateBtn","currentVariableList","CTAoptions","QRBoptions","disableEdit","customLink","setCustomLink","useState","selectedOption","setSelectedOption","updatedCTAOptions","option","updatedQRBOptions","isError","disableEditVariable","pod","selectedCarouselIndex","originalVariableList","setOriginalVariableList","isProductCarouselType","ctaOptionsErrors","setCtaOptionsErrors","useTemplateModalContext","useEffect","UNSUBSCRIBE_URL_VARIABLE","UNSUBSCRIBE_URL_OPTION","editableVarPattern","STATIC_URL_VARIABLE_NAME","STATIC_URL_CTA_OPTION","CUSTOM_URL_NAME","index","options","op","prevState","handleCustomLink","text","originalList","cloneDeep","newList","card","currentButton","btn","updatedButtons","pre","urlVariable","updatedVariables","cardList","handleSelectOnChange","optionName","selectedIndex","singleOption","placeHolder","qrbVariable","POD","Container","jsxDEV","BodySecondary","COLORS","this","Dropdown","Input","validateIsUrl","VariableConnector"],"mappings":"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"}

package/dist/cjs/components/template-preview/EmailTemplateThumbnailPreview.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-dev-runtime"),u=require("../TypographyStyle.js"),n=require("./EmailTemplatePreview.styled.js"),b=require("../button/Button.js"),m="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c",d=r=>{const i=/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##orderProducts}}<\/span><span>\s*<\/span>/g,a=/src="<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{product.photoUrl}}<\/span><span> <\/span>"/g,t=/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/orderProducts}}<\/span><span>\s*<\/span>/g,s=/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##abandonedCartProducts}}<\/span><span>\s*<\/span>/g,o=/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/abandonedCartProducts}}<\/span><span>\s*<\/span>/g;return r.replace(i,"").replace(a,`src=${m}`).replace(t,"").replace(s,"").replace(o,"")},v=({template:r,handleViewTemplate:i,hideHeader:a,hideViewButton:t,containerStyle:s,emailHtmlContainerId:o,emailDisplayContent:l,applyBorderBottom:p,hidePointerEvents:c})=>e.jsxDEV(n.EmailContainer,{hideHeader:a,style:{...s??{}},children:[!a&&e.jsxDEV(n.Header,{children:e.jsxDEV(u.TitleRegular,{style:{maxWidth:"100%"},children:r.name},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:67,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:66,columnNumber:5},void 0),e.jsxDEV(n.IframeContainer,{applyBorderBottom:p,children:l?e.jsxDEV("iframe",{title:"Email template preview",id:o??"",width:"100%",srcDoc:d(l),height:"100%",style:{pointerEvents:c?void 0:"none"}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:75,columnNumber:6},void 0):e.jsxDEV(n.ImageContainer,{hideHeader:a,children:e.jsxDEV(n.CardLoadingContainer,{},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:93,columnNumber:7},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:86,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:73,columnNumber:4},void 0),!t&&e.jsxDEV(n.ViewButton,{children:e.jsxDEV(b.Button,{buttonType:"tertiary",buttonText:"View",onClick:()=>{i&&i()}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:108,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:107,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:59,columnNumber:3},void 0);exports.DEFAULT_IMAGE=m;exports.default=v;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-dev-runtime"),d=require("../TypographyStyle.js"),n=require("./EmailTemplatePreview.styled.js"),u=require("../button/Button.js"),m="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c",b=i=>{const o=/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##orderProducts}}<\/span><span>\s*<\/span>/g,a=/src="<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{product.photoUrl}}<\/span><span> <\/span>"/g,r=/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/orderProducts}}<\/span><span>\s*<\/span>/g,s=/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{##abandonedCartProducts}}<\/span><span>\s*<\/span>/g,t=/<span><\/span><span style="color: #731DCF; text-decoration: underline;">{{\/\/abandonedCartProducts}}<\/span><span>\s*<\/span>/g;return i.replace(o,"").replace(a,`src=${m}`).replace(r,"").replace(s,"").replace(t,"")},v=({template:i,handleViewTemplate:o,hideHeader:a,hideViewButton:r,containerStyle:s,emailHtmlContainerId:t,emailDisplayContent:l,applyBorderBottom:p,hidePointerEvents:c})=>e.jsxDEV(n.EmailContainer,{hideHeader:a,style:{...s??{}},children:[!a&&e.jsxDEV(n.Header,{children:e.jsxDEV(d.TitleRegular,{style:{maxWidth:"100%"},children:i.name},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:67,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:66,columnNumber:5},void 0),e.jsxDEV(n.IframeContainer,{applyBorderBottom:p,children:l?e.jsxDEV("iframe",{title:"Email template preview",id:t??"",width:"100%",srcDoc:b(l),height:"100%",style:{pointerEvents:c?void 0:"none"}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:75,columnNumber:6},void 0):e.jsxDEV(n.ImageContainer,{hideHeader:a,children:e.jsxDEV(n.CardLoadingContainer,{},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:93,columnNumber:7},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:86,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:73,columnNumber:4},void 0),!r&&e.jsxDEV(n.ViewButton,{children:e.jsxDEV(u.Button,{buttonType:"tertiary",buttonText:"View",onClick:()=>{o&&o()}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:108,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:107,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/EmailTemplateThumbnailPreview.tsx",lineNumber:59,columnNumber:3},void 0);exports.DEFAULT_IMAGE=m;exports.default=v;
 //# sourceMappingURL=EmailTemplateThumbnailPreview.js.map

package/dist/cjs/components/template-preview/EmailTemplateThumbnailPreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"EmailTemplateThumbnailPreview.js","sources":["../../../../src/components/template-preview/EmailTemplateThumbnailPreview.tsx"],"sourcesContent":["import React from 'react';\nimport { CSSProperties } from 'styled-components';\nimport { Button } from '../button';\nimport { TitleRegular } from '../TypographyStyle';\nimport {\n\tCardLoadingContainer,\n\tEmailContainer,\n\tHeader,\n\tIframeContainer,\n\tImageContainer,\n\tViewButton,\n} from './EmailTemplatePreview.styled';\nimport { EmailTemplateType } from './models/EmailTemplate';\n\nexport const DEFAULT_IMAGE =\n\t'https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c';\n\nconst sanitiseEmailContent = (content: string) => {\n\tconst toRemove =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{##orderProducts}}<\\/span><span>\\s*<\\/span>/g;\n\tconst imageReplace =\n\t\t/src=\"<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{product.photoUrl}}<\\/span><span> <\\/span>\"/g;\n\tconst toRemove2 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{\\/\\/orderProducts}}<\\/span><span>\\s*<\\/span>/g;\n\tconst toRemove3 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{##abandonedCartProducts}}<\\/span><span>\\s*<\\/span>/g;\n\tconst toRemove4 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{\\/\\/abandonedCartProducts}}<\\/span><span>\\s*<\\/span>/g;\n\treturn content\n\t\t.replace(toRemove, '')\n\t\t.replace(imageReplace, `src=${DEFAULT_IMAGE}`)\n\t\t.replace(toRemove2, '')\n\t\t.replace(toRemove3, '')\n\t\t.replace(toRemove4, '');\n};\n\nconst EmailTemplateThumbnailPreview: React.FC<{\n\ttemplate: EmailTemplateType;\n\thideHeader?: boolean;\n\thandleViewTemplate: () => void;\n\thideViewButton?: boolean;\n\tcontainerStyle?: CSSProperties;\n\temailHtmlContainerId?: string;\n\temailDisplayContent?: string;\n\tapplyBorderBottom?: boolean;\n\thidePointerEvents?: boolean;\n}> = ({\n\ttemplate,\n\thandleViewTemplate,\n\thideHeader,\n\thideViewButton,\n\tcontainerStyle,\n\temailHtmlContainerId,\n\temailDisplayContent,\n\tapplyBorderBottom,\n\thidePointerEvents,\n}) => {\n\treturn (\n\t\t<EmailContainer\n\t\t\thideHeader={hideHeader}\n\t\t\tstyle={{\n\t\t\t\t...(containerStyle ?? {}),\n\t\t\t}}\n\t\t>\n\t\t\t{!hideHeader && (\n\t\t\t\t<Header>\n\t\t\t\t\t<TitleRegular style={{ maxWidth: '100%' }}>\n\t\t\t\t\t\t{template.name}\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t</Header>\n\t\t\t)}\n\n\t\t\t<IframeContainer applyBorderBottom={applyBorderBottom}>\n\t\t\t\t{emailDisplayContent ? (\n\t\t\t\t\t<iframe\n\t\t\t\t\t\ttitle=\"Email template preview\"\n\t\t\t\t\t\tid={emailHtmlContainerId ?? ''}\n\t\t\t\t\t\twidth={'100%'}\n\t\t\t\t\t\tsrcDoc={sanitiseEmailContent(emailDisplayContent)}\n\t\t\t\t\t\theight={'100%'}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpointerEvents: hidePointerEvents ? undefined : 'none',\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<ImageContainer hideHeader={hideHeader}>\n\t\t\t\t\t\t{/* <img\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tsrc={template.thumbnailUrl}\n\t\t\t\t\t\tstyle={{ objectFit: 'contain', width: '100%' }}\n\t\t\t\t\t/> */}\n\t\t\t\t\t\t{/* <Spinner size={'small'} /> */}\n\t\t\t\t\t\t<CardLoadingContainer />\n\t\t\t\t\t</ImageContainer>\n\t\t\t\t\t// <div\n\t\t\t\t\t// \tstyle={{\n\t\t\t\t\t// \t\tdisplay: 'flex',\n\t\t\t\t\t// \t\tjustifyContent: 'center',\n\t\t\t\t\t// \t\talignItems: 'center',\n\t\t\t\t\t// \t\theight: 40,\n\t\t\t\t\t// \t}}\n\t\t\t\t\t// >\n\t\t\t\t\t// </div>\n\t\t\t\t)}\n\t\t\t</IframeContainer>\n\t\t\t{!hideViewButton && (\n\t\t\t\t<ViewButton>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonType=\"tertiary\"\n\t\t\t\t\t\tbuttonText=\"View\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\thandleViewTemplate && handleViewTemplate();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</ViewButton>\n\t\t\t)}\n\t\t</EmailContainer>\n\t);\n};\n\nexport default EmailTemplateThumbnailPreview;\n"],"names":["DEFAULT_IMAGE","sanitiseEmailContent","content","toRemove","imageReplace","toRemove2","toRemove3","toRemove4","EmailTemplateThumbnailPreview","template","handleViewTemplate","hideHeader","hideViewButton","containerStyle","emailHtmlContainerId","emailDisplayContent","applyBorderBottom","hidePointerEvents","jsxDEV","EmailContainer","Header","TitleRegular","this","IframeContainer","ImageContainer","CardLoadingContainer","ViewButton","Button"],"mappings":"uQAcaA,EACZ,+KAEKC,EAAwBC,GAAoB,CACjD,MAAMC,EACL,wHACKC,EACL,6HACKC,EACL,0HACKC,EACL,gIACKC,EACL,kIACD,OAAOL,EACL,QAAQC,EAAU,EAAE,EACpB,QAAQC,EAAc,OAAOJ,CAAa,EAAE,EAC5C,QAAQK,EAAW,EAAE,EACrB,QAAQC,EAAW,EAAE,EACrB,QAAQC,EAAW,EAAE,CACxB,EAEMC,EAUD,CAAC,CACL,SAAAC,EACA,mBAAAC,EACA,WAAAC,EACA,eAAAC,EACA,eAAAC,EACA,qBAAAC,EACA,oBAAAC,EACA,kBAAAC,EACA,kBAAAC,CACD,IAEEC,EAAAA,OAACC,EAAAA,eAAA,CACA,WAAAR,EACA,MAAO,CACN,GAAIE,GAAkB,CAAA,CAAC,EAGvB,SAAA,CAAA,CAACF,GACDO,EAAAA,OAACE,EAAAA,OAAA,CACA,SAAAF,EAAAA,OAACG,EAAAA,aAAA,CAAa,MAAO,CAAE,SAAU,MAAA,EAC/B,SAAAZ,EAAS,IAAA,EADX,OAAA,GAAA,CAAA,SAAA,uJAAA,WAAA,GAAA,aAAA,CAAA,EAAAa,MAEA,CAAA,EAHD,OAAA,GAAA,CAAA,SAAA,uJAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAIA,EAGDJ,EAAAA,OAACK,EAAAA,gBAAA,CAAgB,kBAAAP,EACf,SAAAD,EACAG,EAAAA,OAAC,SAAA,CACA,MAAM,yBACN,GAAIJ,GAAwB,GAC5B,MAAO,OACP,OAAQb,EAAqBc,CAAmB,EAChD,OAAQ,OACR,MAAO,CACN,cAAeE,EAAoB,OAAY,MAAA,CAChD,EARD,OAAA,GAAA,CAAA,SAAA,uJAAA,WAAA,GAAA,aAAA,CAAA,EAAAK,MAAA,EAWAJ,EAAAA,OAACM,iBAAA,CAAe,WAAAb,EAOf,kBAACc,uBAAA,CAAA,EAAD,OAAA,GAAA,CAAA,SAAA,uJAAA,WAAA,GAAA,aAAA,CAAA,EAAAH,MAAsB,CAAA,EAPvB,OAAA,GAAA,CAAA,SAAA,uJAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAQA,CAAA,EArBF,OAAA,GAAA,CAAA,SAAA,uJAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAgCA,EACC,CAACV,GACDM,EAAAA,OAACQ,aAAA,CACA,SAAAR,EAAAA,OAACS,EAAAA,OAAA,CACA,WAAW,WACX,WAAW,OACX,QAAS,IAAM,CACdjB,GAAsBA,EAAA,CACvB,CAAA,EALD,OAAA,GAAA,CAAA,SAAA,uJAAA,WAAA,IAAA,aAAA,CAAA,EAAAY,MAAA,CAMA,EAPD,OAAA,GAAA,CAAA,SAAA,uJAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MAQA,CAAA,CAAA,EAxDF,OAAA,GAAA,CAAA,SAAA,uJAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA"}
+{"version":3,"file":"EmailTemplateThumbnailPreview.js","sources":["../../../../src/components/template-preview/EmailTemplateThumbnailPreview.tsx"],"sourcesContent":["import React from 'react';\nimport { CSSProperties } from 'styled-components';\nimport { Button } from '../button';\nimport { TitleRegular } from '../TypographyStyle';\nimport {\n\tCardLoadingContainer,\n\tEmailContainer,\n\tHeader,\n\tIframeContainer,\n\tImageContainer,\n\tViewButton,\n} from './EmailTemplatePreview.styled';\nimport { EmailTemplateType } from './models/EmailTemplate';\n\nexport const DEFAULT_IMAGE =\n\t'https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c';\n\nconst sanitiseEmailContent = (content: string) => {\n\tconst toRemove =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{##orderProducts}}<\\/span><span>\\s*<\\/span>/g;\n\tconst imageReplace =\n\t\t/src=\"<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{product.photoUrl}}<\\/span><span> <\\/span>\"/g;\n\tconst toRemove2 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{\\/\\/orderProducts}}<\\/span><span>\\s*<\\/span>/g;\n\tconst toRemove3 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{##abandonedCartProducts}}<\\/span><span>\\s*<\\/span>/g;\n\tconst toRemove4 =\n\t\t/<span><\\/span><span style=\"color: #731DCF; text-decoration: underline;\">{{\\/\\/abandonedCartProducts}}<\\/span><span>\\s*<\\/span>/g;\n\treturn content\n\t\t.replace(toRemove, '')\n\t\t.replace(imageReplace, `src=${DEFAULT_IMAGE}`)\n\t\t.replace(toRemove2, '')\n\t\t.replace(toRemove3, '')\n\t\t.replace(toRemove4, '');\n};\n\nconst EmailTemplateThumbnailPreview: React.FC<{\n\ttemplate: EmailTemplateType;\n\thideHeader?: boolean;\n\thandleViewTemplate: () => void;\n\thideViewButton?: boolean;\n\tcontainerStyle?: CSSProperties;\n\temailHtmlContainerId?: string;\n\temailDisplayContent?: string;\n\tapplyBorderBottom?: boolean;\n\thidePointerEvents?: boolean;\n}> = ({\n\ttemplate,\n\thandleViewTemplate,\n\thideHeader,\n\thideViewButton,\n\tcontainerStyle,\n\temailHtmlContainerId,\n\temailDisplayContent,\n\tapplyBorderBottom,\n\thidePointerEvents,\n}) => {\n\treturn (\n\t\t<EmailContainer\n\t\t\thideHeader={hideHeader}\n\t\t\tstyle={{\n\t\t\t\t...(containerStyle ?? {}),\n\t\t\t}}\n\t\t>\n\t\t\t{!hideHeader && (\n\t\t\t\t<Header>\n\t\t\t\t\t<TitleRegular style={{ maxWidth: '100%' }}>\n\t\t\t\t\t\t{template.name}\n\t\t\t\t\t</TitleRegular>\n\t\t\t\t</Header>\n\t\t\t)}\n\n\t\t\t<IframeContainer applyBorderBottom={applyBorderBottom}>\n\t\t\t\t{emailDisplayContent ? (\n\t\t\t\t\t<iframe\n\t\t\t\t\t\ttitle=\"Email template preview\"\n\t\t\t\t\t\tid={emailHtmlContainerId ?? ''}\n\t\t\t\t\t\twidth={'100%'}\n\t\t\t\t\t\tsrcDoc={sanitiseEmailContent(emailDisplayContent)}\n\t\t\t\t\t\theight={'100%'}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpointerEvents: hidePointerEvents ? undefined : 'none',\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<ImageContainer hideHeader={hideHeader}>\n\t\t\t\t\t\t{/* <img\n\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\tsrc={template.thumbnailUrl}\n\t\t\t\t\t\tstyle={{ objectFit: 'contain', width: '100%' }}\n\t\t\t\t\t/> */}\n\t\t\t\t\t\t{/* <Spinner size={'small'} /> */}\n\t\t\t\t\t\t<CardLoadingContainer />\n\t\t\t\t\t</ImageContainer>\n\t\t\t\t\t// <div\n\t\t\t\t\t// \tstyle={{\n\t\t\t\t\t// \t\tdisplay: 'flex',\n\t\t\t\t\t// \t\tjustifyContent: 'center',\n\t\t\t\t\t// \t\talignItems: 'center',\n\t\t\t\t\t// \t\theight: 40,\n\t\t\t\t\t// \t}}\n\t\t\t\t\t// >\n\t\t\t\t\t// </div>\n\t\t\t\t)}\n\t\t\t</IframeContainer>\n\t\t\t{!hideViewButton && (\n\t\t\t\t<ViewButton>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonType=\"tertiary\"\n\t\t\t\t\t\tbuttonText=\"View\"\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\thandleViewTemplate && handleViewTemplate();\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</ViewButton>\n\t\t\t)}\n\t\t</EmailContainer>\n\t);\n};\n\nexport default EmailTemplateThumbnailPreview;\n"],"names":["DEFAULT_IMAGE","sanitiseEmailContent","content","toRemove","imageReplace","toRemove2","toRemove3","toRemove4","EmailTemplateThumbnailPreview","template","handleViewTemplate","hideHeader","hideViewButton","containerStyle","emailHtmlContainerId","emailDisplayContent","applyBorderBottom","hidePointerEvents","jsxDEV","EmailContainer","Header","TitleRegular","this","IframeContainer","ImageContainer","CardLoadingContainer","ViewButton","Button"],"mappings":"uQAcaA,EACZ,+KAEKC,EAAwBC,GAAoB,CACjD,MAAMC,EACL,wHACKC,EACL,6HACKC,EACL,0HACKC,EACL,gIACKC,EACL,kIACD,OAAOL,EACL,QAAQC,EAAU,EAAE,EACpB,QAAQC,EAAc,OAAOJ,CAAa,EAAE,EAC5C,QAAQK,EAAW,EAAE,EACrB,QAAQC,EAAW,EAAE,EACrB,QAAQC,EAAW,EAAE,CACxB,EAEMC,EAUD,CAAC,CACL,SAAAC,EACA,mBAAAC,EACA,WAAAC,EACA,eAAAC,EACA,eAAAC,EACA,qBAAAC,EACA,oBAAAC,EACA,kBAAAC,EACA,kBAAAC,CACD,IAEEC,EAAAA,OAACC,EAAAA,eAAA,CACA,WAAAR,EACA,MAAO,CACN,GAAIE,GAAkB,CAAA,CAAC,EAGvB,SAAA,CAAA,CAACF,GACDO,EAAAA,OAACE,EAAAA,OAAA,CACA,SAAAF,EAAAA,OAACG,EAAAA,aAAA,CAAa,MAAO,CAAE,SAAU,MAAA,EAC/B,SAAAZ,EAAS,IAAA,EADX,OAAA,GAAA,CAAA,SAAA,wHAAA,WAAA,GAAA,aAAA,CAAA,EAAAa,MAEA,CAAA,EAHD,OAAA,GAAA,CAAA,SAAA,wHAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAIA,EAGDJ,EAAAA,OAACK,EAAAA,gBAAA,CAAgB,kBAAAP,EACf,SAAAD,EACAG,EAAAA,OAAC,SAAA,CACA,MAAM,yBACN,GAAIJ,GAAwB,GAC5B,MAAO,OACP,OAAQb,EAAqBc,CAAmB,EAChD,OAAQ,OACR,MAAO,CACN,cAAeE,EAAoB,OAAY,MAAA,CAChD,EARD,OAAA,GAAA,CAAA,SAAA,wHAAA,WAAA,GAAA,aAAA,CAAA,EAAAK,MAAA,EAWAJ,EAAAA,OAACM,iBAAA,CAAe,WAAAb,EAOf,kBAACc,uBAAA,CAAA,EAAD,OAAA,GAAA,CAAA,SAAA,wHAAA,WAAA,GAAA,aAAA,CAAA,EAAAH,MAAsB,CAAA,EAPvB,OAAA,GAAA,CAAA,SAAA,wHAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAQA,CAAA,EArBF,OAAA,GAAA,CAAA,SAAA,wHAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAgCA,EACC,CAACV,GACDM,EAAAA,OAACQ,aAAA,CACA,SAAAR,EAAAA,OAACS,EAAAA,OAAA,CACA,WAAW,WACX,WAAW,OACX,QAAS,IAAM,CACdjB,GAAsBA,EAAA,CACvB,CAAA,EALD,OAAA,GAAA,CAAA,SAAA,wHAAA,WAAA,IAAA,aAAA,CAAA,EAAAY,MAAA,CAMA,EAPD,OAAA,GAAA,CAAA,SAAA,wHAAA,WAAA,IAAA,aAAA,CAAA,EAAAA,MAQA,CAAA,CAAA,EAxDF,OAAA,GAAA,CAAA,SAAA,wHAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA"}

package/dist/cjs/components/template-preview/RCS/RCSButtons.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-dev-runtime"),i=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js"),d=({Icon:n,text:s,extraContent:t,placeholder:o,textTypography:l,size:a})=>{const c=l||i.BodySecondary;function p(m){return m.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,function(u){return u.toUpperCase()})}return e.jsxDEV(e.Fragment,{children:e.jsxDEV("div",{style:{textAlign:"center",maxWidth:"100%"},children:[e.jsxDEV("div",{style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"},children:[n&&e.jsxDEV(n,{color:r.COLORS.special.brand.facebook,height:16,width:16,style:{marginRight:8}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:37,columnNumber:7},void 0),e.jsxDEV("div",{style:{border:"1px solid #E0E0E0",width:"100%",borderRadius:30,padding:"8px 12px"},children:e.jsxDEV(c,{style:{color:r.COLORS.special.brand.facebook,textAlign:"center",fontSize:a==="small"?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"},children:s},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:53,columnNumber:7},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:45,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:28,columnNumber:5},void 0),!!t&&e.jsxDEV(i.Caption,{style:{marginTop:2,color:r.COLORS.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"},children:o?p(o):t},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:68,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:27,columnNumber:4},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:26,columnNumber:3},void 0)};exports.RCSButtons=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-dev-runtime"),i=require("../../TypographyStyle.js"),n=require("../../../constants/Theme.js"),u=({Icon:o,text:l,extraContent:r,placeholder:t,textTypography:s,size:a})=>{const c=s||i.BodySecondary;function d(p){return p.replace("[[","").replace("]]","").replace(/([A-Z])/g," $1").replace(/^./,function(m){return m.toUpperCase()})}return e.jsxDEV(e.Fragment,{children:e.jsxDEV("div",{style:{textAlign:"center",maxWidth:"100%"},children:[e.jsxDEV("div",{style:{display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center"},children:[o&&e.jsxDEV(o,{color:n.COLORS.special.brand.facebook,height:16,width:16,style:{marginRight:8}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:37,columnNumber:7},void 0),e.jsxDEV("div",{style:{border:"1px solid #E0E0E0",width:"100%",borderRadius:30,padding:"8px 12px"},children:e.jsxDEV(c,{style:{color:n.COLORS.special.brand.facebook,textAlign:"center",fontSize:a==="small"?12:14,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"},children:l},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:53,columnNumber:7},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:45,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:28,columnNumber:5},void 0),!!r&&e.jsxDEV(i.Caption,{style:{marginTop:2,color:n.COLORS.content.placeholder,textOverflow:"ellipsis",whiteSpace:"nowrap",overflow:"hidden"},children:t?d(t):r},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:68,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:27,columnNumber:4},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSButtons.tsx",lineNumber:26,columnNumber:3},void 0)};exports.RCSButtons=u;
 //# sourceMappingURL=RCSButtons.js.map

package/dist/cjs/components/template-preview/RCS/RCSButtons.js.map

@@ -1 +1 @@
-{"version":3,"file":"RCSButtons.js","sources":["../../../../../src/components/template-preview/RCS/RCSButtons.tsx"],"sourcesContent":["import React from 'react';\nimport { BodySecondary, Caption } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const RCSButtons: React.FC<{\n\tIcon?: React.FC<React.SVGProps<SVGSVGElement>>;\n\ttext: string;\n\textraContent?: string;\n\tplaceholder?: string;\n\ttextTypography?: React.FC;\n\tsize?: 'small' | 'large';\n}> = ({ Icon, text, extraContent, placeholder, textTypography, size }) => {\n\tconst TextTypographyComponent = textTypography || BodySecondary;\n\n\tfunction normaliseButtonPlaceholder(placeholder: string) {\n\t\tconst placeholderText = placeholder.replace('[[', '').replace(']]', '');\n\t\tconst placeHolderToDisplay = placeholderText\n\t\t\t.replace(/([A-Z])/g, ' $1')\n\t\t\t.replace(/^./, function (str) {\n\t\t\t\treturn str.toUpperCase();\n\t\t\t});\n\n\t\treturn placeHolderToDisplay;\n\t}\n\treturn (\n\t\t<>\n\t\t\t<div style={{ textAlign: 'center', maxWidth: '100%' }}>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{Icon && (\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tcolor={COLORS.special.brand.facebook}\n\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\tstyle={{ marginRight: 8 }}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tborder: '1px solid #E0E0E0',\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tborderRadius: 30,\n\t\t\t\t\t\t\tpadding: '8px 12px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TextTypographyComponent\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tcolor: COLORS.special.brand.facebook,\n\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\tfontSize: size === 'small' ? 12 : 14,\n\t\t\t\t\t\t\t\ttextOverflow: 'ellipsis',\n\t\t\t\t\t\t\t\twhiteSpace: 'nowrap',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{text}\n\t\t\t\t\t\t</TextTypographyComponent>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t{!!extraContent && (\n\t\t\t\t\t<Caption\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tmarginTop: 2,\n\t\t\t\t\t\t\tcolor: COLORS.content.placeholder,\n\t\t\t\t\t\t\ttextOverflow: 'ellipsis',\n\t\t\t\t\t\t\twhiteSpace: 'nowrap',\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{placeholder\n\t\t\t\t\t\t\t? normaliseButtonPlaceholder(placeholder)\n\t\t\t\t\t\t\t: extraContent}\n\t\t\t\t\t</Caption>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</>\n\t);\n};\n"],"names":["RCSButtons","Icon","text","extraContent","placeholder","textTypography","size","TextTypographyComponent","BodySecondary","normaliseButtonPlaceholder","str","jsxDEV","Fragment","COLORS","this","Caption"],"mappings":"wMAIaA,EAOR,CAAC,CAAE,KAAAC,EAAM,KAAAC,EAAM,aAAAC,EAAc,YAAAC,EAAa,eAAAC,EAAgB,KAAAC,KAAW,CACzE,MAAMC,EAA0BF,GAAkBG,EAAAA,cAElD,SAASC,EAA2BL,EAAqB,CAQxD,OAPwBA,EAAY,QAAQ,KAAM,EAAE,EAAE,QAAQ,KAAM,EAAE,EAEpE,QAAQ,WAAY,KAAK,EACzB,QAAQ,KAAM,SAAUM,EAAK,CAC7B,OAAOA,EAAI,YAAA,CACZ,CAAC,CAGH,CACA,OACCC,EAAAA,OAAAC,EAAAA,SAAA,CACC,kBAAC,MAAA,CAAI,MAAO,CAAE,UAAW,SAAU,SAAU,MAAA,EAC5C,SAAA,CAAAD,EAAAA,OAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,cAAe,MACf,eAAgB,SAChB,WAAY,QAAA,EAGZ,SAAA,CAAAV,GACAU,EAAAA,OAACV,EAAA,CACA,MAAOY,EAAAA,OAAO,QAAQ,MAAM,SAC5B,OAAQ,GACR,MAAO,GACP,MAAO,CAAE,YAAa,CAAA,CAAE,EAJzB,OAAA,GAAA,CAAA,SAAA,wIAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,EAQDH,EAAAA,OAAC,MAAA,CACA,MAAO,CACN,OAAQ,oBACR,MAAO,OACP,aAAc,GACd,QAAS,UAAA,EAGV,SAAAA,EAAAA,OAACJ,EAAA,CACA,MAAO,CACN,MAAOM,EAAAA,OAAO,QAAQ,MAAM,SAC5B,UAAW,SACX,SAAUP,IAAS,QAAU,GAAK,GAClC,aAAc,WACd,WAAY,SACZ,SAAU,QAAA,EAGV,SAAAJ,CAAA,EAVF,OAAA,GAAA,CAAA,SAAA,wIAAA,WAAA,GAAA,aAAA,CAAA,EAAAY,MAAA,CAWA,EAnBD,OAAA,GAAA,CAAA,SAAA,wIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,CAoBA,CAAA,EArCD,OAAA,GAAA,CAAA,SAAA,wIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,EAuCC,CAAC,CAACX,GACFQ,EAAAA,OAACI,EAAAA,QAAA,CACA,MAAO,CACN,UAAW,EACX,MAAOF,EAAAA,OAAO,QAAQ,YACtB,aAAc,WACd,WAAY,SACZ,SAAU,QAAA,EAGV,SAAAT,EACEK,EAA2BL,CAAW,EACtCD,CAAA,EAXJ,OAAA,GAAA,CAAA,SAAA,wIAAA,WAAA,GAAA,aAAA,CAAA,EAAAW,MAAA,CAYA,CAAA,EArDF,OAAA,GAAA,CAAA,SAAA,wIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAuDA,CAAA,EAxDD,OAAA,GAAA,CAAA,SAAA,wIAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAyDA,CAEF"}
+{"version":3,"file":"RCSButtons.js","sources":["../../../../../src/components/template-preview/RCS/RCSButtons.tsx"],"sourcesContent":["import React from 'react';\nimport { BodySecondary, Caption } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\n\nexport const RCSButtons: React.FC<{\n\tIcon?: React.FC<React.SVGProps<SVGSVGElement>>;\n\ttext: string;\n\textraContent?: string;\n\tplaceholder?: string;\n\ttextTypography?: React.FC;\n\tsize?: 'small' | 'large';\n}> = ({ Icon, text, extraContent, placeholder, textTypography, size }) => {\n\tconst TextTypographyComponent = textTypography || BodySecondary;\n\n\tfunction normaliseButtonPlaceholder(placeholder: string) {\n\t\tconst placeholderText = placeholder.replace('[[', '').replace(']]', '');\n\t\tconst placeHolderToDisplay = placeholderText\n\t\t\t.replace(/([A-Z])/g, ' $1')\n\t\t\t.replace(/^./, function (str) {\n\t\t\t\treturn str.toUpperCase();\n\t\t\t});\n\n\t\treturn placeHolderToDisplay;\n\t}\n\treturn (\n\t\t<>\n\t\t\t<div style={{ textAlign: 'center', maxWidth: '100%' }}>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{Icon && (\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tcolor={COLORS.special.brand.facebook}\n\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\tstyle={{ marginRight: 8 }}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tborder: '1px solid #E0E0E0',\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tborderRadius: 30,\n\t\t\t\t\t\t\tpadding: '8px 12px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TextTypographyComponent\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tcolor: COLORS.special.brand.facebook,\n\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\tfontSize: size === 'small' ? 12 : 14,\n\t\t\t\t\t\t\t\ttextOverflow: 'ellipsis',\n\t\t\t\t\t\t\t\twhiteSpace: 'nowrap',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{text}\n\t\t\t\t\t\t</TextTypographyComponent>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t{!!extraContent && (\n\t\t\t\t\t<Caption\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tmarginTop: 2,\n\t\t\t\t\t\t\tcolor: COLORS.content.placeholder,\n\t\t\t\t\t\t\ttextOverflow: 'ellipsis',\n\t\t\t\t\t\t\twhiteSpace: 'nowrap',\n\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{placeholder\n\t\t\t\t\t\t\t? normaliseButtonPlaceholder(placeholder)\n\t\t\t\t\t\t\t: extraContent}\n\t\t\t\t\t</Caption>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</>\n\t);\n};\n"],"names":["RCSButtons","Icon","text","extraContent","placeholder","textTypography","size","TextTypographyComponent","BodySecondary","normaliseButtonPlaceholder","str","jsxDEV","Fragment","COLORS","this","Caption"],"mappings":"wMAIaA,EAOR,CAAC,CAAE,KAAAC,EAAM,KAAAC,EAAM,aAAAC,EAAc,YAAAC,EAAa,eAAAC,EAAgB,KAAAC,KAAW,CACzE,MAAMC,EAA0BF,GAAkBG,EAAAA,cAElD,SAASC,EAA2BL,EAAqB,CAQxD,OAPwBA,EAAY,QAAQ,KAAM,EAAE,EAAE,QAAQ,KAAM,EAAE,EAEpE,QAAQ,WAAY,KAAK,EACzB,QAAQ,KAAM,SAAUM,EAAK,CAC7B,OAAOA,EAAI,YAAA,CACZ,CAAC,CAGH,CACA,OACCC,EAAAA,OAAAC,EAAAA,SAAA,CACC,kBAAC,MAAA,CAAI,MAAO,CAAE,UAAW,SAAU,SAAU,MAAA,EAC5C,SAAA,CAAAD,EAAAA,OAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,cAAe,MACf,eAAgB,SAChB,WAAY,QAAA,EAGZ,SAAA,CAAAV,GACAU,EAAAA,OAACV,EAAA,CACA,MAAOY,EAAAA,OAAO,QAAQ,MAAM,SAC5B,OAAQ,GACR,MAAO,GACP,MAAO,CAAE,YAAa,CAAA,CAAE,EAJzB,OAAA,GAAA,CAAA,SAAA,yGAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,EAQDH,EAAAA,OAAC,MAAA,CACA,MAAO,CACN,OAAQ,oBACR,MAAO,OACP,aAAc,GACd,QAAS,UAAA,EAGV,SAAAA,EAAAA,OAACJ,EAAA,CACA,MAAO,CACN,MAAOM,EAAAA,OAAO,QAAQ,MAAM,SAC5B,UAAW,SACX,SAAUP,IAAS,QAAU,GAAK,GAClC,aAAc,WACd,WAAY,SACZ,SAAU,QAAA,EAGV,SAAAJ,CAAA,EAVF,OAAA,GAAA,CAAA,SAAA,yGAAA,WAAA,GAAA,aAAA,CAAA,EAAAY,MAAA,CAWA,EAnBD,OAAA,GAAA,CAAA,SAAA,yGAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,CAoBA,CAAA,EArCD,OAAA,GAAA,CAAA,SAAA,yGAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAAA,EAuCC,CAAC,CAACX,GACFQ,EAAAA,OAACI,EAAAA,QAAA,CACA,MAAO,CACN,UAAW,EACX,MAAOF,EAAAA,OAAO,QAAQ,YACtB,aAAc,WACd,WAAY,SACZ,SAAU,QAAA,EAGV,SAAAT,EACEK,EAA2BL,CAAW,EACtCD,CAAA,EAXJ,OAAA,GAAA,CAAA,SAAA,yGAAA,WAAA,GAAA,aAAA,CAAA,EAAAW,MAAA,CAYA,CAAA,EArDF,OAAA,GAAA,CAAA,SAAA,yGAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAuDA,CAAA,EAxDD,OAAA,GAAA,CAAA,SAAA,yGAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAyDA,CAEF"}

package/dist/cjs/components/template-preview/RCS/RCSChatHeader.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-dev-runtime"),i=require("../../../assets/icons/arrow_left.svg.js"),t=require("../../../assets/icons/user_icon.svg.js"),o=require("../../../assets/icons/vertical_dots.svg.js"),a=require("../../TypographyStyle.js"),n=require("../../../constants/Theme.js"),r=require("./RCSPreview.styled.js"),s=()=>e.jsxDEV(r.HeaderContainer,{children:[e.jsxDEV(r.LeftContainer,{children:[e.jsxDEV(i.default,{height:16,width:16,color:n.COLORS.content.secondary},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:19,columnNumber:5},void 0),e.jsxDEV(r.IconContainer,{children:e.jsxDEV(t.default,{height:14,width:14,color:n.COLORS.content.primaryInverse},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:25,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:24,columnNumber:5},void 0),e.jsxDEV(r.TitleContainer,{children:[e.jsxDEV(a.BodyTiny,{color:n.COLORS.content.secondary,style:{fontWeight:600},children:"Brand name"},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:32,columnNumber:6},void 0),e.jsxDEV(r.SubTitle,{children:"Business account"},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:38,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:31,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:18,columnNumber:4},void 0),e.jsxDEV(o.default,{height:16,width:16,color:n.COLORS.content.secondary},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:41,columnNumber:4},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:17,columnNumber:3},void 0);exports.default=s;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-dev-runtime"),o=require("../../../assets/icons/arrow_left.svg.js"),i=require("../../../assets/icons/user_icon.svg.js"),t=require("../../../assets/icons/vertical_dots.svg.js"),a=require("../../TypographyStyle.js"),r=require("../../../constants/Theme.js"),n=require("./RCSPreview.styled.js"),s=()=>e.jsxDEV(n.HeaderContainer,{children:[e.jsxDEV(n.LeftContainer,{children:[e.jsxDEV(o.default,{height:16,width:16,color:r.COLORS.content.secondary},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:19,columnNumber:5},void 0),e.jsxDEV(n.IconContainer,{children:e.jsxDEV(i.default,{height:14,width:14,color:r.COLORS.content.primaryInverse},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:25,columnNumber:6},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:24,columnNumber:5},void 0),e.jsxDEV(n.TitleContainer,{children:[e.jsxDEV(a.BodyTiny,{color:r.COLORS.content.secondary,style:{fontWeight:600},children:"Brand name"},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:32,columnNumber:6},void 0),e.jsxDEV(n.SubTitle,{children:"Business account"},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:38,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:31,columnNumber:5},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:18,columnNumber:4},void 0),e.jsxDEV(t.default,{height:16,width:16,color:r.COLORS.content.secondary},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:41,columnNumber:4},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatHeader.tsx",lineNumber:17,columnNumber:3},void 0);exports.default=s;
 //# sourceMappingURL=RCSChatHeader.js.map

package/dist/cjs/components/template-preview/RCS/RCSChatHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"RCSChatHeader.js","sources":["../../../../../src/components/template-preview/RCS/RCSChatHeader.tsx"],"sourcesContent":["import ArrowIcon from '@src/assets/icons/arrow_left.svg';\nimport UserIcon from '@src/assets/icons/user_icon.svg';\nimport MoreIcon from '@src/assets/icons/vertical_dots.svg';\nimport { BodyTiny } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tHeaderContainer,\n\tIconContainer,\n\tLeftContainer,\n\tSubTitle,\n\tTitleContainer,\n} from './RCSPreview.styled';\n\n\nconst RCSChatHeader = () => {\n\treturn (\n\t\t<HeaderContainer>\n\t\t\t<LeftContainer>\n\t\t\t\t<ArrowIcon\n\t\t\t\t\theight={16}\n\t\t\t\t\twidth={16}\n\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t/>\n\t\t\t\t<IconContainer>\n\t\t\t\t\t<UserIcon\n\t\t\t\t\t\theight={14}\n\t\t\t\t\t\twidth={14}\n\t\t\t\t\t\tcolor={COLORS.content.primaryInverse}\n\t\t\t\t\t/>\n\t\t\t\t</IconContainer>\n\t\t\t\t<TitleContainer>\n\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\tstyle={{ fontWeight: 600 }}\n\t\t\t\t\t>\n\t\t\t\t\t\tBrand name\n\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t<SubTitle>Business account</SubTitle>\n\t\t\t\t</TitleContainer>\n\t\t\t</LeftContainer>\n\t\t\t<MoreIcon height={16} width={16} color={COLORS.content.secondary} />\n\t\t</HeaderContainer>\n\t);\n};\n\nexport default RCSChatHeader;\n"],"names":["RCSChatHeader","HeaderContainer","jsxDEV","LeftContainer","ArrowIcon","COLORS","this","IconContainer","UserIcon","TitleContainer","BodyTiny","SubTitle","MoreIcon"],"mappings":"yaAcMA,EAAgB,aAEnBC,kBAAA,CACA,SAAA,CAAAC,SAACC,EAAAA,cAAA,CACA,SAAA,CAAAD,EAAAA,OAACE,EAAAA,QAAA,CACA,OAAQ,GACR,MAAO,GACP,MAAOC,EAAAA,OAAO,QAAQ,SAAA,EAHvB,OAAA,GAAA,CAAA,SAAA,2IAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,WAKCC,EAAAA,cAAA,CACA,SAAAL,EAAAA,OAACM,EAAAA,QAAA,CACA,OAAQ,GACR,MAAO,GACP,MAAOH,EAAAA,OAAO,QAAQ,cAAA,EAHvB,OAAA,GAAA,CAAA,SAAA,2IAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,CAIA,EALD,OAAA,GAAA,CAAA,SAAA,2IAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAMA,WACCG,EAAAA,eAAA,CACA,SAAA,CAAAP,EAAAA,OAACQ,EAAAA,SAAA,CACA,MAAOL,EAAAA,OAAO,QAAQ,UACtB,MAAO,CAAE,WAAY,GAAA,EACrB,SAAA,YAAA,EAHD,OAAA,GAAA,CAAA,SAAA,2IAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,EAMAJ,EAAAA,OAACS,EAAAA,UAAS,SAAA,kBAAA,EAAV,OAAA,GAAA,CAAA,SAAA,2IAAA,WAAA,GAAA,aAAA,CAAA,EAAAL,MAA0B,CAAA,CAAA,EAP3B,OAAA,GAAA,CAAA,SAAA,2IAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAQA,CAAA,CAAA,EArBD,OAAA,GAAA,CAAA,SAAA,2IAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAsBA,EACAJ,EAAAA,OAACU,EAAAA,SAAS,OAAQ,GAAI,MAAO,GAAI,MAAOP,EAAAA,OAAO,QAAQ,SAAA,EAAvD,OAAA,GAAA,CAAA,SAAA,2IAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAkE,CAAA,CAAA,EAxBnE,OAAA,GAAA,CAAA,SAAA,2IAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAyBA"}
+{"version":3,"file":"RCSChatHeader.js","sources":["../../../../../src/components/template-preview/RCS/RCSChatHeader.tsx"],"sourcesContent":["import ArrowIcon from '@src/assets/icons/arrow_left.svg';\nimport UserIcon from '@src/assets/icons/user_icon.svg';\nimport MoreIcon from '@src/assets/icons/vertical_dots.svg';\nimport { BodyTiny } from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport {\n\tHeaderContainer,\n\tIconContainer,\n\tLeftContainer,\n\tSubTitle,\n\tTitleContainer,\n} from './RCSPreview.styled';\n\n\nconst RCSChatHeader = () => {\n\treturn (\n\t\t<HeaderContainer>\n\t\t\t<LeftContainer>\n\t\t\t\t<ArrowIcon\n\t\t\t\t\theight={16}\n\t\t\t\t\twidth={16}\n\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t/>\n\t\t\t\t<IconContainer>\n\t\t\t\t\t<UserIcon\n\t\t\t\t\t\theight={14}\n\t\t\t\t\t\twidth={14}\n\t\t\t\t\t\tcolor={COLORS.content.primaryInverse}\n\t\t\t\t\t/>\n\t\t\t\t</IconContainer>\n\t\t\t\t<TitleContainer>\n\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\tstyle={{ fontWeight: 600 }}\n\t\t\t\t\t>\n\t\t\t\t\t\tBrand name\n\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t<SubTitle>Business account</SubTitle>\n\t\t\t\t</TitleContainer>\n\t\t\t</LeftContainer>\n\t\t\t<MoreIcon height={16} width={16} color={COLORS.content.secondary} />\n\t\t</HeaderContainer>\n\t);\n};\n\nexport default RCSChatHeader;\n"],"names":["RCSChatHeader","HeaderContainer","jsxDEV","LeftContainer","ArrowIcon","COLORS","this","IconContainer","UserIcon","TitleContainer","BodyTiny","SubTitle","MoreIcon"],"mappings":"yaAcMA,EAAgB,aAEnBC,kBAAA,CACA,SAAA,CAAAC,SAACC,EAAAA,cAAA,CACA,SAAA,CAAAD,EAAAA,OAACE,EAAAA,QAAA,CACA,OAAQ,GACR,MAAO,GACP,MAAOC,EAAAA,OAAO,QAAQ,SAAA,EAHvB,OAAA,GAAA,CAAA,SAAA,4GAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,WAKCC,EAAAA,cAAA,CACA,SAAAL,EAAAA,OAACM,EAAAA,QAAA,CACA,OAAQ,GACR,MAAO,GACP,MAAOH,EAAAA,OAAO,QAAQ,cAAA,EAHvB,OAAA,GAAA,CAAA,SAAA,4GAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,CAIA,EALD,OAAA,GAAA,CAAA,SAAA,4GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAMA,WACCG,EAAAA,eAAA,CACA,SAAA,CAAAP,EAAAA,OAACQ,EAAAA,SAAA,CACA,MAAOL,EAAAA,OAAO,QAAQ,UACtB,MAAO,CAAE,WAAY,GAAA,EACrB,SAAA,YAAA,EAHD,OAAA,GAAA,CAAA,SAAA,4GAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAA,EAMAJ,EAAAA,OAACS,EAAAA,UAAS,SAAA,kBAAA,EAAV,OAAA,GAAA,CAAA,SAAA,4GAAA,WAAA,GAAA,aAAA,CAAA,EAAAL,MAA0B,CAAA,CAAA,EAP3B,OAAA,GAAA,CAAA,SAAA,4GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAQA,CAAA,CAAA,EArBD,OAAA,GAAA,CAAA,SAAA,4GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAsBA,EACAJ,EAAAA,OAACU,EAAAA,SAAS,OAAQ,GAAI,MAAO,GAAI,MAAOP,EAAAA,OAAO,QAAQ,SAAA,EAAvD,OAAA,GAAA,CAAA,SAAA,4GAAA,WAAA,GAAA,aAAA,CAAA,EAAAC,MAAkE,CAAA,CAAA,EAxBnE,OAAA,GAAA,CAAA,SAAA,4GAAA,WAAA,GAAA,aAAA,CAAA,EAAAA,MAyBA"}

package/dist/cjs/components/template-preview/RCS/RCSChatPreview.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-dev-runtime"),R=require("react"),j=require("../../template-context-mapper/context/templateModalContext.js"),y=require("../helpers/templateMiscHelper.js"),W=require("../helpers/VariableEditorHelper.js"),i=require("../models/TemplateMeta.js"),A=require("../WhatsApp/ChatBtn.js"),_=require("./RCSButtons.js"),b=require("./RCSMediaCard.js"),o=require("./RCSPreview.styled.js"),v=new W.VariableEditorHelper,q=f=>{const{bodyText:C,titleText:p,headerMediaType:r,headerText:E,headerAssetLink:n,headerAssetName:c,imagePreviewStyles:h,size:k,bodyVariableList:x,headerVariableList:D,buttons:l,carouselCardIndex:t,isWhatsappCarousel:w,isPreview:T,titleVariableList:P,templateConfiguration:a}=f,g=v.format(C?.replace(/</g,"&lt;").replace(/>/g,"&gt;"),x),H=v.format(E?.replace(/</g,"&lt;").replace(/>/g,"&gt;"),D),V=v.format(p?.replace(/</g,"&lt;").replace(/>/g,"&gt;"),P),{selectedCarouselIndex:m,isProductCarouselType:N,errorIndexes:M,isCarouselHovered:U}=j.useTemplateModalContext(),S=R.useMemo(()=>y.isRichAndCarouselCards(a?.templateType),[a?.templateType]),s=R.useMemo(()=>a?.orientation=="HORIZONTAL",[a]);return e.jsxDEV(o.RCSPreviewContainer,{isCarouselCard:t!=null&&t>-1,showBorder:t!=null&&t===m||N&&t!=null&&t>-1&&m!=null&&m>-1,hasError:M?.includes(t??-2),isWhatsappCarousel:w,isPreview:T,showDashedBorder:N&&U&&(m??-1)<0&&(t??-1)>-1,needBorder:S,isHorizontalOrientation:s,children:[!s&&e.jsxDEV(e.Fragment,{children:r===i.HEADER_TYPES.TEXT?e.jsxDEV(o.HeaderTextContainer,{dangerouslySetInnerHTML:{__html:H}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:96,columnNumber:7},void 0):r!==i.HEADER_TYPES.NONE&&n&&r!==i.HEADER_TYPES.DOCUMENT?e.jsxDEV(b.RCSMediaCard,{headerAssetLink:n,headerAssetName:c,mediaType:r,imagePreviewStyles:r===i.HEADER_TYPES.IMAGE?h:{}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:102,columnNumber:7},void 0):null},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:94,columnNumber:5},void 0),e.jsxDEV("div",{style:{width:s?"50%":""},children:[e.jsxDEV("div",{className:S?"":"text--template",children:[!!p&&e.jsxDEV(e.Fragment,{children:e.jsxDEV(o.TitleTextContainer,{dangerouslySetInnerHTML:{__html:V}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:117,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:116,columnNumber:7},void 0),!!C&&e.jsxDEV(e.Fragment,{children:e.jsxDEV(o.RcsHtmlContainer,{dangerouslySetInnerHTML:{__html:g},style:{paddingTop:p?0:12}},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:127,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:126,columnNumber:7},void 0),r===i.HEADER_TYPES.DOCUMENT?e.jsxDEV(b.PdfMediaCard,{headerAssetLink:n,headerAssetName:c},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:136,columnNumber:7},void 0):e.jsxDEV(e.Fragment,{},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:138,columnNumber:7},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:114,columnNumber:5},void 0),l&&l.length>0?y.isRichAndCarouselCards(a?.templateType)?e.jsxDEV(e.Fragment,{children:l.map((u,d)=>e.jsxDEV(A.ChatBtn,{text:u.text,size:k},d,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:148,columnNumber:9},void 0))},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:146,columnNumber:7},void 0):e.jsxDEV(o.RCSChatBtnContainer,{children:l.map((u,d)=>e.jsxDEV(_.RCSButtons,{text:u.text,size:k},d,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:154,columnNumber:9},void 0))},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:152,columnNumber:7},void 0):null]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:113,columnNumber:4},void 0),s&&r!==i.HEADER_TYPES.NONE&&n&&r!==i.HEADER_TYPES.DOCUMENT&&e.jsxDEV(b.RCSMediaCard,{headerAssetLink:n,headerAssetName:c,mediaType:r,imagePreviewStyles:r===i.HEADER_TYPES.IMAGE?h:{},isHorizontal:s},void 0,!1,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:164,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/himanshusrivastava/Desktop/Work/bik-component-library/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:70,columnNumber:3},void 0)};exports.RCSChatPreview=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-dev-runtime"),C=require("react"),_=require("../../template-context-mapper/context/templateModalContext.js"),x=require("../helpers/templateMiscHelper.js"),q=require("../helpers/VariableEditorHelper.js"),o=require("../models/TemplateMeta.js"),B=require("../WhatsApp/ChatBtn.js"),I=require("./RCSButtons.js"),b=require("./RCSMediaCard.js"),s=require("./RCSPreview.styled.js"),v=new q.VariableEditorHelper,L=h=>{const{bodyText:w,titleText:m,headerMediaType:r,headerText:D,headerAssetLink:a,headerAssetName:c,imagePreviewStyles:N,size:S,bodyVariableList:T,headerVariableList:P,buttons:l,carouselCardIndex:n,isWhatsappCarousel:H,isPreview:M,titleVariableList:g,templateConfiguration:i}=h,V=v.format(w?.replace(/</g,"&lt;").replace(/>/g,"&gt;"),T),U=v.format(D?.replace(/</g,"&lt;").replace(/>/g,"&gt;"),P),j=v.format(m?.replace(/</g,"&lt;").replace(/>/g,"&gt;"),g),{selectedCarouselIndex:d,isProductCarouselType:R,errorIndexes:k,isCarouselHovered:A}=_.useTemplateModalContext(),y=C.useMemo(()=>x.isRichAndCarouselCards(i?.templateType),[i?.templateType]),t=C.useMemo(()=>i?.orientation=="HORIZONTAL",[i]),f=C.useMemo(()=>!t&&!!i?.isMediaAfterBody,[t,i]),E=r===o.HEADER_TYPES.TEXT?e.jsxDEV(s.HeaderTextContainer,{dangerouslySetInnerHTML:{__html:U}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:80,columnNumber:4},void 0):r!==o.HEADER_TYPES.NONE&&a&&r!==o.HEADER_TYPES.DOCUMENT?e.jsxDEV(b.RCSMediaCard,{headerAssetLink:a,headerAssetName:c,mediaType:r,imagePreviewStyles:r===o.HEADER_TYPES.IMAGE?N:{}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:84,columnNumber:4},void 0):null;return e.jsxDEV(s.RCSPreviewContainer,{isCarouselCard:n!=null&&n>-1,showBorder:n!=null&&n===d||R&&n!=null&&n>-1&&d!=null&&d>-1,hasError:k?.includes(n??-2),isWhatsappCarousel:H,isPreview:M,showDashedBorder:R&&A&&(d??-1)<0&&(n??-1)>-1,needBorder:y,isHorizontalOrientation:t,children:[!t&&!f&&E,e.jsxDEV("div",{style:{width:t?"50%":""},children:[e.jsxDEV("div",{className:y?"":"text--template",children:[!!m&&e.jsxDEV(e.Fragment,{children:e.jsxDEV(s.TitleTextContainer,{dangerouslySetInnerHTML:{__html:j}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:123,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:122,columnNumber:7},void 0),!!w&&e.jsxDEV(e.Fragment,{children:e.jsxDEV(s.RcsHtmlContainer,{dangerouslySetInnerHTML:{__html:V},style:{paddingTop:m?0:12}},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:133,columnNumber:8},void 0)},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:132,columnNumber:7},void 0),r===o.HEADER_TYPES.DOCUMENT?e.jsxDEV(b.PdfMediaCard,{headerAssetLink:a,headerAssetName:c},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:142,columnNumber:7},void 0):e.jsxDEV(e.Fragment,{},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:144,columnNumber:7},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:120,columnNumber:5},void 0),!t&&f&&E,l&&l.length>0?x.isRichAndCarouselCards(i?.templateType)?e.jsxDEV(e.Fragment,{children:l.map((u,p)=>e.jsxDEV(B.ChatBtn,{text:u.text,size:S},p,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:156,columnNumber:9},void 0))},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:154,columnNumber:7},void 0):e.jsxDEV(s.RCSChatBtnContainer,{children:l.map((u,p)=>e.jsxDEV(I.RCSButtons,{text:u.text,size:S},p,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:162,columnNumber:9},void 0))},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:160,columnNumber:7},void 0):null]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:119,columnNumber:4},void 0),t&&r!==o.HEADER_TYPES.NONE&&a&&r!==o.HEADER_TYPES.DOCUMENT&&e.jsxDEV(b.RCSMediaCard,{headerAssetLink:a,headerAssetName:c,mediaType:r,imagePreviewStyles:r===o.HEADER_TYPES.IMAGE?N:{},isHorizontal:t},void 0,!1,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:172,columnNumber:6},void 0)]},void 0,!0,{fileName:"/Users/syedanoorain/Downloads/bik-component-library/src/components/template-preview/RCS/RCSChatPreview.tsx",lineNumber:95,columnNumber:3},void 0)};exports.RCSChatPreview=L;
 //# sourceMappingURL=RCSChatPreview.js.map