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

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

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","sources":["../../../../src/components/tag/Tag.tsx"],"sourcesContent":["import React from 'react';\nimport { Tooltip } from '../tooltips/Tooltip';\nimport {\n\tAiBodyCaption,\n\tAiBodyTiny,\n\tBodyCaption,\n\tBodyTiny,\n} from '../TypographyStyle';\nimport { TagProps, ValidTagTypeMap } from './model';\nimport * as Sc from './Tag.styled';\nimport { getTagIconColor } from './themes';\n\nexport const Tag = ({\n\ttagText,\n\tLeadingIcon,\n\tTrailingIcon,\n\tonLeadingIconClicked = undefined,\n\tleadingIconId,\n\ttrailingIconId,\n\tonTrailingIconClicked = undefined,\n\ttheme = 'light',\n\ttype = 'neutral',\n\tvariant = 'regular',\n\tversion,\n\tcursor,\n\talignIcon,\n\tnoBorder,\n\ttagHtmlText,\n\tcontentPadding,\n\tleadingIconTooltip,\n\ttrailingIconTooltip,\n\ttagColor,\n\tnumberOfLines,\n\tbackgroundColor,\n\tborderRadius,\n\tsize = 'regular',\n}: TagProps) => {\n\tlet displayTagText = tagText;\n\tconst displayTheme = theme;\n\tlet displayType = type;\n\n\tif (!ValidTagTypeMap[variant][type]) {\n\t\tdisplayType = 'neutral';\n\t}\n\n\tif (variant === 'circle') {\n\t\tif (typeof displayTagText === 'number' && displayTagText > 99) {\n\t\t\tdisplayTagText = '99+';\n\t\t}\n\t}\n\n\tconst iconColor = getTagIconColor(theme, displayType);\n\tconst iconProps = {\n\t\theight: variant === 'compressed' ? 12 : 16,\n\t\twidth: variant === 'compressed' ? 12 : 16,\n\t\tcolor: iconColor,\n\t\tstyle: { display: 'block' },\n\t};\n\n\treturn (\n\t\t<Sc.Tag\n\t\t\tcursor={cursor}\n\t\t\ttheme={displayTheme}\n\t\t\ttype={displayType}\n\t\t\tvariant={variant}\n\t\t\tversion={version}\n\t\t\talignIcon={alignIcon}\n\t\t\tnoBorder={noBorder}\n\t\t\tcontentPadding={contentPadding}\n\t\t\tbackgroundColor={backgroundColor}\n\t\t\tborderRadius={borderRadius}\n\t\t\tsize={size}\n\t\t>\n\t\t\t<div className=\"container\">\n\t\t\t\t{LeadingIcon &&\n\t\t\t\t\t(leadingIconTooltip ? (\n\t\t\t\t\t\t<Tooltip {...leadingIconTooltip}>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tclassName=\"icon-leading\"\n\t\t\t\t\t\t\t\tonClick={onLeadingIconClicked}\n\t\t\t\t\t\t\t\tid={`${leadingIconId}-wrapper` || 'leading-icon-wrapper'}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{React.createElement(LeadingIcon, {\n\t\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\t\tid: leadingIconId || 'leading-icon',\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName=\"icon-leading\"\n\t\t\t\t\t\t\tonClick={onLeadingIconClicked}\n\t\t\t\t\t\t\tid={`${leadingIconId}-wrapper` || 'leading-icon-wrapper'}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{React.createElement(LeadingIcon, {\n\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\tid: leadingIconId || 'leading-icon',\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t))}\n\n\t\t\t\t{tagHtmlText &&\n\t\t\t\t\t(type === 'ai' && theme === 'light' ? (\n\t\t\t\t\t\tsize === 'small' ? (\n\t\t\t\t\t\t\t<AiBodyTiny numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t\t</AiBodyTiny>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<AiBodyCaption numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t\t</AiBodyCaption>\n\t\t\t\t\t\t)\n\t\t\t\t\t) : size === 'small' ? (\n\t\t\t\t\t\t<BodyTiny className=\"text\" numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BodyCaption className=\"text\" numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t))}\n\n\t\t\t\t{!tagHtmlText &&\n\t\t\t\t\tdisplayTagText !== '' &&\n\t\t\t\t\t(type === 'ai' && theme === 'light' ? (\n\t\t\t\t\t\tsize === 'small' ? (\n\t\t\t\t\t\t\t<AiBodyTiny numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t\t</AiBodyTiny>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<AiBodyCaption numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t\t</AiBodyCaption>\n\t\t\t\t\t\t)\n\t\t\t\t\t) : size === 'small' ? (\n\t\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\t\tclassName=\"text\"\n\t\t\t\t\t\t\tcolor={tagColor}\n\t\t\t\t\t\t\tnumberOfLines={numberOfLines}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tclassName=\"text\"\n\t\t\t\t\t\t\tcolor={tagColor}\n\t\t\t\t\t\t\tnumberOfLines={numberOfLines}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t))}\n\n\t\t\t\t{TrailingIcon &&\n\t\t\t\t\t(trailingIconTooltip ? (\n\t\t\t\t\t\t<Tooltip {...trailingIconTooltip}>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tclassName=\"icon-trailing\"\n\t\t\t\t\t\t\t\tonClick={onTrailingIconClicked}\n\t\t\t\t\t\t\t\tid={`${trailingIconId}-wrapper` || 'trailing-icon-wrapper'}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{React.createElement(TrailingIcon, {\n\t\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\t\tid: trailingIconId || 'trailing-icon',\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName=\"icon-trailing\"\n\t\t\t\t\t\t\tonClick={onTrailingIconClicked}\n\t\t\t\t\t\t\tid={`${trailingIconId}-wrapper` || 'trailing-icon-wrapper'}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{React.createElement(TrailingIcon, {\n\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\tid: trailingIconId || 'trailing-icon',\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t))}\n\t\t\t</div>\n\t\t</Sc.Tag>\n\t);\n};\n\nTag.displayName = 'Tag';\n"],"names":["Tag","_ref","tagText","LeadingIcon","TrailingIcon","onLeadingIconClicked","leadingIconId","trailingIconId","onTrailingIconClicked","theme","type","variant","version","cursor","alignIcon","noBorder","tagHtmlText","contentPadding","leadingIconTooltip","trailingIconTooltip","tagColor","numberOfLines","backgroundColor","borderRadius","size","displayTagText","displayTheme","displayType","ValidTagTypeMap","iconProps","height","width","color","getTagIconColor","style","display","_jsx","Sc","children","_jsxs","jsxs","Object","assign","className","Tooltip","onClick","id","React","createElement","jsx","AiBodyTiny","AiBodyCaption","BodyTiny","BodyCaption","displayName"],"mappings":"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"}
+{"version":3,"file":"Tag.js","sources":["../../../../src/components/tag/Tag.tsx"],"sourcesContent":["import React from 'react';\nimport { Tooltip } from '../tooltips/Tooltip';\nimport {\n\tAiBodyCaption,\n\tAiBodyTiny,\n\tBodyCaption,\n\tBodyTiny,\n} from '../TypographyStyle';\nimport { TagProps, ValidTagTypeMap } from './model';\nimport * as Sc from './Tag.styled';\nimport { getTagIconColor } from './themes';\n\nexport const Tag = ({\n\ttagText,\n\tLeadingIcon,\n\tTrailingIcon,\n\tonLeadingIconClicked = undefined,\n\tleadingIconId,\n\ttrailingIconId,\n\tonTrailingIconClicked = undefined,\n\ttheme = 'light',\n\ttype = 'neutral',\n\tvariant = 'regular',\n\tversion,\n\tcursor,\n\talignIcon,\n\tnoBorder,\n\ttagHtmlText,\n\tcontentPadding,\n\tleadingIconTooltip,\n\ttrailingIconTooltip,\n\ttagColor,\n\tnumberOfLines,\n\tbackgroundColor,\n\tborderRadius,\n\tsize = 'regular',\n}: TagProps) => {\n\tlet displayTagText = tagText;\n\tconst displayTheme = theme;\n\tlet displayType = type;\n\n\tif (!ValidTagTypeMap[variant][type]) {\n\t\tdisplayType = 'neutral';\n\t}\n\n\tif (variant === 'circle') {\n\t\tif (typeof displayTagText === 'number' && displayTagText > 99) {\n\t\t\tdisplayTagText = '99+';\n\t\t}\n\t}\n\n\tconst iconColor = getTagIconColor(theme, displayType);\n\tconst iconProps = {\n\t\theight: variant === 'compressed' ? 12 : 16,\n\t\twidth: variant === 'compressed' ? 12 : 16,\n\t\tcolor: iconColor,\n\t\tstyle: { display: 'block' },\n\t};\n\n\treturn (\n\t\t<Sc.Tag\n\t\t\tcursor={cursor}\n\t\t\ttheme={displayTheme}\n\t\t\ttype={displayType}\n\t\t\tvariant={variant}\n\t\t\tversion={version}\n\t\t\talignIcon={alignIcon}\n\t\t\tnoBorder={noBorder}\n\t\t\tcontentPadding={contentPadding}\n\t\t\tbackgroundColor={backgroundColor}\n\t\t\tborderRadius={borderRadius}\n\t\t\tsize={size}\n\t\t>\n\t\t\t<div className=\"container\">\n\t\t\t\t{LeadingIcon &&\n\t\t\t\t\t(leadingIconTooltip ? (\n\t\t\t\t\t\t<Tooltip {...leadingIconTooltip}>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tclassName=\"icon-leading\"\n\t\t\t\t\t\t\t\tonClick={onLeadingIconClicked}\n\t\t\t\t\t\t\t\tid={`${leadingIconId}-wrapper` || 'leading-icon-wrapper'}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{React.createElement(LeadingIcon, {\n\t\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\t\tid: leadingIconId || 'leading-icon',\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName=\"icon-leading\"\n\t\t\t\t\t\t\tonClick={onLeadingIconClicked}\n\t\t\t\t\t\t\tid={`${leadingIconId}-wrapper` || 'leading-icon-wrapper'}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{React.createElement(LeadingIcon, {\n\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\tid: leadingIconId || 'leading-icon',\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t))}\n\n\t\t\t\t{tagHtmlText &&\n\t\t\t\t\t(type === 'ai' && theme === 'light' ? (\n\t\t\t\t\t\tsize === 'small' ? (\n\t\t\t\t\t\t\t<AiBodyTiny numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t\t</AiBodyTiny>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<AiBodyCaption numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t\t</AiBodyCaption>\n\t\t\t\t\t\t)\n\t\t\t\t\t) : size === 'small' ? (\n\t\t\t\t\t\t<BodyTiny className=\"text\" numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BodyCaption className=\"text\" numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t{tagHtmlText}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t))}\n\n\t\t\t\t{!tagHtmlText &&\n\t\t\t\t\tdisplayTagText !== '' &&\n\t\t\t\t\t(type === 'ai' && theme === 'light' ? (\n\t\t\t\t\t\tsize === 'small' ? (\n\t\t\t\t\t\t\t<AiBodyTiny numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t\t</AiBodyTiny>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<AiBodyCaption numberOfLines={numberOfLines}>\n\t\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t\t</AiBodyCaption>\n\t\t\t\t\t\t)\n\t\t\t\t\t) : size === 'small' ? (\n\t\t\t\t\t\t<BodyTiny\n\t\t\t\t\t\t\tclassName=\"text\"\n\t\t\t\t\t\t\tcolor={tagColor}\n\t\t\t\t\t\t\tnumberOfLines={numberOfLines}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tclassName=\"text\"\n\t\t\t\t\t\t\tcolor={tagColor}\n\t\t\t\t\t\t\tnumberOfLines={numberOfLines}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{displayTagText}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t))}\n\n\t\t\t\t{TrailingIcon &&\n\t\t\t\t\t(trailingIconTooltip ? (\n\t\t\t\t\t\t<Tooltip {...trailingIconTooltip}>\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\tclassName=\"icon-trailing\"\n\t\t\t\t\t\t\t\tonClick={onTrailingIconClicked}\n\t\t\t\t\t\t\t\tid={`${trailingIconId}-wrapper` || 'trailing-icon-wrapper'}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{React.createElement(TrailingIcon, {\n\t\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\t\tid: trailingIconId || 'trailing-icon',\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName=\"icon-trailing\"\n\t\t\t\t\t\t\tonClick={onTrailingIconClicked}\n\t\t\t\t\t\t\tid={`${trailingIconId}-wrapper` || 'trailing-icon-wrapper'}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{React.createElement(TrailingIcon, {\n\t\t\t\t\t\t\t\t...iconProps,\n\t\t\t\t\t\t\t\tid: trailingIconId || 'trailing-icon',\n\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t</button>\n\t\t\t\t\t))}\n\t\t\t</div>\n\t\t</Sc.Tag>\n\t);\n};\n\nTag.displayName = 'Tag';\n"],"names":["Tag","tagText","LeadingIcon","TrailingIcon","onLeadingIconClicked","leadingIconId","trailingIconId","onTrailingIconClicked","theme","type","variant","version","cursor","alignIcon","noBorder","tagHtmlText","contentPadding","leadingIconTooltip","trailingIconTooltip","tagColor","numberOfLines","backgroundColor","borderRadius","size","displayTagText","displayTheme","displayType","ValidTagTypeMap","iconProps","height","width","color","getTagIconColor","style","display","_jsx","Sc","children","_jsxs","jsxs","Object","assign","className","Tooltip","onClick","id","React","createElement","jsx","AiBodyTiny","AiBodyCaption","BodyTiny","BodyCaption","displayName"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"Tag.styled.js","sources":["../../../../src/components/tag/Tag.styled.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { TagTheme, TagType, TagVariant } from './model';\nimport {\n\tgenerateBorder,\n\tgetBackgroundColor,\n\tgetPadding,\n\tgetTextColor,\n} from './themes';\n\nexport const Tag = styled.div<{\n\ttheme: TagTheme;\n\ttype: TagType;\n\tvariant: TagVariant;\n\tversion?: '1.0' | '2.0';\n\tcursor?: string;\n\talignIcon?: string;\n\tnoBorder?: boolean;\n\tcontentPadding?: number;\n\tbackgroundColor?: string;\n\tborderRadius?: string | number;\n\tsize?: 'regular' | 'small';\n}>`\n\tcursor: ${(props) => props.cursor ?? 'default'};\n\t${(props) =>\n\t\tprops.size !== 'small' &&\n\t\t(props.variant === 'regular'\n\t\t\t? `display: block;\n\t\t     min-height: 26px;\n\t\t`\n\t\t\t: `min-height: 20px;`)}\n\t.container {\n\t\tdisplay: flex;\n\t\talign-items: ${(props) => (props.alignIcon ? props.alignIcon : 'center')};\n\t\tgap: 6px;\n\t\t${(props) =>\n\t\t\tprops.size === 'small' ? 'height: 16px; box-sizing: border-box;' : ''}\n\t\tpadding: ${(props) =>\n\t\t\tprops.size === 'small'\n\t\t\t\t? '2px 6px'\n\t\t\t\t: props.contentPadding\n\t\t\t\t? `${props.contentPadding}px`\n\t\t\t\t: getPadding(props.variant)};\n\t\tbackground: ${(props) =>\n\t\t\tprops.backgroundColor ?? getBackgroundColor(props.theme, props.type)};\n\n\t\tborder-radius: ${(props) =>\n\t\t\tprops.borderRadius !== undefined\n\t\t\t\t? typeof props.borderRadius === 'number'\n\t\t\t\t\t? `${props.borderRadius}px`\n\t\t\t\t\t: props.borderRadius\n\t\t\t\t: props.variant === 'regular'\n\t\t\t\t? '4px'\n\t\t\t\t: '12px'};\n\n\t\t${(props) =>\n\t\t\t!props.noBorder &&\n\t\t\tprops.theme === 'light' &&\n\t\t\t`border: ${props.version === '2.0' ? 0.5 : 1}px solid ${generateBorder(\n\t\t\t\tprops.type,\n\t\t\t\tprops.theme,\n\t\t\t)};`}\n\n\t\t.text {\n\t\t\tcolor: ${(props) => getTextColor(props.theme, props.type)};\n\t\t}\n\n\t\t.icon-trailing {\n\t\t\tall: unset;\n\t\t\tdisplay: flex;\n\t\t}\n\n\t\t.icon-leading {\n\t\t\tall: unset;\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n`;\n"],"names":["Tag","process","env","NODE_ENV","target","label","_styled","props","_a","cursor","size","variant","alignIcon","contentPadding","getPadding","backgroundColor","getBackgroundColor","theme","type","undefined","borderRadius","noBorder","version","generateBorder","getTextColor"],"mappings":"2MASO,MAAMA,OAAG,cAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,YAAA,CAAAA,OAAA,WAAAC,MAAA,OAAAC,CAAA,WAaJC,IAAS,IAAAC,EAAC,OAAY,QAAZA,EAAAD,EAAME,cAAM,IAAAD,EAAAA,EAAI,SAAS,GAC3CD,KAAAA,GACa,UAAfA,EAAMG,OACa,YAAlBH,EAAMI,QACJ,0EAMaJ,yCAAAA,GAAWA,EAAMK,UAAYL,EAAMK,UAAY,UAAS,aAErEL,GACa,UAAfA,EAAMG,KAAmB,wCAA0C,IAAE,aAC1DH,GACI,UAAfA,EAAMG,KACH,UACAH,EAAMM,eACN,GAAGN,EAAMM,mBACTC,EAAUA,WAACP,EAAMI,UACNJ,gBAAAA,IAAS,IAAAC,EACvB,OAAqB,QAArBA,EAAAD,EAAMQ,uBAAe,IAAAP,EAAAA,EAAIQ,EAAkBA,mBAACT,EAAMU,MAAOV,EAAMW,KAAK,sBAEnDX,QACMY,IAAvBZ,EAAMa,aAC2B,iBAAvBb,EAAMa,aACZ,GAAGb,EAAMa,iBACTb,EAAMa,aACW,YAAlBb,EAAMI,QACN,MACA,QAAM,KAEPJ,IACDA,EAAMc,UACS,UAAhBd,EAAMU,OACK,WAAkB,QAAlBV,EAAMe,QAAoB,GAAM,aAAaC,EAAcA,eACrEhB,EAAMW,KACNX,EAAMU,4BAIGV,GAAUiB,EAAAA,aAAajB,EAAMU,MAAOV,EAAMW,OAAKjB,oFAa3D,eAb2DA,QAAAC,IAAAC,SAa3D,GAAA"}
+{"version":3,"file":"Tag.styled.js","sources":["../../../../src/components/tag/Tag.styled.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { TagTheme, TagType, TagVariant } from './model';\nimport {\n\tgenerateBorder,\n\tgetBackgroundColor,\n\tgetPadding,\n\tgetTextColor,\n} from './themes';\n\nexport const Tag = styled.div<{\n\ttheme: TagTheme;\n\ttype: TagType;\n\tvariant: TagVariant;\n\tversion?: '1.0' | '2.0';\n\tcursor?: string;\n\talignIcon?: string;\n\tnoBorder?: boolean;\n\tcontentPadding?: number;\n\tbackgroundColor?: string;\n\tborderRadius?: string | number;\n\tsize?: 'regular' | 'small';\n}>`\n\tcursor: ${(props) => props.cursor ?? 'default'};\n\t${(props) =>\n\t\tprops.size !== 'small' &&\n\t\t(props.variant === 'regular'\n\t\t\t? `display: block;\n\t\t     min-height: 26px;\n\t\t`\n\t\t\t: `min-height: 20px;`)}\n\t.container {\n\t\tdisplay: flex;\n\t\talign-items: ${(props) => (props.alignIcon ? props.alignIcon : 'center')};\n\t\tgap: 6px;\n\t\t${(props) =>\n\t\t\tprops.size === 'small' ? 'height: 16px; box-sizing: border-box;' : ''}\n\t\tpadding: ${(props) =>\n\t\t\tprops.size === 'small'\n\t\t\t\t? '2px 6px'\n\t\t\t\t: props.contentPadding\n\t\t\t\t? `${props.contentPadding}px`\n\t\t\t\t: getPadding(props.variant)};\n\t\tbackground: ${(props) =>\n\t\t\tprops.backgroundColor ?? getBackgroundColor(props.theme, props.type)};\n\n\t\tborder-radius: ${(props) =>\n\t\t\tprops.borderRadius !== undefined\n\t\t\t\t? typeof props.borderRadius === 'number'\n\t\t\t\t\t? `${props.borderRadius}px`\n\t\t\t\t\t: props.borderRadius\n\t\t\t\t: props.variant === 'regular'\n\t\t\t\t? '4px'\n\t\t\t\t: '12px'};\n\n\t\t${(props) =>\n\t\t\t!props.noBorder &&\n\t\t\tprops.theme === 'light' &&\n\t\t\t`border: ${props.version === '2.0' ? 0.5 : 1}px solid ${generateBorder(\n\t\t\t\tprops.type,\n\t\t\t\tprops.theme,\n\t\t\t)};`}\n\n\t\t.text {\n\t\t\tcolor: ${(props) => getTextColor(props.theme, props.type)};\n\t\t}\n\n\t\t.icon-trailing {\n\t\t\tall: unset;\n\t\t\tdisplay: flex;\n\t\t}\n\n\t\t.icon-leading {\n\t\t\tall: unset;\n\t\t\tdisplay: flex;\n\t\t}\n\t}\n`;\n"],"names":["Tag","process","env","NODE_ENV","target","label","_styled","props","_a","cursor","size","variant","alignIcon","contentPadding","getPadding","backgroundColor","getBackgroundColor","theme","type","undefined","borderRadius","noBorder","version","generateBorder","getTextColor"],"mappings":"2MASO,MAAMA,OAAG,cAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,YAAA,CAAAA,OAAA,WAAAC,MAAA,OAAAC,CAAA,WAaJC,IAAS,IAAAC,EAAC,OAAY,QAAZA,EAAAD,EAAME,cAAM,IAAAD,EAAAA,EAAI,SAAS,GAC3CD,KAAAA,GACa,UAAfA,EAAMG,OACa,YAAlBH,EAAMI,QACJ,oDAGA,sBAGaJ,yCAAAA,GAAWA,EAAMK,UAAYL,EAAMK,UAAY,UAAS,aAErEL,GACa,UAAfA,EAAMG,KAAmB,wCAA0C,IAAE,aAC1DH,GACI,UAAfA,EAAMG,KACH,UACAH,EAAMM,eACN,GAAGN,EAAMM,mBACTC,EAAUA,WAACP,EAAMI,UACNJ,gBAAAA,IAAS,IAAAC,EACvB,OAAqB,QAArBA,EAAAD,EAAMQ,uBAAe,IAAAP,EAAAA,EAAIQ,EAAkBA,mBAACT,EAAMU,MAAOV,EAAMW,KAAK,sBAEnDX,QACMY,IAAvBZ,EAAMa,aAC2B,iBAAvBb,EAAMa,aACZ,GAAGb,EAAMa,iBACTb,EAAMa,aACW,YAAlBb,EAAMI,QACN,MACA,QAAM,KAEPJ,IACDA,EAAMc,UACS,UAAhBd,EAAMU,OACN,WAA6B,QAAlBV,EAAMe,QAAoB,GAAM,aAAaC,EAAcA,eACrEhB,EAAMW,KACNX,EAAMU,4BAIGV,GAAUiB,EAAAA,aAAajB,EAAMU,MAAOV,EAAMW,OAAKjB,oFAa3D,eAb2DA,QAAAC,IAAAC,SAa3D,GAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"TemplateContextMapper.js","sources":["../../../../src/components/template-context-mapper/TemplateContextMapper.tsx"],"sourcesContent":["import type { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport type { VariableListInterfaceV2 } from '@src/components/add-variableV2/AddVariableV2';\nimport type {\n\tWhatsAppCarouselTemplate,\n\tWhatsAppCarouselTemplateVariables,\n} from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport StringUtils from '@src/utils/StringUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport { StyledModal } from '../modals/styledModal';\nimport {\n\tdetermineCardIndex,\n\tisItCarousal,\n\tisRCSChannel,\n} from '../template-preview/helpers/templateMiscHelper';\nimport { CHANNEL_TYPE } from '../template-preview/models/Channels';\nimport {\n\tCUSTOM_VARIABLE,\n\ttype GlobalPlaceholderType,\n} from '../template-preview/models/TemplateMeta';\nimport type {\n\tAllTemplateTypes,\n\tAllTemplateVariables,\n\tNonNullTemplateTypes,\n} from '../template-preview/models/types';\nimport type { WebpushTemplateVariables } from '../template-preview/models/WebpushTemplate';\nimport {\n\ttype ExtrasWhatsapp,\n\tPOD,\n\tTEMPLATE_QUALITY,\n\ttype TemplateAnalyticsI,\n\ttype WhatsAppPickerMeta,\n\ttype WhatsAppTemplate,\n\ttype WhatsAppTemplateVariables,\n} from '../template-preview/models/WhatsAppTemplate';\nimport type { VariableV3 } from '../variable-picker-v3/model';\nimport {\n\ttype DEVICE_TYPES,\n\tTemplateModalContext,\n} from './context/templateModalContext';\nimport Footer from './modalElements/Footer';\nimport { CarouselProduct } from './modalElements/modal';\nimport { TemplateAnalyticsComponent } from './modalElements/TemplateAnalyticsComponent';\n// import Footer from './modalElements/Footer';\nimport TemplateSelectModalContent from './modalElements/TemplateSelectModalContent';\nimport { convertPlaceholdersToBikDropdown } from './utils/convertPlaceholdersToBikDropdown';\n\nexport interface TemplateContextMapperProps {\n\tselectedTemplate: NonNullTemplateTypes;\n\tcloseDialog?: () => void;\n\tshowVariableMapping: boolean;\n\tchannel: CHANNEL_TYPE;\n\tglobalPlaceholders: GlobalPlaceholderType;\n\t/** List of variables being used in this template */\n\ttemplateVariables:\n\t\t| CUSTOM_VARIABLE[]\n\t\t| WhatsAppTemplateVariables\n\t\t| WhatsAppCarouselTemplateVariables\n\t\t| WebpushTemplateVariables;\n\t/** Only for initial-UI-purpose for the modal */\n\thtmlContent: string;\n\tshowOnlyContent?: boolean;\n\tonTemplateSelect?(\n\t\ttemplate: AllTemplateTypes,\n\t\tvariables: AllTemplateVariables,\n\t\tdisplay_content?: string,\n\t\tcarouselProducts?: CarouselProduct[],\n\t): {\n\t\terror: string;\n\t\terrorIndexes?: number[];\n\t\ttemplateErrorIndexes?: { body?: number[]; buttons?: number[] };\n\t} | void;\n\twhatsappSpecificPickerMeta?: WhatsAppPickerMeta;\n\tzIndex?: number;\n\tshowVariableModal?: boolean;\n\tvariableList?: VariableListInterfaceV2[];\n\tvariableListForImage?: VariableListInterfaceV2[];\n\tonBackPress?: () => void;\n\tdiscountCode?: string;\n\tsetDiscountCode?: (code: string) => void;\n\tenabledCustomText?: boolean;\n\tshowSampleValues?: boolean;\n\tdisableEditVariable?: boolean;\n\tpod?: POD;\n\textras?: ExtrasWhatsapp;\n\tpickerConf?: {\n\t\tsearchInCollection: any;\n\t\tsearchProducts: any;\n\t\tfetchCollections: any;\n\t\tfetchProducts: any;\n\t\tstoreId: string;\n\t\tappType?: ApplicationType;\n\t};\n\tselectedCarouselProducts?: CarouselProduct[];\n\tdisableEditExpiry?: boolean;\n\tcardWidth?: number;\n\tonDeleteSelectedProducts?: () => void;\n\tfileName?: string;\n\tsetFileName?: (name: string) => void;\n\thideDeviceContainerInPreview?: boolean;\n\tmaxCharLimit?: number;\n\tonDefaultVariableSelect?: (variable: VariableV3) => void;\n\tskipDefaultVariableContent?: boolean;\n\tdisableDatePicker?: boolean;\n\tdisableCopyCode?: boolean;\n\tinitialExpiryDateTime?: string;\n\tshowDiscountCodeExpiryInfo?: boolean;\n\tfooterButtonText?: string;\n\tfooterInfoText?: string;\n\ttemplateAnalytics?: TemplateAnalyticsI;\n}\nexport const TemplateContextMapper = (props: TemplateContextMapperProps) => {\n\tconst {\n\t\tselectedTemplate,\n\t\tcloseDialog,\n\t\tshowVariableMapping,\n\t\tchannel,\n\t\thtmlContent,\n\t\ttemplateVariables,\n\t\tonTemplateSelect,\n\t\tglobalPlaceholders,\n\t\tshowOnlyContent,\n\t\twhatsappSpecificPickerMeta,\n\t\tzIndex,\n\t\tshowVariableModal,\n\t\tvariableList: variableListFromProps,\n\t\tdiscountCode,\n\t\tsetDiscountCode,\n\t\tonBackPress,\n\t\tenabledCustomText,\n\t\tvariableListForImage,\n\t\tshowSampleValues,\n\t\tdisableEditVariable,\n\t\tpod,\n\t\textras,\n\t\tpickerConf,\n\t\tselectedCarouselProducts,\n\t\tdisableEditExpiry,\n\t\tcardWidth,\n\t\tonDeleteSelectedProducts,\n\t\tfileName,\n\t\tsetFileName,\n\t\thideDeviceContainerInPreview,\n\t\tmaxCharLimit,\n\t\tonDefaultVariableSelect,\n\t\tskipDefaultVariableContent,\n\t\tdisableDatePicker,\n\t\tdisableCopyCode,\n\t\tinitialExpiryDateTime,\n\t\tshowDiscountCodeExpiryInfo,\n\t\tfooterButtonText,\n\t\tfooterInfoText,\n\t\ttemplateAnalytics,\n\t} = props;\n\n\tuseEffect(() => {\n\t\tsetDisplayContent(htmlContent);\n\t}, [htmlContent]);\n\tconst cardIndex = determineCardIndex(channel);\n\tconst isWhatsappCarousel = isItCarousal(\n\t\tchannel,\n\t\tselectedTemplate as WhatsAppCarouselTemplate,\n\t);\n\n\tconst isProductCarouselType = (selectedTemplate as WhatsAppCarouselTemplate)\n\t\t?.isProductCarouselType;\n\tconst [device, setDevice] = useState<DEVICE_TYPES>(\n\t\tchannel === CHANNEL_TYPE.EMAIL ||\n\t\t\tchannel == CHANNEL_TYPE.WEBPUSH ||\n\t\t\tisWhatsappCarousel\n\t\t\t? 'desktop'\n\t\t\t: 'mobile',\n\t);\n\tconst [showVariablePicker, setShowVariablePicker] = useState<boolean>(false);\n\tconst [display_content, setDisplayContent] = useState<string | null>(\n\t\thtmlContent,\n\t);\n\tconst [isError, setIsError] = useState<boolean>(false);\n\tconst [errorIndexes, setErrorIndexes] = useState<number[]>([]);\n\tconst [templateErrorIndexes, setTemplateErrorIndexes] = useState<{\n\t\tbody?: number[];\n\t\tbuttons?: number[];\n\t}>({});\n\tconst [template, setTemplate] = useState<AllTemplateTypes>(selectedTemplate);\n\tconst [cardImages, setCardImages] = useState<string[]>([]);\n\tconst [variableCallback, setVariableCallback] = useState(null);\n\tconst [hasUpdateOriginalTemplate, setHasUpdateOriginalTemplate] =\n\t\tuseState(false);\n\tconst [originalVariableList, setOriginalVariableList] =\n\t\tuseState<AllTemplateVariables>(templateVariables ?? []);\n\tconst [templateSelectionTriggered, setTemplateSelectionTriggered] =\n\t\tuseState(false);\n\tconst [selectedCarouselIndex, setSelectedCarouselIndex] = useState<number>(\n\t\tisWhatsappCarousel ? (template?.mapping?.body?.length ? -1 : 0) : -1,\n\t);\n\tconst [carouselProducts, setCarouselProducts] = useState<CarouselProduct[]>(\n\t\t[],\n\t);\n\tconst [variableList, setVariableList] = useState<\n\t\tVariableListInterfaceV2[] | undefined\n\t>(undefined);\n\n\tconst sliderRef = useRef(null);\n\n\tconst [isCarouselHovered, setIsCarouselHovered] = useState(false);\n\tconst [hideCrossButton, setHideCrossButton] = useState(false);\n\tconst [hideFooterButton, setHideFooterButton] = useState(false);\n\tconst [showWarningModal, setShowWarningModal] = useState(true);\n\tconst [openMapper, setOpenMapper] = useState(true);\n\tconst [ctaOptionsErrors, setCtaOptionsErrors] = useState({});\n\tconst [carouselBodyError, setCarouselBodyError] = useState<string>('');\n\n\tuseEffect(() => {\n\t\tif (selectedCarouselProducts) {\n\t\t\tsetCarouselProducts(selectedCarouselProducts);\n\t\t} else if (isProductCarouselType) {\n\t\t\tsetCarouselProducts([]);\n\t\t}\n\t}, [selectedCarouselProducts]);\n\n\tuseEffect(() => {\n\t\tif (\n\t\t\t!hasUpdateOriginalTemplate &&\n\t\t\tisProductCarouselType &&\n\t\t\t(!selectedCarouselProducts || setCarouselProducts.length === 0)\n\t\t) {\n\t\t\tconst cards = (template as WhatsAppCarouselTemplate)?.components?.[\n\t\t\t\tcardIndex\n\t\t\t].cards;\n\t\t\tconst images: string[] = [];\n\t\t\tcards?.forEach((card) => {\n\t\t\t\tcard?.components?.forEach((comp) => {\n\t\t\t\t\tif (comp.type === 'HEADER') {\n\t\t\t\t\t\timages.push(comp.example?.header_handle?.[0] ?? '');\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t});\n\t\t\tsetCardImages(images);\n\t\t\tsetHasUpdateOriginalTemplate(true);\n\t\t}\n\t}, [hasUpdateOriginalTemplate]);\n\n\tfunction getProductCarouselBodyError(\n\t\tcarouselTemplate: WhatsAppCarouselTemplate,\n\t\tproducts: CarouselProduct[],\n\t\tidx: number,\n\t): string {\n\t\tconst cards = carouselTemplate?.components?.[idx]?.cards;\n\t\tif (!cards?.length || !products?.length) return '';\n\n\t\tconst cardBodyText =\n\t\t\tcards[0]?.components?.find((c) => c.type === 'BODY')?.text ?? '';\n\t\tif (!cardBodyText) return '';\n\n\t\tconst bodyMapping = carouselTemplate?.mapping?.cards?.[0]?.body ?? [];\n\t\tif (!bodyMapping.length) return '';\n\n\t\tconst PRODUCT_VAR_TO_FIELD: Partial<Record<string, keyof CarouselProduct>> =\n\t\t\t{\n\t\t\t\t'{{product.name}}': 'productName',\n\t\t\t\t'{{product.description}}': 'productDescription',\n\t\t\t};\n\n\t\tfor (const product of products) {\n\t\t\tlet resolvedText = cardBodyText;\n\t\t\tfor (let i = 0; i < bodyMapping.length; i++) {\n\t\t\t\tconst varPlaceholder = bodyMapping[i];\n\t\t\t\tconst productField = PRODUCT_VAR_TO_FIELD[varPlaceholder];\n\t\t\t\tif (productField === undefined) continue;\n\t\t\t\tconst value = product[productField] as string | undefined;\n\t\t\t\tif (!value) {\n\t\t\t\t\treturn `Variable ${varPlaceholder} is missing for product \"${product.productName}\".`;\n\t\t\t\t}\n\t\t\t\tresolvedText = resolvedText.replace(`{{${i + 1}}}`, value);\n\t\t\t}\n\t\t\tif (resolvedText.length > 160) {\n\t\t\t\treturn `Selected products description/name making the description more than 160.`;\n\t\t\t}\n\t\t}\n\t\treturn '';\n\t}\n\n\tfunction onSelect() {\n\t\tsetCarouselBodyError('');\n\n\t\tif (carouselProducts?.length < 1 && isProductCarouselType) {\n\t\t\tsetIsError(true);\n\t\t\treturn;\n\t\t}\n\n\t\t// Added pod check because campaign uses dropdown where cta options empty error is possible\n\t\t// Chatbot is using variable picker where empty error is not possible\n\t\tif (Object.keys(ctaOptionsErrors).length > 0 && pod !== POD.CHATBOT) {\n\t\t\tsetIsError(true);\n\t\t\treturn;\n\t\t}\n\n\t\tif (isProductCarouselType && (carouselProducts?.length ?? 0) > 0) {\n\t\t\tconst bodyErr = getProductCarouselBodyError(\n\t\t\t\ttemplate as WhatsAppCarouselTemplate,\n\t\t\t\tcarouselProducts,\n\t\t\t\tcardIndex,\n\t\t\t);\n\t\t\tif (bodyErr) {\n\t\t\t\tsetCarouselBodyError(bodyErr);\n\t\t\t\tsetIsError(true);\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\n\t\tconst error = onTemplateSelect?.(\n\t\t\ttemplate as AllTemplateTypes,\n\t\t\toriginalVariableList,\n\t\t\tdisplay_content ?? '',\n\t\t\tcarouselProducts,\n\t\t);\n\n\t\tsetTemplateErrorIndexes(\n\t\t\terror?.templateErrorIndexes ?? { body: [], buttons: [] },\n\t\t);\n\n\t\tif (error?.errorIndexes || error?.error) {\n\t\t\tif (error?.errorIndexes) {\n\t\t\t\tsetErrorIndexes(error.errorIndexes);\n\t\t\t}\n\t\t\tif (error?.error) {\n\t\t\t\tsetIsError(!!error?.error);\n\t\t\t}\n\t\t} else {\n\t\t\tsetTemplateSelectionTriggered(true);\n\t\t}\n\t}\n\n\tconst globalNormalizedPlaceholders = useMemo(\n\t\t() => convertPlaceholdersToBikDropdown(globalPlaceholders),\n\t\t[globalPlaceholders],\n\t);\n\n\tuseEffect(() => {\n\t\tsetVariableList(cloneDeep(variableListFromProps));\n\t}, [variableListFromProps]);\n\n\tif (\n\t\ttemplateAnalytics?.show &&\n\t\tshowWarningModal &&\n\t\ttemplateAnalytics.templateQuality &&\n\t\tObject.values(TEMPLATE_QUALITY).find(\n\t\t\t(value) => value === String(templateAnalytics.templateQuality),\n\t\t)\n\t) {\n\t\t// extra check for other pods\n\t\treturn (\n\t\t\t<TemplateAnalyticsComponent\n\t\t\t\theadingTitle={template?.label}\n\t\t\t\theadingSubtitle={\n\t\t\t\t\tchannel === CHANNEL_TYPE.WHATSAPP\n\t\t\t\t\t\t? `${StringUtils.capitaliseFirstLetterOfString(\n\t\t\t\t\t\t\t\ttemplate?.category ?? '',\n\t\t\t\t\t\t  )} • ${(template as WhatsAppTemplate)?.templateCategory ?? ''}`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t\ttemplateAnalytics={templateAnalytics}\n\t\t\t\tanalyticsData={templateAnalytics.data}\n\t\t\t\tonClose={() => {\n\t\t\t\t\tcloseDialog?.();\n\t\t\t\t\tsetShowWarningModal(false);\n\t\t\t\t\tsetOpenMapper(false);\n\t\t\t\t}}\n\t\t\t\tonCancel={() => {\n\t\t\t\t\tsetShowWarningModal(false);\n\t\t\t\t\tsetOpenMapper(false);\n\t\t\t\t}}\n\t\t\t\tonProceed={() => {\n\t\t\t\t\tsetShowWarningModal(false);\n\t\t\t\t\tsetOpenMapper(true);\n\t\t\t\t}}\n\t\t\t\ttemplateId={template?.templateId || ''}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<TemplateModalContext.Provider\n\t\t\tvalue={{\n\t\t\t\thideFooterButton,\n\t\t\t\tsetHideFooterButton,\n\t\t\t\thideCrossButton,\n\t\t\t\tsetHideCrossButton,\n\t\t\t\tvariableList,\n\t\t\t\tsetVariableList,\n\t\t\t\tvariableCallback,\n\t\t\t\tsetVariableCallback,\n\t\t\t\tshowVariablePicker,\n\t\t\t\tsetShowVariablePicker,\n\t\t\t\ttemplate,\n\t\t\t\tsetTemplate,\n\t\t\t\tdevice,\n\t\t\t\tsetDevice,\n\t\t\t\tdisplay_content,\n\t\t\t\tsetDisplayContent,\n\t\t\t\toriginalVariableList,\n\t\t\t\tsetOriginalVariableList,\n\t\t\t\tisError,\n\t\t\t\tsetIsError,\n\t\t\t\tchannel,\n\t\t\t\tglobalNormalizedPlaceholders,\n\t\t\t\ttemplateSelectionTriggered,\n\t\t\t\tsetTemplateSelectionTriggered,\n\t\t\t\tenabledCustomText,\n\t\t\t\tdisableEditVariable,\n\t\t\t\tpod,\n\t\t\t\textras,\n\t\t\t\tisWhatsappCarousel,\n\t\t\t\tselectedCarouselIndex,\n\t\t\t\tsetSelectedCarouselIndex,\n\t\t\t\tisProductCarouselType,\n\t\t\t\ttemplateErrorIndexes,\n\t\t\t\tcardCount: isWhatsappCarousel\n\t\t\t\t\t? (selectedTemplate as WhatsAppCarouselTemplate).components?.[\n\t\t\t\t\t\t\tcardIndex\n\t\t\t\t\t  ].cards?.length\n\t\t\t\t\t: undefined,\n\t\t\t\terrorIndexes,\n\t\t\t\tsetErrorIndexes,\n\t\t\t\tpickerConf,\n\t\t\t\tcarouselProducts,\n\t\t\t\tsetCarouselProducts,\n\t\t\t\tdisableEditExpiry,\n\t\t\t\tcardWidth,\n\t\t\t\tcardImages,\n\t\t\t\tonDeleteSelectedProducts,\n\t\t\t\thideDeviceContainerInPreview,\n\t\t\t\tsliderRef,\n\t\t\t\tisCarouselHovered,\n\t\t\t\tsetIsCarouselHovered,\n\t\t\t\tmaxCharLimit,\n\t\t\t\tctaOptionsErrors,\n\t\t\t\tsetCtaOptionsErrors,\n\t\t\t\tonDefaultVariableSelect,\n\t\t\t\tcarouselBodyError,\n\t\t\t\tsetCarouselBodyError,\n\t\t\t\tdisableDatePicker,\n\t\t\t\tdisableCopyCode,\n\t\t\t\tinitialExpiryDateTime,\n\t\t\t\tshowDiscountCodeExpiryInfo,\n\t\t\t\tcardIndex,\n\t\t\t}}\n\t\t>\n\t\t\t{showOnlyContent ? (\n\t\t\t\t<TemplateSelectModalContent\n\t\t\t\t\tvariableListFromProps={variableListFromProps}\n\t\t\t\t\tchannel={CHANNEL_TYPE.EMAIL}\n\t\t\t\t\thideHeader\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<StyledModal\n\t\t\t\t\thideCrossButton={hideCrossButton}\n\t\t\t\t\tzIndex={zIndex}\n\t\t\t\t\tcentralContainerStyles={{\n\t\t\t\t\t\twidth: isWhatsappCarousel\n\t\t\t\t\t\t\t? 900\n\t\t\t\t\t\t\t: channel === CHANNEL_TYPE.EMAIL && showVariableMapping\n\t\t\t\t\t\t\t? 1000\n\t\t\t\t\t\t\t: 800,\n\t\t\t\t\t}}\n\t\t\t\t\topen={openMapper}\n\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\tsetOpenMapper(false);\n\t\t\t\t\t\tcloseDialog?.();\n\t\t\t\t\t}}\n\t\t\t\t\theadingTitle={template?.label}\n\t\t\t\t\theadingSubtitle={\n\t\t\t\t\t\tchannel === CHANNEL_TYPE.WHATSAPP || isRCSChannel(channel)\n\t\t\t\t\t\t\t? `${StringUtils.capitaliseFirstLetterOfString(\n\t\t\t\t\t\t\t\t\ttemplate?.category ?? '',\n\t\t\t\t\t\t\t  )} • ${(template as WhatsAppTemplate)?.templateCategory ?? ''}`\n\t\t\t\t\t\t\t: ''\n\t\t\t\t\t}\n\t\t\t\t\tonBackPress={() => {\n\t\t\t\t\t\tif (templateAnalytics?.show) {\n\t\t\t\t\t\t\tsetShowWarningModal(true);\n\t\t\t\t\t\t\tsetOpenMapper(false);\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonBackPress?.();\n\t\t\t\t\t}}\n\t\t\t\t\tmodalHeaderStyles={{\n\t\t\t\t\t\tborderBottom: `1px solid ${COLORS.stroke.primary}`,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<TemplateSelectModalContent\n\t\t\t\t\t\tvariableListFromProps={variableListFromProps}\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t\tshowVariableMapping={showVariableMapping}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\twhatsappSpecificPickerMeta={whatsappSpecificPickerMeta}\n\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\tdiscountCode={discountCode}\n\t\t\t\t\t\tsetDiscountCode={setDiscountCode}\n\t\t\t\t\t\tvariableListForImage={\n\t\t\t\t\t\t\tvariableListForImage && variableListForImage?.length > 0\n\t\t\t\t\t\t\t\t? variableListForImage\n\t\t\t\t\t\t\t\t: variableList\n\t\t\t\t\t\t}\n\t\t\t\t\t\tfileName={fileName}\n\t\t\t\t\t\tsetFileName={(file) => {\n\t\t\t\t\t\t\tsetFileName?.(file);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tskipDefaultVariableContent={skipDefaultVariableContent}\n\t\t\t\t\t/>\n\t\t\t\t\t{onTemplateSelect ? (\n\t\t\t\t\t\t<Footer\n\t\t\t\t\t\t\tisWhatsappCarousel={isWhatsappCarousel ?? false}\n\t\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\t\tfooterButtonText={footerButtonText}\n\t\t\t\t\t\t\tfooterInfoText={footerInfoText}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<></>\n\t\t\t\t\t)}\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</TemplateModalContext.Provider>\n\t);\n};\n"],"names":["props","selectedTemplate","closeDialog","showVariableMapping","channel","htmlContent","templateVariables","onTemplateSelect","globalPlaceholders","showOnlyContent","whatsappSpecificPickerMeta","zIndex","showVariableModal","variableList","variableListFromProps","discountCode","setDiscountCode","onBackPress","enabledCustomText","variableListForImage","showSampleValues","disableEditVariable","pod","extras","pickerConf","selectedCarouselProducts","disableEditExpiry","cardWidth","onDeleteSelectedProducts","fileName","setFileName","hideDeviceContainerInPreview","maxCharLimit","onDefaultVariableSelect","skipDefaultVariableContent","disableDatePicker","disableCopyCode","initialExpiryDateTime","showDiscountCodeExpiryInfo","footerButtonText","footerInfoText","templateAnalytics","useEffect","setDisplayContent","cardIndex","determineCardIndex","isWhatsappCarousel","isItCarousal","isProductCarouselType","device","setDevice","useState","CHANNEL_TYPE","EMAIL","WEBPUSH","showVariablePicker","setShowVariablePicker","display_content","isError","setIsError","errorIndexes","setErrorIndexes","templateErrorIndexes","setTemplateErrorIndexes","template","setTemplate","cardImages","setCardImages","variableCallback","setVariableCallback","hasUpdateOriginalTemplate","setHasUpdateOriginalTemplate","originalVariableList","setOriginalVariableList","templateSelectionTriggered","setTemplateSelectionTriggered","selectedCarouselIndex","setSelectedCarouselIndex","_b","mapping","_a","body","length","carouselProducts","setCarouselProducts","setVariableList","undefined","sliderRef","useRef","isCarouselHovered","setIsCarouselHovered","hideCrossButton","setHideCrossButton","hideFooterButton","setHideFooterButton","showWarningModal","setShowWarningModal","openMapper","setOpenMapper","ctaOptionsErrors","setCtaOptionsErrors","carouselBodyError","setCarouselBodyError","cards","components","images","forEach","card","comp","type","push","_c","example","header_handle","globalNormalizedPlaceholders","useMemo","convertPlaceholdersToBikDropdown","cloneDeep","show","templateQuality","Object","values","TEMPLATE_QUALITY","find","value","String","_jsx","TemplateAnalyticsComponent","headingTitle","label","headingSubtitle","WHATSAPP","StringUtils","capitaliseFirstLetterOfString","category","_d","templateCategory","analyticsData","data","onClose","onCancel","onProceed","templateId","jsx","TemplateModalContext","Provider","assign","cardCount","_f","_e","children","TemplateSelectModalContent","hideHeader","_jsxs","StyledModal","centralContainerStyles","width","open","isRCSChannel","_g","_h","modalHeaderStyles","borderBottom","COLORS","stroke","primary","file","Footer","onSelect","keys","POD","CHATBOT","bodyErr","carouselTemplate","products","idx","cardBodyText","c","text","bodyMapping","_k","_j","PRODUCT_VAR_TO_FIELD","product","resolvedText","i","varPlaceholder","productField","productName","replace","getProductCarouselBodyError","error","buttons","_Fragment"],"mappings":"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"}
+{"version":3,"file":"TemplateContextMapper.js","sources":["../../../../src/components/template-context-mapper/TemplateContextMapper.tsx"],"sourcesContent":["import type { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport type { VariableListInterfaceV2 } from '@src/components/add-variableV2/AddVariableV2';\nimport type {\n\tWhatsAppCarouselTemplate,\n\tWhatsAppCarouselTemplateVariables,\n} from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport StringUtils from '@src/utils/StringUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport { StyledModal } from '../modals/styledModal';\nimport {\n\tdetermineCardIndex,\n\tisItCarousal,\n\tisRCSChannel,\n} from '../template-preview/helpers/templateMiscHelper';\nimport { CHANNEL_TYPE } from '../template-preview/models/Channels';\nimport {\n\tCUSTOM_VARIABLE,\n\ttype GlobalPlaceholderType,\n} from '../template-preview/models/TemplateMeta';\nimport type {\n\tAllTemplateTypes,\n\tAllTemplateVariables,\n\tNonNullTemplateTypes,\n} from '../template-preview/models/types';\nimport type { WebpushTemplateVariables } from '../template-preview/models/WebpushTemplate';\nimport {\n\ttype ExtrasWhatsapp,\n\tPOD,\n\tTEMPLATE_QUALITY,\n\ttype TemplateAnalyticsI,\n\ttype WhatsAppPickerMeta,\n\ttype WhatsAppTemplate,\n\ttype WhatsAppTemplateVariables,\n} from '../template-preview/models/WhatsAppTemplate';\nimport type { VariableV3 } from '../variable-picker-v3/model';\nimport {\n\ttype DEVICE_TYPES,\n\tTemplateModalContext,\n} from './context/templateModalContext';\nimport Footer from './modalElements/Footer';\nimport { CarouselProduct } from './modalElements/modal';\nimport { TemplateAnalyticsComponent } from './modalElements/TemplateAnalyticsComponent';\n// import Footer from './modalElements/Footer';\nimport TemplateSelectModalContent from './modalElements/TemplateSelectModalContent';\nimport { convertPlaceholdersToBikDropdown } from './utils/convertPlaceholdersToBikDropdown';\n\nexport interface TemplateContextMapperProps {\n\tselectedTemplate: NonNullTemplateTypes;\n\tcloseDialog?: () => void;\n\tshowVariableMapping: boolean;\n\tchannel: CHANNEL_TYPE;\n\tglobalPlaceholders: GlobalPlaceholderType;\n\t/** List of variables being used in this template */\n\ttemplateVariables:\n\t\t| CUSTOM_VARIABLE[]\n\t\t| WhatsAppTemplateVariables\n\t\t| WhatsAppCarouselTemplateVariables\n\t\t| WebpushTemplateVariables;\n\t/** Only for initial-UI-purpose for the modal */\n\thtmlContent: string;\n\tshowOnlyContent?: boolean;\n\tonTemplateSelect?(\n\t\ttemplate: AllTemplateTypes,\n\t\tvariables: AllTemplateVariables,\n\t\tdisplay_content?: string,\n\t\tcarouselProducts?: CarouselProduct[],\n\t): {\n\t\terror: string;\n\t\terrorIndexes?: number[];\n\t\ttemplateErrorIndexes?: { body?: number[]; buttons?: number[] };\n\t} | void;\n\twhatsappSpecificPickerMeta?: WhatsAppPickerMeta;\n\tzIndex?: number;\n\tshowVariableModal?: boolean;\n\tvariableList?: VariableListInterfaceV2[];\n\tvariableListForImage?: VariableListInterfaceV2[];\n\tonBackPress?: () => void;\n\tdiscountCode?: string;\n\tsetDiscountCode?: (code: string) => void;\n\tenabledCustomText?: boolean;\n\tshowSampleValues?: boolean;\n\tdisableEditVariable?: boolean;\n\tpod?: POD;\n\textras?: ExtrasWhatsapp;\n\tpickerConf?: {\n\t\tsearchInCollection: any;\n\t\tsearchProducts: any;\n\t\tfetchCollections: any;\n\t\tfetchProducts: any;\n\t\tstoreId: string;\n\t\tappType?: ApplicationType;\n\t};\n\tselectedCarouselProducts?: CarouselProduct[];\n\tdisableEditExpiry?: boolean;\n\tcardWidth?: number;\n\tonDeleteSelectedProducts?: () => void;\n\tfileName?: string;\n\tsetFileName?: (name: string) => void;\n\thideDeviceContainerInPreview?: boolean;\n\tmaxCharLimit?: number;\n\tonDefaultVariableSelect?: (variable: VariableV3) => void;\n\tskipDefaultVariableContent?: boolean;\n\tdisableDatePicker?: boolean;\n\tdisableCopyCode?: boolean;\n\tinitialExpiryDateTime?: string;\n\tshowDiscountCodeExpiryInfo?: boolean;\n\tfooterButtonText?: string;\n\tfooterInfoText?: string;\n\ttemplateAnalytics?: TemplateAnalyticsI;\n}\nexport const TemplateContextMapper = (props: TemplateContextMapperProps) => {\n\tconst {\n\t\tselectedTemplate,\n\t\tcloseDialog,\n\t\tshowVariableMapping,\n\t\tchannel,\n\t\thtmlContent,\n\t\ttemplateVariables,\n\t\tonTemplateSelect,\n\t\tglobalPlaceholders,\n\t\tshowOnlyContent,\n\t\twhatsappSpecificPickerMeta,\n\t\tzIndex,\n\t\tshowVariableModal,\n\t\tvariableList: variableListFromProps,\n\t\tdiscountCode,\n\t\tsetDiscountCode,\n\t\tonBackPress,\n\t\tenabledCustomText,\n\t\tvariableListForImage,\n\t\tshowSampleValues,\n\t\tdisableEditVariable,\n\t\tpod,\n\t\textras,\n\t\tpickerConf,\n\t\tselectedCarouselProducts,\n\t\tdisableEditExpiry,\n\t\tcardWidth,\n\t\tonDeleteSelectedProducts,\n\t\tfileName,\n\t\tsetFileName,\n\t\thideDeviceContainerInPreview,\n\t\tmaxCharLimit,\n\t\tonDefaultVariableSelect,\n\t\tskipDefaultVariableContent,\n\t\tdisableDatePicker,\n\t\tdisableCopyCode,\n\t\tinitialExpiryDateTime,\n\t\tshowDiscountCodeExpiryInfo,\n\t\tfooterButtonText,\n\t\tfooterInfoText,\n\t\ttemplateAnalytics,\n\t} = props;\n\n\tuseEffect(() => {\n\t\tsetDisplayContent(htmlContent);\n\t}, [htmlContent]);\n\tconst cardIndex = determineCardIndex(channel);\n\tconst isWhatsappCarousel = isItCarousal(\n\t\tchannel,\n\t\tselectedTemplate as WhatsAppCarouselTemplate,\n\t);\n\n\tconst isProductCarouselType = (selectedTemplate as WhatsAppCarouselTemplate)\n\t\t?.isProductCarouselType;\n\tconst [device, setDevice] = useState<DEVICE_TYPES>(\n\t\tchannel === CHANNEL_TYPE.EMAIL ||\n\t\t\tchannel == CHANNEL_TYPE.WEBPUSH ||\n\t\t\tisWhatsappCarousel\n\t\t\t? 'desktop'\n\t\t\t: 'mobile',\n\t);\n\tconst [showVariablePicker, setShowVariablePicker] = useState<boolean>(false);\n\tconst [display_content, setDisplayContent] = useState<string | null>(\n\t\thtmlContent,\n\t);\n\tconst [isError, setIsError] = useState<boolean>(false);\n\tconst [errorIndexes, setErrorIndexes] = useState<number[]>([]);\n\tconst [templateErrorIndexes, setTemplateErrorIndexes] = useState<{\n\t\tbody?: number[];\n\t\tbuttons?: number[];\n\t}>({});\n\tconst [template, setTemplate] = useState<AllTemplateTypes>(selectedTemplate);\n\tconst [cardImages, setCardImages] = useState<string[]>([]);\n\tconst [variableCallback, setVariableCallback] = useState(null);\n\tconst [hasUpdateOriginalTemplate, setHasUpdateOriginalTemplate] =\n\t\tuseState(false);\n\tconst [originalVariableList, setOriginalVariableList] =\n\t\tuseState<AllTemplateVariables>(templateVariables ?? []);\n\tconst [templateSelectionTriggered, setTemplateSelectionTriggered] =\n\t\tuseState(false);\n\tconst [selectedCarouselIndex, setSelectedCarouselIndex] = useState<number>(\n\t\tisWhatsappCarousel ? (template?.mapping?.body?.length ? -1 : 0) : -1,\n\t);\n\tconst [carouselProducts, setCarouselProducts] = useState<CarouselProduct[]>(\n\t\t[],\n\t);\n\tconst [variableList, setVariableList] = useState<\n\t\tVariableListInterfaceV2[] | undefined\n\t>(undefined);\n\n\tconst sliderRef = useRef(null);\n\n\tconst [isCarouselHovered, setIsCarouselHovered] = useState(false);\n\tconst [hideCrossButton, setHideCrossButton] = useState(false);\n\tconst [hideFooterButton, setHideFooterButton] = useState(false);\n\tconst [showWarningModal, setShowWarningModal] = useState(true);\n\tconst [openMapper, setOpenMapper] = useState(true);\n\tconst [ctaOptionsErrors, setCtaOptionsErrors] = useState({});\n\tconst [carouselBodyError, setCarouselBodyError] = useState<string>('');\n\n\tuseEffect(() => {\n\t\tif (selectedCarouselProducts) {\n\t\t\tsetCarouselProducts(selectedCarouselProducts);\n\t\t} else if (isProductCarouselType) {\n\t\t\tsetCarouselProducts([]);\n\t\t}\n\t}, [selectedCarouselProducts]);\n\n\tuseEffect(() => {\n\t\tif (\n\t\t\t!hasUpdateOriginalTemplate &&\n\t\t\tisProductCarouselType &&\n\t\t\t(!selectedCarouselProducts || setCarouselProducts.length === 0)\n\t\t) {\n\t\t\tconst cards = (template as WhatsAppCarouselTemplate)?.components?.[\n\t\t\t\tcardIndex\n\t\t\t].cards;\n\t\t\tconst images: string[] = [];\n\t\t\tcards?.forEach((card) => {\n\t\t\t\tcard?.components?.forEach((comp) => {\n\t\t\t\t\tif (comp.type === 'HEADER') {\n\t\t\t\t\t\timages.push(comp.example?.header_handle?.[0] ?? '');\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t});\n\t\t\tsetCardImages(images);\n\t\t\tsetHasUpdateOriginalTemplate(true);\n\t\t}\n\t}, [hasUpdateOriginalTemplate]);\n\n\tfunction getProductCarouselBodyError(\n\t\tcarouselTemplate: WhatsAppCarouselTemplate,\n\t\tproducts: CarouselProduct[],\n\t\tidx: number,\n\t): string {\n\t\tconst cards = carouselTemplate?.components?.[idx]?.cards;\n\t\tif (!cards?.length || !products?.length) return '';\n\n\t\tconst cardBodyText =\n\t\t\tcards[0]?.components?.find((c) => c.type === 'BODY')?.text ?? '';\n\t\tif (!cardBodyText) return '';\n\n\t\tconst bodyMapping = carouselTemplate?.mapping?.cards?.[0]?.body ?? [];\n\t\tif (!bodyMapping.length) return '';\n\n\t\tconst PRODUCT_VAR_TO_FIELD: Partial<Record<string, keyof CarouselProduct>> =\n\t\t\t{\n\t\t\t\t'{{product.name}}': 'productName',\n\t\t\t\t'{{product.description}}': 'productDescription',\n\t\t\t};\n\n\t\tfor (const product of products) {\n\t\t\tlet resolvedText = cardBodyText;\n\t\t\tfor (let i = 0; i < bodyMapping.length; i++) {\n\t\t\t\tconst varPlaceholder = bodyMapping[i];\n\t\t\t\tconst productField = PRODUCT_VAR_TO_FIELD[varPlaceholder];\n\t\t\t\tif (productField === undefined) continue;\n\t\t\t\tconst value = product[productField] as string | undefined;\n\t\t\t\tif (!value) {\n\t\t\t\t\treturn `Variable ${varPlaceholder} is missing for product \"${product.productName}\".`;\n\t\t\t\t}\n\t\t\t\tresolvedText = resolvedText.replace(`{{${i + 1}}}`, value);\n\t\t\t}\n\t\t\tif (resolvedText.length > 160) {\n\t\t\t\treturn `Selected products description/name making the description more than 160.`;\n\t\t\t}\n\t\t}\n\t\treturn '';\n\t}\n\n\tfunction onSelect() {\n\t\tsetCarouselBodyError('');\n\n\t\tif (carouselProducts?.length < 1 && isProductCarouselType) {\n\t\t\tsetIsError(true);\n\t\t\treturn;\n\t\t}\n\n\t\t// Added pod check because campaign uses dropdown where cta options empty error is possible\n\t\t// Chatbot is using variable picker where empty error is not possible\n\t\tif (Object.keys(ctaOptionsErrors).length > 0 && pod !== POD.CHATBOT) {\n\t\t\tsetIsError(true);\n\t\t\treturn;\n\t\t}\n\n\t\tif (isProductCarouselType && (carouselProducts?.length ?? 0) > 0) {\n\t\t\tconst bodyErr = getProductCarouselBodyError(\n\t\t\t\ttemplate as WhatsAppCarouselTemplate,\n\t\t\t\tcarouselProducts,\n\t\t\t\tcardIndex,\n\t\t\t);\n\t\t\tif (bodyErr) {\n\t\t\t\tsetCarouselBodyError(bodyErr);\n\t\t\t\tsetIsError(true);\n\t\t\t\treturn;\n\t\t\t}\n\t\t}\n\n\t\tconst error = onTemplateSelect?.(\n\t\t\ttemplate as AllTemplateTypes,\n\t\t\toriginalVariableList,\n\t\t\tdisplay_content ?? '',\n\t\t\tcarouselProducts,\n\t\t);\n\n\t\tsetTemplateErrorIndexes(\n\t\t\terror?.templateErrorIndexes ?? { body: [], buttons: [] },\n\t\t);\n\n\t\tif (error?.errorIndexes || error?.error) {\n\t\t\tif (error?.errorIndexes) {\n\t\t\t\tsetErrorIndexes(error.errorIndexes);\n\t\t\t}\n\t\t\tif (error?.error) {\n\t\t\t\tsetIsError(!!error?.error);\n\t\t\t}\n\t\t} else {\n\t\t\tsetTemplateSelectionTriggered(true);\n\t\t}\n\t}\n\n\tconst globalNormalizedPlaceholders = useMemo(\n\t\t() => convertPlaceholdersToBikDropdown(globalPlaceholders),\n\t\t[globalPlaceholders],\n\t);\n\n\tuseEffect(() => {\n\t\tsetVariableList(cloneDeep(variableListFromProps));\n\t}, [variableListFromProps]);\n\n\tif (\n\t\ttemplateAnalytics?.show &&\n\t\tshowWarningModal &&\n\t\ttemplateAnalytics.templateQuality &&\n\t\tObject.values(TEMPLATE_QUALITY).find(\n\t\t\t(value) => value === String(templateAnalytics.templateQuality),\n\t\t)\n\t) {\n\t\t// extra check for other pods\n\t\treturn (\n\t\t\t<TemplateAnalyticsComponent\n\t\t\t\theadingTitle={template?.label}\n\t\t\t\theadingSubtitle={\n\t\t\t\t\tchannel === CHANNEL_TYPE.WHATSAPP\n\t\t\t\t\t\t? `${StringUtils.capitaliseFirstLetterOfString(\n\t\t\t\t\t\t\t\ttemplate?.category ?? '',\n\t\t\t\t\t\t  )} • ${(template as WhatsAppTemplate)?.templateCategory ?? ''}`\n\t\t\t\t\t\t: ''\n\t\t\t\t}\n\t\t\t\ttemplateAnalytics={templateAnalytics}\n\t\t\t\tanalyticsData={templateAnalytics.data}\n\t\t\t\tonClose={() => {\n\t\t\t\t\tcloseDialog?.();\n\t\t\t\t\tsetShowWarningModal(false);\n\t\t\t\t\tsetOpenMapper(false);\n\t\t\t\t}}\n\t\t\t\tonCancel={() => {\n\t\t\t\t\tsetShowWarningModal(false);\n\t\t\t\t\tsetOpenMapper(false);\n\t\t\t\t}}\n\t\t\t\tonProceed={() => {\n\t\t\t\t\tsetShowWarningModal(false);\n\t\t\t\t\tsetOpenMapper(true);\n\t\t\t\t}}\n\t\t\t\ttemplateId={template?.templateId || ''}\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<TemplateModalContext.Provider\n\t\t\tvalue={{\n\t\t\t\thideFooterButton,\n\t\t\t\tsetHideFooterButton,\n\t\t\t\thideCrossButton,\n\t\t\t\tsetHideCrossButton,\n\t\t\t\tvariableList,\n\t\t\t\tsetVariableList,\n\t\t\t\tvariableCallback,\n\t\t\t\tsetVariableCallback,\n\t\t\t\tshowVariablePicker,\n\t\t\t\tsetShowVariablePicker,\n\t\t\t\ttemplate,\n\t\t\t\tsetTemplate,\n\t\t\t\tdevice,\n\t\t\t\tsetDevice,\n\t\t\t\tdisplay_content,\n\t\t\t\tsetDisplayContent,\n\t\t\t\toriginalVariableList,\n\t\t\t\tsetOriginalVariableList,\n\t\t\t\tisError,\n\t\t\t\tsetIsError,\n\t\t\t\tchannel,\n\t\t\t\tglobalNormalizedPlaceholders,\n\t\t\t\ttemplateSelectionTriggered,\n\t\t\t\tsetTemplateSelectionTriggered,\n\t\t\t\tenabledCustomText,\n\t\t\t\tdisableEditVariable,\n\t\t\t\tpod,\n\t\t\t\textras,\n\t\t\t\tisWhatsappCarousel,\n\t\t\t\tselectedCarouselIndex,\n\t\t\t\tsetSelectedCarouselIndex,\n\t\t\t\tisProductCarouselType,\n\t\t\t\ttemplateErrorIndexes,\n\t\t\t\tcardCount: isWhatsappCarousel\n\t\t\t\t\t? (selectedTemplate as WhatsAppCarouselTemplate).components?.[\n\t\t\t\t\t\t\tcardIndex\n\t\t\t\t\t  ].cards?.length\n\t\t\t\t\t: undefined,\n\t\t\t\terrorIndexes,\n\t\t\t\tsetErrorIndexes,\n\t\t\t\tpickerConf,\n\t\t\t\tcarouselProducts,\n\t\t\t\tsetCarouselProducts,\n\t\t\t\tdisableEditExpiry,\n\t\t\t\tcardWidth,\n\t\t\t\tcardImages,\n\t\t\t\tonDeleteSelectedProducts,\n\t\t\t\thideDeviceContainerInPreview,\n\t\t\t\tsliderRef,\n\t\t\t\tisCarouselHovered,\n\t\t\t\tsetIsCarouselHovered,\n\t\t\t\tmaxCharLimit,\n\t\t\t\tctaOptionsErrors,\n\t\t\t\tsetCtaOptionsErrors,\n\t\t\t\tonDefaultVariableSelect,\n\t\t\t\tcarouselBodyError,\n\t\t\t\tsetCarouselBodyError,\n\t\t\t\tdisableDatePicker,\n\t\t\t\tdisableCopyCode,\n\t\t\t\tinitialExpiryDateTime,\n\t\t\t\tshowDiscountCodeExpiryInfo,\n\t\t\t\tcardIndex,\n\t\t\t}}\n\t\t>\n\t\t\t{showOnlyContent ? (\n\t\t\t\t<TemplateSelectModalContent\n\t\t\t\t\tvariableListFromProps={variableListFromProps}\n\t\t\t\t\tchannel={CHANNEL_TYPE.EMAIL}\n\t\t\t\t\thideHeader\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<StyledModal\n\t\t\t\t\thideCrossButton={hideCrossButton}\n\t\t\t\t\tzIndex={zIndex}\n\t\t\t\t\tcentralContainerStyles={{\n\t\t\t\t\t\twidth: isWhatsappCarousel\n\t\t\t\t\t\t\t? 900\n\t\t\t\t\t\t\t: channel === CHANNEL_TYPE.EMAIL && showVariableMapping\n\t\t\t\t\t\t\t? 1000\n\t\t\t\t\t\t\t: 800,\n\t\t\t\t\t}}\n\t\t\t\t\topen={openMapper}\n\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\tsetOpenMapper(false);\n\t\t\t\t\t\tcloseDialog?.();\n\t\t\t\t\t}}\n\t\t\t\t\theadingTitle={template?.label}\n\t\t\t\t\theadingSubtitle={\n\t\t\t\t\t\tchannel === CHANNEL_TYPE.WHATSAPP || isRCSChannel(channel)\n\t\t\t\t\t\t\t? `${StringUtils.capitaliseFirstLetterOfString(\n\t\t\t\t\t\t\t\t\ttemplate?.category ?? '',\n\t\t\t\t\t\t\t  )} • ${(template as WhatsAppTemplate)?.templateCategory ?? ''}`\n\t\t\t\t\t\t\t: ''\n\t\t\t\t\t}\n\t\t\t\t\tonBackPress={() => {\n\t\t\t\t\t\tif (templateAnalytics?.show) {\n\t\t\t\t\t\t\tsetShowWarningModal(true);\n\t\t\t\t\t\t\tsetOpenMapper(false);\n\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonBackPress?.();\n\t\t\t\t\t}}\n\t\t\t\t\tmodalHeaderStyles={{\n\t\t\t\t\t\tborderBottom: `1px solid ${COLORS.stroke.primary}`,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<TemplateSelectModalContent\n\t\t\t\t\t\tvariableListFromProps={variableListFromProps}\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t\tshowVariableMapping={showVariableMapping}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\twhatsappSpecificPickerMeta={whatsappSpecificPickerMeta}\n\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\tdiscountCode={discountCode}\n\t\t\t\t\t\tsetDiscountCode={setDiscountCode}\n\t\t\t\t\t\tvariableListForImage={\n\t\t\t\t\t\t\tvariableListForImage && variableListForImage?.length > 0\n\t\t\t\t\t\t\t\t? variableListForImage\n\t\t\t\t\t\t\t\t: variableList\n\t\t\t\t\t\t}\n\t\t\t\t\t\tfileName={fileName}\n\t\t\t\t\t\tsetFileName={(file) => {\n\t\t\t\t\t\t\tsetFileName?.(file);\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tskipDefaultVariableContent={skipDefaultVariableContent}\n\t\t\t\t\t/>\n\t\t\t\t\t{onTemplateSelect ? (\n\t\t\t\t\t\t<Footer\n\t\t\t\t\t\t\tisWhatsappCarousel={isWhatsappCarousel ?? false}\n\t\t\t\t\t\t\tonSelect={onSelect}\n\t\t\t\t\t\t\tfooterButtonText={footerButtonText}\n\t\t\t\t\t\t\tfooterInfoText={footerInfoText}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<></>\n\t\t\t\t\t)}\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</TemplateModalContext.Provider>\n\t);\n};\n"],"names":["props","selectedTemplate","closeDialog","showVariableMapping","channel","htmlContent","templateVariables","onTemplateSelect","globalPlaceholders","showOnlyContent","whatsappSpecificPickerMeta","zIndex","showVariableModal","variableList","variableListFromProps","discountCode","setDiscountCode","onBackPress","enabledCustomText","variableListForImage","showSampleValues","disableEditVariable","pod","extras","pickerConf","selectedCarouselProducts","disableEditExpiry","cardWidth","onDeleteSelectedProducts","fileName","setFileName","hideDeviceContainerInPreview","maxCharLimit","onDefaultVariableSelect","skipDefaultVariableContent","disableDatePicker","disableCopyCode","initialExpiryDateTime","showDiscountCodeExpiryInfo","footerButtonText","footerInfoText","templateAnalytics","useEffect","setDisplayContent","cardIndex","determineCardIndex","isWhatsappCarousel","isItCarousal","isProductCarouselType","device","setDevice","useState","CHANNEL_TYPE","EMAIL","WEBPUSH","showVariablePicker","setShowVariablePicker","display_content","isError","setIsError","errorIndexes","setErrorIndexes","templateErrorIndexes","setTemplateErrorIndexes","template","setTemplate","cardImages","setCardImages","variableCallback","setVariableCallback","hasUpdateOriginalTemplate","setHasUpdateOriginalTemplate","originalVariableList","setOriginalVariableList","templateSelectionTriggered","setTemplateSelectionTriggered","selectedCarouselIndex","setSelectedCarouselIndex","_b","mapping","_a","body","length","carouselProducts","setCarouselProducts","setVariableList","undefined","sliderRef","useRef","isCarouselHovered","setIsCarouselHovered","hideCrossButton","setHideCrossButton","hideFooterButton","setHideFooterButton","showWarningModal","setShowWarningModal","openMapper","setOpenMapper","ctaOptionsErrors","setCtaOptionsErrors","carouselBodyError","setCarouselBodyError","cards","components","images","forEach","card","comp","type","push","_c","example","header_handle","globalNormalizedPlaceholders","useMemo","convertPlaceholdersToBikDropdown","cloneDeep","show","templateQuality","Object","values","TEMPLATE_QUALITY","find","value","String","_jsx","TemplateAnalyticsComponent","headingTitle","label","headingSubtitle","WHATSAPP","StringUtils","capitaliseFirstLetterOfString","category","_d","templateCategory","analyticsData","data","onClose","onCancel","onProceed","templateId","jsx","TemplateModalContext","Provider","assign","cardCount","_f","_e","children","TemplateSelectModalContent","hideHeader","_jsxs","StyledModal","centralContainerStyles","width","open","isRCSChannel","_g","_h","modalHeaderStyles","borderBottom","COLORS","stroke","primary","file","Footer","onSelect","keys","POD","CHATBOT","bodyErr","carouselTemplate","products","idx","cardBodyText","c","text","bodyMapping","_k","_j","PRODUCT_VAR_TO_FIELD","product","resolvedText","i","varPlaceholder","productField","productName","replace","getProductCarouselBodyError","error","buttons","_Fragment"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"WebpushTemplateHelper.js","sources":["../../../../../src/components/template-context-mapper/helpers/WebpushTemplateHelper.ts"],"sourcesContent":["import type { VariableListInterfaceV2 } from '@src/components/add-variableV2/AddVariableV2';\nimport {\n\tCUSTOM_URL_PLACEHOLDER,\n\tCUSTOM_URL_PLACEHOLDER_VAR,\n} from '@src/components/template-preview/constants/TemplateConstants';\nimport type { CUSTOM_VARIABLE } from '@src/components/template-preview/models/TemplateMeta';\nimport type { AllTemplateVariables } from '@src/components/template-preview/models/types';\nimport type {\n\tTemplateVariable,\n\tWebPushTemplateComponent,\n\tWebpushTemplateType,\n} from '@src/components/template-preview/models/WebpushTemplate';\nimport { BUTTON_TYPE } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport { extractVariables } from '@src/utils/variableUtils';\n\nconst useWebPushTemplate = () => {\n\tasync function processWebpushTemplate(\n\t\ttemplate: WebpushTemplateType,\n\t\tvariableList: VariableListInterfaceV2[],\n\t\toriginalVar?: AllTemplateVariables,\n\t\tdisableEditVariable?: boolean,\n\t) {\n\t\tconst templateClone = { ...template };\n\t\ttemplateClone.components = parseComponents(templateClone.components);\n\n\t\tconst {\n\t\t\tcomponents: { title, body, buttons, icon, image },\n\t\t\twebpushBroadcastConfig,\n\t\t} = templateClone;\n\t\tlet extractedVar = {\n\t\t\ttitle: extractTextsFromVariablesOrText(\n\t\t\t\twebpushBroadcastConfig?.title ?? [],\n\t\t\t),\n\t\t\tbody: extractTextsFromVariablesOrText(\n\t\t\t\twebpushBroadcastConfig?.body ?? [],\n\t\t\t\tbody?.variables,\n\t\t\t),\n\t\t\tbuttonsW: webpushBroadcastConfig?.buttons ?? [],\n\t\t};\n\n\t\tif (!templateClone.webpushBroadcastConfig) {\n\t\t\tconst componentBody =\n\t\t\t\tbody?.text ?? (typeof body === 'string' ? body : '');\n\t\t\tconst websiteLinks: string[] =\n\t\t\t\tbuttons && buttons?.length\n\t\t\t\t\t? buttons\n\t\t\t\t\t\t\t.map((button) =>\n\t\t\t\t\t\t\t\tbutton?.websiteLink == CUSTOM_URL_PLACEHOLDER\n\t\t\t\t\t\t\t\t\t? button?.redirectionLink\n\t\t\t\t\t\t\t\t\t: button?.websiteLink,\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t.filter((link): link is string => link !== undefined)\n\t\t\t\t\t: [];\n\t\t\tconst extractedBody = extractVariables(componentBody).map(\n\t\t\t\t(each, index) => {\n\t\t\t\t\tif (each.includes('editableVariable')) {\n\t\t\t\t\t\treturn body?.variables?.[index]?.value || each;\n\t\t\t\t\t}\n\t\t\t\t\treturn `{{${each}}}`;\n\t\t\t\t},\n\t\t\t);\n\t\t\textractedVar = {\n\t\t\t\ttitle: extractVariables(title).map((each) => `{{${each}}}`),\n\t\t\t\tbody: extractedBody,\n\t\t\t\tbuttonsW: [],\n\t\t\t};\n\t\t\tconst webpushConfigMap = {\n\t\t\t\ttitle: extractedVar.title ?? [],\n\t\t\t\tbody: extractedVar.body ?? [],\n\t\t\t\tbuttons: websiteLinks,\n\t\t\t\ticon: icon ? [icon] : undefined,\n\t\t\t\timage: image ? [image] : undefined,\n\t\t\t\tredirectionLink: body?.redirectionLink ? [body?.redirectionLink] : [],\n\t\t\t};\n\t\t\ttemplateClone.webpushBroadcastConfig = webpushConfigMap;\n\t\t}\n\n\t\tconst buttonMapping =\n\t\t\tbuttons && buttons.length\n\t\t\t\t? buttons.map((button, index) => ({\n\t\t\t\t\t\ttype: BUTTON_TYPE.URL,\n\t\t\t\t\t\ttext: button?.text,\n\t\t\t\t\t\turl: 'https://d.bik.ai/{{1}}',\n\t\t\t\t\t\texample:\n\t\t\t\t\t\t\textractedVar.buttonsW && extractedVar.buttonsW.length\n\t\t\t\t\t\t\t\t? isItaVariable(extractedVar.buttonsW[index])\n\t\t\t\t\t\t\t\t\t? ['']\n\t\t\t\t\t\t\t\t\t: [extractedVar.buttonsW[index]]\n\t\t\t\t\t\t\t\t: button.redirectionLink\n\t\t\t\t\t\t\t\t? [button.redirectionLink]\n\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\tbuttonVariable:\n\t\t\t\t\t\t\textractedVar.buttonsW && extractedVar.buttonsW.length\n\t\t\t\t\t\t\t\t? isItaVariable(extractedVar.buttonsW[index])\n\t\t\t\t\t\t\t\t\t? extractedVar.buttonsW[index]\n\t\t\t\t\t\t\t\t\t: CUSTOM_URL_PLACEHOLDER_VAR\n\t\t\t\t\t\t\t\t: button.websiteLink\n\t\t\t\t\t\t\t\t? button.websiteLink == CUSTOM_URL_PLACEHOLDER\n\t\t\t\t\t\t\t\t\t? CUSTOM_URL_PLACEHOLDER_VAR\n\t\t\t\t\t\t\t\t\t: button.websiteLink\n\t\t\t\t\t\t\t\t: CUSTOM_URL_PLACEHOLDER_VAR,\n\t\t\t\t\t\tindex,\n\t\t\t\t  }))\n\t\t\t\t: [];\n\t\tconst templateVariableMapping = {\n\t\t\ttitle: formatToCustomVariableV3(\n\t\t\t\tvariableList,\n\t\t\t\textractedVar.title,\n\t\t\t\ttitle,\n\t\t\t\tdisableEditVariable,\n\t\t\t),\n\t\t\tbody: formatToCustomVariableV3(\n\t\t\t\tvariableList,\n\t\t\t\textractedVar.body,\n\t\t\t\tbody?.text || '',\n\t\t\t\tdisableEditVariable,\n\t\t\t),\n\t\t\tbuttons: buttonMapping,\n\t\t};\n\t\treturn {\n\t\t\ttemplateVariableMapping: {\n\t\t\t\ttitle: originalVar?.['title']?.length\n\t\t\t\t\t? originalVar['title']\n\t\t\t\t\t: (templateVariableMapping.title as CUSTOM_VARIABLE[]),\n\n\t\t\t\tbody: originalVar?.['body']?.length\n\t\t\t\t\t? originalVar['body']\n\t\t\t\t\t: (templateVariableMapping.body as CUSTOM_VARIABLE[]),\n\n\t\t\t\tbuttons: templateVariableMapping.buttons,\n\t\t\t\ticon: [] as CUSTOM_VARIABLE[],\n\t\t\t\theader: [] as CUSTOM_VARIABLE[],\n\t\t\t},\n\t\t\twebpushBroadcastConfig: templateClone.webpushBroadcastConfig,\n\t\t\ttemplate: templateClone,\n\t\t};\n\t}\n\n\tfunction formatToCustomVariableV3(\n\t\tvariableList: VariableListInterfaceV2[],\n\t\ttextToFormat: string[],\n\t\tmainText: string,\n\t\tdisableEditVariable?: boolean,\n\t) {\n\t\tconst mappedReturned = textToFormat\n\t\t\t.map((each, idx) => {\n\t\t\t\tconst isVariable = isItaVariable(each);\n\t\t\t\tconst textForMatching = isVariable ? each : mainText;\n\n\t\t\t\tif (disableEditVariable) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\tvariableName: each,\n\t\t\t\t\t\tisEditableVariable: false,\n\t\t\t\t\t\tupdatedValue: each,\n\t\t\t\t\t\tindex: idx,\n\t\t\t\t\t\tvariableValue: each,\n\t\t\t\t\t\ttype: 'string',\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\tconst matchResult = matchWithVariablePlaceholders(\n\t\t\t\t\ttextForMatching,\n\t\t\t\t\tvariableList,\n\t\t\t\t);\n\n\t\t\t\tif (matchResult.length > 0) {\n\t\t\t\t\tconst match = matchResult[0];\n\t\t\t\t\treturn {\n\t\t\t\t\t\tvariableName: match.variableName,\n\t\t\t\t\t\tisEditableVariable: true,\n\t\t\t\t\t\tupdatedValue: match?.['updatedValue']\n\t\t\t\t\t\t\t? match?.['updatedValue']\n\t\t\t\t\t\t\t: isVariable\n\t\t\t\t\t\t\t? match.variableName\n\t\t\t\t\t\t\t: each,\n\t\t\t\t\t\tindex: idx,\n\t\t\t\t\t\tvariableValue: match.variableVal,\n\t\t\t\t\t\ttype: 'string',\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\treturn null;\n\t\t\t})\n\t\t\t.filter((entry) => entry !== null);\n\n\t\treturn mappedReturned;\n\t}\n\n\tfunction parseComponents(templateComps: string | WebPushTemplateComponent) {\n\t\tlet components: WebPushTemplateComponent;\n\t\tif (typeof templateComps === 'string') {\n\t\t\ttry {\n\t\t\t\tcomponents = JSON.parse(templateComps);\n\t\t\t} catch (error) {\n\t\t\t\tconsole.error('Error parsing webpush component JSON:', error);\n\t\t\t\tcomponents = {} as WebPushTemplateComponent;\n\t\t\t}\n\t\t} else {\n\t\t\tcomponents = templateComps;\n\t\t}\n\t\treturn components;\n\t}\n\n\tconst isItaVariable = (text: string) => {\n\t\treturn text.includes('{{') && text.includes('}}');\n\t};\n\n\tconst extractTextsFromVariablesOrText = (\n\t\ttext: string[],\n\t\tbodyVariables?: { name: string; value: string }[],\n\t): string[] => {\n\t\tif (!text || !text.length) return [];\n\t\treturn text.flatMap((each, index) => {\n\t\t\tif (!isItaVariable(each)) {\n\t\t\t\treturn each;\n\t\t\t} else {\n\t\t\t\tif (each.includes('editableVariable')) {\n\t\t\t\t\treturn bodyVariables?.[index]?.value || each;\n\t\t\t\t}\n\t\t\t\treturn extractVariables(each).map((each) => `{{${each}}}`) || [];\n\t\t\t}\n\t\t});\n\t};\n\n\tfunction matchWithVariablePlaceholders(\n\t\ttext: string,\n\t\tplaceholders: VariableListInterfaceV2[],\n\t\tmatchList?: string[],\n\t): TemplateVariable[] {\n\t\tconst matches =\n\t\t\tmatchList && matchList.length ? matchList : extractVariables(text);\n\t\tif (!matches || !matches.length) {\n\t\t\treturn [];\n\t\t}\n\t\tconst variableList: TemplateVariable[] = [];\n\t\tmatches.forEach((match, index) => {\n\t\t\tconst matchedValue = findVariableByActualValue(\n\t\t\t\tplaceholders,\n\t\t\t\t`{{${match}}}`,\n\t\t\t);\n\t\t\tif (matchedValue) {\n\t\t\t\tconst { actualValue, defaultValue } = matchedValue;\n\t\t\t\t const isEditable =\n\t\t\t\t\tactualValue === '{{custom.text}}' || actualValue === '{{custom.url}}'; \n\t\t\t\tvariableList.push({\n\t\t\t\t\teditable: isEditable,\n\t\t\t\t\tvariableVal: defaultValue,\n\t\t\t\t\teditableDefaultValues: defaultValue,\n\t\t\t\t\tvariableName: actualValue,\n\t\t\t\t\tidx: index,\n\t\t\t\t} as TemplateVariable);\n\t\t\t}\n\t\t});\n\t\treturn variableList;\n\t}\n\tconst findVariableByActualValue = (\n\t\tplaceholders: VariableListInterfaceV2[],\n\t\tactualValueToFind: string,\n\t) => {\n\t\tfor (const placeholder of placeholders) {\n\t\t\tfor (const key in placeholder.variables) {\n\t\t\t\tconst eachVariable = placeholder.variables[key];\n\t\t\t\tconst matches =\n\t\t\t\t\teachVariable.actualValue === actualValueToFind ||\n\t\t\t\t\t(actualValueToFind.includes('editableVariable') &&\n\t\t\t\t\t\teachVariable.actualValue.includes('custom.text'));\n\t\t\t\tif (matches) {\n\t\t\t\t\treturn eachVariable;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\treturn null;\n\t};\n\n\tconst isValidUrl = (url: string) => {\n\t\ttry {\n\t\t\tnew URL(url);\n\t\t\treturn true;\n\t\t} catch (error) {\n\t\t\treturn false;\n\t\t}\n\t};\n\n\treturn {\n\t\tprocessWebpushTemplate,\n\t\tisValidUrl,\n\t};\n};\n\nexport default useWebPushTemplate;\n"],"names":["useWebPushTemplate","formatToCustomVariableV3","variableList","textToFormat","mainText","disableEditVariable","mappedReturned","map","each","idx","isVariable","isItaVariable","variableName","isEditableVariable","updatedValue","index","variableValue","type","matchResult","text","placeholders","matchList","matches","length","extractVariables","forEach","match","matchedValue","findVariableByActualValue","actualValue","defaultValue","isEditable","push","editable","variableVal","editableDefaultValues","matchWithVariablePlaceholders","filter","entry","includes","extractTextsFromVariablesOrText","bodyVariables","flatMap","_a","value","actualValueToFind","placeholder","key","variables","eachVariable","processWebpushTemplate","template","originalVar","templateClone","Object","assign","components","templateComps","JSON","parse","error","console","parseComponents","title","body","buttons","icon","image","webpushBroadcastConfig","extractedVar","_b","buttonsW","_c","componentBody","_d","websiteLinks","button","websiteLink","CUSTOM_URL_PLACEHOLDER","redirectionLink","link","undefined","extractedBody","webpushConfigMap","_e","_f","buttonMapping","BUTTON_TYPE","URL","url","example","buttonVariable","CUSTOM_URL_PLACEHOLDER_VAR","templateVariableMapping","_g","_h","header","isValidUrl"],"mappings":"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"}
+{"version":3,"file":"WebpushTemplateHelper.js","sources":["../../../../../src/components/template-context-mapper/helpers/WebpushTemplateHelper.ts"],"sourcesContent":["import type { VariableListInterfaceV2 } from '@src/components/add-variableV2/AddVariableV2';\nimport {\n\tCUSTOM_URL_PLACEHOLDER,\n\tCUSTOM_URL_PLACEHOLDER_VAR,\n} from '@src/components/template-preview/constants/TemplateConstants';\nimport type { CUSTOM_VARIABLE } from '@src/components/template-preview/models/TemplateMeta';\nimport type { AllTemplateVariables } from '@src/components/template-preview/models/types';\nimport type {\n\tTemplateVariable,\n\tWebPushTemplateComponent,\n\tWebpushTemplateType,\n} from '@src/components/template-preview/models/WebpushTemplate';\nimport { BUTTON_TYPE } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport { extractVariables } from '@src/utils/variableUtils';\n\nconst useWebPushTemplate = () => {\n\tasync function processWebpushTemplate(\n\t\ttemplate: WebpushTemplateType,\n\t\tvariableList: VariableListInterfaceV2[],\n\t\toriginalVar?: AllTemplateVariables,\n\t\tdisableEditVariable?: boolean,\n\t) {\n\t\tconst templateClone = { ...template };\n\t\ttemplateClone.components = parseComponents(templateClone.components);\n\n\t\tconst {\n\t\t\tcomponents: { title, body, buttons, icon, image },\n\t\t\twebpushBroadcastConfig,\n\t\t} = templateClone;\n\t\tlet extractedVar = {\n\t\t\ttitle: extractTextsFromVariablesOrText(\n\t\t\t\twebpushBroadcastConfig?.title ?? [],\n\t\t\t),\n\t\t\tbody: extractTextsFromVariablesOrText(\n\t\t\t\twebpushBroadcastConfig?.body ?? [],\n\t\t\t\tbody?.variables,\n\t\t\t),\n\t\t\tbuttonsW: webpushBroadcastConfig?.buttons ?? [],\n\t\t};\n\n\t\tif (!templateClone.webpushBroadcastConfig) {\n\t\t\tconst componentBody =\n\t\t\t\tbody?.text ?? (typeof body === 'string' ? body : '');\n\t\t\tconst websiteLinks: string[] =\n\t\t\t\tbuttons && buttons?.length\n\t\t\t\t\t? buttons\n\t\t\t\t\t\t\t.map((button) =>\n\t\t\t\t\t\t\t\tbutton?.websiteLink == CUSTOM_URL_PLACEHOLDER\n\t\t\t\t\t\t\t\t\t? button?.redirectionLink\n\t\t\t\t\t\t\t\t\t: button?.websiteLink,\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t.filter((link): link is string => link !== undefined)\n\t\t\t\t\t: [];\n\t\t\tconst extractedBody = extractVariables(componentBody).map(\n\t\t\t\t(each, index) => {\n\t\t\t\t\tif (each.includes('editableVariable')) {\n\t\t\t\t\t\treturn body?.variables?.[index]?.value || each;\n\t\t\t\t\t}\n\t\t\t\t\treturn `{{${each}}}`;\n\t\t\t\t},\n\t\t\t);\n\t\t\textractedVar = {\n\t\t\t\ttitle: extractVariables(title).map((each) => `{{${each}}}`),\n\t\t\t\tbody: extractedBody,\n\t\t\t\tbuttonsW: [],\n\t\t\t};\n\t\t\tconst webpushConfigMap = {\n\t\t\t\ttitle: extractedVar.title ?? [],\n\t\t\t\tbody: extractedVar.body ?? [],\n\t\t\t\tbuttons: websiteLinks,\n\t\t\t\ticon: icon ? [icon] : undefined,\n\t\t\t\timage: image ? [image] : undefined,\n\t\t\t\tredirectionLink: body?.redirectionLink ? [body?.redirectionLink] : [],\n\t\t\t};\n\t\t\ttemplateClone.webpushBroadcastConfig = webpushConfigMap;\n\t\t}\n\n\t\tconst buttonMapping =\n\t\t\tbuttons && buttons.length\n\t\t\t\t? buttons.map((button, index) => ({\n\t\t\t\t\t\ttype: BUTTON_TYPE.URL,\n\t\t\t\t\t\ttext: button?.text,\n\t\t\t\t\t\turl: 'https://d.bik.ai/{{1}}',\n\t\t\t\t\t\texample:\n\t\t\t\t\t\t\textractedVar.buttonsW && extractedVar.buttonsW.length\n\t\t\t\t\t\t\t\t? isItaVariable(extractedVar.buttonsW[index])\n\t\t\t\t\t\t\t\t\t? ['']\n\t\t\t\t\t\t\t\t\t: [extractedVar.buttonsW[index]]\n\t\t\t\t\t\t\t\t: button.redirectionLink\n\t\t\t\t\t\t\t\t? [button.redirectionLink]\n\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\tbuttonVariable:\n\t\t\t\t\t\t\textractedVar.buttonsW && extractedVar.buttonsW.length\n\t\t\t\t\t\t\t\t? isItaVariable(extractedVar.buttonsW[index])\n\t\t\t\t\t\t\t\t\t? extractedVar.buttonsW[index]\n\t\t\t\t\t\t\t\t\t: CUSTOM_URL_PLACEHOLDER_VAR\n\t\t\t\t\t\t\t\t: button.websiteLink\n\t\t\t\t\t\t\t\t? button.websiteLink == CUSTOM_URL_PLACEHOLDER\n\t\t\t\t\t\t\t\t\t? CUSTOM_URL_PLACEHOLDER_VAR\n\t\t\t\t\t\t\t\t\t: button.websiteLink\n\t\t\t\t\t\t\t\t: CUSTOM_URL_PLACEHOLDER_VAR,\n\t\t\t\t\t\tindex,\n\t\t\t\t  }))\n\t\t\t\t: [];\n\t\tconst templateVariableMapping = {\n\t\t\ttitle: formatToCustomVariableV3(\n\t\t\t\tvariableList,\n\t\t\t\textractedVar.title,\n\t\t\t\ttitle,\n\t\t\t\tdisableEditVariable,\n\t\t\t),\n\t\t\tbody: formatToCustomVariableV3(\n\t\t\t\tvariableList,\n\t\t\t\textractedVar.body,\n\t\t\t\tbody?.text || '',\n\t\t\t\tdisableEditVariable,\n\t\t\t),\n\t\t\tbuttons: buttonMapping,\n\t\t};\n\t\treturn {\n\t\t\ttemplateVariableMapping: {\n\t\t\t\ttitle: originalVar?.['title']?.length\n\t\t\t\t\t? originalVar['title']\n\t\t\t\t\t: (templateVariableMapping.title as CUSTOM_VARIABLE[]),\n\n\t\t\t\tbody: originalVar?.['body']?.length\n\t\t\t\t\t? originalVar['body']\n\t\t\t\t\t: (templateVariableMapping.body as CUSTOM_VARIABLE[]),\n\n\t\t\t\tbuttons: templateVariableMapping.buttons,\n\t\t\t\ticon: [] as CUSTOM_VARIABLE[],\n\t\t\t\theader: [] as CUSTOM_VARIABLE[],\n\t\t\t},\n\t\t\twebpushBroadcastConfig: templateClone.webpushBroadcastConfig,\n\t\t\ttemplate: templateClone,\n\t\t};\n\t}\n\n\tfunction formatToCustomVariableV3(\n\t\tvariableList: VariableListInterfaceV2[],\n\t\ttextToFormat: string[],\n\t\tmainText: string,\n\t\tdisableEditVariable?: boolean,\n\t) {\n\t\tconst mappedReturned = textToFormat\n\t\t\t.map((each, idx) => {\n\t\t\t\tconst isVariable = isItaVariable(each);\n\t\t\t\tconst textForMatching = isVariable ? each : mainText;\n\n\t\t\t\tif (disableEditVariable) {\n\t\t\t\t\treturn {\n\t\t\t\t\t\tvariableName: each,\n\t\t\t\t\t\tisEditableVariable: false,\n\t\t\t\t\t\tupdatedValue: each,\n\t\t\t\t\t\tindex: idx,\n\t\t\t\t\t\tvariableValue: each,\n\t\t\t\t\t\ttype: 'string',\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\tconst matchResult = matchWithVariablePlaceholders(\n\t\t\t\t\ttextForMatching,\n\t\t\t\t\tvariableList,\n\t\t\t\t);\n\n\t\t\t\tif (matchResult.length > 0) {\n\t\t\t\t\tconst match = matchResult[0];\n\t\t\t\t\treturn {\n\t\t\t\t\t\tvariableName: match.variableName,\n\t\t\t\t\t\tisEditableVariable: true,\n\t\t\t\t\t\tupdatedValue: match?.['updatedValue']\n\t\t\t\t\t\t\t? match?.['updatedValue']\n\t\t\t\t\t\t\t: isVariable\n\t\t\t\t\t\t\t? match.variableName\n\t\t\t\t\t\t\t: each,\n\t\t\t\t\t\tindex: idx,\n\t\t\t\t\t\tvariableValue: match.variableVal,\n\t\t\t\t\t\ttype: 'string',\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\treturn null;\n\t\t\t})\n\t\t\t.filter((entry) => entry !== null);\n\n\t\treturn mappedReturned;\n\t}\n\n\tfunction parseComponents(templateComps: string | WebPushTemplateComponent) {\n\t\tlet components: WebPushTemplateComponent;\n\t\tif (typeof templateComps === 'string') {\n\t\t\ttry {\n\t\t\t\tcomponents = JSON.parse(templateComps);\n\t\t\t} catch (error) {\n\t\t\t\tconsole.error('Error parsing webpush component JSON:', error);\n\t\t\t\tcomponents = {} as WebPushTemplateComponent;\n\t\t\t}\n\t\t} else {\n\t\t\tcomponents = templateComps;\n\t\t}\n\t\treturn components;\n\t}\n\n\tconst isItaVariable = (text: string) => {\n\t\treturn text.includes('{{') && text.includes('}}');\n\t};\n\n\tconst extractTextsFromVariablesOrText = (\n\t\ttext: string[],\n\t\tbodyVariables?: { name: string; value: string }[],\n\t): string[] => {\n\t\tif (!text || !text.length) return [];\n\t\treturn text.flatMap((each, index) => {\n\t\t\tif (!isItaVariable(each)) {\n\t\t\t\treturn each;\n\t\t\t} else {\n\t\t\t\tif (each.includes('editableVariable')) {\n\t\t\t\t\treturn bodyVariables?.[index]?.value || each;\n\t\t\t\t}\n\t\t\t\treturn extractVariables(each).map((each) => `{{${each}}}`) || [];\n\t\t\t}\n\t\t});\n\t};\n\n\tfunction matchWithVariablePlaceholders(\n\t\ttext: string,\n\t\tplaceholders: VariableListInterfaceV2[],\n\t\tmatchList?: string[],\n\t): TemplateVariable[] {\n\t\tconst matches =\n\t\t\tmatchList && matchList.length ? matchList : extractVariables(text);\n\t\tif (!matches || !matches.length) {\n\t\t\treturn [];\n\t\t}\n\t\tconst variableList: TemplateVariable[] = [];\n\t\tmatches.forEach((match, index) => {\n\t\t\tconst matchedValue = findVariableByActualValue(\n\t\t\t\tplaceholders,\n\t\t\t\t`{{${match}}}`,\n\t\t\t);\n\t\t\tif (matchedValue) {\n\t\t\t\tconst { actualValue, defaultValue } = matchedValue;\n\t\t\t\t const isEditable =\n\t\t\t\t\tactualValue === '{{custom.text}}' || actualValue === '{{custom.url}}'; \n\t\t\t\tvariableList.push({\n\t\t\t\t\teditable: isEditable,\n\t\t\t\t\tvariableVal: defaultValue,\n\t\t\t\t\teditableDefaultValues: defaultValue,\n\t\t\t\t\tvariableName: actualValue,\n\t\t\t\t\tidx: index,\n\t\t\t\t} as TemplateVariable);\n\t\t\t}\n\t\t});\n\t\treturn variableList;\n\t}\n\tconst findVariableByActualValue = (\n\t\tplaceholders: VariableListInterfaceV2[],\n\t\tactualValueToFind: string,\n\t) => {\n\t\tfor (const placeholder of placeholders) {\n\t\t\tfor (const key in placeholder.variables) {\n\t\t\t\tconst eachVariable = placeholder.variables[key];\n\t\t\t\tconst matches =\n\t\t\t\t\teachVariable.actualValue === actualValueToFind ||\n\t\t\t\t\t(actualValueToFind.includes('editableVariable') &&\n\t\t\t\t\t\teachVariable.actualValue.includes('custom.text'));\n\t\t\t\tif (matches) {\n\t\t\t\t\treturn eachVariable;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\treturn null;\n\t};\n\n\tconst isValidUrl = (url: string) => {\n\t\ttry {\n\t\t\tnew URL(url);\n\t\t\treturn true;\n\t\t} catch (error) {\n\t\t\treturn false;\n\t\t}\n\t};\n\n\treturn {\n\t\tprocessWebpushTemplate,\n\t\tisValidUrl,\n\t};\n};\n\nexport default useWebPushTemplate;\n"],"names":["useWebPushTemplate","formatToCustomVariableV3","variableList","textToFormat","mainText","disableEditVariable","mappedReturned","map","each","idx","isVariable","isItaVariable","variableName","isEditableVariable","updatedValue","index","variableValue","type","matchResult","text","placeholders","matchList","matches","length","extractVariables","forEach","match","matchedValue","findVariableByActualValue","actualValue","defaultValue","isEditable","push","editable","variableVal","editableDefaultValues","matchWithVariablePlaceholders","filter","entry","includes","extractTextsFromVariablesOrText","bodyVariables","flatMap","_a","value","actualValueToFind","placeholder","key","variables","eachVariable","processWebpushTemplate","template","originalVar","templateClone","Object","assign","components","templateComps","JSON","parse","error","console","parseComponents","title","body","buttons","icon","image","webpushBroadcastConfig","extractedVar","_b","buttonsW","_c","componentBody","_d","websiteLinks","button","websiteLink","CUSTOM_URL_PLACEHOLDER","redirectionLink","link","undefined","extractedBody","webpushConfigMap","_e","_f","buttonMapping","BUTTON_TYPE","URL","url","example","buttonVariable","CUSTOM_URL_PLACEHOLDER_VAR","templateVariableMapping","_g","_h","header","isValidUrl"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"Body.js","sources":["../../../../../src/components/template-context-mapper/modalElements/Body.tsx"],"sourcesContent":["import { PickerType, type VariableV3 } from '@src/helpers';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { useRef } from 'react';\nimport styled from 'styled-components';\nimport type { VariableListInterfaceV2 } from '@src/components/add-variableV2/AddVariableV2';\nimport { CarouselPreview } from '@src/components/carousel-preview/CarouselPreview';\nimport EditWhatsAppCarouselTemplateV2 from '@src/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2';\nimport { TemplatePreview } from '@src/components/template-preview/TemplatePreview';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport type { AllTemplateTypes } from '@src/components/template-preview/models/types';\nimport type { WebpushTemplateType } from '@src/components/template-preview/models/WebpushTemplate';\nimport type { WhatsAppCarouselTemplate } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport type {\n\tWhatsAppPickerMeta,\n\tWhatsAppTemplate,\n} from '@src/components/template-preview/models/WhatsAppTemplate';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { VariablePicker } from '@src/components/variable-picker-v3/VariablePicker';\nimport { COLORS } from '@src/constants/Theme';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport { BACKGROUND_PREVIEW_IMAGE } from '../utils/constants';\nimport { getVariableNameForEmailByIndex } from '../utils/getVariableNameEmail';\nimport { highlightFor } from '../utils/highlightFor';\nimport DesktopPreview from './DesktopPreview';\nimport EditWebpushTemplate from './EditWebpushTemplate';\nimport EditWhatsAppTemplateV2 from './EditWhatsAppTemplateV2';\nimport MobilePreview from './MobilePreview';\nimport VariableConnectorsPanel from './VariableConnectorsPanel';\n\nconst Container = styled.div`\n\tdisplay: flex;\n\t//\theight: 100%;\n`;\n\nconst RightPanelContainer = styled.div<{\n\tchannel?: CHANNEL_TYPE;\n\tisWhatsappCarousel?: boolean;\n\tshowVariableMapping?: boolean;\n}>`\n\tmax-width: 450px;\n\tmax-width: ${(props) =>\n\t\tprops.channel === CHANNEL_TYPE.EMAIL ? '400px' : '450px'};\n\n\theight: ${(props) =>\n\t\tprops.channel === CHANNEL_TYPE.WHATSAPP ? '500px' : '475px'};\n\toverflow-y: auto;\n\tpadding-bottom: 24px;\n\tborder-left: ${COLORS.stroke.primary} 1px solid;\n\tborder-top: ${(props) =>\n\t\tprops.isWhatsappCarousel\n\t\t\t? `${COLORS.stroke.primary} 1px solid`\n\t\t\t: undefined};\n\t${(props) => !props.showVariableMapping && 'width: 340px; height: 500px'};\n`;\n\nconst LeftPanelContainer = styled.div<{\n\tshowOnlyContent?: boolean;\n\tshowVariableMapping?: boolean;\n\tisWhatsappCarousel?: boolean;\n\thideDeviceContainerInPreview?: boolean;\n\tchannel?: CHANNEL_TYPE;\n\tskipDefaultVariableContent?: boolean;\n}>`\n\tpadding: ${(props) =>\n\t\tprops.isWhatsappCarousel\n\t\t\t? undefined\n\t\t\t: props.showOnlyContent\n\t\t\t? '16px 14px'\n\t\t\t: '16px 32px'};\n\tflex: 1;\n\theight: ${(props) =>\n\t\tprops.isWhatsappCarousel || props.hideDeviceContainerInPreview\n\t\t\t? '500px'\n\t\t\t: '475px'};\n\toverflow-y: auto;\n\tbackground-image: ${(props) =>\n\t\tprops.hideDeviceContainerInPreview &&\n\t\tprops.channel === CHANNEL_TYPE.WHATSAPP\n\t\t\t? `url(${BACKGROUND_PREVIEW_IMAGE});`\n\t\t\t: 'none'};\n\tdisplay: ${(props) =>\n\t\tprops.hideDeviceContainerInPreview &&\n\t\t(props.channel === CHANNEL_TYPE.WHATSAPP ||\n\t\t\tprops.channel === CHANNEL_TYPE.RCS)\n\t\t\t? 'flex'\n\t\t\t: 'initial'};\n\talign-items: flex-start;\n`;\n\nexport interface BodyProps {\n\tshowVariableMapping: boolean;\n\tshowOnlyContent?: boolean;\n\twhatsappSpecificPickerMeta?: WhatsAppPickerMeta;\n\tshowVariableModal?: boolean;\n\tvariableListForImage?: VariableListInterfaceV2[];\n\tdiscountCode?: string;\n\tsetDiscountCode?: (code: string) => void;\n\tshowSampleValues?: boolean;\n\tfileName?: string;\n\tsetFileName?: (name: string) => void;\n\tvariableListFromProps?: VariableListInterfaceV2[];\n\tskipDefaultVariableContent?: boolean;\n}\n\nconst Body = (props: BodyProps) => {\n\tconst {\n\t\tshowVariableMapping,\n\t\tshowOnlyContent,\n\t\twhatsappSpecificPickerMeta,\n\t\tshowVariableModal,\n\t\tdiscountCode,\n\t\tsetDiscountCode,\n\t\tvariableListForImage,\n\t\tshowSampleValues,\n\t\tvariableListFromProps,\n\t\tfileName,\n\t\tsetFileName,\n\t\tskipDefaultVariableContent,\n\t} = props;\n\tconst desktopPreviewRef =\n\t\tuseRef<HTMLDivElement>() as React.MutableRefObject<HTMLInputElement>;\n\tconst mobilePreviewRef =\n\t\tuseRef<HTMLDivElement>() as React.MutableRefObject<HTMLInputElement>;\n\n\tconst {\n\t\tvariableList,\n\t\tsetVariableList,\n\t\tvariableCallback,\n\t\tshowVariablePicker,\n\t\tsetShowVariablePicker,\n\t\tdevice,\n\t\tdisplay_content,\n\t\tchannel,\n\t\ttemplate,\n\t\tsetTemplate,\n\t\tisWhatsappCarousel,\n\t\tisProductCarouselType,\n\t\thideDeviceContainerInPreview,\n\t\tonDefaultVariableSelect,\n\t} = useTemplateModalContext();\n\t/**\n\t * UI handler to add scroll and highlighter whenever any variable connector in focused\n\t * @param variableNumber variable index\n\t */\n\tfunction handleVariableConnectorClickUI(variableNumber: number) {\n\t\tconst iframe = document?.getElementById(\n\t\t\tdevice === 'mobile' ? 'template_html_mobile' : 'template_html_desktop',\n\t\t) as HTMLIFrameElement;\n\n\t\tconst variableId = getVariableNameForEmailByIndex(variableNumber + 1);\n\t\tconst targetElement =\n\t\t\tchannel === CHANNEL_TYPE.EMAIL\n\t\t\t\t? iframe?.contentWindow?.document.getElementById(variableId)\n\t\t\t\t: document.getElementById(variableId);\n\t\tconst toTopPos = getOffsetTop(targetElement!);\n\n\t\tconst toLeftPos = targetElement?.offsetLeft;\n\n\t\tif (device === 'desktop') {\n\t\t\tif (toTopPos && desktopPreviewRef.current) {\n\t\t\t\tiframe?.contentWindow?.scrollTo(toLeftPos ?? 0, toTopPos);\n\n\t\t\t\t// desktopPreviewRef.current.scrollTo(toLeftPos ?? 0, toTopPos);\n\t\t\t\thighlightFor(\n\t\t\t\t\tvariableId,\n\t\t\t\t\tCOLORS.background.warning.light,\n\t\t\t\t\t2,\n\t\t\t\t\tchannel,\n\t\t\t\t\tdevice,\n\t\t\t\t);\n\t\t\t}\n\t\t} else {\n\t\t\tif (toTopPos && mobilePreviewRef.current) {\n\t\t\t\tiframe?.contentWindow?.scrollTo(toLeftPos ?? 0, toTopPos);\n\n\t\t\t\t// mobilePreviewRef.current.scrollTo(toLeftPos ?? 0, toTopPos - 253);\n\t\t\t\thighlightFor(\n\t\t\t\t\tvariableId,\n\t\t\t\t\tCOLORS.background.warning.light,\n\t\t\t\t\t2,\n\t\t\t\t\tchannel,\n\t\t\t\t\tdevice,\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t}\n\n\tconst getOffsetTop = (element: HTMLElement) => {\n\t\tlet offsetTop = 0;\n\n\t\twhile (element) {\n\t\t\toffsetTop += element.offsetTop;\n\t\t\telement = element.offsetParent as HTMLElement;\n\t\t}\n\t\treturn offsetTop;\n\t};\n\n\treturn (\n\t\t<Container>\n\t\t\t<LeftPanelContainer\n\t\t\t\tshowOnlyContent={showOnlyContent}\n\t\t\t\tshowVariableMapping={showVariableMapping}\n\t\t\t\tisWhatsappCarousel={isWhatsappCarousel}\n\t\t\t\thideDeviceContainerInPreview={hideDeviceContainerInPreview}\n\t\t\t\tchannel={channel}\n\t\t\t\tskipDefaultVariableContent={skipDefaultVariableContent}\n\t\t\t>\n\t\t\t\t{device === 'mobile' ? (\n\t\t\t\t\t<MobilePreview\n\t\t\t\t\t\tref={mobilePreviewRef}\n\t\t\t\t\t\tdisplay_content={display_content ?? ''}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\ttemplate={template}\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t/>\n\t\t\t\t) : (channel === CHANNEL_TYPE.WHATSAPP ||\n\t\t\t\t\t\tchannel === CHANNEL_TYPE.RCS) &&\n\t\t\t\t  isWhatsappCarousel ? (\n\t\t\t\t\t<CarouselPreview\n\t\t\t\t\t\tref={desktopPreviewRef}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\ttemplate={template}\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t\tisPreview={false}\n\t\t\t\t\t\tshowArrows={true}\n\t\t\t\t\t/>\n\t\t\t\t) : channel === CHANNEL_TYPE.WEBPUSH ? (\n\t\t\t\t\t<TemplatePreview\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\thideHeader\n\t\t\t\t\t\ttemplate={template as WebpushTemplateType}\n\t\t\t\t\t/>\n\t\t\t\t) : channel !== CHANNEL_TYPE.MESSAGE ? (\n\t\t\t\t\t<DesktopPreview\n\t\t\t\t\t\tref={desktopPreviewRef}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\tdisplay_content={display_content ?? ''}\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<></>\n\t\t\t\t)}\n\t\t\t</LeftPanelContainer>\n\t\t\t{(isProductCarouselType || showVariableMapping) && (\n\t\t\t\t<RightPanelContainer\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tisWhatsappCarousel={isWhatsappCarousel}\n\t\t\t\t\tshowVariableMapping={true}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\twidth: channel === 'whatsapp' ? 428 : 400,\n\t\t\t\t\t\t\tdisplay: showVariablePicker ? 'block' : 'none',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<VariablePicker\n\t\t\t\t\t\t\tkey={Math.random()}\n\t\t\t\t\t\t\thideHeaderCross\n\t\t\t\t\t\t\tshowHeader\n\t\t\t\t\t\t\tshowBackButton\n\t\t\t\t\t\t\tonBackButtonClick={() => {\n\t\t\t\t\t\t\t\tsetVariableList(cloneDeep(variableListFromProps));\n\t\t\t\t\t\t\t\tsetShowVariablePicker(false);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonSelect={(variable: VariableV3) => {\n\t\t\t\t\t\t\t\tvariableCallback(variable);\n\t\t\t\t\t\t\t\tsetVariableList(cloneDeep(variableListFromProps));\n\t\t\t\t\t\t\t\tsetShowVariablePicker(false);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\ttype={PickerType.EMBEDDED}\n\t\t\t\t\t\t\tdata={variableList ?? []}\n\t\t\t\t\t\t\tonDefaultVariableSelect={onDefaultVariableSelect}\n\t\t\t\t\t\t\tskipDefaultVariableContent={skipDefaultVariableContent}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpadding: '16px 14px',\n\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\tchannel === 'whatsapp' ||\n\t\t\t\t\t\t\t\tchannel == 'webpush' ||\n\t\t\t\t\t\t\t\tchannel == 'rcs'\n\t\t\t\t\t\t\t\t\t? 428\n\t\t\t\t\t\t\t\t\t: 400,\n\t\t\t\t\t\t\tdisplay: showVariablePicker ? 'none' : 'block', //cannot unmount the component as it will lose the state\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{channel !== CHANNEL_TYPE.WHATSAPP &&\n\t\t\t\t\t\tchannel !== CHANNEL_TYPE?.RCS ? (\n\t\t\t\t\t\t\tchannel == CHANNEL_TYPE.WEBPUSH ? (\n\t\t\t\t\t\t\t\t<EditWebpushTemplate\n\t\t\t\t\t\t\t\t\twhatsappSpecificPickerMeta={whatsappSpecificPickerMeta}\n\t\t\t\t\t\t\t\t\ttemplate={template as WebpushTemplateType}\n\t\t\t\t\t\t\t\t\tonTemplateChange={(template: AllTemplateTypes) => {\n\t\t\t\t\t\t\t\t\t\tsetTemplate?.(template);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<VariableConnectorsPanel\n\t\t\t\t\t\t\t\t\tonFocus={\n\t\t\t\t\t\t\t\t\t\tchannel === CHANNEL_TYPE.EMAIL\n\t\t\t\t\t\t\t\t\t\t\t? handleVariableConnectorClickUI\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\t\t\t\tdiscountCode={discountCode}\n\t\t\t\t\t\t\t\t\tsetDiscountCode={setDiscountCode}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) : (channel === CHANNEL_TYPE.WHATSAPP ||\n\t\t\t\t\t\t\t\tchannel === CHANNEL_TYPE.RCS) &&\n\t\t\t\t\t\t  isWhatsappCarousel ? (\n\t\t\t\t\t\t\t<EditWhatsAppCarouselTemplateV2\n\t\t\t\t\t\t\t\twhatsappSpecificPickerMeta={whatsappSpecificPickerMeta}\n\t\t\t\t\t\t\t\ttemplate={template as WhatsAppCarouselTemplate}\n\t\t\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\t\t\tvariableListForImage={variableListForImage}\n\t\t\t\t\t\t\t\tdiscountCode={discountCode}\n\t\t\t\t\t\t\t\tsetDiscountCode={setDiscountCode}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EditWhatsAppTemplateV2\n\t\t\t\t\t\t\t\twhatsappSpecificPickerMeta={whatsappSpecificPickerMeta}\n\t\t\t\t\t\t\t\ttemplate={template as WhatsAppTemplate}\n\t\t\t\t\t\t\t\tonTemplateChange={(template: AllTemplateTypes) => {\n\t\t\t\t\t\t\t\t\tsetTemplate?.(template);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\t\t\tvariableListForImage={variableListForImage}\n\t\t\t\t\t\t\t\tdiscountCode={discountCode}\n\t\t\t\t\t\t\t\tsetDiscountCode={setDiscountCode}\n\t\t\t\t\t\t\t\tfileName={fileName}\n\t\t\t\t\t\t\t\tsetFileName={setFileName}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</RightPanelContainer>\n\t\t\t)}\n\t\t\t{[CHANNEL_TYPE.WHATSAPP, CHANNEL_TYPE.SMS].includes(channel) &&\n\t\t\t\t!showVariableMapping &&\n\t\t\t\t!isProductCarouselType && (\n\t\t\t\t\t<RightPanelContainer>\n\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\tstyle={{ fontStyle: 'italic' }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tClick on ‘Select template’ below to use it\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</RightPanelContainer>\n\t\t\t\t)}\n\t\t</Container>\n\t);\n};\n\nexport default Body;\n"],"names":["Container","styled","div","RightPanelContainer","props","channel","CHANNEL_TYPE","EMAIL","WHATSAPP","COLORS","stroke","primary","isWhatsappCarousel","undefined","showVariableMapping","LeftPanelContainer","showOnlyContent","hideDeviceContainerInPreview","BACKGROUND_PREVIEW_IMAGE","RCS","whatsappSpecificPickerMeta","showVariableModal","discountCode","setDiscountCode","variableListForImage","showSampleValues","variableListFromProps","fileName","setFileName","skipDefaultVariableContent","desktopPreviewRef","useRef","mobilePreviewRef","variableList","setVariableList","variableCallback","showVariablePicker","setShowVariablePicker","device","display_content","template","setTemplate","isProductCarouselType","onDefaultVariableSelect","useTemplateModalContext","getOffsetTop","element","offsetTop","offsetParent","_jsxs","children","_jsx","jsx","Object","assign","MobilePreview","ref","WEBPUSH","TemplatePreview","hideHeader","MESSAGE","DesktopPreview","_Fragment","Fragment","CarouselPreview","isPreview","showArrows","style","height","width","display","VariablePicker","hideHeaderCross","showHeader","showBackButton","onBackButtonClick","cloneDeep","onSelect","variable","type","PickerType","EMBEDDED","data","Math","random","padding","EditWebpushTemplate","onTemplateChange","VariableConnectorsPanel","onFocus","variableNumber","iframe","document","getElementById","variableId","getVariableNameForEmailByIndex","targetElement","_a","contentWindow","toTopPos","toLeftPos","offsetLeft","current","_b","scrollTo","highlightFor","background","warning","light","_c","EditWhatsAppTemplateV2","EditWhatsAppCarouselTemplateV2","SMS","includes","BodySecondary","color","content","secondary","fontStyle"],"mappings":"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"}
+{"version":3,"file":"Body.js","sources":["../../../../../src/components/template-context-mapper/modalElements/Body.tsx"],"sourcesContent":["import { PickerType, type VariableV3 } from '@src/helpers';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { useRef } from 'react';\nimport styled from 'styled-components';\nimport type { VariableListInterfaceV2 } from '@src/components/add-variableV2/AddVariableV2';\nimport { CarouselPreview } from '@src/components/carousel-preview/CarouselPreview';\nimport EditWhatsAppCarouselTemplateV2 from '@src/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2';\nimport { TemplatePreview } from '@src/components/template-preview/TemplatePreview';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport type { AllTemplateTypes } from '@src/components/template-preview/models/types';\nimport type { WebpushTemplateType } from '@src/components/template-preview/models/WebpushTemplate';\nimport type { WhatsAppCarouselTemplate } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport type {\n\tWhatsAppPickerMeta,\n\tWhatsAppTemplate,\n} from '@src/components/template-preview/models/WhatsAppTemplate';\nimport { BodySecondary } from '@src/components/TypographyStyle';\nimport { VariablePicker } from '@src/components/variable-picker-v3/VariablePicker';\nimport { COLORS } from '@src/constants/Theme';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport { BACKGROUND_PREVIEW_IMAGE } from '../utils/constants';\nimport { getVariableNameForEmailByIndex } from '../utils/getVariableNameEmail';\nimport { highlightFor } from '../utils/highlightFor';\nimport DesktopPreview from './DesktopPreview';\nimport EditWebpushTemplate from './EditWebpushTemplate';\nimport EditWhatsAppTemplateV2 from './EditWhatsAppTemplateV2';\nimport MobilePreview from './MobilePreview';\nimport VariableConnectorsPanel from './VariableConnectorsPanel';\n\nconst Container = styled.div`\n\tdisplay: flex;\n\t//\theight: 100%;\n`;\n\nconst RightPanelContainer = styled.div<{\n\tchannel?: CHANNEL_TYPE;\n\tisWhatsappCarousel?: boolean;\n\tshowVariableMapping?: boolean;\n}>`\n\tmax-width: 450px;\n\tmax-width: ${(props) =>\n\t\tprops.channel === CHANNEL_TYPE.EMAIL ? '400px' : '450px'};\n\n\theight: ${(props) =>\n\t\tprops.channel === CHANNEL_TYPE.WHATSAPP ? '500px' : '475px'};\n\toverflow-y: auto;\n\tpadding-bottom: 24px;\n\tborder-left: ${COLORS.stroke.primary} 1px solid;\n\tborder-top: ${(props) =>\n\t\tprops.isWhatsappCarousel\n\t\t\t? `${COLORS.stroke.primary} 1px solid`\n\t\t\t: undefined};\n\t${(props) => !props.showVariableMapping && 'width: 340px; height: 500px'};\n`;\n\nconst LeftPanelContainer = styled.div<{\n\tshowOnlyContent?: boolean;\n\tshowVariableMapping?: boolean;\n\tisWhatsappCarousel?: boolean;\n\thideDeviceContainerInPreview?: boolean;\n\tchannel?: CHANNEL_TYPE;\n\tskipDefaultVariableContent?: boolean;\n}>`\n\tpadding: ${(props) =>\n\t\tprops.isWhatsappCarousel\n\t\t\t? undefined\n\t\t\t: props.showOnlyContent\n\t\t\t? '16px 14px'\n\t\t\t: '16px 32px'};\n\tflex: 1;\n\theight: ${(props) =>\n\t\tprops.isWhatsappCarousel || props.hideDeviceContainerInPreview\n\t\t\t? '500px'\n\t\t\t: '475px'};\n\toverflow-y: auto;\n\tbackground-image: ${(props) =>\n\t\tprops.hideDeviceContainerInPreview &&\n\t\tprops.channel === CHANNEL_TYPE.WHATSAPP\n\t\t\t? `url(${BACKGROUND_PREVIEW_IMAGE});`\n\t\t\t: 'none'};\n\tdisplay: ${(props) =>\n\t\tprops.hideDeviceContainerInPreview &&\n\t\t(props.channel === CHANNEL_TYPE.WHATSAPP ||\n\t\t\tprops.channel === CHANNEL_TYPE.RCS)\n\t\t\t? 'flex'\n\t\t\t: 'initial'};\n\talign-items: flex-start;\n`;\n\nexport interface BodyProps {\n\tshowVariableMapping: boolean;\n\tshowOnlyContent?: boolean;\n\twhatsappSpecificPickerMeta?: WhatsAppPickerMeta;\n\tshowVariableModal?: boolean;\n\tvariableListForImage?: VariableListInterfaceV2[];\n\tdiscountCode?: string;\n\tsetDiscountCode?: (code: string) => void;\n\tshowSampleValues?: boolean;\n\tfileName?: string;\n\tsetFileName?: (name: string) => void;\n\tvariableListFromProps?: VariableListInterfaceV2[];\n\tskipDefaultVariableContent?: boolean;\n}\n\nconst Body = (props: BodyProps) => {\n\tconst {\n\t\tshowVariableMapping,\n\t\tshowOnlyContent,\n\t\twhatsappSpecificPickerMeta,\n\t\tshowVariableModal,\n\t\tdiscountCode,\n\t\tsetDiscountCode,\n\t\tvariableListForImage,\n\t\tshowSampleValues,\n\t\tvariableListFromProps,\n\t\tfileName,\n\t\tsetFileName,\n\t\tskipDefaultVariableContent,\n\t} = props;\n\tconst desktopPreviewRef =\n\t\tuseRef<HTMLDivElement>() as React.MutableRefObject<HTMLInputElement>;\n\tconst mobilePreviewRef =\n\t\tuseRef<HTMLDivElement>() as React.MutableRefObject<HTMLInputElement>;\n\n\tconst {\n\t\tvariableList,\n\t\tsetVariableList,\n\t\tvariableCallback,\n\t\tshowVariablePicker,\n\t\tsetShowVariablePicker,\n\t\tdevice,\n\t\tdisplay_content,\n\t\tchannel,\n\t\ttemplate,\n\t\tsetTemplate,\n\t\tisWhatsappCarousel,\n\t\tisProductCarouselType,\n\t\thideDeviceContainerInPreview,\n\t\tonDefaultVariableSelect,\n\t} = useTemplateModalContext();\n\t/**\n\t * UI handler to add scroll and highlighter whenever any variable connector in focused\n\t * @param variableNumber variable index\n\t */\n\tfunction handleVariableConnectorClickUI(variableNumber: number) {\n\t\tconst iframe = document?.getElementById(\n\t\t\tdevice === 'mobile' ? 'template_html_mobile' : 'template_html_desktop',\n\t\t) as HTMLIFrameElement;\n\n\t\tconst variableId = getVariableNameForEmailByIndex(variableNumber + 1);\n\t\tconst targetElement =\n\t\t\tchannel === CHANNEL_TYPE.EMAIL\n\t\t\t\t? iframe?.contentWindow?.document.getElementById(variableId)\n\t\t\t\t: document.getElementById(variableId);\n\t\tconst toTopPos = getOffsetTop(targetElement!);\n\n\t\tconst toLeftPos = targetElement?.offsetLeft;\n\n\t\tif (device === 'desktop') {\n\t\t\tif (toTopPos && desktopPreviewRef.current) {\n\t\t\t\tiframe?.contentWindow?.scrollTo(toLeftPos ?? 0, toTopPos);\n\n\t\t\t\t// desktopPreviewRef.current.scrollTo(toLeftPos ?? 0, toTopPos);\n\t\t\t\thighlightFor(\n\t\t\t\t\tvariableId,\n\t\t\t\t\tCOLORS.background.warning.light,\n\t\t\t\t\t2,\n\t\t\t\t\tchannel,\n\t\t\t\t\tdevice,\n\t\t\t\t);\n\t\t\t}\n\t\t} else {\n\t\t\tif (toTopPos && mobilePreviewRef.current) {\n\t\t\t\tiframe?.contentWindow?.scrollTo(toLeftPos ?? 0, toTopPos);\n\n\t\t\t\t// mobilePreviewRef.current.scrollTo(toLeftPos ?? 0, toTopPos - 253);\n\t\t\t\thighlightFor(\n\t\t\t\t\tvariableId,\n\t\t\t\t\tCOLORS.background.warning.light,\n\t\t\t\t\t2,\n\t\t\t\t\tchannel,\n\t\t\t\t\tdevice,\n\t\t\t\t);\n\t\t\t}\n\t\t}\n\t}\n\n\tconst getOffsetTop = (element: HTMLElement) => {\n\t\tlet offsetTop = 0;\n\n\t\twhile (element) {\n\t\t\toffsetTop += element.offsetTop;\n\t\t\telement = element.offsetParent as HTMLElement;\n\t\t}\n\t\treturn offsetTop;\n\t};\n\n\treturn (\n\t\t<Container>\n\t\t\t<LeftPanelContainer\n\t\t\t\tshowOnlyContent={showOnlyContent}\n\t\t\t\tshowVariableMapping={showVariableMapping}\n\t\t\t\tisWhatsappCarousel={isWhatsappCarousel}\n\t\t\t\thideDeviceContainerInPreview={hideDeviceContainerInPreview}\n\t\t\t\tchannel={channel}\n\t\t\t\tskipDefaultVariableContent={skipDefaultVariableContent}\n\t\t\t>\n\t\t\t\t{device === 'mobile' ? (\n\t\t\t\t\t<MobilePreview\n\t\t\t\t\t\tref={mobilePreviewRef}\n\t\t\t\t\t\tdisplay_content={display_content ?? ''}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\ttemplate={template}\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t/>\n\t\t\t\t) : (channel === CHANNEL_TYPE.WHATSAPP ||\n\t\t\t\t\t\tchannel === CHANNEL_TYPE.RCS) &&\n\t\t\t\t  isWhatsappCarousel ? (\n\t\t\t\t\t<CarouselPreview\n\t\t\t\t\t\tref={desktopPreviewRef}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\ttemplate={template}\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t\tisPreview={false}\n\t\t\t\t\t\tshowArrows={true}\n\t\t\t\t\t/>\n\t\t\t\t) : channel === CHANNEL_TYPE.WEBPUSH ? (\n\t\t\t\t\t<TemplatePreview\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\thideHeader\n\t\t\t\t\t\ttemplate={template as WebpushTemplateType}\n\t\t\t\t\t/>\n\t\t\t\t) : channel !== CHANNEL_TYPE.MESSAGE ? (\n\t\t\t\t\t<DesktopPreview\n\t\t\t\t\t\tref={desktopPreviewRef}\n\t\t\t\t\t\tchannel={channel}\n\t\t\t\t\t\tdisplay_content={display_content ?? ''}\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<></>\n\t\t\t\t)}\n\t\t\t</LeftPanelContainer>\n\t\t\t{(isProductCarouselType || showVariableMapping) && (\n\t\t\t\t<RightPanelContainer\n\t\t\t\t\tchannel={channel}\n\t\t\t\t\tisWhatsappCarousel={isWhatsappCarousel}\n\t\t\t\t\tshowVariableMapping={true}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\twidth: channel === 'whatsapp' ? 428 : 400,\n\t\t\t\t\t\t\tdisplay: showVariablePicker ? 'block' : 'none',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<VariablePicker\n\t\t\t\t\t\t\tkey={Math.random()}\n\t\t\t\t\t\t\thideHeaderCross\n\t\t\t\t\t\t\tshowHeader\n\t\t\t\t\t\t\tshowBackButton\n\t\t\t\t\t\t\tonBackButtonClick={() => {\n\t\t\t\t\t\t\t\tsetVariableList(cloneDeep(variableListFromProps));\n\t\t\t\t\t\t\t\tsetShowVariablePicker(false);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tonSelect={(variable: VariableV3) => {\n\t\t\t\t\t\t\t\tvariableCallback(variable);\n\t\t\t\t\t\t\t\tsetVariableList(cloneDeep(variableListFromProps));\n\t\t\t\t\t\t\t\tsetShowVariablePicker(false);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\ttype={PickerType.EMBEDDED}\n\t\t\t\t\t\t\tdata={variableList ?? []}\n\t\t\t\t\t\t\tonDefaultVariableSelect={onDefaultVariableSelect}\n\t\t\t\t\t\t\tskipDefaultVariableContent={skipDefaultVariableContent}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpadding: '16px 14px',\n\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\tchannel === 'whatsapp' ||\n\t\t\t\t\t\t\t\tchannel == 'webpush' ||\n\t\t\t\t\t\t\t\tchannel == 'rcs'\n\t\t\t\t\t\t\t\t\t? 428\n\t\t\t\t\t\t\t\t\t: 400,\n\t\t\t\t\t\t\tdisplay: showVariablePicker ? 'none' : 'block', //cannot unmount the component as it will lose the state\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{channel !== CHANNEL_TYPE.WHATSAPP &&\n\t\t\t\t\t\tchannel !== CHANNEL_TYPE?.RCS ? (\n\t\t\t\t\t\t\tchannel == CHANNEL_TYPE.WEBPUSH ? (\n\t\t\t\t\t\t\t\t<EditWebpushTemplate\n\t\t\t\t\t\t\t\t\twhatsappSpecificPickerMeta={whatsappSpecificPickerMeta}\n\t\t\t\t\t\t\t\t\ttemplate={template as WebpushTemplateType}\n\t\t\t\t\t\t\t\t\tonTemplateChange={(template: AllTemplateTypes) => {\n\t\t\t\t\t\t\t\t\t\tsetTemplate?.(template);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<VariableConnectorsPanel\n\t\t\t\t\t\t\t\t\tonFocus={\n\t\t\t\t\t\t\t\t\t\tchannel === CHANNEL_TYPE.EMAIL\n\t\t\t\t\t\t\t\t\t\t\t? handleVariableConnectorClickUI\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\t\t\t\tdiscountCode={discountCode}\n\t\t\t\t\t\t\t\t\tsetDiscountCode={setDiscountCode}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t) : (channel === CHANNEL_TYPE.WHATSAPP ||\n\t\t\t\t\t\t\t\tchannel === CHANNEL_TYPE.RCS) &&\n\t\t\t\t\t\t  isWhatsappCarousel ? (\n\t\t\t\t\t\t\t<EditWhatsAppCarouselTemplateV2\n\t\t\t\t\t\t\t\twhatsappSpecificPickerMeta={whatsappSpecificPickerMeta}\n\t\t\t\t\t\t\t\ttemplate={template as WhatsAppCarouselTemplate}\n\t\t\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\t\t\tvariableListForImage={variableListForImage}\n\t\t\t\t\t\t\t\tdiscountCode={discountCode}\n\t\t\t\t\t\t\t\tsetDiscountCode={setDiscountCode}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<EditWhatsAppTemplateV2\n\t\t\t\t\t\t\t\twhatsappSpecificPickerMeta={whatsappSpecificPickerMeta}\n\t\t\t\t\t\t\t\ttemplate={template as WhatsAppTemplate}\n\t\t\t\t\t\t\t\tonTemplateChange={(template: AllTemplateTypes) => {\n\t\t\t\t\t\t\t\t\tsetTemplate?.(template);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t\t\t\t\tvariableListForImage={variableListForImage}\n\t\t\t\t\t\t\t\tdiscountCode={discountCode}\n\t\t\t\t\t\t\t\tsetDiscountCode={setDiscountCode}\n\t\t\t\t\t\t\t\tfileName={fileName}\n\t\t\t\t\t\t\t\tsetFileName={setFileName}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</RightPanelContainer>\n\t\t\t)}\n\t\t\t{[CHANNEL_TYPE.WHATSAPP, CHANNEL_TYPE.SMS].includes(channel) &&\n\t\t\t\t!showVariableMapping &&\n\t\t\t\t!isProductCarouselType && (\n\t\t\t\t\t<RightPanelContainer>\n\t\t\t\t\t\t<BodySecondary\n\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\tstyle={{ fontStyle: 'italic' }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tClick on ‘Select template’ below to use it\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</RightPanelContainer>\n\t\t\t\t)}\n\t\t</Container>\n\t);\n};\n\nexport default Body;\n"],"names":["Container","styled","div","RightPanelContainer","props","channel","CHANNEL_TYPE","EMAIL","WHATSAPP","COLORS","stroke","primary","isWhatsappCarousel","undefined","showVariableMapping","LeftPanelContainer","showOnlyContent","hideDeviceContainerInPreview","BACKGROUND_PREVIEW_IMAGE","RCS","whatsappSpecificPickerMeta","showVariableModal","discountCode","setDiscountCode","variableListForImage","showSampleValues","variableListFromProps","fileName","setFileName","skipDefaultVariableContent","desktopPreviewRef","useRef","mobilePreviewRef","variableList","setVariableList","variableCallback","showVariablePicker","setShowVariablePicker","device","display_content","template","setTemplate","isProductCarouselType","onDefaultVariableSelect","useTemplateModalContext","getOffsetTop","element","offsetTop","offsetParent","_jsxs","children","_jsx","jsx","Object","assign","MobilePreview","ref","WEBPUSH","TemplatePreview","hideHeader","MESSAGE","DesktopPreview","_Fragment","Fragment","CarouselPreview","isPreview","showArrows","style","height","width","display","VariablePicker","hideHeaderCross","showHeader","showBackButton","onBackButtonClick","cloneDeep","onSelect","variable","type","PickerType","EMBEDDED","data","Math","random","padding","EditWebpushTemplate","onTemplateChange","VariableConnectorsPanel","onFocus","variableNumber","iframe","document","getElementById","variableId","getVariableNameForEmailByIndex","targetElement","_a","contentWindow","toTopPos","toLeftPos","offsetLeft","current","_b","scrollTo","highlightFor","background","warning","light","_c","EditWhatsAppTemplateV2","EditWhatsAppCarouselTemplateV2","SMS","includes","BodySecondary","color","content","secondary","fontStyle"],"mappings":"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"}

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

@@ -17,5 +17,5 @@
 	height: 6px;
 	background: #d9d9d9;
 	border-radius: 3px;
-`,m=o.default.forwardRef(((r,t)=>{let{display_content:d,showSampleValues:l}=r;return e.jsxs(p,Object.assign({ref:t},{children:[e.jsxs(u,{children:[e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{})]}),e.jsx("div",{children:d?e.jsx(a.TemplatePreview,{showSampleValues:l,channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:d,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}},hidePointerEvents:!0}):e.jsx("div",Object.assign({style:{padding:20}},{children:e.jsx(i.Spinner,{size:"small"})}))})]}))}));m.displayName="DesktopPreview",exports.default=m;
+`,m=o.default.forwardRef((({display_content:r,showSampleValues:t},d)=>e.jsxs(p,Object.assign({ref:d},{children:[e.jsxs(u,{children:[e.jsx(h,{}),e.jsx(h,{}),e.jsx(h,{})]}),e.jsx("div",{children:r?e.jsx(a.TemplatePreview,{showSampleValues:t,channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0,emailSpecificMeta:{emailDisplayContent:r,hideViewButtonForEmail:!0,emailHtmlContainerId:"template_html_desktop",containerStyle:{height:441},templateContainerStyles:{height:"100%"}},hidePointerEvents:!0}):e.jsx("div",Object.assign({style:{padding:20}},{children:e.jsx(i.Spinner,{size:"small"})}))})]}))));m.displayName="DesktopPreview",exports.default=m;
 //# sourceMappingURL=DesktopPreview.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DesktopPreview.js","sources":["../../../../../src/components/template-context-mapper/modalElements/DesktopPreview.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { Spinner } from '@src/components/spinner/Spinner';\nimport { TemplatePreview } from '@src/components/template-preview/TemplatePreview';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport { COLORS } from '@src/constants/Theme';\n\nconst Container = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\toverflow-y: auto;\n\t/* max-height: 420px; */\n\tscroll-behavior: smooth;\n\theight: 100%;\n`;\n\nconst PreviewHeader = styled.div`\n\tpadding: 18px 24px 12px;\n\tdisplay: flex;\n\tgap: 4px;\n\tborder-bottom-width: 1px;\n\tborder-bottom-color: ${COLORS.stroke.primary};\n`;\n\nconst Dot = styled.div`\n\twidth: 6px;\n\theight: 6px;\n\tbackground: #d9d9d9;\n\tborder-radius: 3px;\n`;\n\nconst DesktopPreview = React.forwardRef<\n\tHTMLDivElement,\n\t{ display_content: string; channel: CHANNEL_TYPE; showSampleValues?: boolean }\n>(({ display_content, showSampleValues }, previewRef) => {\n\treturn (\n\t\t<Container ref={previewRef}>\n\t\t\t<PreviewHeader>\n\t\t\t\t<Dot />\n\t\t\t\t<Dot />\n\t\t\t\t<Dot />\n\t\t\t</PreviewHeader>\n\t\t\t<div>\n\t\t\t\t{display_content ? (\n\t\t\t\t\t<TemplatePreview\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t\tchannel={CHANNEL_TYPE.EMAIL}\n\t\t\t\t\t\thideHeader\n\t\t\t\t\t\temailSpecificMeta={{\n\t\t\t\t\t\t\temailDisplayContent: display_content,\n\t\t\t\t\t\t\thideViewButtonForEmail: true,\n\t\t\t\t\t\t\temailHtmlContainerId: 'template_html_desktop',\n\t\t\t\t\t\t\tcontainerStyle: {\n\t\t\t\t\t\t\t\theight: 441,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\ttemplateContainerStyles: {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t}}\n\t\t\t\t\t\thidePointerEvents={true}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<div style={{ padding: 20 }}>\n\t\t\t\t\t\t<Spinner size=\"small\" />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</Container>\n\t);\n});\nDesktopPreview.displayName = 'DesktopPreview';\n\nexport default DesktopPreview;\n"],"names":["Container","styled","div","COLORS","surface","standard","stroke","primary","PreviewHeader","Dot","DesktopPreview","React","forwardRef","_ref","previewRef","display_content","showSampleValues","_jsxs","Object","assign","ref","jsxs","_jsx","jsx","children","TemplatePreview","channel","CHANNEL_TYPE","EMAIL","hideHeader","emailSpecificMeta","emailDisplayContent","hideViewButtonForEmail","emailHtmlContainerId","containerStyle","height","templateContainerStyles","hidePointerEvents","style","padding","Spinner","size","displayName"],"mappings":"gbAOA,MAAMA,EAAYC,EAAM,QAACC,GAAG;eACbC,EAAMA,OAACC,QAAQC;qBACTF,EAAMA,OAACG,OAAOC;;;;;;EAQ7BC,EAAgBP,EAAM,QAACC,GAAG;;;;;wBAKRC,EAAMA,OAACG,OAAOC;EAGhCE,EAAMR,EAAM,QAACC,GAAG;;;;;EAOhBQ,EAAiBC,EAAAA,QAAMC,YAG3B,CAAAC,EAAwCC,KAAc,IAArDC,gBAAEA,EAAeC,iBAAEA,GAAkBH,EACvC,OACCI,OAACjB,EAASkB,OAAAC,OAAA,CAACC,IAAKN,cACfG,EAACI,KAAAb,aACAc,EAAAA,IAACb,MACDa,EAAAA,IAACb,EAAM,CAAA,GACPa,EAAAA,IAACb,EAAM,CAAA,MAERa,EACEC,IAAA,MAAA,CAAAC,SAAAT,EACAO,EAACC,IAAAE,mBACAT,iBAAkBA,EAClBU,QAASC,EAAYA,aAACC,MACtBC,YACA,EAAAC,kBAAmB,CAClBC,oBAAqBhB,EACrBiB,wBAAwB,EACxBC,qBAAsB,wBACtBC,eAAgB,CACfC,OAAQ,KAETC,wBAAyB,CACxBD,OAAQ,SAGVE,mBAAmB,IAGpBf,EAAAC,IAAA,MAAAL,OAAAC,OAAA,CAAKmB,MAAO,CAAEC,QAAS,KACtB,CAAAf,SAAAF,EAAAC,IAACiB,UAAO,CAACC,KAAK,kBAIN,IAGd/B,EAAegC,YAAc"}
+{"version":3,"file":"DesktopPreview.js","sources":["../../../../../src/components/template-context-mapper/modalElements/DesktopPreview.tsx"],"sourcesContent":["import React from 'react';\nimport styled from 'styled-components';\nimport { Spinner } from '@src/components/spinner/Spinner';\nimport { TemplatePreview } from '@src/components/template-preview/TemplatePreview';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport { COLORS } from '@src/constants/Theme';\n\nconst Container = styled.div`\n\tbackground: ${COLORS.surface.standard};\n\tborder: 1px solid ${COLORS.stroke.primary};\n\tborder-radius: 8px;\n\toverflow-y: auto;\n\t/* max-height: 420px; */\n\tscroll-behavior: smooth;\n\theight: 100%;\n`;\n\nconst PreviewHeader = styled.div`\n\tpadding: 18px 24px 12px;\n\tdisplay: flex;\n\tgap: 4px;\n\tborder-bottom-width: 1px;\n\tborder-bottom-color: ${COLORS.stroke.primary};\n`;\n\nconst Dot = styled.div`\n\twidth: 6px;\n\theight: 6px;\n\tbackground: #d9d9d9;\n\tborder-radius: 3px;\n`;\n\nconst DesktopPreview = React.forwardRef<\n\tHTMLDivElement,\n\t{ display_content: string; channel: CHANNEL_TYPE; showSampleValues?: boolean }\n>(({ display_content, showSampleValues }, previewRef) => {\n\treturn (\n\t\t<Container ref={previewRef}>\n\t\t\t<PreviewHeader>\n\t\t\t\t<Dot />\n\t\t\t\t<Dot />\n\t\t\t\t<Dot />\n\t\t\t</PreviewHeader>\n\t\t\t<div>\n\t\t\t\t{display_content ? (\n\t\t\t\t\t<TemplatePreview\n\t\t\t\t\t\tshowSampleValues={showSampleValues}\n\t\t\t\t\t\tchannel={CHANNEL_TYPE.EMAIL}\n\t\t\t\t\t\thideHeader\n\t\t\t\t\t\temailSpecificMeta={{\n\t\t\t\t\t\t\temailDisplayContent: display_content,\n\t\t\t\t\t\t\thideViewButtonForEmail: true,\n\t\t\t\t\t\t\temailHtmlContainerId: 'template_html_desktop',\n\t\t\t\t\t\t\tcontainerStyle: {\n\t\t\t\t\t\t\t\theight: 441,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\ttemplateContainerStyles: {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t}}\n\t\t\t\t\t\thidePointerEvents={true}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<div style={{ padding: 20 }}>\n\t\t\t\t\t\t<Spinner size=\"small\" />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</Container>\n\t);\n});\nDesktopPreview.displayName = 'DesktopPreview';\n\nexport default DesktopPreview;\n"],"names":["Container","styled","div","COLORS","surface","standard","stroke","primary","PreviewHeader","Dot","DesktopPreview","React","forwardRef","display_content","showSampleValues","previewRef","_jsxs","Object","assign","ref","jsxs","_jsx","jsx","children","TemplatePreview","channel","CHANNEL_TYPE","EMAIL","hideHeader","emailSpecificMeta","emailDisplayContent","hideViewButtonForEmail","emailHtmlContainerId","containerStyle","height","templateContainerStyles","hidePointerEvents","style","padding","Spinner","size","displayName"],"mappings":"gbAOA,MAAMA,EAAYC,EAAM,QAACC,GAAG;eACbC,EAAMA,OAACC,QAAQC;qBACTF,EAAMA,OAACG,OAAOC;;;;;;EAQ7BC,EAAgBP,EAAM,QAACC,GAAG;;;;;wBAKRC,EAAMA,OAACG,OAAOC;EAGhCE,EAAMR,EAAM,QAACC,GAAG;;;;;EAOhBQ,EAAiBC,EAAAA,QAAMC,YAG3B,EAAGC,kBAAiBC,oBAAoBC,IAExCC,OAAChB,EAASiB,OAAAC,OAAA,CAACC,IAAKJ,cACfC,EAACI,KAAAZ,aACAa,EAAAA,IAACZ,MACDY,EAAAA,IAACZ,EAAM,CAAA,GACPY,EAAAA,IAACZ,EAAM,CAAA,MAERY,EACEC,IAAA,MAAA,CAAAC,SAAAV,EACAQ,EAACC,IAAAE,mBACAV,iBAAkBA,EAClBW,QAASC,EAAYA,aAACC,MACtBC,YACA,EAAAC,kBAAmB,CAClBC,oBAAqBjB,EACrBkB,wBAAwB,EACxBC,qBAAsB,wBACtBC,eAAgB,CACfC,OAAQ,KAETC,wBAAyB,CACxBD,OAAQ,SAGVE,mBAAmB,IAGpBf,EAAAC,IAAA,MAAAL,OAAAC,OAAA,CAAKmB,MAAO,CAAEC,QAAS,KACtB,CAAAf,SAAAF,EAAAC,IAACiB,UAAO,CAACC,KAAK,qBAOpB9B,EAAe+B,YAAc"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"EditMediaModal.js","sources":["../../../../../src/components/template-context-mapper/modalElements/EditMediaModal.tsx"],"sourcesContent":["import BackIcon from '@src/assets/icons/arrow_back.svg';\nimport InfoIcon from '@src/assets/icons/info.svg';\nimport { PickerType } from '@src/helpers';\nimport React, { useEffect, useState } from 'react';\nimport type { VariableListInterfaceV2 } from '@src/components/add-variableV2/AddVariableV2';\nimport { Button } from '@src/components/button/Button';\nimport { BikImageCropper } from '@src/components/image-cropper/BikImageCropper';\nimport { InputWithVariables } from '@src/components/input-with-vars/InputWithVariables';\nimport { PureSpinner } from '@src/components/spinner/Spinner';\nimport { HEADER_TYPES } from '@src/components/template-preview/models/TemplateMeta';\nimport { POD } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleMedium,\n\tTitleRegular,\n} from '@src/components/TypographyStyle';\nimport { validateURL } from '@src/utils/validator';\nimport { COLORS, DEFAULT_THEME } from '@src/constants/Theme';\nimport FileIcon from '../../../assets/icons/file.svg';\nimport FilePdfIcon from '../../../assets/icons/filePdf.svg';\nimport ImageIcon from '../../../assets/icons/image.svg';\nimport UploadIcon from '../../../assets/icons/upload.svg';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport { isVariable } from '../utils/validateIsUrl';\nimport type { UseEditWhatsappTemplateMediaResponse } from './useEditWhtasappTemplateMedia';\n\ninterface EditMediaModalProps {\n\tsetOpenEditMedia: React.Dispatch<React.SetStateAction<boolean>>;\n\topenEditMedia: boolean;\n\tmediaComponentFormat: HEADER_TYPES;\n\tvariableListForImage: VariableListInterfaceV2[];\n\tuploadMedia: (urlOrVariable?: string) => void;\n\teditIconRef: React.MutableRefObject<HTMLDivElement | null>;\n\tfileRef: React.MutableRefObject<HTMLInputElement | null>;\n\tuseEditWhatsappTemplateMediaResponse: UseEditWhatsappTemplateMediaResponse;\n\tskipAddVariable?: boolean;\n}\nconst EditMediaModal: React.FC<EditMediaModalProps> = ({\n\tsetOpenEditMedia,\n\tmediaComponentFormat,\n\tvariableListForImage,\n\topenEditMedia,\n\tuploadMedia,\n\tfileRef,\n\tuseEditWhatsappTemplateMediaResponse,\n\tskipAddVariable,\n}) => {\n\tconst { pod, setHideCrossButton, setHideFooterButton } =\n\t\tuseTemplateModalContext();\n\n\tconst [errorMessage, setErrorMessage] = useState('');\n\tconst [portalElement, setPortalElement] = useState<HTMLElement | undefined>(\n\t\tundefined,\n\t);\n\tconst [mediaError, setMediaError] = useState<boolean>(false);\n\tconst [mediaValue, setMediaValue] = useState<string>('');\n\n\tuseEffect(() => {\n\t\tsetHideFooterButton(true);\n\t\treturn () => {\n\t\t\tsetHideFooterButton(false);\n\t\t};\n\t}, []);\n\n\tuseEffect(() => {\n\t\t// grab styled modal container to show modal on the complete thing\n\t\tconst element = document.querySelector('[class*=\"ModalWrapper\"]');\n\t\tif (element) {\n\t\t\tsetPortalElement(element as HTMLElement);\n\t\t}\n\t}, [useEditWhatsappTemplateMediaResponse.loading]);\n\n\tlet mediaType: string;\n\tif (mediaComponentFormat === HEADER_TYPES.IMAGE) {\n\t\tmediaType = 'image/png, image/jpeg';\n\t} else if (mediaComponentFormat === HEADER_TYPES.VIDEO) {\n\t\tmediaType = 'video/mp4';\n\t} else {\n\t\tmediaType = 'application/pdf';\n\t}\n\n\tif (!openEditMedia) {\n\t\treturn <></>;\n\t}\n\n\tconst getButtonText = () => {\n\t\treturn mediaComponentFormat === HEADER_TYPES.IMAGE\n\t\t\t? 'Image'\n\t\t\t: mediaComponentFormat === HEADER_TYPES.VIDEO\n\t\t\t? 'Video'\n\t\t\t: 'Document';\n\t};\n\n\tconst getTitleText = () => {\n\t\tif (useEditWhatsappTemplateMediaResponse.loading) {\n\t\t\treturn 'Upload in progress...';\n\t\t}\n\n\t\treturn mediaComponentFormat === HEADER_TYPES.IMAGE\n\t\t\t? 'Upload an image'\n\t\t\t: mediaComponentFormat === HEADER_TYPES.VIDEO\n\t\t\t? 'Upload a video'\n\t\t\t: 'Upload a document';\n\t};\n\n\tconst getSubtitleText = () => {\n\t\tif (useEditWhatsappTemplateMediaResponse.loading) {\n\t\t\treturn `Your ${mediaComponentFormat.toLowerCase()} is getting loaded. This may take a couple of minutes.`;\n\t\t}\n\n\t\treturn mediaComponentFormat === HEADER_TYPES.IMAGE\n\t\t\t? 'JPEG/ PNG format • Max 5MB'\n\t\t\t: mediaComponentFormat === HEADER_TYPES.VIDEO\n\t\t\t? 'MP4 format video • Max 16MB'\n\t\t\t: 'PDF format document • Max 100MB';\n\t};\n\n\tconst handlePickerToggle = (isOpen: boolean) => {\n\t\tif (isOpen) {\n\t\t\tsetHideCrossButton(true);\n\t\t} else {\n\t\t\tsetHideCrossButton(false);\n\t\t}\n\t};\n\n\treturn (\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: '10px',\n\t\t\t\t\talignItems: 'center',\n\t\t\t\t\tmarginBottom: '16px',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<BackIcon\n\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\tsetOpenEditMedia(false);\n\t\t\t\t\t\tsetErrorMessage('');\n\t\t\t\t\t}}\n\t\t\t\t\tstyle={{ cursor: 'pointer' }}\n\t\t\t\t\twidth={16}\n\t\t\t\t\theight={16}\n\t\t\t\t/>\n\t\t\t\t<TitleRegular>Update Media</TitleRegular>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tposition: 'relative',\n\t\t\t\t\tpadding: 16,\n\t\t\t\t\tborderRadius: 4,\n\t\t\t\t\tborder: mediaError\n\t\t\t\t\t\t? `1px dashed ${DEFAULT_THEME.colorsV2.stroke.negative.vibrant}`\n\t\t\t\t\t\t: `1px dashed ${DEFAULT_THEME.colorsV2.stroke.primary}`,\n\t\t\t\t\tbackgroundColor: DEFAULT_THEME.colorsV2.surface.subdued,\n\t\t\t\t\twidth: '100%',\n\t\t\t\t\theight: '100%',\n\t\t\t\t\talignItems: 'center',\n\t\t\t\t\tdisplay: useEditWhatsappTemplateMediaResponse.loading\n\t\t\t\t\t\t? 'flex'\n\t\t\t\t\t\t: 'initial',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 24,\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: 16,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{useEditWhatsappTemplateMediaResponse.loading ? (\n\t\t\t\t\t\t<PureSpinner\n\t\t\t\t\t\t\twidth={'40px'}\n\t\t\t\t\t\t\theight={'40px'}\n\t\t\t\t\t\t\tcolor={COLORS.content.brand}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\theight: 64,\n\t\t\t\t\t\t\t\twidth: 64,\n\t\t\t\t\t\t\t\tborderRadius: '100%',\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\t\t\tbackgroundColor: DEFAULT_THEME.colorsV2.background.base,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{mediaComponentFormat === HEADER_TYPES.IMAGE ? (\n\t\t\t\t\t\t\t\t<ImageIcon width={40} height={40} />\n\t\t\t\t\t\t\t) : mediaComponentFormat === HEADER_TYPES.VIDEO ? (\n\t\t\t\t\t\t\t\t<FileIcon width={40} height={40} />\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<FilePdfIcon width={40} height={40} />\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\t<TitleMedium>{getTitleText()}</TitleMedium>\n\t\t\t\t\t<BodySecondary color={COLORS.content.secondary}>\n\t\t\t\t\t\t{getSubtitleText()}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</div>\n\t\t\t\t{!useEditWhatsappTemplateMediaResponse.loading && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{ display: 'flex', flexDirection: 'column', gap: '6px' }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<InputWithVariables\n\t\t\t\t\t\t\t\tlabelText={`${getButtonText()} URL`}\n\t\t\t\t\t\t\t\tonPickerToggle={handlePickerToggle}\n\t\t\t\t\t\t\t\tpickerType={PickerType.EMBEDDED}\n\t\t\t\t\t\t\t\tportalElement={portalElement ?? document.body}\n\t\t\t\t\t\t\t\tnoMaxCharCheck={true}\n\t\t\t\t\t\t\t\tallowMix={false}\n\t\t\t\t\t\t\t\tonChange={(text) => {\n\t\t\t\t\t\t\t\t\tsetMediaValue(text.actualValue);\n\t\t\t\t\t\t\t\t\tsetMediaError(false);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tshowVarHeader\n\t\t\t\t\t\t\t\tvarHeaderText=\"Select variable\"\n\t\t\t\t\t\t\t\terrorMessage={errorMessage}\n\t\t\t\t\t\t\t\tprevVariable={{ actualValue: '', variableType: 'string' }}\n\t\t\t\t\t\t\t\tvariablesList={variableListForImage}\n\t\t\t\t\t\t\t\tplaceHolder={\n\t\t\t\t\t\t\t\t\tskipAddVariable ? 'Enter URL' : 'Enter URL/Add variable'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tshowAddButton={\n\t\t\t\t\t\t\t\t\tpod === POD.CAMPAIGN\n\t\t\t\t\t\t\t\t\t\t? !skipAddVariable &&\n\t\t\t\t\t\t\t\t\t\t  mediaComponentFormat === HEADER_TYPES.IMAGE\n\t\t\t\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t\t\tgap: '4px',\n\t\t\t\t\t\t\t\tmarginBottom: '12px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<hr\n\t\t\t\t\t\t\t\tstyle={{ height: '2px', flex: 0.5, backgroundColor: 'black' }}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<BodyCaption>Or upload media from device</BodyCaption>\n\t\t\t\t\t\t\t<hr\n\t\t\t\t\t\t\t\tstyle={{ height: '2px', flex: 0.5, backgroundColor: 'black' }}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div style={{ display: 'flex', width: '100%' }}>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tmatchParentWidth\n\t\t\t\t\t\t\t\tbuttonText=\"Upload\"\n\t\t\t\t\t\t\t\tbuttonType=\"dashBold\"\n\t\t\t\t\t\t\t\tLeadingIcon={UploadIcon}\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tuploadMedia();\n\t\t\t\t\t\t\t\t\tsetMediaError(false);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tsize={'medium'}\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\t\t\t\t{mediaError && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\tbottom: -24,\n\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\tgap: 4,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<InfoIcon width={16} height={16} color={COLORS.content.negative} />\n\t\t\t\t\t\t<BodyCaption style={{ color: COLORS.content.negative }}>\n\t\t\t\t\t\t\t{`Select ${getButtonText()}`}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t{!useEditWhatsappTemplateMediaResponse.loading && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{ display: 'flex', justifyContent: 'flex-end', marginTop: 8 }}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={`Add ${getButtonText()}`}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tif (!mediaValue) {\n\t\t\t\t\t\t\t\tsetMediaError(true);\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (!validateURL(mediaValue) && !isVariable(mediaValue)) {\n\t\t\t\t\t\t\t\tsetErrorMessage('Enter valid URL');\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tuploadMedia(mediaValue);\n\t\t\t\t\t\t\tsetOpenEditMedia(false);\n\t\t\t\t\t\t\tsetErrorMessage('');\n\t\t\t\t\t\t\tsetMediaError(false);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<input\n\t\t\t\tref={fileRef}\n\t\t\t\tstyle={{ display: 'none' }}\n\t\t\t\ttype=\"file\"\n\t\t\t\tonChange={useEditWhatsappTemplateMediaResponse.handleImageUpload}\n\t\t\t\taccept={mediaType}\n\t\t\t/>\n\t\t\t{!!useEditWhatsappTemplateMediaResponse.selectedImage && (\n\t\t\t\t<BikImageCropper\n\t\t\t\t\taspectRatio={15 / 8}\n\t\t\t\t\tsrc={useEditWhatsappTemplateMediaResponse.selectedImage}\n\t\t\t\t\tonCropComplete={useEditWhatsappTemplateMediaResponse.onCropComplete}\n\t\t\t\t\tonCancel={() => {\n\t\t\t\t\t\tuseEditWhatsappTemplateMediaResponse.setLoading(false);\n\t\t\t\t\t\tuseEditWhatsappTemplateMediaResponse.setSelectedImage('');\n\t\t\t\t\t\tif (fileRef.current) {\n\t\t\t\t\t\t\tfileRef.current.value = '';\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</>\n\t);\n};\n\nexport default EditMediaModal;\n"],"names":["_ref","setOpenEditMedia","mediaComponentFormat","variableListForImage","openEditMedia","uploadMedia","fileRef","useEditWhatsappTemplateMediaResponse","skipAddVariable","pod","setHideCrossButton","setHideFooterButton","useTemplateModalContext","errorMessage","setErrorMessage","useState","portalElement","setPortalElement","undefined","mediaError","setMediaError","mediaValue","setMediaValue","mediaType","useEffect","element","document","querySelector","loading","HEADER_TYPES","IMAGE","VIDEO","_jsx","getButtonText","_jsxs","_Fragment","children","jsxs","Object","assign","style","display","gap","alignItems","marginBottom","jsx","BackIcon","onClick","e","stopPropagation","cursor","width","height","TitleRegular","position","padding","borderRadius","border","DEFAULT_THEME","colorsV2","stroke","negative","vibrant","primary","backgroundColor","surface","subdued","justifyContent","flexDirection","PureSpinner","color","COLORS","content","brand","background","base","ImageIcon","FileIcon","FilePdfIcon","TitleMedium","BodySecondary","secondary","toLowerCase","InputWithVariables","labelText","onPickerToggle","isOpen","pickerType","PickerType","EMBEDDED","body","noMaxCharCheck","allowMix","onChange","text","actualValue","showVarHeader","varHeaderText","prevVariable","variableType","variablesList","placeHolder","showAddButton","POD","CAMPAIGN","flex","BodyCaption","Button","matchParentWidth","buttonText","buttonType","LeadingIcon","UploadIcon","size","bottom","left","InfoIcon","marginTop","validateURL","isVariable","ref","type","handleImageUpload","accept","selectedImage","BikImageCropper","aspectRatio","src","onCropComplete","onCancel","setLoading","setSelectedImage","current","value"],"mappings":"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"}
+{"version":3,"file":"EditMediaModal.js","sources":["../../../../../src/components/template-context-mapper/modalElements/EditMediaModal.tsx"],"sourcesContent":["import BackIcon from '@src/assets/icons/arrow_back.svg';\nimport InfoIcon from '@src/assets/icons/info.svg';\nimport { PickerType } from '@src/helpers';\nimport React, { useEffect, useState } from 'react';\nimport type { VariableListInterfaceV2 } from '@src/components/add-variableV2/AddVariableV2';\nimport { Button } from '@src/components/button/Button';\nimport { BikImageCropper } from '@src/components/image-cropper/BikImageCropper';\nimport { InputWithVariables } from '@src/components/input-with-vars/InputWithVariables';\nimport { PureSpinner } from '@src/components/spinner/Spinner';\nimport { HEADER_TYPES } from '@src/components/template-preview/models/TemplateMeta';\nimport { POD } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleMedium,\n\tTitleRegular,\n} from '@src/components/TypographyStyle';\nimport { validateURL } from '@src/utils/validator';\nimport { COLORS, DEFAULT_THEME } from '@src/constants/Theme';\nimport FileIcon from '../../../assets/icons/file.svg';\nimport FilePdfIcon from '../../../assets/icons/filePdf.svg';\nimport ImageIcon from '../../../assets/icons/image.svg';\nimport UploadIcon from '../../../assets/icons/upload.svg';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport { isVariable } from '../utils/validateIsUrl';\nimport type { UseEditWhatsappTemplateMediaResponse } from './useEditWhtasappTemplateMedia';\n\ninterface EditMediaModalProps {\n\tsetOpenEditMedia: React.Dispatch<React.SetStateAction<boolean>>;\n\topenEditMedia: boolean;\n\tmediaComponentFormat: HEADER_TYPES;\n\tvariableListForImage: VariableListInterfaceV2[];\n\tuploadMedia: (urlOrVariable?: string) => void;\n\teditIconRef: React.MutableRefObject<HTMLDivElement | null>;\n\tfileRef: React.MutableRefObject<HTMLInputElement | null>;\n\tuseEditWhatsappTemplateMediaResponse: UseEditWhatsappTemplateMediaResponse;\n\tskipAddVariable?: boolean;\n}\nconst EditMediaModal: React.FC<EditMediaModalProps> = ({\n\tsetOpenEditMedia,\n\tmediaComponentFormat,\n\tvariableListForImage,\n\topenEditMedia,\n\tuploadMedia,\n\tfileRef,\n\tuseEditWhatsappTemplateMediaResponse,\n\tskipAddVariable,\n}) => {\n\tconst { pod, setHideCrossButton, setHideFooterButton } =\n\t\tuseTemplateModalContext();\n\n\tconst [errorMessage, setErrorMessage] = useState('');\n\tconst [portalElement, setPortalElement] = useState<HTMLElement | undefined>(\n\t\tundefined,\n\t);\n\tconst [mediaError, setMediaError] = useState<boolean>(false);\n\tconst [mediaValue, setMediaValue] = useState<string>('');\n\n\tuseEffect(() => {\n\t\tsetHideFooterButton(true);\n\t\treturn () => {\n\t\t\tsetHideFooterButton(false);\n\t\t};\n\t}, []);\n\n\tuseEffect(() => {\n\t\t// grab styled modal container to show modal on the complete thing\n\t\tconst element = document.querySelector('[class*=\"ModalWrapper\"]');\n\t\tif (element) {\n\t\t\tsetPortalElement(element as HTMLElement);\n\t\t}\n\t}, [useEditWhatsappTemplateMediaResponse.loading]);\n\n\tlet mediaType: string;\n\tif (mediaComponentFormat === HEADER_TYPES.IMAGE) {\n\t\tmediaType = 'image/png, image/jpeg';\n\t} else if (mediaComponentFormat === HEADER_TYPES.VIDEO) {\n\t\tmediaType = 'video/mp4';\n\t} else {\n\t\tmediaType = 'application/pdf';\n\t}\n\n\tif (!openEditMedia) {\n\t\treturn <></>;\n\t}\n\n\tconst getButtonText = () => {\n\t\treturn mediaComponentFormat === HEADER_TYPES.IMAGE\n\t\t\t? 'Image'\n\t\t\t: mediaComponentFormat === HEADER_TYPES.VIDEO\n\t\t\t? 'Video'\n\t\t\t: 'Document';\n\t};\n\n\tconst getTitleText = () => {\n\t\tif (useEditWhatsappTemplateMediaResponse.loading) {\n\t\t\treturn 'Upload in progress...';\n\t\t}\n\n\t\treturn mediaComponentFormat === HEADER_TYPES.IMAGE\n\t\t\t? 'Upload an image'\n\t\t\t: mediaComponentFormat === HEADER_TYPES.VIDEO\n\t\t\t? 'Upload a video'\n\t\t\t: 'Upload a document';\n\t};\n\n\tconst getSubtitleText = () => {\n\t\tif (useEditWhatsappTemplateMediaResponse.loading) {\n\t\t\treturn `Your ${mediaComponentFormat.toLowerCase()} is getting loaded. This may take a couple of minutes.`;\n\t\t}\n\n\t\treturn mediaComponentFormat === HEADER_TYPES.IMAGE\n\t\t\t? 'JPEG/ PNG format • Max 5MB'\n\t\t\t: mediaComponentFormat === HEADER_TYPES.VIDEO\n\t\t\t? 'MP4 format video • Max 16MB'\n\t\t\t: 'PDF format document • Max 100MB';\n\t};\n\n\tconst handlePickerToggle = (isOpen: boolean) => {\n\t\tif (isOpen) {\n\t\t\tsetHideCrossButton(true);\n\t\t} else {\n\t\t\tsetHideCrossButton(false);\n\t\t}\n\t};\n\n\treturn (\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: '10px',\n\t\t\t\t\talignItems: 'center',\n\t\t\t\t\tmarginBottom: '16px',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<BackIcon\n\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\tsetOpenEditMedia(false);\n\t\t\t\t\t\tsetErrorMessage('');\n\t\t\t\t\t}}\n\t\t\t\t\tstyle={{ cursor: 'pointer' }}\n\t\t\t\t\twidth={16}\n\t\t\t\t\theight={16}\n\t\t\t\t/>\n\t\t\t\t<TitleRegular>Update Media</TitleRegular>\n\t\t\t</div>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tposition: 'relative',\n\t\t\t\t\tpadding: 16,\n\t\t\t\t\tborderRadius: 4,\n\t\t\t\t\tborder: mediaError\n\t\t\t\t\t\t? `1px dashed ${DEFAULT_THEME.colorsV2.stroke.negative.vibrant}`\n\t\t\t\t\t\t: `1px dashed ${DEFAULT_THEME.colorsV2.stroke.primary}`,\n\t\t\t\t\tbackgroundColor: DEFAULT_THEME.colorsV2.surface.subdued,\n\t\t\t\t\twidth: '100%',\n\t\t\t\t\theight: '100%',\n\t\t\t\t\talignItems: 'center',\n\t\t\t\t\tdisplay: useEditWhatsappTemplateMediaResponse.loading\n\t\t\t\t\t\t? 'flex'\n\t\t\t\t\t\t: 'initial',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 24,\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: 16,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{useEditWhatsappTemplateMediaResponse.loading ? (\n\t\t\t\t\t\t<PureSpinner\n\t\t\t\t\t\t\twidth={'40px'}\n\t\t\t\t\t\t\theight={'40px'}\n\t\t\t\t\t\t\tcolor={COLORS.content.brand}\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\theight: 64,\n\t\t\t\t\t\t\t\twidth: 64,\n\t\t\t\t\t\t\t\tborderRadius: '100%',\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\t\t\tbackgroundColor: DEFAULT_THEME.colorsV2.background.base,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{mediaComponentFormat === HEADER_TYPES.IMAGE ? (\n\t\t\t\t\t\t\t\t<ImageIcon width={40} height={40} />\n\t\t\t\t\t\t\t) : mediaComponentFormat === HEADER_TYPES.VIDEO ? (\n\t\t\t\t\t\t\t\t<FileIcon width={40} height={40} />\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<FilePdfIcon width={40} height={40} />\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\t<TitleMedium>{getTitleText()}</TitleMedium>\n\t\t\t\t\t<BodySecondary color={COLORS.content.secondary}>\n\t\t\t\t\t\t{getSubtitleText()}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</div>\n\t\t\t\t{!useEditWhatsappTemplateMediaResponse.loading && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{ display: 'flex', flexDirection: 'column', gap: '6px' }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<InputWithVariables\n\t\t\t\t\t\t\t\tlabelText={`${getButtonText()} URL`}\n\t\t\t\t\t\t\t\tonPickerToggle={handlePickerToggle}\n\t\t\t\t\t\t\t\tpickerType={PickerType.EMBEDDED}\n\t\t\t\t\t\t\t\tportalElement={portalElement ?? document.body}\n\t\t\t\t\t\t\t\tnoMaxCharCheck={true}\n\t\t\t\t\t\t\t\tallowMix={false}\n\t\t\t\t\t\t\t\tonChange={(text) => {\n\t\t\t\t\t\t\t\t\tsetMediaValue(text.actualValue);\n\t\t\t\t\t\t\t\t\tsetMediaError(false);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tshowVarHeader\n\t\t\t\t\t\t\t\tvarHeaderText=\"Select variable\"\n\t\t\t\t\t\t\t\terrorMessage={errorMessage}\n\t\t\t\t\t\t\t\tprevVariable={{ actualValue: '', variableType: 'string' }}\n\t\t\t\t\t\t\t\tvariablesList={variableListForImage}\n\t\t\t\t\t\t\t\tplaceHolder={\n\t\t\t\t\t\t\t\t\tskipAddVariable ? 'Enter URL' : 'Enter URL/Add variable'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tshowAddButton={\n\t\t\t\t\t\t\t\t\tpod === POD.CAMPAIGN\n\t\t\t\t\t\t\t\t\t\t? !skipAddVariable &&\n\t\t\t\t\t\t\t\t\t\t  mediaComponentFormat === HEADER_TYPES.IMAGE\n\t\t\t\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t\t\tgap: '4px',\n\t\t\t\t\t\t\t\tmarginBottom: '12px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<hr\n\t\t\t\t\t\t\t\tstyle={{ height: '2px', flex: 0.5, backgroundColor: 'black' }}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<BodyCaption>Or upload media from device</BodyCaption>\n\t\t\t\t\t\t\t<hr\n\t\t\t\t\t\t\t\tstyle={{ height: '2px', flex: 0.5, backgroundColor: 'black' }}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div style={{ display: 'flex', width: '100%' }}>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tmatchParentWidth\n\t\t\t\t\t\t\t\tbuttonText=\"Upload\"\n\t\t\t\t\t\t\t\tbuttonType=\"dashBold\"\n\t\t\t\t\t\t\t\tLeadingIcon={UploadIcon}\n\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\tuploadMedia();\n\t\t\t\t\t\t\t\t\tsetMediaError(false);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tsize={'medium'}\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\t\t\t\t{mediaError && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\tbottom: -24,\n\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\tgap: 4,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<InfoIcon width={16} height={16} color={COLORS.content.negative} />\n\t\t\t\t\t\t<BodyCaption style={{ color: COLORS.content.negative }}>\n\t\t\t\t\t\t\t{`Select ${getButtonText()}`}\n\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</div>\n\n\t\t\t{!useEditWhatsappTemplateMediaResponse.loading && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{ display: 'flex', justifyContent: 'flex-end', marginTop: 8 }}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={`Add ${getButtonText()}`}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tif (!mediaValue) {\n\t\t\t\t\t\t\t\tsetMediaError(true);\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (!validateURL(mediaValue) && !isVariable(mediaValue)) {\n\t\t\t\t\t\t\t\tsetErrorMessage('Enter valid URL');\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tuploadMedia(mediaValue);\n\t\t\t\t\t\t\tsetOpenEditMedia(false);\n\t\t\t\t\t\t\tsetErrorMessage('');\n\t\t\t\t\t\t\tsetMediaError(false);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t<input\n\t\t\t\tref={fileRef}\n\t\t\t\tstyle={{ display: 'none' }}\n\t\t\t\ttype=\"file\"\n\t\t\t\tonChange={useEditWhatsappTemplateMediaResponse.handleImageUpload}\n\t\t\t\taccept={mediaType}\n\t\t\t/>\n\t\t\t{!!useEditWhatsappTemplateMediaResponse.selectedImage && (\n\t\t\t\t<BikImageCropper\n\t\t\t\t\taspectRatio={15 / 8}\n\t\t\t\t\tsrc={useEditWhatsappTemplateMediaResponse.selectedImage}\n\t\t\t\t\tonCropComplete={useEditWhatsappTemplateMediaResponse.onCropComplete}\n\t\t\t\t\tonCancel={() => {\n\t\t\t\t\t\tuseEditWhatsappTemplateMediaResponse.setLoading(false);\n\t\t\t\t\t\tuseEditWhatsappTemplateMediaResponse.setSelectedImage('');\n\t\t\t\t\t\tif (fileRef.current) {\n\t\t\t\t\t\t\tfileRef.current.value = '';\n\t\t\t\t\t\t}\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</>\n\t);\n};\n\nexport default EditMediaModal;\n"],"names":["EditMediaModal","setOpenEditMedia","mediaComponentFormat","variableListForImage","openEditMedia","uploadMedia","fileRef","useEditWhatsappTemplateMediaResponse","skipAddVariable","pod","setHideCrossButton","setHideFooterButton","useTemplateModalContext","errorMessage","setErrorMessage","useState","portalElement","setPortalElement","undefined","mediaError","setMediaError","mediaValue","setMediaValue","mediaType","useEffect","element","document","querySelector","loading","HEADER_TYPES","IMAGE","VIDEO","_jsx","getButtonText","_jsxs","_Fragment","children","jsxs","Object","assign","style","display","gap","alignItems","marginBottom","jsx","BackIcon","onClick","e","stopPropagation","cursor","width","height","TitleRegular","position","padding","borderRadius","border","DEFAULT_THEME","colorsV2","stroke","negative","vibrant","primary","backgroundColor","surface","subdued","justifyContent","flexDirection","PureSpinner","color","COLORS","content","brand","background","base","ImageIcon","FileIcon","FilePdfIcon","TitleMedium","BodySecondary","secondary","toLowerCase","InputWithVariables","labelText","onPickerToggle","isOpen","pickerType","PickerType","EMBEDDED","body","noMaxCharCheck","allowMix","onChange","text","actualValue","showVarHeader","varHeaderText","prevVariable","variableType","variablesList","placeHolder","showAddButton","POD","CAMPAIGN","flex","BodyCaption","Button","matchParentWidth","buttonText","buttonType","LeadingIcon","UploadIcon","size","bottom","left","InfoIcon","marginTop","validateURL","isVariable","ref","type","handleImageUpload","accept","selectedImage","BikImageCropper","aspectRatio","src","onCropComplete","onCancel","setLoading","setSelectedImage","current","value"],"mappings":"6gCAsCsDA,EACrDC,mBACAC,uBACAC,uBACAC,gBACAC,cACAC,UACAC,uCACAC,sBAEA,MAAMC,IAAEA,EAAGC,mBAAEA,EAAkBC,oBAAEA,GAChCC,EAAuBA,2BAEjBC,EAAcC,GAAmBC,EAAQA,SAAC,KAC1CC,EAAeC,GAAoBF,EAAQA,cACjDG,IAEMC,EAAYC,GAAiBL,EAAQA,UAAU,IAC/CM,EAAYC,GAAiBP,EAAQA,SAAS,IAiBrD,IAAIQ,EASJ,GAxBAC,EAAAA,WAAU,KACTb,GAAoB,GACb,KACNA,GAAoB,EAAM,IAEzB,IAEHa,EAAAA,WAAU,KAET,MAAMC,EAAUC,SAASC,cAAc,2BACnCF,GACHR,EAAiBQ,EACjB,GACC,CAAClB,EAAqCqB,UAIxCL,EADGrB,IAAyB2B,EAAYA,aAACC,MAC7B,wBACF5B,IAAyB2B,EAAYA,aAACE,MACpC,YAEA,mBAGR3B,EACJ,OAAO4B,qBAGR,MAAMC,EAAgBA,IACd/B,IAAyB2B,eAAaC,MAC1C,QACA5B,IAAyB2B,eAAaE,MACtC,QACA,WAmCJ,OACCG,EAAAA,KAAAC,EAAAA,SAAA,CAAAC,SAAA,CACCF,EACCG,KAAA,MAAAC,OAAAC,OAAA,CAAAC,MAAO,CACNC,QAAS,OACTC,IAAK,OACLC,WAAY,SACZC,aAAc,SAGf,CAAAR,SAAA,CAAAJ,EAAAa,IAACC,UACA,CAAAC,QAAUC,IACTA,EAAEC,kBACFhD,GAAiB,GACjBa,EAAgB,GAAG,EAEpB0B,MAAO,CAAEU,OAAQ,WACjBC,MAAO,GACPC,OAAQ,KAETpB,EAAAa,IAACQ,eAAY,CAAAjB,SAAA,qBAEdF,EACCG,KAAA,MAAAC,OAAAC,OAAA,CAAAC,MAAO,CACNc,SAAU,WACVC,QAAS,GACTC,aAAc,EACdC,OAAQtC,EACL,cAAcuC,EAAAA,cAAcC,SAASC,OAAOC,SAASC,UACrD,cAAcJ,EAAAA,cAAcC,SAASC,OAAOG,UAC/CC,gBAAiBN,EAAaA,cAACC,SAASM,QAAQC,QAChDf,MAAO,OACPC,OAAQ,OACRT,WAAY,SACZF,QAASlC,EAAqCqB,QAC3C,OACA,YAGJ,CAAAQ,SAAA,CAAAF,EAAAG,KAAA,MAAAC,OAAAC,OAAA,CACCC,MAAO,CACNI,aAAc,GACdH,QAAS,OACT0B,eAAgB,SAChBC,cAAe,SACfzB,WAAY,SACZD,IAAK,KACL,CAAAN,SAAA,CAEA7B,EAAqCqB,QACrCI,EAAAA,IAACqC,EAAAA,YACA,CAAAlB,MAAO,OACPC,OAAQ,OACRkB,MAAOC,EAAAA,OAAOC,QAAQC,QAGvBzC,EAAAa,IAAA,MAAAP,OAAAC,OAAA,CACCC,MAAO,CACNY,OAAQ,GACRD,MAAO,GACPK,aAAc,OACdf,QAAS,OACTE,WAAY,SACZwB,eAAgB,SAChBH,gBAAiBN,EAAaA,cAACC,SAASe,WAAWC,OACnD,CAAAvC,SAEAlC,IAAyB2B,EAAAA,aAAaC,MACtCE,EAAAA,IAAC4C,EAAAA,QAAU,CAAAzB,MAAO,GAAIC,OAAQ,KAC3BlD,IAAyB2B,EAAAA,aAAaE,MACzCC,EAAAA,IAAC6C,EAAAA,SAAS1B,MAAO,GAAIC,OAAQ,KAE7BpB,EAAAa,IAACiC,UAAY,CAAA3B,MAAO,GAAIC,OAAQ,QAInCpB,EAAAa,IAACkC,cAAa,CAAA3C,SA3Gb7B,EAAqCqB,QACjC,wBAGD1B,IAAyB2B,eAAaC,MAC1C,kBACA5B,IAAyB2B,eAAaE,MACtC,iBACA,sBAoGAC,EAACa,IAAAmC,gBAAc1C,OAAAC,OAAA,CAAA+B,MAAOC,EAAAA,OAAOC,QAAQS,WACnC,CAAA7C,SAjGD7B,EAAqCqB,QACjC,QAAQ1B,EAAqBgF,sEAG9BhF,IAAyB2B,eAAaC,MAC1C,6BACA5B,IAAyB2B,eAAaE,MACtC,8BACA,0CA4FCxB,EAAqCqB,SACtCM,EAAAA,KACCC,EAAAA,SAAA,CAAAC,SAAA,CAAAJ,EAAAa,IAAA,MAAAP,OAAAC,OAAA,CACCC,MAAO,CAAEC,QAAS,OAAQ2B,cAAe,SAAU1B,IAAK,kBAExDV,EAACa,IAAAsC,qBACA,CAAAC,UAAW,GAAGnD,UACdoD,eAhGqBC,IAE1B5E,IADG4E,EAIH,EA4FKC,WAAYC,EAAUA,WAACC,SACvBzE,cAAeA,QAAAA,EAAiBU,SAASgE,KACzCC,gBAAgB,EAChBC,UAAU,EACVC,SAAWC,IACVxE,EAAcwE,EAAKC,aACnB3E,GAAc,EAAM,EAErB4E,eACA,EAAAC,cAAc,kBACdpF,aAAcA,EACdqF,aAAc,CAAEH,YAAa,GAAII,aAAc,UAC/CC,cAAejG,EACfkG,YACC7F,EAAkB,YAAc,yBAEjC8F,cACC7F,IAAQ8F,EAAAA,IAAIC,WACRhG,GACDN,IAAyB2B,eAAaC,WAK5CI,EAAAG,KAAA,MAAAC,OAAAC,OAAA,CACCC,MAAO,CACNC,QAAS,OACTE,WAAY,SACZwB,eAAgB,gBAChBzB,IAAK,MACLE,aAAc,SACd,CAAAR,SAAA,CAEDJ,EACCa,IAAA,KAAA,CAAAL,MAAO,CAAEY,OAAQ,MAAOqD,KAAM,GAAKzC,gBAAiB,WAErDhC,EAAAa,IAAC6D,cAAqD,CAAAtE,SAAA,gCACtDJ,EACCa,IAAA,KAAA,CAAAL,MAAO,CAAEY,OAAQ,MAAOqD,KAAM,GAAKzC,gBAAiB,eAGtDhC,EAAKa,IAAA,MAAAP,OAAAC,OAAA,CAAAC,MAAO,CAAEC,QAAS,OAAQU,MAAO,mBACrCnB,EAACa,IAAA8D,SACA,CAAAC,oBACAC,WAAW,SACXC,WAAW,WACXC,YAAaC,EAAU,QACvBjE,QAASA,KACR1C,IACAe,GAAc,EAAM,EAErB6F,KAAM,iBAKT9F,GACAe,EAAAA,KAAA,MAAAI,OAAAC,OAAA,CACCC,MAAO,CACNc,SAAU,WACVb,QAAS,OACTE,WAAY,SACZuE,QAAS,GACTC,KAAM,EACNzE,IAAK,IACL,CAAAN,SAAA,CAEDJ,MAACoF,UAAQ,CAACjE,MAAO,GAAIC,OAAQ,GAAIkB,MAAOC,EAAAA,OAAOC,QAAQX,WACvD7B,EAAAa,IAAC6D,cAAYpE,OAAAC,OAAA,CAAAC,MAAO,CAAE8B,MAAOC,EAAAA,OAAOC,QAAQX,qBAC1C,UAAU5B,kBAMb1B,EAAqCqB,SACtCI,EAAAA,IACC,MAAAM,OAAAC,OAAA,CAAAC,MAAO,CAAEC,QAAS,OAAQ0B,eAAgB,WAAYkD,UAAW,IAEjE,CAAAjF,SAAAJ,EAAAa,IAAC8D,SACA,CAAAE,WAAY,OAAO5E,MACnBc,QAASA,KACH1B,EAIAiG,EAAWA,YAACjG,IAAgBkG,EAAUA,WAAClG,IAK5ChB,EAAYgB,GACZpB,GAAiB,GACjBa,EAAgB,IAChBM,GAAc,IAPbN,EAAgB,mBAJhBM,GAAc,EAWK,OAMxBY,EACCa,IAAA,QAAA,CAAA2E,IAAKlH,EACLkC,MAAO,CAAEC,QAAS,QAClBgF,KAAK,OACL5B,SAAUtF,EAAqCmH,kBAC/CC,OAAQpG,MAENhB,EAAqCqH,eACvC5F,EAAAA,IAAC6F,EAAAA,gBACA,CAAAC,YAAa,GAAK,EAClBC,IAAKxH,EAAqCqH,cAC1CI,eAAgBzH,EAAqCyH,eACrDC,SAAUA,KACT1H,EAAqC2H,YAAW,GAChD3H,EAAqC4H,iBAAiB,IAClD7H,EAAQ8H,UACX9H,EAAQ8H,QAAQC,MAAQ,GACxB,MAIF"}