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

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

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

Files changed (1557) hide show

package/dist/cjs/components/ai-modals/ActivateBikAI.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ActivateBikAI.js","sources":["../../../../src/components/ai-modals/ActivateBikAI.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport Graph from '../../assets/icons/graph.svg';\nimport Sparkle from '../../assets/icons/sparkle.svg';\nimport { Button } from '../button';\nimport { Modal } from '../modals/Modal';\nimport { POD } from '../template-preview/models/WhatsAppTemplate';\nimport { BodyPrimary, TitleLarge, TitleMedium } from '../TypographyStyle';\n\nexport const ActivateBikAi: React.FC<{\n\topen: boolean;\n\tonModalClose: () => void;\n\tonRightBtnClick: () => void;\n\tonLeftBtnClick: () => void;\n\tsource: POD.CHATBOT \| POD.CRM;\n}> = ({ open, onModalClose, onRightBtnClick, onLeftBtnClick, source }) => {\n\treturn (\n\t\t<Modal\n\t\t\topen={open}\n\t\t\tcentralContainerStyles={{\n\t\t\t\theight: '430px',\n\t\t\t\twidth: '464px',\n\t\t\t\tborderRadius: '12px',\n\t\t\t}}\n\t\t\tzIndex={40}\n\t\t\tonClose={onModalClose}\n\t\t\tcloseOnOutsideClick\n\t\t>\n\t\t\t<div>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\theight: '180px',\n\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\tbackgroundColor: 'rgba(142, 142, 142, 0.2)',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: '18px',\n\t\t\t\t\t\tpadding: '24px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<Graph width={100} height={90} />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t{source === 'CHATBOT' ? (\n\t\t\t\t\t\t\t<TitleMedium>\n\t\t\t\t\t\t\t\tUnlock higher conversion and ease agent work with BIK.AI\n\t\t\t\t\t\t\t</TitleMedium>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<TitleMedium>\n\t\t\t\t\t\t\t\tExperience reduced Average Handling Time of your tickets with\n\t\t\t\t\t\t\t\tBik.AI!\n\t\t\t\t\t\t\t</TitleMedium>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\tgap: '16px',\n\t\t\t\t\t\tpadding: '24px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\tgap: '4px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TitleLarge>Activate BIK AI</TitleLarge>\n\t\t\t\t\t\t<Sparkle width={32} height={32} />\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{source === 'CHATBOT' ? (\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\tflexDirection: 'column',\n\t\t\t\t\t\t\t\tjustifyContent: 'center',\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<BodyPrimary color=\"#888888\">\n\t\t\t\t\t\t\t\tSync your Shopify Data to Bik.AI to supercharge it with\n\t\t\t\t\t\t\t</BodyPrimary>\n\n\t\t\t\t\t\t\t<BodyPrimary color=\"#888888\">\n\t\t\t\t\t\t\t\tyour store’s data to start personalizing it to your\n\t\t\t\t\t\t\t</BodyPrimary>\n\n\t\t\t\t\t\t\t<BodyPrimary color=\"#888888\">customers!</BodyPrimary>\n\t\t\t\t\t\t</div>\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\tdisplay: 'flex',\n\t\t\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\t\t\tjustifyContent: 'center',\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<BodyPrimary color=\"#888888\">\n\t\t\t\t\t\t\t\tSync your Shopify Data to Bik.AI to supercharge it with{' '}\n\t\t\t\t\t\t\t</BodyPrimary>\n\n\t\t\t\t\t\t\t<BodyPrimary color=\"#888888\">\n\t\t\t\t\t\t\t\tyour store’s data to start responding to customer\n\t\t\t\t\t\t\t</BodyPrimary>\n\n\t\t\t\t\t\t\t<BodyPrimary color=\"#888888\">queries right away!</BodyPrimary>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t\tpaddingBottom: '24px',\n\t\t\t\t\t\tpaddingLeft: '24px',\n\t\t\t\t\t\tpaddingRight: '24px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Learn More'}\n\t\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\t\tsize=\"large\"\n\t\t\t\t\t\tonClick={onLeftBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Sync Shopify Data'}\n\t\t\t\t\t\tsize=\"large\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tbackgroundColor: COLORS.background.brand,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonClick={onRightBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n};\n"],"names":["~~ActivateBikAi~~","open","onModalClose","onRightBtnClick","onLeftBtnClick","source","_jsx","Modal","Object","assign","centralContainerStyles","height","width","borderRadius","zIndex","onClose","closeOnOutsideClick","children","_jsxs","jsxs","style","backgroundColor","display","justifyContent","alignItems","gap","padding","jsx","Graph","TitleMedium","flexDirection","TitleLarge","Sparkle","BodyPrimary","color","paddingBottom","paddingLeft","paddingRight","Button","buttonText","buttonType","size","onClick","COLORS","background","brand"],"mappings":"mWAeKA,~~EAAGC~~,~~OAAMC~~,~~eAAcC~~,~~kBAAiBC~~,~~iBAAgBC~~,~~YAE3DC~~,MAACC,EAAAA,MAAKC,OAAAC,OAAA,CACLR,KAAMA,EACNS,uBAAwB,CACvBC,OAAQ,QACRC,MAAO,QACPC,aAAc,QAEfC,OAAQ,GACRC,QAASb,EACTc,qBAAmB,GAAA,CAAAC,SAEnBC,EACCC,KAAA,MAAA,CAAAF,SAAA,CAAAC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNT,OAAQ,QACRC,MAAO,OACPS,gBAAiB,2BACjBC,QAAS,OACTC,eAAgB,SAChBC,WAAY,SACZC,IAAK,OACLC,QAAS,SACT,CAAAT,SAAA,CAEDX,sBACCA,EAACqB,IAAAC,UAAM,CAAAhB,MAAO,IAAKD,OAAQ,OAE5BL,EACEqB,IAAA,MAAA,CAAAV,SAAW,YAAXZ,EACAC,EAAAA,IAACuB,EAAAA,mFAIDvB,EAACqB,IAAAE,wGAQJX,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,eAAgB,SAChBC,WAAY,SACZM,cAAe,SACfL,IAAK,OACLC,QAAS,SAGV,CAAAT,SAAA,CAAAC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTQ,cAAe,MACfL,IAAK,QAGN,CAAAR,SAAA,CAAAX,EAAAqB,IAACI,aAAU,CAAAd,SAAA,oBACXX,EAAAqB,IAACK,UAAO,CAACpB,MAAO,GAAID,OAAQ,SAGjB,YAAXN,EACAa,EACCC,KAAA,MAAAX,OAAAC,OAAA,CAAAW,MAAO,CACNE,QAAS,OACTQ,cAAe,SACfP,eAAgB,SAChBC,WAAY,WACZ,CAAAP,SAAA,CAEDX,EAACqB,IAAAM,cAAYzB,OAAAC,OAAA,CAAAyB,MAAM,WAEL,CAAAjB,SAAA,6DAEdX,EAACqB,IAAAM,cAAYzB,OAAAC,OAAA,CAAAyB,MAAM,WAAS,CAAAjB,SAAA,yDAI5BX,EAAAqB,IAACM,cAAWzB,OAAAC,OAAA,CAACyB,MAAM,WAAkC,CAAAjB,SAAA,oBAGtDC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTQ,cAAe,SACfP,eAAgB,SAChBC,WAAY,WACZ,CAAAP,SAAA,CAEDC,EAACC,KAAAc,cAAYzB,OAAAC,OAAA,CAAAyB,MAAM,WACsC,CAAAjB,SAAA,CAAA,0DAAA,QAGzDX,EAACqB,IAAAM,6BAAYC,MAAM,WAAS,CAAAjB,SAAA,uDAI5BX,EAAAqB,IAACM,cAAWzB,OAAAC,OAAA,CAACyB,MAAM,WAA2C,CAAAjB,SAAA,iCAKjEC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTQ,cAAe,MACfP,eAAgB,WAChBC,WAAY,SACZC,IAAK,OACLU,cAAe,OACfC,YAAa,OACbC,aAAc,SACd,CAAApB,SAAA,CAEDX,EAACqB,IAAAW,SACA,CAAAC,WAAY,aACZC,WAAW,OACXC,KAAK,QACLC,QAAStC,IAEVE,EAACqB,IAAAW,UACAC,WAAY,oBACZE,KAAK,QACLrB,MAAO,CACNC,gBAAiBsB,EAAAA,OAAOC,WAAWC,OAEpCH,QAASvC"}
1	+ {"version":3,"file":"ActivateBikAI.js","sources":["../../../../src/components/ai-modals/ActivateBikAI.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport Graph from '../../assets/icons/graph.svg';\nimport Sparkle from '../../assets/icons/sparkle.svg';\nimport { Button } from '../button';\nimport { Modal } from '../modals/Modal';\nimport { POD } from '../template-preview/models/WhatsAppTemplate';\nimport { BodyPrimary, TitleLarge, TitleMedium } from '../TypographyStyle';\n\nexport const ActivateBikAi: React.FC<{\n\topen: boolean;\n\tonModalClose: () => void;\n\tonRightBtnClick: () => void;\n\tonLeftBtnClick: () => void;\n\tsource: POD.CHATBOT \| POD.CRM;\n}> = ({ open, onModalClose, onRightBtnClick, onLeftBtnClick, source }) => {\n\treturn (\n\t\t<Modal\n\t\t\topen={open}\n\t\t\tcentralContainerStyles={{\n\t\t\t\theight: '430px',\n\t\t\t\twidth: '464px',\n\t\t\t\tborderRadius: '12px',\n\t\t\t}}\n\t\t\tzIndex={40}\n\t\t\tonClose={onModalClose}\n\t\t\tcloseOnOutsideClick\n\t\t>\n\t\t\t<div>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\theight: '180px',\n\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\tbackgroundColor: 'rgba(142, 142, 142, 0.2)',\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: '18px',\n\t\t\t\t\t\tpadding: '24px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<Graph width={100} height={90} />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div>\n\t\t\t\t\t\t{source === 'CHATBOT' ? (\n\t\t\t\t\t\t\t<TitleMedium>\n\t\t\t\t\t\t\t\tUnlock higher conversion and ease agent work with BIK.AI\n\t\t\t\t\t\t\t</TitleMedium>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<TitleMedium>\n\t\t\t\t\t\t\t\tExperience reduced Average Handling Time of your tickets with\n\t\t\t\t\t\t\t\tBik.AI!\n\t\t\t\t\t\t\t</TitleMedium>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\tgap: '16px',\n\t\t\t\t\t\tpadding: '24px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\tgap: '4px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<TitleLarge>Activate BIK AI</TitleLarge>\n\t\t\t\t\t\t<Sparkle width={32} height={32} />\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{source === 'CHATBOT' ? (\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\tflexDirection: 'column',\n\t\t\t\t\t\t\t\tjustifyContent: 'center',\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<BodyPrimary color=\"#888888\">\n\t\t\t\t\t\t\t\tSync your Shopify Data to Bik.AI to supercharge it with\n\t\t\t\t\t\t\t</BodyPrimary>\n\n\t\t\t\t\t\t\t<BodyPrimary color=\"#888888\">\n\t\t\t\t\t\t\t\tyour store’s data to start personalizing it to your\n\t\t\t\t\t\t\t</BodyPrimary>\n\n\t\t\t\t\t\t\t<BodyPrimary color=\"#888888\">customers!</BodyPrimary>\n\t\t\t\t\t\t</div>\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\tdisplay: 'flex',\n\t\t\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\t\t\tjustifyContent: 'center',\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<BodyPrimary color=\"#888888\">\n\t\t\t\t\t\t\t\tSync your Shopify Data to Bik.AI to supercharge it with{' '}\n\t\t\t\t\t\t\t</BodyPrimary>\n\n\t\t\t\t\t\t\t<BodyPrimary color=\"#888888\">\n\t\t\t\t\t\t\t\tyour store’s data to start responding to customer\n\t\t\t\t\t\t\t</BodyPrimary>\n\n\t\t\t\t\t\t\t<BodyPrimary color=\"#888888\">queries right away!</BodyPrimary>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t\tpaddingBottom: '24px',\n\t\t\t\t\t\tpaddingLeft: '24px',\n\t\t\t\t\t\tpaddingRight: '24px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Learn More'}\n\t\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\t\tsize=\"large\"\n\t\t\t\t\t\tonClick={onLeftBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Sync Shopify Data'}\n\t\t\t\t\t\tsize=\"large\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tbackgroundColor: COLORS.background.brand,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonClick={onRightBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n};\n"],"names":["_ref","open","onModalClose","onRightBtnClick","onLeftBtnClick","source","_jsx","Modal","Object","assign","centralContainerStyles","height","width","borderRadius","zIndex","onClose","closeOnOutsideClick","children","_jsxs","jsxs","style","backgroundColor","display","justifyContent","alignItems","gap","padding","jsx","Graph","TitleMedium","flexDirection","TitleLarge","Sparkle","BodyPrimary","color","paddingBottom","paddingLeft","paddingRight","Button","buttonText","buttonType","size","onClick","COLORS","background","brand"],"mappings":"mWAeKA,IAAoE,IAAnEC,KAAEA,EAAIC,aAAEA,EAAYC,gBAAEA,EAAeC,eAAEA,EAAcC,OAAEA,GAAQL,EACpE,OACCM,MAACC,EAAAA,MAAKC,OAAAC,OAAA,CACLR,KAAMA,EACNS,uBAAwB,CACvBC,OAAQ,QACRC,MAAO,QACPC,aAAc,QAEfC,OAAQ,GACRC,QAASb,EACTc,qBAAmB,GAAA,CAAAC,SAEnBC,EACCC,KAAA,MAAA,CAAAF,SAAA,CAAAC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNT,OAAQ,QACRC,MAAO,OACPS,gBAAiB,2BACjBC,QAAS,OACTC,eAAgB,SAChBC,WAAY,SACZC,IAAK,OACLC,QAAS,SACT,CAAAT,SAAA,CAEDX,sBACCA,EAACqB,IAAAC,UAAM,CAAAhB,MAAO,IAAKD,OAAQ,OAE5BL,EACEqB,IAAA,MAAA,CAAAV,SAAW,YAAXZ,EACAC,EAAAA,IAACuB,EAAAA,mFAIDvB,EAACqB,IAAAE,wGAQJX,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,eAAgB,SAChBC,WAAY,SACZM,cAAe,SACfL,IAAK,OACLC,QAAS,SAGV,CAAAT,SAAA,CAAAC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTQ,cAAe,MACfL,IAAK,QAGN,CAAAR,SAAA,CAAAX,EAAAqB,IAACI,aAAU,CAAAd,SAAA,oBACXX,EAAAqB,IAACK,UAAO,CAACpB,MAAO,GAAID,OAAQ,SAGjB,YAAXN,EACAa,EACCC,KAAA,MAAAX,OAAAC,OAAA,CAAAW,MAAO,CACNE,QAAS,OACTQ,cAAe,SACfP,eAAgB,SAChBC,WAAY,WACZ,CAAAP,SAAA,CAEDX,EAACqB,IAAAM,cAAYzB,OAAAC,OAAA,CAAAyB,MAAM,WAEL,CAAAjB,SAAA,6DAEdX,EAACqB,IAAAM,cAAYzB,OAAAC,OAAA,CAAAyB,MAAM,WAAS,CAAAjB,SAAA,yDAI5BX,EAAAqB,IAACM,cAAWzB,OAAAC,OAAA,CAACyB,MAAM,WAAkC,CAAAjB,SAAA,oBAGtDC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTQ,cAAe,SACfP,eAAgB,SAChBC,WAAY,WACZ,CAAAP,SAAA,CAEDC,EAACC,KAAAc,cAAYzB,OAAAC,OAAA,CAAAyB,MAAM,WACsC,CAAAjB,SAAA,CAAA,0DAAA,QAGzDX,EAACqB,IAAAM,6BAAYC,MAAM,WAAS,CAAAjB,SAAA,uDAI5BX,EAAAqB,IAACM,cAAWzB,OAAAC,OAAA,CAACyB,MAAM,WAA2C,CAAAjB,SAAA,iCAKjEC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTQ,cAAe,MACfP,eAAgB,WAChBC,WAAY,SACZC,IAAK,OACLU,cAAe,OACfC,YAAa,OACbC,aAAc,SACd,CAAApB,SAAA,CAEDX,EAACqB,IAAAW,SACA,CAAAC,WAAY,aACZC,WAAW,OACXC,KAAK,QACLC,QAAStC,IAEVE,EAACqB,IAAAW,UACAC,WAAY,oBACZE,KAAK,QACLrB,MAAO,CACNC,gBAAiBsB,EAAAA,OAAOC,WAAWC,OAEpCH,QAASvC,aAIL"}

package/dist/cjs/components/ai-modals/AiCreditsExhausted.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),s=require("../../assets/icons/alert_triangle.svg.js"),n=require("../button/Button.js"),i=require("../modals/Modal.js"),r=require("../progress-bar/ProgressBarComponent.js"),o=require("../TypographyStyle.js");exports.AiCreditsExhausted=({open:l,onModalClose:a,body:d,onRightBtnClick:c,onLeftBtnClick:x})=>e.jsx(i.Modal,Object.assign({open:l,centralContainerStyles:{width:"498px",height:"312px",borderRadius:"12px"},onClose:a,closeOnOutsideClick:!0,zIndex:40},{children:e.jsxs("div",Object.assign({style:{padding:"24px",display:"flex",flexDirection:"column"}},{children:[e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"center"}},{children:e.jsx(o.TitleLarge,{children:"Free AI Credits Exhausted"})})),e.jsx("div",{style:{height:"24px"}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"12px"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center",gap:"4px"}},{children:[e.jsx(s.default,{color:t.COLORS.content.negative,width:20,height:20}),e.jsx("div",{style:{width:"8px"}}),e.jsx(o.TitleRegular,{children:"0/100"}),e.jsx(o.BodySecondary,Object.assign({color:t.COLORS.content.secondary},{children:"Free Credits left"}))]})),e.jsx(r.ProgressBarComponent,{completed:100,isAnimated:!1,height:16,color:t.COLORS.content.negative})]})),e.jsx("div",{style:{height:"24px"}}),e.jsx(o.BodyPrimary,Object.assign({color:t.COLORS.content.secondary},{children:d||"Contact support to add credits to generate replies using AI, and enjoy continued AI assistance!"})),e.jsx("div",{style:{height:"44px"}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:"12px"}},{children:[e.jsx(n.Button,{buttonText:"Learn More",buttonType:"text",size:"small",onClick:x}),e.jsx(n.Button,{buttonText:"Contact Support",size:"small",style:{backgroundColor:t.COLORS.background.brand},onClick:c})]}))]}))}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),s=require("../../assets/icons/alert_triangle.svg.js"),n=require("../button/Button.js"),i=require("../modals/Modal.js"),r=require("../progress-bar/ProgressBarComponent.js"),o=require("../TypographyStyle.js");exports.AiCreditsExhausted=l=>{let{open:a,onModalClose:d,body:c,onRightBtnClick:x,onLeftBtnClick:j}=l;return e.jsx(i.Modal,Object.assign({open:a,centralContainerStyles:{width:"498px",height:"312px",borderRadius:"12px"},onClose:d,closeOnOutsideClick:!0,zIndex:40},{children:e.jsxs("div",Object.assign({style:{padding:"24px",display:"flex",flexDirection:"column"}},{children:[e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"center"}},{children:e.jsx(o.TitleLarge,{children:"Free AI Credits Exhausted"})})),e.jsx("div",{style:{height:"24px"}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"12px"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",alignItems:"center",gap:"4px"}},{children:[e.jsx(s.default,{color:t.COLORS.content.negative,width:20,height:20}),e.jsx("div",{style:{width:"8px"}}),e.jsx(o.TitleRegular,{children:"0/100"}),e.jsx(o.BodySecondary,Object.assign({color:t.COLORS.content.secondary},{children:"Free Credits left"}))]})),e.jsx(r.ProgressBarComponent,{completed:100,isAnimated:!1,height:16,color:t.COLORS.content.negative})]})),e.jsx("div",{style:{height:"24px"}}),e.jsx(o.BodyPrimary,Object.assign({color:t.COLORS.content.secondary},{children:c||"Contact support to add credits to generate replies using AI, and enjoy continued AI assistance!"})),e.jsx("div",{style:{height:"44px"}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:"12px"}},{children:[e.jsx(n.Button,{buttonText:"Learn More",buttonType:"text",size:"small",onClick:j}),e.jsx(n.Button,{buttonText:"Contact Support",size:"small",style:{backgroundColor:t.COLORS.background.brand},onClick:x})]}))]}))}))};
 //# sourceMappingURL=AiCreditsExhausted.js.map

