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

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

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

Files changed (1601) hide show

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

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

package/dist/cjs/components/template-context-mapper/modalElements/EditWebpushTemplate.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash/cloneDeep"),a=require("react"),i=require("../../input/Input.js"),n=require("../../template-preview/models/Channels.js"),l=require("../../template-preview/models/TemplateMeta.js"),o=require("../context/templateModalContext.js"),s=require("../helpers/WebpushTemplateHelper.js"),d=require("../utils/getDataFromTemplateComponent.js"),r=require("./EditMediaModal.js"),u=require("./EditMediaV2.js"),p=require("./EditMediaV2.style.js"),c=require("./useEditWhtasappTemplateMedia.js"),m=require("./VariableConnectorsPanel.js"),h=require("./VariableConnectorWhatsApp.js"),b=require("./VariableEditorHeader.js"),g=require("./WhatsAppTemplateCardButtonV2.js");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var M=f(t);exports.default=({template:t,onTemplateChange:f,whatsappSpecificPickerMeta:E,showVariableModal:j})=>{var C,T,v;const[x,V]=a.useState(null),[L,y]=a.useState(null),{variableList:I,disableEditVariable:w,originalVariableList:O,setOriginalVariableList:q}=o.useTemplateModalContext(),{processWebpushTemplate:R,isValidUrl:A}=s.default(),[S,k]=a.useState(null),[B,W]=a.useState(null),[H,D]=a.useState(null);a.useEffect((()=>{I&&R(t,I,O,w).then((({templateVariableMapping:e,template:t,webpushBroadcastConfig:a})=>{V(e),null==q||q(e),null==f||f(Object.assign({},t)),y(a)}))}),[I,w]);const{descriptionComponents:P,bodyVariables:F,titleVariables:U}=a.useMemo((()=>{if(x&&L){const e=d.getAllDataFromWebpushTemplateComponent(L,x);return S||k(e.iconImage),B||W(e.bannerImage),H||D(e.redirectionLink),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[x,L]),{uploadMediaLink:_,uploadMediaFiles:N,validateMimeType:Y}=E,G=a.useRef(null),$=c.useEditWhatsappTemplateMedia({uploadMediaLink:_,uploadMediaFiles:N,updateTemplateImageUrl:e=>z(e,"icon"),validateMimeType:Y,mediaComponent:S,fileRef:G}),K=c.useEditWhatsappTemplateMedia({uploadMediaLink:_,uploadMediaFiles:N,updateTemplateImageUrl:e=>z(e,"image"),validateMimeType:Y,mediaComponent:B,fileRef:G});function z(e,a){const i=Object.assign({},t),n=M.default(i);"icon"===a?(n.webpushBroadcastConfig.icon=[e],k([e])):"image"===a&&(n.webpushBroadcastConfig.image=[e],W([e])),null==f||f(Object.assign({},n))}function J(e,a,i){var n;const l=Object.assign({},t),o=M.default(l),s="custom"===a&&"string"==typeof e,d=null===(n=null==o?void 0:o.webpushBroadcastConfig)||void 0===n?void 0:n.buttons;if(d&&d.length>0){d[i]=s?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},o.webpushBroadcastConfig),{buttons:d});o.webpushBroadcastConfig=t}null==f||f(o)}const Q=$.openEditMedia?$:K.openEditMedia?K:null;if(Q)return e.jsx(m.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(r.default,{mediaComponentFormat:l.HEADER_TYPES.IMAGE,uploadMedia:Q.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:Q,setOpenEditMedia:Q.setOpenEditMedia,openEditMedia:Q.openEditMedia,editIconRef:Q.editIconRef,fileRef:G,skipAddVariable:!0})}));return e.jsxs(m.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[S&&S.length?e.jsx(p.EditTemplateMediaContainer,{children:e.jsx(u.default,{imageName:S,handleImageChange:$.handleImageChange,mediaType:l.HEADER_TYPES.IMAGE,error:$.error,isLoading:$.loading,setOpenEditMedia:$.setOpenEditMedia})}):null,B&&B.length?e.jsx(p.EditTemplateMediaContainer,{children:e.jsx(u.default,{imageName:B,handleImageChange:K.handleImageChange,mediaType:l.HEADER_TYPES.IMAGE,error:K.error,isLoading:K.loading,setOpenEditMedia:K.setOpenEditMedia})}):null,(null==F?void 0:F.length)||(null==U?void 0:U.length)?e.jsx(b.default,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==P?void 0:P.map(((t,a)=>e.jsx(h.default,{originalVariableList:x,originalList:O,channel:n.CHANNEL_TYPE.WEBPUSH,type:t.type,descriptionComponent:t.component,showVariableModal:j},a))),H&&H.length?e.jsx("div",Object.assign({style:{padding:"16px 14px"}},{children:e.jsx(i.Input,{labelText:"Redirection Link",id:"redirection-link",value:H[0].replace("https://",""),errorMessage:A(H[0])?"":"Please enter a valid URL",maxCharLimit:2e3,noKeyDownChange:!0,state:w?"disabled":"none",prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:e=>{!function(e){var a;const i=`https://${e}`;D([i]);const n=M.default(t);(null===(a=n.webpushBroadcastConfig)||void 0===a?void 0:a.redirectionLink)&&(n.webpushBroadcastConfig.redirectionLink=[i]),null==f||f(Object.assign({},n))}(e)}})})):e.jsx(e.Fragment,{}),(null===(T=null===(C=null==x?void 0:x.buttons)||void 0===C?void 0:C.filter((e=>"URL"===e.type)))||void 0===T?void 0:T.length)>0&&e.jsx(b.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(v=null==x?void 0:x.buttons)||void 0===v?void 0:v.map(((t,a)=>e.jsx(g.default,{variableListIndex:a,CTAoptions:null==E?void 0:E.CTAoptions,button:t,currentVariableList:x,updateSelectedURLTemplateBtn:J},`${a}`)))]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("lodash/cloneDeep"),a=require("react"),i=require("../../input/Input.js"),n=require("../../template-preview/models/Channels.js"),l=require("../../template-preview/models/TemplateMeta.js"),o=require("../context/templateModalContext.js"),s=require("../helpers/WebpushTemplateHelper.js"),d=require("../utils/getDataFromTemplateComponent.js"),r=require("./EditMediaModal.js"),u=require("./EditMediaV2.js"),p=require("./EditMediaV2.style.js"),c=require("./useEditWhtasappTemplateMedia.js"),m=require("./VariableConnectorsPanel.js"),h=require("./VariableConnectorWhatsApp.js"),b=require("./VariableEditorHeader.js"),g=require("./WhatsAppTemplateCardButtonV2.js");function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var M=f(t);exports.default=t=>{let{template:f,onTemplateChange:E,whatsappSpecificPickerMeta:j,showVariableModal:C}=t;var T,v,x;const[V,L]=a.useState(null),[y,I]=a.useState(null),{variableList:w,disableEditVariable:O,originalVariableList:q,setOriginalVariableList:R}=o.useTemplateModalContext(),{processWebpushTemplate:A,isValidUrl:S}=s.default(),[k,B]=a.useState(null),[W,H]=a.useState(null),[D,P]=a.useState(null);a.useEffect((()=>{w&&A(f,w,q,O).then((e=>{let{templateVariableMapping:t,template:a,webpushBroadcastConfig:i}=e;L(t),null==R||R(t),null==E||E(Object.assign({},a)),I(i)}))}),[w,O]);const{descriptionComponents:F,bodyVariables:U,titleVariables:_}=a.useMemo((()=>{if(V&&y){const e=d.getAllDataFromWebpushTemplateComponent(y,V);return k||B(e.iconImage),W||H(e.bannerImage),D||P(e.redirectionLink),{descriptionComponents:e.descriptionComponents,bodyVariables:e.bodyVariables,titleVariables:e.titleVariables}}return{descriptionComponents:[],bodyVariables:[],titleVariables:[],iconImage:null,bannerImage:null}}),[V,y]),{uploadMediaLink:N,uploadMediaFiles:Y,validateMimeType:G}=j,$=a.useRef(null),K=c.useEditWhatsappTemplateMedia({uploadMediaLink:N,uploadMediaFiles:Y,updateTemplateImageUrl:e=>J(e,"icon"),validateMimeType:G,mediaComponent:k,fileRef:$}),z=c.useEditWhatsappTemplateMedia({uploadMediaLink:N,uploadMediaFiles:Y,updateTemplateImageUrl:e=>J(e,"image"),validateMimeType:G,mediaComponent:W,fileRef:$});function J(e,t){const a=Object.assign({},f),i=M.default(a);"icon"===t?(i.webpushBroadcastConfig.icon=[e],B([e])):"image"===t&&(i.webpushBroadcastConfig.image=[e],H([e])),null==E||E(Object.assign({},i))}function Q(e,t,a){var i;const n=Object.assign({},f),l=M.default(n),o="custom"===t&&"string"==typeof e,s=null===(i=null==l?void 0:l.webpushBroadcastConfig)||void 0===i?void 0:i.buttons;if(s&&s.length>0){s[a]=o?e:"string"!=typeof e?e.placeHolder:"";const t=Object.assign(Object.assign({},l.webpushBroadcastConfig),{buttons:s});l.webpushBroadcastConfig=t}null==E||E(l)}const X=K.openEditMedia?K:z.openEditMedia?z:null;if(X)return e.jsx(m.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(r.default,{mediaComponentFormat:l.HEADER_TYPES.IMAGE,uploadMedia:X.uploadMedia,variableListForImage:[],useEditWhatsappTemplateMediaResponse:X,setOpenEditMedia:X.setOpenEditMedia,openEditMedia:X.openEditMedia,editIconRef:X.editIconRef,fileRef:$,skipAddVariable:!0})}));return e.jsxs(m.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:"auto"}},{children:[k&&k.length?e.jsx(p.EditTemplateMediaContainer,{children:e.jsx(u.default,{imageName:k,handleImageChange:K.handleImageChange,mediaType:l.HEADER_TYPES.IMAGE,error:K.error,isLoading:K.loading,setOpenEditMedia:K.setOpenEditMedia})}):null,W&&W.length?e.jsx(p.EditTemplateMediaContainer,{children:e.jsx(u.default,{imageName:W,handleImageChange:z.handleImageChange,mediaType:l.HEADER_TYPES.IMAGE,error:z.error,isLoading:z.loading,setOpenEditMedia:z.setOpenEditMedia})}):null,(null==U?void 0:U.length)||(null==_?void 0:_.length)?e.jsx(b.default,{containerStyle:{paddingTop:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}):null,null==F?void 0:F.map(((t,a)=>e.jsx(h.default,{originalVariableList:V,originalList:q,channel:n.CHANNEL_TYPE.WEBPUSH,type:t.type,descriptionComponent:t.component,showVariableModal:C},a))),D&&D.length?e.jsx("div",Object.assign({style:{padding:"16px 14px"}},{children:e.jsx(i.Input,{labelText:"Redirection Link",id:"redirection-link",value:D[0].replace("https://",""),errorMessage:S(D[0])?"":"Please enter a valid URL",maxCharLimit:2e3,noKeyDownChange:!0,state:O?"disabled":"none",prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:e=>{!function(e){var t;const a=`https://${e}`;P([a]);const i=M.default(f);(null===(t=i.webpushBroadcastConfig)||void 0===t?void 0:t.redirectionLink)&&(i.webpushBroadcastConfig.redirectionLink=[a]),null==E||E(Object.assign({},i))}(e)}})})):e.jsx(e.Fragment,{}),(null===(v=null===(T=null==V?void 0:V.buttons)||void 0===T?void 0:T.filter((e=>"URL"===e.type)))||void 0===v?void 0:v.length)>0&&e.jsx(b.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(x=null==V?void 0:V.buttons)||void 0===x?void 0:x.map(((t,a)=>e.jsx(g.default,{variableListIndex:a,CTAoptions:null==j?void 0:j.CTAoptions,button:t,currentVariableList:V,updateSelectedURLTemplateBtn:Q},`${a}`)))]}))};
 //# sourceMappingURL=EditWebpushTemplate.js.map

