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

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

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

Files changed (1557) hide show

package/dist/esm/components/switch/Switch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Switch.js","sources":["../../../../src/components/switch/Switch.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { forwardRef, useEffect, useState } from 'react';\nimport { COLORS, DEFAULT_THEME } from '@src/constants/Theme';\nimport { SwitchColorProps, SwitchProps } from './Switch.d';\n\nexport const Switch = forwardRef<HTMLButtonElement, SwitchProps>(\n\t({\n\t\tcustomThumbColor,\n\t\ttrackColor,\n\t\ttrackHeight,\n\t\ttrackLength,\n\t\tdisabled,\n\t\tvalue: propsValue,\n\t\tonValueChange,\n\t\tduration,\n\t\tcontainerStyle,\n\t\ttype,\n\t\tisLoading,\n\t\t'data-test': dataTest,\n\t}) => {\n\t\tconst { colorsV2 } = DEFAULT_THEME;\n\n\t\tconst [value, setValue] = useState<boolean>(propsValue);\n\n\t\tconst [isloading, setLoading] = useState<boolean>(isLoading ?? false);\n\t\tconst durationTime = duration ?? 200;\n\n\t\tuseEffect(() => {\n\t\t\tif (typeof isLoading == 'boolean') {\n\t\t\t\tsetLoading(isLoading);\n\t\t\t}\n\t\t}, [isLoading]);\n\n\t\tuseEffect(() => {\n\t\t\tsetValue(propsValue);\n\t\t}, [propsValue]);\n\n\t\tconst consolidatedTrackColor: SwitchColorProps = disabled\n\t\t\t? {\n\t\t\t\t\tfalse: colorsV2.background.inactive,\n\t\t\t\t\ttrue: colorsV2.background.inactive,\n\t\t\t }\n\t\t\t: {\n\t\t\t\t\tfalse:\n\t\t\t\t\t\ttrackColor?.false ?? type === 'greenred'\n\t\t\t\t\t\t\t? colorsV2.background.negative.light\n\t\t\t\t\t\t\t: colorsV2.background.base,\n\t\t\t\t\ttrue:\n\t\t\t\t\t\ttrackColor?.true ?? type === 'greenred'\n\t\t\t\t\t\t\t? colorsV2.background.positive.vibrant\n\t\t\t\t\t\t\t: colorsV2.background.brand,\n\t\t\t };\n\n\t\tconst consolidatedBorderColor: SwitchColorProps = {\n\t\t\tfalse:\n\t\t\t\ttype === 'greenred'\n\t\t\t\t\t? colorsV2.stroke.negative.lightAlt\n\t\t\t\t\t: colorsV2.stroke.primary,\n\t\t\ttrue:\n\t\t\t\ttype === 'greenred'\n\t\t\t\t\t? colorsV2.background.positive.vibrant\n\t\t\t\t\t: colorsV2.background.brand,\n\t\t};\n\n\t\tconst consolidatedThumbColor: SwitchColorProps = disabled\n\t\t\t? { false: colorsV2.content.inactive, true: colorsV2.content.inactive }\n\t\t\t: {\n\t\t\t\t\tfalse:\n\t\t\t\t\t\tcustomThumbColor?.false ?? type === 'greenred'\n\t\t\t\t\t\t\t? colorsV2.content.negative\n\t\t\t\t\t\t\t: colorsV2.text.primary,\n\t\t\t\t\ttrue: customThumbColor?.true ?? colorsV2.surface.standard,\n\t\t\t };\n\n\t\tconst consolidateOutlineColor: SwitchColorProps = !type\n\t\t\t? { false: colorsV2.stroke.primary, true: colorsV2.stroke.primary }\n\t\t\t: {\n\t\t\t\t\tfalse:\n\t\t\t\t\t\ttype === 'greenred'\n\t\t\t\t\t\t\t? colorsV2.stroke.negative.lightAlt\n\t\t\t\t\t\t\t: colorsV2.stroke.primary,\n\t\t\t\t\ttrue:\n\t\t\t\t\t\ttype === 'greenred'\n\t\t\t\t\t\t\t? colorsV2.stroke.positive.lightAlt\n\t\t\t\t\t\t\t: colorsV2.background.brandLight,\n\t\t\t };\n\n\t\tasync function handlePress() {\n\t\t\tif (disabled) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (typeof isLoading !== 'boolean') {\n\t\t\t\tsetLoading(true);\n\t\t\t}\n\t\t\ttry {\n\t\t\t\tawait onValueChange?.(!value);\n\t\t\t\tsetValue(!value);\n\t\t\t} catch (err) {\n\t\t\t\tconsole.log(err);\n\t\t\t}\n\t\t\tif (typeof isLoading !== 'boolean') {\n\t\t\t\tsetLoading(false);\n\t\t\t}\n\t\t}\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<SwitchContainer\n\t\t\t\t\tdata-test={dataTest}\n\t\t\t\t\ttrackLength={trackLength ?? 40}\n\t\t\t\t\ttrackHeight={trackHeight ?? 20}\n\t\t\t\t\tonClick={() => handlePress()}\n\t\t\t\t\ttrackColor={consolidatedTrackColor}\n\t\t\t\t\tvalue={value}\n\t\t\t\t\tstyle={containerStyle}\n\t\t\t\t\tborderColor={consolidatedBorderColor}\n\t\t\t\t\tduration={durationTime}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\toutlineColor={consolidateOutlineColor}\n\t\t\t\t>\n\t\t\t\t\t{isloading ? (\n\t\t\t\t\t\t<Loader value={value} trackColor={consolidatedTrackColor} />\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<Thumb\n\t\t\t\t\t\t\tvalue={value}\n\t\t\t\t\t\t\tduration={durationTime}\n\t\t\t\t\t\t\tthumbColor={consolidatedThumbColor}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</SwitchContainer>\n\t\t\t</>\n\t\t);\n\t},\n);\n\nSwitch.displayName = 'Switch';\n\nexport const SwitchContainer = styled.div<{\n\ttrackLength: number;\n\ttrackHeight: number;\n\ttrackColor: SwitchColorProps;\n\tvalue: boolean;\n\tborderColor: SwitchColorProps;\n\tduration: number;\n\tdisabled?: boolean;\n\toutlineColor: SwitchColorProps;\n}>`\n\tdisplay: flex;\n\tflex-direction: row;\n\tmargin-top: 5px;\n\tmargin-bottom: 5px;\n\tborder-radius: 30px;\n\tbackground-color: red;\n\tbackground-color: ${(props) =>\n\t\tprops.value ? props.trackColor.true : props.trackColor.false};\n\twidth: ${(props) => props.trackLength + 'px'};\n\theight: ${(props) => props.trackHeight + 'px'};\n\tborder-width: ${(props) => (props.disabled ? '0px' : '1px')};\n\tborder-style: solid;\n\tborder-color: ${(props) =>\n\t\tprops.value ? props.borderColor.true : props.borderColor.false};\n\n\ttransition: ${(props) => `${props.duration / 1000}s ease all`};\n\talign-items: center;\n\tcursor: ${(props) => (props.disabled ? 'default' : 'pointer')};\n\t:focus {\n\t\toutline: ${(props) =>\n\t\t\tprops.value ? props.outlineColor.true : props.outlineColor.false};\n\t\toutline-style: solid;\n\t\toutline-offset: 2px;\n\t\toutline-width: 2px;\n\t}\n\t:active {\n\t\toutline: ${(props) =>\n\t\t\tprops.value ? props.outlineColor.true : props.outlineColor.false};\n\t\toutline-style: solid;\n\t\toutline-offset: 2px;\n\t\toutline-width: 2px;\n\t}\n`;\n\nexport const Thumb = styled.div<{\n\tvalue: boolean;\n\tduration: number;\n\tthumbColor: SwitchColorProps;\n}>`\n\theight: 12px;\n\twidth: 12px;\n\tmargin: 4px;\n\tborder-radius: 8px;\n\tposition: relative;\n\tleft: ${(props) => (props.value ? 'calc(100% - 20px)' : '0px')};\n\ttransition: ${(props) => `${props.duration / 1000}s ease all`};\n\tbackground-color: ${(props) =>\n\t\tprops.value ? props.thumbColor.true : props.thumbColor.false};\n`;\n\nexport const Loader = styled.div<{\n\tvalue: boolean;\n\ttrackColor: SwitchColorProps;\n}>`\n\tborder-width: 2px;\n\tborder-style: solid;\n\tborder-color: ${(props) =>\n\t\tprops.value ? props.trackColor.true : props.trackColor.false};\n\tborder-top-width: 2px;\n\tborder-top-style: solid;\n\tborder-top-color: ${(props) =>\n\t\tprops.value ? COLORS.text.white : COLORS.background.brand};\n\tborder-radius: 50%;\n\theight: 8px;\n\twidth: 8px;\n\tmargin: 4px;\n\tposition: relative;\n\tleft: ${(props) => (props.value ? 'calc(100% - 20px)' : '0px')};\n\tanimation: spin 1s linear infinite;\n\t@keyframes spin {\n\t\t0% {\n\t\t\ttransform: rotate(0deg);\n\t\t}\n\t\t100% {\n\t\t\ttransform: rotate(360deg);\n\t\t}\n\t}\n`;\n"],"names":["Switch","forwardRef","customThumbColor","trackColor","trackHeight","trackLength","disabled","value","propsValue","onValueChange","duration","containerStyle","type","isLoading","dataTest","colorsV2","DEFAULT_THEME","setValue","useState","isloading","setLoading","durationTime","useEffect","consolidatedTrackColor","false","background","inactive","true","_a","negative","light","base","_b","positive","vibrant","brand","consolidatedBorderColor","stroke","lightAlt","primary","consolidatedThumbColor","content","_c","text","_d","surface","standard","consolidateOutlineColor","brandLight","_jsx","SwitchContainer","onClick","err","console","log","handlePress","style","borderColor","outlineColor","children","Loader","Thumb","thumbColor","displayName","_styled","process","env","NODE_ENV","target","label","props","COLORS","white"],"mappings":"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"}
1	+ {"version":3,"file":"Switch.js","sources":["../../../../src/components/switch/Switch.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { forwardRef, useEffect, useState } from 'react';\nimport { COLORS, DEFAULT_THEME } from '@src/constants/Theme';\nimport { SwitchColorProps, SwitchProps } from './Switch.d';\n\nexport const Switch = forwardRef<HTMLButtonElement, SwitchProps>(\n\t({\n\t\tcustomThumbColor,\n\t\ttrackColor,\n\t\ttrackHeight,\n\t\ttrackLength,\n\t\tdisabled,\n\t\tvalue: propsValue,\n\t\tonValueChange,\n\t\tduration,\n\t\tcontainerStyle,\n\t\ttype,\n\t\tisLoading,\n\t\t'data-test': dataTest,\n\t}) => {\n\t\tconst { colorsV2 } = DEFAULT_THEME;\n\n\t\tconst [value, setValue] = useState<boolean>(propsValue);\n\n\t\tconst [isloading, setLoading] = useState<boolean>(isLoading ?? false);\n\t\tconst durationTime = duration ?? 200;\n\n\t\tuseEffect(() => {\n\t\t\tif (typeof isLoading == 'boolean') {\n\t\t\t\tsetLoading(isLoading);\n\t\t\t}\n\t\t}, [isLoading]);\n\n\t\tuseEffect(() => {\n\t\t\tsetValue(propsValue);\n\t\t}, [propsValue]);\n\n\t\tconst consolidatedTrackColor: SwitchColorProps = disabled\n\t\t\t? {\n\t\t\t\t\tfalse: colorsV2.background.inactive,\n\t\t\t\t\ttrue: colorsV2.background.inactive,\n\t\t\t }\n\t\t\t: {\n\t\t\t\t\tfalse:\n\t\t\t\t\t\ttrackColor?.false ?? type === 'greenred'\n\t\t\t\t\t\t\t? colorsV2.background.negative.light\n\t\t\t\t\t\t\t: colorsV2.background.base,\n\t\t\t\t\ttrue:\n\t\t\t\t\t\ttrackColor?.true ?? type === 'greenred'\n\t\t\t\t\t\t\t? colorsV2.background.positive.vibrant\n\t\t\t\t\t\t\t: colorsV2.background.brand,\n\t\t\t };\n\n\t\tconst consolidatedBorderColor: SwitchColorProps = {\n\t\t\tfalse:\n\t\t\t\ttype === 'greenred'\n\t\t\t\t\t? colorsV2.stroke.negative.lightAlt\n\t\t\t\t\t: colorsV2.stroke.primary,\n\t\t\ttrue:\n\t\t\t\ttype === 'greenred'\n\t\t\t\t\t? colorsV2.background.positive.vibrant\n\t\t\t\t\t: colorsV2.background.brand,\n\t\t};\n\n\t\tconst consolidatedThumbColor: SwitchColorProps = disabled\n\t\t\t? { false: colorsV2.content.inactive, true: colorsV2.content.inactive }\n\t\t\t: {\n\t\t\t\t\tfalse:\n\t\t\t\t\t\tcustomThumbColor?.false ?? type === 'greenred'\n\t\t\t\t\t\t\t? colorsV2.content.negative\n\t\t\t\t\t\t\t: colorsV2.text.primary,\n\t\t\t\t\ttrue: customThumbColor?.true ?? colorsV2.surface.standard,\n\t\t\t };\n\n\t\tconst consolidateOutlineColor: SwitchColorProps = !type\n\t\t\t? { false: colorsV2.stroke.primary, true: colorsV2.stroke.primary }\n\t\t\t: {\n\t\t\t\t\tfalse:\n\t\t\t\t\t\ttype === 'greenred'\n\t\t\t\t\t\t\t? colorsV2.stroke.negative.lightAlt\n\t\t\t\t\t\t\t: colorsV2.stroke.primary,\n\t\t\t\t\ttrue:\n\t\t\t\t\t\ttype === 'greenred'\n\t\t\t\t\t\t\t? colorsV2.stroke.positive.lightAlt\n\t\t\t\t\t\t\t: colorsV2.background.brandLight,\n\t\t\t };\n\n\t\tasync function handlePress() {\n\t\t\tif (disabled) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif (typeof isLoading !== 'boolean') {\n\t\t\t\tsetLoading(true);\n\t\t\t}\n\t\t\ttry {\n\t\t\t\tawait onValueChange?.(!value);\n\t\t\t\tsetValue(!value);\n\t\t\t} catch (err) {\n\t\t\t\tconsole.log(err);\n\t\t\t}\n\t\t\tif (typeof isLoading !== 'boolean') {\n\t\t\t\tsetLoading(false);\n\t\t\t}\n\t\t}\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<SwitchContainer\n\t\t\t\t\tdata-test={dataTest}\n\t\t\t\t\ttrackLength={trackLength ?? 40}\n\t\t\t\t\ttrackHeight={trackHeight ?? 20}\n\t\t\t\t\tonClick={() => handlePress()}\n\t\t\t\t\ttrackColor={consolidatedTrackColor}\n\t\t\t\t\tvalue={value}\n\t\t\t\t\tstyle={containerStyle}\n\t\t\t\t\tborderColor={consolidatedBorderColor}\n\t\t\t\t\tduration={durationTime}\n\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\toutlineColor={consolidateOutlineColor}\n\t\t\t\t>\n\t\t\t\t\t{isloading ? (\n\t\t\t\t\t\t<Loader value={value} trackColor={consolidatedTrackColor} />\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<Thumb\n\t\t\t\t\t\t\tvalue={value}\n\t\t\t\t\t\t\tduration={durationTime}\n\t\t\t\t\t\t\tthumbColor={consolidatedThumbColor}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t</SwitchContainer>\n\t\t\t</>\n\t\t);\n\t},\n);\n\nSwitch.displayName = 'Switch';\n\nexport const SwitchContainer = styled.div<{\n\ttrackLength: number;\n\ttrackHeight: number;\n\ttrackColor: SwitchColorProps;\n\tvalue: boolean;\n\tborderColor: SwitchColorProps;\n\tduration: number;\n\tdisabled?: boolean;\n\toutlineColor: SwitchColorProps;\n}>`\n\tdisplay: flex;\n\tflex-direction: row;\n\tmargin-top: 5px;\n\tmargin-bottom: 5px;\n\tborder-radius: 30px;\n\tbackground-color: red;\n\tbackground-color: ${(props) =>\n\t\tprops.value ? props.trackColor.true : props.trackColor.false};\n\twidth: ${(props) => props.trackLength + 'px'};\n\theight: ${(props) => props.trackHeight + 'px'};\n\tborder-width: ${(props) => (props.disabled ? '0px' : '1px')};\n\tborder-style: solid;\n\tborder-color: ${(props) =>\n\t\tprops.value ? props.borderColor.true : props.borderColor.false};\n\n\ttransition: ${(props) => `${props.duration / 1000}s ease all`};\n\talign-items: center;\n\tcursor: ${(props) => (props.disabled ? 'default' : 'pointer')};\n\t:focus {\n\t\toutline: ${(props) =>\n\t\t\tprops.value ? props.outlineColor.true : props.outlineColor.false};\n\t\toutline-style: solid;\n\t\toutline-offset: 2px;\n\t\toutline-width: 2px;\n\t}\n\t:active {\n\t\toutline: ${(props) =>\n\t\t\tprops.value ? props.outlineColor.true : props.outlineColor.false};\n\t\toutline-style: solid;\n\t\toutline-offset: 2px;\n\t\toutline-width: 2px;\n\t}\n`;\n\nexport const Thumb = styled.div<{\n\tvalue: boolean;\n\tduration: number;\n\tthumbColor: SwitchColorProps;\n}>`\n\theight: 12px;\n\twidth: 12px;\n\tmargin: 4px;\n\tborder-radius: 8px;\n\tposition: relative;\n\tleft: ${(props) => (props.value ? 'calc(100% - 20px)' : '0px')};\n\ttransition: ${(props) => `${props.duration / 1000}s ease all`};\n\tbackground-color: ${(props) =>\n\t\tprops.value ? props.thumbColor.true : props.thumbColor.false};\n`;\n\nexport const Loader = styled.div<{\n\tvalue: boolean;\n\ttrackColor: SwitchColorProps;\n}>`\n\tborder-width: 2px;\n\tborder-style: solid;\n\tborder-color: ${(props) =>\n\t\tprops.value ? props.trackColor.true : props.trackColor.false};\n\tborder-top-width: 2px;\n\tborder-top-style: solid;\n\tborder-top-color: ${(props) =>\n\t\tprops.value ? COLORS.text.white : COLORS.background.brand};\n\tborder-radius: 50%;\n\theight: 8px;\n\twidth: 8px;\n\tmargin: 4px;\n\tposition: relative;\n\tleft: ${(props) => (props.value ? 'calc(100% - 20px)' : '0px')};\n\tanimation: spin 1s linear infinite;\n\t@keyframes spin {\n\t\t0% {\n\t\t\ttransform: rotate(0deg);\n\t\t}\n\t\t100% {\n\t\t\ttransform: rotate(360deg);\n\t\t}\n\t}\n`;\n"],"names":["Switch","forwardRef","_ref","customThumbColor","trackColor","trackHeight","trackLength","disabled","value","propsValue","onValueChange","duration","containerStyle","type","isLoading","dataTest","colorsV2","DEFAULT_THEME","setValue","useState","isloading","setLoading","durationTime","useEffect","consolidatedTrackColor","false","background","inactive","true","_a","negative","light","base","_b","positive","vibrant","brand","consolidatedBorderColor","stroke","lightAlt","primary","consolidatedThumbColor","content","_c","text","_d","surface","standard","consolidateOutlineColor","brandLight","_jsx","SwitchContainer","onClick","err","console","log","handlePress","style","borderColor","outlineColor","children","Loader","Thumb","thumbColor","displayName","_styled","process","env","NODE_ENV","target","label","props","COLORS","white"],"mappings":"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"}

package/dist/esm/components/tabs/Tabs.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tabs.styles.js","sources":["../../../../src/components/tabs/Tabs.styles.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { DEFAULT_THEME } from '@src/constants/Theme';\nimport { ButtonLarge } from '../TypographyStyle';\nimport { TabItemProps, TabItemTextProps } from './Tabs.model';\n\nexport const TabHeader = styled.div<{ bgColor?: string }>`\n\tdisplay: flex;\n\tflex-direction: row;\n\tbackground-color: ${(props) => props.bgColor};\n`;\n\nexport const TabItem = styled.div<TabItemProps>`\n\tdisplay: flex;\n\tflex-direction: row;\n\tcolumn-gap: 8px;\n\tpadding: ${(props) => (props.isSquared ? '8px 24px' : '14px 24px 12px 24px')};\n\tpadding-bottom: ${(props) =>\n\t\tprops.isSquared ? '' : props.selected ? '12px' : '13px'};\n\talign-items: center;\n\tjustify-content: center;\n\twidth: ${(props) => (props.hasEqualSpacing ? '50%' : 'auto')};\n\tborder-bottom-color: ${(props) =>\n\t\tprops.isSquared\n\t\t\t? ''\n\t\t\t: props.selected\n\t\t\t? props.selectedTextColor\n\t\t\t: DEFAULT_THEME.colorsV2.background.inactive};\n\tborder-bottom-width: ${(props) =>\n\t\tprops.isSquared ? '' : props.selected ? '2px' : '1px'};\n\tborder-bottom-style: ${(props) => (props.isSquared ? '' : 'solid')};\n\tborder: ${(props) =>\n\t\tprops.isSquared\n\t\t\t? props.selected\n\t\t\t\t? `1px solid ${props.selectedTextColor}`\n\t\t\t\t: `1px solid ${DEFAULT_THEME.colorsV2.background.inactive}`\n\t\t\t: ''};\n\tflex-direction: row;\n\tcursor: pointer;\n\tmin-width: ${(props) => (props.isSquared ? '120px' : '')};\n\t&:hover {\n\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t}\n\tbackground-color: ${(props) =>\n\t\tprops.isSquared\n\t\t\t? props.selected\n\t\t\t\t? `${DEFAULT_THEME.colorsV2.background.brandLight}`\n\t\t\t\t: ''\n\t\t\t: ''};\n`;\n\nexport const TrailingNumberContainer = styled.div<{\n\tselected: boolean;\n}>`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tgap: 6px;\n\tjustify-content: center;\n\tmin-width: 20px;\n\theight: 20px;\n\tbackground: ${(props) =>\n\t\tprops.selected\n\t\t\t? DEFAULT_THEME.colorsV2.background.inverseLight\n\t\t\t: DEFAULT_THEME.colorsV2.content.secondary};\n\tcolor: ${DEFAULT_THEME.colorsV2.content.primaryInverse};\n\tborder-radius: 10px;\n`;\n\nexport const TabItemText = styled(ButtonLarge)<TabItemTextProps>`\n\tcolor: ${(props) =>\n\t\tprops.selected ? props.selectedTextColor : props.textColor};\n`;\n\nexport const EmptyTab = styled.div`\n\tflex-grow: 1;\n\tborder-bottom: 1px solid ${DEFAULT_THEME.colorsV2.background.inactive};\n`;\n\nexport const RightComponent = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tborder-bottom: 1px solid ${DEFAULT_THEME.colorsV2.background.inactive};\n`;\n"],"names":["TabHeader","_styled","process","env","NODE_ENV","target","label","props","bgColor","TabItem","isSquared","selected","hasEqualSpacing","selectedTextColor","DEFAULT_THEME","colorsV2","background","inactive","brandLight","TrailingNumberContainer","inverseLight","content","secondary","primaryInverse","TabItemText","ButtonLarge","textColor","EmptyTab","RightComponent"],"mappings":"iJAKO,MAAMA,EAASC,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,aAAAL,CAGAM,qDAAAA,GAAUA,EAAMC,SAAON,KAC5C,eAD4CA,QAAAC,IAAAC,SAC5C,GAAA,o+GAEYK,EAAOR,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,WAAAL,CAAA,2DAIPM,GAAWA,EAAMG,UAAY,WAAa,2CACnCH,GAClBA,EAAMG,UAAY,GAAKH,EAAMI,SAAW,OAAS,QAGxCJ,qDAAAA,GAAWA,EAAMK,gBAAkB,MAAQ,QAC7BL,yBAAAA,GACvBA,EAAMG,UACH,GACAH,EAAMI,SACNJ,EAAMM,kBACNC,EAAcC,SAASC,WAAWC,UACdV,yBAAAA,GACvBA,EAAMG,UAAY,GAAKH,EAAMI,SAAW,MAAQ,OAAK,yBAC9BJ,GAAWA,EAAMG,UAAY,GAAK,SAC/CH,YAAAA,GACVA,EAAMG,UACHH,EAAMI,SACL,aAAaJ,EAAMM,~~oBACnB~~,~~aAAaC,~~EAAcC,SAASC,WAAWC,WAChD,IAGUV,iDAAAA,GAAWA,EAAMG,UAAY,QAAU,IAIhCH,oEAAAA,GACpBA,EAAMG,WACHH,EAAMI,~~SACL~~,~~GAAGG,~~EAAcC,SAASC,WAAWE,aAEtC,SACJ,eADMhB,QAAAC,IAAAC,SACN,GAAA,o+GAEYe,EAAuBlB,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,2BAAAL,CAAA,4HAUpBM,GACdA,EAAMI,SACHG,EAAcC,SAASC,WAAWI,aAClCN,EAAcC,SAASM,QAAQC,WAAS,UACnCR,EAAcC,SAASM,QAAQE,uCAExC,eAFsDrB,QAAAC,IAAAC,SAEtD,GAAA,o+GAEYoB,EAAcvB,EAAOwB,EAAW,eAAAvB,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,eAAlBL,CAAmB,UACnCM,GACTA,EAAMI,SAAWJ,EAAMM,kBAAoBN,EAAMmB,WAASxB,KAC3D,eAD2DA,QAAAC,IAAAC,SAC3D,GAAA,o+GAEYuB,EAAQ1B,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,YAAAL,CAAA,uCAEOa,EAAcC,SAASC,WAAWC,SAAQ,KACrE,eADqEf,QAAAC,IAAAC,SACrE,GAAA,o+GAEYwB,EAAc3B,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,kBAAAL,CAAA,2DAGCa,EAAcC,SAASC,WAAWC,SAAQ,KACrE,eADqEf,QAAAC,IAAAC,SACrE,GAAA"}
1	+ {"version":3,"file":"Tabs.styles.js","sources":["../../../../src/components/tabs/Tabs.styles.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { DEFAULT_THEME } from '@src/constants/Theme';\nimport { ButtonLarge } from '../TypographyStyle';\nimport { TabItemProps, TabItemTextProps } from './Tabs.model';\n\nexport const TabHeader = styled.div<{ bgColor?: string }>`\n\tdisplay: flex;\n\tflex-direction: row;\n\tbackground-color: ${(props) => props.bgColor};\n`;\n\nexport const TabItem = styled.div<TabItemProps>`\n\tdisplay: flex;\n\tflex-direction: row;\n\tcolumn-gap: 8px;\n\tpadding: ${(props) => (props.isSquared ? '8px 24px' : '14px 24px 12px 24px')};\n\tpadding-bottom: ${(props) =>\n\t\tprops.isSquared ? '' : props.selected ? '12px' : '13px'};\n\talign-items: center;\n\tjustify-content: center;\n\twidth: ${(props) => (props.hasEqualSpacing ? '50%' : 'auto')};\n\tborder-bottom-color: ${(props) =>\n\t\tprops.isSquared\n\t\t\t? ''\n\t\t\t: props.selected\n\t\t\t? props.selectedTextColor\n\t\t\t: DEFAULT_THEME.colorsV2.background.inactive};\n\tborder-bottom-width: ${(props) =>\n\t\tprops.isSquared ? '' : props.selected ? '2px' : '1px'};\n\tborder-bottom-style: ${(props) => (props.isSquared ? '' : 'solid')};\n\tborder: ${(props) =>\n\t\tprops.isSquared\n\t\t\t? props.selected\n\t\t\t\t? `1px solid ${props.selectedTextColor}`\n\t\t\t\t: `1px solid ${DEFAULT_THEME.colorsV2.background.inactive}`\n\t\t\t: ''};\n\tflex-direction: row;\n\tcursor: pointer;\n\tmin-width: ${(props) => (props.isSquared ? '120px' : '')};\n\t&:hover {\n\t\tbackground-color: rgba(0, 0, 0, 0.03);\n\t}\n\tbackground-color: ${(props) =>\n\t\tprops.isSquared\n\t\t\t? props.selected\n\t\t\t\t? `${DEFAULT_THEME.colorsV2.background.brandLight}`\n\t\t\t\t: ''\n\t\t\t: ''};\n`;\n\nexport const TrailingNumberContainer = styled.div<{\n\tselected: boolean;\n}>`\n\tdisplay: flex;\n\tflex-direction: row;\n\talign-items: center;\n\tgap: 6px;\n\tjustify-content: center;\n\tmin-width: 20px;\n\theight: 20px;\n\tbackground: ${(props) =>\n\t\tprops.selected\n\t\t\t? DEFAULT_THEME.colorsV2.background.inverseLight\n\t\t\t: DEFAULT_THEME.colorsV2.content.secondary};\n\tcolor: ${DEFAULT_THEME.colorsV2.content.primaryInverse};\n\tborder-radius: 10px;\n`;\n\nexport const TabItemText = styled(ButtonLarge)<TabItemTextProps>`\n\tcolor: ${(props) =>\n\t\tprops.selected ? props.selectedTextColor : props.textColor};\n`;\n\nexport const EmptyTab = styled.div`\n\tflex-grow: 1;\n\tborder-bottom: 1px solid ${DEFAULT_THEME.colorsV2.background.inactive};\n`;\n\nexport const RightComponent = styled.div`\n\tdisplay: flex;\n\talign-items: center;\n\tborder-bottom: 1px solid ${DEFAULT_THEME.colorsV2.background.inactive};\n`;\n"],"names":["TabHeader","_styled","process","env","NODE_ENV","target","label","props","bgColor","TabItem","isSquared","selected","hasEqualSpacing","selectedTextColor","DEFAULT_THEME","colorsV2","background","inactive","brandLight","TrailingNumberContainer","inverseLight","content","secondary","primaryInverse","TabItemText","ButtonLarge","textColor","EmptyTab","RightComponent"],"mappings":"iJAKO,MAAMA,EAASC,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,aAAAL,CAGAM,qDAAAA,GAAUA,EAAMC,SAAON,KAC5C,eAD4CA,QAAAC,IAAAC,SAC5C,GAAA,o+GAEYK,EAAOR,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,WAAAL,CAAA,2DAIPM,GAAWA,EAAMG,UAAY,WAAa,2CACnCH,GAClBA,EAAMG,UAAY,GAAKH,EAAMI,SAAW,OAAS,QAGxCJ,qDAAAA,GAAWA,EAAMK,gBAAkB,MAAQ,QAC7BL,yBAAAA,GACvBA,EAAMG,UACH,GACAH,EAAMI,SACNJ,EAAMM,kBACNC,EAAcC,SAASC,WAAWC,UACdV,yBAAAA,GACvBA,EAAMG,UAAY,GAAKH,EAAMI,SAAW,MAAQ,OAAK,yBAC9BJ,GAAWA,EAAMG,UAAY,GAAK,SAC/CH,YAAAA,GACVA,EAAMG,UACHH,EAAMI,SACL,aAAaJ,EAAMM,iCACNC,EAAcC,SAASC,WAAWC,WAChD,IAGUV,iDAAAA,GAAWA,EAAMG,UAAY,QAAU,IAIhCH,oEAAAA,GACpBA,EAAMG,WACHH,EAAMI,YACFG,EAAcC,SAASC,WAAWE,aAEtC,SACJ,eADMhB,QAAAC,IAAAC,SACN,GAAA,o+GAEYe,EAAuBlB,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,2BAAAL,CAAA,4HAUpBM,GACdA,EAAMI,SACHG,EAAcC,SAASC,WAAWI,aAClCN,EAAcC,SAASM,QAAQC,WAAS,UACnCR,EAAcC,SAASM,QAAQE,uCAExC,eAFsDrB,QAAAC,IAAAC,SAEtD,GAAA,o+GAEYoB,EAAcvB,EAAOwB,EAAW,eAAAvB,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,eAAlBL,CAAmB,UACnCM,GACTA,EAAMI,SAAWJ,EAAMM,kBAAoBN,EAAMmB,WAASxB,KAC3D,eAD2DA,QAAAC,IAAAC,SAC3D,GAAA,o+GAEYuB,EAAQ1B,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,YAAAL,CAAA,uCAEOa,EAAcC,SAASC,WAAWC,SAAQ,KACrE,eADqEf,QAAAC,IAAAC,SACrE,GAAA,o+GAEYwB,EAAc3B,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,kBAAAL,CAAA,2DAGCa,EAAcC,SAASC,WAAWC,SAAQ,KACrE,eADqEf,QAAAC,IAAAC,SACrE,GAAA"}

package/dist/esm/components/tag/Tag.js CHANGED Viewed

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

package/dist/esm/components/tag/Tag.js.map CHANGED Viewed

	@@ -1 +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","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","Object","assign","className","Tooltip","onClick","id","React","createElement","AiBodyTiny","AiBodyCaption","BodyTiny","BodyCaption","displayName"],"mappings":"~~8VAYO~~,~~MAAMA~~,~~EAAMA~~,~~EAClBC~~,~~UACAC~~,~~cACAC~~,~~eACAC~~,~~uBACAC~~,~~gBACAC~~,~~iBACAC~~,~~wBACAC~~,~~QAAQ~~,~~QACRC~~,~~OAAO~~,~~UACPC~~,~~UAAU~~,~~UACVC~~,~~UACAC~~,~~SACAC~~,~~YACAC~~,~~WACAC~~,~~cACAC~~,~~iBACAC~~,~~qBACAC~~,~~sBACAC~~,~~WACAC~~,~~gBACAC~~,~~kBACAC~~,~~eACAC~~,~~OAAO~~,~~cAEP~~,~~IAAIC~~,EAAiBvB,EACrB,MAAMwB,EAAejB,EACrB,IAAIkB,EAAcjB,EAEbkB,EAAgBjB,GAASD,KAC7BiB,EAAc,WAGC,WAAZhB,GAC2B,iBAAnBc,GAA+BA,EAAiB,KAC1DA,EAAiB,OAInB,MACMI,EAAY,CACjBC,OAAoB,eAAZnB,EAA2B,GAAK,GACxCoB,MAAmB,eAAZpB,EAA2B,GAAK,GACvCqB,MAJiBC,EAAgBxB,EAAOkB,GAKxCO,MAAO,CAAEC,QAAS,UAGnB,OACCC,EAACC,iBACAxB,OAAQA,EACRJ,MAAOiB,EACPhB,KAAMiB,EACNhB,QAASA,EACTC,QAASA,EACTE,UAAWA,EACXC,SAAUA,EACVE,eAAgBA,EAChBK,gBAAiBA,EACjBC,aAAcA,EACdC,KAAMA,GAEN,CAAAc,SAAAC,EAAA,MAAAC,OAAAC,OAAA,CAAKC,UAAU,aAAW,CAAAJ,SAAA,CACxBnC,IACCe,EACAkB,EAACO,EAAOH,OAAAC,OAAA,CAAA,EAAKvB,EAAkB,CAAAoB,SAC9BF,0BACCM,UAAU,eACVE,QAASvC,EACTwC,~~GAAI~~,~~GAAGvC,~~aAA2B,wBAAsB,CAAAgC,SAEvDQ,EAAMC,cAAc5C,iCACjB0B,GAAS,CACZgB,GAAIvC,GAAiB,wBAKxB8B,EAAA,SAAAI,OAAAC,OAAA,CACCC,UAAU,eACVE,QAASvC,EACTwC,GAAI,GAAGvC,aAA2B,wBAAsB,CAAAgC,SAEvDQ,EAAMC,cAAc5C,EAAWqC,OAAAC,OAAAD,OAAAC,OAAA,GAC5BZ,GACH,CAAAgB,GAAIvC,GAAiB,sBAKxBU,IACU,OAATN,GAA2B,UAAVD,EAEhB2B,EADQ,UAATZ,EACEwB,EAIAC,EAJUT,OAAAC,OAAA,CAACpB,cAAeA,GACzB,CAAAiB,SAAAtB,KAQHoB,EADY,UAATZ,EACF0B,EAIAC,iBAJST,UAAU,OAAOrB,cAAeA,GAAa,CAAAiB,SACrDtB,OAQFA,GACkB,KAAnBS,IACU,OAATf,GAA2B,UAAVD,EAEhB2B,EADQ,UAATZ,EACEwB,EAIAC,EAJWT,OAAAC,OAAA,CAAApB,cAAeA,GAAa,CAAAiB,SACtCb,KAQHW,EADY,UAATZ,EACF0B,EAQAC,EARQX,OAAAC,OAAA,CACRC,UAAU,OACVV,MAAOZ,EACPC,cAAeA,GAAa,CAAAiB,SAE3Bb,MAYHrB,IACCe,EACAiB,EAACO,EAAYH,OAAAC,OAAA,CAAA,EAAAtB,EACZ,CAAAmB,SAAAF,EAAA,SAAAI,OAAAC,OAAA,CACCC,UAAU,gBACVE,QAASpC,EACTqC,GAAI,GAAGtC,aAA4B,yBAElC,CAAA+B,SAAAQ,EAAMC,cAAc3C,EAAYoC,OAAAC,OAAAD,OAAAC,OAAA,GAC7BZ,GACH,CAAAgB,GAAItC,GAAkB,yBAKzB6B,EACC,SAAAI,OAAAC,OAAA,CAAAC,UAAU,gBACVE,QAASpC,EACTqC,~~GAAI~~,~~GAAGtC~~,aAA4B,yBAElC,CAAA+B,SAAAQ,EAAMC,cAAc3C,EACjBoC,OAAAC,OAAAD,OAAAC,OAAA,GAAAZ,IACHgB,GAAItC,GAAkB,6BAKnB,~~EAIXN~~,~~EAAImD~~,YAAc"}
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","Object","assign","className","Tooltip","onClick","id","React","createElement","AiBodyTiny","AiBodyCaption","BodyTiny","BodyCaption","displayName"],"mappings":"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"}

package/dist/esm/components/tag/Tag.styled.js.map CHANGED Viewed

	@@ -1 +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","_styled","process","env","NODE_ENV","target","label","props","_a","cursor","size","variant","alignIcon","contentPadding","getPadding","backgroundColor","getBackgroundColor","theme","type","undefined","borderRadius","noBorder","version","generateBorder","getTextColor"],"mappings":"2IASO,MAAMA,EAAGC,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,YAAA,CAAAA,OAAA,WAAAC,MAAA,OAAAL,CAAA,WAaJM,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,EAAWP,EAAMI,UACNJ,gBAAAA,IAAS,IAAAC,EACvB,OAAqB,QAArBA,EAAAD,EAAMQ,uBAAe,IAAAP,EAAAA,EAAIQ,EAAmBT,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,EACvDhB,EAAMW,KACNX,EAAMU,4BAIGV,GAAUiB,EAAajB,EAAMU,MAAOV,EAAMW,OAAKhB,oFAa3D,eAb2DA,QAAAC,IAAAC,SAa3D,GAAA"}
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","_styled","process","env","NODE_ENV","target","label","props","_a","cursor","size","variant","alignIcon","contentPadding","getPadding","backgroundColor","getBackgroundColor","theme","type","undefined","borderRadius","noBorder","version","generateBorder","getTextColor"],"mappings":"2IASO,MAAMA,EAAGC,QAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,YAAA,CAAAA,OAAA,WAAAC,MAAA,OAAAL,CAAA,WAaJM,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,EAAWP,EAAMI,UACNJ,gBAAAA,IAAS,IAAAC,EACvB,OAAqB,QAArBA,EAAAD,EAAMQ,uBAAe,IAAAP,EAAAA,EAAIQ,EAAmBT,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,EACvDhB,EAAMW,KACNX,EAAMU,4BAIGV,GAAUiB,EAAajB,EAAMU,MAAOV,EAAMW,OAAKhB,oFAa3D,eAb2DA,QAAAC,IAAAC,SAa3D,GAAA"}

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

	@@ -1 +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":["TemplateContextMapper","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","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":"i8BAgHaA,MAAAA,EAAyBC,wBACrC,MAAMC,iBACLA,EAAgBC,YAChBA,EAAWC,oBACXA,EAAmBC,QACnBA,EAAOC,YACPA,EAAWC,kBACXA,EAAiBC,iBACjBA,EAAgBC,mBAChBA,EAAkBC,gBAClBA,EAAeC,2BACfA,EAA0BC,OAC1BA,EAAMC,kBACNA,EACAC,aAAcC,EAAqBC,aACnCA,EAAYC,gBACZA,EAAeC,YACfA,EAAWC,kBACXA,EAAiBC,qBACjBA,EAAoBC,iBACpBA,EAAgBC,oBAChBA,EAAmBC,IACnBA,EAAGC,OACHA,EAAMC,WACNA,EAAUC,yBACVA,GAAwBC,kBACxBA,GAAiBC,UACjBA,GAASC,yBACTA,GAAwBC,SACxBA,GAAQC,YACRA,GAAWC,6BACXA,GAA4BC,aAC5BA,GAAYC,wBACZA,GAAuBC,2BACvBA,GAA0BC,kBAC1BA,GAAiBC,gBACjBA,GAAeC,sBACfA,GAAqBC,2BACrBA,GAA0BC,iBAC1BA,GAAgBC,eAChBA,GAAcC,kBACdA,IACGzC,EAEJ0C,GAAU,KACTC,GAAkBtC,EAAY,GAC5B,CAACA,IACJ,MAAMuC,GAAYC,EAAmBzC,GAC/B0C,GAAqBC,EAC1B3C,EACAH,GAGK+C,GAAyB/C,aAAA,EAAAA,EAC5B+C,uBACIC,GAAQC,IAAaC,EAC3B/C,IAAYgD,EAAaC,OACxBjD,GAAWgD,EAAaE,SACxBR,GACE,UACA,WAEGS,GAAoBC,IAAyBL,GAAkB,IAC/DM,GAAiBd,IAAqBQ,EAC5C9C,IAEMqD,GAASC,IAAcR,GAAkB,IACzCS,GAAcC,IAAmBV,EAAmB,KACpDW,GAAsBC,IAA2BZ,EAGrD,CAAE,IACEa,GAAUC,IAAed,EAA2BlD,IACpDiE,GAAYC,IAAiBhB,EAAmB,KAChDiB,GAAkBC,IAAuBlB,EAAS,OAClDmB,GAA2BC,IACjCpB,GAAS,IACHqB,GAAsBC,IAC5BtB,EAA+B7C,QAAAA,EAAqB,KAC9CoE,GAA4BC,IAClCxB,GAAS,IACHyB,GAAuBC,IAA4B1B,EACzDL,IAA+C,QAAzBgC,EAAiB,UAAjBd,cAAA,EAAAA,GAAUe,eAAO,IAAAC,OAAA,EAAAA,EAAEC,YAAM,IAAAH,OAAA,EAAAA,EAAAI,SAAU,EAAI,GAAM,IAE7DC,GAAkBC,IAAuBjC,EAC/C,KAEMtC,GAAcwE,IAAmBlC,OAEtCmC,GAEIC,GAAYC,EAAO,OAElBC,GAAmBC,IAAwBvC,GAAS,IACpDwC,GAAiBC,IAAsBzC,GAAS,IAChD0C,GAAkBC,IAAuB3C,GAAS,IAClD4C,GAAkBC,IAAuB7C,GAAS,IAClD8C,GAAYC,IAAiB/C,GAAS,IACtCgD,GAAkBC,IAAuBjD,EAAS,CAAE,IACpDkD,GAAmBC,IAAwBnD,EAAiB,IAEnET,GAAU,KACLjB,GACH2D,GAAoB3D,IACVuB,IACVoC,GAAoB,GACpB,GACC,CAAC3D,KAEJiB,GAAU,WACT,IACE4B,IACDtB,MACEvB,IAA2D,IAA/B2D,GAAoBF,QACjD,CACD,MAAMqB,EAA0D,QAAjDvB,EAAAhB,cAAQ,EAARA,GAAuCwC,kBAAU,IAAAxB,OAAA,EAAAA,EAC/DpC,IACC2D,MACIE,EAAmB,GACzBF,SAAAA,EAAOG,SAASC,UACC,QAAhB3B,EAAA2B,aAAI,EAAJA,EAAMH,kBAAU,IAAAxB,GAAAA,EAAE0B,SAASE,cACR,WAAdA,EAAKC,MACRJ,EAAOK,KAAyC,QAApCC,EAA8B,QAA9BjC,EAAY,UAAZ8B,EAAKI,eAAO,IAAAhC,OAAA,EAAAA,EAAEiC,qBAAgB,IAAAnC,OAAA,EAAAA,EAAA,UAAM,IAAAiC,EAAAA,EAAA,GAChD,GACA,IAEH5C,GAAcsC,GACdlC,IAA6B,EAC7B,IACC,CAACD,KA6FJ,MAAM4C,GAA+BC,GACpC,IAAMC,EAAiC5G,IACvC,CAACA,IAOF,OAJAkC,GAAU,KACT2C,GAAgBgC,EAAUvG,GAAuB,GAC/C,CAACA,KAGH2B,cAAA,EAAAA,GAAmB6E,OACnBvB,IACAtD,GAAkB8E,iBAClBC,OAAOC,OAAOC,GAAkBC,MAC9BC,GAAUA,IAAUC,OAAOpF,GAAkB8E,mBAK9CO,EAACC,EAA0B,CAC1BC,aAAchE,cAAQ,EAARA,GAAUiE,MACxBC,gBACC9H,IAAYgD,EAAa+E,SACtB,GAAGC,EAAYC,8BACO,QAAtBtB,EAAA/C,cAAA,EAAAA,GAAUsE,gBAAY,IAAAvB,EAAAA,EAAA,SACqC,QAAnDwB,EAAAvE,cAAA,EAAAA,GAA+BwE,wBAAoB,IAAAD,EAAAA,EAAA,KAC3D,GAEJ9F,kBAAmBA,GACnBgG,cAAehG,GAAkBiG,KACjCC,QAASA,KACRzI,SAAAA,IACA8F,IAAoB,GACpBE,IAAc,EAAM,EAErB0C,SAAUA,KACT5C,IAAoB,GACpBE,IAAc,EAAM,EAErB2C,UAAWA,KACV7C,IAAoB,GACpBE,IAAc,EAAK,EAEpB4C,YAAY9E,cAAA,EAAAA,GAAU8E,aAAc,KAMtChB,EAACiB,EAAqBC,SAAQxB,OAAAyB,OAAA,CAC7BrB,MAAO,CACN/B,oBACAC,uBACAH,mBACAC,sBACA/E,gBACAwE,mBACAjB,oBACAC,uBACAd,sBACAC,yBACAQ,YACAC,eACAhB,UACAC,aACAO,mBACAd,qBACA6B,wBACAC,2BACAf,WACAC,cACAvD,UACA8G,gCACAxC,8BACAC,iCACAzD,oBACAG,sBACAC,MACAC,SACAuB,sBACA8B,yBACAC,4BACA7B,yBACAc,wBACAoF,UAAWpG,GAGD,QAFPqG,EAAyD,QAAzDC,EAACnJ,EAA8CuG,kBAAU,IAAA4C,OAAA,EAAAA,EACzDxG,IACE2D,aAAK,IAAA4C,OAAA,EAAAA,EAAEjE,YACTI,EACH1B,gBACAC,mBACArC,aACA2D,oBACAC,uBACA1D,qBACAC,aACAuC,cACAtC,4BACAG,gCACAwD,aACAE,qBACAC,wBACA1D,gBACAmE,oBACAC,uBACAnE,2BACAoE,qBACAC,wBACAnE,qBACAC,mBACAC,yBACAC,8BACAM,eACA,CAAAyG,SAEA5I,EACAqH,EAACwB,EAA0B,CAC1BxI,sBAAuBA,EACvBV,QAASgD,EAAaC,MACtBkG,YAAU,IAGXC,EAACC,EAAWjC,OAAAyB,OAAA,CACXtD,gBAAiBA,GACjBhF,OAAQA,EACR+I,uBAAwB,CACvBC,MAAO7G,GACJ,IACA1C,IAAYgD,EAAaC,OAASlD,EAClC,IACA,KAEJyJ,KAAM3D,GACN0C,QAASA,KACRzC,IAAc,GACdhG,SAAAA,GAAe,EAEhB8H,aAAchE,cAAQ,EAARA,GAAUiE,MACxBC,gBACC9H,IAAYgD,EAAa+E,UAAY0B,EAAazJ,GAC/C,GAAGgI,EAAYC,8BACO,QAAtByB,EAAA9F,cAAA,EAAAA,GAAUsE,gBAAY,IAAAwB,EAAAA,EAAA,SACqC,QAAnDC,EAAA/F,cAAA,EAAAA,GAA+BwE,wBAAoB,IAAAuB,EAAAA,EAAA,KAC3D,GAEJ9I,YAAaA,KACZ,GAAIwB,gBAAAA,GAAmB6E,KAGtB,OAFAtB,IAAoB,QACpBE,IAAc,GAGfjF,SAAAA,GAAe,EAEhB+I,kBAAmB,CAClBC,aAAc,aAAaC,EAAOC,OAAOC,YAG1C,CAAAf,SAAA,CAAAvB,EAACwB,EACA,CAAAxI,sBAAuBA,EACvBM,iBAAkBA,EAClBjB,oBAAqBA,EACrBC,QAASA,EACTM,2BAA4BA,EAC5BE,kBAAmBA,EACnBG,aAAcA,EACdC,gBAAiBA,EACjBG,qBACCA,IAAwBA,eAAAA,EAAsB+D,QAAS,EACpD/D,EACAN,GAEJgB,SAAUA,GACVC,YAAcuI,IACbvI,UAAAA,GAAcuI,EAAK,EAEpBnI,2BAA4BA,KAE5B3B,EACAuH,EAACwC,GACAxH,mBAAoBA,UAAAA,GACpByH,SAvON,mBAGC,GAFAjE,GAAqB,KAEjBnB,cAAA,EAAAA,GAAkBD,QAAS,GAAKlC,GAEnC,YADAW,IAAW,GAMZ,GAAI6D,OAAOgD,KAAKrE,IAAkBjB,OAAS,GAAK5D,IAAQmJ,EAAIC,QAE3D,YADA/G,IAAW,GAIZ,GAAIX,KAAsD,QAA5BgC,EAAAG,cAAgB,EAAhBA,GAAkBD,cAAU,IAAAF,EAAAA,EAAA,GAAK,EAAG,CACjE,MAAM2F,EAxDR,SACCC,EACAC,EACAC,2BAEA,MAAMvE,EAA2C,QAAnCzB,EAA+B,QAA/BE,EAAA4F,aAAgB,EAAhBA,EAAkBpE,kBAAa,IAAAxB,OAAA,EAAAA,EAAA8F,UAAI,IAAAhG,OAAA,EAAAA,EAAEyB,MACnD,KAAKA,aAAA,EAAAA,EAAOrB,WAAW2F,eAAAA,EAAU3F,QAAQ,MAAO,GAEhD,MAAM6F,EACqD,QAA1D5B,EAAoD,QAApDC,UAAAb,EAAU,QAAVxB,EAAAR,EAAM,UAAI,IAAAQ,OAAA,EAAAA,EAAAP,iCAAYmB,MAAMqD,GAAiB,SAAXA,EAAEnE,cAAgB,IAAAuC,OAAA,EAAAA,EAAE6B,YAAI,IAAA9B,EAAAA,EAAI,GAC/D,IAAK4B,EAAc,MAAO,GAE1B,MAAMG,EAA6D,QAA/CC,EAAuC,QAAvCC,EAAmC,UAAV,QAAzBtB,EAAAc,aAAA,EAAAA,EAAkB7F,eAAO,IAAA+E,OAAA,EAAAA,EAAEvD,aAAQ,IAAAwD,OAAA,EAAAA,EAAA,UAAI,IAAAqB,OAAA,EAAAA,EAAAnG,YAAQ,IAAAkG,EAAAA,EAAA,GACnE,IAAKD,EAAYhG,OAAQ,MAAO,GAEhC,MAAMmG,EACL,CACC,mBAAoB,cACpB,0BAA2B,sBAG7B,IAAK,MAAMC,KAAWT,EAAU,CAC/B,IAAIU,EAAeR,EACnB,IAAK,IAAIS,EAAI,EAAGA,EAAIN,EAAYhG,OAAQsG,IAAK,CAC5C,MAAMC,EAAiBP,EAAYM,GAC7BE,EAAeL,EAAqBI,GAC1C,QAAqBnG,IAAjBoG,EAA4B,SAChC,MAAM9D,EAAQ0D,EAAQI,GACtB,IAAK9D,EACJ,MAAO,YAAY6D,6BAA0CH,EAAQK,gBAEtEJ,EAAeA,EAAaK,QAAQ,KAAKJ,EAAI,MAAO5D,EACpD,CACD,GAAI2D,EAAarG,OAAS,IACzB,MAAO,0EAER,CACD,MAAO,EACR,CAkBkB2G,CACf7H,GACAmB,GACAvC,IAED,GAAI+H,EAGH,OAFArE,GAAqBqE,QACrBhH,IAAW,EAGZ,CAED,MAAMmI,EAAQvL,aAAA,EAAAA,EACbyD,GACAQ,GACAf,SAAAA,GAAmB,GACnB0B,IAGDpB,GAC4B,UAA3B+H,aAAA,EAAAA,EAAOhI,4BAAoB,IAAAgB,EAAAA,EAAI,CAAEG,KAAM,GAAI8G,QAAS,MAGjDD,aAAK,EAALA,EAAOlI,gBAAgBkI,aAAK,EAALA,EAAOA,SAC7BA,eAAAA,EAAOlI,eACVC,GAAgBiI,EAAMlI,eAEnBkI,eAAAA,EAAOA,QACVnI,MAAamI,aAAK,EAALA,EAAOA,SAGrBnH,IAA8B,EAEhC,EAuLMpC,iBAAkBA,GAClBC,eAAgBA,KAGjBsF,EAAAkE,EAAA,CAAA,SAI4B"}
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":["TemplateContextMapper","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","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/esm/components/template-context-mapper/helpers/WebpushTemplateHelper.js.map CHANGED Viewed

	@@ -1 +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":"0UAeMA,MAAAA,EAAqBA,KA2H1B,SAASC,EACRC,EACAC,EACAC,EACAC,GAEA,MAAMC,EAAiBH,EACrBI,KAAI,CAACC,EAAMC,KACX,MAAMC,EAAaC,EAAcH,GAGjC,GAAIH,EACH,MAAO,CACNO,aAAcJ,EACdK,oBAAoB,EACpBC,aAAcN,EACdO,MAAON,EACPO,cAAeR,EACfS,KAAM,UAIR,MAAMC,EAgET,SACCC,EACAC,EACAC,GAEA,MAAMC,EACLD,GAAaA,EAAUE,OAASF,EAAYG,EAAiBL,GAC9D,IAAKG,IAAYA,EAAQC,OACxB,MAAO,GAER,MAAMrB,EAAmC,GAmBzC,OAlBAoB,EAAQG,SAAQ,CAACC,EAAOX,KACvB,MAAMY,EAAeC,EACpBR,EACA,KAAKM,OAEN,GAAIC,EAAc,CACjB,MAAME,YAAEA,EAAWC,aAAEA,GAAiBH,EAC/BI,EACU,oBAAhBF,GAAqD,mBAAhBA,EACtC3B,EAAa8B,KAAK,CACjBC,SAAUF,EACVG,YAAaJ,EACbK,sBAAuBL,EACvBlB,aAAciB,EACdpB,IAAKM,GAEN,KAEKb,CACR,CA9FuBkC,CAbI1B,EAAaF,EAAOJ,EAe3CF,GAGD,GAAIgB,EAAYK,OAAS,EAAG,CAC3B,MAAMG,EAAQR,EAAY,GAC1B,MAAO,CACNN,aAAcc,EAAMd,aACpBC,oBAAoB,EACpBC,cAAcY,aAAA,EAAAA,EAAsB,cACjCA,eAAAA,EAAsB,aACtBhB,EACAgB,EAAMd,aACNJ,EACHO,MAAON,EACPO,cAAeU,EAAMQ,YACrBjB,KAAM,SAEP,CAED,OAAO,IAAI,IAEXoB,QAAQC,GAAoB,OAAVA,IAEpB,OAAOhC,CACR,CAiBA,MAAMK,EAAiBQ,GACfA,EAAKoB,SAAS,OAASpB,EAAKoB,SAAS,MAGvCC,EAAkCA,CACvCrB,EACAsB,IAEKtB,GAASA,EAAKI,OACZJ,EAAKuB,SAAQ,CAAClC,EAAMO,WAC1B,OAAKJ,EAAcH,GAGdA,EAAK+B,SAAS,qBACY,QAAtBI,EAAAF,aAAA,EAAAA,EAAgB1B,UAAM,IAAA4B,OAAA,EAAAA,EAAEC,QAASpC,EAElCgB,EAAiBhB,GAAMD,KAAKC,GAAS,KAAKA,SAAa,GALvDA,CAMP,IATgC,GA4CnC,MAAMoB,EAA4BA,CACjCR,EACAyB,KAEA,IAAK,MAAMC,KAAe1B,EACzB,IAAK,MAAM2B,KAAOD,EAAYE,UAAW,CACxC,MAAMC,EAAeH,EAAYE,UAAUD,GAK3C,GAHCE,EAAapB,cAAgBgB,GAC5BA,EAAkBN,SAAS,qBAC3BU,EAAapB,YAAYU,SAAS,eAEnC,OAAOU,CAER,CAEF,OAAO,IAAI,EAYZ,MAAO,CACNC,uBA5QD,SACCC,EACAjD,EACAkD,EACA/C,gEAEA,MAAMgD,EAAaC,OAAAC,OAAA,CAAA,EAAQJ,GAC3BE,EAAcG,WAqKf,SAAyBC,GACxB,IAAID,EACJ,GAA6B,iBAAlBC,EACV,IACCD,EAAaE,KAAKC,MAAMF,EACxB,CAAC,MAAOG,GACRC,QAAQD,MAAM,wCAAyCA,GACvDJ,EAAa,CAAA,CACb,MAEDA,EAAaC,EAEd,OAAOD,CACR,CAlL4BM,CAAgBT,EAAcG,YAEzD,MACCA,YAAYO,MAAEA,EAAKC,KAAEA,EAAIC,QAAEA,EAAOC,KAAEA,EAAIC,MAAEA,GAAOC,uBACjDA,GACGf,EACJ,IAAIgB,EAAe,CAClBN,MAAOvB,EACuB,QAA7BG,EAAAyB,aAAsB,EAAtBA,EAAwBL,aAAK,IAAApB,EAAAA,EAAI,IAElCqB,KAAMxB,EAC2B,QAAhC8B,EAAAF,eAAAA,EAAwBJ,YAAQ,IAAAM,EAAAA,EAAA,GAChCN,aAAA,EAAAA,EAAMhB,WAEPuB,SAAyC,QAA/BC,EAAAJ,eAAAA,EAAwBH,eAAO,IAAAO,EAAAA,EAAI,IAG9C,IAAKnB,EAAce,uBAAwB,CAC1C,MAAMK,EACS,QAAdC,EAAAV,aAAA,EAAAA,EAAM7C,YAAQ,IAAAuD,EAAAA,EAAiB,iBAATV,EAAoBA,EAAO,GAC5CW,EACLV,IAAWA,aAAA,EAAAA,EAAS1C,QACjB0C,EACC1D,KAAKqE,IACLA,aAAA,EAAAA,EAAQC,cAAeC,EACpBF,aAAA,EAAAA,EAAQG,gBACRH,eAAAA,EAAQC,cAEXxC,QAAQ2C,QAAkCC,IAATD,IAClC,GACEE,EAAgB1D,EAAiBiD,GAAelE,KACrD,CAACC,EAAMO,aACN,OAAIP,EAAK+B,SAAS,6BACV+B,UAAA3B,EAAAqB,aAAA,EAAAA,EAAMhB,gCAAYjC,yBAAQ6B,QAASpC,EAEpC,KAAKA,KAAQ,IAGtB6D,EAAe,CACdN,MAAOvC,EAAiBuC,GAAOxD,KAAKC,GAAS,KAAKA,QAClDwD,KAAMkB,EACNX,SAAU,IAEX,MAAMY,EAAmB,CACxBpB,cAAOqB,EAAAf,EAAaN,qBAAS,GAC7BC,aAAMqB,EAAAhB,EAAaL,oBAAQ,GAC3BC,QAASU,EACTT,KAAMA,EAAO,CAACA,QAAQe,EACtBd,MAAOA,EAAQ,CAACA,QAASc,EACzBF,iBAAiBf,eAAAA,EAAMe,iBAAkB,CAACf,aAAI,EAAJA,EAAMe,iBAAmB,IAEpE1B,EAAce,uBAAyBe,CACvC,CAED,MAAMG,EACLrB,GAAWA,EAAQ1C,OAChB0C,EAAQ1D,KAAI,CAACqE,EAAQ7D,KAAW,CAChCE,KAAMsE,EAAYC,IAClBrE,KAAMyD,aAAA,EAAAA,EAAQzD,KACdsE,IAAK,yBACLC,QACCrB,EAAaE,UAAYF,EAAaE,SAAShD,OAC5CZ,EAAc0D,EAAaE,SAASxD,IACnC,CAAC,IACD,CAACsD,EAAaE,SAASxD,IACxB6D,EAAOG,gBACP,CAACH,EAAOG,sBACRE,EACJU,eACCtB,EAAaE,UAAYF,EAAaE,SAAShD,OAC5CZ,EAAc0D,EAAaE,SAASxD,IACnCsD,EAAaE,SAASxD,GACtB6E,EACDhB,EAAOC,YACPD,EAAOC,aAAeC,EACrBc,EACAhB,EAAOC,YACRe,EACJ7E,YAEA,GACE8E,EAA0B,CAC/B9B,MAAO9D,EACNC,EACAmE,EAAaN,MACbA,EACA1D,GAED2D,KAAM/D,EACLC,EACAmE,EAAaL,MACbA,eAAAA,EAAM7C,OAAQ,GACdd,GAED4D,QAASqB,GAEV,MAAO,CACNO,wBAAyB,CACxB9B,OAA6B,QAAtB+B,EAAA1C,aAAA,EAAAA,EAAqB,aAAC,IAAA0C,OAAA,EAAAA,EAAEvE,QAC5B6B,EAAmB,MAClByC,EAAwB9B,MAE5BC,MAA2B,QAArB+B,EAAA3C,aAAA,EAAAA,EAAoB,YAAC,IAAA2C,OAAA,EAAAA,EAAExE,QAC1B6B,EAAkB,KACjByC,EAAwB7B,KAE5BC,QAAS4B,EAAwB5B,QACjCC,KAAM,GACN8B,OAAQ,IAET5B,uBAAwBf,EAAce,uBACtCjB,SAAUE,KAEX,EAqJA4C,WAXmBR,IACnB,IAEC,OADA,IAAID,IAAIC,IACD,CACP,CAAC,MAAO7B,GACR,OAAO,CACP,GAMD"}
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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"}

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

	@@ -1 +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","Body","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","Object","assign","MobilePreview","ref","WEBPUSH","TemplatePreview","hideHeader","MESSAGE","DesktopPreview","_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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"}
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","Body","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","Object","assign","MobilePreview","ref","WEBPUSH","TemplatePreview","hideHeader","MESSAGE","DesktopPreview","_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/esm/components/template-context-mapper/modalElements/DesktopPreview.js CHANGED Viewed

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

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

	@@ -1 +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","~~display_content~~","~~showSampleValues~~","~~previewRef~~","_jsxs","Object","assign","ref","_jsx","children","TemplatePreview","channel","CHANNEL_TYPE","EMAIL","hideHeader","emailSpecificMeta","emailDisplayContent","hideViewButtonForEmail","emailHtmlContainerId","containerStyle","height","templateContainerStyles","hidePointerEvents","style","padding","Spinner","size","displayName"],"mappings":"qWAOA,MAAMA,EAAYC,EAAOC,GAAG;eACbC,EAAOC,QAAQC;qBACTF,EAAOG,OAAOC;;;;;;EAQ7BC,EAAgBP,EAAOC,GAAG;;;;;wBAKRC,EAAOG,OAAOC;EAGhCE,EAAMR,EAAOC,GAAG;;;;;EAOhBQ,EAAiBC,EAAMC,YAG3B,~~EAAGC~~,~~kBAAiBC~~,~~oBAAoBC~~,~~IAExCC~~,~~EAAChB~~,~~EAASiB~~,OAAAC,OAAA,CAACC,~~IAAKJ~~,~~cACfC~~,~~EAACR~~,~~aACAY~~,~~EAACX~~,~~MACDW~~,~~EAACX~~,EAAM,CAAA,~~GACPW~~,~~EAACX~~,EAAM,CAAA,~~MAERW~~,EACE,MAAA,CAAAC,~~SAAAR~~,~~EACAO~~,EAACE,~~GACAR~~,iBAAkBA,~~EAClBS~~,QAASC,EAAaC,MACtBC,YACA,EAAAC,kBAAmB,CAClBC,~~oBAAqBf~~,~~EACrBgB~~,wBAAwB,EACxBC,qBAAsB,wBACtBC,eAAgB,CACfC,OAAQ,KAETC,wBAAyB,CACxBD,OAAQ,SAGVE,mBAAmB,IAGpBd,EAAA,MAAAH,OAAAC,OAAA,CAAKiB,MAAO,CAAEC,QAAS,KACtB,CAAAf,SAAAD,EAACiB,EAAO,CAACC,KAAK,~~qBAOpB5B~~,~~EAAe6B~~,YAAc"}
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","_jsx","children","TemplatePreview","channel","CHANNEL_TYPE","EMAIL","hideHeader","emailSpecificMeta","emailDisplayContent","hideViewButtonForEmail","emailHtmlContainerId","containerStyle","height","templateContainerStyles","hidePointerEvents","style","padding","Spinner","size","displayName"],"mappings":"qWAOA,MAAMA,EAAYC,EAAOC,GAAG;eACbC,EAAOC,QAAQC;qBACTF,EAAOG,OAAOC;;;;;;EAQ7BC,EAAgBP,EAAOC,GAAG;;;;;wBAKRC,EAAOG,OAAOC;EAGhCE,EAAMR,EAAOC,GAAG;;;;;EAOhBQ,EAAiBC,EAAMC,YAG3B,CAAAC,EAAwCC,KAAc,IAArDC,gBAAEA,EAAeC,iBAAEA,GAAkBH,EACvC,OACCI,EAACjB,EAASkB,OAAAC,OAAA,CAACC,IAAKN,cACfG,EAACT,aACAa,EAACZ,MACDY,EAACZ,EAAM,CAAA,GACPY,EAACZ,EAAM,CAAA,MAERY,EACE,MAAA,CAAAC,SAAAP,EACAM,EAACE,GACAP,iBAAkBA,EAClBQ,QAASC,EAAaC,MACtBC,YACA,EAAAC,kBAAmB,CAClBC,oBAAqBd,EACrBe,wBAAwB,EACxBC,qBAAsB,wBACtBC,eAAgB,CACfC,OAAQ,KAETC,wBAAyB,CACxBD,OAAQ,SAGVE,mBAAmB,IAGpBd,EAAA,MAAAH,OAAAC,OAAA,CAAKiB,MAAO,CAAEC,QAAS,KACtB,CAAAf,SAAAD,EAACiB,EAAO,CAACC,KAAK,kBAIN,IAGd7B,EAAe8B,YAAc"}

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

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