package/dist/cjs/components/ai-modals/AiCreditsExhausted.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AiCreditsExhausted.js","sources":["../../../../src/components/ai-modals/AiCreditsExhausted.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport AlertTriangle from '../../assets/icons/alert_triangle.svg';\nimport { Button } from '../button/Button';\nimport { Modal } from '../modals/Modal';\nimport { ProgressBarComponent } from '../progress-bar';\nimport {\n\tBodyPrimary,\n\tBodySecondary,\n\tTitleLarge,\n\tTitleRegular,\n} from '../TypographyStyle';\n\nexport const AiCreditsExhausted: React.FC<{\n\topen: boolean;\n\tonModalClose: () => void;\n\tbody?: string;\n\tonRightBtnClick: () => void;\n\tonLeftBtnClick: () => void;\n\n}> = ({ open, onModalClose, body, onRightBtnClick, onLeftBtnClick }) => {\n\treturn (\n\t\t<Modal\n\t\t\topen={open}\n\t\t\tcentralContainerStyles={{\n\t\t\t\twidth: '498px',\n\t\t\t\theight: '312px',\n\t\t\t\tborderRadius: '12px',\n\t\t\t}}\n\t\t\tonClose={onModalClose}\n\t\t\tcloseOnOutsideClick\n\t\t\tzIndex={40}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tpadding: '24px',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\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\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<TitleLarge>Free AI Credits Exhausted</TitleLarge>\n\t\t\t\t</div>\n\n\t\t\t\t<div style={{ height: '24px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\tgap: '4px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<AlertTriangle\n\t\t\t\t\t\t\tcolor={COLORS.content.negative}\n\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<div style={{ width: '8px' }}></div>\n\t\t\t\t\t\t<TitleRegular>0/100</TitleRegular>\n\t\t\t\t\t\t<BodySecondary color={COLORS.content.secondary}>\n\t\t\t\t\t\t\tFree Credits left\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</div>\n\t\t\t\t\t<ProgressBarComponent\n\t\t\t\t\t\tcompleted={100}\n\t\t\t\t\t\tisAnimated={false}\n\t\t\t\t\t\theight={16}\n\t\t\t\t\t\tcolor={COLORS.content.negative}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div style={{ height: '24px' }}></div>\n\n\t\t\t\t<BodyPrimary color={COLORS.content.secondary}>\n\t\t\t\t\t{body \|\|\n\t\t\t\t\t\t'Contact support to add credits to generate replies using AI, and enjoy continued AI assistance!'}\n\t\t\t\t</BodyPrimary>\n\n\t\t\t\t<div style={{ height: '44px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Learn More'}\n\t\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={onLeftBtnClick}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Contact Support'}\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tbackgroundColor: COLORS.background.brand,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonClick={onRightBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n};\n"],"names":["~~AiCreditsExhausted~~","open","onModalClose","body","onRightBtnClick","onLeftBtnClick","_jsx","Modal","Object","assign","centralContainerStyles","width","height","borderRadius","onClose","closeOnOutsideClick","zIndex","children","_jsxs","jsxs","style","padding","display","flexDirection","jsx","justifyContent","TitleLarge","gap","alignItems","AlertTriangle","color","COLORS","content","negative","TitleRegular","BodySecondary","secondary","ProgressBarComponent","completed","isAnimated","BodyPrimary","Button","buttonText","buttonType","size","onClick","backgroundColor","background","brand"],"mappings":"uXAoBKA,~~EAAGC~~,~~OAAMC~~,~~eAAcC~~,~~OAAMC~~,~~kBAAiBC~~,~~oBAEjDC~~,MAACC,EAAAA,MAAKC,OAAAC,OAAA,CACLR,KAAMA,EACNS,uBAAwB,CACvBC,MAAO,QACPC,OAAQ,QACRC,aAAc,QAEfC,QAASZ,EACTa,qBAAmB,EACnBC,OAAQ,IAAE,CAAAC,SAEVC,EACCC,KAAA,MAAAX,OAAAC,OAAA,CAAAW,MAAO,CACNC,QAAS,OACTC,QAAS,OACTC,cAAe,WAGhB,CAAAN,SAAA,CAAAX,EAAAkB,IAAA,MAAAhB,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTG,eAAgB,WAChB,CAAAR,SAEDX,MAACoB,aAAU,CAAAT,SAAA,iCAGZX,aAAKc,MAAO,CAAER,OAAQ,UAEtBM,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,SACfI,IAAK,SAGN,CAAAV,SAAA,CAAAC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,MACfK,WAAY,SACZD,IAAK,QAGN,CAAAV,SAAA,CAAAX,EAAAkB,IAACK,UACA,CAAAC,MAAOC,EAAAA,OAAOC,QAAQC,SACtBtB,MAAO,GACPC,OAAQ,KAETN,EAAKkB,IAAA,MAAA,CAAAJ,MAAO,CAAET,MAAO,SACrBL,EAAAkB,IAACU,eAAiC,CAAAjB,SAAA,UAClCX,MAAC6B,gBAAa3B,OAAAC,OAAA,CAACqB,MAAOC,EAAAA,OAAOC,QAAQI,WAErB,CAAAnB,SAAA,2BAEjBX,EAACkB,IAAAa,wBACAC,UAAW,IACXC,YAAY,EACZ3B,OAAQ,GACRkB,MAAOC,EAAAA,OAAOC,QAAQC,eAGxB3B,EAAAkB,IAAA,MAAA,CAAKJ,MAAO,CAAER,OAAQ,UAEtBN,MAACkC,cAAWhC,OAAAC,OAAA,CAACqB,MAAOC,EAAAA,OAAOC,QAAQI,WAAS,CAAAnB,SAC1Cd,GACA,qGAGFG,EAAKkB,IAAA,MAAA,CAAAJ,MAAO,CAAER,OAAQ,UAEtBM,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,MACfE,eAAgB,WAChBG,WAAY,SACZD,IAAK,SACL,CAAAV,SAAA,CAGDX,EAACkB,IAAAiB,SACA,CAAAC,WAAY,aACZC,WAAW,OACXC,KAAK,QACLC,QAASxC,IAGVC,EAACkB,IAAAiB,UACAC,WAAY,kBACZE,KAAK,QACLxB,MAAO,CACN0B,gBAAiBf,EAAAA,OAAOgB,WAAWC,OAEpCH,QAASzC"}
1	+ {"version":3,"file":"AiCreditsExhausted.js","sources":["../../../../src/components/ai-modals/AiCreditsExhausted.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport AlertTriangle from '../../assets/icons/alert_triangle.svg';\nimport { Button } from '../button/Button';\nimport { Modal } from '../modals/Modal';\nimport { ProgressBarComponent } from '../progress-bar';\nimport {\n\tBodyPrimary,\n\tBodySecondary,\n\tTitleLarge,\n\tTitleRegular,\n} from '../TypographyStyle';\n\nexport const AiCreditsExhausted: React.FC<{\n\topen: boolean;\n\tonModalClose: () => void;\n\tbody?: string;\n\tonRightBtnClick: () => void;\n\tonLeftBtnClick: () => void;\n\n}> = ({ open, onModalClose, body, onRightBtnClick, onLeftBtnClick }) => {\n\treturn (\n\t\t<Modal\n\t\t\topen={open}\n\t\t\tcentralContainerStyles={{\n\t\t\t\twidth: '498px',\n\t\t\t\theight: '312px',\n\t\t\t\tborderRadius: '12px',\n\t\t\t}}\n\t\t\tonClose={onModalClose}\n\t\t\tcloseOnOutsideClick\n\t\t\tzIndex={40}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tpadding: '24px',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\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\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<TitleLarge>Free AI Credits Exhausted</TitleLarge>\n\t\t\t\t</div>\n\n\t\t\t\t<div style={{ height: '24px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\tgap: '4px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<AlertTriangle\n\t\t\t\t\t\t\tcolor={COLORS.content.negative}\n\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<div style={{ width: '8px' }}></div>\n\t\t\t\t\t\t<TitleRegular>0/100</TitleRegular>\n\t\t\t\t\t\t<BodySecondary color={COLORS.content.secondary}>\n\t\t\t\t\t\t\tFree Credits left\n\t\t\t\t\t\t</BodySecondary>\n\t\t\t\t\t</div>\n\t\t\t\t\t<ProgressBarComponent\n\t\t\t\t\t\tcompleted={100}\n\t\t\t\t\t\tisAnimated={false}\n\t\t\t\t\t\theight={16}\n\t\t\t\t\t\tcolor={COLORS.content.negative}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div style={{ height: '24px' }}></div>\n\n\t\t\t\t<BodyPrimary color={COLORS.content.secondary}>\n\t\t\t\t\t{body \|\|\n\t\t\t\t\t\t'Contact support to add credits to generate replies using AI, and enjoy continued AI assistance!'}\n\t\t\t\t</BodyPrimary>\n\n\t\t\t\t<div style={{ height: '44px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Learn More'}\n\t\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={onLeftBtnClick}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Contact Support'}\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tbackgroundColor: COLORS.background.brand,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonClick={onRightBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n};\n"],"names":["_ref","open","onModalClose","body","onRightBtnClick","onLeftBtnClick","_jsx","Modal","Object","assign","centralContainerStyles","width","height","borderRadius","onClose","closeOnOutsideClick","zIndex","children","_jsxs","jsxs","style","padding","display","flexDirection","jsx","justifyContent","TitleLarge","gap","alignItems","AlertTriangle","color","COLORS","content","negative","TitleRegular","BodySecondary","secondary","ProgressBarComponent","completed","isAnimated","BodyPrimary","Button","buttonText","buttonType","size","onClick","backgroundColor","background","brand"],"mappings":"uXAoBKA,IAAkE,IAAjEC,KAAEA,EAAIC,aAAEA,EAAYC,KAAEA,EAAIC,gBAAEA,EAAeC,eAAEA,GAAgBL,EAClE,OACCM,MAACC,EAAAA,MAAKC,OAAAC,OAAA,CACLR,KAAMA,EACNS,uBAAwB,CACvBC,MAAO,QACPC,OAAQ,QACRC,aAAc,QAEfC,QAASZ,EACTa,qBAAmB,EACnBC,OAAQ,IAAE,CAAAC,SAEVC,EACCC,KAAA,MAAAX,OAAAC,OAAA,CAAAW,MAAO,CACNC,QAAS,OACTC,QAAS,OACTC,cAAe,WAGhB,CAAAN,SAAA,CAAAX,EAAAkB,IAAA,MAAAhB,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTG,eAAgB,WAChB,CAAAR,SAEDX,MAACoB,aAAU,CAAAT,SAAA,iCAGZX,aAAKc,MAAO,CAAER,OAAQ,UAEtBM,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,SACfI,IAAK,SAGN,CAAAV,SAAA,CAAAC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,MACfK,WAAY,SACZD,IAAK,QAGN,CAAAV,SAAA,CAAAX,EAAAkB,IAACK,UACA,CAAAC,MAAOC,EAAAA,OAAOC,QAAQC,SACtBtB,MAAO,GACPC,OAAQ,KAETN,EAAKkB,IAAA,MAAA,CAAAJ,MAAO,CAAET,MAAO,SACrBL,EAAAkB,IAACU,eAAiC,CAAAjB,SAAA,UAClCX,MAAC6B,gBAAa3B,OAAAC,OAAA,CAACqB,MAAOC,EAAAA,OAAOC,QAAQI,WAErB,CAAAnB,SAAA,2BAEjBX,EAACkB,IAAAa,wBACAC,UAAW,IACXC,YAAY,EACZ3B,OAAQ,GACRkB,MAAOC,EAAAA,OAAOC,QAAQC,eAGxB3B,EAAAkB,IAAA,MAAA,CAAKJ,MAAO,CAAER,OAAQ,UAEtBN,MAACkC,cAAWhC,OAAAC,OAAA,CAACqB,MAAOC,EAAAA,OAAOC,QAAQI,WAAS,CAAAnB,SAC1Cd,GACA,qGAGFG,EAAKkB,IAAA,MAAA,CAAAJ,MAAO,CAAER,OAAQ,UAEtBM,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,MACfE,eAAgB,WAChBG,WAAY,SACZD,IAAK,SACL,CAAAV,SAAA,CAGDX,EAACkB,IAAAiB,SACA,CAAAC,WAAY,aACZC,WAAW,OACXC,KAAK,QACLC,QAASxC,IAGVC,EAACkB,IAAAiB,UACAC,WAAY,kBACZE,KAAK,QACLxB,MAAO,CACN0B,gBAAiBf,EAAAA,OAAOgB,WAAWC,OAEpCH,QAASzC,cAIL"}

package/dist/cjs/components/ai-modals/AiCreditsLow.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),s=require("../../assets/icons/alert_triangle.svg.js"),i=require("../button/Button.js"),n=require("../modals/Modal.js"),r=require("../TypographyStyle.js");exports.AiCreditsLow=({open:o,onModalClose:l,onLeftBtnClick:d,onRightBtnClick:c})=>e.jsx(n.Modal,Object.assign({open:o,centralContainerStyles:{width:"498px",borderRadius:"12px"},onClose:l,closeOnOutsideClick:!0,zIndex:40},{children:e.jsxs("div",Object.assign({style:{padding:"24px",display:"flex",flexDirection:"column",width:"100%"}},{children:[e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center"}},{children:e.jsx("div",Object.assign({style:{backgroundColor:t.COLORS.background.negative.light,width:"64px",height:"64px",padding:"12px",borderRadius:"40px"}},{children:e.jsx(s.default,{width:40,height:40,color:t.COLORS.content.negative})}))})),e.jsx("div",{style:{height:"32px"}}),e.jsx(r.TitleLarge,{children:"Your AI Credits are running low"}),e.jsx("div",{style:{height:"24px"}}),e.jsx(r.BodyPrimary,Object.assign({color:t.COLORS.content.secondary},{children:"Recharge your credits now to ensure uninterrupted service."})),e.jsx("div",{style:{height:"12px"}}),e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center"}},{children:e.jsx(r.BodyPrimary,Object.assign({color:t.COLORS.content.secondary},{children:"Don’t let the growth stop. Add AI Credits"}))})),e.jsx("div",{style:{height:"32px"}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:"12px"}},{children:[e.jsx(i.Button,{buttonText:"Close",buttonType:"text",size:"small",onClick:d}),e.jsx(i.Button,{buttonText:"Contact Support",size:"small",style:{backgroundColor:t.COLORS.background.brand},onClick:c})]}))]}))}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),s=require("../../assets/icons/alert_triangle.svg.js"),i=require("../button/Button.js"),n=require("../modals/Modal.js"),r=require("../TypographyStyle.js");exports.AiCreditsLow=o=>{let{open:l,onModalClose:d,onLeftBtnClick:c,onRightBtnClick:a}=o;return e.jsx(n.Modal,Object.assign({open:l,centralContainerStyles:{width:"498px",borderRadius:"12px"},onClose:d,closeOnOutsideClick:!0,zIndex:40},{children:e.jsxs("div",Object.assign({style:{padding:"24px",display:"flex",flexDirection:"column",width:"100%"}},{children:[e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center"}},{children:e.jsx("div",Object.assign({style:{backgroundColor:t.COLORS.background.negative.light,width:"64px",height:"64px",padding:"12px",borderRadius:"40px"}},{children:e.jsx(s.default,{width:40,height:40,color:t.COLORS.content.negative})}))})),e.jsx("div",{style:{height:"32px"}}),e.jsx(r.TitleLarge,{children:"Your AI Credits are running low"}),e.jsx("div",{style:{height:"24px"}}),e.jsx(r.BodyPrimary,Object.assign({color:t.COLORS.content.secondary},{children:"Recharge your credits now to ensure uninterrupted service."})),e.jsx("div",{style:{height:"12px"}}),e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"center"}},{children:e.jsx(r.BodyPrimary,Object.assign({color:t.COLORS.content.secondary},{children:"Don’t let the growth stop. Add AI Credits"}))})),e.jsx("div",{style:{height:"32px"}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:"12px"}},{children:[e.jsx(i.Button,{buttonText:"Close",buttonType:"text",size:"small",onClick:c}),e.jsx(i.Button,{buttonText:"Contact Support",size:"small",style:{backgroundColor:t.COLORS.background.brand},onClick:a})]}))]}))}))};
 //# sourceMappingURL=AiCreditsLow.js.map

package/dist/cjs/components/ai-modals/AiCreditsLow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AiCreditsLow.js","sources":["../../../../src/components/ai-modals/AiCreditsLow.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport AlertTriangle from '../../assets/icons/alert_triangle.svg';\nimport { Button } from '../button/Button';\nimport { Modal } from '../modals/Modal';\nimport { BodyPrimary, TitleLarge } from '../TypographyStyle';\n\nexport const AiCreditsLow: React.FC<{\n\topen: boolean;\n\tonModalClose: () => void;\n\tonRightBtnClick: () => void;\n\tonLeftBtnClick: () => void;\n}> = ({ open, onModalClose, onLeftBtnClick, onRightBtnClick }) => {\n\treturn (\n\t\t<Modal\n\t\t\topen={open}\n\t\t\tcentralContainerStyles={{\n\t\t\t\twidth: '498px',\n\t\t\t\tborderRadius: '12px',\n\t\t\t}}\n\t\t\tonClose={onModalClose}\n\t\t\tcloseOnOutsideClick\n\t\t\tzIndex={40}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tpadding: '24px',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\twidth: '100%',\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\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tbackgroundColor: COLORS.background.negative.light,\n\t\t\t\t\t\t\twidth: '64px',\n\t\t\t\t\t\t\theight: '64px',\n\t\t\t\t\t\t\tpadding: '12px',\n\t\t\t\t\t\t\tborderRadius: '40px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<AlertTriangle\n\t\t\t\t\t\t\twidth={40}\n\t\t\t\t\t\t\theight={40}\n\t\t\t\t\t\t\tcolor={COLORS.content.negative}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<div style={{ height: '32px' }}></div>\n\n\t\t\t\t<TitleLarge>Your AI Credits are running low</TitleLarge>\n\n\t\t\t\t<div style={{ height: '24px' }}></div>\n\n\t\t\t\t<BodyPrimary color={COLORS.content.secondary}>\n\t\t\t\t\tRecharge your credits now to ensure uninterrupted service.\n\t\t\t\t</BodyPrimary>\n\n\t\t\t\t<div style={{ height: '12px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<BodyPrimary color={COLORS.content.secondary}>\n\t\t\t\t\t\tDon’t let the growth stop. Add AI Credits\n\t\t\t\t\t</BodyPrimary>\n\t\t\t\t</div>\n\n\t\t\t\t<div style={{ height: '32px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Close'}\n\t\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={onLeftBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Contact Support'}\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tbackgroundColor: COLORS.background.brand,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonClick={onRightBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n};\n"],"names":["~~AiCreditsLow~~","open","onModalClose","onLeftBtnClick","onRightBtnClick","_jsx","Modal","Object","assign","centralContainerStyles","width","borderRadius","onClose","closeOnOutsideClick","zIndex","children","_jsxs","jsxs","style","padding","display","flexDirection","jsx","justifyContent","backgroundColor","COLORS","background","negative","light","height","AlertTriangle","color","content","TitleLarge","BodyPrimary","secondary","alignItems","gap","Button","buttonText","buttonType","size","onClick","brand"],"mappings":"4TAYKA,~~EAAGC~~,~~OAAMC~~,~~eAAcC~~,~~iBAAgBC~~,~~qBAE1CC~~,MAACC,EAAAA,MAAKC,OAAAC,OAAA,CACLP,KAAMA,EACNQ,uBAAwB,CACvBC,MAAO,QACPC,aAAc,QAEfC,QAASV,EACTW,qBAAmB,EACnBC,OAAQ,IAAE,CAAAC,SAEVC,EACCC,KAAA,MAAAV,OAAAC,OAAA,CAAAU,MAAO,CACNC,QAAS,OACTC,QAAS,OACTC,cAAe,SACfX,MAAO,SAGR,CAAAK,SAAA,CAAAV,EAAAiB,IAAA,MAAAf,OAAAC,OAAA,CACCU,MAAO,CACNE,QAAS,OACTC,cAAe,MACfE,eAAgB,WAGjB,CAAAR,SAAAV,EAAAiB,IAAA,MAAAf,OAAAC,OAAA,CACCU,MAAO,CACNM,gBAAiBC,EAAMA,OAACC,WAAWC,SAASC,MAC5ClB,MAAO,OACPmB,OAAQ,OACRV,QAAS,OACTR,aAAc,SACd,CAAAI,SAEDV,EAACiB,IAAAQ,UACA,CAAApB,MAAO,GACPmB,OAAQ,GACRE,MAAON,EAAAA,OAAOO,QAAQL,iBAKzBtB,aAAKa,MAAO,CAAEW,OAAQ,UAEtBxB,MAAC4B,aAAU,CAAAlB,SAAA,oCAEXV,EAAAiB,IAAA,MAAA,CAAKJ,MAAO,CAAEW,OAAQ,UAEtBxB,EAACiB,IAAAY,cAAY3B,OAAAC,OAAA,CAAAuB,MAAON,EAAAA,OAAOO,QAAQG,WAAS,CAAApB,SAAA,gEAI5CV,EAAAiB,IAAA,MAAA,CAAKJ,MAAO,CAAEW,OAAQ,UAEtBxB,EAAAiB,IAAA,MAAAf,OAAAC,OAAA,CACCU,MAAO,CACNE,QAAS,OACTC,cAAe,MACfE,eAAgB,WAGjB,CAAAR,SAAAV,EAAAiB,IAACY,cAAW3B,OAAAC,OAAA,CAACuB,MAAON,EAAAA,OAAOO,QAAQG,WAErB,CAAApB,SAAA,kDAGfV,EAAKiB,IAAA,MAAA,CAAAJ,MAAO,CAAEW,OAAQ,UAEtBb,EACCC,KAAA,MAAAV,OAAAC,OAAA,CAAAU,MAAO,CACNE,QAAS,OACTC,cAAe,MACfE,eAAgB,WAChBa,WAAY,SACZC,IAAK,SACL,CAAAtB,SAAA,CAEDV,EAACiB,IAAAgB,SACA,CAAAC,WAAY,QACZC,WAAW,OACXC,KAAK,QACLC,QAASvC,IAEVE,EAACiB,IAAAgB,UACAC,WAAY,kBACZE,KAAK,QACLvB,MAAO,CACNM,gBAAiBC,EAAAA,OAAOC,WAAWiB,OAEpCD,QAAStC"}
1	+ {"version":3,"file":"AiCreditsLow.js","sources":["../../../../src/components/ai-modals/AiCreditsLow.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport AlertTriangle from '../../assets/icons/alert_triangle.svg';\nimport { Button } from '../button/Button';\nimport { Modal } from '../modals/Modal';\nimport { BodyPrimary, TitleLarge } from '../TypographyStyle';\n\nexport const AiCreditsLow: React.FC<{\n\topen: boolean;\n\tonModalClose: () => void;\n\tonRightBtnClick: () => void;\n\tonLeftBtnClick: () => void;\n}> = ({ open, onModalClose, onLeftBtnClick, onRightBtnClick }) => {\n\treturn (\n\t\t<Modal\n\t\t\topen={open}\n\t\t\tcentralContainerStyles={{\n\t\t\t\twidth: '498px',\n\t\t\t\tborderRadius: '12px',\n\t\t\t}}\n\t\t\tonClose={onModalClose}\n\t\t\tcloseOnOutsideClick\n\t\t\tzIndex={40}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tpadding: '24px',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\twidth: '100%',\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\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tbackgroundColor: COLORS.background.negative.light,\n\t\t\t\t\t\t\twidth: '64px',\n\t\t\t\t\t\t\theight: '64px',\n\t\t\t\t\t\t\tpadding: '12px',\n\t\t\t\t\t\t\tborderRadius: '40px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<AlertTriangle\n\t\t\t\t\t\t\twidth={40}\n\t\t\t\t\t\t\theight={40}\n\t\t\t\t\t\t\tcolor={COLORS.content.negative}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<div style={{ height: '32px' }}></div>\n\n\t\t\t\t<TitleLarge>Your AI Credits are running low</TitleLarge>\n\n\t\t\t\t<div style={{ height: '24px' }}></div>\n\n\t\t\t\t<BodyPrimary color={COLORS.content.secondary}>\n\t\t\t\t\tRecharge your credits now to ensure uninterrupted service.\n\t\t\t\t</BodyPrimary>\n\n\t\t\t\t<div style={{ height: '12px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<BodyPrimary color={COLORS.content.secondary}>\n\t\t\t\t\t\tDon’t let the growth stop. Add AI Credits\n\t\t\t\t\t</BodyPrimary>\n\t\t\t\t</div>\n\n\t\t\t\t<div style={{ height: '32px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Close'}\n\t\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={onLeftBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Contact Support'}\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tbackgroundColor: COLORS.background.brand,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonClick={onRightBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n};\n"],"names":["_ref","open","onModalClose","onLeftBtnClick","onRightBtnClick","_jsx","Modal","Object","assign","centralContainerStyles","width","borderRadius","onClose","closeOnOutsideClick","zIndex","children","_jsxs","jsxs","style","padding","display","flexDirection","jsx","justifyContent","backgroundColor","COLORS","background","negative","light","height","AlertTriangle","color","content","TitleLarge","BodyPrimary","secondary","alignItems","gap","Button","buttonText","buttonType","size","onClick","brand"],"mappings":"4TAYKA,IAA4D,IAA3DC,KAAEA,EAAIC,aAAEA,EAAYC,eAAEA,EAAcC,gBAAEA,GAAiBJ,EAC5D,OACCK,MAACC,EAAAA,MAAKC,OAAAC,OAAA,CACLP,KAAMA,EACNQ,uBAAwB,CACvBC,MAAO,QACPC,aAAc,QAEfC,QAASV,EACTW,qBAAmB,EACnBC,OAAQ,IAAE,CAAAC,SAEVC,EACCC,KAAA,MAAAV,OAAAC,OAAA,CAAAU,MAAO,CACNC,QAAS,OACTC,QAAS,OACTC,cAAe,SACfX,MAAO,SAGR,CAAAK,SAAA,CAAAV,EAAAiB,IAAA,MAAAf,OAAAC,OAAA,CACCU,MAAO,CACNE,QAAS,OACTC,cAAe,MACfE,eAAgB,WAGjB,CAAAR,SAAAV,EAAAiB,IAAA,MAAAf,OAAAC,OAAA,CACCU,MAAO,CACNM,gBAAiBC,EAAMA,OAACC,WAAWC,SAASC,MAC5ClB,MAAO,OACPmB,OAAQ,OACRV,QAAS,OACTR,aAAc,SACd,CAAAI,SAEDV,EAACiB,IAAAQ,UACA,CAAApB,MAAO,GACPmB,OAAQ,GACRE,MAAON,EAAAA,OAAOO,QAAQL,iBAKzBtB,aAAKa,MAAO,CAAEW,OAAQ,UAEtBxB,MAAC4B,aAAU,CAAAlB,SAAA,oCAEXV,EAAAiB,IAAA,MAAA,CAAKJ,MAAO,CAAEW,OAAQ,UAEtBxB,EAACiB,IAAAY,cAAY3B,OAAAC,OAAA,CAAAuB,MAAON,EAAAA,OAAOO,QAAQG,WAAS,CAAApB,SAAA,gEAI5CV,EAAAiB,IAAA,MAAA,CAAKJ,MAAO,CAAEW,OAAQ,UAEtBxB,EAAAiB,IAAA,MAAAf,OAAAC,OAAA,CACCU,MAAO,CACNE,QAAS,OACTC,cAAe,MACfE,eAAgB,WAGjB,CAAAR,SAAAV,EAAAiB,IAACY,cAAW3B,OAAAC,OAAA,CAACuB,MAAON,EAAAA,OAAOO,QAAQG,WAErB,CAAApB,SAAA,kDAGfV,EAAKiB,IAAA,MAAA,CAAAJ,MAAO,CAAEW,OAAQ,UAEtBb,EACCC,KAAA,MAAAV,OAAAC,OAAA,CAAAU,MAAO,CACNE,QAAS,OACTC,cAAe,MACfE,eAAgB,WAChBa,WAAY,SACZC,IAAK,SACL,CAAAtB,SAAA,CAEDV,EAACiB,IAAAgB,SACA,CAAAC,WAAY,QACZC,WAAW,OACXC,KAAK,QACLC,QAASvC,IAEVE,EAACiB,IAAAgB,UACAC,WAAY,kBACZE,KAAK,QACLvB,MAAO,CACNM,gBAAiBC,EAAAA,OAAOC,WAAWiB,OAEpCD,QAAStC,cAIL"}

package/dist/cjs/components/ai-modals/AiSyncProgress.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),s=require("../../assets/icons/sync.svg.js"),i=require("../button/Button.js"),n=require("../modals/Modal.js"),r=require("../progress-bar/ProgressBarComponent.js"),o=require("../TypographyStyle.js");exports.AiSyncProgress=({open:l,onModalClose:a,completedPercent:c,onLeftBtnClick:d,onRightBtnClick:x})=>e.jsx(n.Modal,Object.assign({open:l,centralContainerStyles:{width:"498px",height:"324px",borderRadius:"12px"},onClose:a,closeOnOutsideClick:!0,zIndex:40},{children:e.jsxs("div",Object.assign({style:{padding:"24px",display:"flex",flexDirection:"column"}},{children:[e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"center"}},{children:e.jsx(o.TitleLarge,{children:"Wait for Sync to complete"})})),e.jsx("div",{style:{height:"24px"}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"12px"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:"12px"}},{children:[e.jsx(s.default,{width:24,height:24}),e.jsx(o.BodyPrimary,Object.assign({color:"#616161"},{children:"Syncing Shopify Store Data..."}))]})),e.jsx(r.ProgressBarComponent,{completed:c,isAnimated:!1,height:16,color:t.COLORS.background.positive.vibrant})]})),e.jsx("div",{style:{height:"24px"}}),e.jsx(o.BodyPrimary,Object.assign({color:t.COLORS.content.secondary},{children:"You can start replying with AI after sync is complete. In the meanwhile, learn how to leverage AI for maximum efficiency"})),e.jsx("div",{style:{height:"32px"}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:"12px"}},{children:[e.jsx(i.Button,{buttonText:"Close",buttonType:"text",size:"small",onClick:d}),e.jsx(i.Button,{buttonText:"Explore Bik.ai",size:"small",style:{backgroundColor:t.COLORS.background.brand},onClick:x})]}))]}))}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../constants/Theme.js"),s=require("../../assets/icons/sync.svg.js"),i=require("../button/Button.js"),n=require("../modals/Modal.js"),r=require("../progress-bar/ProgressBarComponent.js"),o=require("../TypographyStyle.js");exports.AiSyncProgress=l=>{let{open:a,onModalClose:c,completedPercent:d,onLeftBtnClick:x,onRightBtnClick:p}=l;return e.jsx(n.Modal,Object.assign({open:a,centralContainerStyles:{width:"498px",height:"324px",borderRadius:"12px"},onClose:c,closeOnOutsideClick:!0,zIndex:40},{children:e.jsxs("div",Object.assign({style:{padding:"24px",display:"flex",flexDirection:"column"}},{children:[e.jsx("div",Object.assign({style:{display:"flex",justifyContent:"center"}},{children:e.jsx(o.TitleLarge,{children:"Wait for Sync to complete"})})),e.jsx("div",{style:{height:"24px"}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:"12px"}},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:"12px"}},{children:[e.jsx(s.default,{width:24,height:24}),e.jsx(o.BodyPrimary,Object.assign({color:"#616161"},{children:"Syncing Shopify Store Data..."}))]})),e.jsx(r.ProgressBarComponent,{completed:d,isAnimated:!1,height:16,color:t.COLORS.background.positive.vibrant})]})),e.jsx("div",{style:{height:"24px"}}),e.jsx(o.BodyPrimary,Object.assign({color:t.COLORS.content.secondary},{children:"You can start replying with AI after sync is complete. In the meanwhile, learn how to leverage AI for maximum efficiency"})),e.jsx("div",{style:{height:"32px"}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"flex-end",alignItems:"center",gap:"12px"}},{children:[e.jsx(i.Button,{buttonText:"Close",buttonType:"text",size:"small",onClick:x}),e.jsx(i.Button,{buttonText:"Explore Bik.ai",size:"small",style:{backgroundColor:t.COLORS.background.brand},onClick:p})]}))]}))}))};
 //# sourceMappingURL=AiSyncProgress.js.map

package/dist/cjs/components/ai-modals/AiSyncProgress.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AiSyncProgress.js","sources":["../../../../src/components/ai-modals/AiSyncProgress.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport Sync from '../../assets/icons/sync.svg';\nimport { Button } from '../button/Button';\nimport { Modal } from '../modals/Modal';\nimport { ProgressBarComponent } from '../progress-bar';\nimport { BodyPrimary, TitleLarge } from '../TypographyStyle';\n\nexport const AiSyncProgress: React.FC<{\n\topen: boolean;\n\tonModalClose: () => void;\n\tcompletedPercent: number;\n\tonRightBtnClick: () => void;\n\tonLeftBtnClick: () => void;\n}> = ({\n\topen,\n\tonModalClose,\n\tcompletedPercent,\n\tonLeftBtnClick,\n\tonRightBtnClick,\n}) => {\n\treturn (\n\t\t<Modal\n\t\t\topen={open}\n\t\t\tcentralContainerStyles={{\n\t\t\t\twidth: '498px',\n\t\t\t\theight: '324px',\n\t\t\t\tborderRadius: '12px',\n\t\t\t}}\n\t\t\tonClose={onModalClose}\n\t\t\tcloseOnOutsideClick\n\t\t\tzIndex={40}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tpadding: '24px',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\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\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<TitleLarge>Wait for Sync to complete</TitleLarge>\n\t\t\t\t</div>\n\n\t\t\t\t<div style={{ height: '24px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Sync width={24} height={24} />\n\t\t\t\t\t\t<BodyPrimary color=\"#616161\">\n\t\t\t\t\t\t\tSyncing Shopify Store Data...\n\t\t\t\t\t\t</BodyPrimary>\n\t\t\t\t\t</div>\n\t\t\t\t\t<ProgressBarComponent\n\t\t\t\t\t\tcompleted={completedPercent}\n\t\t\t\t\t\tisAnimated={false}\n\t\t\t\t\t\theight={16}\n\t\t\t\t\t\tcolor={COLORS.background.positive.vibrant}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div style={{ height: '24px' }}></div>\n\n\t\t\t\t<BodyPrimary color={COLORS.content.secondary}>\n\t\t\t\t\tYou can start replying with AI after sync is complete. In the\n\t\t\t\t\tmeanwhile, learn how to leverage AI for maximum efficiency\n\t\t\t\t</BodyPrimary>\n\n\t\t\t\t<div style={{ height: '32px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Close'}\n\t\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={onLeftBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Explore Bik.ai'}\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tbackgroundColor: COLORS.background.brand,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonClick={onRightBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n};\n"],"names":["~~AiSyncProgress~~","open","onModalClose","completedPercent","onLeftBtnClick","onRightBtnClick","_jsx","Modal","Object","assign","centralContainerStyles","width","height","borderRadius","onClose","closeOnOutsideClick","zIndex","children","_jsxs","jsxs","style","padding","display","flexDirection","jsx","justifyContent","TitleLarge","gap","Sync","BodyPrimary","color","ProgressBarComponent","completed","isAnimated","COLORS","background","positive","vibrant","content","secondary","alignItems","Button","buttonText","buttonType","size","onClick","backgroundColor","brand"],"mappings":"yWAcKA,~~EACJC~~,~~OACAC~~,~~eACAC~~,~~mBACAC~~,~~iBACAC~~,~~qBAGCC~~,MAACC,EAAAA,MAAKC,OAAAC,OAAA,CACLR,KAAMA,EACNS,uBAAwB,CACvBC,MAAO,QACPC,OAAQ,QACRC,aAAc,QAEfC,QAASZ,EACTa,qBAAmB,EACnBC,OAAQ,IAAE,CAAAC,SAEVC,EACCC,KAAA,MAAAX,OAAAC,OAAA,CAAAW,MAAO,CACNC,QAAS,OACTC,QAAS,OACTC,cAAe,WAGhB,CAAAN,SAAA,CAAAX,EAAAkB,IAAA,MAAAhB,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTG,eAAgB,WAChB,CAAAR,SAEDX,MAACoB,aAAU,CAAAT,SAAA,iCAGZX,aAAKc,MAAO,CAAER,OAAQ,UAEtBM,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,SACfI,IAAK,SAGN,CAAAV,SAAA,CAAAC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,MACfI,IAAK,SACL,CAAAV,SAAA,CAEDX,MAACsB,UAAI,CAACjB,MAAO,GAAIC,OAAQ,KACzBN,EAAAkB,IAACK,cAAYrB,OAAAC,OAAA,CAAAqB,MAAM,WAAS,CAAAb,SAAA,uCAI7BX,MAACyB,uBAAoB,CACpBC,UAAW7B,EACX8B,YAAY,EACZrB,OAAQ,GACRkB,MAAOI,EAAMA,OAACC,WAAWC,SAASC,cAGpC/B,aAAKc,MAAO,CAAER,OAAQ,UAEtBN,EAAAkB,IAACK,cAAYrB,OAAAC,OAAA,CAAAqB,MAAOI,EAAAA,OAAOI,QAAQC,WAGrB,CAAAtB,SAAA,8HAEdX,aAAKc,MAAO,CAAER,OAAQ,UAEtBM,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,MACfE,eAAgB,WAChBe,WAAY,SACZb,IAAK,SACL,CAAAV,SAAA,CAEDX,EAACkB,IAAAiB,SACA,CAAAC,WAAY,QACZC,WAAW,OACXC,KAAK,QACLC,QAASzC,IAEVE,EAACkB,IAAAiB,UACAC,WAAY,iBACZE,KAAK,QACLxB,MAAO,CACN0B,gBAAiBZ,EAAAA,OAAOC,WAAWY,OAEpCF,QAASxC"}
1	+ {"version":3,"file":"AiSyncProgress.js","sources":["../../../../src/components/ai-modals/AiSyncProgress.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport Sync from '../../assets/icons/sync.svg';\nimport { Button } from '../button/Button';\nimport { Modal } from '../modals/Modal';\nimport { ProgressBarComponent } from '../progress-bar';\nimport { BodyPrimary, TitleLarge } from '../TypographyStyle';\n\nexport const AiSyncProgress: React.FC<{\n\topen: boolean;\n\tonModalClose: () => void;\n\tcompletedPercent: number;\n\tonRightBtnClick: () => void;\n\tonLeftBtnClick: () => void;\n}> = ({\n\topen,\n\tonModalClose,\n\tcompletedPercent,\n\tonLeftBtnClick,\n\tonRightBtnClick,\n}) => {\n\treturn (\n\t\t<Modal\n\t\t\topen={open}\n\t\t\tcentralContainerStyles={{\n\t\t\t\twidth: '498px',\n\t\t\t\theight: '324px',\n\t\t\t\tborderRadius: '12px',\n\t\t\t}}\n\t\t\tonClose={onModalClose}\n\t\t\tcloseOnOutsideClick\n\t\t\tzIndex={40}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tpadding: '24px',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'column',\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\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: 'center',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<TitleLarge>Wait for Sync to complete</TitleLarge>\n\t\t\t\t</div>\n\n\t\t\t\t<div style={{ height: '24px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'column',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Sync width={24} height={24} />\n\t\t\t\t\t\t<BodyPrimary color=\"#616161\">\n\t\t\t\t\t\t\tSyncing Shopify Store Data...\n\t\t\t\t\t\t</BodyPrimary>\n\t\t\t\t\t</div>\n\t\t\t\t\t<ProgressBarComponent\n\t\t\t\t\t\tcompleted={completedPercent}\n\t\t\t\t\t\tisAnimated={false}\n\t\t\t\t\t\theight={16}\n\t\t\t\t\t\tcolor={COLORS.background.positive.vibrant}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t\t<div style={{ height: '24px' }}></div>\n\n\t\t\t\t<BodyPrimary color={COLORS.content.secondary}>\n\t\t\t\t\tYou can start replying with AI after sync is complete. In the\n\t\t\t\t\tmeanwhile, learn how to leverage AI for maximum efficiency\n\t\t\t\t</BodyPrimary>\n\n\t\t\t\t<div style={{ height: '32px' }}></div>\n\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\t\tjustifyContent: 'flex-end',\n\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\tgap: '12px',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Close'}\n\t\t\t\t\t\tbuttonType=\"text\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={onLeftBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tbuttonText={'Explore Bik.ai'}\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tbackgroundColor: COLORS.background.brand,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonClick={onRightBtnClick}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n};\n"],"names":["_ref","open","onModalClose","completedPercent","onLeftBtnClick","onRightBtnClick","_jsx","Modal","Object","assign","centralContainerStyles","width","height","borderRadius","onClose","closeOnOutsideClick","zIndex","children","_jsxs","jsxs","style","padding","display","flexDirection","jsx","justifyContent","TitleLarge","gap","Sync","BodyPrimary","color","ProgressBarComponent","completed","isAnimated","COLORS","background","positive","vibrant","content","secondary","alignItems","Button","buttonText","buttonType","size","onClick","backgroundColor","brand"],"mappings":"yWAcKA,IAMA,IANCC,KACLA,EAAIC,aACJA,EAAYC,iBACZA,EAAgBC,eAChBA,EAAcC,gBACdA,GACAL,EACA,OACCM,MAACC,EAAAA,MAAKC,OAAAC,OAAA,CACLR,KAAMA,EACNS,uBAAwB,CACvBC,MAAO,QACPC,OAAQ,QACRC,aAAc,QAEfC,QAASZ,EACTa,qBAAmB,EACnBC,OAAQ,IAAE,CAAAC,SAEVC,EACCC,KAAA,MAAAX,OAAAC,OAAA,CAAAW,MAAO,CACNC,QAAS,OACTC,QAAS,OACTC,cAAe,WAGhB,CAAAN,SAAA,CAAAX,EAAAkB,IAAA,MAAAhB,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTG,eAAgB,WAChB,CAAAR,SAEDX,MAACoB,aAAU,CAAAT,SAAA,iCAGZX,aAAKc,MAAO,CAAER,OAAQ,UAEtBM,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,SACfI,IAAK,SAGN,CAAAV,SAAA,CAAAC,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,MACfI,IAAK,SACL,CAAAV,SAAA,CAEDX,MAACsB,UAAI,CAACjB,MAAO,GAAIC,OAAQ,KACzBN,EAAAkB,IAACK,cAAYrB,OAAAC,OAAA,CAAAqB,MAAM,WAAS,CAAAb,SAAA,uCAI7BX,MAACyB,uBAAoB,CACpBC,UAAW7B,EACX8B,YAAY,EACZrB,OAAQ,GACRkB,MAAOI,EAAMA,OAACC,WAAWC,SAASC,cAGpC/B,aAAKc,MAAO,CAAER,OAAQ,UAEtBN,EAAAkB,IAACK,cAAYrB,OAAAC,OAAA,CAAAqB,MAAOI,EAAAA,OAAOI,QAAQC,WAGrB,CAAAtB,SAAA,8HAEdX,aAAKc,MAAO,CAAER,OAAQ,UAEtBM,EAAAC,KAAA,MAAAX,OAAAC,OAAA,CACCW,MAAO,CACNE,QAAS,OACTC,cAAe,MACfE,eAAgB,WAChBe,WAAY,SACZb,IAAK,SACL,CAAAV,SAAA,CAEDX,EAACkB,IAAAiB,SACA,CAAAC,WAAY,QACZC,WAAW,OACXC,KAAK,QACLC,QAASzC,IAEVE,EAACkB,IAAAiB,UACAC,WAAY,iBACZE,KAAK,QACLxB,MAAO,CACN0B,gBAAiBZ,EAAAA,OAAOC,WAAWY,OAEpCF,QAASxC,cAIL"}

package/dist/cjs/components/analytics-card/AnalyticsCard.styled.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AnalyticsCard.styled.js","sources":["../../../../src/components/analytics-card/AnalyticsCard.styled.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { BASE_COLORS } from '@src/constants/Theme';\nimport { ModeType } from './AnalyticsCard.model';\n\nexport const AnalyticsContainer = styled.div<{\n\twidth: string;\n\tmode?: ModeType;\n\tcount?: number;\n}>`\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\trow-gap: 16px;\n\talign-items: center;\n\tjustify-content: space-evenly;\n\n\t${(props) => (props.width ? `width: ${props.width}` : 'width: 280px')};\n\tbackground: ${(props) =>\n\t\tprops.mode == 'light'\n\t\t\t? BASE_COLORS.grayscale['100']\n\t\t\t: BASE_COLORS.brand['900']};\n\tpadding: 26px 12px 16px 12px;\n\tborder-radius: 0 0 8px 8px;\n\n\t.analytics__card:nth-child(n + 4) {\n\t\t${(props) =>\n\t\t\tprops.count == 5\n\t\t\t\t? 'flex-basis: 48%'\n\t\t\t\t: props.count == 6 \|\| props.count == 7\n\t\t\t\t? 'flex-basis: 31%'\n\t\t\t\t: props.count == 8\n\t\t\t\t? 'flex-basis: 23%'\n\t\t\t\t: ''};\n\t}\n\n\t.analytics__card:nth-child(4) {\n\t\t${(props) => (props.count == 7 ? 'flex-basis: 23% !important' : '')}\n\t}\n\n\t.shimmers {\n\t\tdisplay: flex;\n\t\tgap: 8px;\n\t\t.shine {\n\t\t\tmargin-top: 2px !important;\n\t\t}\n\t}\n`;\n\nexport const CardDataContainer = styled.div<{\n\tcount: number;\n}>`\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\trow-gap: 4px;\n\n\tflex-grow: 1;\n\tflex-shrink: 0;\n\tflex-basis: ${(props) =>\n\t\tprops.count == 2\n\t\t\t? '48%'\n\t\t\t: props.count == 3\n\t\t\t? '31%'\n\t\t\t: props.count == 4\n\t\t\t? '23%'\n\t\t\t: props.count == 5\n\t\t\t? '31%'\n\t\t\t: props.count == 6\n\t\t\t? '31%'\n\t\t\t: props.count == 7\n\t\t\t? '23%'\n\t\t\t: props.count == 8\n\t\t\t? '23%'\n\t\t\t: 'auto'};\n\n\t.category,\n\t.statistic {\n\t\tmax-width: 100%;\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\n`;\n"],"names":["AnalyticsContainer","_styled","process","env","NODE_ENV","target","label","props","width","mode","BASE_COLORS","grayscale","brand","count","CardDataContainer"],"mappings":"mOAIO,MAAMA,EAAkBC,EAAA,cAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,YAAA,CAAAA,OAAA,WAAAC,MAAA,sBAAAL,CAAA,6FAW3BM,GAAWA,EAAMC,~~MAAQ~~,~~UAAUD~~,EAAMC,QAAU,gBAAe,gBACtDD,GACA,SAAdA,EAAME,KACHC,EAAWA,YAACC,UAAU,KACtBD,EAAWA,YAACE,MAAM,MAKlBL,6FAAAA,GACa,GAAfA,EAAMM,MACH,kBACe,GAAfN,EAAMM,OAA6B,GAAfN,EAAMM,MAC1B,kBACe,GAAfN,EAAMM,MACN,kBACA,IAIDN,oCAAAA,GAA0B,GAAfA,EAAMM,MAAa,6BAA+B,IAAGX,uEAUpE,eAVoEA,QAAAC,IAAAC,SAUpE,GAAA,4vFAEYU,EAAiBb,EAAA,cAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,YAAA,CAAAA,OAAA,WAAAC,MAAA,qBAAAL,CAAA,kIAWdM,GACC,GAAfA,EAAMM,MACH,MACe,GAAfN,EAAMM,MACN,MACe,GAAfN,EAAMM,MACN,MACe,GAAfN,EAAMM,OAES,GAAfN,EAAMM,MADN,MAGe,GAAfN,EAAMM,OAES,GAAfN,EAAMM,MADN,MAGA,QAAM,oGASV,eATUX,QAAAC,IAAAC,SASV,GAAA"}
1	+ {"version":3,"file":"AnalyticsCard.styled.js","sources":["../../../../src/components/analytics-card/AnalyticsCard.styled.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { BASE_COLORS } from '@src/constants/Theme';\nimport { ModeType } from './AnalyticsCard.model';\n\nexport const AnalyticsContainer = styled.div<{\n\twidth: string;\n\tmode?: ModeType;\n\tcount?: number;\n}>`\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\trow-gap: 16px;\n\talign-items: center;\n\tjustify-content: space-evenly;\n\n\t${(props) => (props.width ? `width: ${props.width}` : 'width: 280px')};\n\tbackground: ${(props) =>\n\t\tprops.mode == 'light'\n\t\t\t? BASE_COLORS.grayscale['100']\n\t\t\t: BASE_COLORS.brand['900']};\n\tpadding: 26px 12px 16px 12px;\n\tborder-radius: 0 0 8px 8px;\n\n\t.analytics__card:nth-child(n + 4) {\n\t\t${(props) =>\n\t\t\tprops.count == 5\n\t\t\t\t? 'flex-basis: 48%'\n\t\t\t\t: props.count == 6 \|\| props.count == 7\n\t\t\t\t? 'flex-basis: 31%'\n\t\t\t\t: props.count == 8\n\t\t\t\t? 'flex-basis: 23%'\n\t\t\t\t: ''};\n\t}\n\n\t.analytics__card:nth-child(4) {\n\t\t${(props) => (props.count == 7 ? 'flex-basis: 23% !important' : '')}\n\t}\n\n\t.shimmers {\n\t\tdisplay: flex;\n\t\tgap: 8px;\n\t\t.shine {\n\t\t\tmargin-top: 2px !important;\n\t\t}\n\t}\n`;\n\nexport const CardDataContainer = styled.div<{\n\tcount: number;\n}>`\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n\trow-gap: 4px;\n\n\tflex-grow: 1;\n\tflex-shrink: 0;\n\tflex-basis: ${(props) =>\n\t\tprops.count == 2\n\t\t\t? '48%'\n\t\t\t: props.count == 3\n\t\t\t? '31%'\n\t\t\t: props.count == 4\n\t\t\t? '23%'\n\t\t\t: props.count == 5\n\t\t\t? '31%'\n\t\t\t: props.count == 6\n\t\t\t? '31%'\n\t\t\t: props.count == 7\n\t\t\t? '23%'\n\t\t\t: props.count == 8\n\t\t\t? '23%'\n\t\t\t: 'auto'};\n\n\t.category,\n\t.statistic {\n\t\tmax-width: 100%;\n\t\toverflow: hidden;\n\t\twhite-space: nowrap;\n\t\ttext-overflow: ellipsis;\n\t}\n`;\n"],"names":["AnalyticsContainer","_styled","process","env","NODE_ENV","target","label","props","width","mode","BASE_COLORS","grayscale","brand","count","CardDataContainer"],"mappings":"mOAIO,MAAMA,EAAkBC,EAAA,cAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,YAAA,CAAAA,OAAA,WAAAC,MAAA,sBAAAL,CAAA,6FAW3BM,GAAWA,EAAMC,MAAkB,UAAAD,EAAMC,QAAU,gBAAe,gBACtDD,GACA,SAAdA,EAAME,KACHC,EAAWA,YAACC,UAAU,KACtBD,EAAWA,YAACE,MAAM,MAKlBL,6FAAAA,GACa,GAAfA,EAAMM,MACH,kBACe,GAAfN,EAAMM,OAA6B,GAAfN,EAAMM,MAC1B,kBACe,GAAfN,EAAMM,MACN,kBACA,IAIDN,oCAAAA,GAA0B,GAAfA,EAAMM,MAAa,6BAA+B,IAAGX,uEAUpE,eAVoEA,QAAAC,IAAAC,SAUpE,GAAA,4vFAEYU,EAAiBb,EAAA,cAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,YAAA,CAAAA,OAAA,WAAAC,MAAA,qBAAAL,CAAA,kIAWdM,GACC,GAAfA,EAAMM,MACH,MACe,GAAfN,EAAMM,MACN,MACe,GAAfN,EAAMM,MACN,MACe,GAAfN,EAAMM,OAES,GAAfN,EAAMM,MADN,MAGe,GAAfN,EAAMM,OAES,GAAfN,EAAMM,MADN,MAGA,QAAM,oGASV,eATUX,QAAAC,IAAAC,SASV,GAAA"}

package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsDropdown.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),o=require("react"),t=require("react-bootstrap"),n=require("react-dom"),s=require("../../constants/Theme.js"),i=require("../datePicker/DatePicker.js");require("react-calendar"),require("../../utils/DateUtils.js");var r=require("../TypographyStyle.js");require("../datePicker/DatePickerWrapper.styled.js"),require("../datePicker/model.js"),require("../dropdown/DropdownPopover/index.js"),require("../dropdown/Dropdown.js"),require("../dropdown/ChipDropdown.js"),require("../zeroState/ZeroState.js"),require("../../_virtual/_tslib.js"),require("lodash/debounce"),require("../dropdown/OpenedDropdown/components/description/Description.styled.js"),require("../checkBox/CheckBox.styled.js"),require("../list-item/ListItem.js"),require("../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js"),require("../dropdown/OpenedDropdown/components/menu/MenuItem.js"),require("../dropdown/OpenedDropdown/components/menu/MenuList.styled.js"),require("../button/Button.js"),require("../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js"),require("../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js"),require("../icon-button/IconButton.js"),require("../input/Input.js"),require("../dropdown/MenuItem/MenuItem.js"),require("../datePicker/DatePicker.styled.js");var d=require("./CommonStyles.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=l(n);const c=({eachOption:o,selectedOption:t,selectedDate:n,onClickingEachItem:i,rangeSelection:l,isLastItem:a,isFirstItem:c,showTimePicker:p})=>e.jsxs(d.ItemMenuContainer,Object.assign({isFirstItem:c,isLastItem:a,onClick:()=>i(o),isSelected:o.isCustom?o.key==(null==t?void 0:t.key)&&!!n:o.key==(null==t?void 0:t.key)},{children:[e.jsx(r.BodySecondary,Object.assign({color:o.key==(null==t?void 0:t.key)?s.BASE_COLORS.positive[900]:s.BASE_COLORS.grayscale[900]},{children:o.label})),o.subLabel?e.jsx(r.BodyCaption,Object.assign({style:{color:s.BASE_COLORS.grayscale[700]}},{children:o.subLabel})):e.jsx(e.Fragment,{}),n&&(null==t?void 0:t.isCustom)&&o.key==(null==t?void 0:t.key)&&e.jsx(r.BodyCaption,Object.assign({style:{whiteSpace:"normal",wordBreak:"break-word",textAlign:"left"}},{children:l?`${u(n[0],p)} to ${u(n[1],p)}`:`${u(n[0],p)}`}))]}),o.key),u=(e,o)=>{const t=e.toLocaleString("default",{day:"numeric",month:"short",year:"numeric"});if(o){return`${t} (${e.toLocaleString("default",{hour:"numeric",minute:"2-digit",hour12:!0})})`}return t};exports.AnalyticsDropdown=({options:n,placeholder:l="Select an option",selected:p,onOptionSelected:m,resetDropdown:g,maxHeight:j,backgroundcolor:v,calendarPopperConfig:w,variant:O="default",datePickerPlacement:y,closeDropdown:D,labelColor:b,styleProps:h,showTimePicker:S=!1})=>{var f,k,x;const[q,C]=o.useState(!1),[R,I]=o.useState(p),[P,E]=o.useState(),[L,T]=o.useState(!1),[B,M]=o.useState(p),F=o.useRef(null),A="small"===O?r.Caption:r.BodySecondary;o.useEffect((()=>{g&&I(void 0)}),[g]),o.useEffect((()=>{var e;(null==p?void 0:p.isCustom)&&(null===(e=p.dateRangeSelectionOptions)||void 0===e?void 0:e.selectedDates)?E(p.dateRangeSelectionOptions.selectedDates):E(void 0),I(p)}),[p]),o.useEffect((()=>{T(!1),C(!1)}),[D]);const $=e=>{void 0!==e?(T(e),q&&C(!1)):T((e=>!e))},_=e=>{F.current&&!F.current.contains(e.target)&&(q&&C(!1),$(!1))};return o.useEffect((()=>(L&&document.addEventListener("mousedown",_),()=>{document.removeEventListener("mousedown",_)})),[L]),e.jsx(e.Fragment,{children:e.jsxs(d.MainDropdown,Object.assign({drop:"down",show:L,onToggle:$,bgColor:v,id:"analytic-dropdown"},{children:[e.jsx(t.Dropdown.Toggle,Object.assign({id:"dropdown-autoclose-outside",className:"main--dropdown",style:"small"===O?{display:"flex",alignItems:"center",gap:6,padding:"4px 8px",backgroundColor:"#FAFAFA",borderRadius:4,border:`1px solid ${s.DEFAULT_THEME.colorsV2.stroke.primary}`}:h||void 0},{children:e.jsx(A,Object.assign({style:"small"===O||b?{color:b||s.DEFAULT_THEME.colorsV2.content.secondary}:void 0},{children:(null==R?void 0:R.isCustom)?P?u(P[0],S)===u(P[1],S)?`${u(P[0],S)}`:`${u(P[0],S)} to ${u(P[1],S)}`:(null==B?void 0:B.label)?null==B?void 0:B.label:l:R?null==R?void 0:R.label:l}))})),a.default.createPortal(e.jsx(t.Dropdown.Menu,Object.assign({className:"main--dropdown",style:{padding:0},ref:F},{children:e.jsxs(d.MainDropdown,Object.assign({drop:null!=y?y:"end",id:"sub--dropdown",show:q,onToggle:e=>{!e&&T(!1),C(!q)}},{children:[e.jsx("div",Object.assign({style:{maxHeight:j||"auto",overflowY:"scroll"}},{children:n.map(((o,s)=>{var i;return e.jsx("div",{children:(null==o?void 0:o.isCustom)?e.jsx(t.Dropdown.Toggle,Object.assign({className:"sub--dropdown"},{children:e.jsx(c,{isFirstItem:0===s,isLastItem:s===n.length-1,eachOption:o,selectedOption:R,selectedDate:P,onClickingEachItem:e=>{I(e),C(!0)},rangeSelection:!!(null===(i=null==o?void 0:o.dateRangeSelectionOptions)||void 0===i?void 0:i.selectRange),showTimePicker:S})})):e.jsx(c,{isFirstItem:0===s,isLastItem:s===n.length-1,eachOption:o,selectedOption:R,selectedDate:P,onClickingEachItem:e=>{if(E(void 0),I(e),M(e),$(),!e.noOfDays)return void m(e);const o=new Date,t=new Date;t.setDate(o.getDate()-e.noOfDays),m(Object.assign(Object.assign({},e),{selectedRange:[t,o]}))},showTimePicker:S})},null==o?void 0:o.key)}))})),e.jsx(t.Dropdown.Menu,Object.assign({className:"sub--dropdown",popperConfig:{modifiers:[{name:"offset",options:{offset:[(null==w?void 0:w.offsetSkid)||0,(null==w?void 0:w.offsetDistance)||0]}}]}},{children:e.jsx(i.DatePicker,{selectRange:(null===(f=null==R?void 0:R.dateRangeSelectionOptions)||void 0===f?void 0:f.selectRange)||!1,showTimePicker:S,maxDate:null===(k=null==R?void 0:R.dateRangeSelectionOptions)||void 0===k?void 0:k.maxDate,minDate:null===(x=null==R?void 0:R.dateRangeSelectionOptions)||void 0===x?void 0:x.minDate,selectedDates:P,onSelectRange:(e,o)=>{const t=[e,o];(null==R?void 0:R.dateRangeSelectionOptions)&&(R.dateRangeSelectionOptions.selectedDates=t,m(Object.assign(Object.assign({},R),{selectedRange:[e,o]}))),M(R),C(!1),E(t),T(!L)},onSelectDate:e=>{(null==R?void 0:R.dateRangeSelectionOptions)&&(R.dateRangeSelectionOptions.selectedDates=[e,e],m(Object.assign(Object.assign({},R),{selectedRange:[e,e]}))),M(R),C(!1),E([e,e]),T(!L)}})}))]}))})),document.body)]}))})},exports.EachItem=c,exports.formatDate=u;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),o=require("react"),t=require("react-bootstrap"),n=require("react-dom"),s=require("../../constants/Theme.js"),i=require("../datePicker/DatePicker.js");require("react-calendar"),require("../../utils/DateUtils.js");var r=require("../TypographyStyle.js");require("../datePicker/DatePickerWrapper.styled.js"),require("../datePicker/model.js"),require("../dropdown/DropdownPopover/index.js"),require("../dropdown/Dropdown.js"),require("../dropdown/ChipDropdown.js"),require("../zeroState/ZeroState.js"),require("../../_virtual/_tslib.js"),require("lodash/debounce"),require("../dropdown/OpenedDropdown/components/description/Description.styled.js"),require("../checkBox/CheckBox.styled.js"),require("../list-item/ListItem.js"),require("../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js"),require("../dropdown/OpenedDropdown/components/menu/MenuItem.js"),require("../dropdown/OpenedDropdown/components/menu/MenuList.styled.js"),require("../button/Button.js"),require("../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js"),require("../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js"),require("../icon-button/IconButton.js"),require("../input/Input.js"),require("../dropdown/MenuItem/MenuItem.js"),require("../datePicker/DatePicker.styled.js");var d=require("./CommonStyles.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var a=l(n);const c=o=>{let{eachOption:t,selectedOption:n,selectedDate:i,onClickingEachItem:l,rangeSelection:a,isLastItem:c,isFirstItem:p,showTimePicker:m}=o;return e.jsxs(d.ItemMenuContainer,Object.assign({isFirstItem:p,isLastItem:c,onClick:()=>l(t),isSelected:t.isCustom?t.key==(null==n?void 0:n.key)&&!!i:t.key==(null==n?void 0:n.key)},{children:[e.jsx(r.BodySecondary,Object.assign({color:t.key==(null==n?void 0:n.key)?s.BASE_COLORS.positive[900]:s.BASE_COLORS.grayscale[900]},{children:t.label})),t.subLabel?e.jsx(r.BodyCaption,Object.assign({style:{color:s.BASE_COLORS.grayscale[700]}},{children:t.subLabel})):e.jsx(e.Fragment,{}),i&&(null==n?void 0:n.isCustom)&&t.key==(null==n?void 0:n.key)&&e.jsx(r.BodyCaption,Object.assign({style:{whiteSpace:"normal",wordBreak:"break-word",textAlign:"left"}},{children:a?`${u(i[0],m)} to ${u(i[1],m)}`:`${u(i[0],m)}`}))]}),t.key)},u=(e,o)=>{const t=e.toLocaleString("default",{day:"numeric",month:"short",year:"numeric"});if(o){return`${t} (${e.toLocaleString("default",{hour:"numeric",minute:"2-digit",hour12:!0})})`}return t};exports.AnalyticsDropdown=n=>{let{options:l,placeholder:p="Select an option",selected:m,onOptionSelected:g,resetDropdown:j,maxHeight:v,backgroundcolor:w,calendarPopperConfig:O,variant:y="default",datePickerPlacement:D,closeDropdown:b,labelColor:h,styleProps:S,showTimePicker:f=!1}=n;var k,x,q;const[C,R]=o.useState(!1),[I,P]=o.useState(m),[E,L]=o.useState(),[T,B]=o.useState(!1),[M,F]=o.useState(m),A=o.useRef(null),$="small"===y?r.Caption:r.BodySecondary;o.useEffect((()=>{j&&P(void 0)}),[j]),o.useEffect((()=>{var e;(null==m?void 0:m.isCustom)&&(null===(e=m.dateRangeSelectionOptions)||void 0===e?void 0:e.selectedDates)?L(m.dateRangeSelectionOptions.selectedDates):L(void 0),P(m)}),[m]),o.useEffect((()=>{B(!1),R(!1)}),[b]);const _=e=>{void 0!==e?(B(e),C&&R(!1)):B((e=>!e))},H=e=>{A.current&&!A.current.contains(e.target)&&(C&&R(!1),_(!1))};return o.useEffect((()=>(T&&document.addEventListener("mousedown",H),()=>{document.removeEventListener("mousedown",H)})),[T]),e.jsx(e.Fragment,{children:e.jsxs(d.MainDropdown,Object.assign({drop:"down",show:T,onToggle:_,bgColor:w,id:"analytic-dropdown"},{children:[e.jsx(t.Dropdown.Toggle,Object.assign({id:"dropdown-autoclose-outside",className:"main--dropdown",style:"small"===y?{display:"flex",alignItems:"center",gap:6,padding:"4px 8px",backgroundColor:"#FAFAFA",borderRadius:4,border:`1px solid ${s.DEFAULT_THEME.colorsV2.stroke.primary}`}:S||void 0},{children:e.jsx($,Object.assign({style:"small"===y||h?{color:h||s.DEFAULT_THEME.colorsV2.content.secondary}:void 0},{children:(null==I?void 0:I.isCustom)?E?u(E[0],f)===u(E[1],f)?`${u(E[0],f)}`:`${u(E[0],f)} to ${u(E[1],f)}`:(null==M?void 0:M.label)?null==M?void 0:M.label:p:I?null==I?void 0:I.label:p}))})),a.default.createPortal(e.jsx(t.Dropdown.Menu,Object.assign({className:"main--dropdown",style:{padding:0},ref:A},{children:e.jsxs(d.MainDropdown,Object.assign({drop:null!=D?D:"end",id:"sub--dropdown",show:C,onToggle:e=>{!e&&B(!1),R(!C)}},{children:[e.jsx("div",Object.assign({style:{maxHeight:v||"auto",overflowY:"scroll"}},{children:l.map(((o,n)=>{var s;return e.jsx("div",{children:(null==o?void 0:o.isCustom)?e.jsx(t.Dropdown.Toggle,Object.assign({className:"sub--dropdown"},{children:e.jsx(c,{isFirstItem:0===n,isLastItem:n===l.length-1,eachOption:o,selectedOption:I,selectedDate:E,onClickingEachItem:e=>{P(e),R(!0)},rangeSelection:!!(null===(s=null==o?void 0:o.dateRangeSelectionOptions)||void 0===s?void 0:s.selectRange),showTimePicker:f})})):e.jsx(c,{isFirstItem:0===n,isLastItem:n===l.length-1,eachOption:o,selectedOption:I,selectedDate:E,onClickingEachItem:e=>{if(L(void 0),P(e),F(e),_(),!e.noOfDays)return void g(e);const o=new Date,t=new Date;t.setDate(o.getDate()-e.noOfDays),g(Object.assign(Object.assign({},e),{selectedRange:[t,o]}))},showTimePicker:f})},null==o?void 0:o.key)}))})),e.jsx(t.Dropdown.Menu,Object.assign({className:"sub--dropdown",popperConfig:{modifiers:[{name:"offset",options:{offset:[(null==O?void 0:O.offsetSkid)||0,(null==O?void 0:O.offsetDistance)||0]}}]}},{children:e.jsx(i.DatePicker,{selectRange:(null===(k=null==I?void 0:I.dateRangeSelectionOptions)||void 0===k?void 0:k.selectRange)||!1,showTimePicker:f,maxDate:null===(x=null==I?void 0:I.dateRangeSelectionOptions)||void 0===x?void 0:x.maxDate,minDate:null===(q=null==I?void 0:I.dateRangeSelectionOptions)||void 0===q?void 0:q.minDate,selectedDates:E,onSelectRange:(e,o)=>{const t=[e,o];(null==I?void 0:I.dateRangeSelectionOptions)&&(I.dateRangeSelectionOptions.selectedDates=t,g(Object.assign(Object.assign({},I),{selectedRange:[e,o]}))),F(I),R(!1),L(t),B(!T)},onSelectDate:e=>{(null==I?void 0:I.dateRangeSelectionOptions)&&(I.dateRangeSelectionOptions.selectedDates=[e,e],g(Object.assign(Object.assign({},I),{selectedRange:[e,e]}))),F(I),R(!1),L([e,e]),B(!T)}})}))]}))})),document.body)]}))})},exports.EachItem=c,exports.formatDate=u;
 //# sourceMappingURL=AnalyticsDropdown.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsDropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AnalyticsDropdown.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsDropdown.tsx"],"sourcesContent":["import 'bootstrap/dist/css/bootstrap.min.css';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Dropdown } from 'react-bootstrap';\nimport { DropDirection } from 'react-bootstrap/esm/DropdownContext';\nimport ReactDOM from 'react-dom';\nimport { BASE_COLORS, DEFAULT_THEME } from '@src/constants/Theme';\nimport { DatePicker } from '../datePicker';\nimport { BodyCaption, BodySecondary, Caption } from '../TypographyStyle';\nimport { ItemMenuContainer, MainDropdown } from './CommonStyles';\n\nexport interface DropdownOptions {\n\tlabel: string;\n\tsubLabel?: string;\n\tvalue: string;\n\tkey: string \| number;\n\tnoOfDays?: number;\n\tisCustom?: boolean;\n\tdateRangeSelectionOptions?: {\n\t\tselectRange: boolean;\n\t\tselectedDates?: Date[];\n\t\tselectedDate?: Date;\n\t\tminDate?: Date;\n\t\tmaxDate?: Date;\n\t};\n}\n\nexport interface AnalyticsDropdownInterface {\n\toptions: DropdownOptions[];\n\tselected?: DropdownOptions;\n\tplaceholder?: string;\n\tresetDropdown?: boolean;\n\tonOptionSelected: (\n\t\tchosen: DropdownOptions & {\n\t\t\tselectedRange?: [Date, Date];\n\t\t},\n\t) => void;\n\tmaxHeight?: string;\n\tbackgroundcolor?: string;\n\tcalendarPopperConfig?: {\n\t\toffsetSkid?: number;\n\t\toffsetDistance?: number;\n\t};\n\tvariant?: 'small' \| 'default';\n\tdatePickerPlacement?: DropDirection;\n\tcloseDropdown?: boolean;\n\tlabelColor?: string;\n\tstyleProps?: React.CSSProperties;\n\tshowTimePicker?: boolean;\n}\n\nexport const AnalyticsDropdown: React.FC<AnalyticsDropdownInterface> = ({\n\toptions,\n\tplaceholder = 'Select an option',\n\tselected,\n\tonOptionSelected,\n\tresetDropdown,\n\tmaxHeight,\n\tbackgroundcolor,\n\tcalendarPopperConfig,\n\tvariant = 'default',\n\tdatePickerPlacement,\n\tcloseDropdown,\n\tlabelColor,\n\tstyleProps,\n\tshowTimePicker = false,\n}) => {\n\tconst [openCalender, setCalender] = useState(false);\n\tconst [selectedOption, setSelectedOption] = useState(selected);\n\tconst [selectedDate, setSelectedDate] = useState<Date[]>();\n\tconst [showDropdown, setShowDropdown] = useState(false);\n\tconst [optionPlaceholder, setOptionPlaceholder] = useState(selected);\n\tconst dropdownRef = useRef<HTMLDivElement \| null>(null);\n\tconst LabelText = variant === 'small' ? Caption : BodySecondary;\n\n\tuseEffect(() => {\n\t\tresetDropdown && setSelectedOption(undefined);\n\t}, [resetDropdown]);\n\n\tuseEffect(() => {\n\t\tif (\n\t\t\tselected?.isCustom &&\n\t\t\tselected.dateRangeSelectionOptions?.selectedDates\n\t\t) {\n\t\t\tsetSelectedDate(selected.dateRangeSelectionOptions.selectedDates);\n\t\t} else {\n\t\t\tsetSelectedDate(undefined);\n\t\t}\n\t\tsetSelectedOption(selected);\n\t}, [selected]);\n\n\tuseEffect(() => {\n\t\tsetShowDropdown(false);\n\t\tsetCalender(false);\n\t}, [closeDropdown]);\n\n\tconst setDropdown = (forceState?: boolean) => {\n\t\tif (forceState !== undefined) {\n\t\t\tsetShowDropdown(forceState);\n\t\t\topenCalender && setCalender(false);\n\t\t} else {\n\t\t\tsetShowDropdown((prevState) => !prevState);\n\t\t}\n\t};\n\n\tconst handleClickOutside = (event: MouseEvent) => {\n\t\tif (\n\t\t\tdropdownRef.current &&\n\t\t\t!dropdownRef.current.contains(event.target as Node)\n\t\t) {\n\t\t\tif (openCalender) {\n\t\t\t\tsetCalender(false);\n\t\t\t}\n\t\t\tsetDropdown(false);\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tif (showDropdown) {\n\t\t\tdocument.addEventListener('mousedown', handleClickOutside);\n\t\t}\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('mousedown', handleClickOutside);\n\t\t};\n\t}, [showDropdown]);\n\n\treturn (\n\t\t<>\n\t\t\t<MainDropdown\n\t\t\t\tdrop={'down'}\n\t\t\t\tshow={showDropdown}\n\t\t\t\tonToggle={setDropdown}\n\t\t\t\tbgColor={backgroundcolor}\n\t\t\t\tid=\"analytic-dropdown\"\n\t\t\t>\n\t\t\t\t<Dropdown.Toggle\n\t\t\t\t\tid=\"dropdown-autoclose-outside\"\n\t\t\t\t\tclassName=\"main--dropdown\"\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tvariant === 'small'\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tgap: 6,\n\t\t\t\t\t\t\t\t\tpadding: '4px 8px',\n\t\t\t\t\t\t\t\t\tbackgroundColor: '#FAFAFA',\n\t\t\t\t\t\t\t\t\tborderRadius: 4,\n\t\t\t\t\t\t\t\t\tborder: `1px solid ${DEFAULT_THEME.colorsV2.stroke.primary}`,\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: styleProps\n\t\t\t\t\t\t\t? styleProps\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<LabelText\n\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\tvariant === 'small' \|\| labelColor\n\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\t\t\t\t\tlabelColor \|\| DEFAULT_THEME.colorsV2.content.secondary,\n\t\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{selectedOption?.isCustom\n\t\t\t\t\t\t\t? selectedDate\n\t\t\t\t\t\t\t\t? formatDate(selectedDate[0], showTimePicker) ===\n\t\t\t\t\t\t\t\t formatDate(selectedDate[1], showTimePicker)\n\t\t\t\t\t\t\t\t\t? `${formatDate(selectedDate[0], showTimePicker)}`\n\t\t\t\t\t\t\t\t\t: `${formatDate(\n\t\t\t\t\t\t\t\t\t\t\tselectedDate[0],\n\t\t\t\t\t\t\t\t\t\t\tshowTimePicker,\n\t\t\t\t\t\t\t\t\t )} to ${formatDate(selectedDate[1], showTimePicker)}`\n\t\t\t\t\t\t\t\t: optionPlaceholder?.label\n\t\t\t\t\t\t\t\t? optionPlaceholder?.label\n\t\t\t\t\t\t\t\t: placeholder\n\t\t\t\t\t\t\t: selectedOption\n\t\t\t\t\t\t\t? selectedOption?.label\n\t\t\t\t\t\t\t: placeholder}\n\t\t\t\t\t</LabelText>\n\t\t\t\t</Dropdown.Toggle>\n\t\t\t\t{ReactDOM.createPortal(\n\t\t\t\t\t<Dropdown.Menu\n\t\t\t\t\t\tclassName=\"main--dropdown\"\n\t\t\t\t\t\tstyle={{ padding: 0 }}\n\t\t\t\t\t\tref={dropdownRef}\n\t\t\t\t\t>\n\t\t\t\t\t\t<MainDropdown\n\t\t\t\t\t\t\tdrop={datePickerPlacement ?? 'end'}\n\t\t\t\t\t\t\tid=\"sub--dropdown\"\n\t\t\t\t\t\t\tshow={openCalender}\n\t\t\t\t\t\t\tonToggle={(toggleCalender) => {\n\t\t\t\t\t\t\t\t!toggleCalender && setShowDropdown(false);\n\t\t\t\t\t\t\t\tsetCalender(!openCalender);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tmaxHeight: maxHeight ? maxHeight : 'auto',\n\t\t\t\t\t\t\t\t\toverflowY: 'scroll',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{options.map((eachOption, index) => (\n\t\t\t\t\t\t\t\t\t<div key={eachOption?.key}>\n\t\t\t\t\t\t\t\t\t\t{eachOption?.isCustom ? (\n\t\t\t\t\t\t\t\t\t\t\t<Dropdown.Toggle className=\"sub--dropdown\">\n\t\t\t\t\t\t\t\t\t\t\t\t<EachItem\n\t\t\t\t\t\t\t\t\t\t\t\t\tisFirstItem={index === 0}\n\t\t\t\t\t\t\t\t\t\t\t\t\tisLastItem={index === options.length - 1}\n\t\t\t\t\t\t\t\t\t\t\t\t\teachOption={eachOption}\n\t\t\t\t\t\t\t\t\t\t\t\t\tselectedOption={selectedOption}\n\t\t\t\t\t\t\t\t\t\t\t\t\tselectedDate={selectedDate}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClickingEachItem={(option) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedOption(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetCalender(true);\n\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\trangeSelection={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\teachOption?.dateRangeSelectionOptions?.selectRange\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: false\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tshowTimePicker={showTimePicker}\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</Dropdown.Toggle>\n\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t<EachItem\n\t\t\t\t\t\t\t\t\t\t\t\tisFirstItem={index === 0}\n\t\t\t\t\t\t\t\t\t\t\t\tisLastItem={index === options.length - 1}\n\t\t\t\t\t\t\t\t\t\t\t\teachOption={eachOption}\n\t\t\t\t\t\t\t\t\t\t\t\tselectedOption={selectedOption}\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate={selectedDate}\n\t\t\t\t\t\t\t\t\t\t\t\tonClickingEachItem={(option) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedDate(undefined);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedOption(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetOptionPlaceholder(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetDropdown();\n\t\t\t\t\t\t\t\t\t\t\t\t\tif (!option.noOfDays) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonOptionSelected(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tconst endDate = new Date();\n\t\t\t\t\t\t\t\t\t\t\t\t\tconst startDate = new Date();\n\t\t\t\t\t\t\t\t\t\t\t\t\tstartDate.setDate(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tendDate.getDate() - option.noOfDays,\n\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t...option,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [startDate, endDate],\n\t\t\t\t\t\t\t\t\t\t\t\t\t});\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\tshowTimePicker={showTimePicker}\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))}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<Dropdown.Menu\n\t\t\t\t\t\t\t\tclassName=\"sub--dropdown\"\n\t\t\t\t\t\t\t\tpopperConfig={{\n\t\t\t\t\t\t\t\t\tmodifiers: [\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tname: 'offset',\n\t\t\t\t\t\t\t\t\t\t\toptions: {\n\t\t\t\t\t\t\t\t\t\t\t\toffset: [\n\t\t\t\t\t\t\t\t\t\t\t\t\tcalendarPopperConfig?.offsetSkid \|\| 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\tcalendarPopperConfig?.offsetDistance \|\| 0,\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},\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\t\t<DatePicker\n\t\t\t\t\t\t\t\t\tselectRange={\n\t\t\t\t\t\t\t\t\t\tselectedOption?.dateRangeSelectionOptions?.selectRange \|\|\n\t\t\t\t\t\t\t\t\t\tfalse\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tshowTimePicker={showTimePicker}\n\t\t\t\t\t\t\t\t\tmaxDate={selectedOption?.dateRangeSelectionOptions?.maxDate}\n\t\t\t\t\t\t\t\t\tminDate={selectedOption?.dateRangeSelectionOptions?.minDate}\n\t\t\t\t\t\t\t\t\tselectedDates={selectedDate}\n\t\t\t\t\t\t\t\t\tonSelectRange={(selectedStartDate, selectedEndDate) => {\n\t\t\t\t\t\t\t\t\t\tconst updatedDates = [selectedStartDate, selectedEndDate];\n\n\t\t\t\t\t\t\t\t\t\tif (selectedOption?.dateRangeSelectionOptions) {\n\t\t\t\t\t\t\t\t\t\t\tselectedOption.dateRangeSelectionOptions.selectedDates =\n\t\t\t\t\t\t\t\t\t\t\t\tupdatedDates;\n\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t...selectedOption,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [selectedStartDate, selectedEndDate],\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\tsetOptionPlaceholder(selectedOption);\n\t\t\t\t\t\t\t\t\t\tsetCalender(false);\n\t\t\t\t\t\t\t\t\t\tsetSelectedDate(updatedDates);\n\t\t\t\t\t\t\t\t\t\tsetShowDropdown(!showDropdown);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonSelectDate={(selectedDate) => {\n\t\t\t\t\t\t\t\t\t\tif (selectedOption?.dateRangeSelectionOptions) {\n\t\t\t\t\t\t\t\t\t\t\tselectedOption.dateRangeSelectionOptions.selectedDates = [\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate,\n\t\t\t\t\t\t\t\t\t\t\t];\n\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t...selectedOption,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [selectedDate, selectedDate],\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\tsetOptionPlaceholder(selectedOption);\n\t\t\t\t\t\t\t\t\t\tsetCalender(false);\n\t\t\t\t\t\t\t\t\t\tsetSelectedDate([selectedDate, selectedDate]);\n\t\t\t\t\t\t\t\t\t\tsetShowDropdown(!showDropdown);\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</Dropdown.Menu>\n\t\t\t\t\t\t</MainDropdown>\n\t\t\t\t\t</Dropdown.Menu>,\n\t\t\t\t\tdocument.body,\n\t\t\t\t)}\n\t\t\t</MainDropdown>\n\t\t</>\n\t);\n};\n\nexport const EachItem: React.FC<{\n\teachOption: DropdownOptions;\n\tselectedOption: DropdownOptions \| undefined;\n\tselectedDate: Date[] \| undefined;\n\tonClickingEachItem: (optionSelected: DropdownOptions) => void;\n\trangeSelection?: boolean;\n\tisLastItem?: boolean;\n\tisFirstItem?: boolean;\n\tshowTimePicker?: boolean;\n}> = ({\n\teachOption,\n\tselectedOption,\n\tselectedDate,\n\tonClickingEachItem,\n\trangeSelection,\n\tisLastItem,\n\tisFirstItem,\n\tshowTimePicker,\n}) => {\n\treturn (\n\t\t<ItemMenuContainer\n\t\t\tisFirstItem={isFirstItem}\n\t\t\tisLastItem={isLastItem}\n\t\t\tkey={eachOption.key}\n\t\t\tonClick={() => onClickingEachItem(eachOption)}\n\t\t\tisSelected={\n\t\t\t\teachOption.isCustom\n\t\t\t\t\t? eachOption.key == selectedOption?.key && !!selectedDate\n\t\t\t\t\t: eachOption.key == selectedOption?.key\n\t\t\t}\n\t\t>\n\t\t\t<BodySecondary\n\t\t\t\tcolor={\n\t\t\t\t\teachOption.key == selectedOption?.key\n\t\t\t\t\t\t? BASE_COLORS.positive[900]\n\t\t\t\t\t\t: BASE_COLORS.grayscale[900]\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{eachOption.label}\n\t\t\t</BodySecondary>\n\t\t\t{eachOption.subLabel ? (\n\t\t\t\t<BodyCaption style={{ color: BASE_COLORS.grayscale[700] }}>\n\t\t\t\t\t{eachOption.subLabel}\n\t\t\t\t</BodyCaption>\n\t\t\t) : (\n\t\t\t\t<></>\n\t\t\t)}\n\t\t\t{selectedDate &&\n\t\t\t\tselectedOption?.isCustom &&\n\t\t\t\teachOption.key == selectedOption?.key && (\n\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\twhiteSpace: 'normal',\n\t\t\t\t\t\t\twordBreak: 'break-word',\n\t\t\t\t\t\t\ttextAlign: 'left',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{rangeSelection\n\t\t\t\t\t\t\t? `${formatDate(selectedDate[0], showTimePicker)} to ${formatDate(\n\t\t\t\t\t\t\t\t\tselectedDate[1],\n\t\t\t\t\t\t\t\t\tshowTimePicker,\n\t\t\t\t\t\t\t )}`\n\t\t\t\t\t\t\t: `${formatDate(selectedDate[0], showTimePicker)}`}\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t)}\n\t\t</ItemMenuContainer>\n\t);\n};\n\nexport const formatDate = (dateVal: Date, includeTime?: boolean) => {\n\tconst dateString = dateVal.toLocaleString('default', {\n\t\tday: 'numeric',\n\t\tmonth: 'short',\n\t\tyear: 'numeric',\n\t});\n\n\tif (includeTime) {\n\t\tconst timeString = dateVal.toLocaleString('default', {\n\t\t\thour: 'numeric',\n\t\t\tminute: '2-digit',\n\t\t\thour12: true,\n\t\t});\n\t\treturn `${dateString} (${timeString})`;\n\t}\n\n\treturn dateString;\n};\n"],"names":["EachItem","eachOption","selectedOption","selectedDate","onClickingEachItem","rangeSelection","isLastItem","isFirstItem","showTimePicker","_jsxs","ItemMenuContainer","Object","assign","onClick","isSelected","isCustom","key","children","_jsx","jsx","BodySecondary","color","BASE_COLORS","positive","grayscale","label","subLabel","BodyCaption","style","_Fragment","Fragment","whiteSpace","wordBreak","textAlign","formatDate","dateVal","includeTime","dateString","toLocaleString","day","month","year","hour","minute","hour12","AnalyticsDropdown","options","placeholder","selected","onOptionSelected","resetDropdown","maxHeight","backgroundcolor","calendarPopperConfig","variant","datePickerPlacement","closeDropdown","labelColor","styleProps","openCalender","setCalender","useState","setSelectedOption","setSelectedDate","showDropdown","setShowDropdown","optionPlaceholder","setOptionPlaceholder","dropdownRef","useRef","LabelText","Caption","useEffect","undefined","_a","dateRangeSelectionOptions","selectedDates","setDropdown","forceState","prevState","handleClickOutside","event","current","contains","target","document","addEventListener","removeEventListener","jsxs","MainDropdown","drop","show","onToggle","bgColor","id","Dropdown","Toggle","className","display","alignItems","gap","padding","backgroundColor","borderRadius","border","DEFAULT_THEME","colorsV2","stroke","primary","content","secondary","ReactDOM","createPortal","Menu","ref","toggleCalender","overflowY","map","index","length","option","selectRange","noOfDays","endDate","Date","startDate","setDate","getDate","selectedRange","popperConfig","modifiers","name","offset","offsetSkid","offsetDistance","DatePicker","maxDate","_b","minDate","_c","onSelectRange","selectedStartDate","selectedEndDate","updatedDates","onSelectDate","body"],"mappings":"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"}
1	+ {"version":3,"file":"AnalyticsDropdown.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsDropdown.tsx"],"sourcesContent":["import 'bootstrap/dist/css/bootstrap.min.css';\nimport React, { useEffect, useRef, useState } from 'react';\nimport { Dropdown } from 'react-bootstrap';\nimport { DropDirection } from 'react-bootstrap/esm/DropdownContext';\nimport ReactDOM from 'react-dom';\nimport { BASE_COLORS, DEFAULT_THEME } from '@src/constants/Theme';\nimport { DatePicker } from '../datePicker';\nimport { BodyCaption, BodySecondary, Caption } from '../TypographyStyle';\nimport { ItemMenuContainer, MainDropdown } from './CommonStyles';\n\nexport interface DropdownOptions {\n\tlabel: string;\n\tsubLabel?: string;\n\tvalue: string;\n\tkey: string \| number;\n\tnoOfDays?: number;\n\tisCustom?: boolean;\n\tdateRangeSelectionOptions?: {\n\t\tselectRange: boolean;\n\t\tselectedDates?: Date[];\n\t\tselectedDate?: Date;\n\t\tminDate?: Date;\n\t\tmaxDate?: Date;\n\t};\n}\n\nexport interface AnalyticsDropdownInterface {\n\toptions: DropdownOptions[];\n\tselected?: DropdownOptions;\n\tplaceholder?: string;\n\tresetDropdown?: boolean;\n\tonOptionSelected: (\n\t\tchosen: DropdownOptions & {\n\t\t\tselectedRange?: [Date, Date];\n\t\t},\n\t) => void;\n\tmaxHeight?: string;\n\tbackgroundcolor?: string;\n\tcalendarPopperConfig?: {\n\t\toffsetSkid?: number;\n\t\toffsetDistance?: number;\n\t};\n\tvariant?: 'small' \| 'default';\n\tdatePickerPlacement?: DropDirection;\n\tcloseDropdown?: boolean;\n\tlabelColor?: string;\n\tstyleProps?: React.CSSProperties;\n\tshowTimePicker?: boolean;\n}\n\nexport const AnalyticsDropdown: React.FC<AnalyticsDropdownInterface> = ({\n\toptions,\n\tplaceholder = 'Select an option',\n\tselected,\n\tonOptionSelected,\n\tresetDropdown,\n\tmaxHeight,\n\tbackgroundcolor,\n\tcalendarPopperConfig,\n\tvariant = 'default',\n\tdatePickerPlacement,\n\tcloseDropdown,\n\tlabelColor,\n\tstyleProps,\n\tshowTimePicker = false,\n}) => {\n\tconst [openCalender, setCalender] = useState(false);\n\tconst [selectedOption, setSelectedOption] = useState(selected);\n\tconst [selectedDate, setSelectedDate] = useState<Date[]>();\n\tconst [showDropdown, setShowDropdown] = useState(false);\n\tconst [optionPlaceholder, setOptionPlaceholder] = useState(selected);\n\tconst dropdownRef = useRef<HTMLDivElement \| null>(null);\n\tconst LabelText = variant === 'small' ? Caption : BodySecondary;\n\n\tuseEffect(() => {\n\t\tresetDropdown && setSelectedOption(undefined);\n\t}, [resetDropdown]);\n\n\tuseEffect(() => {\n\t\tif (\n\t\t\tselected?.isCustom &&\n\t\t\tselected.dateRangeSelectionOptions?.selectedDates\n\t\t) {\n\t\t\tsetSelectedDate(selected.dateRangeSelectionOptions.selectedDates);\n\t\t} else {\n\t\t\tsetSelectedDate(undefined);\n\t\t}\n\t\tsetSelectedOption(selected);\n\t}, [selected]);\n\n\tuseEffect(() => {\n\t\tsetShowDropdown(false);\n\t\tsetCalender(false);\n\t}, [closeDropdown]);\n\n\tconst setDropdown = (forceState?: boolean) => {\n\t\tif (forceState !== undefined) {\n\t\t\tsetShowDropdown(forceState);\n\t\t\topenCalender && setCalender(false);\n\t\t} else {\n\t\t\tsetShowDropdown((prevState) => !prevState);\n\t\t}\n\t};\n\n\tconst handleClickOutside = (event: MouseEvent) => {\n\t\tif (\n\t\t\tdropdownRef.current &&\n\t\t\t!dropdownRef.current.contains(event.target as Node)\n\t\t) {\n\t\t\tif (openCalender) {\n\t\t\t\tsetCalender(false);\n\t\t\t}\n\t\t\tsetDropdown(false);\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\tif (showDropdown) {\n\t\t\tdocument.addEventListener('mousedown', handleClickOutside);\n\t\t}\n\t\treturn () => {\n\t\t\tdocument.removeEventListener('mousedown', handleClickOutside);\n\t\t};\n\t}, [showDropdown]);\n\n\treturn (\n\t\t<>\n\t\t\t<MainDropdown\n\t\t\t\tdrop={'down'}\n\t\t\t\tshow={showDropdown}\n\t\t\t\tonToggle={setDropdown}\n\t\t\t\tbgColor={backgroundcolor}\n\t\t\t\tid=\"analytic-dropdown\"\n\t\t\t>\n\t\t\t\t<Dropdown.Toggle\n\t\t\t\t\tid=\"dropdown-autoclose-outside\"\n\t\t\t\t\tclassName=\"main--dropdown\"\n\t\t\t\t\tstyle={\n\t\t\t\t\t\tvariant === 'small'\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tgap: 6,\n\t\t\t\t\t\t\t\t\tpadding: '4px 8px',\n\t\t\t\t\t\t\t\t\tbackgroundColor: '#FAFAFA',\n\t\t\t\t\t\t\t\t\tborderRadius: 4,\n\t\t\t\t\t\t\t\t\tborder: `1px solid ${DEFAULT_THEME.colorsV2.stroke.primary}`,\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: styleProps\n\t\t\t\t\t\t\t? styleProps\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t>\n\t\t\t\t\t<LabelText\n\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\tvariant === 'small' \|\| labelColor\n\t\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\t\t\t\t\tlabelColor \|\| DEFAULT_THEME.colorsV2.content.secondary,\n\t\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{selectedOption?.isCustom\n\t\t\t\t\t\t\t? selectedDate\n\t\t\t\t\t\t\t\t? formatDate(selectedDate[0], showTimePicker) ===\n\t\t\t\t\t\t\t\t formatDate(selectedDate[1], showTimePicker)\n\t\t\t\t\t\t\t\t\t? `${formatDate(selectedDate[0], showTimePicker)}`\n\t\t\t\t\t\t\t\t\t: `${formatDate(\n\t\t\t\t\t\t\t\t\t\t\tselectedDate[0],\n\t\t\t\t\t\t\t\t\t\t\tshowTimePicker,\n\t\t\t\t\t\t\t\t\t )} to ${formatDate(selectedDate[1], showTimePicker)}`\n\t\t\t\t\t\t\t\t: optionPlaceholder?.label\n\t\t\t\t\t\t\t\t? optionPlaceholder?.label\n\t\t\t\t\t\t\t\t: placeholder\n\t\t\t\t\t\t\t: selectedOption\n\t\t\t\t\t\t\t? selectedOption?.label\n\t\t\t\t\t\t\t: placeholder}\n\t\t\t\t\t</LabelText>\n\t\t\t\t</Dropdown.Toggle>\n\t\t\t\t{ReactDOM.createPortal(\n\t\t\t\t\t<Dropdown.Menu\n\t\t\t\t\t\tclassName=\"main--dropdown\"\n\t\t\t\t\t\tstyle={{ padding: 0 }}\n\t\t\t\t\t\tref={dropdownRef}\n\t\t\t\t\t>\n\t\t\t\t\t\t<MainDropdown\n\t\t\t\t\t\t\tdrop={datePickerPlacement ?? 'end'}\n\t\t\t\t\t\t\tid=\"sub--dropdown\"\n\t\t\t\t\t\t\tshow={openCalender}\n\t\t\t\t\t\t\tonToggle={(toggleCalender) => {\n\t\t\t\t\t\t\t\t!toggleCalender && setShowDropdown(false);\n\t\t\t\t\t\t\t\tsetCalender(!openCalender);\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tmaxHeight: maxHeight ? maxHeight : 'auto',\n\t\t\t\t\t\t\t\t\toverflowY: 'scroll',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{options.map((eachOption, index) => (\n\t\t\t\t\t\t\t\t\t<div key={eachOption?.key}>\n\t\t\t\t\t\t\t\t\t\t{eachOption?.isCustom ? (\n\t\t\t\t\t\t\t\t\t\t\t<Dropdown.Toggle className=\"sub--dropdown\">\n\t\t\t\t\t\t\t\t\t\t\t\t<EachItem\n\t\t\t\t\t\t\t\t\t\t\t\t\tisFirstItem={index === 0}\n\t\t\t\t\t\t\t\t\t\t\t\t\tisLastItem={index === options.length - 1}\n\t\t\t\t\t\t\t\t\t\t\t\t\teachOption={eachOption}\n\t\t\t\t\t\t\t\t\t\t\t\t\tselectedOption={selectedOption}\n\t\t\t\t\t\t\t\t\t\t\t\t\tselectedDate={selectedDate}\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClickingEachItem={(option) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedOption(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetCalender(true);\n\t\t\t\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\t\t\t\trangeSelection={\n\t\t\t\t\t\t\t\t\t\t\t\t\t\teachOption?.dateRangeSelectionOptions?.selectRange\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: false\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tshowTimePicker={showTimePicker}\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</Dropdown.Toggle>\n\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t<EachItem\n\t\t\t\t\t\t\t\t\t\t\t\tisFirstItem={index === 0}\n\t\t\t\t\t\t\t\t\t\t\t\tisLastItem={index === options.length - 1}\n\t\t\t\t\t\t\t\t\t\t\t\teachOption={eachOption}\n\t\t\t\t\t\t\t\t\t\t\t\tselectedOption={selectedOption}\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate={selectedDate}\n\t\t\t\t\t\t\t\t\t\t\t\tonClickingEachItem={(option) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedDate(undefined);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetSelectedOption(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetOptionPlaceholder(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\tsetDropdown();\n\t\t\t\t\t\t\t\t\t\t\t\t\tif (!option.noOfDays) {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonOptionSelected(option);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t\t\tconst endDate = new Date();\n\t\t\t\t\t\t\t\t\t\t\t\t\tconst startDate = new Date();\n\t\t\t\t\t\t\t\t\t\t\t\t\tstartDate.setDate(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tendDate.getDate() - option.noOfDays,\n\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t...option,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [startDate, endDate],\n\t\t\t\t\t\t\t\t\t\t\t\t\t});\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\tshowTimePicker={showTimePicker}\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))}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<Dropdown.Menu\n\t\t\t\t\t\t\t\tclassName=\"sub--dropdown\"\n\t\t\t\t\t\t\t\tpopperConfig={{\n\t\t\t\t\t\t\t\t\tmodifiers: [\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tname: 'offset',\n\t\t\t\t\t\t\t\t\t\t\toptions: {\n\t\t\t\t\t\t\t\t\t\t\t\toffset: [\n\t\t\t\t\t\t\t\t\t\t\t\t\tcalendarPopperConfig?.offsetSkid \|\| 0,\n\t\t\t\t\t\t\t\t\t\t\t\t\tcalendarPopperConfig?.offsetDistance \|\| 0,\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},\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\t\t<DatePicker\n\t\t\t\t\t\t\t\t\tselectRange={\n\t\t\t\t\t\t\t\t\t\tselectedOption?.dateRangeSelectionOptions?.selectRange \|\|\n\t\t\t\t\t\t\t\t\t\tfalse\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tshowTimePicker={showTimePicker}\n\t\t\t\t\t\t\t\t\tmaxDate={selectedOption?.dateRangeSelectionOptions?.maxDate}\n\t\t\t\t\t\t\t\t\tminDate={selectedOption?.dateRangeSelectionOptions?.minDate}\n\t\t\t\t\t\t\t\t\tselectedDates={selectedDate}\n\t\t\t\t\t\t\t\t\tonSelectRange={(selectedStartDate, selectedEndDate) => {\n\t\t\t\t\t\t\t\t\t\tconst updatedDates = [selectedStartDate, selectedEndDate];\n\n\t\t\t\t\t\t\t\t\t\tif (selectedOption?.dateRangeSelectionOptions) {\n\t\t\t\t\t\t\t\t\t\t\tselectedOption.dateRangeSelectionOptions.selectedDates =\n\t\t\t\t\t\t\t\t\t\t\t\tupdatedDates;\n\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t...selectedOption,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [selectedStartDate, selectedEndDate],\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\tsetOptionPlaceholder(selectedOption);\n\t\t\t\t\t\t\t\t\t\tsetCalender(false);\n\t\t\t\t\t\t\t\t\t\tsetSelectedDate(updatedDates);\n\t\t\t\t\t\t\t\t\t\tsetShowDropdown(!showDropdown);\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tonSelectDate={(selectedDate) => {\n\t\t\t\t\t\t\t\t\t\tif (selectedOption?.dateRangeSelectionOptions) {\n\t\t\t\t\t\t\t\t\t\t\tselectedOption.dateRangeSelectionOptions.selectedDates = [\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedDate,\n\t\t\t\t\t\t\t\t\t\t\t];\n\t\t\t\t\t\t\t\t\t\t\tonOptionSelected({\n\t\t\t\t\t\t\t\t\t\t\t\t...selectedOption,\n\t\t\t\t\t\t\t\t\t\t\t\tselectedRange: [selectedDate, selectedDate],\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\tsetOptionPlaceholder(selectedOption);\n\t\t\t\t\t\t\t\t\t\tsetCalender(false);\n\t\t\t\t\t\t\t\t\t\tsetSelectedDate([selectedDate, selectedDate]);\n\t\t\t\t\t\t\t\t\t\tsetShowDropdown(!showDropdown);\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</Dropdown.Menu>\n\t\t\t\t\t\t</MainDropdown>\n\t\t\t\t\t</Dropdown.Menu>,\n\t\t\t\t\tdocument.body,\n\t\t\t\t)}\n\t\t\t</MainDropdown>\n\t\t</>\n\t);\n};\n\nexport const EachItem: React.FC<{\n\teachOption: DropdownOptions;\n\tselectedOption: DropdownOptions \| undefined;\n\tselectedDate: Date[] \| undefined;\n\tonClickingEachItem: (optionSelected: DropdownOptions) => void;\n\trangeSelection?: boolean;\n\tisLastItem?: boolean;\n\tisFirstItem?: boolean;\n\tshowTimePicker?: boolean;\n}> = ({\n\teachOption,\n\tselectedOption,\n\tselectedDate,\n\tonClickingEachItem,\n\trangeSelection,\n\tisLastItem,\n\tisFirstItem,\n\tshowTimePicker,\n}) => {\n\treturn (\n\t\t<ItemMenuContainer\n\t\t\tisFirstItem={isFirstItem}\n\t\t\tisLastItem={isLastItem}\n\t\t\tkey={eachOption.key}\n\t\t\tonClick={() => onClickingEachItem(eachOption)}\n\t\t\tisSelected={\n\t\t\t\teachOption.isCustom\n\t\t\t\t\t? eachOption.key == selectedOption?.key && !!selectedDate\n\t\t\t\t\t: eachOption.key == selectedOption?.key\n\t\t\t}\n\t\t>\n\t\t\t<BodySecondary\n\t\t\t\tcolor={\n\t\t\t\t\teachOption.key == selectedOption?.key\n\t\t\t\t\t\t? BASE_COLORS.positive[900]\n\t\t\t\t\t\t: BASE_COLORS.grayscale[900]\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{eachOption.label}\n\t\t\t</BodySecondary>\n\t\t\t{eachOption.subLabel ? (\n\t\t\t\t<BodyCaption style={{ color: BASE_COLORS.grayscale[700] }}>\n\t\t\t\t\t{eachOption.subLabel}\n\t\t\t\t</BodyCaption>\n\t\t\t) : (\n\t\t\t\t<></>\n\t\t\t)}\n\t\t\t{selectedDate &&\n\t\t\t\tselectedOption?.isCustom &&\n\t\t\t\teachOption.key == selectedOption?.key && (\n\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\twhiteSpace: 'normal',\n\t\t\t\t\t\t\twordBreak: 'break-word',\n\t\t\t\t\t\t\ttextAlign: 'left',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{rangeSelection\n\t\t\t\t\t\t\t? `${formatDate(selectedDate[0], showTimePicker)} to ${formatDate(\n\t\t\t\t\t\t\t\t\tselectedDate[1],\n\t\t\t\t\t\t\t\t\tshowTimePicker,\n\t\t\t\t\t\t\t )}`\n\t\t\t\t\t\t\t: `${formatDate(selectedDate[0], showTimePicker)}`}\n\t\t\t\t\t</BodyCaption>\n\t\t\t\t)}\n\t\t</ItemMenuContainer>\n\t);\n};\n\nexport const formatDate = (dateVal: Date, includeTime?: boolean) => {\n\tconst dateString = dateVal.toLocaleString('default', {\n\t\tday: 'numeric',\n\t\tmonth: 'short',\n\t\tyear: 'numeric',\n\t});\n\n\tif (includeTime) {\n\t\tconst timeString = dateVal.toLocaleString('default', {\n\t\t\thour: 'numeric',\n\t\t\tminute: '2-digit',\n\t\t\thour12: true,\n\t\t});\n\t\treturn `${dateString} (${timeString})`;\n\t}\n\n\treturn dateString;\n};\n"],"names":["AnalyticsDropdown","EachItem","_ref2","eachOption","selectedOption","selectedDate","onClickingEachItem","rangeSelection","isLastItem","isFirstItem","showTimePicker","_jsxs","ItemMenuContainer","Object","assign","onClick","isSelected","isCustom","key","children","_jsx","jsx","BodySecondary","color","BASE_COLORS","positive","grayscale","label","subLabel","BodyCaption","style","_Fragment","Fragment","whiteSpace","wordBreak","textAlign","formatDate","dateVal","includeTime","dateString","toLocaleString","day","month","year","hour","minute","hour12","_ref","options","placeholder","selected","onOptionSelected","resetDropdown","maxHeight","backgroundcolor","calendarPopperConfig","variant","datePickerPlacement","closeDropdown","labelColor","styleProps","openCalender","setCalender","useState","setSelectedOption","setSelectedDate","showDropdown","setShowDropdown","optionPlaceholder","setOptionPlaceholder","dropdownRef","useRef","LabelText","Caption","useEffect","undefined","_a","dateRangeSelectionOptions","selectedDates","setDropdown","forceState","prevState","handleClickOutside","event","current","contains","target","document","addEventListener","removeEventListener","jsxs","MainDropdown","drop","show","onToggle","bgColor","id","Dropdown","Toggle","className","display","alignItems","gap","padding","backgroundColor","borderRadius","border","DEFAULT_THEME","colorsV2","stroke","primary","content","secondary","ReactDOM","createPortal","Menu","ref","toggleCalender","overflowY","map","index","length","option","selectRange","noOfDays","endDate","Date","startDate","setDate","getDate","selectedRange","popperConfig","modifiers","name","offset","offsetSkid","offsetDistance","DatePicker","maxDate","_b","minDate","_c","onSelectRange","selectedStartDate","selectedEndDate","updatedDates","onSelectDate","body"],"mappings":"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"}

package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsMetric.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var g=require("@emotion/styled/base"),I=require("react/jsx-runtime"),C=require("../../constants/Theme.js"),A=require("../TypographyStyle.js"),l=require("./AnalyticsTrend.js");function e(g){return g&&"object"==typeof g&&"default"in g?g:{default:g}}const c=e(g).default("div","production"===process.env.NODE_ENV?{target:"e1bel8cf0"}:{target:"e1bel8cf0",label:"TrendContainer"})("production"===process.env.NODE_ENV?{name:"jovua5",styles:"display:flex;flex-direction:row;flex-wrap:wrap"}:{name:"jovua5",styles:"display:flex;flex-direction:row;flex-wrap:wrap",map:"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFuYWx5dGljc01ldHJpYy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS2tDIiwiZmlsZSI6IkFuYWx5dGljc01ldHJpYy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBqc3ggYXMgX2pzeCwganN4cyBhcyBfanN4cywgRnJhZ21lbnQgYXMgX0ZyYWdtZW50IH0gZnJvbSBcInJlYWN0L2pzeC1ydW50aW1lXCI7XHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgQ09MT1JTIH0gZnJvbSBcIi4uLy4uL2NvbnN0YW50cy9UaGVtZVwiO1xyXG5pbXBvcnQgeyBUaXRsZU1lZGl1bSwgVGl0bGVSZWd1bGFyIH0gZnJvbSAnLi4vVHlwb2dyYXBoeVN0eWxlJztcclxuaW1wb3J0IHsgQW5hbHl0aWNzVHJlbmQgfSBmcm9tICcuL0FuYWx5dGljc1RyZW5kJztcclxuY29uc3QgVHJlbmRDb250YWluZXIgPSBzdHlsZWQuZGl2IGBcblx0ZGlzcGxheTogZmxleDtcblx0ZmxleC1kaXJlY3Rpb246IHJvdztcblx0ZmxleC13cmFwOiB3cmFwO1xuYDtcclxuZXhwb3J0IGNvbnN0IEFuYWx5dGljc01ldHJpYyA9ICh7IHRpdGxlLCB0cmVuZHMsIFJpZ2h0SGVhZGVyQ29tcG9uZW50LCBjb250YWluZXJTdHlsZSwgdGl0bGVTaXplLCB0aXRsZUNvbG9yLCBwZXJSb3csIGlzTG9hZGluZywgdHJlbmRTdHlsZSwgdHJlbmRDb250YWluZXJTdHlsZSwgdHJlbmRJY29uU3R5bGUsIGhpZGVIZWFkZXJEaXYsIGlzSW50ZXJuYXRpb25hbFN0b3JlLCB9KSA9PiB7XHJcbiAgICBjb25zdCBUeXBvID0gdGl0bGVTaXplID09PSAnbGFyZ2UnID8gVGl0bGVNZWRpdW0gOiBUaXRsZVJlZ3VsYXI7XHJcbiAgICBjb25zdCBwZXJSb3dMb2NhbCA9IHBlclJvdyB8fFxyXG4gICAgICAgICh0cmVuZHMubGVuZ3RoIDw9IDQgPyB0cmVuZHMubGVuZ3RoIDogdHJlbmRzLmxlbmd0aCAlIDMgPT0gMCA/IDMgOiA0KTtcclxuICAgIGNvbnN0IHJvd3MgPSBNYXRoLmNlaWwodHJlbmRzLmxlbmd0aCAvIHBlclJvd0xvY2FsKTtcclxuICAgIHJldHVybiAoX2pzeHMoXCJkaXZcIiwgT2JqZWN0LmFzc2lnbih7IHN0eWxlOiBPYmplY3QuYXNzaWduKHsgcGFkZGluZ1RvcDogMjQsIHBhZGRpbmdCb3R0b206IDI0IH0sIChjb250YWluZXJTdHlsZSAhPT0gbnVsbCAmJiBjb250YWluZXJTdHlsZSAhPT0gdm9pZCAwID8gY29udGFpbmVyU3R5bGUgOiB7fSkpIH0sIHsgY2hpbGRyZW46IFtfanN4cyhcImRpdlwiLCBPYmplY3QuYXNzaWduKHsgc3R5bGU6IHtcclxuICAgICAgICAgICAgICAgICAgICBkaXNwbGF5OiAnZmxleCcsXHJcbiAgICAgICAgICAgICAgICAgICAgZmxleERpcmVjdGlvbjogJ3JvdycsXHJcbiAgICAgICAgICAgICAgICAgICAganVzdGlmeUNvbnRlbnQ6ICdzcGFjZS1iZXR3ZWVuJyxcclxuICAgICAgICAgICAgICAgICAgICBwYWRkaW5nQm90dG9tOiBoaWRlSGVhZGVyRGl2ID8gMCA6IDEyLFxyXG4gICAgICAgICAgICAgICAgfSB9LCB7IGNoaWxkcmVuOiBbdGl0bGUgJiYgKF9qc3goVHlwbywgT2JqZWN0LmFzc2lnbih7IGNvbG9yOiB0aXRsZUNvbG9yICE9PSBudWxsICYmIHRpdGxlQ29sb3IgIT09IHZvaWQgMCA/IHRpdGxlQ29sb3IgOiBDT0xPUlMuY29udGVudC5zZWNvbmRhcnksIHN0eWxlOiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBwYWRkaW5nTGVmdDogMjQsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBwYWRkaW5nUmlnaHQ6IDI0LFxyXG4gICAgICAgICAgICAgICAgICAgICAgICB9IH0sIHsgY2hpbGRyZW46IHRpdGxlIH0pKSksIFJpZ2h0SGVhZGVyQ29tcG9uZW50XSB9KSksIF9qc3goVHJlbmRDb250YWluZXIsIHsgY2hpbGRyZW46IEFycmF5LmZyb20oeyBsZW5ndGg6IHJvd3MgfSkubWFwKChfLCByb3dJbmRleCkgPT4gKF9qc3goX0ZyYWdtZW50LCB7IGNoaWxkcmVuOiBfanN4KFwiZGl2XCIsIE9iamVjdC5hc3NpZ24oeyBzdHlsZToge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgZGlzcGxheTogJ2ZsZXgnLFxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgd2lkdGg6ICcxMDAlJyxcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIG1hcmdpblRvcDogcm93SW5kZXggPT09IDAgPyAwIDogMTYsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgIH0gfSwgeyBjaGlsZHJlbjogdHJlbmRzXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAuc2xpY2Uocm93SW5kZXggKiBwZXJSb3dMb2NhbCwgKHJvd0luZGV4ICsgMSkgKiBwZXJSb3dMb2NhbClcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIC5tYXAoKHRyZW5kLCBpKSA9PiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB2YXIgX2E7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICByZXR1cm4gKF9qc3goXCJkaXZcIiwgT2JqZWN0LmFzc2lnbih7IHN0eWxlOiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGZsZXg6IDEsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIG1heFdpZHRoOiB0cmVuZHMubGVuZ3RoID09PSAxID8gJzEwMCUnIDogJzUwJScsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgfSB9LCB7IGNoaWxkcmVuOiBfanN4KEFuYWx5dGljc1RyZW5kLCBPYmplY3QuYXNzaWduKHt9LCB0cmVuZCwgeyBpc0xvYWRpbmc6IGlzTG9hZGluZywgY2FyZDogZmFsc2UsIHNpemU6IChfYSA9IHRyZW5kLnNpemUpICE9PSBudWxsICYmIF9hICE9PSB2b2lkIDAgPyBfYSA6ICdzbWFsbCcsIHJpZ2h0U2VwYXJhdG9yOiBpICsgcm93SW5kZXggKiBwZXJSb3dMb2NhbCA8XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBNYXRoLm1pbigocm93SW5kZXggKyAxKSAqIHBlclJvd0xvY2FsIC0gMSwgdHJlbmRzLmxlbmd0aCAtIDEpLCB0cmVuZFN0eWxlOiB0cmVuZFN0eWxlLCB0cmVuZEljb25TdHlsZTogdHJlbmRJY29uU3R5bGUsIHRyZW5kQ29udGFpbmVyU3R5bGU6IHRyZW5kQ29udGFpbmVyU3R5bGUsIGlzSW50ZXJuYXRpb25hbFN0b3JlOiBpc0ludGVybmF0aW9uYWxTdG9yZSB9KSkgfSksIGkpKTtcclxuICAgICAgICAgICAgICAgICAgICAgICAgfSkgfSksIHJvd0luZGV4KSB9KSkpIH0pXSB9KSkpO1xyXG59O1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1BbmFseXRpY3NNZXRyaWMuanMubWFwIl19 */",toString:function(){return"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."}});exports.AnalyticsMetric=({title:g,trends:e,RightHeaderComponent:t,containerStyle:b,titleSize:i,titleColor:d,perRow:s,isLoading:n,trendStyle:a,trendContainerStyle:Z,trendIconStyle:u,hideHeaderDiv:o,isInternationalStore:y})=>{const G="large"===i?A.TitleMedium:A.TitleRegular,m=s||(e.length<=4?e.length:e.length%3==0?3:4),p=Math.ceil(e.length/m);return I.jsxs("div",Object.assign({style:Object.assign({paddingTop:24,paddingBottom:24},null!=b?b:{})},{children:[I.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"space-between",paddingBottom:o?0:12}},{children:[g&&I.jsx(G,Object.assign({color:null!=d?d:C.COLORS.content.secondary,style:{paddingLeft:24,paddingRight:24}},{children:g})),t]})),I.jsx(c,{children:Array.from({length:p}).map(((g,C)=>I.jsx(I.Fragment,{children:I.jsx("div",Object.assign({style:{display:"flex",width:"100%",marginTop:0===C?0:16}},{children:e.slice(C*m,(C+1)*m).map(((g,A)=>{var c;return I.jsx("div",Object.assign({style:{flex:1,maxWidth:1===e.length?"100%":"50%"}},{children:I.jsx(l.AnalyticsTrend,Object.assign({},g,{isLoading:n,card:!1,size:null!==(c=g.size)&&void 0!==c?c:"small",rightSeparator:A+C*m<Math.min((C+1)*m-1,e.length-1),trendStyle:a,trendIconStyle:u,trendContainerStyle:Z,isInternationalStore:y}))}),A)}))}),C)})))})]}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var g=require("@emotion/styled/base"),I=require("react/jsx-runtime"),C=require("../../constants/Theme.js"),A=require("../TypographyStyle.js"),l=require("./AnalyticsTrend.js");function e(g){return g&&"object"==typeof g&&"default"in g?g:{default:g}}const c=e(g).default("div","production"===process.env.NODE_ENV?{target:"e1bel8cf0"}:{target:"e1bel8cf0",label:"TrendContainer"})("production"===process.env.NODE_ENV?{name:"jovua5",styles:"display:flex;flex-direction:row;flex-wrap:wrap"}:{name:"jovua5",styles:"display:flex;flex-direction:row;flex-wrap:wrap",map:"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkFuYWx5dGljc01ldHJpYy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS2tDIiwiZmlsZSI6IkFuYWx5dGljc01ldHJpYy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBqc3ggYXMgX2pzeCwganN4cyBhcyBfanN4cywgRnJhZ21lbnQgYXMgX0ZyYWdtZW50IH0gZnJvbSBcInJlYWN0L2pzeC1ydW50aW1lXCI7XHJcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcclxuaW1wb3J0IHsgQ09MT1JTIH0gZnJvbSBcIi4uLy4uL2NvbnN0YW50cy9UaGVtZVwiO1xyXG5pbXBvcnQgeyBUaXRsZU1lZGl1bSwgVGl0bGVSZWd1bGFyIH0gZnJvbSAnLi4vVHlwb2dyYXBoeVN0eWxlJztcclxuaW1wb3J0IHsgQW5hbHl0aWNzVHJlbmQgfSBmcm9tICcuL0FuYWx5dGljc1RyZW5kJztcclxuY29uc3QgVHJlbmRDb250YWluZXIgPSBzdHlsZWQuZGl2IGBcblx0ZGlzcGxheTogZmxleDtcblx0ZmxleC1kaXJlY3Rpb246IHJvdztcblx0ZmxleC13cmFwOiB3cmFwO1xuYDtcclxuZXhwb3J0IGNvbnN0IEFuYWx5dGljc01ldHJpYyA9ICh7IHRpdGxlLCB0cmVuZHMsIFJpZ2h0SGVhZGVyQ29tcG9uZW50LCBjb250YWluZXJTdHlsZSwgdGl0bGVTaXplLCB0aXRsZUNvbG9yLCBwZXJSb3csIGlzTG9hZGluZywgdHJlbmRTdHlsZSwgdHJlbmRDb250YWluZXJTdHlsZSwgdHJlbmRJY29uU3R5bGUsIGhpZGVIZWFkZXJEaXYsIGlzSW50ZXJuYXRpb25hbFN0b3JlLCB9KSA9PiB7XHJcbiAgICBjb25zdCBUeXBvID0gdGl0bGVTaXplID09PSAnbGFyZ2UnID8gVGl0bGVNZWRpdW0gOiBUaXRsZVJlZ3VsYXI7XHJcbiAgICBjb25zdCBwZXJSb3dMb2NhbCA9IHBlclJvdyB8fFxyXG4gICAgICAgICh0cmVuZHMubGVuZ3RoIDw9IDQgPyB0cmVuZHMubGVuZ3RoIDogdHJlbmRzLmxlbmd0aCAlIDMgPT0gMCA/IDMgOiA0KTtcclxuICAgIGNvbnN0IHJvd3MgPSBNYXRoLmNlaWwodHJlbmRzLmxlbmd0aCAvIHBlclJvd0xvY2FsKTtcclxuICAgIHJldHVybiAoX2pzeHMoXCJkaXZcIiwgT2JqZWN0LmFzc2lnbih7IHN0eWxlOiBPYmplY3QuYXNzaWduKHsgcGFkZGluZ1RvcDogMjQsIHBhZGRpbmdCb3R0b206IDI0IH0sIChjb250YWluZXJTdHlsZSAhPT0gbnVsbCAmJiBjb250YWluZXJTdHlsZSAhPT0gdm9pZCAwID8gY29udGFpbmVyU3R5bGUgOiB7fSkpIH0sIHsgY2hpbGRyZW46IFtfanN4cyhcImRpdlwiLCBPYmplY3QuYXNzaWduKHsgc3R5bGU6IHtcclxuICAgICAgICAgICAgICAgICAgICBkaXNwbGF5OiAnZmxleCcsXHJcbiAgICAgICAgICAgICAgICAgICAgZmxleERpcmVjdGlvbjogJ3JvdycsXHJcbiAgICAgICAgICAgICAgICAgICAganVzdGlmeUNvbnRlbnQ6ICdzcGFjZS1iZXR3ZWVuJyxcclxuICAgICAgICAgICAgICAgICAgICBwYWRkaW5nQm90dG9tOiBoaWRlSGVhZGVyRGl2ID8gMCA6IDEyLFxyXG4gICAgICAgICAgICAgICAgfSB9LCB7IGNoaWxkcmVuOiBbdGl0bGUgJiYgKF9qc3goVHlwbywgT2JqZWN0LmFzc2lnbih7IGNvbG9yOiB0aXRsZUNvbG9yICE9PSBudWxsICYmIHRpdGxlQ29sb3IgIT09IHZvaWQgMCA/IHRpdGxlQ29sb3IgOiBDT0xPUlMuY29udGVudC5zZWNvbmRhcnksIHN0eWxlOiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBwYWRkaW5nTGVmdDogMjQsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBwYWRkaW5nUmlnaHQ6IDI0LFxyXG4gICAgICAgICAgICAgICAgICAgICAgICB9IH0sIHsgY2hpbGRyZW46IHRpdGxlIH0pKSksIFJpZ2h0SGVhZGVyQ29tcG9uZW50XSB9KSksIF9qc3goVHJlbmRDb250YWluZXIsIHsgY2hpbGRyZW46IEFycmF5LmZyb20oeyBsZW5ndGg6IHJvd3MgfSkubWFwKChfLCByb3dJbmRleCkgPT4gKF9qc3goX0ZyYWdtZW50LCB7IGNoaWxkcmVuOiBfanN4KFwiZGl2XCIsIE9iamVjdC5hc3NpZ24oeyBzdHlsZToge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgZGlzcGxheTogJ2ZsZXgnLFxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgd2lkdGg6ICcxMDAlJyxcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIG1hcmdpblRvcDogcm93SW5kZXggPT09IDAgPyAwIDogMTYsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgIH0gfSwgeyBjaGlsZHJlbjogdHJlbmRzXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAuc2xpY2Uocm93SW5kZXggKiBwZXJSb3dMb2NhbCwgKHJvd0luZGV4ICsgMSkgKiBwZXJSb3dMb2NhbClcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIC5tYXAoKHRyZW5kLCBpKSA9PiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB2YXIgX2E7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICByZXR1cm4gKF9qc3goXCJkaXZcIiwgT2JqZWN0LmFzc2lnbih7IHN0eWxlOiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGZsZXg6IDEsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIG1heFdpZHRoOiB0cmVuZHMubGVuZ3RoID09PSAxID8gJzEwMCUnIDogJzUwJScsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgfSB9LCB7IGNoaWxkcmVuOiBfanN4KEFuYWx5dGljc1RyZW5kLCBPYmplY3QuYXNzaWduKHt9LCB0cmVuZCwgeyBpc0xvYWRpbmc6IGlzTG9hZGluZywgY2FyZDogZmFsc2UsIHNpemU6IChfYSA9IHRyZW5kLnNpemUpICE9PSBudWxsICYmIF9hICE9PSB2b2lkIDAgPyBfYSA6ICdzbWFsbCcsIHJpZ2h0U2VwYXJhdG9yOiBpICsgcm93SW5kZXggKiBwZXJSb3dMb2NhbCA8XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBNYXRoLm1pbigocm93SW5kZXggKyAxKSAqIHBlclJvd0xvY2FsIC0gMSwgdHJlbmRzLmxlbmd0aCAtIDEpLCB0cmVuZFN0eWxlOiB0cmVuZFN0eWxlLCB0cmVuZEljb25TdHlsZTogdHJlbmRJY29uU3R5bGUsIHRyZW5kQ29udGFpbmVyU3R5bGU6IHRyZW5kQ29udGFpbmVyU3R5bGUsIGlzSW50ZXJuYXRpb25hbFN0b3JlOiBpc0ludGVybmF0aW9uYWxTdG9yZSB9KSkgfSksIGkpKTtcclxuICAgICAgICAgICAgICAgICAgICAgICAgfSkgfSksIHJvd0luZGV4KSB9KSkpIH0pXSB9KSkpO1xyXG59O1xyXG4vLyMgc291cmNlTWFwcGluZ1VSTD1BbmFseXRpY3NNZXRyaWMuanMubWFwIl19 */",toString:function(){return"You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."}});exports.AnalyticsMetric=g=>{let{title:e,trends:t,RightHeaderComponent:b,containerStyle:i,titleSize:d,titleColor:s,perRow:n,isLoading:a,trendStyle:Z,trendContainerStyle:u,trendIconStyle:o,hideHeaderDiv:y,isInternationalStore:G}=g;const m="large"===d?A.TitleMedium:A.TitleRegular,p=n||(t.length<=4?t.length:t.length%3==0?3:4),r=Math.ceil(t.length/p);return I.jsxs("div",Object.assign({style:Object.assign({paddingTop:24,paddingBottom:24},null!=i?i:{})},{children:[I.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"space-between",paddingBottom:y?0:12}},{children:[e&&I.jsx(m,Object.assign({color:null!=s?s:C.COLORS.content.secondary,style:{paddingLeft:24,paddingRight:24}},{children:e})),b]})),I.jsx(c,{children:Array.from({length:r}).map(((g,C)=>I.jsx(I.Fragment,{children:I.jsx("div",Object.assign({style:{display:"flex",width:"100%",marginTop:0===C?0:16}},{children:t.slice(C*p,(C+1)*p).map(((g,A)=>{var e;return I.jsx("div",Object.assign({style:{flex:1,maxWidth:1===t.length?"100%":"50%"}},{children:I.jsx(l.AnalyticsTrend,Object.assign({},g,{isLoading:a,card:!1,size:null!==(e=g.size)&&void 0!==e?e:"small",rightSeparator:A+C*p<Math.min((C+1)*p-1,t.length-1),trendStyle:Z,trendIconStyle:o,trendContainerStyle:u,isInternationalStore:G}))}),A)}))}),C)})))})]}))};
 //# sourceMappingURL=AnalyticsMetric.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsMetric.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AnalyticsMetric.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsMetric.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { TitleMedium, TitleRegular } from '../TypographyStyle';\nimport { AnalyticsTrend, AnalyticsTrendInterface } from './AnalyticsTrend';\n\nconst TrendContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: wrap;\n`;\n\nexport const AnalyticsMetric: React.FC<{\n\ttitle?: string;\n\tRightHeaderComponent?: React.ReactElement;\n\ttrends: AnalyticsTrendInterface[];\n\tcontainerStyle?: React.CSSProperties;\n\ttrendStyle?: React.CSSProperties;\n\ttrendContainerStyle?: React.CSSProperties;\n\ttrendIconStyle?: React.CSSProperties;\n\ttitleSize?: 'large' \| 'small';\n\ttitleColor?: string;\n\tperRow?: number;\n\tisLoading?: boolean;\n\thideHeaderDiv?: boolean;\n\trelativePercentageDiff?: number;\n\tisInternationalStore?: boolean;\n}> = ({\n\ttitle,\n\ttrends,\n\tRightHeaderComponent,\n\tcontainerStyle,\n\ttitleSize,\n\ttitleColor,\n\tperRow,\n\tisLoading,\n\ttrendStyle,\n\ttrendContainerStyle,\n\ttrendIconStyle,\n\thideHeaderDiv,\n\tisInternationalStore,\n}) => {\n\tconst Typo = titleSize === 'large' ? TitleMedium : TitleRegular;\n\tconst perRowLocal =\n\t\tperRow \|\|\n\t\t(trends.length <= 4 ? trends.length : trends.length % 3 == 0 ? 3 : 4);\n\tconst rows = Math.ceil(trends.length / perRowLocal);\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tpaddingTop: 24,\n\t\t\t\tpaddingBottom: 24,\n\t\t\t\t...(containerStyle ?? {}),\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\tpaddingBottom: hideHeaderDiv ? 0 : 12,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{title && (\n\t\t\t\t\t<Typo\n\t\t\t\t\t\tcolor={titleColor ?? COLORS.content.secondary}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpaddingLeft: 24,\n\t\t\t\t\t\t\tpaddingRight: 24,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{title}\n\t\t\t\t\t</Typo>\n\t\t\t\t)}\n\t\t\t\t{RightHeaderComponent}\n\t\t\t</div>\n\t\t\t<TrendContainer>\n\t\t\t\t{Array.from({ length: rows }).map((_, rowIndex) => (\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\tdisplay: 'flex',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tmarginTop: rowIndex === 0 ? 0 : 16,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tkey={rowIndex}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{trends\n\t\t\t\t\t\t\t\t.slice(rowIndex * perRowLocal, (rowIndex + 1) * perRowLocal)\n\t\t\t\t\t\t\t\t.map((trend, i) => (\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\tflex: 1,\n\t\t\t\t\t\t\t\t\t\t\tmaxWidth: trends.length === 1 ? '100%' : '50%',\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<AnalyticsTrend\n\t\t\t\t\t\t\t\t\t\t\t{...trend}\n\t\t\t\t\t\t\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t\t\t\t\t\t\t\tcard={false}\n\t\t\t\t\t\t\t\t\t\t\tsize={trend.size ?? 'small'}\n\t\t\t\t\t\t\t\t\t\t\trightSeparator={\n\t\t\t\t\t\t\t\t\t\t\t\ti + rowIndex * perRowLocal <\n\t\t\t\t\t\t\t\t\t\t\t\tMath.min(\n\t\t\t\t\t\t\t\t\t\t\t\t\t(rowIndex + 1) * perRowLocal - 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\ttrends.length - 1,\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}\n\t\t\t\t\t\t\t\t\t\t\ttrendStyle={trendStyle}\n\t\t\t\t\t\t\t\t\t\t\ttrendIconStyle={trendIconStyle}\n\t\t\t\t\t\t\t\t\t\t\ttrendContainerStyle={trendContainerStyle}\n\t\t\t\t\t\t\t\t\t\t\tisInternationalStore={isInternationalStore}\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</div>\n\t\t\t\t\t</>\n\t\t\t\t))}\n\t\t\t</TrendContainer>\n\t\t</div>\n\t);\n};\n\n/\n Card < 4 => x x x x x x x x x x\n Card % 3 =>\n x x x x x x x x x\n x x x x x\n x\n else perRow => 2\n x x x x x x\n x x x x x\n x\n else\n x x x x x x x x x x x x x x x\n x x x x x x\n/\n"],"names":["TrendContainer","process","env","NODE_ENV","target","label","_styled","name","styles","map","toString","~~AnalyticsMetric~~","title","trends","RightHeaderComponent","containerStyle","titleSize","titleColor","perRow","isLoading","trendStyle","trendContainerStyle","trendIconStyle","hideHeaderDiv","isInternationalStore","Typo","TitleMedium","TitleRegular","perRowLocal","length","rows","Math","ceil","_jsxs","Object","assign","style","paddingTop","paddingBottom","children","jsxs","display","flexDirection","justifyContent","_jsx","color","COLORS","content","secondary","paddingLeft","paddingRight","jsx","Array","from","_","rowIndex","_Fragment","width","marginTop","slice","trend","i","flex","maxWidth","AnalyticsTrend","card","size","_a","rightSeparator","min"],"mappings":"2TAMA,MAAMA,OAAc,QAAA,MAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,kBAAAC,CAAA,eAAAL,QAAAC,IAAAC,SAAA,CAAAI,KAAA,SAAAC,OAAA,kDAAA,CAAAD,KAAA,SAAAC,OAAA,iDAAAC,IAAA,kuIAAAC,uRAqBfC,~~EACJC~~,~~QACAC~~,~~SACAC~~,~~uBACAC~~,~~iBACAC~~,~~YACAC~~,~~aACAC~~,~~SACAC~~,~~YACAC~~,~~aACAC~~,~~sBACAC~~,~~iBACAC~~,~~gBACAC~~,~~2BAEA~~,~~MAAMC~~,EAAqB,UAAdT,EAAwBU,EAAAA,YAAcC,EAAAA,aAC7CC,EACLV,IACCL,EAAOgB,QAAU,EAAIhB,EAAOgB,OAAShB,EAAOgB,OAAS,GAAK,EAAI,EAAI,GAC9DC,EAAOC,KAAKC,KAAKnB,EAAOgB,OAASD,GAEvC,OACCK,OACC,MAAAC,OAAAC,OAAA,CAAAC,MACCF,OAAAC,OAAA,CAAAE,WAAY,GACZC,cAAe,IACXvB,QAAAA,EAAkB,KAAG,CAAAwB,SAAA,CAG1BN,EACCO,KAAA,MAAAN,OAAAC,OAAA,CAAAC,MAAO,CACNK,QAAS,OACTC,cAAe,MACfC,eAAgB,gBAChBL,cAAef,EAAgB,EAAI,KAGnC,CAAAgB,SAAA,CAAA3B,GACAgC,EAAAA,IAACnB,EACAS,OAAAC,OAAA,CAAAU,MAAO5B,QAAAA,EAAc6B,SAAOC,QAAQC,UACpCZ,MAAO,CACNa,YAAa,GACbC,aAAc,KACd,CAAAX,SAEA3B,KAGFE,MAEF8B,EAACO,IAAAnD,YACCoD,MAAMC,KAAK,CAAExB,OAAQC,IAAQrB,KAAI,CAAC6C,EAAGC,IACrCX,EAAAA,IACCY,EAAAA,SAAA,CAAAjB,SAAAK,EAAAO,IAAA,MAAAjB,OAAAC,OAAA,CACCC,MAAO,CACNK,QAAS,OACTgB,MAAO,OACPC,UAAwB,IAAbH,EAAiB,EAAI,KAChC,CAAAhB,SAGA1B,EACC8C,MAAMJ,EAAW3B,GAAc2B,EAAW,GAAK3B,GAC/CnB,KAAI,CAACmD,EAAOC,WAAM,OAClBjB,MACC,MAAAV,OAAAC,OAAA,CAAAC,MAAO,CACN0B,KAAM,EACNC,SAA4B,IAAlBlD,EAAOgB,OAAe,OAAS,QACzC,CAAAU,SAGDK,EAACO,IAAAa,EAAcA,eACV9B,OAAAC,OAAA,CAAA,EAAAyB,EACJ,CAAAzC,UAAWA,EACX8C,MAAM,EACNC,KAAgB,QAAVC,EAAAP,EAAMM,YAAI,IAAAC,EAAAA,EAAI,QACpBC,eACCP,EAAIN,EAAW3B,EACfG,KAAKsC,KACHd,EAAW,GAAK3B,EAAc,EAC/Bf,EAAOgB,OAAS,GAGlBT,WAAYA,EACZE,eAAgBA,EAChBD,oBAAqBA,EACrBG,qBAAsBA,OAjBlBqC,EAmBA,MA7BHN,YAmCJ"}