package/dist/cjs/components/template-context-mapper/modalElements/EditWebpushTemplate.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EditWebpushTemplate.js","sources":["../../../../../src/components/template-context-mapper/modalElements/EditWebpushTemplate.tsx"],"sourcesContent":["import cloneDeep from 'lodash/cloneDeep';\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport { Input } from '@src/components/input/Input';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport {\n\tButtonPlaceHolderOptions,\n\tHEADER_TYPES,\n} from '@src/components/template-preview/models/TemplateMeta';\nimport {\n\tWEB_PUSH_COMPONENT_TYPE,\n\ttype WebpushTemplateType,\n\ttype WebpushTemplateVariables,\n} from '@src/components/template-preview/models/WebpushTemplate';\nimport type { CTABtnValType } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport type { WhatsAppPickerMeta } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport useWebPushTemplate from '../helpers/WebpushTemplateHelper';\nimport { getAllDataFromWebpushTemplateComponent } from '../utils/getDataFromTemplateComponent';\nimport EditMediaModal from './EditMediaModal';\nimport EditMediaV2 from './EditMediaV2';\nimport { EditTemplateMediaContainer } from './EditMediaV2.style';\nimport { useEditWhatsappTemplateMedia } from './useEditWhtasappTemplateMedia';\nimport { Container } from './VariableConnectorsPanel';\nimport VariableConnectorWhatsApp from './VariableConnectorWhatsApp';\nimport VariableEditorHeader from './VariableEditorHeader';\nimport WhatsAppTemplateCardButtonV2, {\n\ttype URLBtnUpdateFunctionType,\n} from './WhatsAppTemplateCardButtonV2';\n\nexport interface EditWebpushTemplateV2Props {\n\twhatsappSpecificPickerMeta?: WhatsAppPickerMeta;\n\ttemplate: WebpushTemplateType;\n\tonTemplateChange?: (template: WebpushTemplateType) => void;\n\tshowVariableModal?: boolean;\n}\n\nconst EditWebpushTemplate = ({\n\ttemplate,\n\tonTemplateChange,\n\twhatsappSpecificPickerMeta,\n\tshowVariableModal,\n}: EditWebpushTemplateV2Props) => {\n\tconst [templateVariable, setTemplateVariables] =\n\t\tuseState<WebpushTemplateVariables \| null>(null);\n\tconst [webpushConfig, setWebpushConfig] = useState<\n\t\tWebpushTemplateType['webpushBroadcastConfig'] \| null\n\t>(null);\n\n\tconst {\n\t\tvariableList,\n\t\tdisableEditVariable,\n\t\toriginalVariableList,\n\t\tsetOriginalVariableList,\n\t} = useTemplateModalContext();\n\tconst { processWebpushTemplate, isValidUrl } = useWebPushTemplate();\n\tconst [iconImage, setIconImage] = useState<string[] \| null>(null);\n\tconst [bannerImage, setBannerImage] = useState<string[] \| null>(null);\n\tconst [redirectionLink, setRedirectionLink] = useState<string[] \| null>(null);\n\n\tuseEffect(() => {\n\t\tif (variableList) {\n\t\t\tprocessWebpushTemplate(\n\t\t\t\ttemplate,\n\t\t\t\tvariableList,\n\t\t\t\toriginalVariableList,\n\t\t\t\tdisableEditVariable,\n\t\t\t).then(\n\t\t\t\t({ templateVariableMapping, template, webpushBroadcastConfig }) => {\n\t\t\t\t\tsetTemplateVariables(templateVariableMapping);\n\t\t\t\t\tsetOriginalVariableList?.(templateVariableMapping);\n\t\t\t\t\tonTemplateChange?.({ ...template });\n\t\t\t\t\tsetWebpushConfig(webpushBroadcastConfig);\n\t\t\t\t},\n\t\t\t);\n\t\t}\n\t}, [variableList, disableEditVariable]);\n\n\tconst { descriptionComponents, bodyVariables, titleVariables } =\n\t\tuseMemo(() => {\n\t\t\tif (templateVariable && webpushConfig) {\n\t\t\t\tconst data = getAllDataFromWebpushTemplateComponent(\n\t\t\t\t\twebpushConfig,\n\t\t\t\t\ttemplateVariable,\n\t\t\t\t);\n\n\t\t\t\tif (!iconImage) setIconImage(data.iconImage);\n\t\t\t\tif (!bannerImage) setBannerImage(data.bannerImage);\n\t\t\t\tif (!redirectionLink) setRedirectionLink(data.redirectionLink);\n\n\t\t\t\treturn {\n\t\t\t\t\tdescriptionComponents: data.descriptionComponents,\n\t\t\t\t\tbodyVariables: data.bodyVariables,\n\t\t\t\t\ttitleVariables: data.titleVariables,\n\t\t\t\t};\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tdescriptionComponents: [],\n\t\t\t\tbodyVariables: [],\n\t\t\t\ttitleVariables: [],\n\t\t\t\ticonImage: null,\n\t\t\t\tbannerImage: null,\n\t\t\t};\n\t\t}, [templateVariable, webpushConfig]);\n\n\tconst { uploadMediaLink, uploadMediaFiles, validateMimeType } =\n\t\twhatsappSpecificPickerMeta as WhatsAppPickerMeta;\n\tconst fileRef = useRef<HTMLInputElement>(null);\n\n\tconst useEditMediaResponseForIcon = useEditWhatsappTemplateMedia({\n\t\tuploadMediaLink,\n\t\tuploadMediaFiles,\n\t\tupdateTemplateImageUrl: (url: string) =>\n\t\t\tupdateTemplateMediaUrl(url, 'icon'),\n\t\tvalidateMimeType,\n\t\tmediaComponent: iconImage,\n\t\tfileRef,\n\t});\n\tconst useEditMediaResponseForImage = useEditWhatsappTemplateMedia({\n\t\tuploadMediaLink,\n\t\tuploadMediaFiles,\n\t\tupdateTemplateImageUrl: (url: string) =>\n\t\t\tupdateTemplateMediaUrl(url, 'image'),\n\t\tvalidateMimeType,\n\t\tmediaComponent: bannerImage,\n\t\tfileRef,\n\t});\n\n\tfunction updateTemplateMediaUrl(url: string, mediaType: 'icon' \| 'image') {\n\t\tconst tempCopy = { ...template };\n\t\tconst localTemplate = cloneDeep(tempCopy);\n\t\tif (mediaType === 'icon') {\n\t\t\tlocalTemplate.webpushBroadcastConfig!.icon = [url];\n\t\t\tsetIconImage([url]);\n\t\t} else if (mediaType === 'image') {\n\t\t\tlocalTemplate.webpushBroadcastConfig!.image = [url];\n\t\t\tsetBannerImage([url]);\n\t\t}\n\n\t\tonTemplateChange?.({ ...localTemplate });\n\t}\n\n\tfunction updateSelectedTemplateURLBtn(\n\t\tval: CTABtnValType,\n\t\tmode: 'custom' \| 'placeholder',\n\t\tbtnIndex: number,\n\t) {\n\t\tconst tempCopy = { ...template };\n\t\tconst selectedTemplate = cloneDeep(tempCopy);\n\t\tconst isCustom = mode === 'custom' && typeof val === 'string';\n\t\tconst btnMapping = selectedTemplate?.webpushBroadcastConfig?.buttons;\n\t\tif (btnMapping && btnMapping.length > 0) {\n\t\t\tbtnMapping[btnIndex] = isCustom\n\t\t\t\t? val\n\t\t\t\t: typeof val !== 'string'\n\t\t\t\t? val.placeHolder\n\t\t\t\t: '';\n\t\t\tconst config = {\n\t\t\t\t...selectedTemplate.webpushBroadcastConfig,\n\t\t\t\tbuttons: btnMapping,\n\t\t\t};\n\t\t\tselectedTemplate.webpushBroadcastConfig = config;\n\t\t}\n\t\tonTemplateChange?.(selectedTemplate as WebpushTemplateType);\n\t}\n\n\tconst getActiveEditMediaResponse = () => {\n\t\tif (useEditMediaResponseForIcon.openEditMedia) {\n\t\t\treturn useEditMediaResponseForIcon;\n\t\t} else if (useEditMediaResponseForImage.openEditMedia) {\n\t\t\treturn useEditMediaResponseForImage;\n\t\t}\n\t\treturn null;\n\t};\n\n\tconst activeEditMediaResponse = getActiveEditMediaResponse();\n\n\tif (activeEditMediaResponse) {\n\t\treturn (\n\t\t\t<Container\n\t\t\t\tstyle={{\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\twidth: 400,\n\t\t\t\t\tmaxHeight: 460,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<EditMediaModal\n\t\t\t\t\tmediaComponentFormat={HEADER_TYPES.IMAGE}\n\t\t\t\t\tuploadMedia={activeEditMediaResponse.uploadMedia}\n\t\t\t\t\tvariableListForImage={[]}\n\t\t\t\t\tuseEditWhatsappTemplateMediaResponse={activeEditMediaResponse}\n\t\t\t\t\tsetOpenEditMedia={activeEditMediaResponse.setOpenEditMedia}\n\t\t\t\t\topenEditMedia={activeEditMediaResponse.openEditMedia}\n\t\t\t\t\teditIconRef={activeEditMediaResponse.editIconRef}\n\t\t\t\t\tfileRef={fileRef}\n\t\t\t\t\tskipAddVariable\n\t\t\t\t/>\n\t\t\t</Container>\n\t\t);\n\t}\n\n\tfunction updateWebpushBroadcastConfig(newValue: string) {\n\t\tconst newLink = `https://${newValue}`;\n\t\tsetRedirectionLink([newLink]);\n\t\tconst currentTemplate = cloneDeep(template) as WebpushTemplateType;\n\t\tif (currentTemplate.webpushBroadcastConfig?.redirectionLink) {\n\t\t\tcurrentTemplate.webpushBroadcastConfig!.redirectionLink = [newLink];\n\t\t}\n\t\tonTemplateChange?.({ ...currentTemplate });\n\t}\n\n\treturn (\n\t\t<Container\n\t\t\tstyle={{\n\t\t\t\tflexDirection: 'column',\n\t\t\t\twidth: 400,\n\t\t\t\tmaxHeight: 460,\n\t\t\t\tminWidth: 'auto',\n\t\t\t}}\n\t\t>\n\t\t\t{iconImage && iconImage.length ? (\n\t\t\t\t<EditTemplateMediaContainer>\n\t\t\t\t\t<EditMediaV2\n\t\t\t\t\t\timageName={iconImage}\n\t\t\t\t\t\thandleImageChange={useEditMediaResponseForIcon.handleImageChange}\n\t\t\t\t\t\tmediaType={HEADER_TYPES.IMAGE}\n\t\t\t\t\t\terror={useEditMediaResponseForIcon.error}\n\t\t\t\t\t\tisLoading={useEditMediaResponseForIcon.loading}\n\t\t\t\t\t\tsetOpenEditMedia={useEditMediaResponseForIcon.setOpenEditMedia}\n\t\t\t\t\t/>\n\t\t\t\t</EditTemplateMediaContainer>\n\t\t\t) : null}\n\n\t\t\t{bannerImage && bannerImage.length ? (\n\t\t\t\t<EditTemplateMediaContainer>\n\t\t\t\t\t<EditMediaV2\n\t\t\t\t\t\timageName={bannerImage}\n\t\t\t\t\t\thandleImageChange={useEditMediaResponseForImage.handleImageChange}\n\t\t\t\t\t\tmediaType={HEADER_TYPES.IMAGE}\n\t\t\t\t\t\terror={useEditMediaResponseForImage.error}\n\t\t\t\t\t\tisLoading={useEditMediaResponseForImage.loading}\n\t\t\t\t\t\tsetOpenEditMedia={useEditMediaResponseForImage.setOpenEditMedia}\n\t\t\t\t\t/>\n\t\t\t\t</EditTemplateMediaContainer>\n\t\t\t) : null}\n\n\t\t\t{bodyVariables?.length \|\| titleVariables?.length ? (\n\t\t\t\t<VariableEditorHeader\n\t\t\t\t\tcontainerStyle={{\n\t\t\t\t\t\tpaddingTop: 8,\n\t\t\t\t\t}}\n\t\t\t\t\theaderText={'Edit variable values'}\n\t\t\t\t\tsubText={'Edit values for the variables used in template'}\n\t\t\t\t\ttoolTipInfo={\n\t\t\t\t\t\t'Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below'\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) : null}\n\n\t\t\t{descriptionComponents?.map((each, i) => (\n\t\t\t\t<VariableConnectorWhatsApp\n\t\t\t\t\toriginalVariableList={templateVariable as WebpushTemplateVariables}\n\t\t\t\t\toriginalList={originalVariableList}\n\t\t\t\t\tchannel={CHANNEL_TYPE.WEBPUSH}\n\t\t\t\t\ttype={each.type as WEB_PUSH_COMPONENT_TYPE}\n\t\t\t\t\tdescriptionComponent={each.component}\n\t\t\t\t\tkey={i}\n\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t/>\n\t\t\t))}\n\n\t\t\t{redirectionLink && redirectionLink.length ? (\n\t\t\t\t<div style={{ padding: '16px 14px' }}>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tlabelText={'Redirection Link'}\n\t\t\t\t\t\tid={`redirection-link`}\n\t\t\t\t\t\tvalue={redirectionLink[0].replace('https://', '')}\n\t\t\t\t\t\terrorMessage={\n\t\t\t\t\t\t\tisValidUrl(redirectionLink[0]) ? '' : 'Please enter a valid URL'\n\t\t\t\t\t\t}\n\t\t\t\t\t\tmaxCharLimit={2000}\n\t\t\t\t\t\tnoKeyDownChange={true}\n\t\t\t\t\t\tstate={disableEditVariable ? 'disabled' : 'none'}\n\t\t\t\t\t\tprefixText={'https://'}\n\t\t\t\t\t\tplaceholder={'Enter custom URL here'}\n\t\t\t\t\t\tonChangeText={(enteredVariableName) => {\n\t\t\t\t\t\t\tupdateWebpushBroadcastConfig(enteredVariableName);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) : (\n\t\t\t\t<></>\n\t\t\t)}\n\n\t\t\t{(templateVariable as WebpushTemplateVariables)?.buttons?.filter(\n\t\t\t\t(btn) => btn.type === 'URL',\n\t\t\t)?.length > 0 && (\n\t\t\t\t<VariableEditorHeader\n\t\t\t\t\theaderText={'Edit buttons'}\n\t\t\t\t\tsubText={'Edit the link connected to the CTA button'}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{(templateVariable as WebpushTemplateVariables)?.buttons?.map(\n\t\t\t\t(btn, i) => (\n\t\t\t\t\t<WhatsAppTemplateCardButtonV2\n\t\t\t\t\t\tvariableListIndex={i}\n\t\t\t\t\t\tCTAoptions={\n\t\t\t\t\t\t\twhatsappSpecificPickerMeta?.CTAoptions as ButtonPlaceHolderOptions[]\n\t\t\t\t\t\t}\n\t\t\t\t\t\tbutton={btn}\n\t\t\t\t\t\tkey={`${i}`}\n\t\t\t\t\t\tcurrentVariableList={templateVariable as WebpushTemplateVariables}\n\t\t\t\t\t\tupdateSelectedURLTemplateBtn={\n\t\t\t\t\t\t\tupdateSelectedTemplateURLBtn as URLBtnUpdateFunctionType\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t),\n\t\t\t)}\n\t\t</Container>\n\t);\n};\n\nexport default EditWebpushTemplate;\n"],"names":["EditWebpushTemplate","template","onTemplateChange","whatsappSpecificPickerMeta","showVariableModal","templateVariable","setTemplateVariables","useState","webpushConfig","setWebpushConfig","variableList","disableEditVariable","originalVariableList","setOriginalVariableList","useTemplateModalContext","processWebpushTemplate","isValidUrl","useWebPushTemplate","iconImage","setIconImage","bannerImage","setBannerImage","redirectionLink","setRedirectionLink","useEffect","then","templateVariableMapping","webpushBroadcastConfig","Object","assign","descriptionComponents","bodyVariables","titleVariables","useMemo","data","getAllDataFromWebpushTemplateComponent","uploadMediaLink","uploadMediaFiles","validateMimeType","fileRef","useRef","useEditMediaResponseForIcon","useEditWhatsappTemplateMedia","updateTemplateImageUrl","url","updateTemplateMediaUrl","mediaComponent","useEditMediaResponseForImage","mediaType","tempCopy","localTemplate","cloneDeep","icon","image","updateSelectedTemplateURLBtn","val","mode","btnIndex","selectedTemplate","isCustom","btnMapping","_a","buttons","length","placeHolder","config","activeEditMediaResponse","openEditMedia","_jsx","Container","style","flexDirection","width","maxHeight","children","jsx","EditMediaModal","mediaComponentFormat","HEADER_TYPES","IMAGE","uploadMedia","variableListForImage","useEditWhatsappTemplateMediaResponse","setOpenEditMedia","editIconRef","skipAddVariable","_jsxs","minWidth","EditTemplateMediaContainer","EditMediaV2","imageName","handleImageChange","error","isLoading","loading","VariableEditorHeader","containerStyle","paddingTop","headerText","subText","toolTipInfo","map","each","i","VariableConnectorWhatsApp","originalList","channel","CHANNEL_TYPE","WEBPUSH","type","descriptionComponent","component","padding","Input","labelText","id","value","replace","errorMessage","maxCharLimit","noKeyDownChange","state","prefixText","placeholder","onChangeText","enteredVariableName","newValue","newLink","currentTemplate","updateWebpushBroadcastConfig","_Fragment","Fragment","_b","filter","btn","_c","WhatsAppTemplateCardButtonV2","variableListIndex","CTAoptions","button","currentVariableList","updateSelectedURLTemplateBtn"],"mappings":"o2BAoC4BA,EAC3BC,WACAC,mBACAC,6BACAC,kCAEA,MAAOC,EAAkBC,GACxBC,EAAQA,SAAkC,OACpCC,EAAeC,GAAoBF,EAAQA,SAEhD,OAEIG,aACLA,EAAYC,oBACZA,EAAmBC,qBACnBA,EAAoBC,wBACpBA,GACGC,EAAuBA,2BACrBC,uBAAEA,EAAsBC,WAAEA,GAAeC,EAAkB,WAC1DC,EAAWC,GAAgBZ,EAAQA,SAAkB,OACrDa,EAAaC,GAAkBd,EAAQA,SAAkB,OACzDe,EAAiBC,GAAsBhB,EAAQA,SAAkB,MAExEiB,EAAAA,WAAU,KACLd,GACHK,EACCd,EACAS,EACAE,EACAD,GACCc,MACD,EAAGC,0BAAyBzB,WAAU0B,6BACrCrB,EAAqBoB,GACrBb,SAAAA,EAA0Ba,GAC1BxB,SAAAA,EAAwB0B,OAAAC,OAAA,GAAA5B,IACxBQ,EAAiBkB,EAAuB,GAG1C,GACC,CAACjB,EAAcC,IAElB,MAAMmB,sBAAEA,EAAqBC,cAAEA,EAAaC,eAAEA,GAC7CC,EAAOA,SAAC,KACP,GAAI5B,GAAoBG,EAAe,CACtC,MAAM0B,EAAOC,EAAAA,uCACZ3B,EACAH,GAOD,OAJKa,GAAWC,EAAae,EAAKhB,WAC7BE,GAAaC,EAAea,EAAKd,aACjCE,GAAiBC,EAAmBW,EAAKZ,iBAEvC,CACNQ,sBAAuBI,EAAKJ,sBAC5BC,cAAeG,EAAKH,cACpBC,eAAgBE,EAAKF,eAEtB,CACD,MAAO,CACNF,sBAAuB,GACvBC,cAAe,GACfC,eAAgB,GAChBd,UAAW,KACXE,YAAa,KACb,GACC,CAACf,EAAkBG,KAEjB4B,gBAAEA,EAAeC,iBAAEA,EAAgBC,iBAAEA,GAC1CnC,EACKoC,EAAUC,SAAyB,MAEnCC,EAA8BC,EAAAA,6BAA6B,CAChEN,kBACAC,mBACAM,uBAAyBC,GACxBC,EAAuBD,EAAK,QAC7BN,mBACAQ,eAAgB5B,EAChBqB,YAEKQ,EAA+BL,EAAAA,6BAA6B,CACjEN,kBACAC,mBACAM,uBAAyBC,GACxBC,EAAuBD,EAAK,SAC7BN,mBACAQ,eAAgB1B,EAChBmB,YAGD,SAASM,EAAuBD,EAAaI,GAC5C,MAAMC,EAAQrB,OAAAC,OAAA,CAAA,EAAQ5B,GAChBiD,EAAgBC,UAAUF,GACd,SAAdD,GACHE,EAAcvB,uBAAwByB,KAAO,CAACR,GAC9CzB,EAAa,CAACyB,KACU,UAAdI,IACVE,EAAcvB,uBAAwB0B,MAAQ,CAACT,GAC/CvB,EAAe,CAACuB,KAGjB1C,SAAAA,EAAwB0B,OAAAC,OAAA,GAAAqB,GACzB,CAEA,SAASI,EACRC,EACAC,EACAC,SAEA,MAAMR,EAAQrB,OAAAC,OAAA,CAAA,EAAQ5B,GAChByD,EAAmBP,UAAUF,GAC7BU,EAAoB,WAATH,GAAoC,iBAARD,EACvCK,EAAuD,QAA1CC,EAAAH,aAAA,EAAAA,EAAkB/B,8BAAwB,IAAAkC,OAAA,EAAAA,EAAAC,QAC7D,GAAIF,GAAcA,EAAWG,OAAS,EAAG,CACxCH,EAAWH,GAAYE,EACpBJ,EACe,iBAARA,EACPA,EAAIS,YACJ,GACH,MAAMC,EACFrC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAAA6B,EAAiB/B,yBACpBmC,QAASF,IAEVF,EAAiB/B,uBAAyBsC,CAC1C,CACD/D,SAAAA,EAAmBwD,EACpB,CAEA,MASMQ,EARDzB,EAA4B0B,cACxB1B,EACGM,EAA6BoB,cAChCpB,EAED,KAKR,GAAImB,EACH,OACCE,MAACC,EAAAA,UAASzC,OAAAC,OAAA,CACTyC,MAAO,CACNC,cAAe,SACfC,MAAO,IACPC,UAAW,MAGZ,CAAAC,SAAAN,EAAAO,IAACC,UACA,CAAAC,qBAAsBC,EAAYA,aAACC,MACnCC,YAAad,EAAwBc,YACrCC,qBAAsB,GACtBC,qCAAsChB,EACtCiB,iBAAkBjB,EAAwBiB,iBAC1ChB,cAAeD,EAAwBC,cACvCiB,YAAalB,EAAwBkB,YACrC7C,QAASA,EACT8C,iBAAe,OAgBnB,OACCC,OAACjB,EAAAA,UAASzC,OAAAC,OAAA,CACTyC,MAAO,CACNC,cAAe,SACfC,MAAO,IACPC,UAAW,IACXc,SAAU,SACV,CAAAb,SAAA,CAEAxD,GAAaA,EAAU6C,OACvBK,EAAAA,IAACoB,EAAAA,2BAA0B,CAAAd,SAC1BN,MAACqB,UAAW,CACXC,UAAWxE,EACXyE,kBAAmBlD,EAA4BkD,kBAC/C3C,UAAW8B,EAAYA,aAACC,MACxBa,MAAOnD,EAA4BmD,MACnCC,UAAWpD,EAA4BqD,QACvCX,iBAAkB1C,EAA4B0C,qBAG7C,KAEH/D,GAAeA,EAAY2C,OAC3BK,MAACoB,6BAA0B,CAAAd,SAC1BN,EAACO,IAAAc,UACA,CAAAC,UAAWtE,EACXuE,kBAAmB5C,EAA6B4C,kBAChD3C,UAAW8B,EAAYA,aAACC,MACxBa,MAAO7C,EAA6B6C,MACpCC,UAAW9C,EAA6B+C,QACxCX,iBAAkBpC,EAA6BoC,qBAG9C,MAEHpD,aAAA,EAAAA,EAAegC,UAAU/B,aAAc,EAAdA,EAAgB+B,QACzCK,EAAAO,IAACoB,UAAoB,CACpBC,eAAgB,CACfC,WAAY,GAEbC,WAAY,uBACZC,QAAS,iDACTC,YACC,6IAGC,KAEHtE,eAAAA,EAAuBuE,KAAI,CAACC,EAAMC,IAClCnC,EAAAA,IAACoC,EAAAA,QAAyB,CACzB5F,qBAAsBP,EACtBoG,aAAc7F,EACd8F,QAASC,EAAYA,aAACC,QACtBC,KAAMP,EAAKO,KACXC,qBAAsBR,EAAKS,UAE3B3G,kBAAmBA,GADdmG,KAKNjF,GAAmBA,EAAgByC,OACnCK,MAAK,MAAAxC,OAAAC,OAAA,CAAAyC,MAAO,CAAE0C,QAAS,cAAa,CAAAtC,SACnCN,MAAC6C,QAAK,CACLC,UAAW,mBACXC,GAAI,mBACJC,MAAO9F,EAAgB,GAAG+F,QAAQ,WAAY,IAC9CC,aACCtG,EAAWM,EAAgB,IAAM,GAAK,2BAEvCiG,aAAc,IACdC,iBAAiB,EACjBC,MAAO9G,EAAsB,WAAa,OAC1C+G,WAAY,WACZC,YAAa,wBACbC,aAAeC,KApFpB,SAAsCC,SACrC,MAAMC,EAAU,WAAWD,IAC3BvG,EAAmB,CAACwG,IACpB,MAAMC,EAAkB7E,UAAUlD,IACQ,UAAtC+H,EAAgBrG,8BAAsB,IAAAkC,OAAA,EAAAA,EAAEvC,mBAC3C0G,EAAgBrG,uBAAwBL,gBAAkB,CAACyG,IAE5D7H,SAAAA,EAAwB0B,OAAAC,OAAA,GAAAmG,GACzB,CA6EMC,CAA6BJ,EAAoB,OAKpDzD,EAAAA,IAAA8D,EAAAC,SAAA,CAAA,IAKE,QAFFC,EAAyD,UAAxD/H,aAAgB,EAAhBA,EAA+CyD,eAAS,IAAAD,OAAA,EAAAA,EAAAwE,QACxDC,GAAqB,QAAbA,EAAIzB,cACX,IAAAuB,OAAA,EAAAA,EAAArE,QAAS,GACXK,MAAC2B,UAAoB,CACpBG,WAAY,eACZC,QAAS,sDAIVoC,EAAClI,aAAA,EAAAA,EAA+CyD,8BAASuC,KACzD,CAACiC,EAAK/B,IACLnC,EAAAO,IAAC6D,UAA4B,CAC5BC,kBAAmBlC,EACnBmC,WACCvI,aAA0B,EAA1BA,EAA4BuI,WAE7BC,OAAQL,EAERM,oBAAqBvI,EACrBwI,6BACCvF,GAHI,GAAGiD,UAQA"}
1	+ {"version":3,"file":"EditWebpushTemplate.js","sources":["../../../../../src/components/template-context-mapper/modalElements/EditWebpushTemplate.tsx"],"sourcesContent":["import cloneDeep from 'lodash/cloneDeep';\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport { Input } from '@src/components/input/Input';\nimport { CHANNEL_TYPE } from '@src/components/template-preview/models/Channels';\nimport {\n\tButtonPlaceHolderOptions,\n\tHEADER_TYPES,\n} from '@src/components/template-preview/models/TemplateMeta';\nimport {\n\tWEB_PUSH_COMPONENT_TYPE,\n\ttype WebpushTemplateType,\n\ttype WebpushTemplateVariables,\n} from '@src/components/template-preview/models/WebpushTemplate';\nimport type { CTABtnValType } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport type { WhatsAppPickerMeta } from '@src/components/template-preview/models/WhatsAppTemplate';\nimport { useTemplateModalContext } from '../context/templateModalContext';\nimport useWebPushTemplate from '../helpers/WebpushTemplateHelper';\nimport { getAllDataFromWebpushTemplateComponent } from '../utils/getDataFromTemplateComponent';\nimport EditMediaModal from './EditMediaModal';\nimport EditMediaV2 from './EditMediaV2';\nimport { EditTemplateMediaContainer } from './EditMediaV2.style';\nimport { useEditWhatsappTemplateMedia } from './useEditWhtasappTemplateMedia';\nimport { Container } from './VariableConnectorsPanel';\nimport VariableConnectorWhatsApp from './VariableConnectorWhatsApp';\nimport VariableEditorHeader from './VariableEditorHeader';\nimport WhatsAppTemplateCardButtonV2, {\n\ttype URLBtnUpdateFunctionType,\n} from './WhatsAppTemplateCardButtonV2';\n\nexport interface EditWebpushTemplateV2Props {\n\twhatsappSpecificPickerMeta?: WhatsAppPickerMeta;\n\ttemplate: WebpushTemplateType;\n\tonTemplateChange?: (template: WebpushTemplateType) => void;\n\tshowVariableModal?: boolean;\n}\n\nconst EditWebpushTemplate = ({\n\ttemplate,\n\tonTemplateChange,\n\twhatsappSpecificPickerMeta,\n\tshowVariableModal,\n}: EditWebpushTemplateV2Props) => {\n\tconst [templateVariable, setTemplateVariables] =\n\t\tuseState<WebpushTemplateVariables \| null>(null);\n\tconst [webpushConfig, setWebpushConfig] = useState<\n\t\tWebpushTemplateType['webpushBroadcastConfig'] \| null\n\t>(null);\n\n\tconst {\n\t\tvariableList,\n\t\tdisableEditVariable,\n\t\toriginalVariableList,\n\t\tsetOriginalVariableList,\n\t} = useTemplateModalContext();\n\tconst { processWebpushTemplate, isValidUrl } = useWebPushTemplate();\n\tconst [iconImage, setIconImage] = useState<string[] \| null>(null);\n\tconst [bannerImage, setBannerImage] = useState<string[] \| null>(null);\n\tconst [redirectionLink, setRedirectionLink] = useState<string[] \| null>(null);\n\n\tuseEffect(() => {\n\t\tif (variableList) {\n\t\t\tprocessWebpushTemplate(\n\t\t\t\ttemplate,\n\t\t\t\tvariableList,\n\t\t\t\toriginalVariableList,\n\t\t\t\tdisableEditVariable,\n\t\t\t).then(\n\t\t\t\t({ templateVariableMapping, template, webpushBroadcastConfig }) => {\n\t\t\t\t\tsetTemplateVariables(templateVariableMapping);\n\t\t\t\t\tsetOriginalVariableList?.(templateVariableMapping);\n\t\t\t\t\tonTemplateChange?.({ ...template });\n\t\t\t\t\tsetWebpushConfig(webpushBroadcastConfig);\n\t\t\t\t},\n\t\t\t);\n\t\t}\n\t}, [variableList, disableEditVariable]);\n\n\tconst { descriptionComponents, bodyVariables, titleVariables } =\n\t\tuseMemo(() => {\n\t\t\tif (templateVariable && webpushConfig) {\n\t\t\t\tconst data = getAllDataFromWebpushTemplateComponent(\n\t\t\t\t\twebpushConfig,\n\t\t\t\t\ttemplateVariable,\n\t\t\t\t);\n\n\t\t\t\tif (!iconImage) setIconImage(data.iconImage);\n\t\t\t\tif (!bannerImage) setBannerImage(data.bannerImage);\n\t\t\t\tif (!redirectionLink) setRedirectionLink(data.redirectionLink);\n\n\t\t\t\treturn {\n\t\t\t\t\tdescriptionComponents: data.descriptionComponents,\n\t\t\t\t\tbodyVariables: data.bodyVariables,\n\t\t\t\t\ttitleVariables: data.titleVariables,\n\t\t\t\t};\n\t\t\t}\n\t\t\treturn {\n\t\t\t\tdescriptionComponents: [],\n\t\t\t\tbodyVariables: [],\n\t\t\t\ttitleVariables: [],\n\t\t\t\ticonImage: null,\n\t\t\t\tbannerImage: null,\n\t\t\t};\n\t\t}, [templateVariable, webpushConfig]);\n\n\tconst { uploadMediaLink, uploadMediaFiles, validateMimeType } =\n\t\twhatsappSpecificPickerMeta as WhatsAppPickerMeta;\n\tconst fileRef = useRef<HTMLInputElement>(null);\n\n\tconst useEditMediaResponseForIcon = useEditWhatsappTemplateMedia({\n\t\tuploadMediaLink,\n\t\tuploadMediaFiles,\n\t\tupdateTemplateImageUrl: (url: string) =>\n\t\t\tupdateTemplateMediaUrl(url, 'icon'),\n\t\tvalidateMimeType,\n\t\tmediaComponent: iconImage,\n\t\tfileRef,\n\t});\n\tconst useEditMediaResponseForImage = useEditWhatsappTemplateMedia({\n\t\tuploadMediaLink,\n\t\tuploadMediaFiles,\n\t\tupdateTemplateImageUrl: (url: string) =>\n\t\t\tupdateTemplateMediaUrl(url, 'image'),\n\t\tvalidateMimeType,\n\t\tmediaComponent: bannerImage,\n\t\tfileRef,\n\t});\n\n\tfunction updateTemplateMediaUrl(url: string, mediaType: 'icon' \| 'image') {\n\t\tconst tempCopy = { ...template };\n\t\tconst localTemplate = cloneDeep(tempCopy);\n\t\tif (mediaType === 'icon') {\n\t\t\tlocalTemplate.webpushBroadcastConfig!.icon = [url];\n\t\t\tsetIconImage([url]);\n\t\t} else if (mediaType === 'image') {\n\t\t\tlocalTemplate.webpushBroadcastConfig!.image = [url];\n\t\t\tsetBannerImage([url]);\n\t\t}\n\n\t\tonTemplateChange?.({ ...localTemplate });\n\t}\n\n\tfunction updateSelectedTemplateURLBtn(\n\t\tval: CTABtnValType,\n\t\tmode: 'custom' \| 'placeholder',\n\t\tbtnIndex: number,\n\t) {\n\t\tconst tempCopy = { ...template };\n\t\tconst selectedTemplate = cloneDeep(tempCopy);\n\t\tconst isCustom = mode === 'custom' && typeof val === 'string';\n\t\tconst btnMapping = selectedTemplate?.webpushBroadcastConfig?.buttons;\n\t\tif (btnMapping && btnMapping.length > 0) {\n\t\t\tbtnMapping[btnIndex] = isCustom\n\t\t\t\t? val\n\t\t\t\t: typeof val !== 'string'\n\t\t\t\t? val.placeHolder\n\t\t\t\t: '';\n\t\t\tconst config = {\n\t\t\t\t...selectedTemplate.webpushBroadcastConfig,\n\t\t\t\tbuttons: btnMapping,\n\t\t\t};\n\t\t\tselectedTemplate.webpushBroadcastConfig = config;\n\t\t}\n\t\tonTemplateChange?.(selectedTemplate as WebpushTemplateType);\n\t}\n\n\tconst getActiveEditMediaResponse = () => {\n\t\tif (useEditMediaResponseForIcon.openEditMedia) {\n\t\t\treturn useEditMediaResponseForIcon;\n\t\t} else if (useEditMediaResponseForImage.openEditMedia) {\n\t\t\treturn useEditMediaResponseForImage;\n\t\t}\n\t\treturn null;\n\t};\n\n\tconst activeEditMediaResponse = getActiveEditMediaResponse();\n\n\tif (activeEditMediaResponse) {\n\t\treturn (\n\t\t\t<Container\n\t\t\t\tstyle={{\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\twidth: 400,\n\t\t\t\t\tmaxHeight: 460,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<EditMediaModal\n\t\t\t\t\tmediaComponentFormat={HEADER_TYPES.IMAGE}\n\t\t\t\t\tuploadMedia={activeEditMediaResponse.uploadMedia}\n\t\t\t\t\tvariableListForImage={[]}\n\t\t\t\t\tuseEditWhatsappTemplateMediaResponse={activeEditMediaResponse}\n\t\t\t\t\tsetOpenEditMedia={activeEditMediaResponse.setOpenEditMedia}\n\t\t\t\t\topenEditMedia={activeEditMediaResponse.openEditMedia}\n\t\t\t\t\teditIconRef={activeEditMediaResponse.editIconRef}\n\t\t\t\t\tfileRef={fileRef}\n\t\t\t\t\tskipAddVariable\n\t\t\t\t/>\n\t\t\t</Container>\n\t\t);\n\t}\n\n\tfunction updateWebpushBroadcastConfig(newValue: string) {\n\t\tconst newLink = `https://${newValue}`;\n\t\tsetRedirectionLink([newLink]);\n\t\tconst currentTemplate = cloneDeep(template) as WebpushTemplateType;\n\t\tif (currentTemplate.webpushBroadcastConfig?.redirectionLink) {\n\t\t\tcurrentTemplate.webpushBroadcastConfig!.redirectionLink = [newLink];\n\t\t}\n\t\tonTemplateChange?.({ ...currentTemplate });\n\t}\n\n\treturn (\n\t\t<Container\n\t\t\tstyle={{\n\t\t\t\tflexDirection: 'column',\n\t\t\t\twidth: 400,\n\t\t\t\tmaxHeight: 460,\n\t\t\t\tminWidth: 'auto',\n\t\t\t}}\n\t\t>\n\t\t\t{iconImage && iconImage.length ? (\n\t\t\t\t<EditTemplateMediaContainer>\n\t\t\t\t\t<EditMediaV2\n\t\t\t\t\t\timageName={iconImage}\n\t\t\t\t\t\thandleImageChange={useEditMediaResponseForIcon.handleImageChange}\n\t\t\t\t\t\tmediaType={HEADER_TYPES.IMAGE}\n\t\t\t\t\t\terror={useEditMediaResponseForIcon.error}\n\t\t\t\t\t\tisLoading={useEditMediaResponseForIcon.loading}\n\t\t\t\t\t\tsetOpenEditMedia={useEditMediaResponseForIcon.setOpenEditMedia}\n\t\t\t\t\t/>\n\t\t\t\t</EditTemplateMediaContainer>\n\t\t\t) : null}\n\n\t\t\t{bannerImage && bannerImage.length ? (\n\t\t\t\t<EditTemplateMediaContainer>\n\t\t\t\t\t<EditMediaV2\n\t\t\t\t\t\timageName={bannerImage}\n\t\t\t\t\t\thandleImageChange={useEditMediaResponseForImage.handleImageChange}\n\t\t\t\t\t\tmediaType={HEADER_TYPES.IMAGE}\n\t\t\t\t\t\terror={useEditMediaResponseForImage.error}\n\t\t\t\t\t\tisLoading={useEditMediaResponseForImage.loading}\n\t\t\t\t\t\tsetOpenEditMedia={useEditMediaResponseForImage.setOpenEditMedia}\n\t\t\t\t\t/>\n\t\t\t\t</EditTemplateMediaContainer>\n\t\t\t) : null}\n\n\t\t\t{bodyVariables?.length \|\| titleVariables?.length ? (\n\t\t\t\t<VariableEditorHeader\n\t\t\t\t\tcontainerStyle={{\n\t\t\t\t\t\tpaddingTop: 8,\n\t\t\t\t\t}}\n\t\t\t\t\theaderText={'Edit variable values'}\n\t\t\t\t\tsubText={'Edit values for the variables used in template'}\n\t\t\t\t\ttoolTipInfo={\n\t\t\t\t\t\t'Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below'\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t) : null}\n\n\t\t\t{descriptionComponents?.map((each, i) => (\n\t\t\t\t<VariableConnectorWhatsApp\n\t\t\t\t\toriginalVariableList={templateVariable as WebpushTemplateVariables}\n\t\t\t\t\toriginalList={originalVariableList}\n\t\t\t\t\tchannel={CHANNEL_TYPE.WEBPUSH}\n\t\t\t\t\ttype={each.type as WEB_PUSH_COMPONENT_TYPE}\n\t\t\t\t\tdescriptionComponent={each.component}\n\t\t\t\t\tkey={i}\n\t\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\t/>\n\t\t\t))}\n\n\t\t\t{redirectionLink && redirectionLink.length ? (\n\t\t\t\t<div style={{ padding: '16px 14px' }}>\n\t\t\t\t\t<Input\n\t\t\t\t\t\tlabelText={'Redirection Link'}\n\t\t\t\t\t\tid={`redirection-link`}\n\t\t\t\t\t\tvalue={redirectionLink[0].replace('https://', '')}\n\t\t\t\t\t\terrorMessage={\n\t\t\t\t\t\t\tisValidUrl(redirectionLink[0]) ? '' : 'Please enter a valid URL'\n\t\t\t\t\t\t}\n\t\t\t\t\t\tmaxCharLimit={2000}\n\t\t\t\t\t\tnoKeyDownChange={true}\n\t\t\t\t\t\tstate={disableEditVariable ? 'disabled' : 'none'}\n\t\t\t\t\t\tprefixText={'https://'}\n\t\t\t\t\t\tplaceholder={'Enter custom URL here'}\n\t\t\t\t\t\tonChangeText={(enteredVariableName) => {\n\t\t\t\t\t\t\tupdateWebpushBroadcastConfig(enteredVariableName);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) : (\n\t\t\t\t<></>\n\t\t\t)}\n\n\t\t\t{(templateVariable as WebpushTemplateVariables)?.buttons?.filter(\n\t\t\t\t(btn) => btn.type === 'URL',\n\t\t\t)?.length > 0 && (\n\t\t\t\t<VariableEditorHeader\n\t\t\t\t\theaderText={'Edit buttons'}\n\t\t\t\t\tsubText={'Edit the link connected to the CTA button'}\n\t\t\t\t/>\n\t\t\t)}\n\n\t\t\t{(templateVariable as WebpushTemplateVariables)?.buttons?.map(\n\t\t\t\t(btn, i) => (\n\t\t\t\t\t<WhatsAppTemplateCardButtonV2\n\t\t\t\t\t\tvariableListIndex={i}\n\t\t\t\t\t\tCTAoptions={\n\t\t\t\t\t\t\twhatsappSpecificPickerMeta?.CTAoptions as ButtonPlaceHolderOptions[]\n\t\t\t\t\t\t}\n\t\t\t\t\t\tbutton={btn}\n\t\t\t\t\t\tkey={`${i}`}\n\t\t\t\t\t\tcurrentVariableList={templateVariable as WebpushTemplateVariables}\n\t\t\t\t\t\tupdateSelectedURLTemplateBtn={\n\t\t\t\t\t\t\tupdateSelectedTemplateURLBtn as URLBtnUpdateFunctionType\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t),\n\t\t\t)}\n\t\t</Container>\n\t);\n};\n\nexport default EditWebpushTemplate;\n"],"names":["_ref","template","onTemplateChange","whatsappSpecificPickerMeta","showVariableModal","templateVariable","setTemplateVariables","useState","webpushConfig","setWebpushConfig","variableList","disableEditVariable","originalVariableList","setOriginalVariableList","useTemplateModalContext","processWebpushTemplate","isValidUrl","useWebPushTemplate","iconImage","setIconImage","bannerImage","setBannerImage","redirectionLink","setRedirectionLink","useEffect","then","_ref2","templateVariableMapping","webpushBroadcastConfig","Object","assign","descriptionComponents","bodyVariables","titleVariables","useMemo","data","getAllDataFromWebpushTemplateComponent","uploadMediaLink","uploadMediaFiles","validateMimeType","fileRef","useRef","useEditMediaResponseForIcon","useEditWhatsappTemplateMedia","updateTemplateImageUrl","url","updateTemplateMediaUrl","mediaComponent","useEditMediaResponseForImage","mediaType","tempCopy","localTemplate","cloneDeep","icon","image","updateSelectedTemplateURLBtn","val","mode","btnIndex","selectedTemplate","isCustom","btnMapping","_a","buttons","length","placeHolder","config","activeEditMediaResponse","openEditMedia","_jsx","Container","style","flexDirection","width","maxHeight","children","jsx","EditMediaModal","mediaComponentFormat","HEADER_TYPES","IMAGE","uploadMedia","variableListForImage","useEditWhatsappTemplateMediaResponse","setOpenEditMedia","editIconRef","skipAddVariable","_jsxs","minWidth","EditTemplateMediaContainer","EditMediaV2","imageName","handleImageChange","error","isLoading","loading","VariableEditorHeader","containerStyle","paddingTop","headerText","subText","toolTipInfo","map","each","i","VariableConnectorWhatsApp","originalList","channel","CHANNEL_TYPE","WEBPUSH","type","descriptionComponent","component","padding","Input","labelText","id","value","replace","errorMessage","maxCharLimit","noKeyDownChange","state","prefixText","placeholder","onChangeText","enteredVariableName","newValue","newLink","currentTemplate","updateWebpushBroadcastConfig","_Fragment","Fragment","_b","filter","btn","_c","WhatsAppTemplateCardButtonV2","variableListIndex","CTAoptions","button","currentVariableList","updateSelectedURLTemplateBtn"],"mappings":"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"}

package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("@bikdotai/bik-models/growth/models/bik-store"),t=require("../../../assets/icons/arrow_back.svg.js"),n=require("../../../assets/icons/chevronLeft.svg.js"),o=require("../../../assets/icons/chevronRight.svg.js"),i=require("../../../assets/icons/PlusIcon.js"),r=require("lodash/cloneDeep"),s=require("react"),a=require("../../button/Button.js"),d=require("../../icon-button/IconButton.js"),c=require("../../product-picker-v2/modal.js"),u=require("../../product-picker-v2/type.js"),p=require("../Badge/index.js"),v=require("../context/templateModalContext.js"),h=require("./EditWhatsAppTemplateV2.js"),g=require("./ProductBox.js"),m=require("../../template-preview/helpers/templateMiscHelper.js"),y=require("../../template-preview/models/WhatsAppTemplate.js"),x=require("../../TypographyStyle.js"),f=require("../../../constants/Theme.js");function j(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var b=j(r);exports.default=({template:r,whatsappSpecificPickerMeta:j,showVariableModal:C,variableListForImage:O,discountCode:I,setDiscountCode:S})=>{var k,P,q,T,w,B,R,L;const{selectedCarouselIndex:E,setTemplate:M,pickerConf:D,isProductCarouselType:F,pod:V,cardCount:A,carouselProducts:N,setCarouselProducts:$,isError:_,cardImages:W,disableEditVariable:z,onDeleteSelectedProducts:G,setSelectedCarouselIndex:H,setVariableCallback:K,setShowVariablePicker:J,sliderRef:Q,setCarouselBodyError:U}=v.useTemplateModalContext(),[X,Y]=s.useState(m.isRCSChannel(null==r?void 0:r.channel)?"Carousel Cards":-1==E?"First Message (Step 1/2)":F?"Product Carousel "+((null===(P=null===(k=null==r?void 0:r.mapping)||void 0===k?void 0:k.body)||void 0===P?void 0:P.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(T=null===(q=null==r?void 0:r.mapping)||void 0===q?void 0:q.body)||void 0===T?void 0:T.length)?"(Step 2/2)":"")),[Z,ee]=s.useState(!1),[le,te]=s.useState(!1),ne=E===(null!=A?A:-1)-1,oe=(null!=E?E:-1)<1;s.useEffect((()=>{var e,l,t,n;Y(m.isRCSChannel(null==r?void 0:r.channel)?"Carousel Cards":-1==E?"First Message (Step 1/2)":F?"Product Carousel "+((null===(l=null===(e=null==r?void 0:r.mapping)||void 0===e?void 0:e.body)||void 0===l?void 0:l.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(n=null===(t=null==r?void 0:r.mapping)||void 0===t?void 0:t.body)||void 0===n?void 0:n.length)?"(Step 2/2)":""))}),[E]),s.useEffect((()=>{J(!1)}),[E]);const ie=e=>{null==$||$([{name:"variable",productName:e.actualValue}])};return s.useEffect((()=>{-1===E&&m.isRCSChannel(null==r?void 0:r.channel)&&(null==H||H(0))}),[E,null==r?void 0:r.channel]),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[!m.isRCSChannel(null==r?void 0:r.channel)&&null!=E&&E>=0&&!!(null===(B=null===(w=null==r?void 0:r.mapping)||void 0===w?void 0:w.body)||void 0===B?void 0:B.length)&&e.jsx(d.IconButton,{Icon:t.default,onClick:()=>{null==H||H(-1)}}),e.jsx(x.TitleMedium,Object.assign({style:{marginLeft:10}},{children:X}))]})),F&&(null!==(R=null==N?void 0:N.length)&&void 0!==R?R:0)>0&&null!=E&&E>=0&&e.jsxs("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsx(g.ProductBox,{editItem:()=>{1===(null==N?void 0:N.length)&&"variable"===N[0].name?(K((()=>ie)),J(!0)):ee(!Z)},cardBody:1===(null==N?void 0:N.length)&&"variable"===N[0].name?`${N[0].productName}`:`${null==N?void 0:N.length} Products Selected`,hideIcon:1===(null==N?void 0:N.length)&&"variable"===N[0].name,deleteItem:()=>{var e;if(1===(null==N?void 0:N.length)&&"variable"===N[0].name)return void(null==$||$([]));const l=b.default(Object.assign({},r));l&&(W&&W.length>0?null==W||W.forEach(((e,t)=>{var n;l.components[1].cards[t].components[0].example.header_handle=[null!==(n=W[t])&&void 0!==n?n:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==l?void 0:l.components[1].cards)||void 0===e||e.forEach(((e,t)=>{l.components[1].cards[t].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==M||M(l)),null==$||$([]),null==U||U(""),null==G||G()}}),N&&(null==N?void 0:N.length)>0&&"variable"!=N[0].name&&e.jsx(a.Button,{disabled:(null!==(L=null==N?void 0:N.length)&&void 0!==L?L:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{te(!0),ee(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!z&&F&&0===(null==N?void 0:N.length)&&null!=E&&E>=0&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsx(x.TitleRegular,{children:"Product(s)"}),e.jsx(x.BodySecondary,{children:`Select ${null!=A?A:1} products`})]})),e.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:_?16:12,marginRight:_?16:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsx(a.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:_?`2px dashed ${f.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:_?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:e.jsx(i.default,{width:18,height:18,color:f.COLORS.content.secondary})})),onClick:e=>{ee(!0)}}),V===y.POD.CHATBOT&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8,flex:1}}),e.jsx(x.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8,flex:1}})]})),e.jsx(a.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:_?`2px dashed ${f.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:_?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsx(i.default,{width:18,height:18,color:f.COLORS.content.secondary})})),onClick:e=>{K((()=>ie)),J(!0)}})]})]})),_&&e.jsx("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:e.jsx(p.Badge,{padding:"8px",errorText:"Please add products"})}))]}),!F&&(null!=E?E:-1)>-1&&e.jsxs("div",Object.assign({style:{display:"flex",background:f.COLORS.surface.hovered,alignItems:"center"}},{children:[e.jsx(d.IconButton,{Icon:n.default,disabled:oe,width:8,height:14,svgStyle:oe?{}:{color:f.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==Q?void 0:Q.current)||void 0===e||e.slickPrev(),(null!=E?E:-1)<1||null==H||H((e=>e-1))}}),e.jsx(x.TitleRegular,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:f.COLORS.content.secondary},{children:`Card ${(null!=E?E:0)+1}/${A}`})),e.jsx(d.IconButton,{Icon:o.default,width:8,height:14,disabled:ne,svgStyle:ne?{}:{color:f.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==Q?void 0:Q.current)||void 0===e||e.slickNext(),(null!=E?E:-1)>=(null!=A?A:-1)-1||null==H||H((e=>e+1))}})]})),e.jsx(h.default,{whatsappSpecificPickerMeta:j,template:r,onTemplateChange:e=>{null==M||M(e)},showVariableModal:C,variableListForImage:O,discountCode:I,setDiscountCode:S}),Z&&D&&e.jsx(c.ProductPickerModal,{zIndex:200,startupScreen:le?u.ScreenName.RearrangeProducts:u.ScreenName.Collections,rearrangeEnabled:!0,storeId:D.storeId,selectedItems:(e=>{if(e.length>0){const l={};for(const t of e){const e=null==t?void 0:t.collectionId,n=t.productId,o=t.variantId;e in l||(l[e]={products:{},name:"",image:"",isSmartCollection:!1}),n in l[e].products||(l[e].products[n]={variants:{},name:(null==t?void 0:t.productName)||"",image:(null==t?void 0:t.productImage)||""}),l[e].products[n].variants[o]={name:(null==t?void 0:t.name)||"",price:"",image:(null==t?void 0:t.image)||"",quantity:t.quantity||0,displayOrder:t.displayOrder}}return l}return{}})(null!=N?N:[]),collectionFetcher:D.fetchCollections,productFetcher:D.fetchProducts,onAdd:(e,l)=>{var t,n,o,i,s,a,d,c;te(!1);const u=[];delete e.isCustom;for(const l of Object.keys(e)){const r=e[l].products;if(void 0!==r&&Object.keys(r).length)for(const e of Object.keys(r)){const p=r[e].variants;if(void 0!==p&&Object.keys(p).length)for(const v of Object.keys(p)){const{name:h,image:g,quantity:m,displayOrder:y}=p[v],x={name:h,image:null!==(n=null!=g?g:null===(t=r[e])||void 0===t?void 0:t.image)&&void 0!==n?n:"",quantity:m,variantId:v,productId:e,displayOrder:y,collectionId:l,productName:null!==(i=null===(o=r[e])||void 0===o?void 0:o.name)&&void 0!==i?i:"",productImage:null!==(a=null===(s=r[e])||void 0===s?void 0:s.image)&&void 0!==a?a:"",productDescription:null!==(c=null===(d=r[e])||void 0===d?void 0:d.description)&&void 0!==c?c:""};u.push(x)}}}const p=u.sort(((e,l)=>e.displayOrder-l.displayOrder)),v=u.map((e=>e.image)),h=b.default(Object.assign({},r));h&&(v.forEach(((e,l)=>{var t;h.components[1].cards[l].components[0].example.header_handle=e?[e]:[null!==(t=null==W?void 0:W[l])&&void 0!==t?t:""]})),null==M||M(h)),null==$||$(p),null==U||U(""),ee(!1)},searchInCollectionFetcher:D.searchInCollection,searchFetcher:D.searchProducts,visible:Z,onClose:()=>{ee(!1)},exactLimit:null!=A?A:1,appType:D.appType||l.ApplicationType.BIK})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),l=require("@bikdotai/bik-models/growth/models/bik-store"),t=require("../../../assets/icons/arrow_back.svg.js"),n=require("../../../assets/icons/chevronLeft.svg.js"),o=require("../../../assets/icons/chevronRight.svg.js"),i=require("../../../assets/icons/PlusIcon.js"),r=require("lodash/cloneDeep"),s=require("react"),a=require("../../button/Button.js"),d=require("../../icon-button/IconButton.js"),c=require("../../product-picker-v2/modal.js"),u=require("../../product-picker-v2/type.js"),p=require("../Badge/index.js"),v=require("../context/templateModalContext.js"),h=require("./EditWhatsAppTemplateV2.js"),g=require("./ProductBox.js"),m=require("../../template-preview/helpers/templateMiscHelper.js"),y=require("../../template-preview/models/WhatsAppTemplate.js"),x=require("../../TypographyStyle.js"),f=require("../../../constants/Theme.js");function j(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var b=j(r);exports.default=r=>{let{template:j,whatsappSpecificPickerMeta:C,showVariableModal:O,variableListForImage:I,discountCode:S,setDiscountCode:k}=r;var P,q,T,w,B,R,L,E;const{selectedCarouselIndex:M,setTemplate:D,pickerConf:F,isProductCarouselType:V,pod:A,cardCount:N,carouselProducts:$,setCarouselProducts:_,isError:W,cardImages:z,disableEditVariable:G,onDeleteSelectedProducts:H,setSelectedCarouselIndex:K,setVariableCallback:J,setShowVariablePicker:Q,sliderRef:U,setCarouselBodyError:X}=v.useTemplateModalContext(),[Y,Z]=s.useState(m.isRCSChannel(null==j?void 0:j.channel)?"Carousel Cards":-1==M?"First Message (Step 1/2)":V?"Product Carousel "+((null===(q=null===(P=null==j?void 0:j.mapping)||void 0===P?void 0:P.body)||void 0===q?void 0:q.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(w=null===(T=null==j?void 0:j.mapping)||void 0===T?void 0:T.body)||void 0===w?void 0:w.length)?"(Step 2/2)":"")),[ee,le]=s.useState(!1),[te,ne]=s.useState(!1),oe=M===(null!=N?N:-1)-1,ie=(null!=M?M:-1)<1;s.useEffect((()=>{var e,l,t,n;Z(m.isRCSChannel(null==j?void 0:j.channel)?"Carousel Cards":-1==M?"First Message (Step 1/2)":V?"Product Carousel "+((null===(l=null===(e=null==j?void 0:j.mapping)||void 0===e?void 0:e.body)||void 0===l?void 0:l.length)?"(Step 2/2)":""):"Carousel Cards "+((null===(n=null===(t=null==j?void 0:j.mapping)||void 0===t?void 0:t.body)||void 0===n?void 0:n.length)?"(Step 2/2)":""))}),[M]),s.useEffect((()=>{Q(!1)}),[M]);const re=e=>{null==_||_([{name:"variable",productName:e.actualValue}])};return s.useEffect((()=>{-1===M&&m.isRCSChannel(null==j?void 0:j.channel)&&(null==K||K(0))}),[M,null==j?void 0:j.channel]),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"16px"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center"}},{children:[!m.isRCSChannel(null==j?void 0:j.channel)&&null!=M&&M>=0&&!!(null===(R=null===(B=null==j?void 0:j.mapping)||void 0===B?void 0:B.body)||void 0===R?void 0:R.length)&&e.jsx(d.IconButton,{Icon:t.default,onClick:()=>{null==K||K(-1)}}),e.jsx(x.TitleMedium,Object.assign({style:{marginLeft:10}},{children:Y}))]})),V&&(null!==(L=null==$?void 0:$.length)&&void 0!==L?L:0)>0&&null!=M&&M>=0&&e.jsxs("div",Object.assign({style:{display:"flex",rowGap:8,marginBottom:16,marginLeft:10,marginRight:10,flexDirection:"column"}},{children:[e.jsx(g.ProductBox,{editItem:()=>{1===(null==$?void 0:$.length)&&"variable"===$[0].name?(J((()=>re)),Q(!0)):le(!ee)},cardBody:1===(null==$?void 0:$.length)&&"variable"===$[0].name?`${$[0].productName}`:`${null==$?void 0:$.length} Products Selected`,hideIcon:1===(null==$?void 0:$.length)&&"variable"===$[0].name,deleteItem:()=>{var e;if(1===(null==$?void 0:$.length)&&"variable"===$[0].name)return void(null==_||_([]));const l=b.default(Object.assign({},j));l&&(z&&z.length>0?null==z||z.forEach(((e,t)=>{var n;l.components[1].cards[t].components[0].example.header_handle=[null!==(n=z[t])&&void 0!==n?n:"https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})):null===(e=null==l?void 0:l.components[1].cards)||void 0===e||e.forEach(((e,t)=>{l.components[1].cards[t].components[0].example.header_handle=["https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png"]})),null==D||D(l)),null==_||_([]),null==X||X(""),null==H||H()}}),$&&(null==$?void 0:$.length)>0&&"variable"!=$[0].name&&e.jsx(a.Button,{disabled:(null!==(E=null==$?void 0:$.length)&&void 0!==E?E:0)<=1,style:{alignSelf:"flex-end"},onClick:()=>{ne(!0),le(!0)},buttonText:"Rearrange Products",buttonType:"tertiary"})]})),!G&&V&&0===(null==$?void 0:$.length)&&null!=M&&M>=0&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{marginLeft:12}},{children:[e.jsx(x.TitleRegular,{children:"Product(s)"}),e.jsx(x.BodySecondary,{children:`Select ${null!=N?N:1} products`})]})),e.jsxs("div",Object.assign({style:{marginTop:16,marginBottom:16,marginLeft:W?16:12,marginRight:W?16:12,flexDirection:"column",display:"flex",alignItems:"center"}},{children:[e.jsx(a.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",width:"100%",marginBottom:12,border:W?`2px dashed ${f.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s)",buttonType:W?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex",width:18,height:18}},{children:e.jsx(i.default,{width:18,height:18,color:f.COLORS.content.secondary})})),onClick:e=>{le(!0)}}),A===y.POD.CHATBOT&&e.jsxs(e.Fragment,{children:[e.jsxs("div",Object.assign({style:{display:"flex",flex:1,alignItems:"center",justifyContent:"space-between",flexDirection:"row",width:"100%"}},{children:[e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginRight:8,flex:1}}),e.jsx(x.BodyCaption,Object.assign({style:{color:"#616161",overflow:"unset"}},{children:"OR"})),e.jsx("div",{style:{width:"100%",height:1,backgroundColor:"#E0E0E0",marginLeft:8,flex:1}})]})),e.jsx(a.Button,{matchParentWidth:!0,style:{flex:1,display:"flex",marginTop:12,width:"100%",border:W?`2px dashed ${f.COLORS.content.negative}`:void 0},size:"medium",buttonText:"Add Product(s) Variable",buttonType:W?"tertiaryGray":"dashBold",LeadingIcon:()=>e.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsx(i.default,{width:18,height:18,color:f.COLORS.content.secondary})})),onClick:e=>{J((()=>re)),Q(!0)}})]})]})),W&&e.jsx("div",Object.assign({style:{marginLeft:10,marginBottom:16}},{children:e.jsx(p.Badge,{padding:"8px",errorText:"Please add products"})}))]}),!V&&(null!=M?M:-1)>-1&&e.jsxs("div",Object.assign({style:{display:"flex",background:f.COLORS.surface.hovered,alignItems:"center"}},{children:[e.jsx(d.IconButton,{Icon:n.default,disabled:ie,width:8,height:14,svgStyle:ie?{}:{color:f.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==U?void 0:U.current)||void 0===e||e.slickPrev(),(null!=M?M:-1)<1||null==K||K((e=>e-1))}}),e.jsx(x.TitleRegular,Object.assign({style:{flex:1,display:"flex",justifyContent:"center"},color:f.COLORS.content.secondary},{children:`Card ${(null!=M?M:0)+1}/${N}`})),e.jsx(d.IconButton,{Icon:o.default,width:8,height:14,disabled:oe,svgStyle:oe?{}:{color:f.COLORS.content.secondary},onClick:()=>{var e;null===(e=null==U?void 0:U.current)||void 0===e||e.slickNext(),(null!=M?M:-1)>=(null!=N?N:-1)-1||null==K||K((e=>e+1))}})]})),e.jsx(h.default,{whatsappSpecificPickerMeta:C,template:j,onTemplateChange:e=>{null==D||D(e)},showVariableModal:O,variableListForImage:I,discountCode:S,setDiscountCode:k}),ee&&F&&e.jsx(c.ProductPickerModal,{zIndex:200,startupScreen:te?u.ScreenName.RearrangeProducts:u.ScreenName.Collections,rearrangeEnabled:!0,storeId:F.storeId,selectedItems:(e=>{if(e.length>0){const l={};for(const t of e){const e=null==t?void 0:t.collectionId,n=t.productId,o=t.variantId;e in l||(l[e]={products:{},name:"",image:"",isSmartCollection:!1}),n in l[e].products||(l[e].products[n]={variants:{},name:(null==t?void 0:t.productName)||"",image:(null==t?void 0:t.productImage)||""}),l[e].products[n].variants[o]={name:(null==t?void 0:t.name)||"",price:"",image:(null==t?void 0:t.image)||"",quantity:t.quantity||0,displayOrder:t.displayOrder}}return l}return{}})(null!=$?$:[]),collectionFetcher:F.fetchCollections,productFetcher:F.fetchProducts,onAdd:(e,l)=>{var t,n,o,i,r,s,a,d;ne(!1);const c=[];delete e.isCustom;for(const l of Object.keys(e)){const u=e[l].products;if(void 0!==u&&Object.keys(u).length)for(const e of Object.keys(u)){const p=u[e].variants;if(void 0!==p&&Object.keys(p).length)for(const v of Object.keys(p)){const{name:h,image:g,quantity:m,displayOrder:y}=p[v],x={name:h,image:null!==(n=null!=g?g:null===(t=u[e])||void 0===t?void 0:t.image)&&void 0!==n?n:"",quantity:m,variantId:v,productId:e,displayOrder:y,collectionId:l,productName:null!==(i=null===(o=u[e])||void 0===o?void 0:o.name)&&void 0!==i?i:"",productImage:null!==(s=null===(r=u[e])||void 0===r?void 0:r.image)&&void 0!==s?s:"",productDescription:null!==(d=null===(a=u[e])||void 0===a?void 0:a.description)&&void 0!==d?d:""};c.push(x)}}}const u=c.sort(((e,l)=>e.displayOrder-l.displayOrder)),p=c.map((e=>e.image)),v=b.default(Object.assign({},j));v&&(p.forEach(((e,l)=>{var t;v.components[1].cards[l].components[0].example.header_handle=e?[e]:[null!==(t=null==z?void 0:z[l])&&void 0!==t?t:""]})),null==D||D(v)),null==_||_(u),null==X||X(""),le(!1)},searchInCollectionFetcher:F.searchInCollection,searchFetcher:F.searchProducts,visible:ee,onClose:()=>{le(!1)},exactLimit:null!=N?N:1,appType:F.appType||l.ApplicationType.BIK})]}))};
 //# sourceMappingURL=EditWhatsAppCarouselTemplateV2.js.map

package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EditWhatsAppCarouselTemplateV2.js","sources":["../../../../../src/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.tsx"],"sourcesContent":["import { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';\nimport BackIcon from '@src/assets/icons/arrow_back.svg';\nimport LeftIcon from '@src/assets/icons/chevronLeft.svg';\nimport RightIcon from '@src/assets/icons/chevronRight.svg';\nimport PlusIcon from '@src/assets/icons/PlusIcon';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { useEffect, useState } from 'react';\nimport type {\n\tVariable,\n\tVariableListInterfaceV2,\n} from '@src/components/add-variableV2/AddVariableV2';\nimport { Button } from '@src/components/button/Button';\nimport { IconButton } from '@src/components/icon-button/IconButton';\nimport { ProductPickerModal } from '@src/components/product-picker-v2/modal';\nimport type { SelectedItems } from '@src/components/product-picker-v2/type';\nimport { ScreenName } from '@src/components/product-picker-v2/type';\nimport { Badge } from '@src/components/template-context-mapper/Badge';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport EditWhatsAppTemplateV2 from '@src/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2';\nimport { ProductBox } from '@src/components/template-context-mapper/modalElements/ProductBox';\nimport { isRCSChannel } from '@src/components/template-preview/helpers/templateMiscHelper';\nimport type { EmailTemplateType } from '@src/components/template-preview/models/EmailTemplate';\nimport type { SMSTemplateType } from '@src/components/template-preview/models/SmsTemplate';\nimport type { WhatsAppCarouselTemplate } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport {\n\tPOD,\n\ttype WhatsAppPickerMeta,\n\ttype WhatsAppTemplate,\n} from '@src/components/template-preview/models/WhatsAppTemplate';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleMedium,\n\tTitleRegular,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { CarouselProduct } from './modal';\n\nexport interface EditWhatsAppCarouselTemplateV2Props {\n\twhatsappSpecificPickerMeta?: WhatsAppPickerMeta;\n\ttemplate: WhatsAppCarouselTemplate;\n\tshowVariableModal?: boolean;\n\tvariableListForImage?: VariableListInterfaceV2[];\n\tdiscountCode?: string;\n\tsetDiscountCode?: (code: string) => void;\n}\n\nconst EditWhatsAppCarouselTemplateV2 = ({\n\ttemplate,\n\twhatsappSpecificPickerMeta,\n\tshowVariableModal,\n\tvariableListForImage,\n\tdiscountCode,\n\tsetDiscountCode,\n}: EditWhatsAppCarouselTemplateV2Props) => {\n\tconst {\n\t\tselectedCarouselIndex,\n\t\tsetTemplate,\n\t\tpickerConf,\n\t\tisProductCarouselType,\n\t\tpod,\n\t\tcardCount,\n\t\tcarouselProducts,\n\t\tsetCarouselProducts,\n\t\tisError,\n\t\tcardImages,\n\t\tdisableEditVariable,\n\t\tonDeleteSelectedProducts,\n\t\tsetSelectedCarouselIndex,\n\t\tsetVariableCallback,\n\t\tsetShowVariablePicker,\n\t\tsliderRef,\n\t\tsetCarouselBodyError,\n\t} = useTemplateModalContext();\n\tconst [titleText, setTitleText] = useState<string>(\n\t\tisRCSChannel(template?.channel)\n\t\t\t? 'Carousel Cards'\n\t\t\t: selectedCarouselIndex == -1\n\t\t\t? 'First Message (Step 1/2)'\n\t\t\t: isProductCarouselType\n\t\t\t? `Product Carousel ${\n\t\t\t\t\ttemplate?.mapping?.body?.length ? '(Step 2/2)' : ''\n\t\t\t }`\n\t\t\t: `Carousel Cards ${template?.mapping?.body?.length ? '(Step 2/2)' : ''}`,\n\t);\n\tconst [showProductPicker, setShowProductPicker] = useState<boolean>(false);\n\tconst [rearrangeProducts, setRearrangeProducts] = useState<boolean>(false);\n\n\tconst shouldHideRightArrow = selectedCarouselIndex === (cardCount ?? -1) - 1;\n\tconst shouldHideLeftArrow = (selectedCarouselIndex ?? -1) < 1;\n\n\tuseEffect(() => {\n\t\tsetTitleText(\n\t\t\tisRCSChannel(template?.channel)\n\t\t\t\t? 'Carousel Cards'\n\t\t\t\t: selectedCarouselIndex == -1\n\t\t\t\t? 'First Message (Step 1/2)'\n\t\t\t\t: isProductCarouselType\n\t\t\t\t? `Product Carousel ${\n\t\t\t\t\t\ttemplate?.mapping?.body?.length ? '(Step 2/2)' : ''\n\t\t\t\t }`\n\t\t\t\t: `Carousel Cards ${\n\t\t\t\t\t\ttemplate?.mapping?.body?.length ? '(Step 2/2)' : ''\n\t\t\t\t }`,\n\t\t);\n\t}, [selectedCarouselIndex]);\n\n\tuseEffect(() => {\n\t\tsetShowVariablePicker(false);\n\t}, [selectedCarouselIndex]);\n\n\tconst onItemsPicked = (items: SelectedItems, total: number) => {\n\t\tsetRearrangeProducts(false);\n\t\tconst selectedList: any[] = [];\n\t\tdelete items['isCustom'];\n\t\tfor (const key of Object.keys(items)) {\n\t\t\tconst products = items[key].products;\n\t\t\tif (typeof products === 'undefined') continue;\n\t\t\tif (!Object.keys(products).length) continue;\n\t\t\tfor (const productId of Object.keys(products)) {\n\t\t\t\tconst variants = products[productId].variants;\n\t\t\t\tif (typeof variants === 'undefined') continue;\n\t\t\t\tif (!Object.keys(variants).length) continue;\n\t\t\t\tfor (const variantId of Object.keys(variants)) {\n\t\t\t\t\tconst { name, image, quantity, displayOrder } = variants[variantId];\n\t\t\t\t\tconst obj = {\n\t\t\t\t\t\tname,\n\t\t\t\t\t\timage: image ?? products[productId]?.image ?? '',\n\t\t\t\t\t\tquantity,\n\t\t\t\t\t\tvariantId,\n\t\t\t\t\t\tproductId,\n\t\t\t\t\t\tdisplayOrder,\n\t\t\t\t\t\tcollectionId: key,\n\t\t\t\t\t\tproductName: products[productId]?.name ?? '',\n\t\t\t\t\t\tproductImage: products[productId]?.image ?? '',\n\t\t\t\t\t\tproductDescription: products[productId]?.description ?? '',\n\t\t\t\t\t};\n\t\t\t\t\tselectedList.push(obj);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tconst sortedSelectedList = selectedList.sort(\n\t\t\t(a: any, b: any) => a.displayOrder - b.displayOrder,\n\t\t);\n\t\tconst selectedImages = selectedList.map((product) => product.image);\n\n\t\tconst selectedTemplate = cloneDeep({ ...template });\n\t\tif (selectedTemplate) {\n\t\t\tselectedImages.forEach((image, index) => {\n\t\t\t\tif (image) {\n\t\t\t\t\tselectedTemplate.components![1].cards![\n\t\t\t\t\t\tindex\n\t\t\t\t\t].components[0].example!.header_handle = [image];\n\t\t\t\t} else {\n\t\t\t\t\tselectedTemplate.components![1].cards![\n\t\t\t\t\t\tindex\n\t\t\t\t\t].components[0].example!.header_handle = [cardImages?.[index] ?? ''];\n\t\t\t\t}\n\t\t\t});\n\t\t\tsetTemplate?.(selectedTemplate as WhatsAppCarouselTemplate);\n\t\t}\n\t\tsetCarouselProducts?.(sortedSelectedList);\n\t\tsetCarouselBodyError?.('');\n\t\tsetShowProductPicker(false);\n\t};\n\n\tconst generatePickerData = (selectedList: CarouselProduct[]) => {\n\t\tif (selectedList.length > 0) {\n\t\t\tconst obj = {};\n\t\t\tfor (const item of selectedList) {\n\t\t\t\tconst collectionId = item?.collectionId;\n\t\t\t\tconst productId = item.productId;\n\t\t\t\tconst variantId = item.variantId;\n\t\t\t\tif (!(collectionId in obj)) {\n\t\t\t\t\tobj[collectionId] = {\n\t\t\t\t\t\tproducts: {},\n\t\t\t\t\t\tname: '',\n\t\t\t\t\t\timage: '',\n\t\t\t\t\t\tisSmartCollection: false,\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\tif (!(productId in obj[collectionId].products!)) {\n\t\t\t\t\tobj[collectionId].products![productId] = {\n\t\t\t\t\t\tvariants: {},\n\t\t\t\t\t\tname: item?.productName \|\| '',\n\t\t\t\t\t\timage: item?.productImage \|\| '',\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\tobj[collectionId].products![productId].variants![variantId] = {\n\t\t\t\t\tname: item?.name \|\| '',\n\t\t\t\t\tprice: '',\n\t\t\t\t\timage: item?.image \|\| '',\n\t\t\t\t\tquantity: item.quantity \|\| 0,\n\t\t\t\t\tdisplayOrder: item.displayOrder,\n\t\t\t\t};\n\t\t\t}\n\t\t\treturn obj;\n\t\t}\n\t\treturn {};\n\t};\n\n\tconst deleteItem = () => {\n\t\tif (\n\t\t\tcarouselProducts?.length === 1 &&\n\t\t\tcarouselProducts[0].name === 'variable'\n\t\t) {\n\t\t\tsetCarouselProducts?.([]);\n\t\t\treturn;\n\t\t}\n\t\tconst selectedTemplate = cloneDeep({ ...template });\n\t\tif (selectedTemplate) {\n\t\t\tif (cardImages && cardImages.length > 0) {\n\t\t\t\tcardImages?.forEach((image, index) => {\n\t\t\t\t\tselectedTemplate.components![1].cards![\n\t\t\t\t\t\tindex\n\t\t\t\t\t].components[0].example!.header_handle = [\n\t\t\t\t\t\tcardImages[index] ??\n\t\t\t\t\t\t\t'https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png',\n\t\t\t\t\t];\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tselectedTemplate?.components![1].cards?.forEach((image, index) => {\n\t\t\t\t\tselectedTemplate.components![1].cards![\n\t\t\t\t\t\tindex\n\t\t\t\t\t].components[0].example!.header_handle = [\n\t\t\t\t\t\t'https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png',\n\t\t\t\t\t];\n\t\t\t\t});\n\t\t\t}\n\t\t\tsetTemplate?.(selectedTemplate as WhatsAppCarouselTemplate);\n\t\t}\n\t\tsetCarouselProducts?.([]);\n\t\tsetCarouselBodyError?.('');\n\t\tonDeleteSelectedProducts?.();\n\t};\n\n\tconst handleVariableCallback = (variable: Variable) => {\n\t\tsetCarouselProducts?.([\n\t\t\t{\n\t\t\t\tname: 'variable',\n\t\t\t\tproductName: variable.actualValue,\n\t\t\t} as any,\n\t\t]);\n\t};\n\n\tuseEffect(() => {\n\t\tif (selectedCarouselIndex === -1 && isRCSChannel(template?.channel)) {\n\t\t\tsetSelectedCarouselIndex?.(0);\n\t\t}\n\t}, [selectedCarouselIndex, template?.channel]);\n\n\treturn (\n\t\t<div style={{ display: 'flex', flexDirection: 'column', gap: '16px' }}>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\talignItems: 'center',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{!isRCSChannel(template?.channel) &&\n\t\t\t\t\tselectedCarouselIndex != undefined &&\n\t\t\t\t\tselectedCarouselIndex >= 0 &&\n\t\t\t\t\t!!template?.mapping?.body?.length && (\n\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\tIcon={BackIcon}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetSelectedCarouselIndex?.(-1);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t<TitleMedium style={{ marginLeft: 10 }}>{titleText}</TitleMedium>\n\t\t\t</div>\n\t\t\t{isProductCarouselType &&\n\t\t\t\t(carouselProducts?.length ?? 0) > 0 &&\n\t\t\t\tselectedCarouselIndex != undefined &&\n\t\t\t\tselectedCarouselIndex >= 0 && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\trowGap: 8,\n\t\t\t\t\t\t\tmarginBottom: 16,\n\t\t\t\t\t\t\tmarginLeft: 10,\n\t\t\t\t\t\t\tmarginRight: 10,\n\t\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ProductBox\n\t\t\t\t\t\t\teditItem={() => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\tcarouselProducts?.length === 1 &&\n\t\t\t\t\t\t\t\t\tcarouselProducts[0].name === 'variable'\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\tsetVariableCallback(() => handleVariableCallback);\n\t\t\t\t\t\t\t\t\tsetShowVariablePicker(true);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tsetShowProductPicker(!showProductPicker);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tcardBody={\n\t\t\t\t\t\t\t\tcarouselProducts?.length === 1 &&\n\t\t\t\t\t\t\t\tcarouselProducts[0].name === 'variable'\n\t\t\t\t\t\t\t\t\t? `${carouselProducts[0].productName}`\n\t\t\t\t\t\t\t\t\t: `${carouselProducts?.length} Products Selected`\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\thideIcon={\n\t\t\t\t\t\t\t\tcarouselProducts?.length === 1 &&\n\t\t\t\t\t\t\t\tcarouselProducts[0].name === 'variable'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdeleteItem={deleteItem}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{carouselProducts &&\n\t\t\t\t\t\t\tcarouselProducts?.length > 0 &&\n\t\t\t\t\t\t\tcarouselProducts[0].name != 'variable' && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tdisabled={(carouselProducts?.length ?? 0) <= 1}\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\talignSelf: 'flex-end',\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetRearrangeProducts(true);\n\t\t\t\t\t\t\t\t\t\tsetShowProductPicker(true);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tbuttonText=\"Rearrange Products\"\n\t\t\t\t\t\t\t\t\tbuttonType=\"tertiary\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t{!disableEditVariable &&\n\t\t\t\tisProductCarouselType &&\n\t\t\t\tcarouselProducts?.length === 0 &&\n\t\t\t\tselectedCarouselIndex != undefined &&\n\t\t\t\tselectedCarouselIndex >= 0 && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<div style={{ marginLeft: 12 }}>\n\t\t\t\t\t\t\t<TitleRegular>Product(s)</TitleRegular>\n\t\t\t\t\t\t\t<BodySecondary>{`Select ${\n\t\t\t\t\t\t\t\tcardCount ?? 1\n\t\t\t\t\t\t\t} products`}</BodySecondary>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tmarginTop: 16,\n\t\t\t\t\t\t\t\tmarginBottom: 16,\n\t\t\t\t\t\t\t\tmarginLeft: isError ? 16 : 12,\n\t\t\t\t\t\t\t\tmarginRight: isError ? 16 : 12,\n\t\t\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tmatchParentWidth\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\tmarginBottom: 12,\n\t\t\t\t\t\t\t\t\tborder: isError\n\t\t\t\t\t\t\t\t\t\t? `2px dashed ${COLORS.content.negative}`\n\t\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tsize={'medium'}\n\t\t\t\t\t\t\t\tbuttonText={'Add Product(s)'}\n\t\t\t\t\t\t\t\tbuttonType={isError ? 'tertiaryGray' : 'dashBold'}\n\t\t\t\t\t\t\t\tLeadingIcon={() => (\n\t\t\t\t\t\t\t\t\t<div style={{ display: 'flex', width: 18, height: 18 }}>\n\t\t\t\t\t\t\t\t\t\t<PlusIcon\n\t\t\t\t\t\t\t\t\t\t\twidth={18}\n\t\t\t\t\t\t\t\t\t\t\theight={18}\n\t\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\tsetShowProductPicker(true);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{pod === POD.CHATBOT && (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\t\t\t\theight: 1,\n\t\t\t\t\t\t\t\t\t\t\t\tbackgroundColor: '#E0E0E0',\n\t\t\t\t\t\t\t\t\t\t\t\tmarginRight: 8,\n\t\t\t\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ color: '#616161', overflow: 'unset' }}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\tOR\n\t\t\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\t\t\t\theight: 1,\n\t\t\t\t\t\t\t\t\t\t\t\tbackgroundColor: '#E0E0E0',\n\t\t\t\t\t\t\t\t\t\t\t\tmarginLeft: 8,\n\t\t\t\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tmatchParentWidth\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\tmarginTop: 12,\n\t\t\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\t\t\tborder: isError\n\t\t\t\t\t\t\t\t\t\t\t\t? `2px dashed ${COLORS.content.negative}`\n\t\t\t\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tsize={'medium'}\n\t\t\t\t\t\t\t\t\t\tbuttonText={'Add Product(s) Variable'}\n\t\t\t\t\t\t\t\t\t\tbuttonType={isError ? 'tertiaryGray' : 'dashBold'}\n\t\t\t\t\t\t\t\t\t\tLeadingIcon={() => (\n\t\t\t\t\t\t\t\t\t\t\t<div style={{ display: 'flex' }}>\n\t\t\t\t\t\t\t\t\t\t\t\t<PlusIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth={18}\n\t\t\t\t\t\t\t\t\t\t\t\t\theight={18}\n\t\t\t\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tsetVariableCallback(() => handleVariableCallback);\n\t\t\t\t\t\t\t\t\t\t\tsetShowVariablePicker(true);\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{isError && (\n\t\t\t\t\t\t\t<div style={{ marginLeft: 10, marginBottom: 16 }}>\n\t\t\t\t\t\t\t\t<Badge padding={'8px'} errorText={'Please add products'} />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t{!isProductCarouselType && (selectedCarouselIndex ?? -1) > -1 && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tbackground: COLORS.surface.hovered,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<IconButton\n\t\t\t\t\t\tIcon={LeftIcon}\n\t\t\t\t\t\tdisabled={shouldHideLeftArrow}\n\t\t\t\t\t\twidth={8}\n\t\t\t\t\t\theight={14}\n\t\t\t\t\t\tsvgStyle={\n\t\t\t\t\t\t\t!shouldHideLeftArrow ? { color: COLORS.content.secondary } : {}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t//@ts-ignore\n\t\t\t\t\t\t\tsliderRef?.current?.slickPrev();\n\t\t\t\t\t\t\tif ((selectedCarouselIndex ?? -1) < 1) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsetSelectedCarouselIndex?.((prev) => prev - 1);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\tstyle={{ flex: 1, display: 'flex', justifyContent: 'center' }}\n\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t>{`Card ${\n\t\t\t\t\t\t(selectedCarouselIndex ?? 0) + 1\n\t\t\t\t\t}/${cardCount}`}</TitleRegular>\n\n\t\t\t\t\t<IconButton\n\t\t\t\t\t\tIcon={RightIcon}\n\t\t\t\t\t\twidth={8}\n\t\t\t\t\t\theight={14}\n\t\t\t\t\t\tdisabled={shouldHideRightArrow}\n\t\t\t\t\t\tsvgStyle={\n\t\t\t\t\t\t\t!shouldHideRightArrow ? { color: COLORS.content.secondary } : {}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t//@ts-ignore\n\t\t\t\t\t\t\tsliderRef?.current?.slickNext();\n\t\t\t\t\t\t\tif ((selectedCarouselIndex ?? -1) >= (cardCount ?? -1) - 1) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsetSelectedCarouselIndex?.((prev) => prev + 1);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<EditWhatsAppTemplateV2\n\t\t\t\twhatsappSpecificPickerMeta={whatsappSpecificPickerMeta}\n\t\t\t\ttemplate={template as WhatsAppTemplate}\n\t\t\t\tonTemplateChange={(\n\t\t\t\t\ttemplate:\n\t\t\t\t\t\t\| WhatsAppTemplate\n\t\t\t\t\t\t\| EmailTemplateType\n\t\t\t\t\t\t\| SMSTemplateType\n\t\t\t\t\t\t\| WhatsAppCarouselTemplate,\n\t\t\t\t) => {\n\t\t\t\t\tsetTemplate?.(template);\n\t\t\t\t}}\n\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\tvariableListForImage={variableListForImage}\n\t\t\t\tdiscountCode={discountCode}\n\t\t\t\tsetDiscountCode={setDiscountCode}\n\t\t\t/>\n\t\t\t{showProductPicker && pickerConf && (\n\t\t\t\t<ProductPickerModal\n\t\t\t\t\tzIndex={200}\n\t\t\t\t\tstartupScreen={\n\t\t\t\t\t\trearrangeProducts\n\t\t\t\t\t\t\t? ScreenName.RearrangeProducts\n\t\t\t\t\t\t\t: ScreenName.Collections\n\t\t\t\t\t}\n\t\t\t\t\trearrangeEnabled={true}\n\t\t\t\t\tstoreId={pickerConf.storeId}\n\t\t\t\t\tselectedItems={generatePickerData(carouselProducts ?? [])}\n\t\t\t\t\tcollectionFetcher={pickerConf.fetchCollections}\n\t\t\t\t\tproductFetcher={pickerConf.fetchProducts}\n\t\t\t\t\tonAdd={onItemsPicked}\n\t\t\t\t\tsearchInCollectionFetcher={pickerConf.searchInCollection}\n\t\t\t\t\tsearchFetcher={pickerConf.searchProducts}\n\t\t\t\t\tvisible={showProductPicker}\n\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\tsetShowProductPicker(false);\n\t\t\t\t\t}}\n\t\t\t\t\texactLimit={cardCount ?? 1}\n\t\t\t\t\tappType={pickerConf.appType \|\| ApplicationType.BIK}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default EditWhatsAppCarouselTemplateV2;\n"],"names":["EditWhatsAppCarouselTemplateV2","template","whatsappSpecificPickerMeta","showVariableModal","variableListForImage","discountCode","setDiscountCode","selectedCarouselIndex","setTemplate","pickerConf","isProductCarouselType","pod","cardCount","carouselProducts","setCarouselProducts","isError","cardImages","disableEditVariable","onDeleteSelectedProducts","setSelectedCarouselIndex","setVariableCallback","setShowVariablePicker","sliderRef","setCarouselBodyError","useTemplateModalContext","titleText","setTitleText","useState","isRCSChannel","channel","_b","_a","mapping","body","length","_d","_c","showProductPicker","setShowProductPicker","rearrangeProducts","setRearrangeProducts","shouldHideRightArrow","shouldHideLeftArrow","useEffect","handleVariableCallback","variable","name","productName","actualValue","_jsxs","style","display","flexDirection","gap","children","jsxs","Object","assign","alignItems","undefined","_f","_e","_jsx","jsx","IconButton","Icon","BackIcon","onClick","TitleMedium","marginLeft","_g","rowGap","marginBottom","marginRight","ProductBox","editItem","cardBody","hideIcon","deleteItem","selectedTemplate","cloneDeep","forEach","image","index","components","cards","example","header_handle","Button","disabled","_h","alignSelf","buttonText","buttonType","TitleRegular","BodySecondary","marginTop","matchParentWidth","flex","width","border","COLORS","content","negative","size","LeadingIcon","height","PlusIcon","color","secondary","e","POD","CHATBOT","_Fragment","justifyContent","backgroundColor","BodyCaption","overflow","Badge","padding","errorText","background","surface","hovered","LeftIcon","svgStyle","current","slickPrev","prev","RightIcon","slickNext","EditWhatsAppTemplateV2","onTemplateChange","ProductPickerModal","zIndex","startupScreen","ScreenName","RearrangeProducts","Collections","rearrangeEnabled","storeId","selectedItems","selectedList","obj","item","collectionId","productId","variantId","products","isSmartCollection","variants","productImage","price","quantity","displayOrder","generatePickerData","collectionFetcher","fetchCollections","productFetcher","fetchProducts","onAdd","onItemsPicked","items","total","key","keys","productDescription","description","push","sortedSelectedList","sort","a","b","selectedImages","map","product","searchInCollectionFetcher","searchInCollection","searchFetcher","searchProducts","visible","onClose","exactLimit","appType","ApplicationType","BIK"],"mappings":"uhCA+CuCA,EACtCC,WACAC,6BACAC,oBACAC,uBACAC,eACAC,0CAEA,MAAMC,sBACLA,EAAqBC,YACrBA,EAAWC,WACXA,EAAUC,sBACVA,EAAqBC,IACrBA,EAAGC,UACHA,EAASC,iBACTA,EAAgBC,oBAChBA,EAAmBC,QACnBA,EAAOC,WACPA,EAAUC,oBACVA,EAAmBC,yBACnBA,EAAwBC,yBACxBA,EAAwBC,oBACxBA,EAAmBC,sBACnBA,EAAqBC,UACrBA,EAASC,qBACTA,GACGC,EAAuBA,2BACpBC,EAAWC,GAAgBC,EAAAA,SACjCC,EAAAA,aAAa3B,eAAAA,EAAU4B,SACpB,kBAC0B,GAA1BtB,EACA,2BACAG,EACA,sBACuB,QAAvBoB,UAAAC,EAAA9B,aAAA,EAAAA,EAAU+B,8BAASC,YAAI,IAAAH,OAAA,EAAAA,EAAEI,QAAS,aAAe,IAEjD,oBAA2C,QAAzBC,EAAiB,QAAjBC,EAAAnC,aAAQ,EAARA,EAAU+B,eAAO,IAAAI,OAAA,EAAAA,EAAEH,YAAM,IAAAE,OAAA,EAAAA,EAAAD,QAAS,aAAe,MAEhEG,EAAmBC,IAAwBX,EAAQA,UAAU,IAC7DY,GAAmBC,IAAwBb,EAAQA,UAAU,GAE9Dc,GAAuBlC,KAA2BK,QAAAA,GAAc,GAAK,EACrE8B,IAAuBnC,QAAAA,GAA0B,GAAK,EAE5DoC,EAAAA,WAAU,iBACTjB,EACCE,EAAYA,aAAC3B,aAAA,EAAAA,EAAU4B,SACpB,kBAC0B,GAA1BtB,EACA,2BACAG,EACA,sBACuB,QAAvBoB,UAAAC,EAAA9B,aAAA,EAAAA,EAAU+B,8BAASC,YAAI,IAAAH,OAAA,EAAAA,EAAEI,QAAS,aAAe,IAEjD,oBACyB,QAAzBC,EAAiB,QAAjBC,EAAAnC,aAAQ,EAARA,EAAU+B,eAAO,IAAAI,OAAA,EAAAA,EAAEH,YAAM,IAAAE,OAAA,EAAAA,EAAAD,QAAS,aAAe,IAEpD,GACC,CAAC3B,IAEJoC,EAAAA,WAAU,KACTtB,GAAsB,EAAM,GAC1B,CAACd,IAEJ,MAgIMqC,GAA0BC,IAC/B/B,SAAAA,EAAsB,CACrB,CACCgC,KAAM,WACNC,YAAaF,EAASG,cAEtB,EASH,OANAL,EAAAA,WAAU,MACsB,IAA3BpC,GAAgCqB,EAAYA,aAAC3B,aAAA,EAAAA,EAAU4B,WAC1DV,SAAAA,EAA2B,GAC3B,GACC,CAACZ,EAAuBN,aAAQ,EAARA,EAAU4B,UAGpCoB,4BAAKC,MAAO,CAAEC,QAAS,OAAQC,cAAe,SAAUC,IAAK,SAC5D,CAAAC,SAAA,CAAAL,EAAAM,KAAA,MAAAC,OAAAC,OAAA,CACCP,MAAO,CACNC,QAAS,OACTC,cAAe,MACfM,WAAY,WAGZ,CAAAJ,SAAA,EAAC1B,EAAYA,aAAC3B,aAAA,EAAAA,EAAU4B,UACC8B,MAAzBpD,GACAA,GAAyB,MACA,QAAvBqD,EAAiB,QAAjBC,EAAA5D,aAAQ,EAARA,EAAU+B,eAAO,IAAA6B,OAAA,EAAAA,EAAE5B,YAAI,IAAA2B,OAAA,EAAAA,EAAE1B,SAC1B4B,EAACC,IAAAC,aACA,CAAAC,KAAMC,EAAQ,QACdC,QAASA,KACRhD,SAAAA,GAA4B,EAAE,IAIlC2C,MAACM,cAAWZ,OAAAC,OAAA,CAACP,MAAO,CAAEmB,WAAY,KAAI,CAAAf,SAAG7B,SAEzCf,IAC6B,QAA5B4D,EAAAzD,aAAA,EAAAA,EAAkBqB,cAAU,IAAAoC,EAAAA,EAAA,GAAK,GACTX,MAAzBpD,GACAA,GAAyB,GACxB0C,EAAAA,KAAA,MAAAO,OAAAC,OAAA,CACCP,MAAO,CACNC,QAAS,OACToB,OAAQ,EACRC,aAAc,GACdH,WAAY,GACZI,YAAa,GACbrB,cAAe,WACf,CAAAE,SAAA,CAEDQ,MAACY,aAAU,CACVC,SAAUA,KAEqB,KAA7B9D,eAAAA,EAAkBqB,SACW,aAA7BrB,EAAiB,GAAGiC,MAEpB1B,GAAoB,IAAMwB,KAC1BvB,GAAsB,IAEtBiB,IAAsBD,EACtB,EAEFuC,SAC8B,KAA7B/D,aAAgB,EAAhBA,EAAkBqB,SACW,aAA7BrB,EAAiB,GAAGiC,KACjB,GAAGjC,EAAiB,GAAGkC,cACvB,GAAGlC,aAAA,EAAAA,EAAkBqB,2BAEzB2C,SAC8B,KAA7BhE,eAAAA,EAAkBqB,SACW,aAA7BrB,EAAiB,GAAGiC,KAErBgC,WA5GaA,WAClB,GAC8B,KAA7BjE,eAAAA,EAAkBqB,SACW,aAA7BrB,EAAiB,GAAGiC,KAGpB,YADAhC,SAAAA,EAAsB,KAGvB,MAAMiE,EAAmBC,EAAAA,QAAexB,OAAAC,OAAA,CAAA,EAAAxD,IACpC8E,IACC/D,GAAcA,EAAWkB,OAAS,EACrClB,SAAAA,EAAYiE,SAAQ,CAACC,EAAOC,WAC3BJ,EAAiBK,WAAY,GAAGC,MAC/BF,GACCC,WAAW,GAAGE,QAASC,cAAgB,SACxCxD,EAAAf,EAAWmE,kBACV,iFACD,IAGoC,QAAtCpD,EAAAgD,eAAAA,EAAkBK,WAAY,GAAGC,aAAK,IAAAtD,GAAAA,EAAEkD,SAAQ,CAACC,EAAOC,KACvDJ,EAAiBK,WAAY,GAAGC,MAC/BF,GACCC,WAAW,GAAGE,QAASC,cAAgB,CACxC,iFACA,IAGH/E,SAAAA,EAAcuE,IAEfjE,SAAAA,EAAsB,IACtBS,SAAAA,EAAuB,IACvBL,SAAAA,GAA4B,IA8EvBL,IACAA,aAAgB,EAAhBA,EAAkBqB,QAAS,GACC,YAA5BrB,EAAiB,GAAGiC,MACnBgB,EAAAC,IAACyB,SAAM,CACNC,UAAuC,QAA5BC,EAAA7E,aAAA,EAAAA,EAAkBqB,cAAU,IAAAwD,EAAAA,EAAA,IAAM,EAC7CxC,MAAO,CACNyC,UAAW,YAEZxB,QAASA,KACR3B,IAAqB,GACrBF,IAAqB,EAAK,EAE3BsD,WAAW,qBACXC,WAAW,kBAKf5E,GACDP,GAC6B,KAA7BG,aAAgB,EAAhBA,EAAkBqB,SACOyB,MAAzBpD,GACAA,GAAyB,GACxB0C,6BACCA,EAAKM,KAAA,MAAAC,OAAAC,OAAA,CAAAP,MAAO,CAAEmB,WAAY,KAAI,CAAAf,SAAA,CAC7BQ,MAACgC,eAAY,CAAAxC,SAAA,eACbQ,EAAAC,IAACgC,gBAAe,CAAAzC,SAAA,UACf1C,QAAAA,EAAa,mBAGfqC,EAAAM,KAAA,MAAAC,OAAAC,OAAA,CACCP,MAAO,CACN8C,UAAW,GACXxB,aAAc,GACdH,WAAYtD,EAAU,GAAK,GAC3B0D,YAAa1D,EAAU,GAAK,GAC5BqC,cAAe,SACfD,QAAS,OACTO,WAAY,WACZ,CAAAJ,SAAA,CAEDQ,MAAC0B,SAAM,CACNS,kBAAgB,EAChB/C,MAAO,CACNgD,KAAM,EACN/C,QAAS,OACTgD,MAAO,OACP3B,aAAc,GACd4B,OAAQrF,EACL,cAAcsF,EAAMA,OAACC,QAAQC,gBAC7B5C,GAEJ6C,KAAM,SACNZ,WAAY,iBACZC,WAAY9E,EAAU,eAAiB,WACvC0F,YAAaA,IACZ3C,EAAAC,IAAA,MAAAP,OAAAC,OAAA,CAAKP,MAAO,CAAEC,QAAS,OAAQgD,MAAO,GAAIO,OAAQ,KACjD,CAAApD,SAAAQ,EAAAC,IAAC4C,UAAQ,CACRR,MAAO,GACPO,OAAQ,GACRE,MAAOP,EAAAA,OAAOC,QAAQO,eAIzB1C,QAAU2C,IACTxE,IAAqB,EAAK,IAG3B3B,IAAQoG,EAAAA,IAAIC,SACZ/D,EAAAA,KAAAgE,EAAAA,SAAA,CAAA3D,SAAA,CACCL,EACCM,KAAA,MAAAC,OAAAC,OAAA,CAAAP,MAAO,CACNC,QAAS,OACT+C,KAAM,EACNxC,WAAY,SACZwD,eAAgB,gBAChB9D,cAAe,MACf+C,MAAO,SAGR,CAAA7C,SAAA,CAAAQ,EAAAC,IAAA,MAAA,CACCb,MAAO,CACNiD,MAAO,OACPO,OAAQ,EACRS,gBAAiB,UACjB1C,YAAa,EACbyB,KAAM,KAGRpC,EAACC,IAAAqD,6BACAlE,MAAO,CAAE0D,MAAO,UAAWS,SAAU,4BAItCvD,EAAAC,IAAA,MAAA,CACCb,MAAO,CACNiD,MAAO,OACPO,OAAQ,EACRS,gBAAiB,UACjB9C,WAAY,EACZ6B,KAAM,SAITpC,EAACC,IAAAyB,UACAS,kBAAgB,EAChB/C,MAAO,CACNgD,KAAM,EACN/C,QAAS,OACT6C,UAAW,GACXG,MAAO,OACPC,OAAQrF,EACL,cAAcsF,EAAMA,OAACC,QAAQC,gBAC7B5C,GAEJ6C,KAAM,SACNZ,WAAY,0BACZC,WAAY9E,EAAU,eAAiB,WACvC0F,YAAaA,IACZ3C,EAAKC,IAAA,MAAAP,OAAAC,OAAA,CAAAP,MAAO,CAAEC,QAAS,SAAQ,CAAAG,SAC9BQ,EAACC,IAAA4C,UACA,CAAAR,MAAO,GACPO,OAAQ,GACRE,MAAOP,EAAAA,OAAOC,QAAQO,eAIzB1C,QAAU2C,IACT1F,GAAoB,IAAMwB,KAC1BvB,GAAsB,EAAK,WAM/BN,GACA+C,EAAAA,IAAA,MAAAN,OAAAC,OAAA,CAAKP,MAAO,CAAEmB,WAAY,GAAIG,aAAc,KAC3C,CAAAlB,SAAAQ,EAAAC,IAACuD,QAAK,CAACC,QAAS,MAAOC,UAAW,+BAKrC9G,IAA0BH,QAAAA,GAA0B,IAAM,GAC3D0C,EACCM,KAAA,MAAAC,OAAAC,OAAA,CAAAP,MAAO,CACNC,QAAS,OACTsE,WAAYpB,EAAAA,OAAOqB,QAAQC,QAC3BjE,WAAY,WACZ,CAAAJ,SAAA,CAEDQ,MAACE,aAAU,CACVC,KAAM2D,EAAQ,QACdnC,SAAU/C,GACVyD,MAAO,EACPO,OAAQ,GACRmB,SACEnF,GAA4D,CAAE,EAAxC,CAAEkE,MAAOP,EAAAA,OAAOC,QAAQO,WAEhD1C,QAASA,WAEU,QAAlBpC,EAAAT,aAAA,EAAAA,EAAWwG,eAAO,IAAA/F,GAAAA,EAAEgG,aACfxH,QAAAA,GAA0B,GAAK,GAGpCY,SAAAA,GAA4B6G,GAASA,EAAO,GAAE,IAIhDlE,EAAAC,IAAC+B,eACAtC,OAAAC,OAAA,CAAAP,MAAO,CAAEgD,KAAM,EAAG/C,QAAS,OAAQ+D,eAAgB,UACnDN,MAAOP,EAAAA,OAAOC,QAAQO,WAAS,CAAAvD,SAC9B,SACA/C,QAAAA,EAAyB,GAAK,KAC5BK,OAEJkD,MAACE,aAAU,CACVC,KAAMgE,EAAS,QACf9B,MAAO,EACPO,OAAQ,GACRjB,SAAUhD,GACVoF,SACEpF,GAA6D,CAAE,EAAxC,CAAEmE,MAAOP,EAAAA,OAAOC,QAAQO,WAEjD1C,QAASA,WAEU,QAAlBpC,EAAAT,aAAA,EAAAA,EAAWwG,eAAO,IAAA/F,GAAAA,EAAEmG,aACf3H,QAAAA,GAA0B,KAAOK,QAAAA,GAAc,GAAK,GAGzDO,SAAAA,GAA4B6G,GAASA,EAAO,GAAE,QAKlDlE,MAACqE,UAAsB,CACtBjI,2BAA4BA,EAC5BD,SAAUA,EACVmI,iBACCnI,IAMAO,SAAAA,EAAcP,EAAS,EAExBE,kBAAmBA,EACnBC,qBAAsBA,EACtBC,aAAcA,EACdC,gBAAiBA,IAEjB+B,GAAqB5B,GACrBqD,EAAAA,IAACuE,EAAAA,mBACA,CAAAC,OAAQ,IACRC,cACChG,GACGiG,EAAAA,WAAWC,kBACXD,EAAUA,WAACE,YAEfC,kBAAkB,EAClBC,QAASnI,EAAWmI,QACpBC,cAhXwBC,KAC3B,GAAIA,EAAa5G,OAAS,EAAG,CAC5B,MAAM6G,EAAM,CAAA,EACZ,IAAK,MAAMC,KAAQF,EAAc,CAChC,MAAMG,EAAeD,aAAA,EAAAA,EAAMC,aACrBC,EAAYF,EAAKE,UACjBC,EAAYH,EAAKG,UACjBF,KAAgBF,IACrBA,EAAIE,GAAgB,CACnBG,SAAU,CAAE,EACZtG,KAAM,GACNoC,MAAO,GACPmE,mBAAmB,IAIfH,KAAaH,EAAIE,GAAcG,WACpCL,EAAIE,GAAcG,SAAUF,GAAa,CACxCI,SAAU,CAAE,EACZxG,MAAMkG,eAAAA,EAAMjG,cAAe,GAC3BmC,OAAO8D,eAAAA,EAAMO,eAAgB,KAI/BR,EAAIE,GAAcG,SAAUF,GAAWI,SAAUH,GAAa,CAC7DrG,MAAMkG,eAAAA,EAAMlG,OAAQ,GACpB0G,MAAO,GACPtE,OAAO8D,eAAAA,EAAM9D,QAAS,GACtBuE,SAAUT,EAAKS,UAAY,EAC3BC,aAAcV,EAAKU,aAEpB,CACD,OAAOX,CACP,CACD,MAAO,EAAE,EA8USY,CAAmB9I,QAAAA,EAAoB,IACtD+I,kBAAmBnJ,EAAWoJ,iBAC9BC,eAAgBrJ,EAAWsJ,cAC3BC,MA3akBC,CAACC,EAAsBC,yBAC5C3H,IAAqB,GACrB,MAAMsG,EAAsB,UACrBoB,EAAgB,SACvB,IAAK,MAAME,KAAO5G,OAAO6G,KAAKH,GAAQ,CACrC,MAAMd,EAAWc,EAAME,GAAKhB,SAC5B,QAAwB,IAAbA,GACN5F,OAAO6G,KAAKjB,GAAUlH,OAC3B,IAAK,MAAMgH,KAAa1F,OAAO6G,KAAKjB,GAAW,CAC9C,MAAME,EAAWF,EAASF,GAAWI,SACrC,QAAwB,IAAbA,GACN9F,OAAO6G,KAAKf,GAAUpH,OAC3B,IAAK,MAAMiH,KAAa3F,OAAO6G,KAAKf,GAAW,CAC9C,MAAMxG,KAAEA,EAAIoC,MAAEA,EAAKuE,SAAEA,EAAQC,aAAEA,GAAiBJ,EAASH,GACnDJ,EAAM,CACXjG,OACAoC,cAAOpD,EAAAoD,QAAAA,EAA8B,QAArBnD,EAAAqH,EAASF,UAAY,IAAAnH,OAAA,EAAAA,EAAAmD,qBAAS,GAC9CuE,WACAN,YACAD,YACAQ,eACAT,aAAcmB,EACdrH,YAAsC,QAAzBZ,EAAmB,QAAnBC,EAAAgH,EAASF,UAAU,IAAA9G,OAAA,EAAAA,EAAEU,YAAI,IAAAX,EAAAA,EAAI,GAC1CoH,aAAwC,QAA1B3F,EAAmB,QAAnBC,EAAAuF,EAASF,UAAU,IAAArF,OAAA,EAAAA,EAAEqB,aAAK,IAAAtB,EAAAA,EAAI,GAC5C0G,mBAAoD,QAAhC5E,EAAmB,QAAnBpB,EAAA8E,EAASF,UAAU,IAAA5E,OAAA,EAAAA,EAAEiG,mBAAW,IAAA7E,EAAAA,EAAI,IAEzDoD,EAAa0B,KAAKzB,EAClB,CACD,CACD,CAED,MAAM0B,EAAqB3B,EAAa4B,MACvC,CAACC,EAAQC,IAAWD,EAAEjB,aAAekB,EAAElB,eAElCmB,EAAiB/B,EAAagC,KAAKC,GAAYA,EAAQ7F,QAEvDH,EAAmBC,EAAAA,QAAexB,OAAAC,OAAA,CAAA,EAAAxD,IACpC8E,IACH8F,EAAe5F,SAAQ,CAACC,EAAOC,WAE7BJ,EAAiBK,WAAY,GAAGC,MAC/BF,GACCC,WAAW,GAAGE,QAASC,cAHtBL,EAGsC,CAACA,GAID,CAAwB,QAAvBnD,EAAAf,aAAA,EAAAA,EAAamE,UAAU,IAAApD,EAAAA,EAAA,GACjE,IAEFvB,SAAAA,EAAcuE,IAEfjE,SAAAA,EAAsB2J,GACtBlJ,SAAAA,EAAuB,IACvBe,IAAqB,EAAM,EAuXxB0I,0BAA2BvK,EAAWwK,mBACtCC,cAAezK,EAAW0K,eAC1BC,QAAS/I,EACTgJ,QAASA,KACR/I,IAAqB,EAAM,EAE5BgJ,WAAY1K,QAAAA,EAAa,EACzB2K,QAAS9K,EAAW8K,SAAWC,EAAAA,gBAAgBC,SAG5C"}
1	+ {"version":3,"file":"EditWhatsAppCarouselTemplateV2.js","sources":["../../../../../src/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.tsx"],"sourcesContent":["import { ApplicationType } from '@bikdotai/bik-models/growth/models/bik-store';\nimport BackIcon from '@src/assets/icons/arrow_back.svg';\nimport LeftIcon from '@src/assets/icons/chevronLeft.svg';\nimport RightIcon from '@src/assets/icons/chevronRight.svg';\nimport PlusIcon from '@src/assets/icons/PlusIcon';\nimport cloneDeep from 'lodash/cloneDeep';\nimport { useEffect, useState } from 'react';\nimport type {\n\tVariable,\n\tVariableListInterfaceV2,\n} from '@src/components/add-variableV2/AddVariableV2';\nimport { Button } from '@src/components/button/Button';\nimport { IconButton } from '@src/components/icon-button/IconButton';\nimport { ProductPickerModal } from '@src/components/product-picker-v2/modal';\nimport type { SelectedItems } from '@src/components/product-picker-v2/type';\nimport { ScreenName } from '@src/components/product-picker-v2/type';\nimport { Badge } from '@src/components/template-context-mapper/Badge';\nimport { useTemplateModalContext } from '@src/components/template-context-mapper/context/templateModalContext';\nimport EditWhatsAppTemplateV2 from '@src/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2';\nimport { ProductBox } from '@src/components/template-context-mapper/modalElements/ProductBox';\nimport { isRCSChannel } from '@src/components/template-preview/helpers/templateMiscHelper';\nimport type { EmailTemplateType } from '@src/components/template-preview/models/EmailTemplate';\nimport type { SMSTemplateType } from '@src/components/template-preview/models/SmsTemplate';\nimport type { WhatsAppCarouselTemplate } from '@src/components/template-preview/models/WhatsappCarouselTemplate';\nimport {\n\tPOD,\n\ttype WhatsAppPickerMeta,\n\ttype WhatsAppTemplate,\n} from '@src/components/template-preview/models/WhatsAppTemplate';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleMedium,\n\tTitleRegular,\n} from '@src/components/TypographyStyle';\nimport { COLORS } from '@src/constants/Theme';\nimport { CarouselProduct } from './modal';\n\nexport interface EditWhatsAppCarouselTemplateV2Props {\n\twhatsappSpecificPickerMeta?: WhatsAppPickerMeta;\n\ttemplate: WhatsAppCarouselTemplate;\n\tshowVariableModal?: boolean;\n\tvariableListForImage?: VariableListInterfaceV2[];\n\tdiscountCode?: string;\n\tsetDiscountCode?: (code: string) => void;\n}\n\nconst EditWhatsAppCarouselTemplateV2 = ({\n\ttemplate,\n\twhatsappSpecificPickerMeta,\n\tshowVariableModal,\n\tvariableListForImage,\n\tdiscountCode,\n\tsetDiscountCode,\n}: EditWhatsAppCarouselTemplateV2Props) => {\n\tconst {\n\t\tselectedCarouselIndex,\n\t\tsetTemplate,\n\t\tpickerConf,\n\t\tisProductCarouselType,\n\t\tpod,\n\t\tcardCount,\n\t\tcarouselProducts,\n\t\tsetCarouselProducts,\n\t\tisError,\n\t\tcardImages,\n\t\tdisableEditVariable,\n\t\tonDeleteSelectedProducts,\n\t\tsetSelectedCarouselIndex,\n\t\tsetVariableCallback,\n\t\tsetShowVariablePicker,\n\t\tsliderRef,\n\t\tsetCarouselBodyError,\n\t} = useTemplateModalContext();\n\tconst [titleText, setTitleText] = useState<string>(\n\t\tisRCSChannel(template?.channel)\n\t\t\t? 'Carousel Cards'\n\t\t\t: selectedCarouselIndex == -1\n\t\t\t? 'First Message (Step 1/2)'\n\t\t\t: isProductCarouselType\n\t\t\t? `Product Carousel ${\n\t\t\t\t\ttemplate?.mapping?.body?.length ? '(Step 2/2)' : ''\n\t\t\t }`\n\t\t\t: `Carousel Cards ${template?.mapping?.body?.length ? '(Step 2/2)' : ''}`,\n\t);\n\tconst [showProductPicker, setShowProductPicker] = useState<boolean>(false);\n\tconst [rearrangeProducts, setRearrangeProducts] = useState<boolean>(false);\n\n\tconst shouldHideRightArrow = selectedCarouselIndex === (cardCount ?? -1) - 1;\n\tconst shouldHideLeftArrow = (selectedCarouselIndex ?? -1) < 1;\n\n\tuseEffect(() => {\n\t\tsetTitleText(\n\t\t\tisRCSChannel(template?.channel)\n\t\t\t\t? 'Carousel Cards'\n\t\t\t\t: selectedCarouselIndex == -1\n\t\t\t\t? 'First Message (Step 1/2)'\n\t\t\t\t: isProductCarouselType\n\t\t\t\t? `Product Carousel ${\n\t\t\t\t\t\ttemplate?.mapping?.body?.length ? '(Step 2/2)' : ''\n\t\t\t\t }`\n\t\t\t\t: `Carousel Cards ${\n\t\t\t\t\t\ttemplate?.mapping?.body?.length ? '(Step 2/2)' : ''\n\t\t\t\t }`,\n\t\t);\n\t}, [selectedCarouselIndex]);\n\n\tuseEffect(() => {\n\t\tsetShowVariablePicker(false);\n\t}, [selectedCarouselIndex]);\n\n\tconst onItemsPicked = (items: SelectedItems, total: number) => {\n\t\tsetRearrangeProducts(false);\n\t\tconst selectedList: any[] = [];\n\t\tdelete items['isCustom'];\n\t\tfor (const key of Object.keys(items)) {\n\t\t\tconst products = items[key].products;\n\t\t\tif (typeof products === 'undefined') continue;\n\t\t\tif (!Object.keys(products).length) continue;\n\t\t\tfor (const productId of Object.keys(products)) {\n\t\t\t\tconst variants = products[productId].variants;\n\t\t\t\tif (typeof variants === 'undefined') continue;\n\t\t\t\tif (!Object.keys(variants).length) continue;\n\t\t\t\tfor (const variantId of Object.keys(variants)) {\n\t\t\t\t\tconst { name, image, quantity, displayOrder } = variants[variantId];\n\t\t\t\t\tconst obj = {\n\t\t\t\t\t\tname,\n\t\t\t\t\t\timage: image ?? products[productId]?.image ?? '',\n\t\t\t\t\t\tquantity,\n\t\t\t\t\t\tvariantId,\n\t\t\t\t\t\tproductId,\n\t\t\t\t\t\tdisplayOrder,\n\t\t\t\t\t\tcollectionId: key,\n\t\t\t\t\t\tproductName: products[productId]?.name ?? '',\n\t\t\t\t\t\tproductImage: products[productId]?.image ?? '',\n\t\t\t\t\t\tproductDescription: products[productId]?.description ?? '',\n\t\t\t\t\t};\n\t\t\t\t\tselectedList.push(obj);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tconst sortedSelectedList = selectedList.sort(\n\t\t\t(a: any, b: any) => a.displayOrder - b.displayOrder,\n\t\t);\n\t\tconst selectedImages = selectedList.map((product) => product.image);\n\n\t\tconst selectedTemplate = cloneDeep({ ...template });\n\t\tif (selectedTemplate) {\n\t\t\tselectedImages.forEach((image, index) => {\n\t\t\t\tif (image) {\n\t\t\t\t\tselectedTemplate.components![1].cards![\n\t\t\t\t\t\tindex\n\t\t\t\t\t].components[0].example!.header_handle = [image];\n\t\t\t\t} else {\n\t\t\t\t\tselectedTemplate.components![1].cards![\n\t\t\t\t\t\tindex\n\t\t\t\t\t].components[0].example!.header_handle = [cardImages?.[index] ?? ''];\n\t\t\t\t}\n\t\t\t});\n\t\t\tsetTemplate?.(selectedTemplate as WhatsAppCarouselTemplate);\n\t\t}\n\t\tsetCarouselProducts?.(sortedSelectedList);\n\t\tsetCarouselBodyError?.('');\n\t\tsetShowProductPicker(false);\n\t};\n\n\tconst generatePickerData = (selectedList: CarouselProduct[]) => {\n\t\tif (selectedList.length > 0) {\n\t\t\tconst obj = {};\n\t\t\tfor (const item of selectedList) {\n\t\t\t\tconst collectionId = item?.collectionId;\n\t\t\t\tconst productId = item.productId;\n\t\t\t\tconst variantId = item.variantId;\n\t\t\t\tif (!(collectionId in obj)) {\n\t\t\t\t\tobj[collectionId] = {\n\t\t\t\t\t\tproducts: {},\n\t\t\t\t\t\tname: '',\n\t\t\t\t\t\timage: '',\n\t\t\t\t\t\tisSmartCollection: false,\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\tif (!(productId in obj[collectionId].products!)) {\n\t\t\t\t\tobj[collectionId].products![productId] = {\n\t\t\t\t\t\tvariants: {},\n\t\t\t\t\t\tname: item?.productName \|\| '',\n\t\t\t\t\t\timage: item?.productImage \|\| '',\n\t\t\t\t\t};\n\t\t\t\t}\n\n\t\t\t\tobj[collectionId].products![productId].variants![variantId] = {\n\t\t\t\t\tname: item?.name \|\| '',\n\t\t\t\t\tprice: '',\n\t\t\t\t\timage: item?.image \|\| '',\n\t\t\t\t\tquantity: item.quantity \|\| 0,\n\t\t\t\t\tdisplayOrder: item.displayOrder,\n\t\t\t\t};\n\t\t\t}\n\t\t\treturn obj;\n\t\t}\n\t\treturn {};\n\t};\n\n\tconst deleteItem = () => {\n\t\tif (\n\t\t\tcarouselProducts?.length === 1 &&\n\t\t\tcarouselProducts[0].name === 'variable'\n\t\t) {\n\t\t\tsetCarouselProducts?.([]);\n\t\t\treturn;\n\t\t}\n\t\tconst selectedTemplate = cloneDeep({ ...template });\n\t\tif (selectedTemplate) {\n\t\t\tif (cardImages && cardImages.length > 0) {\n\t\t\t\tcardImages?.forEach((image, index) => {\n\t\t\t\t\tselectedTemplate.components![1].cards![\n\t\t\t\t\t\tindex\n\t\t\t\t\t].components[0].example!.header_handle = [\n\t\t\t\t\t\tcardImages[index] ??\n\t\t\t\t\t\t\t'https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png',\n\t\t\t\t\t];\n\t\t\t\t});\n\t\t\t} else {\n\t\t\t\tselectedTemplate?.components![1].cards?.forEach((image, index) => {\n\t\t\t\t\tselectedTemplate.components![1].cards![\n\t\t\t\t\t\tindex\n\t\t\t\t\t].components[0].example!.header_handle = [\n\t\t\t\t\t\t'https://res.cloudinary.com/drqhot9ot/image/upload/v1708753454/fake-product.png',\n\t\t\t\t\t];\n\t\t\t\t});\n\t\t\t}\n\t\t\tsetTemplate?.(selectedTemplate as WhatsAppCarouselTemplate);\n\t\t}\n\t\tsetCarouselProducts?.([]);\n\t\tsetCarouselBodyError?.('');\n\t\tonDeleteSelectedProducts?.();\n\t};\n\n\tconst handleVariableCallback = (variable: Variable) => {\n\t\tsetCarouselProducts?.([\n\t\t\t{\n\t\t\t\tname: 'variable',\n\t\t\t\tproductName: variable.actualValue,\n\t\t\t} as any,\n\t\t]);\n\t};\n\n\tuseEffect(() => {\n\t\tif (selectedCarouselIndex === -1 && isRCSChannel(template?.channel)) {\n\t\t\tsetSelectedCarouselIndex?.(0);\n\t\t}\n\t}, [selectedCarouselIndex, template?.channel]);\n\n\treturn (\n\t\t<div style={{ display: 'flex', flexDirection: 'column', gap: '16px' }}>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\talignItems: 'center',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{!isRCSChannel(template?.channel) &&\n\t\t\t\t\tselectedCarouselIndex != undefined &&\n\t\t\t\t\tselectedCarouselIndex >= 0 &&\n\t\t\t\t\t!!template?.mapping?.body?.length && (\n\t\t\t\t\t\t<IconButton\n\t\t\t\t\t\t\tIcon={BackIcon}\n\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\tsetSelectedCarouselIndex?.(-1);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\t\t\t\t<TitleMedium style={{ marginLeft: 10 }}>{titleText}</TitleMedium>\n\t\t\t</div>\n\t\t\t{isProductCarouselType &&\n\t\t\t\t(carouselProducts?.length ?? 0) > 0 &&\n\t\t\t\tselectedCarouselIndex != undefined &&\n\t\t\t\tselectedCarouselIndex >= 0 && (\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\trowGap: 8,\n\t\t\t\t\t\t\tmarginBottom: 16,\n\t\t\t\t\t\t\tmarginLeft: 10,\n\t\t\t\t\t\t\tmarginRight: 10,\n\t\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ProductBox\n\t\t\t\t\t\t\teditItem={() => {\n\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\tcarouselProducts?.length === 1 &&\n\t\t\t\t\t\t\t\t\tcarouselProducts[0].name === 'variable'\n\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\tsetVariableCallback(() => handleVariableCallback);\n\t\t\t\t\t\t\t\t\tsetShowVariablePicker(true);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tsetShowProductPicker(!showProductPicker);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tcardBody={\n\t\t\t\t\t\t\t\tcarouselProducts?.length === 1 &&\n\t\t\t\t\t\t\t\tcarouselProducts[0].name === 'variable'\n\t\t\t\t\t\t\t\t\t? `${carouselProducts[0].productName}`\n\t\t\t\t\t\t\t\t\t: `${carouselProducts?.length} Products Selected`\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\thideIcon={\n\t\t\t\t\t\t\t\tcarouselProducts?.length === 1 &&\n\t\t\t\t\t\t\t\tcarouselProducts[0].name === 'variable'\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdeleteItem={deleteItem}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{carouselProducts &&\n\t\t\t\t\t\t\tcarouselProducts?.length > 0 &&\n\t\t\t\t\t\t\tcarouselProducts[0].name != 'variable' && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tdisabled={(carouselProducts?.length ?? 0) <= 1}\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\talignSelf: 'flex-end',\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetRearrangeProducts(true);\n\t\t\t\t\t\t\t\t\t\tsetShowProductPicker(true);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tbuttonText=\"Rearrange Products\"\n\t\t\t\t\t\t\t\t\tbuttonType=\"tertiary\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t{!disableEditVariable &&\n\t\t\t\tisProductCarouselType &&\n\t\t\t\tcarouselProducts?.length === 0 &&\n\t\t\t\tselectedCarouselIndex != undefined &&\n\t\t\t\tselectedCarouselIndex >= 0 && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t<div style={{ marginLeft: 12 }}>\n\t\t\t\t\t\t\t<TitleRegular>Product(s)</TitleRegular>\n\t\t\t\t\t\t\t<BodySecondary>{`Select ${\n\t\t\t\t\t\t\t\tcardCount ?? 1\n\t\t\t\t\t\t\t} products`}</BodySecondary>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tmarginTop: 16,\n\t\t\t\t\t\t\t\tmarginBottom: 16,\n\t\t\t\t\t\t\t\tmarginLeft: isError ? 16 : 12,\n\t\t\t\t\t\t\t\tmarginRight: isError ? 16 : 12,\n\t\t\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tmatchParentWidth\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\tmarginBottom: 12,\n\t\t\t\t\t\t\t\t\tborder: isError\n\t\t\t\t\t\t\t\t\t\t? `2px dashed ${COLORS.content.negative}`\n\t\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\tsize={'medium'}\n\t\t\t\t\t\t\t\tbuttonText={'Add Product(s)'}\n\t\t\t\t\t\t\t\tbuttonType={isError ? 'tertiaryGray' : 'dashBold'}\n\t\t\t\t\t\t\t\tLeadingIcon={() => (\n\t\t\t\t\t\t\t\t\t<div style={{ display: 'flex', width: 18, height: 18 }}>\n\t\t\t\t\t\t\t\t\t\t<PlusIcon\n\t\t\t\t\t\t\t\t\t\t\twidth={18}\n\t\t\t\t\t\t\t\t\t\t\theight={18}\n\t\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\tsetShowProductPicker(true);\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{pod === POD.CHATBOT && (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\t\t\t\theight: 1,\n\t\t\t\t\t\t\t\t\t\t\t\tbackgroundColor: '#E0E0E0',\n\t\t\t\t\t\t\t\t\t\t\t\tmarginRight: 8,\n\t\t\t\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\t\t\t\t\tstyle={{ color: '#616161', overflow: 'unset' }}\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\tOR\n\t\t\t\t\t\t\t\t\t\t</BodyCaption>\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\t\t\t\theight: 1,\n\t\t\t\t\t\t\t\t\t\t\t\tbackgroundColor: '#E0E0E0',\n\t\t\t\t\t\t\t\t\t\t\t\tmarginLeft: 8,\n\t\t\t\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tmatchParentWidth\n\t\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\t\tmarginTop: 12,\n\t\t\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\t\t\tborder: isError\n\t\t\t\t\t\t\t\t\t\t\t\t? `2px dashed ${COLORS.content.negative}`\n\t\t\t\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tsize={'medium'}\n\t\t\t\t\t\t\t\t\t\tbuttonText={'Add Product(s) Variable'}\n\t\t\t\t\t\t\t\t\t\tbuttonType={isError ? 'tertiaryGray' : 'dashBold'}\n\t\t\t\t\t\t\t\t\t\tLeadingIcon={() => (\n\t\t\t\t\t\t\t\t\t\t\t<div style={{ display: 'flex' }}>\n\t\t\t\t\t\t\t\t\t\t\t\t<PlusIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth={18}\n\t\t\t\t\t\t\t\t\t\t\t\t\theight={18}\n\t\t\t\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\tonClick={(e) => {\n\t\t\t\t\t\t\t\t\t\t\tsetVariableCallback(() => handleVariableCallback);\n\t\t\t\t\t\t\t\t\t\t\tsetShowVariablePicker(true);\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{isError && (\n\t\t\t\t\t\t\t<div style={{ marginLeft: 10, marginBottom: 16 }}>\n\t\t\t\t\t\t\t\t<Badge padding={'8px'} errorText={'Please add products'} />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t{!isProductCarouselType && (selectedCarouselIndex ?? -1) > -1 && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tbackground: COLORS.surface.hovered,\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<IconButton\n\t\t\t\t\t\tIcon={LeftIcon}\n\t\t\t\t\t\tdisabled={shouldHideLeftArrow}\n\t\t\t\t\t\twidth={8}\n\t\t\t\t\t\theight={14}\n\t\t\t\t\t\tsvgStyle={\n\t\t\t\t\t\t\t!shouldHideLeftArrow ? { color: COLORS.content.secondary } : {}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t//@ts-ignore\n\t\t\t\t\t\t\tsliderRef?.current?.slickPrev();\n\t\t\t\t\t\t\tif ((selectedCarouselIndex ?? -1) < 1) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsetSelectedCarouselIndex?.((prev) => prev - 1);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\tstyle={{ flex: 1, display: 'flex', justifyContent: 'center' }}\n\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t>{`Card ${\n\t\t\t\t\t\t(selectedCarouselIndex ?? 0) + 1\n\t\t\t\t\t}/${cardCount}`}</TitleRegular>\n\n\t\t\t\t\t<IconButton\n\t\t\t\t\t\tIcon={RightIcon}\n\t\t\t\t\t\twidth={8}\n\t\t\t\t\t\theight={14}\n\t\t\t\t\t\tdisabled={shouldHideRightArrow}\n\t\t\t\t\t\tsvgStyle={\n\t\t\t\t\t\t\t!shouldHideRightArrow ? { color: COLORS.content.secondary } : {}\n\t\t\t\t\t\t}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t//@ts-ignore\n\t\t\t\t\t\t\tsliderRef?.current?.slickNext();\n\t\t\t\t\t\t\tif ((selectedCarouselIndex ?? -1) >= (cardCount ?? -1) - 1) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsetSelectedCarouselIndex?.((prev) => prev + 1);\n\t\t\t\t\t\t}}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<EditWhatsAppTemplateV2\n\t\t\t\twhatsappSpecificPickerMeta={whatsappSpecificPickerMeta}\n\t\t\t\ttemplate={template as WhatsAppTemplate}\n\t\t\t\tonTemplateChange={(\n\t\t\t\t\ttemplate:\n\t\t\t\t\t\t\| WhatsAppTemplate\n\t\t\t\t\t\t\| EmailTemplateType\n\t\t\t\t\t\t\| SMSTemplateType\n\t\t\t\t\t\t\| WhatsAppCarouselTemplate,\n\t\t\t\t) => {\n\t\t\t\t\tsetTemplate?.(template);\n\t\t\t\t}}\n\t\t\t\tshowVariableModal={showVariableModal}\n\t\t\t\tvariableListForImage={variableListForImage}\n\t\t\t\tdiscountCode={discountCode}\n\t\t\t\tsetDiscountCode={setDiscountCode}\n\t\t\t/>\n\t\t\t{showProductPicker && pickerConf && (\n\t\t\t\t<ProductPickerModal\n\t\t\t\t\tzIndex={200}\n\t\t\t\t\tstartupScreen={\n\t\t\t\t\t\trearrangeProducts\n\t\t\t\t\t\t\t? ScreenName.RearrangeProducts\n\t\t\t\t\t\t\t: ScreenName.Collections\n\t\t\t\t\t}\n\t\t\t\t\trearrangeEnabled={true}\n\t\t\t\t\tstoreId={pickerConf.storeId}\n\t\t\t\t\tselectedItems={generatePickerData(carouselProducts ?? [])}\n\t\t\t\t\tcollectionFetcher={pickerConf.fetchCollections}\n\t\t\t\t\tproductFetcher={pickerConf.fetchProducts}\n\t\t\t\t\tonAdd={onItemsPicked}\n\t\t\t\t\tsearchInCollectionFetcher={pickerConf.searchInCollection}\n\t\t\t\t\tsearchFetcher={pickerConf.searchProducts}\n\t\t\t\t\tvisible={showProductPicker}\n\t\t\t\t\tonClose={() => {\n\t\t\t\t\t\tsetShowProductPicker(false);\n\t\t\t\t\t}}\n\t\t\t\t\texactLimit={cardCount ?? 1}\n\t\t\t\t\tappType={pickerConf.appType \|\| ApplicationType.BIK}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default EditWhatsAppCarouselTemplateV2;\n"],"names":["_ref","template","whatsappSpecificPickerMeta","showVariableModal","variableListForImage","discountCode","setDiscountCode","selectedCarouselIndex","setTemplate","pickerConf","isProductCarouselType","pod","cardCount","carouselProducts","setCarouselProducts","isError","cardImages","disableEditVariable","onDeleteSelectedProducts","setSelectedCarouselIndex","setVariableCallback","setShowVariablePicker","sliderRef","setCarouselBodyError","useTemplateModalContext","titleText","setTitleText","useState","isRCSChannel","channel","_b","_a","mapping","body","length","_d","_c","showProductPicker","setShowProductPicker","rearrangeProducts","setRearrangeProducts","shouldHideRightArrow","shouldHideLeftArrow","useEffect","handleVariableCallback","variable","name","productName","actualValue","_jsxs","style","display","flexDirection","gap","children","jsxs","Object","assign","alignItems","undefined","_f","_e","_jsx","jsx","IconButton","Icon","BackIcon","onClick","TitleMedium","marginLeft","_g","rowGap","marginBottom","marginRight","ProductBox","editItem","cardBody","hideIcon","deleteItem","selectedTemplate","cloneDeep","forEach","image","index","components","cards","example","header_handle","Button","disabled","_h","alignSelf","buttonText","buttonType","TitleRegular","BodySecondary","marginTop","matchParentWidth","flex","width","border","COLORS","content","negative","size","LeadingIcon","height","PlusIcon","color","secondary","e","POD","CHATBOT","_Fragment","justifyContent","backgroundColor","BodyCaption","overflow","Badge","padding","errorText","background","surface","hovered","LeftIcon","svgStyle","current","slickPrev","prev","RightIcon","slickNext","EditWhatsAppTemplateV2","onTemplateChange","ProductPickerModal","zIndex","startupScreen","ScreenName","RearrangeProducts","Collections","rearrangeEnabled","storeId","selectedItems","selectedList","obj","item","collectionId","productId","variantId","products","isSmartCollection","variants","productImage","price","quantity","displayOrder","generatePickerData","collectionFetcher","fetchCollections","productFetcher","fetchProducts","onAdd","onItemsPicked","items","total","key","keys","productDescription","description","push","sortedSelectedList","sort","a","b","selectedImages","map","product","searchInCollectionFetcher","searchInCollection","searchFetcher","searchProducts","visible","onClose","exactLimit","appType","ApplicationType","BIK"],"mappings":"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"}

package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js CHANGED Viewed

@@ -4,5 +4,5 @@
 	padding-right: 10px;
 	margin-bottom: 8px;
 	line-height: normal;
-`;exports.default=({template:t,onTemplateChange:i,whatsappSpecificPickerMeta:V,showVariableModal:k,variableListForImage:I,setDiscountCode:R,fileName:q,setFileName:D})=>{var P,L,U,A,w,N,S,_,H,F,Q,Y,W,K,$,G,X,z,J,Z,ee,ne,te,oe,ie,le,ae,se,de,re,ue,pe,ce,ve,me,be,ge,he,fe;const je=t.isCarouselType,{originalVariableList:Ce,pod:xe,extras:Te,selectedCarouselIndex:Oe,isProductCarouselType:Ee,disableCopyCode:ye,isError:Ve,cardIndex:Be}=u.useTemplateModalContext(),{descriptionComponents:Me,urlBtns:ke,qrbBtns:Ie,imageComponent:Re,bodyVariables:qe,headerVariables:De,titleVariables:Pe}=c.getAllDataFromTemplateComponent(t),Le=o.useRef(null),[Ue,Ae]=o.useState(!1),[we,Ne]=o.useState(-1===Oe?{descriptionComponents:Me,urlBtns:ke,qrbBtns:Ie,imageComponent:Re,bodyVariables:qe,headerVariables:De,titleVariables:Pe}:{}),{uploadMediaLink:Se,uploadMediaFiles:_e,validateMimeType:He}=V,Fe=C.useEditWhatsappTemplateMedia({uploadMediaLink:Se,uploadMediaFiles:_e,updateTemplateImageUrl:function(e,n){var o,l,a,s,d,r,u,p;let c;c=null!=Oe&&Oe>-1?{components:null===(l=null===(o=t.components[Be])||void 0===o?void 0:o.cards)||void 0===l?void 0:l[Oe].components,mapping:null===(s=null===(a=null==t?void 0:t.mapping)||void 0===a?void 0:a.cards)||void 0===s?void 0:s[Oe]}:Object.assign({},t);const v=null===(d=null==c?void 0:c.components)||void 0===d?void 0:d.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==v&&v>-1&&(null==c?void 0:c.components[v])){const t=Object.assign(Object.assign({},c.components[v]),{format:n,example:{header_handle:[e]}}),o=[...c.components];o[v]=t,c=Object.assign(Object.assign({},c),{components:o})}c.mapping&&(c.mapping=Object.assign(Object.assign({},c.mapping),{header:void 0}));if(null!=Oe&&Oe>-1){const e=B.default(t);e.components[Be].cards[Oe].components=c.components,(null===(r=null==e?void 0:e.mapping)||void 0===r?void 0:r.cards)&&(null===(u=null==e?void 0:e.mapping)||void 0===u?void 0:u.cards.length)>0&&(e.mapping.cards[Oe]=null!==(p=c.mapping)&&void 0!==p?p:{}),null==i||i(Object.assign({},e)),Ye(!0)}else null==i||i(Object.assign({},c))},validateMimeType:He,mediaComponent:je?we.imageComponent:Re,fileRef:Le}),[Qe,Ye]=o.useState(!1),[We,Ke]=o.useState(q),[$e,Ge]=o.useState();function Xe(e,n,o){var l,a,d,r,u,p,c,v,m,b;const g=null!=Oe&&Oe>-1?{components:null===(l=Object.assign({},t).components[Be].cards)||void 0===l?void 0:l[Oe].components,mapping:null===(a=Object.assign({},t).mapping.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},t),h=B.default(g),f="custom"===n&&"string"==typeof e,j=f?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Oe&&Oe>-1&&Ee){const n=Object.assign({},t).components.map((e=>{var n;return s.isCarouselComponent(e.type)?Object.assign(Object.assign({},e),{cards:null===(n=e.cards)||void 0===n?void 0:n.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var n,t,i;if("BUTTONS"===e.type){const l=null===(n=e.buttons)||void 0===n?void 0:n.filter((e=>"URL"===e.type));let a=null!==(t=null==l?void 0:l[o])&&void 0!==t?t:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[j]});const s=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},e),{buttons:s})}return e}))})))}):e})),l=null===(r=null===(d=Object.assign({},t).mapping)||void 0===d?void 0:d.cards)||void 0===r?void 0:r.map((n=>{var t;return Object.assign(Object.assign({},n),{buttons:null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.map(((n,t)=>t===o?f?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"":n))})})),a=B.default(t);return a.components=n,a.mapping.cards=l,void(null==i||i(Object.assign({},a)))}const C=null==h?void 0:h.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==C&&C>-1){const t=null===(u=null==h?void 0:h.components[C].buttons)||void 0===u?void 0:u.filter((e=>"URL"===e.type));if((null==t?void 0:t.length)>0){const i="custom"===n&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=t[o];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(v=null===(c=null===(p=h.components)||void 0===p?void 0:p[C])||void 0===c?void 0:c.buttons)&&void 0!==v?v:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},h.components[C]),{buttons:s}),r=null===(m=h.mapping)||void 0===m?void 0:m.buttons;r&&r.length>0&&(r[o]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const u=Object.assign(Object.assign({},h.mapping),{buttons:r});h.mapping=u;const b=[...h.components];b[C]=d,h.components=b}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(b=e.placeHolder)||void 0===b?void 0:b.slice(2,-2))?Ae(!0):(Ae(!1),null==R||R(""))}if(null!=Oe&&Oe>-1){const e=B.default(t);e.components[Be].cards[Oe].components=h.components,e.mapping.cards[Oe]=h.mapping,null==i||i(Object.assign({},e))}else null==i||i(h)}function ze(e,n,o){var l,a,d,r,u,p,c;const v=null!=Oe&&Oe>-1?{components:null===(l=Object.assign({},t).components[Be].cards)||void 0===l?void 0:l[Oe].components,mapping:null===(a=Object.assign({},t).mapping.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},t);if(null!=Oe&&Oe>-1&&Ee){const n=Object.assign({},t).components.map((n=>{var t;return s.isCarouselComponent(n.type)?Object.assign(Object.assign({},n),{cards:null===(t=n.cards)||void 0===t?void 0:t.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var t,i,l;if("BUTTONS"===n.type){const a=null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[o])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),l=B.default(t);return l.components=n,void(null==i||i(Object.assign({},l)))}const m=null==v?void 0:v.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==m&&m>-1){const n=null===(r=null===(d=null==v?void 0:v.components[m])||void 0===d?void 0:d.buttons)||void 0===r?void 0:r.filter((e=>"QUICK_REPLY"===e.type));if(n){let t=n[o];t=Object.assign(Object.assign({},t),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(c=null===(p=null===(u=v.components)||void 0===u?void 0:u[m])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),l=Object.assign(Object.assign({},v.components[m]),{buttons:i}),a=[...v.components];a[m]=l,v.components=a}}if(null!=Oe&&Oe>-1){const e=B.default(t);e.components[Be].cards[Oe].components=v.components,null==i||i(Object.assign({},e))}else null==i||i(v)}o.useEffect((()=>{var e,n;if(null===(e=t.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))Ae(!0);else{Ae(!1);const e=null===(n=null==Te?void 0:Te.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[t]),o.useEffect((()=>{var e,n,o,i;if(null!=Oe&&Oe>-1){const l={components:null===(n=null===(e=t.components[Be])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(i=null===(o=null==t?void 0:t.mapping)||void 0===o?void 0:o.cards)||void 0===i?void 0:i[Oe]},{descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v}=c.getAllDataFromTemplateComponent(l);Ne({descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v})}else if(null!=Oe&&-1===Oe){const{descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:i,bodyVariables:l,headerVariables:a,titleVariables:s}=c.getAllDataFromTemplateComponent(t);Ne({descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:i,bodyVariables:l,headerVariables:a,titleVariables:s})}}),[Oe]),o.useEffect((()=>{var e,n,o,i;if(null!=Oe&&Oe>-1&&Qe){const l={components:null===(n=null===(e=t.components[Be])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(i=null===(o=null==t?void 0:t.mapping)||void 0===o?void 0:o.cards)||void 0===i?void 0:i[Oe]},{descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v}=c.getAllDataFromTemplateComponent(l);Ne({descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v}),Ye(!1)}}),[Qe]);o.useEffect((()=>{Ve&&xe===r.POD.CHATBOT&&(()=>{if(!q)return void Ge("PDF name is Required");const e=m.validateInputNameChatbot(q);null==D||D(null!=q?q:""),Ge(e?"Please enter a valid PDF name":void 0)})()}),[Ve]);const Je=je?we.imageComponent:Re;return Fe.openEditMedia?e.jsx(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(h.default,{mediaComponentFormat:null!==(P=Je.format)&&void 0!==P?P:d.HEADER_TYPES.IMAGE,uploadMedia:Fe.uploadMedia,variableListForImage:I||[],useEditWhatsappTemplateMediaResponse:Fe,setOpenEditMedia:Fe.setOpenEditMedia,openEditMedia:Fe.openEditMedia,editIconRef:Fe.editIconRef,fileRef:Le})})):e.jsxs(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:Ee?"420px":"auto"}},{children:[!!we.imageComponent&&!Ee&&!s.isRCSChannel(null==t?void 0:t.channel)&&e.jsxs(j.EditTemplateMediaContainer,{children:[e.jsx(f.default,{imageName:null!==(U=null===(L=null==Je?void 0:Je.example)||void 0===L?void 0:L.header_handle)&&void 0!==U?U:[],handleImageChange:Fe.handleImageChange,mediaType:null==Je?void 0:Je.format,error:Fe.error,isLoading:Fe.loading,setOpenEditMedia:Fe.setOpenEditMedia,selectedVariable:v.isVariable(null!==(N=null===(w=null===(A=null==Je?void 0:Je.example)||void 0===A?void 0:A.header_handle)||void 0===w?void 0:w[0])&&void 0!==N?N:"")?null===(_=null===(S=null==Je?void 0:Je.example)||void 0===S?void 0:S.header_handle)||void 0===_?void 0:_[0]:(null===(F=null===(H=null==t?void 0:t.mapping)||void 0===H?void 0:H.header)||void 0===F?void 0:F[0])?null===(Y=null===(Q=null==t?void 0:t.mapping)||void 0===Q?void 0:Q.header)||void 0===Y?void 0:Y[0]:Fe.selectedVariable}),(null==Re?void 0:Re.format)==d.HEADER_TYPES.DOCUMENT?e.jsx(M,{children:xe===r.POD.CHATBOT?e.jsx(a.InputWithVariables,{labelText:"PDF Name",placeHolder:"Enter the name",errorMessage:$e||void 0,onChange:e=>{var n;Ge(""),null==D||D(null!==(n=null==e?void 0:e.actualValue)&&void 0!==n?n:"")},pickerType:n.PickerType.EMBEDDED,noMaxCharCheck:!0,allowMix:!0,showVarHeader:!0,varHeaderText:"Select variable",prevVariable:{actualValue:null!=q?q:"",variableType:"string"},variablesList:I,showAddButton:!0}):e.jsx(l.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:We,errorMessage:$e||void 0,onBlur:()=>{if(!We)return null==D||D(""),void Ge("PDF name is Required");const e=m.validateInputName(We);null==D||D(We),Ge(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Ge(""),Ke(e)}})}):e.jsx(e.Fragment,{})]}),(null===(W=we.bodyVariables)||void 0===W?void 0:W.length)>0&&e.jsx(E.default,{containerStyle:{paddingTop:we.mediaComponent?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null===(K=we.descriptionComponents)||void 0===K?void 0:K.map(((n,t)=>e.jsx(O.default,{originalVariableList:null!=Oe&&Oe>-1?Ce.cards[Oe]:Ce,type:n.type,descriptionComponent:n.component,showVariableModal:k},t))),(null===(X=null===(G=null!=Oe&&Oe>-1?null===($=Ce.cards[Oe])||void 0===$?void 0:$.buttons:null==Ce?void 0:Ce.buttons)||void 0===G?void 0:G.filter((e=>"URL"===e.type)))||void 0===X?void 0:X.length)>0&&e.jsx(E.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(Z=null===(J=null!=Oe&&Oe>-1?null===(z=Ce.cards[Oe])||void 0===z?void 0:z.buttons:null==Ce?void 0:Ce.buttons)||void 0===J?void 0:J.filter((e=>xe===r.POD.CHATBOT||"URL"===e.type)))||void 0===Z?void 0:Z.map(((n,t)=>{const o=n.buttonVariable===p.STATIC_URL_VARIABLE_NAME,i=n.buttonVariable===p.UNSUBSCRIBE_URL_VARIABLE;if("URL"===n.type)return e.jsx(y.default,{variableListIndex:t,disableEdit:o||i,CTAoptions:null==V?void 0:V.CTAoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},Ce.cards[Oe]):Object.assign({},Ce),updateSelectedURLTemplateBtn:Xe},`${t}_${Oe}`)})),xe===r.POD.CHATBOT&&(null===(ne=null===(ee=Ie[0])||void 0===ee?void 0:ee.component)||void 0===ne?void 0:ne.buttons)&&(null===(ie=null===(oe=null===(te=Ie[0])||void 0===te?void 0:te.component)||void 0===oe?void 0:oe.buttons)||void 0===ie?void 0:ie.length)>0&&e.jsx(b.BackTrackComponent,{backTrackMessage:null===(le=null==Te?void 0:Te.backTrackExtra)||void 0===le?void 0:le[0],setBackTrackMessage:null===(ae=null==Te?void 0:Te.backTrackExtra)||void 0===ae?void 0:ae[1]}),!s.isRCSChannel(null==t?void 0:t.channel)&&(null===(re=null===(de=null!=Oe&&Oe>-1?null===(se=Ce.cards[Oe])||void 0===se?void 0:se.buttons:null==Ce?void 0:Ce.buttons)||void 0===de?void 0:de.filter((e=>"QUICK_REPLY"===e.type)))||void 0===re?void 0:re.length)>0&&(xe!==r.POD.CHATBOT?e.jsx(E.default,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking  the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):e.jsx(b.BackTrackComponent,{backTrackMessage:null===(ue=null==Te?void 0:Te.backTrackExtra)||void 0===ue?void 0:ue[0],setBackTrackMessage:null===(pe=null==Te?void 0:Te.backTrackExtra)||void 0===pe?void 0:pe[1]})),!s.isRCSChannel(null==t?void 0:t.channel)&&(null===(me=null===(ve=null!=Oe&&Oe>-1?null===(ce=Ce.cards[Oe])||void 0===ce?void 0:ce.buttons:null==Ce?void 0:Ce.buttons)||void 0===ve?void 0:ve.filter((e=>"QUICK_REPLY"===e.type)))||void 0===me?void 0:me.map(((n,t)=>{if("QUICK_REPLY"===n.type&&xe!==r.POD.CHATBOT)return e.jsx(y.default,{variableListIndex:t,QRBoptions:null==V?void 0:V.QRBoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},Ce.cards[Oe]):Object.assign({},Ce),updateSelectedQRBTemplateBtn:ze},`${t}_${Oe}`)}))),xe===r.POD.CHATBOT&&Ue&&e.jsx(g.DiscountCodeComponent,{discountCode:null===(be=null==Te?void 0:Te.discountCodeExtra)||void 0===be?void 0:be[0],setDiscountCode:null===(ge=null==Te?void 0:Te.discountCodeExtra)||void 0===ge?void 0:ge[1]}),null===(fe=null!=Oe&&Oe>-1?null===(he=Ce.cards[Oe])||void 0===he?void 0:he.buttons:null==Ce?void 0:Ce.buttons)||void 0===fe?void 0:fe.map(((n,t)=>{var o,i,a,s,d;if("COPY_CODE"===n.type)return e.jsx(e.Fragment,{children:ye?e.jsx("div",Object.assign({style:{marginBottom:20,borderRadius:4,padding:"8px 10px"}},{children:e.jsx(l.Input,{state:"disabled",labelText:null!==(o=n.text)&&void 0!==o?o:"Copy Code",value:null!==(i=n.buttonVariable)&&void 0!==i?i:"",onChangeText:()=>{}})})):e.jsx(x.default,{index:t,variable:{variableName:null!==(a=n.text)&&void 0!==a?a:"Copy Code",updatedValue:null!==(s=n.buttonVariable)&&void 0!==s?s:"",type:"string",isEditableVariable:!0,index:null!==(d=n.index)&&void 0!==d?d:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},t)})}))]}))};
+`;exports.default=t=>{let{template:i,onTemplateChange:V,whatsappSpecificPickerMeta:k,showVariableModal:I,variableListForImage:R,setDiscountCode:q,fileName:D,setFileName:P}=t;var L,U,A,w,N,S,_,H,F,Q,Y,W,K,$,G,X,z,J,Z,ee,ne,te,oe,ie,le,ae,se,de,re,ue,pe,ce,ve,me,be,ge,he,fe,je;const Ce=i.isCarouselType,{originalVariableList:xe,pod:Te,extras:Oe,selectedCarouselIndex:Ee,isProductCarouselType:ye,disableCopyCode:Ve,isError:Be,cardIndex:Me}=u.useTemplateModalContext(),{descriptionComponents:ke,urlBtns:Ie,qrbBtns:Re,imageComponent:qe,bodyVariables:De,headerVariables:Pe,titleVariables:Le}=c.getAllDataFromTemplateComponent(i),Ue=o.useRef(null),[Ae,we]=o.useState(!1),[Ne,Se]=o.useState(-1===Ee?{descriptionComponents:ke,urlBtns:Ie,qrbBtns:Re,imageComponent:qe,bodyVariables:De,headerVariables:Pe,titleVariables:Le}:{}),{uploadMediaLink:_e,uploadMediaFiles:He,validateMimeType:Fe}=k,Qe=C.useEditWhatsappTemplateMedia({uploadMediaLink:_e,uploadMediaFiles:He,updateTemplateImageUrl:function(e,n){var t,o,l,a,s,d,r,u;let p;p=null!=Ee&&Ee>-1?{components:null===(o=null===(t=i.components[Me])||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Ee].components,mapping:null===(a=null===(l=null==i?void 0:i.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Ee]}:Object.assign({},i);const c=null===(s=null==p?void 0:p.components)||void 0===s?void 0:s.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==c&&c>-1&&(null==p?void 0:p.components[c])){const t=Object.assign(Object.assign({},p.components[c]),{format:n,example:{header_handle:[e]}}),o=[...p.components];o[c]=t,p=Object.assign(Object.assign({},p),{components:o})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Ee&&Ee>-1){const e=B.default(i);e.components[Me].cards[Ee].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==e?void 0:e.mapping)||void 0===r?void 0:r.cards.length)>0&&(e.mapping.cards[Ee]=null!==(u=p.mapping)&&void 0!==u?u:{}),null==V||V(Object.assign({},e)),We(!0)}else null==V||V(Object.assign({},p))},validateMimeType:Fe,mediaComponent:Ce?Ne.imageComponent:qe,fileRef:Ue}),[Ye,We]=o.useState(!1),[Ke,$e]=o.useState(D),[Ge,Xe]=o.useState();function ze(e,n,t){var o,l,a,d,r,u,p,c,v,m;const b=null!=Ee&&Ee>-1?{components:null===(o=Object.assign({},i).components[Me].cards)||void 0===o?void 0:o[Ee].components,mapping:null===(l=Object.assign({},i).mapping.cards)||void 0===l?void 0:l[Ee]}:Object.assign({},i),g=B.default(b),h="custom"===n&&"string"==typeof e,f=h?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Ee&&Ee>-1&&ye){const n=Object.assign({},i).components.map((e=>{var n;return s.isCarouselComponent(e.type)?Object.assign(Object.assign({},e),{cards:null===(n=e.cards)||void 0===n?void 0:n.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var n,o,i;if("BUTTONS"===e.type){const l=null===(n=e.buttons)||void 0===n?void 0:n.filter((e=>"URL"===e.type));let a=null!==(o=null==l?void 0:l[t])&&void 0!==o?o:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[f]});const s=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},e),{buttons:s})}return e}))})))}):e})),o=null===(d=null===(a=Object.assign({},i).mapping)||void 0===a?void 0:a.cards)||void 0===d?void 0:d.map((n=>{var o;return Object.assign(Object.assign({},n),{buttons:null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.map(((n,o)=>o===t?h?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"":n))})})),l=B.default(i);return l.components=n,l.mapping.cards=o,void(null==V||V(Object.assign({},l)))}const j=null==g?void 0:g.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==j&&j>-1){const o=null===(r=null==g?void 0:g.components[j].buttons)||void 0===r?void 0:r.filter((e=>"URL"===e.type));if((null==o?void 0:o.length)>0){const i="custom"===n&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=o[t];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(c=null===(p=null===(u=g.components)||void 0===u?void 0:u[j])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},g.components[j]),{buttons:s}),r=null===(v=g.mapping)||void 0===v?void 0:v.buttons;r&&r.length>0&&(r[t]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},g.mapping),{buttons:r});g.mapping=m;const b=[...g.components];b[j]=d,g.components=b}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(m=e.placeHolder)||void 0===m?void 0:m.slice(2,-2))?we(!0):(we(!1),null==q||q(""))}if(null!=Ee&&Ee>-1){const e=B.default(i);e.components[Me].cards[Ee].components=g.components,e.mapping.cards[Ee]=g.mapping,null==V||V(Object.assign({},e))}else null==V||V(g)}function Je(e,n,t){var o,l,a,d,r,u,p;const c=null!=Ee&&Ee>-1?{components:null===(o=Object.assign({},i).components[Me].cards)||void 0===o?void 0:o[Ee].components,mapping:null===(l=Object.assign({},i).mapping.cards)||void 0===l?void 0:l[Ee]}:Object.assign({},i);if(null!=Ee&&Ee>-1&&ye){const n=Object.assign({},i).components.map((n=>{var o;return s.isCarouselComponent(n.type)?Object.assign(Object.assign({},n),{cards:null===(o=n.cards)||void 0===o?void 0:o.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var o,i,l;if("BUTTONS"===n.type){const a=null===(o=null==n?void 0:n.buttons)||void 0===o?void 0:o.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[t])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),o=B.default(i);return o.components=n,void(null==V||V(Object.assign({},o)))}const v=null==c?void 0:c.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==v&&v>-1){const n=null===(d=null===(a=null==c?void 0:c.components[v])||void 0===a?void 0:a.buttons)||void 0===d?void 0:d.filter((e=>"QUICK_REPLY"===e.type));if(n){let o=n[t];o=Object.assign(Object.assign({},o),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(p=null===(u=null===(r=c.components)||void 0===r?void 0:r[v])||void 0===u?void 0:u.buttons)&&void 0!==p?p:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==o?void 0:o.text)?o:e)),l=Object.assign(Object.assign({},c.components[v]),{buttons:i}),a=[...c.components];a[v]=l,c.components=a}}if(null!=Ee&&Ee>-1){const e=B.default(i);e.components[Me].cards[Ee].components=c.components,null==V||V(Object.assign({},e))}else null==V||V(c)}o.useEffect((()=>{var e,n;if(null===(e=i.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))we(!0);else{we(!1);const e=null===(n=null==Oe?void 0:Oe.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[i]),o.useEffect((()=>{var e,n,t,o;if(null!=Ee&&Ee>-1){const l={components:null===(n=null===(e=i.components[Me])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Ee].components,mapping:null===(o=null===(t=null==i?void 0:i.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Ee]},{descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v}=c.getAllDataFromTemplateComponent(l);Se({descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v})}else if(null!=Ee&&-1===Ee){const{descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:l,headerVariables:a,titleVariables:s}=c.getAllDataFromTemplateComponent(i);Se({descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:l,headerVariables:a,titleVariables:s})}}),[Ee]),o.useEffect((()=>{var e,n,t,o;if(null!=Ee&&Ee>-1&&Ye){const l={components:null===(n=null===(e=i.components[Me])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Ee].components,mapping:null===(o=null===(t=null==i?void 0:i.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Ee]},{descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v}=c.getAllDataFromTemplateComponent(l);Se({descriptionComponents:a,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:u,headerVariables:p,titleVariables:v}),We(!1)}}),[Ye]);o.useEffect((()=>{Be&&Te===r.POD.CHATBOT&&(()=>{if(!D)return void Xe("PDF name is Required");const e=m.validateInputNameChatbot(D);null==P||P(null!=D?D:""),Xe(e?"Please enter a valid PDF name":void 0)})()}),[Be]);const Ze=Ce?Ne.imageComponent:qe;return Qe.openEditMedia?e.jsx(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsx(h.default,{mediaComponentFormat:null!==(L=Ze.format)&&void 0!==L?L:d.HEADER_TYPES.IMAGE,uploadMedia:Qe.uploadMedia,variableListForImage:R||[],useEditWhatsappTemplateMediaResponse:Qe,setOpenEditMedia:Qe.setOpenEditMedia,openEditMedia:Qe.openEditMedia,editIconRef:Qe.editIconRef,fileRef:Ue})})):e.jsxs(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:ye?"420px":"auto"}},{children:[!!Ne.imageComponent&&!ye&&!s.isRCSChannel(null==i?void 0:i.channel)&&e.jsxs(j.EditTemplateMediaContainer,{children:[e.jsx(f.default,{imageName:null!==(A=null===(U=null==Ze?void 0:Ze.example)||void 0===U?void 0:U.header_handle)&&void 0!==A?A:[],handleImageChange:Qe.handleImageChange,mediaType:null==Ze?void 0:Ze.format,error:Qe.error,isLoading:Qe.loading,setOpenEditMedia:Qe.setOpenEditMedia,selectedVariable:v.isVariable(null!==(S=null===(N=null===(w=null==Ze?void 0:Ze.example)||void 0===w?void 0:w.header_handle)||void 0===N?void 0:N[0])&&void 0!==S?S:"")?null===(H=null===(_=null==Ze?void 0:Ze.example)||void 0===_?void 0:_.header_handle)||void 0===H?void 0:H[0]:(null===(Q=null===(F=null==i?void 0:i.mapping)||void 0===F?void 0:F.header)||void 0===Q?void 0:Q[0])?null===(W=null===(Y=null==i?void 0:i.mapping)||void 0===Y?void 0:Y.header)||void 0===W?void 0:W[0]:Qe.selectedVariable}),(null==qe?void 0:qe.format)==d.HEADER_TYPES.DOCUMENT?e.jsx(M,{children:Te===r.POD.CHATBOT?e.jsx(a.InputWithVariables,{labelText:"PDF Name",placeHolder:"Enter the name",errorMessage:Ge||void 0,onChange:e=>{var n;Xe(""),null==P||P(null!==(n=null==e?void 0:e.actualValue)&&void 0!==n?n:"")},pickerType:n.PickerType.EMBEDDED,noMaxCharCheck:!0,allowMix:!0,showVarHeader:!0,varHeaderText:"Select variable",prevVariable:{actualValue:null!=D?D:"",variableType:"string"},variablesList:R,showAddButton:!0}):e.jsx(l.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ke,errorMessage:Ge||void 0,onBlur:()=>{if(!Ke)return null==P||P(""),void Xe("PDF name is Required");const e=m.validateInputName(Ke);null==P||P(Ke),Xe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Xe(""),$e(e)}})}):e.jsx(e.Fragment,{})]}),(null===(K=Ne.bodyVariables)||void 0===K?void 0:K.length)>0&&e.jsx(E.default,{containerStyle:{paddingTop:Ne.mediaComponent?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null===($=Ne.descriptionComponents)||void 0===$?void 0:$.map(((n,t)=>e.jsx(O.default,{originalVariableList:null!=Ee&&Ee>-1?xe.cards[Ee]:xe,type:n.type,descriptionComponent:n.component,showVariableModal:I},t))),(null===(z=null===(X=null!=Ee&&Ee>-1?null===(G=xe.cards[Ee])||void 0===G?void 0:G.buttons:null==xe?void 0:xe.buttons)||void 0===X?void 0:X.filter((e=>"URL"===e.type)))||void 0===z?void 0:z.length)>0&&e.jsx(E.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(ee=null===(Z=null!=Ee&&Ee>-1?null===(J=xe.cards[Ee])||void 0===J?void 0:J.buttons:null==xe?void 0:xe.buttons)||void 0===Z?void 0:Z.filter((e=>Te===r.POD.CHATBOT||"URL"===e.type)))||void 0===ee?void 0:ee.map(((n,t)=>{const o=n.buttonVariable===p.STATIC_URL_VARIABLE_NAME,i=n.buttonVariable===p.UNSUBSCRIBE_URL_VARIABLE;if("URL"===n.type)return e.jsx(y.default,{variableListIndex:t,disableEdit:o||i,CTAoptions:null==k?void 0:k.CTAoptions,button:n,currentVariableList:null!=Ee&&Ee>-1?Object.assign({},xe.cards[Ee]):Object.assign({},xe),updateSelectedURLTemplateBtn:ze},`${t}_${Ee}`)})),Te===r.POD.CHATBOT&&(null===(te=null===(ne=Re[0])||void 0===ne?void 0:ne.component)||void 0===te?void 0:te.buttons)&&(null===(le=null===(ie=null===(oe=Re[0])||void 0===oe?void 0:oe.component)||void 0===ie?void 0:ie.buttons)||void 0===le?void 0:le.length)>0&&e.jsx(b.BackTrackComponent,{backTrackMessage:null===(ae=null==Oe?void 0:Oe.backTrackExtra)||void 0===ae?void 0:ae[0],setBackTrackMessage:null===(se=null==Oe?void 0:Oe.backTrackExtra)||void 0===se?void 0:se[1]}),!s.isRCSChannel(null==i?void 0:i.channel)&&(null===(ue=null===(re=null!=Ee&&Ee>-1?null===(de=xe.cards[Ee])||void 0===de?void 0:de.buttons:null==xe?void 0:xe.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ue?void 0:ue.length)>0&&(Te!==r.POD.CHATBOT?e.jsx(E.default,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking  the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):e.jsx(b.BackTrackComponent,{backTrackMessage:null===(pe=null==Oe?void 0:Oe.backTrackExtra)||void 0===pe?void 0:pe[0],setBackTrackMessage:null===(ce=null==Oe?void 0:Oe.backTrackExtra)||void 0===ce?void 0:ce[1]})),!s.isRCSChannel(null==i?void 0:i.channel)&&(null===(be=null===(me=null!=Ee&&Ee>-1?null===(ve=xe.cards[Ee])||void 0===ve?void 0:ve.buttons:null==xe?void 0:xe.buttons)||void 0===me?void 0:me.filter((e=>"QUICK_REPLY"===e.type)))||void 0===be?void 0:be.map(((n,t)=>{if("QUICK_REPLY"===n.type&&Te!==r.POD.CHATBOT)return e.jsx(y.default,{variableListIndex:t,QRBoptions:null==k?void 0:k.QRBoptions,button:n,currentVariableList:null!=Ee&&Ee>-1?Object.assign({},xe.cards[Ee]):Object.assign({},xe),updateSelectedQRBTemplateBtn:Je},`${t}_${Ee}`)}))),Te===r.POD.CHATBOT&&Ae&&e.jsx(g.DiscountCodeComponent,{discountCode:null===(ge=null==Oe?void 0:Oe.discountCodeExtra)||void 0===ge?void 0:ge[0],setDiscountCode:null===(he=null==Oe?void 0:Oe.discountCodeExtra)||void 0===he?void 0:he[1]}),null===(je=null!=Ee&&Ee>-1?null===(fe=xe.cards[Ee])||void 0===fe?void 0:fe.buttons:null==xe?void 0:xe.buttons)||void 0===je?void 0:je.map(((n,t)=>{var o,i,a,s,d;if("COPY_CODE"===n.type)return e.jsx(e.Fragment,{children:Ve?e.jsx("div",Object.assign({style:{marginBottom:20,borderRadius:4,padding:"8px 10px"}},{children:e.jsx(l.Input,{state:"disabled",labelText:null!==(o=n.text)&&void 0!==o?o:"Copy Code",value:null!==(i=n.buttonVariable)&&void 0!==i?i:"",onChangeText:()=>{}})})):e.jsx(x.default,{index:t,variable:{variableName:null!==(a=n.text)&&void 0!==a?a:"Copy Code",updatedValue:null!==(s=n.buttonVariable)&&void 0!==s?s:"",type:"string",isEditableVariable:!0,index:null!==(d=n.index)&&void 0!==d?d:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},t)})}))]}))};
 //# sourceMappingURL=EditWhatsAppTemplateV2.js.map