1	+ {"version":3,"file":"AnalyticsMetric.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsMetric.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport React from 'react';\nimport { COLORS } from '@src/constants/Theme';\nimport { TitleMedium, TitleRegular } from '../TypographyStyle';\nimport { AnalyticsTrend, AnalyticsTrendInterface } from './AnalyticsTrend';\n\nconst TrendContainer = styled.div`\n\tdisplay: flex;\n\tflex-direction: row;\n\tflex-wrap: wrap;\n`;\n\nexport const AnalyticsMetric: React.FC<{\n\ttitle?: string;\n\tRightHeaderComponent?: React.ReactElement;\n\ttrends: AnalyticsTrendInterface[];\n\tcontainerStyle?: React.CSSProperties;\n\ttrendStyle?: React.CSSProperties;\n\ttrendContainerStyle?: React.CSSProperties;\n\ttrendIconStyle?: React.CSSProperties;\n\ttitleSize?: 'large' \| 'small';\n\ttitleColor?: string;\n\tperRow?: number;\n\tisLoading?: boolean;\n\thideHeaderDiv?: boolean;\n\trelativePercentageDiff?: number;\n\tisInternationalStore?: boolean;\n}> = ({\n\ttitle,\n\ttrends,\n\tRightHeaderComponent,\n\tcontainerStyle,\n\ttitleSize,\n\ttitleColor,\n\tperRow,\n\tisLoading,\n\ttrendStyle,\n\ttrendContainerStyle,\n\ttrendIconStyle,\n\thideHeaderDiv,\n\tisInternationalStore,\n}) => {\n\tconst Typo = titleSize === 'large' ? TitleMedium : TitleRegular;\n\tconst perRowLocal =\n\t\tperRow \|\|\n\t\t(trends.length <= 4 ? trends.length : trends.length % 3 == 0 ? 3 : 4);\n\tconst rows = Math.ceil(trends.length / perRowLocal);\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tpaddingTop: 24,\n\t\t\t\tpaddingBottom: 24,\n\t\t\t\t...(containerStyle ?? {}),\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\tpaddingBottom: hideHeaderDiv ? 0 : 12,\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{title && (\n\t\t\t\t\t<Typo\n\t\t\t\t\t\tcolor={titleColor ?? COLORS.content.secondary}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpaddingLeft: 24,\n\t\t\t\t\t\t\tpaddingRight: 24,\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{title}\n\t\t\t\t\t</Typo>\n\t\t\t\t)}\n\t\t\t\t{RightHeaderComponent}\n\t\t\t</div>\n\t\t\t<TrendContainer>\n\t\t\t\t{Array.from({ length: rows }).map((_, rowIndex) => (\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\tdisplay: 'flex',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tmarginTop: rowIndex === 0 ? 0 : 16,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\tkey={rowIndex}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{trends\n\t\t\t\t\t\t\t\t.slice(rowIndex * perRowLocal, (rowIndex + 1) * perRowLocal)\n\t\t\t\t\t\t\t\t.map((trend, i) => (\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\tflex: 1,\n\t\t\t\t\t\t\t\t\t\t\tmaxWidth: trends.length === 1 ? '100%' : '50%',\n\t\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<AnalyticsTrend\n\t\t\t\t\t\t\t\t\t\t\t{...trend}\n\t\t\t\t\t\t\t\t\t\t\tisLoading={isLoading}\n\t\t\t\t\t\t\t\t\t\t\tcard={false}\n\t\t\t\t\t\t\t\t\t\t\tsize={trend.size ?? 'small'}\n\t\t\t\t\t\t\t\t\t\t\trightSeparator={\n\t\t\t\t\t\t\t\t\t\t\t\ti + rowIndex * perRowLocal <\n\t\t\t\t\t\t\t\t\t\t\t\tMath.min(\n\t\t\t\t\t\t\t\t\t\t\t\t\t(rowIndex + 1) * perRowLocal - 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\ttrends.length - 1,\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}\n\t\t\t\t\t\t\t\t\t\t\ttrendStyle={trendStyle}\n\t\t\t\t\t\t\t\t\t\t\ttrendIconStyle={trendIconStyle}\n\t\t\t\t\t\t\t\t\t\t\ttrendContainerStyle={trendContainerStyle}\n\t\t\t\t\t\t\t\t\t\t\tisInternationalStore={isInternationalStore}\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</div>\n\t\t\t\t\t</>\n\t\t\t\t))}\n\t\t\t</TrendContainer>\n\t\t</div>\n\t);\n};\n\n/\n Card < 4 => x x x x x x x x x x\n Card % 3 =>\n x x x x x x x x x\n x x x x x\n x\n else perRow => 2\n x x x x x x\n x x x x x\n x\n else\n x x x x x x x x x x x x x x x\n x x x x x x\n/\n"],"names":["TrendContainer","process","env","NODE_ENV","target","label","_styled","name","styles","map","toString","_ref","title","trends","RightHeaderComponent","containerStyle","titleSize","titleColor","perRow","isLoading","trendStyle","trendContainerStyle","trendIconStyle","hideHeaderDiv","isInternationalStore","Typo","TitleMedium","TitleRegular","perRowLocal","length","rows","Math","ceil","_jsxs","Object","assign","style","paddingTop","paddingBottom","children","jsxs","display","flexDirection","justifyContent","_jsx","color","COLORS","content","secondary","paddingLeft","paddingRight","jsx","Array","from","_","rowIndex","_Fragment","width","marginTop","slice","trend","i","flex","maxWidth","AnalyticsTrend","card","size","_a","rightSeparator","min"],"mappings":"2TAMA,MAAMA,OAAc,QAAA,MAAA,eAAAC,QAAAC,IAAAC,SAAA,CAAAC,OAAA,aAAA,CAAAA,OAAA,YAAAC,MAAA,kBAAAC,CAAA,eAAAL,QAAAC,IAAAC,SAAA,CAAAI,KAAA,SAAAC,OAAA,kDAAA,CAAAD,KAAA,SAAAC,OAAA,iDAAAC,IAAA,kuIAAAC,uRAqBfC,IAcA,IAdCC,MACLA,EAAKC,OACLA,EAAMC,qBACNA,EAAoBC,eACpBA,EAAcC,UACdA,EAASC,WACTA,EAAUC,OACVA,EAAMC,UACNA,EAASC,WACTA,EAAUC,oBACVA,EAAmBC,eACnBA,EAAcC,cACdA,EAAaC,qBACbA,GACAb,EACA,MAAMc,EAAqB,UAAdT,EAAwBU,EAAAA,YAAcC,EAAAA,aAC7CC,EACLV,IACCL,EAAOgB,QAAU,EAAIhB,EAAOgB,OAAShB,EAAOgB,OAAS,GAAK,EAAI,EAAI,GAC9DC,EAAOC,KAAKC,KAAKnB,EAAOgB,OAASD,GAEvC,OACCK,OACC,MAAAC,OAAAC,OAAA,CAAAC,MACCF,OAAAC,OAAA,CAAAE,WAAY,GACZC,cAAe,IACXvB,QAAAA,EAAkB,KAAG,CAAAwB,SAAA,CAG1BN,EACCO,KAAA,MAAAN,OAAAC,OAAA,CAAAC,MAAO,CACNK,QAAS,OACTC,cAAe,MACfC,eAAgB,gBAChBL,cAAef,EAAgB,EAAI,KAGnC,CAAAgB,SAAA,CAAA3B,GACAgC,EAAAA,IAACnB,EACAS,OAAAC,OAAA,CAAAU,MAAO5B,QAAAA,EAAc6B,SAAOC,QAAQC,UACpCZ,MAAO,CACNa,YAAa,GACbC,aAAc,KACd,CAAAX,SAEA3B,KAGFE,MAEF8B,EAACO,IAAAnD,YACCoD,MAAMC,KAAK,CAAExB,OAAQC,IAAQrB,KAAI,CAAC6C,EAAGC,IACrCX,EAAAA,IACCY,EAAAA,SAAA,CAAAjB,SAAAK,EAAAO,IAAA,MAAAjB,OAAAC,OAAA,CACCC,MAAO,CACNK,QAAS,OACTgB,MAAO,OACPC,UAAwB,IAAbH,EAAiB,EAAI,KAChC,CAAAhB,SAGA1B,EACC8C,MAAMJ,EAAW3B,GAAc2B,EAAW,GAAK3B,GAC/CnB,KAAI,CAACmD,EAAOC,WAAM,OAClBjB,MACC,MAAAV,OAAAC,OAAA,CAAAC,MAAO,CACN0B,KAAM,EACNC,SAA4B,IAAlBlD,EAAOgB,OAAe,OAAS,QACzC,CAAAU,SAGDK,EAACO,IAAAa,EAAcA,eACV9B,OAAAC,OAAA,CAAA,EAAAyB,EACJ,CAAAzC,UAAWA,EACX8C,MAAM,EACNC,KAAgB,QAAVC,EAAAP,EAAMM,YAAI,IAAAC,EAAAA,EAAI,QACpBC,eACCP,EAAIN,EAAW3B,EACfG,KAAKsC,KACHd,EAAW,GAAK3B,EAAc,EAC/Bf,EAAOgB,OAAS,GAGlBT,WAAYA,EACZE,eAAgBA,EAChBD,oBAAqBA,EACrBG,qBAAsBA,OAjBlBqC,EAmBA,MA7BHN,YAmCJ"}

package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsMultiChip.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("./AnalyticsChip.js"),i=require("./CommonStyles.js");exports.AnalyticsMultiChip=({chipDetails:s,wrapperStyle:l})=>e.jsx(i.AnalyticsMultiWrapper,Object.assign({style:null!=l?l:{}},{children:s.map(((e,i)=>r.createElement(t.AnalyticsChip,Object.assign({},e,{key:i+"_chip"}))))}));
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("./AnalyticsChip.js"),i=require("./CommonStyles.js");exports.AnalyticsMultiChip=s=>{let{chipDetails:l,wrapperStyle:a}=s;return e.jsx(i.AnalyticsMultiWrapper,Object.assign({style:null!=a?a:{}},{children:l.map(((e,i)=>r.createElement(t.AnalyticsChip,Object.assign({},e,{key:i+"_chip"}))))}))};
 //# sourceMappingURL=AnalyticsMultiChip.js.map

package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsMultiChip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AnalyticsMultiChip.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsMultiChip.tsx"],"sourcesContent":["import React from 'react';\nimport { AnalyticsChip } from './AnalyticsChip';\nimport { AnalyticsChipInterface } from './AnalyticsChip.model';\nimport { AnalyticsMultiWrapper } from './CommonStyles';\n\nexport const AnalyticsMultiChip: React.FC<{\n\tchipDetails: AnalyticsChipInterface[];\n\twrapperStyle?: React.CSSProperties;\n}> = ({ chipDetails, wrapperStyle }) => {\n\treturn (\n\t\t<AnalyticsMultiWrapper style={wrapperStyle ?? {}}>\n\t\t\t{chipDetails.map((eachChip, index) => (\n\t\t\t\t<AnalyticsChip {...eachChip} key={index + '_chip'} />\n\t\t\t))}\n\t\t</AnalyticsMultiWrapper>\n\t);\n};\n"],"names":["~~AnalyticsMultiChip~~","chipDetails","wrapperStyle","_jsx","AnalyticsMultiWrapper","style","children","map","eachChip","index","_createElement","AnalyticsChip","key"],"mappings":"oNAQKA,~~EAAGC~~,~~cAAaC~~,~~kBAEnBC~~,MAACC,EAAAA,qCAAsBC,MAAOH,QAAAA,EAAgB,CAAE,GAAA,CAAAI,SAC9CL,EAAYM,KAAI,CAACC,EAAUC,IAC3BC,gBAACC,EAAAA,+BAAkBH,EAAQ,CAAEI,IAAKH,EAAQ"}
1	+ {"version":3,"file":"AnalyticsMultiChip.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsMultiChip.tsx"],"sourcesContent":["import React from 'react';\nimport { AnalyticsChip } from './AnalyticsChip';\nimport { AnalyticsChipInterface } from './AnalyticsChip.model';\nimport { AnalyticsMultiWrapper } from './CommonStyles';\n\nexport const AnalyticsMultiChip: React.FC<{\n\tchipDetails: AnalyticsChipInterface[];\n\twrapperStyle?: React.CSSProperties;\n}> = ({ chipDetails, wrapperStyle }) => {\n\treturn (\n\t\t<AnalyticsMultiWrapper style={wrapperStyle ?? {}}>\n\t\t\t{chipDetails.map((eachChip, index) => (\n\t\t\t\t<AnalyticsChip {...eachChip} key={index + '_chip'} />\n\t\t\t))}\n\t\t</AnalyticsMultiWrapper>\n\t);\n};\n"],"names":["_ref","chipDetails","wrapperStyle","_jsx","AnalyticsMultiWrapper","style","children","map","eachChip","index","_createElement","AnalyticsChip","key"],"mappings":"oNAQKA,IAAkC,IAAjCC,YAAEA,EAAWC,aAAEA,GAAcF,EAClC,OACCG,MAACC,EAAAA,qCAAsBC,MAAOH,QAAAA,EAAgB,CAAE,GAAA,CAAAI,SAC9CL,EAAYM,KAAI,CAACC,EAAUC,IAC3BC,gBAACC,EAAAA,+BAAkBH,EAAQ,CAAEI,IAAKH,EAAQ,eAEpB"}

package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsTrend.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../shimmer/ShimmerComponent/ShimmerStyled.js"),i=require("../../utils/DateUtils.js"),r=require("../../constants/Theme.js"),s=require("../../assets/icons/arrow_down.svg.js"),l=require("../../assets/icons/arrow_up.svg.js"),o=require("../../assets/icons/info.svg.js"),a=require("../tag/Tag.js"),c=require("../tooltips/Tooltip.js"),d=require("../TypographyStyle.js"),g=require("./chart/utils/calcPercentage.js"),u=require("./CommonStyles.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=h(t);const p=({percent:n,direction:o,timeline:a,customRange:u,trendRaw:h,trendRawString:m,prefixSymbol:p,trendIconStyle:y,isInternationalStore:j,tooltipTimelineText:x,customTimelineText:b})=>{const f=()=>{const e=((null!=h?h:0)>0?"+":"")+(null!=p?p:"");return void 0===h?"--":`${null!=e?e:""}${(()=>{let e="--";if(h)return e=String(j?g.truncateValueForInternationalStore(Math.abs(h)):g.truncateValueForIndianStore(Math.abs(h))),h<0?"-"+e:e})()}`},[S,O]=t.useState(f()),[T,v]=t.useState(b||"");t.useEffect((()=>{b||v("today"===a?"vs yesterday":"yesterday"===a?"vs 1 day before":"7 days"===a?"vs last 7 days":"30 days"===a?"vs last 30 days":"custom"===a&&u?i.default.getAnalyticsCustomDateTimelineText(u):"")}),[a,u]),t.useEffect((()=>{O(f())}),[h]);const C="negative"===o?s.default:l.default,R="negative"===o?r.COLORS.background.negative.vibrant:"positive"===o?r.COLORS.background.positive.vibrant:r.COLORS.content.placeholder;return e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof n&&e.jsx(C,{color:R,height:16,width:16,style:Object.assign({marginRight:2},null!=y?y:{})}),"number"==typeof n&&o&&e.jsxs(d.Caption,Object.assign({style:{color:R}},{children:["neutral"===o?0:n<1e3?n:">999","%"]})),!!h&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:`(${S})`})),!h&&((null==m?void 0:m.length)||0)>0&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:`${m}`})),a&&(x?e.jsx(c.Tooltip,Object.assign({body:x,placement:"bottom"},{children:e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:b||T}))})):e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:b||T})))]}))};exports.AnalyticsTrend=({title:t,value:i,trendPercent:s,type:l="horizontal",timeline:h,customRange:y,tooltip:j,card:x=!0,rightSeparator:b=!1,size:f="big",share:S=!1,formatVal:O,prefixSymbol:T,trailingIcon:v,onTrailIconClick:C,iconTooltipBody:R,funnelPercent:w,isLoading:I,trendRaw:$,trendRawString:L,suffixText:q,trendStyle:D,trendContainerStyle:F,trendIconStyle:M,containerStyle:k,prevTrendDiff:P,relativePercentageDiff:V,isInternationalStore:z,Icon:_,iconContainerStyle:A,tooltipTimelineText:E,customTimelineText:N})=>{const B="big"===f?d.TitleLarge:d.TitleMedium,W=void 0!==s?s<0?"negative":0===s?"neutral":"positive":void 0,U=void 0!==s?S?Math.round(s):Math.abs(Math.round(s)):void 0;return e.jsx(u.AnalyticsTrendContainer,Object.assign({card:x,style:Object.assign({},k)},{children:e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:_?12:4,borderRightWidth:b?1:0,borderRightColor:r.COLORS.stroke.primary,borderRightStyle:"solid",paddingLeft:x?0:24,paddingRight:x?0:24,height:"100%",justifyContent:_?"flex-start":"space-between",alignItems:"center"},null!=F?F:{})},{children:[!!_&&e.jsx(u.IconContainer,Object.assign({style:Object.assign({},A)},{children:e.jsx(_,{})})),e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"column",gap:4,height:"100%"},null!=D?D:{})},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e.jsx(d.BodyCaption,Object.assign({style:{color:r.COLORS.content.secondary}},{children:t})),j&&e.jsx(c.Tooltip,Object.assign({body:j,placement:"right",width:300},{children:e.jsx("div",Object.assign({style:{display:"flex",cursor:"pointer",height:"100%"}},{children:e.jsx(o.default,{color:r.COLORS.content.primary,height:16,width:16})}))}))]})),e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:12,alignItems:"center"},S?{justifyContent:"space-between"}:{})},{children:[I&&e.jsx(n.ShimmerComponentStyled,{width:108,height:26}),!I&&e.jsx(B,Object.assign({style:{color:r.COLORS.content.primary}},{children:void 0===i?"--":"number"==typeof i&&O?i>999?z?`${null!=T?T:""}${g.truncateValueForInternationalStore(i)} ${null!=q?q:""}`:`${null!=T?T:""}${g.truncateValueForIndianStore(i)} ${null!=q?q:""}`:`${null!=T?T:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(i)} ${null!=q?q:""}`:`${null!=T?T:""}${i} ${null!=q?q:""}`})),"number"==typeof V&&e.jsx(a.Tag,{tagText:`${V}%`,theme:"light",type:"neutral"}),"horizontal"===l&&!I&&!S&&e.jsx(p,{timeline:h,customRange:y,percent:U,direction:W,trendRaw:$,trendRawString:L,prefixSymbol:T,trendIconStyle:M,isInternationalStore:z,tooltipTimelineText:E,customTimelineText:N}),I&&!S&&"horizontal"===l&&e.jsx(n.ShimmerComponentStyled,{height:20,width:141,marginTop:6}),"vertical"===l&&!I&&void 0!==w&&e.jsx(a.Tag,{tagText:`${w} %`,theme:"light",type:"neutral"}),S&&!I&&void 0!==U&&e.jsx(a.Tag,{tagText:`${U} %`,theme:"light",type:"neutral"}),S||I||!P||0==P?e.jsx(e.Fragment,{}):e.jsx(a.Tag,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(P),theme:"light",type:"neutral"})]})),"vertical"===l&&!I&&!S&&e.jsx("div",Object.assign({style:{marginTop:10}},{children:e.jsx(p,{timeline:h,customRange:y,percent:U,direction:W,trendRaw:$,trendRawString:L,prefixSymbol:T,trendIconStyle:M,isInternationalStore:z,tooltipTimelineText:E,customTimelineText:N})})),I&&"vertical"===l&&e.jsx(n.ShimmerComponentStyled,{height:20,width:141,marginTop:6})]})),R&&!I&&e.jsx(c.Tooltip,Object.assign({body:R,placement:"right"},{children:v&&e.jsx("div",Object.assign({className:"icon--holder",onClick:C},{children:m.default.createElement(v,{height:20,width:20,color:r.COLORS.content.secondary})}))}))]}))}))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../shimmer/ShimmerComponent/ShimmerStyled.js"),i=require("../../utils/DateUtils.js"),r=require("../../constants/Theme.js"),l=require("../../assets/icons/arrow_down.svg.js"),s=require("../../assets/icons/arrow_up.svg.js"),o=require("../../assets/icons/info.svg.js"),a=require("../tag/Tag.js"),c=require("../tooltips/Tooltip.js"),d=require("../TypographyStyle.js"),g=require("./chart/utils/calcPercentage.js"),u=require("./CommonStyles.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var m=h(t);const p=n=>{let{percent:o,direction:a,timeline:u,customRange:h,trendRaw:m,trendRawString:p,prefixSymbol:y,trendIconStyle:j,isInternationalStore:x,tooltipTimelineText:b,customTimelineText:f}=n;const S=()=>{const e=((null!=m?m:0)>0?"+":"")+(null!=y?y:"");return void 0===m?"--":`${null!=e?e:""}${(()=>{let e="--";if(m)return e=String(x?g.truncateValueForInternationalStore(Math.abs(m)):g.truncateValueForIndianStore(Math.abs(m))),m<0?"-"+e:e})()}`},[O,T]=t.useState(S()),[v,C]=t.useState(f||"");t.useEffect((()=>{f||C("today"===u?"vs yesterday":"yesterday"===u?"vs 1 day before":"7 days"===u?"vs last 7 days":"30 days"===u?"vs last 30 days":"custom"===u&&h?i.default.getAnalyticsCustomDateTimelineText(h):"")}),[u,h]),t.useEffect((()=>{T(S())}),[m]);const R="negative"===a?l.default:s.default,w="negative"===a?r.COLORS.background.negative.vibrant:"positive"===a?r.COLORS.background.positive.vibrant:r.COLORS.content.placeholder;return e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof o&&e.jsx(R,{color:w,height:16,width:16,style:Object.assign({marginRight:2},null!=j?j:{})}),"number"==typeof o&&a&&e.jsxs(d.Caption,Object.assign({style:{color:w}},{children:["neutral"===a?0:o<1e3?o:">999","%"]})),!!m&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:`(${O})`})),!m&&((null==p?void 0:p.length)||0)>0&&e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:`${p}`})),u&&(b?e.jsx(c.Tooltip,Object.assign({body:b,placement:"bottom"},{children:e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:f||v}))})):e.jsx(d.Caption,Object.assign({style:{marginLeft:4,color:r.COLORS.content.placeholder}},{children:f||v})))]}))};exports.AnalyticsTrend=t=>{let{title:i,value:l,trendPercent:s,type:h="horizontal",timeline:y,customRange:j,tooltip:x,card:b=!0,rightSeparator:f=!1,size:S="big",share:O=!1,formatVal:T,prefixSymbol:v,trailingIcon:C,onTrailIconClick:R,iconTooltipBody:w,funnelPercent:I,isLoading:$,trendRaw:L,trendRawString:q,suffixText:D,trendStyle:F,trendContainerStyle:M,trendIconStyle:k,containerStyle:P,prevTrendDiff:V,relativePercentageDiff:z,isInternationalStore:_,Icon:A,iconContainerStyle:E,tooltipTimelineText:N,customTimelineText:B}=t;const W="big"===S?d.TitleLarge:d.TitleMedium,U=void 0!==s?s<0?"negative":0===s?"neutral":"positive":void 0,G=void 0!==s?O?Math.round(s):Math.abs(Math.round(s)):void 0;return e.jsx(u.AnalyticsTrendContainer,Object.assign({card:b,style:Object.assign({},P)},{children:e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:A?12:4,borderRightWidth:f?1:0,borderRightColor:r.COLORS.stroke.primary,borderRightStyle:"solid",paddingLeft:b?0:24,paddingRight:b?0:24,height:"100%",justifyContent:A?"flex-start":"space-between",alignItems:"center"},null!=M?M:{})},{children:[!!A&&e.jsx(u.IconContainer,Object.assign({style:Object.assign({},E)},{children:e.jsx(A,{})})),e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"column",gap:4,height:"100%"},null!=F?F:{})},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e.jsx(d.BodyCaption,Object.assign({style:{color:r.COLORS.content.secondary}},{children:i})),x&&e.jsx(c.Tooltip,Object.assign({body:x,placement:"right",width:300},{children:e.jsx("div",Object.assign({style:{display:"flex",cursor:"pointer",height:"100%"}},{children:e.jsx(o.default,{color:r.COLORS.content.primary,height:16,width:16})}))}))]})),e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:12,alignItems:"center"},O?{justifyContent:"space-between"}:{})},{children:[$&&e.jsx(n.ShimmerComponentStyled,{width:108,height:26}),!$&&e.jsx(W,Object.assign({style:{color:r.COLORS.content.primary}},{children:void 0===l?"--":"number"==typeof l&&T?l>999?_?`${null!=v?v:""}${g.truncateValueForInternationalStore(l)} ${null!=D?D:""}`:`${null!=v?v:""}${g.truncateValueForIndianStore(l)} ${null!=D?D:""}`:`${null!=v?v:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(l)} ${null!=D?D:""}`:`${null!=v?v:""}${l} ${null!=D?D:""}`})),"number"==typeof z&&e.jsx(a.Tag,{tagText:`${z}%`,theme:"light",type:"neutral"}),"horizontal"===h&&!$&&!O&&e.jsx(p,{timeline:y,customRange:j,percent:G,direction:U,trendRaw:L,trendRawString:q,prefixSymbol:v,trendIconStyle:k,isInternationalStore:_,tooltipTimelineText:N,customTimelineText:B}),$&&!O&&"horizontal"===h&&e.jsx(n.ShimmerComponentStyled,{height:20,width:141,marginTop:6}),"vertical"===h&&!$&&void 0!==I&&e.jsx(a.Tag,{tagText:`${I} %`,theme:"light",type:"neutral"}),O&&!$&&void 0!==G&&e.jsx(a.Tag,{tagText:`${G} %`,theme:"light",type:"neutral"}),O||$||!V||0==V?e.jsx(e.Fragment,{}):e.jsx(a.Tag,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(V),theme:"light",type:"neutral"})]})),"vertical"===h&&!$&&!O&&e.jsx("div",Object.assign({style:{marginTop:10}},{children:e.jsx(p,{timeline:y,customRange:j,percent:G,direction:U,trendRaw:L,trendRawString:q,prefixSymbol:v,trendIconStyle:k,isInternationalStore:_,tooltipTimelineText:N,customTimelineText:B})})),$&&"vertical"===h&&e.jsx(n.ShimmerComponentStyled,{height:20,width:141,marginTop:6})]})),w&&!$&&e.jsx(c.Tooltip,Object.assign({body:w,placement:"right"},{children:C&&e.jsx("div",Object.assign({className:"icon--holder",onClick:R},{children:m.default.createElement(C,{height:20,width:20,color:r.COLORS.content.secondary})}))}))]}))}))};
 //# sourceMappingURL=AnalyticsTrend.js.map