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

@bikdotai/bik-component-library 0.0.859-beta.0 → 0.0.859-beta.1

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 (54) hide show

package/dist/cjs/components/agent-listing/AgentTableRow.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("../../assets/icons/delete.svg.js"),O=require("../../assets/icons/edit.svg.js"),S=require("../../assets/icons/playOutline.svg.js"),f=require("../../assets/icons/vertical_dots.svg.js"),C=require("../dropdown/DropdownPopover/index.js"),T=require("../shimmer/ShimmerComponent/BikShimmer.js"),r=require("../TypographyStyle.js"),g=require("../../utils/StringUtils.js"),i=require("../../constants/Theme.js"),n=require("./AgentListing.styled.js"),u=require("../tooltips/Tooltip.js"),R=require("../tag/Tag.js"),L=require("../dropdown/utils.js"),w=t=>{switch(t.kind){case"topic":return`Topic: ${g.default.capitalize((t.label??"").replace(/_/g," "))}`;case"phrases":return t.items?.length?`Phrases: ${t.items.join(", ")}`:"Phrases";default:return t.label??""}},q=({agent:t,onRunAgent:p,onEditAgent:h,onDeleteAgent:s,onRowClick:l,triggerCountLoading:x})=>{const c=t.status==="live",a=w(t.trigger),y=o=>{o.stopPropagation(),!t.isRunDisabled&&p(t)},m=[{label:"Edit",value:"edit",leadingIcon:e.jsx(O.default,{width:16,height:16,color:i.COLORS.content.secondary})},...s?[{label:"Delete",value:"delete",customComponent:e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8,color:i.COLORS.content.negative,fontFamily:"Inter",fontSize:14},children:[e.jsx(b.default,{width:16,height:16,color:i.COLORS.content.negative}),"Delete"]})}]:[]],j=o=>{o==="edit"?h(t):o==="delete"&&s?.(t)},d=e.jsx(n.ActionButton,{"data-test":`agent-row-run-${t.id}`,disabled:t.isRunDisabled,onClick:y,"aria-label":"Run agent",children:e.jsx(S.default,{width:20,height:20,color:i.COLORS.content.secondary})});return e.jsxs(n.BodyGridRow,{"data-test":`agent-row-${t.id}`,clickable:!!l,onClick:l?()=>l(t):void 0,children:[e.jsxs(n.Cell,{children:[e.jsx(r.TitleSmall,{numberOfLines:1,color:i.COLORS.content.primary,children:t.name}),e.jsxs(r.BodyCaption,{numberOfLines:1,color:i.COLORS.content.secondary,children:["Created: ",t.createdAtLabel]})]}),e.jsx(n.Cell,{children:e.jsx(u.Tooltip,{body:a,placement:"top",children:e.jsx(r.BodySecondary,{numberOfLines:2,color:i.COLORS.content.primary,children:a})})}),e.jsx(n.Cell,{align:"right",children:x?e.jsx(T.BikShimmer,{boxes:[{width:"48px",height:"16px",borderRadius:"4px",marginTop:"0"}]}):e.jsx(r.BodySecondary,{color:i.COLORS.content.primary,children:t.triggerCount})}),e.jsx(n.Cell,{children:e.jsx(R.Tag,{tagText:c?"Live":"Draft",type:c?"positive":"neutral",variant:"regular"})}),e.jsx(n.Cell,{align:"center",children:e.jsxs(n.ActionGroup,{children:[t.isRunDisabled&&t.runDisabledTooltip?e.jsx(u.Tooltip,{body:t.runDisabledTooltip,placement:"top",children:e.jsx("span",{style:{display:"flex"},children:d})}):d,e.jsx("span",{style:{display:"flex"},onClick:o=>o.stopPropagation(),children:e.jsx(C.DropdownPopover,{"data-test":`agent-row-menu-${t.id}`,options:m,placement:"bottom-end",width:"160px",onSelect:o=>j(L.unwrapDropdownValue(o)),children:e.jsx(n.ActionButton,{"data-test":`agent-row-menu-button-${t.id}`,"aria-label":"More actions",children:e.jsx(f.default,{width:20,height:20,color:i.COLORS.content.secondary})})})})]})})]})};exports.AgentTableRow=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("../../assets/icons/delete.svg.js"),O=require("../../assets/icons/edit.svg.js"),f=require("../../assets/icons/info.svg.js"),S=require("../../assets/icons/playOutline.svg.js"),g=require("../../assets/icons/vertical_dots.svg.js"),C=require("../dropdown/DropdownPopover/index.js"),T=require("../shimmer/ShimmerComponent/BikShimmer.js"),l=require("../TypographyStyle.js"),R=require("../../utils/StringUtils.js"),i=require("../../constants/Theme.js"),n=require("./AgentListing.styled.js"),s=require("../tooltips/Tooltip.js"),L=require("../tag/Tag.js"),w=require("../dropdown/utils.js"),q=t=>{switch(t.kind){case"topic":return`Topic: ${R.default.capitalize((t.label??"").replace(/_/g," "))}`;case"phrases":return t.items?.length?`Phrases: ${t.items.join(", ")}`:"Phrases";default:return t.label??""}},v=({agent:t,onRunAgent:p,onEditAgent:h,onDeleteAgent:c,onRowClick:r,triggerCountLoading:x})=>{const d=t.status==="live",a=q(t.trigger),y=o=>{o.stopPropagation(),!t.isRunDisabled&&p(t)},m=[{label:"Edit",value:"edit",leadingIcon:e.jsx(O.default,{width:16,height:16,color:i.COLORS.content.secondary})},...c?[{label:"Delete",value:"delete",customComponent:e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8,color:i.COLORS.content.negative,fontFamily:"Inter",fontSize:14},children:[e.jsx(b.default,{width:16,height:16,color:i.COLORS.content.negative}),"Delete"]})}]:[]],j=o=>{o==="edit"?h(t):o==="delete"&&c?.(t)},u=e.jsx(n.ActionButton,{"data-test":`agent-row-run-${t.id}`,disabled:t.isRunDisabled,onClick:y,"aria-label":"Run agent",children:e.jsx(S.default,{width:20,height:20,color:i.COLORS.content.secondary})});return e.jsxs(n.BodyGridRow,{"data-test":`agent-row-${t.id}`,clickable:!!r,onClick:r?()=>r(t):void 0,children:[e.jsxs(n.Cell,{children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:8,minWidth:0},children:[e.jsx(l.TitleSmall,{numberOfLines:1,color:i.COLORS.content.primary,children:t.name}),t.sourceBadge?e.jsx(s.Tooltip,{body:t.sourceBadge,placement:"top",children:e.jsx("span",{style:{display:"flex",flexShrink:0,cursor:"help"},"aria-label":"Agent source",children:e.jsx(f.default,{width:16,height:16,color:i.COLORS.content.secondary})})}):null]}),e.jsxs(l.BodyCaption,{numberOfLines:1,color:i.COLORS.content.secondary,children:["Created: ",t.createdAtLabel]})]}),e.jsx(n.Cell,{children:e.jsx(s.Tooltip,{body:a,placement:"top",children:e.jsx(l.BodySecondary,{numberOfLines:2,color:i.COLORS.content.primary,children:a})})}),e.jsx(n.Cell,{align:"right",children:x?e.jsx(T.BikShimmer,{boxes:[{width:"48px",height:"16px",borderRadius:"4px",marginTop:"0"}]}):e.jsx(l.BodySecondary,{color:i.COLORS.content.primary,children:t.triggerCount})}),e.jsx(n.Cell,{children:e.jsx(L.Tag,{tagText:d?"Live":"Draft",type:d?"positive":"neutral",variant:"regular"})}),e.jsx(n.Cell,{align:"center",children:e.jsxs(n.ActionGroup,{children:[t.isRunDisabled&&t.runDisabledTooltip?e.jsx(s.Tooltip,{body:t.runDisabledTooltip,placement:"top",children:e.jsx("span",{style:{display:"flex"},children:u})}):u,e.jsx("span",{style:{display:"flex"},onClick:o=>o.stopPropagation(),children:e.jsx(C.DropdownPopover,{"data-test":`agent-row-menu-${t.id}`,options:m,placement:"bottom-end",width:"160px",onSelect:o=>j(w.unwrapDropdownValue(o)),children:e.jsx(n.ActionButton,{"data-test":`agent-row-menu-button-${t.id}`,"aria-label":"More actions",children:e.jsx(g.default,{width:20,height:20,color:i.COLORS.content.secondary})})})})]})})]})};exports.AgentTableRow=v;
 //# sourceMappingURL=AgentTableRow.js.map

package/dist/cjs/components/agent-listing/AgentTableRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"AgentTableRow.js","sources":["../../../../src/components/agent-listing/AgentTableRow.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport EditIcon from '@src/assets/icons/edit.svg';\nimport PlayOutlineIcon from '@src/assets/icons/playOutline.svg';\nimport MoreIcon from '@src/assets/icons/vertical_dots.svg';\nimport React from 'react';\nimport { unwrapDropdownValue } from '@src/components/dropdown';\nimport { DropdownPopover } from '@src/components/dropdown/DropdownPopover';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport BikShimmer from '@src/components/shimmer/ShimmerComponent/BikShimmer';\nimport { Tag } from '@src/components/tag';\nimport { Tooltip } from '@src/components/tooltips';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport StringUtils from '@src/utils/StringUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport { AgentListItem, AgentTriggerSummary } from './AgentListing.model';\nimport {\n\tActionButton,\n\tActionGroup,\n\tBodyGridRow,\n\tCell,\n} from './AgentListing.styled';\n\nconst triggerToText = (trigger: AgentTriggerSummary): string => {\n\tswitch (trigger.kind) {\n\t\tcase 'topic':\n\t\t\t// Intent keys arrive snake_cased (e.g. \"order_cancellation\"); show them\n\t\t\t// space-separated and sentence-cased (first letter capital) so the\n\t\t\t// trigger reads as plain words, not a raw key.\n\t\t\treturn `Topic: ${StringUtils.capitalize(\n\t\t\t\t(trigger.label ?? '').replace(/_/g, ' '),\n\t\t\t)}`;\n\t\tcase 'phrases':\n\t\t\t// No enumerable phrase list (free-text trigger) → just the word.\n\t\t\treturn trigger.items?.length\n\t\t\t\t? `Phrases: ${trigger.items.join(', ')}`\n\t\t\t\t: 'Phrases';\n\t\tcase 'custom':\n\t\tdefault:\n\t\t\treturn trigger.label ?? '';\n\t}\n};\n\ninterface AgentTableRowProps {\n\tagent: AgentListItem;\n\tonRunAgent: (agent: AgentListItem) => void;\n\tonEditAgent: (agent: AgentListItem) => void;\n\t/** When set, render a delete action (the listing handles confirmation). /\n\tonDeleteAgent?: (agent: AgentListItem) => void;\n\tonRowClick?: (agent: AgentListItem) => void;\n\t/* Shimmer the trigger-count cell while the analytics count is still loading. /\n\ttriggerCountLoading?: boolean;\n}\n\nexport const AgentTableRow: React.FC<AgentTableRowProps> = ({\n\tagent,\n\tonRunAgent,\n\tonEditAgent,\n\tonDeleteAgent,\n\tonRowClick,\n\ttriggerCountLoading,\n}) => {\n\tconst isLive = agent.status === 'live';\n\tconst triggerText = triggerToText(agent.trigger);\n\n\tconst handleRun = (e: React.MouseEvent) => {\n\t\te.stopPropagation();\n\t\tif (agent.isRunDisabled) {\n\t\t\treturn;\n\t\t}\n\t\tonRunAgent(agent);\n\t};\n\n\t// Edit + Delete live in the \"⋮\" menu beside the run button.\n\tconst menuOptions: SingleOption[] = [\n\t\t{\n\t\t\tlabel: 'Edit',\n\t\t\tvalue: 'edit',\n\t\t\tleadingIcon: (\n\t\t\t\t<EditIcon width={16} height={16} color={COLORS.content.secondary} />\n\t\t\t),\n\t\t},\n\t\t...(onDeleteAgent\n\t\t\t? [\n\t\t\t\t\t{\n\t\t\t\t\t\tlabel: 'Delete',\n\t\t\t\t\t\tvalue: 'delete',\n\t\t\t\t\t\t// Rendered red (icon + label) via customComponent.\n\t\t\t\t\t\tcustomComponent: (\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\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tgap: 8,\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.negative,\n\t\t\t\t\t\t\t\t\tfontFamily: 'Inter',\n\t\t\t\t\t\t\t\t\tfontSize: 14,\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<DeleteIcon\n\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.negative}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\tDelete\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t),\n\t\t\t\t\t},\n\t\t\t ]\n\t\t\t: []),\n\t];\n\n\tconst handleMenuSelect = (value: string \| undefined) => {\n\t\tif (value === 'edit') {\n\t\t\tonEditAgent(agent);\n\t\t} else if (value === 'delete') {\n\t\t\tonDeleteAgent?.(agent);\n\t\t}\n\t};\n\n\tconst playButton = (\n\t\t<ActionButton\n\t\t\tdata-test={`agent-row-run-${agent.id}`}\n\t\t\tdisabled={agent.isRunDisabled}\n\t\t\tonClick={handleRun}\n\t\t\taria-label=\"Run agent\"\n\t\t>\n\t\t\t<PlayOutlineIcon\n\t\t\t\twidth={20}\n\t\t\t\theight={20}\n\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t/>\n\t\t</ActionButton>\n\t);\n\n\treturn (\n\t\t<BodyGridRow\n\t\t\tdata-test={`agent-row-${agent.id}`}\n\t\t\tclickable={!!onRowClick}\n\t\t\tonClick={onRowClick ? () => onRowClick(agent) : undefined}\n\t\t>\n\t\t\t<Cell>\n\t\t\t\t<TitleSmall numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t{agent.name}\n\t\t\t\t</TitleSmall>\n\t\t\t\t<BodyCaption numberOfLines={1} color={COLORS.content.secondary}>\n\t\t\t\t\tCreated: {agent.createdAtLabel}\n\t\t\t\t</BodyCaption>\n\t\t\t</Cell>\n\n\t\t\t<Cell>\n\t\t\t\t{/ Cell truncates to 2 lines; the tooltip reveals the full trigger. /}\n\t\t\t\t<Tooltip body={triggerText} placement=\"top\">\n\t\t\t\t\t<BodySecondary numberOfLines={2} color={COLORS.content.primary}>\n\t\t\t\t\t\t{triggerText}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</Tooltip>\n\t\t\t</Cell>\n\n\t\t\t<Cell align=\"right\">\n\t\t\t\t{triggerCountLoading ? (\n\t\t\t\t\t<BikShimmer\n\t\t\t\t\t\tboxes={[\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\twidth: '48px',\n\t\t\t\t\t\t\t\theight: '16px',\n\t\t\t\t\t\t\t\tborderRadius: '4px',\n\t\t\t\t\t\t\t\tmarginTop: '0',\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t]}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t{agent.triggerCount}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t)}\n\t\t\t</Cell>\n\n\t\t\t<Cell>\n\t\t\t\t<Tag\n\t\t\t\t\ttagText={isLive ? 'Live' : 'Draft'}\n\t\t\t\t\ttype={isLive ? 'positive' : 'neutral'}\n\t\t\t\t\tvariant=\"regular\"\n\t\t\t\t/>\n\t\t\t</Cell>\n\n\t\t\t<Cell align=\"center\">\n\t\t\t\t<ActionGroup>\n\t\t\t\t\t{agent.isRunDisabled && agent.runDisabledTooltip ? (\n\t\t\t\t\t\t<Tooltip body={agent.runDisabledTooltip} placement=\"top\">\n\t\t\t\t\t\t\t<span style={{ display: 'flex' }}>{playButton}</span>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\tplayButton\n\t\t\t\t\t)}\n\t\t\t\t\t{/ Stop the row's onClick from firing when interacting with the menu. */}\n\t\t\t\t\t<span\n\t\t\t\t\t\tstyle={{ display: 'flex' }}\n\t\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownPopover\n\t\t\t\t\t\t\tdata-test={`agent-row-menu-${agent.id}`}\n\t\t\t\t\t\t\toptions={menuOptions}\n\t\t\t\t\t\t\tplacement=\"bottom-end\"\n\t\t\t\t\t\t\twidth=\"160px\"\n\t\t\t\t\t\t\tonSelect={(opt) => handleMenuSelect(unwrapDropdownValue(opt))}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ActionButton\n\t\t\t\t\t\t\t\tdata-test={`agent-row-menu-button-${agent.id}`}\n\t\t\t\t\t\t\t\taria-label=\"More actions\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<MoreIcon\n\t\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ActionButton>\n\t\t\t\t\t\t</DropdownPopover>\n\t\t\t\t\t</span>\n\t\t\t\t</ActionGroup>\n\t\t\t</Cell>\n\t\t</BodyGridRow>\n\t);\n};\n"],"names":["triggerToText","trigger","StringUtils","AgentTableRow","agent","onRunAgent","onEditAgent","onDeleteAgent","onRowClick","triggerCountLoading","isLive","triggerText","handleRun","e","menuOptions","jsx","EditIcon","COLORS","jsxs","DeleteIcon","handleMenuSelect","value","playButton","ActionButton","PlayOutlineIcon","BodyGridRow","Cell","TitleSmall","BodyCaption","Tooltip","BodySecondary","BikShimmer","Tag","ActionGroup","DropdownPopover","opt","unwrapDropdownValue","MoreIcon"],"mappings":"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"}
1	+ {"version":3,"file":"AgentTableRow.js","sources":["../../../../src/components/agent-listing/AgentTableRow.tsx"],"sourcesContent":["import DeleteIcon from '@src/assets/icons/delete.svg';\nimport EditIcon from '@src/assets/icons/edit.svg';\nimport InfoIcon from '@src/assets/icons/info.svg';\nimport PlayOutlineIcon from '@src/assets/icons/playOutline.svg';\nimport MoreIcon from '@src/assets/icons/vertical_dots.svg';\nimport React from 'react';\nimport { unwrapDropdownValue } from '@src/components/dropdown';\nimport { DropdownPopover } from '@src/components/dropdown/DropdownPopover';\nimport { SingleOption } from '@src/components/dropdown/type';\nimport BikShimmer from '@src/components/shimmer/ShimmerComponent/BikShimmer';\nimport { Tag } from '@src/components/tag';\nimport { Tooltip } from '@src/components/tooltips';\nimport {\n\tBodyCaption,\n\tBodySecondary,\n\tTitleSmall,\n} from '@src/components/TypographyStyle';\nimport StringUtils from '@src/utils/StringUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport { AgentListItem, AgentTriggerSummary } from './AgentListing.model';\nimport {\n\tActionButton,\n\tActionGroup,\n\tBodyGridRow,\n\tCell,\n} from './AgentListing.styled';\n\nconst triggerToText = (trigger: AgentTriggerSummary): string => {\n\tswitch (trigger.kind) {\n\t\tcase 'topic':\n\t\t\t// Intent keys arrive snake_cased (e.g. \"order_cancellation\"); show them\n\t\t\t// space-separated and sentence-cased (first letter capital) so the\n\t\t\t// trigger reads as plain words, not a raw key.\n\t\t\treturn `Topic: ${StringUtils.capitalize(\n\t\t\t\t(trigger.label ?? '').replace(/_/g, ' '),\n\t\t\t)}`;\n\t\tcase 'phrases':\n\t\t\t// No enumerable phrase list (free-text trigger) → just the word.\n\t\t\treturn trigger.items?.length\n\t\t\t\t? `Phrases: ${trigger.items.join(', ')}`\n\t\t\t\t: 'Phrases';\n\t\tcase 'custom':\n\t\tdefault:\n\t\t\treturn trigger.label ?? '';\n\t}\n};\n\ninterface AgentTableRowProps {\n\tagent: AgentListItem;\n\tonRunAgent: (agent: AgentListItem) => void;\n\tonEditAgent: (agent: AgentListItem) => void;\n\t/** When set, render a delete action (the listing handles confirmation). /\n\tonDeleteAgent?: (agent: AgentListItem) => void;\n\tonRowClick?: (agent: AgentListItem) => void;\n\t/* Shimmer the trigger-count cell while the analytics count is still loading. /\n\ttriggerCountLoading?: boolean;\n}\n\nexport const AgentTableRow: React.FC<AgentTableRowProps> = ({\n\tagent,\n\tonRunAgent,\n\tonEditAgent,\n\tonDeleteAgent,\n\tonRowClick,\n\ttriggerCountLoading,\n}) => {\n\tconst isLive = agent.status === 'live';\n\tconst triggerText = triggerToText(agent.trigger);\n\n\tconst handleRun = (e: React.MouseEvent) => {\n\t\te.stopPropagation();\n\t\tif (agent.isRunDisabled) {\n\t\t\treturn;\n\t\t}\n\t\tonRunAgent(agent);\n\t};\n\n\t// Edit + Delete live in the \"⋮\" menu beside the run button.\n\tconst menuOptions: SingleOption[] = [\n\t\t{\n\t\t\tlabel: 'Edit',\n\t\t\tvalue: 'edit',\n\t\t\tleadingIcon: (\n\t\t\t\t<EditIcon width={16} height={16} color={COLORS.content.secondary} />\n\t\t\t),\n\t\t},\n\t\t...(onDeleteAgent\n\t\t\t? [\n\t\t\t\t\t{\n\t\t\t\t\t\tlabel: 'Delete',\n\t\t\t\t\t\tvalue: 'delete',\n\t\t\t\t\t\t// Rendered red (icon + label) via customComponent.\n\t\t\t\t\t\tcustomComponent: (\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\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\t\tgap: 8,\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.negative,\n\t\t\t\t\t\t\t\t\tfontFamily: 'Inter',\n\t\t\t\t\t\t\t\t\tfontSize: 14,\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<DeleteIcon\n\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.negative}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\tDelete\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t),\n\t\t\t\t\t},\n\t\t\t ]\n\t\t\t: []),\n\t];\n\n\tconst handleMenuSelect = (value: string \| undefined) => {\n\t\tif (value === 'edit') {\n\t\t\tonEditAgent(agent);\n\t\t} else if (value === 'delete') {\n\t\t\tonDeleteAgent?.(agent);\n\t\t}\n\t};\n\n\tconst playButton = (\n\t\t<ActionButton\n\t\t\tdata-test={`agent-row-run-${agent.id}`}\n\t\t\tdisabled={agent.isRunDisabled}\n\t\t\tonClick={handleRun}\n\t\t\taria-label=\"Run agent\"\n\t\t>\n\t\t\t<PlayOutlineIcon\n\t\t\t\twidth={20}\n\t\t\t\theight={20}\n\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t/>\n\t\t</ActionButton>\n\t);\n\n\treturn (\n\t\t<BodyGridRow\n\t\t\tdata-test={`agent-row-${agent.id}`}\n\t\t\tclickable={!!onRowClick}\n\t\t\tonClick={onRowClick ? () => onRowClick(agent) : undefined}\n\t\t>\n\t\t\t<Cell>\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\talignItems: 'center',\n\t\t\t\t\t\tgap: 8,\n\t\t\t\t\t\tminWidth: 0,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<TitleSmall numberOfLines={1} color={COLORS.content.primary}>\n\t\t\t\t\t\t{agent.name}\n\t\t\t\t\t</TitleSmall>\n\t\t\t\t\t{/ Provenance: an info icon beside the name reveals where this\n\t\t\t\t\t agent was copied from (source store + agent, or the agent\n\t\t\t\t\t library). Consumer's doc→row mapper builds the tooltip text. /}\n\t\t\t\t\t{agent.sourceBadge ? (\n\t\t\t\t\t\t<Tooltip body={agent.sourceBadge} placement=\"top\">\n\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\tflexShrink: 0,\n\t\t\t\t\t\t\t\t\tcursor: 'help',\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\taria-label=\"Agent source\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<InfoIcon\n\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t\t<BodyCaption numberOfLines={1} color={COLORS.content.secondary}>\n\t\t\t\t\tCreated: {agent.createdAtLabel}\n\t\t\t\t</BodyCaption>\n\t\t\t</Cell>\n\n\t\t\t<Cell>\n\t\t\t\t{/ Cell truncates to 2 lines; the tooltip reveals the full trigger. /}\n\t\t\t\t<Tooltip body={triggerText} placement=\"top\">\n\t\t\t\t\t<BodySecondary numberOfLines={2} color={COLORS.content.primary}>\n\t\t\t\t\t\t{triggerText}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t</Tooltip>\n\t\t\t</Cell>\n\n\t\t\t<Cell align=\"right\">\n\t\t\t\t{triggerCountLoading ? (\n\t\t\t\t\t<BikShimmer\n\t\t\t\t\t\tboxes={[\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\twidth: '48px',\n\t\t\t\t\t\t\t\theight: '16px',\n\t\t\t\t\t\t\t\tborderRadius: '4px',\n\t\t\t\t\t\t\t\tmarginTop: '0',\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t]}\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<BodySecondary color={COLORS.content.primary}>\n\t\t\t\t\t\t{agent.triggerCount}\n\t\t\t\t\t</BodySecondary>\n\t\t\t\t)}\n\t\t\t</Cell>\n\n\t\t\t<Cell>\n\t\t\t\t<Tag\n\t\t\t\t\ttagText={isLive ? 'Live' : 'Draft'}\n\t\t\t\t\ttype={isLive ? 'positive' : 'neutral'}\n\t\t\t\t\tvariant=\"regular\"\n\t\t\t\t/>\n\t\t\t</Cell>\n\n\t\t\t<Cell align=\"center\">\n\t\t\t\t<ActionGroup>\n\t\t\t\t\t{agent.isRunDisabled && agent.runDisabledTooltip ? (\n\t\t\t\t\t\t<Tooltip body={agent.runDisabledTooltip} placement=\"top\">\n\t\t\t\t\t\t\t<span style={{ display: 'flex' }}>{playButton}</span>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t) : (\n\t\t\t\t\t\tplayButton\n\t\t\t\t\t)}\n\t\t\t\t\t{/ Stop the row's onClick from firing when interacting with the menu. */}\n\t\t\t\t\t<span\n\t\t\t\t\t\tstyle={{ display: 'flex' }}\n\t\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DropdownPopover\n\t\t\t\t\t\t\tdata-test={`agent-row-menu-${agent.id}`}\n\t\t\t\t\t\t\toptions={menuOptions}\n\t\t\t\t\t\t\tplacement=\"bottom-end\"\n\t\t\t\t\t\t\twidth=\"160px\"\n\t\t\t\t\t\t\tonSelect={(opt) => handleMenuSelect(unwrapDropdownValue(opt))}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<ActionButton\n\t\t\t\t\t\t\t\tdata-test={`agent-row-menu-button-${agent.id}`}\n\t\t\t\t\t\t\t\taria-label=\"More actions\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<MoreIcon\n\t\t\t\t\t\t\t\t\twidth={20}\n\t\t\t\t\t\t\t\t\theight={20}\n\t\t\t\t\t\t\t\t\tcolor={COLORS.content.secondary}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</ActionButton>\n\t\t\t\t\t\t</DropdownPopover>\n\t\t\t\t\t</span>\n\t\t\t\t</ActionGroup>\n\t\t\t</Cell>\n\t\t</BodyGridRow>\n\t);\n};\n"],"names":["triggerToText","trigger","StringUtils","AgentTableRow","agent","onRunAgent","onEditAgent","onDeleteAgent","onRowClick","triggerCountLoading","isLive","triggerText","handleRun","e","menuOptions","jsx","EditIcon","COLORS","jsxs","DeleteIcon","handleMenuSelect","value","playButton","ActionButton","PlayOutlineIcon","BodyGridRow","Cell","TitleSmall","Tooltip","InfoIcon","BodyCaption","BodySecondary","BikShimmer","Tag","ActionGroup","DropdownPopover","opt","unwrapDropdownValue","MoreIcon"],"mappings":"osBA2BMA,EAAiBC,GAAyC,CAC/D,OAAQA,EAAQ,KAAA,CACf,IAAK,QAIJ,MAAO,UAAUC,EAAAA,QAAY,YAC3BD,EAAQ,OAAS,IAAI,QAAQ,KAAM,GAAG,CAAA,CACvC,GACF,IAAK,UAEJ,OAAOA,EAAQ,OAAO,OACnB,YAAYA,EAAQ,MAAM,KAAK,IAAI,CAAC,GACpC,UAEJ,QACC,OAAOA,EAAQ,OAAS,EAAA,CAE3B,EAaaE,EAA8C,CAAC,CAC3D,MAAAC,EACA,WAAAC,EACA,YAAAC,EACA,cAAAC,EACA,WAAAC,EACA,oBAAAC,CACD,IAAM,CACL,MAAMC,EAASN,EAAM,SAAW,OAC1BO,EAAcX,EAAcI,EAAM,OAAO,EAEzCQ,EAAaC,GAAwB,CAC1CA,EAAE,gBAAA,EACE,CAAAT,EAAM,eAGVC,EAAWD,CAAK,CACjB,EAGMU,EAA8B,CACnC,CACC,MAAO,OACP,MAAO,OACP,YACCC,EAAAA,IAACC,UAAA,CAAS,MAAO,GAAI,OAAQ,GAAI,MAAOC,SAAO,QAAQ,SAAA,CAAW,CAAA,EAGpE,GAAIV,EACD,CACA,CACC,MAAO,SACP,MAAO,SAEP,gBACCW,EAAAA,KAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,WAAY,SACZ,IAAK,EACL,MAAOD,EAAAA,OAAO,QAAQ,SACtB,WAAY,QACZ,SAAU,EAAA,EAGX,SAAA,CAAAF,EAAAA,IAACI,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOF,EAAAA,OAAO,QAAQ,QAAA,CAAA,EACrB,QAAA,CAAA,CAAA,CAEH,CAEF,EAEA,CAAA,CAAC,EAGCG,EAAoBC,GAA8B,CACnDA,IAAU,OACbf,EAAYF,CAAK,EACPiB,IAAU,UACpBd,IAAgBH,CAAK,CAEvB,EAEMkB,EACLP,EAAAA,IAACQ,EAAAA,aAAA,CACA,YAAW,iBAAiBnB,EAAM,EAAE,GACpC,SAAUA,EAAM,cAChB,QAASQ,EACT,aAAW,YAEX,SAAAG,EAAAA,IAACS,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOP,EAAAA,OAAO,QAAQ,SAAA,CAAA,CACvB,CAAA,EAIF,OACCC,EAAAA,KAACO,EAAAA,YAAA,CACA,YAAW,aAAarB,EAAM,EAAE,GAChC,UAAW,CAAC,CAACI,EACb,QAASA,EAAa,IAAMA,EAAWJ,CAAK,EAAI,OAEhD,SAAA,CAAAc,OAACQ,EAAAA,KAAA,CACA,SAAA,CAAAR,EAAAA,KAAC,MAAA,CACA,MAAO,CACN,QAAS,OACT,WAAY,SACZ,IAAK,EACL,SAAU,CAAA,EAGX,SAAA,CAAAH,EAAAA,IAACY,EAAAA,WAAA,CAAW,cAAe,EAAG,MAAOV,SAAO,QAAQ,QAClD,WAAM,IAAA,CACR,EAICb,EAAM,YACNW,MAACa,EAAAA,QAAA,CAAQ,KAAMxB,EAAM,YAAa,UAAU,MAC3C,SAAAW,EAAAA,IAAC,OAAA,CACA,MAAO,CACN,QAAS,OACT,WAAY,EACZ,OAAQ,MAAA,EAET,aAAW,eAEX,SAAAA,EAAAA,IAACc,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOZ,EAAAA,OAAO,QAAQ,SAAA,CAAA,CACvB,CAAA,EAEF,EACG,IAAA,CAAA,CAAA,SAEJa,EAAAA,YAAA,CAAY,cAAe,EAAG,MAAOb,SAAO,QAAQ,UAAW,SAAA,CAAA,YACrDb,EAAM,cAAA,CAAA,CACjB,CAAA,EACD,QAECsB,EAAAA,KAAA,CAEA,SAAAX,MAACa,EAAAA,SAAQ,KAAMjB,EAAa,UAAU,MACrC,SAAAI,EAAAA,IAACgB,EAAAA,cAAA,CAAc,cAAe,EAAG,MAAOd,EAAAA,OAAO,QAAQ,QACrD,SAAAN,EACF,EACD,CAAA,CACD,EAEAI,EAAAA,IAACW,EAAAA,KAAA,CAAK,MAAM,QACV,SAAAjB,EACAM,EAAAA,IAACiB,EAAAA,WAAA,CACA,MAAO,CACN,CACC,MAAO,OACP,OAAQ,OACR,aAAc,MACd,UAAW,GAAA,CACZ,CACD,CAAA,QAGAD,EAAAA,cAAA,CAAc,MAAOd,EAAAA,OAAO,QAAQ,QACnC,SAAAb,EAAM,YAAA,CACR,CAAA,CAEF,QAECsB,EAAAA,KAAA,CACA,SAAAX,EAAAA,IAACkB,EAAAA,IAAA,CACA,QAASvB,EAAS,OAAS,QAC3B,KAAMA,EAAS,WAAa,UAC5B,QAAQ,SAAA,CAAA,EAEV,EAEAK,MAACW,EAAAA,KAAA,CAAK,MAAM,SACX,gBAACQ,cAAA,CACC,SAAA,CAAA9B,EAAM,eAAiBA,EAAM,yBAC5BwB,UAAA,CAAQ,KAAMxB,EAAM,mBAAoB,UAAU,MAClD,SAAAW,EAAAA,IAAC,OAAA,CAAK,MAAO,CAAE,QAAS,QAAW,SAAAO,EAAW,EAC/C,EAEAA,EAGDP,EAAAA,IAAC,OAAA,CACA,MAAO,CAAE,QAAS,MAAA,EAClB,QAAUF,GAAMA,EAAE,gBAAA,EAElB,SAAAE,EAAAA,IAACoB,EAAAA,gBAAA,CACA,YAAW,kBAAkB/B,EAAM,EAAE,GACrC,QAASU,EACT,UAAU,aACV,MAAM,QACN,SAAWsB,GAAQhB,EAAiBiB,EAAAA,oBAAoBD,CAAG,CAAC,EAE5D,SAAArB,EAAAA,IAACQ,EAAAA,aAAA,CACA,YAAW,yBAAyBnB,EAAM,EAAE,GAC5C,aAAW,eAEX,SAAAW,EAAAA,IAACuB,EAAAA,QAAA,CACA,MAAO,GACP,OAAQ,GACR,MAAOrB,EAAAA,OAAO,QAAQ,SAAA,CAAA,CACvB,CAAA,CACD,CAAA,CACD,CAAA,CACD,CAAA,CACD,CAAA,CACD,CAAA,CAAA,CAAA,CAGH"}

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

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"AnalyticsTrend.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsTrend.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { ShimmerComponentStyled } from '@src/components/shimmer/ShimmerComponent/ShimmerStyled';\nimport DateUtils from '@src/utils/DateUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport DownArrowIcon from '../../assets/icons/arrow_down.svg';\nimport UpArrowIcon from '../../assets/icons/arrow_up.svg';\nimport InfoIcon from '../../assets/icons/info.svg';\nimport { Tag } from '../tag';\nimport { Placement, Tooltip } from '../tooltips';\nimport {\n\tBodyCaption,\n\tCaption,\n\tTitleLarge,\n\tTitleMedium,\n} from '../TypographyStyle';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from './chart/utils/calcPercentage';\nimport { AnalyticsTrendContainer, IconContainer } from './CommonStyles';\n\nexport interface AnalyticsTrendInterface {\n\ttitle: string;\n\tvalue?: number \| string;\n\ttrendPercent?: number;\n\ttrendRaw?: number;\n\ttrendRawString?: string;\n\tformatVal?: boolean;\n\ttimeline?: 'today' \| 'yesterday' \| '7 days' \| '30 days' \| 'custom';\n\tcustomRange?: Date[];\n\ttype?: 'vertical' \| 'horizontal';\n\ttooltip?: string;\n\ttooltipPlacement?: Placement;\n\ttooltipWidth?: number;\n\tcard?: boolean;\n\trightSeparator?: boolean;\n\tsize?: 'big' \| 'small';\n\tshare?: boolean;\n\tprefixSymbol?: string;\n\ttrailingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tonTrailIconClick?: () => void;\n\ticonTooltipBody?: string;\n\tfunnelPercent?: number;\n\tisLoading?: boolean;\n\tsuffixText?: string;\n\ttrendStyle?: React.CSSProperties;\n\ticonContainerStyle?: React.CSSProperties;\n\ttrendContainerStyle?: React.CSSProperties;\n\ttrendIconStyle?: React.CSSProperties;\n\tcontainerStyle?: React.CSSProperties;\n\tprevTrendDiff?: number;\n\trelativePercentageDiff?: number;\n\tisInternationalStore?: boolean;\n\tIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\ttooltipTimelineText?: string;\n\tcustomTimelineText?: string;\n}\nexport const AnalyticsTrend: React.FC<AnalyticsTrendInterface> = ({\n\ttitle,\n\tvalue,\n\ttrendPercent,\n\ttype = 'horizontal',\n\ttimeline,\n\tcustomRange,\n\ttooltip,\n\ttooltipPlacement = 'right',\n\ttooltipWidth = 300,\n\tcard = true,\n\trightSeparator = false,\n\tsize = 'big',\n\tshare = false,\n\tformatVal,\n\tprefixSymbol,\n\ttrailingIcon,\n\tonTrailIconClick,\n\ticonTooltipBody,\n\tfunnelPercent,\n\tisLoading,\n\ttrendRaw,\n\ttrendRawString,\n\tsuffixText,\n\ttrendStyle,\n\ttrendContainerStyle,\n\ttrendIconStyle,\n\tcontainerStyle,\n\tprevTrendDiff,\n\trelativePercentageDiff,\n\tisInternationalStore,\n\tIcon,\n\ticonContainerStyle,\n\ttooltipTimelineText,\n\tcustomTimelineText,\n}) => {\n\tconst ValueTypo = size === 'big' ? TitleLarge : TitleMedium;\n\tconst trendDirection =\n\t\ttypeof trendPercent !== 'undefined'\n\t\t\t? trendPercent < 0\n\t\t\t\t? 'negative'\n\t\t\t\t: trendPercent === 0\n\t\t\t\t? 'neutral'\n\t\t\t\t: 'positive'\n\t\t\t: undefined;\n\n\tconst percent =\n\t\ttypeof trendPercent !== 'undefined'\n\t\t\t? share\n\t\t\t\t? Math.round(trendPercent)\n\t\t\t\t: Math.abs(Math.round(trendPercent))\n\t\t\t: undefined;\n\n\tconst getDisplayValue = () => {\n\t\tif (typeof value === 'undefined') {\n\t\t\treturn '--';\n\t\t}\n\n\t\tif (typeof value === 'number') {\n\t\t\tif (formatVal) {\n\t\t\t\tif (value > 999) {\n\t\t\t\t\tif (isInternationalStore) {\n\t\t\t\t\t\treturn `${prefixSymbol ?? ''}${truncateValueForInternationalStore(\n\t\t\t\t\t\t\tvalue,\n\t\t\t\t\t\t)} ${suffixText ?? ''}`;\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn `${prefixSymbol ?? ''}${truncateValueForIndianStore(\n\t\t\t\t\t\t\tvalue,\n\t\t\t\t\t\t)} ${suffixText ?? ''}`;\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\treturn `${prefixSymbol ?? ''}${new Intl.NumberFormat('en-IN', {\n\t\t\t\t\t\tmaximumFractionDigits: 2,\n\t\t\t\t\t}).format(value)} ${suffixText ?? ''}`;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn `${prefixSymbol ?? ''}${value} ${suffixText ?? ''}`;\n\t};\n\n\tconst formatTrendDiff = (trendDiff: number) => {\n\t\tconst diff = Math.abs(trendDiff);\n\t\tif (diff % 1 !== 0) {\n\t\t\treturn `${diff.toFixed(1)} %`;\n\t\t}\n\t\treturn `${diff} %`;\n\t};\n\n\treturn (\n\t\t<AnalyticsTrendContainer\n\t\t\tcard={card}\n\t\t\tstyle={{\n\t\t\t\t...containerStyle,\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\tgap: Icon ? 12 : 4,\n\t\t\t\t\tborderRightWidth: rightSeparator ? 1 : 0,\n\t\t\t\t\tborderRightColor: COLORS.stroke.primary,\n\t\t\t\t\tborderRightStyle: 'solid',\n\t\t\t\t\tpaddingLeft: !card ? 24 : 0,\n\t\t\t\t\tpaddingRight: !card ? 24 : 0,\n\t\t\t\t\theight: '100%',\n\t\t\t\t\tjustifyContent: Icon ? 'flex-start' : 'space-between',\n\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t...(trendContainerStyle ?? {}),\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{!!Icon && (\n\t\t\t\t\t<IconContainer style={{ ...iconContainerStyle }}>\n\t\t\t\t\t\t<Icon />\n\t\t\t\t\t</IconContainer>\n\t\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: 'column',\n\t\t\t\t\t\tgap: 4,\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t...(trendStyle ?? {}),\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: 4,\n\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{title}\n\t\t\t\t\t\t</BodyCaption>\n\n\t\t\t\t\t\t{tooltip && (\n\t\t\t\t\t\t\t<Tooltip\n\t\t\t\t\t\t\t\tbody={tooltip}\n\t\t\t\t\t\t\t\tplacement={tooltipPlacement}\n\t\t\t\t\t\t\t\twidth={tooltipWidth}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\t\t\t\t\theight: '100%',\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\t\t<InfoIcon\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.primary}\n\t\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\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: 12,\n\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t...(share ? { justifyContent: 'space-between' } : {}),\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{isLoading && <ShimmerComponentStyled width={108} height={26} />}\n\t\t\t\t\t\t{!isLoading && (\n\t\t\t\t\t\t\t<ValueTypo\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.primary,\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{getDisplayValue()}\n\t\t\t\t\t\t\t</ValueTypo>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{typeof relativePercentageDiff === 'number' && (\n\t\t\t\t\t\t\t<Tag\n\t\t\t\t\t\t\t\ttagText={`${relativePercentageDiff}%`}\n\t\t\t\t\t\t\t\ttheme=\"light\"\n\t\t\t\t\t\t\t\ttype=\"neutral\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{type === 'horizontal' && !isLoading && !share && (\n\t\t\t\t\t\t\t<Trend\n\t\t\t\t\t\t\t\ttimeline={timeline}\n\t\t\t\t\t\t\t\tcustomRange={customRange}\n\t\t\t\t\t\t\t\tpercent={percent}\n\t\t\t\t\t\t\t\tdirection={trendDirection}\n\t\t\t\t\t\t\t\ttrendRaw={trendRaw}\n\t\t\t\t\t\t\t\ttrendRawString={trendRawString}\n\t\t\t\t\t\t\t\tprefixSymbol={prefixSymbol}\n\t\t\t\t\t\t\t\ttrendIconStyle={trendIconStyle}\n\t\t\t\t\t\t\t\tisInternationalStore={isInternationalStore}\n\t\t\t\t\t\t\t\ttooltipTimelineText={tooltipTimelineText}\n\t\t\t\t\t\t\t\tcustomTimelineText={customTimelineText}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{isLoading && !share && type === 'horizontal' && (\n\t\t\t\t\t\t\t<ShimmerComponentStyled height={20} width={141} marginTop={6} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{type === 'vertical' &&\n\t\t\t\t\t\t\t!isLoading &&\n\t\t\t\t\t\t\ttypeof funnelPercent !== 'undefined' && (\n\t\t\t\t\t\t\t\t<Tag\n\t\t\t\t\t\t\t\t\ttagText={`${funnelPercent} %`}\n\t\t\t\t\t\t\t\t\ttheme=\"light\"\n\t\t\t\t\t\t\t\t\ttype=\"neutral\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t{share && !isLoading && typeof percent !== 'undefined' && (\n\t\t\t\t\t\t\t<Tag tagText={`${percent} %`} theme=\"light\" type=\"neutral\" />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{!share && !isLoading && prevTrendDiff && prevTrendDiff != 0 ? (\n\t\t\t\t\t\t\t<Tag\n\t\t\t\t\t\t\t\ttagText={formatTrendDiff(prevTrendDiff)}\n\t\t\t\t\t\t\t\ttheme=\"light\"\n\t\t\t\t\t\t\t\ttype=\"neutral\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t\t{type === 'vertical' && !isLoading && !share && (\n\t\t\t\t\t\t<div style={{ marginTop: 10 }}>\n\t\t\t\t\t\t\t<Trend\n\t\t\t\t\t\t\t\ttimeline={timeline}\n\t\t\t\t\t\t\t\tcustomRange={customRange}\n\t\t\t\t\t\t\t\tpercent={percent}\n\t\t\t\t\t\t\t\tdirection={trendDirection}\n\t\t\t\t\t\t\t\ttrendRaw={trendRaw}\n\t\t\t\t\t\t\t\ttrendRawString={trendRawString}\n\t\t\t\t\t\t\t\tprefixSymbol={prefixSymbol}\n\t\t\t\t\t\t\t\ttrendIconStyle={trendIconStyle}\n\t\t\t\t\t\t\t\tisInternationalStore={isInternationalStore}\n\t\t\t\t\t\t\t\ttooltipTimelineText={tooltipTimelineText}\n\t\t\t\t\t\t\t\tcustomTimelineText={customTimelineText}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t{isLoading && type === 'vertical' && (\n\t\t\t\t\t\t<ShimmerComponentStyled height={20} width={141} marginTop={6} />\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t{iconTooltipBody && !isLoading && (\n\t\t\t\t\t<Tooltip body={iconTooltipBody} placement={'right'}>\n\t\t\t\t\t\t{trailingIcon && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tdata-test=\"analytics-trend-trailing-icon\"\n\t\t\t\t\t\t\t\tclassName={'icon--holder'}\n\t\t\t\t\t\t\t\tonClick={onTrailIconClick}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{React.createElement(trailingIcon, {\n\t\t\t\t\t\t\t\t\theight: 20,\n\t\t\t\t\t\t\t\t\twidth: 20,\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.secondary,\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)}\n\t\t\t\t\t</Tooltip>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</AnalyticsTrendContainer>\n\t);\n};\n\nconst Trend: React.FC<{\n\tpercent?: number;\n\tdirection?: 'positive' \| 'negative' \| 'neutral';\n\ttimeline?: AnalyticsTrendInterface['timeline'];\n\tcustomRange?: AnalyticsTrendInterface['customRange'];\n\ttrendRaw?: number;\n\ttrendRawString?: string;\n\tprefixSymbol?: string;\n\ttrendIconStyle?: React.CSSProperties;\n\tisInternationalStore?: boolean;\n\ttooltipTimelineText?: string;\n\tcustomTimelineText?: string;\n}> = ({\n\tpercent,\n\tdirection,\n\ttimeline,\n\tcustomRange,\n\ttrendRaw,\n\ttrendRawString,\n\tprefixSymbol,\n\ttrendIconStyle,\n\tisInternationalStore,\n\ttooltipTimelineText,\n\tcustomTimelineText,\n}) => {\n\tconst getTrendRawAbs = () => {\n\t\tlet trendRawAbs = '--';\n\t\tif (trendRaw) {\n\t\t\tif (isInternationalStore) {\n\t\t\t\ttrendRawAbs = String(\n\t\t\t\t\ttruncateValueForInternationalStore(Math.abs(trendRaw)),\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\ttrendRawAbs = String(truncateValueForIndianStore(Math.abs(trendRaw)));\n\t\t\t}\n\t\t\tif (trendRaw < 0) {\n\t\t\t\treturn '-' + trendRawAbs;\n\t\t\t} else {\n\t\t\t\treturn trendRawAbs;\n\t\t\t}\n\t\t}\n\t};\n\n\tconst generateTrendRawText = () => {\n\t\tconst prefixWithSign =\n\t\t\t((trendRaw ?? 0) > 0 ? '+' : '') + (prefixSymbol ?? '');\n\t\tconst trendRawTextInitial =\n\t\t\ttypeof trendRaw === 'undefined'\n\t\t\t\t? '--'\n\t\t\t\t: `${prefixWithSign ?? ''}${getTrendRawAbs()}`;\n\t\treturn trendRawTextInitial;\n\t};\n\n\tconst [trendRawText, setTrendRawText] = useState<string>(\n\t\tgenerateTrendRawText(),\n\t);\n\tconst [timeLineText, setTimeLineText] = useState<string>(\n\t\tcustomTimelineText \|\| '',\n\t);\n\n\tuseEffect(() => {\n\t\tif (customTimelineText) {\n\t\t\treturn;\n\t\t}\n\t\tsetTimeLineText(\n\t\t\ttimeline === 'today'\n\t\t\t\t? 'vs yesterday'\n\t\t\t\t: timeline === 'yesterday'\n\t\t\t\t? 'vs 1 day before'\n\t\t\t\t: timeline === '7 days'\n\t\t\t\t? 'vs last 7 days'\n\t\t\t\t: timeline === '30 days'\n\t\t\t\t? 'vs last 30 days'\n\t\t\t\t: timeline === 'custom' && customRange\n\t\t\t\t? DateUtils.getAnalyticsCustomDateTimelineText(customRange)\n\t\t\t\t: '',\n\t\t);\n\t}, [timeline, customRange]);\n\n\tuseEffect(() => {\n\t\tsetTrendRawText(generateTrendRawText());\n\t}, [trendRaw]);\n\n\tconst TrendIcon = direction === 'negative' ? DownArrowIcon : UpArrowIcon;\n\n\tconst color =\n\t\tdirection === 'negative'\n\t\t\t? COLORS.background.negative.vibrant\n\t\t\t: direction === 'positive'\n\t\t\t? COLORS.background.positive.vibrant\n\t\t\t: COLORS.content.placeholder;\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tdisplay: 'flex',\n\t\t\t\talignItems: 'center',\n\t\t\t\tflexDirection: 'row',\n\t\t\t\tflexWrap: 'wrap',\n\t\t\t}}\n\t\t>\n\t\t\t{typeof percent === 'number' && (\n\t\t\t\t<TrendIcon\n\t\t\t\t\tcolor={color}\n\t\t\t\t\theight={16}\n\t\t\t\t\twidth={16}\n\t\t\t\t\tstyle={{ marginRight: 2, ...(trendIconStyle ?? {}) }}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{typeof percent === 'number' && direction && (\n\t\t\t\t<Caption style={{ color }}>\n\t\t\t\t\t{direction === 'neutral' ? 0 : percent < 1000 ? percent : '>999'}\n\t\t\t\t\t{'%'}\n\t\t\t\t</Caption>\n\t\t\t)}\n\t\t\t{!!trendRaw && (\n\t\t\t\t<Caption style={{ marginLeft: 4, color: COLORS.content.placeholder }}>\n\t\t\t\t\t{`(${trendRawText})`}\n\t\t\t\t</Caption>\n\t\t\t)}\n\t\t\t{!trendRaw && (trendRawString?.length \|\| 0) > 0 && (\n\t\t\t\t<Caption style={{ marginLeft: 4, color: COLORS.content.placeholder }}>\n\t\t\t\t\t{`${trendRawString}`}\n\t\t\t\t</Caption>\n\t\t\t)}\n\n\t\t\t{timeline &&\n\t\t\t\t(tooltipTimelineText ? (\n\t\t\t\t\t<Tooltip body={tooltipTimelineText} placement=\"bottom\">\n\t\t\t\t\t\t<Caption\n\t\t\t\t\t\t\tstyle={{ marginLeft: 4, color: COLORS.content.placeholder }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{customTimelineText \|\| timeLineText}\n\t\t\t\t\t\t</Caption>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t) : (\n\t\t\t\t\t<Caption style={{ marginLeft: 4, color: COLORS.content.placeholder }}>\n\t\t\t\t\t\t{customTimelineText \|\| timeLineText}\n\t\t\t\t\t</Caption>\n\t\t\t\t))}\n\t\t</div>\n\t);\n};\n"],"names":["AnalyticsTrend","title","value","trendPercent","type","timeline","customRange","tooltip","tooltipPlacement","tooltipWidth","card","rightSeparator","size","share","formatVal","prefixSymbol","trailingIcon","onTrailIconClick","iconTooltipBody","funnelPercent","isLoading","trendRaw","trendRawString","suffixText","trendStyle","trendContainerStyle","trendIconStyle","containerStyle","prevTrendDiff","relativePercentageDiff","isInternationalStore","Icon","iconContainerStyle","tooltipTimelineText","customTimelineText","ValueTypo","TitleLarge","TitleMedium","trendDirection","percent","getDisplayValue","truncateValueForInternationalStore","truncateValueForIndianStore","formatTrendDiff","trendDiff","diff","jsx","AnalyticsTrendContainer","jsxs","COLORS","IconContainer","BodyCaption","Tooltip","InfoIcon","ShimmerComponentStyled","Tag","Trend","Fragment","React","direction","getTrendRawAbs","trendRawAbs","generateTrendRawText","prefixWithSign","trendRawText","setTrendRawText","useState","timeLineText","setTimeLineText","useEffect","DateUtils","TrendIcon","DownArrowIcon","UpArrowIcon","color","Caption"],"mappings":"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"}
1	+ {"version":3,"file":"AnalyticsTrend.js","sources":["../../../../src/components/analytics-chips-and-dropdowns/AnalyticsTrend.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { ShimmerComponentStyled } from '@src/components/shimmer/ShimmerComponent/ShimmerStyled';\nimport DateUtils from '@src/utils/DateUtils';\nimport { COLORS } from '@src/constants/Theme';\nimport DownArrowIcon from '../../assets/icons/arrow_down.svg';\nimport UpArrowIcon from '../../assets/icons/arrow_up.svg';\nimport InfoIcon from '../../assets/icons/info.svg';\nimport { Tag } from '../tag';\nimport { Tooltip } from '../tooltips';\nimport {\n\tBodyCaption,\n\tCaption,\n\tTitleLarge,\n\tTitleMedium,\n} from '../TypographyStyle';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from './chart/utils/calcPercentage';\nimport { AnalyticsTrendContainer, IconContainer } from './CommonStyles';\n\nexport interface AnalyticsTrendInterface {\n\ttitle: string;\n\tvalue?: number \| string;\n\ttrendPercent?: number;\n\ttrendRaw?: number;\n\ttrendRawString?: string;\n\tformatVal?: boolean;\n\ttimeline?: 'today' \| 'yesterday' \| '7 days' \| '30 days' \| 'custom';\n\tcustomRange?: Date[];\n\ttype?: 'vertical' \| 'horizontal';\n\ttooltip?: string;\n\tcard?: boolean;\n\trightSeparator?: boolean;\n\tsize?: 'big' \| 'small';\n\tshare?: boolean;\n\tprefixSymbol?: string;\n\ttrailingIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\tonTrailIconClick?: () => void;\n\ticonTooltipBody?: string;\n\tfunnelPercent?: number;\n\tisLoading?: boolean;\n\tsuffixText?: string;\n\ttrendStyle?: React.CSSProperties;\n\ticonContainerStyle?: React.CSSProperties;\n\ttrendContainerStyle?: React.CSSProperties;\n\ttrendIconStyle?: React.CSSProperties;\n\tcontainerStyle?: React.CSSProperties;\n\tprevTrendDiff?: number;\n\trelativePercentageDiff?: number;\n\tisInternationalStore?: boolean;\n\tIcon?: React.FunctionComponent<React.SVGAttributes<SVGElement>>;\n\ttooltipTimelineText?: string;\n\tcustomTimelineText?: string;\n}\nexport const AnalyticsTrend: React.FC<AnalyticsTrendInterface> = ({\n\ttitle,\n\tvalue,\n\ttrendPercent,\n\ttype = 'horizontal',\n\ttimeline,\n\tcustomRange,\n\ttooltip,\n\tcard = true,\n\trightSeparator = false,\n\tsize = 'big',\n\tshare = false,\n\tformatVal,\n\tprefixSymbol,\n\ttrailingIcon,\n\tonTrailIconClick,\n\ticonTooltipBody,\n\tfunnelPercent,\n\tisLoading,\n\ttrendRaw,\n\ttrendRawString,\n\tsuffixText,\n\ttrendStyle,\n\ttrendContainerStyle,\n\ttrendIconStyle,\n\tcontainerStyle,\n\tprevTrendDiff,\n\trelativePercentageDiff,\n\tisInternationalStore,\n\tIcon,\n\ticonContainerStyle,\n\ttooltipTimelineText,\n\tcustomTimelineText,\n}) => {\n\tconst ValueTypo = size === 'big' ? TitleLarge : TitleMedium;\n\tconst trendDirection =\n\t\ttypeof trendPercent !== 'undefined'\n\t\t\t? trendPercent < 0\n\t\t\t\t? 'negative'\n\t\t\t\t: trendPercent === 0\n\t\t\t\t? 'neutral'\n\t\t\t\t: 'positive'\n\t\t\t: undefined;\n\n\tconst percent =\n\t\ttypeof trendPercent !== 'undefined'\n\t\t\t? share\n\t\t\t\t? Math.round(trendPercent)\n\t\t\t\t: Math.abs(Math.round(trendPercent))\n\t\t\t: undefined;\n\n\tconst getDisplayValue = () => {\n\t\tif (typeof value === 'undefined') {\n\t\t\treturn '--';\n\t\t}\n\n\t\tif (typeof value === 'number') {\n\t\t\tif (formatVal) {\n\t\t\t\tif (value > 999) {\n\t\t\t\t\tif (isInternationalStore) {\n\t\t\t\t\t\treturn `${prefixSymbol ?? ''}${truncateValueForInternationalStore(\n\t\t\t\t\t\t\tvalue,\n\t\t\t\t\t\t)} ${suffixText ?? ''}`;\n\t\t\t\t\t} else {\n\t\t\t\t\t\treturn `${prefixSymbol ?? ''}${truncateValueForIndianStore(\n\t\t\t\t\t\t\tvalue,\n\t\t\t\t\t\t)} ${suffixText ?? ''}`;\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\treturn `${prefixSymbol ?? ''}${new Intl.NumberFormat('en-IN', {\n\t\t\t\t\t\tmaximumFractionDigits: 2,\n\t\t\t\t\t}).format(value)} ${suffixText ?? ''}`;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn `${prefixSymbol ?? ''}${value} ${suffixText ?? ''}`;\n\t};\n\n\tconst formatTrendDiff = (trendDiff: number) => {\n\t\tconst diff = Math.abs(trendDiff);\n\t\tif (diff % 1 !== 0) {\n\t\t\treturn `${diff.toFixed(1)} %`;\n\t\t}\n\t\treturn `${diff} %`;\n\t};\n\n\treturn (\n\t\t<AnalyticsTrendContainer\n\t\t\tcard={card}\n\t\t\tstyle={{\n\t\t\t\t...containerStyle,\n\t\t\t}}\n\t\t>\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\tgap: Icon ? 12 : 4,\n\t\t\t\t\tborderRightWidth: rightSeparator ? 1 : 0,\n\t\t\t\t\tborderRightColor: COLORS.stroke.primary,\n\t\t\t\t\tborderRightStyle: 'solid',\n\t\t\t\t\tpaddingLeft: !card ? 24 : 0,\n\t\t\t\t\tpaddingRight: !card ? 24 : 0,\n\t\t\t\t\theight: '100%',\n\t\t\t\t\tjustifyContent: Icon ? 'flex-start' : 'space-between',\n\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t...(trendContainerStyle ?? {}),\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{!!Icon && (\n\t\t\t\t\t<IconContainer style={{ ...iconContainerStyle }}>\n\t\t\t\t\t\t<Icon />\n\t\t\t\t\t</IconContainer>\n\t\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: 'column',\n\t\t\t\t\t\tgap: 4,\n\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t...(trendStyle ?? {}),\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: 4,\n\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<BodyCaption\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{title}\n\t\t\t\t\t\t</BodyCaption>\n\n\t\t\t\t\t\t{tooltip && (\n\t\t\t\t\t\t\t<Tooltip body={tooltip} placement={'right'} width={300}>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\t\t\tcursor: 'pointer',\n\t\t\t\t\t\t\t\t\t\theight: '100%',\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\t\t<InfoIcon\n\t\t\t\t\t\t\t\t\t\tcolor={COLORS.content.primary}\n\t\t\t\t\t\t\t\t\t\theight={16}\n\t\t\t\t\t\t\t\t\t\twidth={16}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\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: 12,\n\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t...(share ? { justifyContent: 'space-between' } : {}),\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{isLoading && <ShimmerComponentStyled width={108} height={26} />}\n\t\t\t\t\t\t{!isLoading && (\n\t\t\t\t\t\t\t<ValueTypo\n\t\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.primary,\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{getDisplayValue()}\n\t\t\t\t\t\t\t</ValueTypo>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{typeof relativePercentageDiff === 'number' && (\n\t\t\t\t\t\t\t<Tag\n\t\t\t\t\t\t\t\ttagText={`${relativePercentageDiff}%`}\n\t\t\t\t\t\t\t\ttheme=\"light\"\n\t\t\t\t\t\t\t\ttype=\"neutral\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{type === 'horizontal' && !isLoading && !share && (\n\t\t\t\t\t\t\t<Trend\n\t\t\t\t\t\t\t\ttimeline={timeline}\n\t\t\t\t\t\t\t\tcustomRange={customRange}\n\t\t\t\t\t\t\t\tpercent={percent}\n\t\t\t\t\t\t\t\tdirection={trendDirection}\n\t\t\t\t\t\t\t\ttrendRaw={trendRaw}\n\t\t\t\t\t\t\t\ttrendRawString={trendRawString}\n\t\t\t\t\t\t\t\tprefixSymbol={prefixSymbol}\n\t\t\t\t\t\t\t\ttrendIconStyle={trendIconStyle}\n\t\t\t\t\t\t\t\tisInternationalStore={isInternationalStore}\n\t\t\t\t\t\t\t\ttooltipTimelineText={tooltipTimelineText}\n\t\t\t\t\t\t\t\tcustomTimelineText={customTimelineText}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{isLoading && !share && type === 'horizontal' && (\n\t\t\t\t\t\t\t<ShimmerComponentStyled height={20} width={141} marginTop={6} />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{type === 'vertical' &&\n\t\t\t\t\t\t\t!isLoading &&\n\t\t\t\t\t\t\ttypeof funnelPercent !== 'undefined' && (\n\t\t\t\t\t\t\t\t<Tag\n\t\t\t\t\t\t\t\t\ttagText={`${funnelPercent} %`}\n\t\t\t\t\t\t\t\t\ttheme=\"light\"\n\t\t\t\t\t\t\t\t\ttype=\"neutral\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t{share && !isLoading && typeof percent !== 'undefined' && (\n\t\t\t\t\t\t\t<Tag tagText={`${percent} %`} theme=\"light\" type=\"neutral\" />\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{!share && !isLoading && prevTrendDiff && prevTrendDiff != 0 ? (\n\t\t\t\t\t\t\t<Tag\n\t\t\t\t\t\t\t\ttagText={formatTrendDiff(prevTrendDiff)}\n\t\t\t\t\t\t\t\ttheme=\"light\"\n\t\t\t\t\t\t\t\ttype=\"neutral\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<></>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t\t{type === 'vertical' && !isLoading && !share && (\n\t\t\t\t\t\t<div style={{ marginTop: 10 }}>\n\t\t\t\t\t\t\t<Trend\n\t\t\t\t\t\t\t\ttimeline={timeline}\n\t\t\t\t\t\t\t\tcustomRange={customRange}\n\t\t\t\t\t\t\t\tpercent={percent}\n\t\t\t\t\t\t\t\tdirection={trendDirection}\n\t\t\t\t\t\t\t\ttrendRaw={trendRaw}\n\t\t\t\t\t\t\t\ttrendRawString={trendRawString}\n\t\t\t\t\t\t\t\tprefixSymbol={prefixSymbol}\n\t\t\t\t\t\t\t\ttrendIconStyle={trendIconStyle}\n\t\t\t\t\t\t\t\tisInternationalStore={isInternationalStore}\n\t\t\t\t\t\t\t\ttooltipTimelineText={tooltipTimelineText}\n\t\t\t\t\t\t\t\tcustomTimelineText={customTimelineText}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t\t{isLoading && type === 'vertical' && (\n\t\t\t\t\t\t<ShimmerComponentStyled height={20} width={141} marginTop={6} />\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t{iconTooltipBody && !isLoading && (\n\t\t\t\t\t<Tooltip body={iconTooltipBody} placement={'right'}>\n\t\t\t\t\t\t{trailingIcon && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tdata-test=\"analytics-trend-trailing-icon\"\n\t\t\t\t\t\t\t\tclassName={'icon--holder'}\n\t\t\t\t\t\t\t\tonClick={onTrailIconClick}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{React.createElement(trailingIcon, {\n\t\t\t\t\t\t\t\t\theight: 20,\n\t\t\t\t\t\t\t\t\twidth: 20,\n\t\t\t\t\t\t\t\t\tcolor: COLORS.content.secondary,\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)}\n\t\t\t\t\t</Tooltip>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</AnalyticsTrendContainer>\n\t);\n};\n\nconst Trend: React.FC<{\n\tpercent?: number;\n\tdirection?: 'positive' \| 'negative' \| 'neutral';\n\ttimeline?: AnalyticsTrendInterface['timeline'];\n\tcustomRange?: AnalyticsTrendInterface['customRange'];\n\ttrendRaw?: number;\n\ttrendRawString?: string;\n\tprefixSymbol?: string;\n\ttrendIconStyle?: React.CSSProperties;\n\tisInternationalStore?: boolean;\n\ttooltipTimelineText?: string;\n\tcustomTimelineText?: string;\n}> = ({\n\tpercent,\n\tdirection,\n\ttimeline,\n\tcustomRange,\n\ttrendRaw,\n\ttrendRawString,\n\tprefixSymbol,\n\ttrendIconStyle,\n\tisInternationalStore,\n\ttooltipTimelineText,\n\tcustomTimelineText,\n}) => {\n\tconst getTrendRawAbs = () => {\n\t\tlet trendRawAbs = '--';\n\t\tif (trendRaw) {\n\t\t\tif (isInternationalStore) {\n\t\t\t\ttrendRawAbs = String(\n\t\t\t\t\ttruncateValueForInternationalStore(Math.abs(trendRaw)),\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\ttrendRawAbs = String(truncateValueForIndianStore(Math.abs(trendRaw)));\n\t\t\t}\n\t\t\tif (trendRaw < 0) {\n\t\t\t\treturn '-' + trendRawAbs;\n\t\t\t} else {\n\t\t\t\treturn trendRawAbs;\n\t\t\t}\n\t\t}\n\t};\n\n\tconst generateTrendRawText = () => {\n\t\tconst prefixWithSign =\n\t\t\t((trendRaw ?? 0) > 0 ? '+' : '') + (prefixSymbol ?? '');\n\t\tconst trendRawTextInitial =\n\t\t\ttypeof trendRaw === 'undefined'\n\t\t\t\t? '--'\n\t\t\t\t: `${prefixWithSign ?? ''}${getTrendRawAbs()}`;\n\t\treturn trendRawTextInitial;\n\t};\n\n\tconst [trendRawText, setTrendRawText] = useState<string>(\n\t\tgenerateTrendRawText(),\n\t);\n\tconst [timeLineText, setTimeLineText] = useState<string>(\n\t\tcustomTimelineText \|\| '',\n\t);\n\n\tuseEffect(() => {\n\t\tif (customTimelineText) {\n\t\t\treturn;\n\t\t}\n\t\tsetTimeLineText(\n\t\t\ttimeline === 'today'\n\t\t\t\t? 'vs yesterday'\n\t\t\t\t: timeline === 'yesterday'\n\t\t\t\t? 'vs 1 day before'\n\t\t\t\t: timeline === '7 days'\n\t\t\t\t? 'vs last 7 days'\n\t\t\t\t: timeline === '30 days'\n\t\t\t\t? 'vs last 30 days'\n\t\t\t\t: timeline === 'custom' && customRange\n\t\t\t\t? DateUtils.getAnalyticsCustomDateTimelineText(customRange)\n\t\t\t\t: '',\n\t\t);\n\t}, [timeline, customRange]);\n\n\tuseEffect(() => {\n\t\tsetTrendRawText(generateTrendRawText());\n\t}, [trendRaw]);\n\n\tconst TrendIcon = direction === 'negative' ? DownArrowIcon : UpArrowIcon;\n\n\tconst color =\n\t\tdirection === 'negative'\n\t\t\t? COLORS.background.negative.vibrant\n\t\t\t: direction === 'positive'\n\t\t\t? COLORS.background.positive.vibrant\n\t\t\t: COLORS.content.placeholder;\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{\n\t\t\t\tdisplay: 'flex',\n\t\t\t\talignItems: 'center',\n\t\t\t\tflexDirection: 'row',\n\t\t\t\tflexWrap: 'wrap',\n\t\t\t}}\n\t\t>\n\t\t\t{typeof percent === 'number' && (\n\t\t\t\t<TrendIcon\n\t\t\t\t\tcolor={color}\n\t\t\t\t\theight={16}\n\t\t\t\t\twidth={16}\n\t\t\t\t\tstyle={{ marginRight: 2, ...(trendIconStyle ?? {}) }}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t{typeof percent === 'number' && direction && (\n\t\t\t\t<Caption style={{ color }}>\n\t\t\t\t\t{direction === 'neutral' ? 0 : percent < 1000 ? percent : '>999'}\n\t\t\t\t\t{'%'}\n\t\t\t\t</Caption>\n\t\t\t)}\n\t\t\t{!!trendRaw && (\n\t\t\t\t<Caption style={{ marginLeft: 4, color: COLORS.content.placeholder }}>\n\t\t\t\t\t{`(${trendRawText})`}\n\t\t\t\t</Caption>\n\t\t\t)}\n\t\t\t{!trendRaw && (trendRawString?.length \|\| 0) > 0 && (\n\t\t\t\t<Caption style={{ marginLeft: 4, color: COLORS.content.placeholder }}>\n\t\t\t\t\t{`${trendRawString}`}\n\t\t\t\t</Caption>\n\t\t\t)}\n\n\t\t\t{timeline &&\n\t\t\t\t(tooltipTimelineText ? (\n\t\t\t\t\t<Tooltip body={tooltipTimelineText} placement=\"bottom\">\n\t\t\t\t\t\t<Caption\n\t\t\t\t\t\t\tstyle={{ marginLeft: 4, color: COLORS.content.placeholder }}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{customTimelineText \|\| timeLineText}\n\t\t\t\t\t\t</Caption>\n\t\t\t\t\t</Tooltip>\n\t\t\t\t) : (\n\t\t\t\t\t<Caption style={{ marginLeft: 4, color: COLORS.content.placeholder }}>\n\t\t\t\t\t\t{customTimelineText \|\| timeLineText}\n\t\t\t\t\t</Caption>\n\t\t\t\t))}\n\t\t</div>\n\t);\n};\n"],"names":["AnalyticsTrend","title","value","trendPercent","type","timeline","customRange","tooltip","card","rightSeparator","size","share","formatVal","prefixSymbol","trailingIcon","onTrailIconClick","iconTooltipBody","funnelPercent","isLoading","trendRaw","trendRawString","suffixText","trendStyle","trendContainerStyle","trendIconStyle","containerStyle","prevTrendDiff","relativePercentageDiff","isInternationalStore","Icon","iconContainerStyle","tooltipTimelineText","customTimelineText","ValueTypo","TitleLarge","TitleMedium","trendDirection","percent","getDisplayValue","truncateValueForInternationalStore","truncateValueForIndianStore","formatTrendDiff","trendDiff","diff","jsx","AnalyticsTrendContainer","jsxs","COLORS","IconContainer","BodyCaption","Tooltip","InfoIcon","ShimmerComponentStyled","Tag","Trend","Fragment","React","direction","getTrendRawAbs","trendRawAbs","generateTrendRawText","prefixWithSign","trendRawText","setTrendRawText","useState","timeLineText","setTimeLineText","useEffect","DateUtils","TrendIcon","DownArrowIcon","UpArrowIcon","color","Caption"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),q=require("../../../../assets/icons/maximize.svg.js"),f=require("chart.js"),Z=require("chartjs-plugin-datalabels"),F=require("react"),P=require("react-chartjs-2"),D=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),I=require("../utils/calcPercentage.js"),n=require("./StackedBarChart.model.js"),v=require("./StackedBarChart.styles.js"),z=require("../../../icon-button/IconButton.js"),M=require("../../../modals/styledModal.js"),W=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},V=W(Z);f.Chart.register(f.CategoryScale,f.LinearScale,f.BarElement,f.Tooltip,f.Legend,V.default);const $=(e,c,x)=>{if(c.length<=x)return{truncatedData:e,truncatedLabels:c,originalData:e,originalLabels:c};const g=e.map(r=>r.slice(0,x)),y=e.map(r=>r.slice(x).reduce((h,S)=>h+S,0));g.forEach((r,h)=>r.push(y[h]));const A=c.slice(0,x);return A.push("Others"),{truncatedData:g,truncatedLabels:A,originalData:e,originalLabels:c}},Y=e=>{const{headerIcons:c=[],legendsAndIconDirection:x="row"}=e,[g,y]=F.useState(!1),A=[250,1e3,800,1500,300,600],r=e.yAxis.data.length===0,h={min:0,max:2e3,stepSize:200},S=["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],B=["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"],j=e.customBarColors?e.customBarColors:e.customColourScaleBrand||e.customColourScalePastel?e.colorSchema===n.COLOR_SCHEMA.PASTEL?e.customColourScalePastel:e.customColourScaleBrand:e.colorSchema===n.COLOR_SCHEMA.PASTEL?B:S,H=e.customHoverColour,_=F.useMemo(()=>({barPercentage:e?.barPercentage||.4,categoryPercentage:e?.categoryPercentage??1,pointStyle:"circle",barWidth:e.barWidth,borderRadius:e?.borderRadius||void 0,...typeof e?.borderRadius=="object"?{borderSkipped:!1}:{},...e?.addBarGap?.flag?{borderWidth:{top:e?.addBarGap?.value||2,bottom:e?.addBarGap?.value||2,right:0,left:0},borderColor:"transparent"}:{}}),[e.barWidth,e?.borderRadius,e?.barPercentage,e?.addBarGap]),O={};e.yAxis.data.map(t=>{t.map(a=>{O[a.name]?O[a.name].push(a.value):O[a.name]=[a.value]})});const R=Object.keys(O).map((t,a)=>({label:t,data:O[t],backgroundColor:j?.[a],hoverBackgroundColor:H===void 0?void 0:H[a],..._}));let d;e.renderInHeightWiseManner?d=R.map((t,a)=>({...t,order:t.data.reduce((l,s)=>l+(s||0),0)})).sort((t,a)=>a.order-t.order):d=R;let T=e.xAxis.data.map(t=>typeof t=="string"?t:t.name),k=d;if(e.truncateBars){const t=$(d.map(a=>a.data),T,e.truncateBars);d.forEach((a,l)=>a.data=t.truncatedData[l]),T=t.truncatedLabels,k=t.originalData.map((a,l)=>({...d[l],data:a}))}const C={plugins:{legend:{display:!r&&!e.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!r,callbacks:{label:e.tooltipConfig?.labelCallback,title:e.tooltipConfig?.titleCallback,footer:e.tooltipConfig?.footerCallback},footerFont:e.tooltipConfig?.footerStyles?.footerFont},datalabels:{display:e.showTotal??!1,anchor:"end",align:"end",clamp:!0,formatter:(t,a)=>{const l=a.datasetIndex,s=a.chart.data.datasets;if(l!==s.length-1)return"";const N=a.dataIndex;let u=0;for(let L=0;L<s.length;L++)u+=s[L].data[N]??0;return u?u<1e3?u:(u/1e3).toString().substring(0,4)+"k":""},color:o.COLORS.content.secondary}},layout:{padding:{right:e.showTotal&&e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:e.showTotal&&e.orientation!=n.GRAPH_ORIENTATION.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!e.customLegend,labels:{usePointStyle:!0}},indexAxis:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.title:e.xAxis?.title),text:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.title:e.xAxis?.title,color:(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.titleColor:e.xAxis?.titleColor)??o.COLORS.content.secondary,font:{size:o.FONTS.caption.fontSize}},grid:{display:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL&&(typeof e?.showGridLines?.x>"u"?!0:e?.showGridLines?.x),color:o.COLORS.background.base},ticks:{fontSize:o.FONTS.caption.fontSize,color:e.yAxis.labelColor??o.COLORS.content.secondary,callback:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?t=>{let a;e.isInternationalStore?a=I.truncateValueForInternationalStore(t):a=I.truncateValueForIndianStore(t);const l=e.yAxis?.axisSuffix||"";return`${a}${l}`}:e.xAxis?.axisSuffix?t=>`${t}${e.xAxis.axisSuffix}`:void 0},stacked:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?typeof e.yAxis?.stacked=="boolean"?e.yAxis?.stacked:!0:typeof e.xAxis?.stacked=="boolean"?e.xAxis?.stacked:!0},y:{...e?.equalHeight?.flag?{suggestedMin:-e?.equalHeight.max,suggestedMax:e?.equalHeight.max}:{},max:e?.yAxis?.max,title:{display:!!(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.title:e.yAxis?.title),text:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.title:e.yAxis?.title,color:(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.titleColor:e.yAxis?.titleColor)??o.COLORS.content.secondary,font:{size:o.FONTS.caption.fontSize}},grid:{display:e.orientation!==n.GRAPH_ORIENTATION.HORIZONTAL&&(typeof e?.showGridLines?.y>"u"?!0:e?.showGridLines?.y),color:o.COLORS.background.base},ticks:{stepSize:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.stepSize:e.yAxis?.stepSize,fontSize:o.FONTS.caption.fontSize,color:e.xAxis.labelColor??o.COLORS.content.secondary,...r?h:{},callback:e?.ticksCallback?e?.ticksCallback:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?t=>{let a;e.isInternationalStore?a=I.truncateValueForInternationalStore(t):a=I.truncateValueForIndianStore(t);const l=e.xAxis?.axisSuffix||"";return`${a}${l}`}:e.yAxis?.axisSuffix?t=>`${t}${e.yAxis.axisSuffix}`:void 0},stacked:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?typeof e.xAxis?.stacked=="boolean"?e.xAxis?.stacked:!0:typeof e.yAxis?.stacked=="boolean"?e.yAxis?.stacked:!0}},onClick:(t,a)=>{if(!e.onBarClick)return;const l=a[0].datasetIndex,s=a[0].index,N=t.chart.data.datasets[l].label,u=t.chart.data.labels[s];e.onBarClick(u,N)},onHover:(t,a)=>{e.onBarClick&&a.length&&(t.native.target.style.cursor="pointer")}};!e.orientation||e.orientation===n.GRAPH_ORIENTATION.VERTICAL?delete C.scales.x.ticks.callback:delete C.scales.y.ticks.callback;let b;r?b=[{data:A,backgroundColor:"rgba(0,0,0,0)"}]:b=d;const G={labels:T,datasets:b};let m;r?m=[{data:A,backgroundColor:"rgba(0,0,0,0)"}]:m=k;const w={labels:e.xAxis.data.map(t=>typeof t=="string"?t:t.name),datasets:m},E=(t=!1)=>{let a;return e.allowChartPopup&&!t?a="flex-start":a="flex-end",i.jsx("div",{style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:a,flexWrap:"wrap"},children:R.map(l=>i.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"},children:[i.jsx("div",{style:{backgroundColor:l.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),i.jsx(D.BodyTiny,{color:o.COLORS.content.secondary,children:l.label})]},l.label.replace(" ","_")))})};return i.jsxs(v.GraphContainerWrapper,{style:e.wrapperStyle??{},padding:e.outerPadding,customLegend:e.customLegend,children:[e.chartHeading&&i.jsxs("div",{style:{marginBottom:24,display:"flex",justifyContent:e.hideHeading?"flex-end":"space-between"},children:[e.hideHeading!==!0&&i.jsx(D.TitleRegular,{color:e.chartHeading.color??o.COLORS.content.secondary,children:e.chartHeading.heading}),e.allowChartPopup&&i.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:i.jsx("div",{children:i.jsx(z.IconButton,{Icon:q.default,onClick:()=>{y(!0)}})})})]}),e.customLegend&&i.jsxs("div",{style:{display:"flex",flexDirection:x,justifyContent:"space-between"},children:[i.jsx(v.HeaderIconWrapper,{children:c.map((t,a)=>i.jsx("div",{children:i.jsx("div",{children:t})},a))}),E()]}),i.jsx("div",{className:"graph__wrapper",children:i.jsx("div",{style:{height:e.graphCanvasHeight??500,width:e.graphCanvasWidth??"auto"},children:i.jsx(P.Bar,{options:C,data:G})})}),g&&i.jsx(M.StyledModal,{open:g,onClose:()=>y(!1),closeOnOutsideClick:!0,headingTitle:e.chartHeading?.heading,width:"85%",children:i.jsxs("div",{className:"graph__wrapper",style:{padding:"8px"},children:[e.customLegend&&E(!0),i.jsx("div",{style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"},children:i.jsx(P.Bar,{options:C,data:w})})]})})]})};exports.StackedBarChart=Y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),q=require("../../../../assets/icons/maximize.svg.js"),f=require("chart.js"),Z=require("chartjs-plugin-datalabels"),F=require("react"),P=require("react-chartjs-2"),D=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),I=require("../utils/calcPercentage.js"),n=require("./StackedBarChart.model.js"),v=require("./StackedBarChart.styles.js"),z=require("../../../icon-button/IconButton.js"),M=require("../../../modals/styledModal.js"),W=e=>e&&typeof e=="object"&&"default"in e?e:{default:e},V=W(Z);f.Chart.register(f.CategoryScale,f.LinearScale,f.BarElement,f.Tooltip,f.Legend,V.default);const $=(e,c,x)=>{if(c.length<=x)return{truncatedData:e,truncatedLabels:c,originalData:e,originalLabels:c};const g=e.map(r=>r.slice(0,x)),y=e.map(r=>r.slice(x).reduce((h,S)=>h+S,0));g.forEach((r,h)=>r.push(y[h]));const A=c.slice(0,x);return A.push("Others"),{truncatedData:g,truncatedLabels:A,originalData:e,originalLabels:c}},Y=e=>{const{headerIcons:c=[],legendsAndIconDirection:x="row"}=e,[g,y]=F.useState(!1),A=[250,1e3,800,1500,300,600],r=e.yAxis.data.length===0,h={min:0,max:2e3,stepSize:200},S=["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],B=["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"],j=e.customBarColors?e.customBarColors:e.customColourScaleBrand||e.customColourScalePastel?e.colorSchema===n.COLOR_SCHEMA.PASTEL?e.customColourScalePastel:e.customColourScaleBrand:e.colorSchema===n.COLOR_SCHEMA.PASTEL?B:S,H=e.customHoverColour,_=F.useMemo(()=>({barPercentage:e?.barPercentage||.4,categoryPercentage:1,pointStyle:"circle",barWidth:e.barWidth,borderRadius:e?.borderRadius||void 0,...typeof e?.borderRadius=="object"?{borderSkipped:!1}:{},...e?.addBarGap?.flag?{borderWidth:{top:e?.addBarGap?.value||2,bottom:e?.addBarGap?.value||2,right:0,left:0},borderColor:"transparent"}:{}}),[e.barWidth,e?.borderRadius,e?.barPercentage,e?.addBarGap]),O={};e.yAxis.data.map(t=>{t.map(a=>{O[a.name]?O[a.name].push(a.value):O[a.name]=[a.value]})});const R=Object.keys(O).map((t,a)=>({label:t,data:O[t],backgroundColor:j?.[a],hoverBackgroundColor:H===void 0?void 0:H[a],..._}));let d;e.renderInHeightWiseManner?d=R.map((t,a)=>({...t,order:t.data.reduce((l,s)=>l+(s||0),0)})).sort((t,a)=>a.order-t.order):d=R;let T=e.xAxis.data.map(t=>typeof t=="string"?t:t.name),k=d;if(e.truncateBars){const t=$(d.map(a=>a.data),T,e.truncateBars);d.forEach((a,l)=>a.data=t.truncatedData[l]),T=t.truncatedLabels,k=t.originalData.map((a,l)=>({...d[l],data:a}))}const C={plugins:{legend:{display:!r&&!e.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!r,callbacks:{label:e.tooltipConfig?.labelCallback,title:e.tooltipConfig?.titleCallback,footer:e.tooltipConfig?.footerCallback},footerFont:e.tooltipConfig?.footerStyles?.footerFont},datalabels:{display:e.showTotal??!1,anchor:"end",align:"end",clamp:!0,formatter:(t,a)=>{const l=a.datasetIndex,s=a.chart.data.datasets;if(l!==s.length-1)return"";const N=a.dataIndex;let u=0;for(let L=0;L<s.length;L++)u+=s[L].data[N]??0;return u?u<1e3?u:(u/1e3).toString().substring(0,4)+"k":""},color:o.COLORS.content.secondary}},layout:{padding:{right:e.showTotal&&e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:e.showTotal&&e.orientation!=n.GRAPH_ORIENTATION.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!e.customLegend,labels:{usePointStyle:!0}},indexAxis:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.title:e.xAxis?.title),text:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.title:e.xAxis?.title,color:(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.yAxis?.titleColor:e.xAxis?.titleColor)??o.COLORS.content.secondary,font:{size:o.FONTS.caption.fontSize}},grid:{display:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL&&(typeof e?.showGridLines?.x>"u"?!0:e?.showGridLines?.x),color:o.COLORS.background.base},ticks:{fontSize:o.FONTS.caption.fontSize,color:e.yAxis.labelColor??o.COLORS.content.secondary,callback:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?t=>{let a;e.isInternationalStore?a=I.truncateValueForInternationalStore(t):a=I.truncateValueForIndianStore(t);const l=e.yAxis?.axisSuffix||"";return`${a}${l}`}:e.xAxis?.axisSuffix?t=>`${t}${e.xAxis.axisSuffix}`:void 0},stacked:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?typeof e.yAxis?.stacked=="boolean"?e.yAxis?.stacked:!0:typeof e.xAxis?.stacked=="boolean"?e.xAxis?.stacked:!0},y:{...e?.equalHeight?.flag?{suggestedMin:-e?.equalHeight.max,suggestedMax:e?.equalHeight.max}:{},max:e?.yAxis?.max,title:{display:!!(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.title:e.yAxis?.title),text:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.title:e.yAxis?.title,color:(e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.titleColor:e.yAxis?.titleColor)??o.COLORS.content.secondary,font:{size:o.FONTS.caption.fontSize}},grid:{display:e.orientation!==n.GRAPH_ORIENTATION.HORIZONTAL&&(typeof e?.showGridLines?.y>"u"?!0:e?.showGridLines?.y),color:o.COLORS.background.base},ticks:{stepSize:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?e.xAxis?.stepSize:e.yAxis?.stepSize,fontSize:o.FONTS.caption.fontSize,color:e.xAxis.labelColor??o.COLORS.content.secondary,...r?h:{},callback:e?.ticksCallback?e?.ticksCallback:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?t=>{let a;e.isInternationalStore?a=I.truncateValueForInternationalStore(t):a=I.truncateValueForIndianStore(t);const l=e.xAxis?.axisSuffix||"";return`${a}${l}`}:e.yAxis?.axisSuffix?t=>`${t}${e.yAxis.axisSuffix}`:void 0},stacked:e.orientation===n.GRAPH_ORIENTATION.HORIZONTAL?typeof e.xAxis?.stacked=="boolean"?e.xAxis?.stacked:!0:typeof e.yAxis?.stacked=="boolean"?e.yAxis?.stacked:!0}},onClick:(t,a)=>{if(!e.onBarClick)return;const l=a[0].datasetIndex,s=a[0].index,N=t.chart.data.datasets[l].label,u=t.chart.data.labels[s];e.onBarClick(u,N)},onHover:(t,a)=>{e.onBarClick&&a.length&&(t.native.target.style.cursor="pointer")}};!e.orientation||e.orientation===n.GRAPH_ORIENTATION.VERTICAL?delete C.scales.x.ticks.callback:delete C.scales.y.ticks.callback;let b;r?b=[{data:A,backgroundColor:"rgba(0,0,0,0)"}]:b=d;const G={labels:T,datasets:b};let m;r?m=[{data:A,backgroundColor:"rgba(0,0,0,0)"}]:m=k;const w={labels:e.xAxis.data.map(t=>typeof t=="string"?t:t.name),datasets:m},E=(t=!1)=>{let a;return e.allowChartPopup&&!t?a="flex-start":a="flex-end",i.jsx("div",{style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:a,flexWrap:"wrap"},children:R.map(l=>i.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"},children:[i.jsx("div",{style:{backgroundColor:l.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),i.jsx(D.BodyTiny,{color:o.COLORS.content.secondary,children:l.label})]},l.label.replace(" ","_")))})};return i.jsxs(v.GraphContainerWrapper,{style:e.wrapperStyle??{},padding:e.outerPadding,customLegend:e.customLegend,children:[e.chartHeading&&i.jsxs("div",{style:{marginBottom:24,display:"flex",justifyContent:e.hideHeading?"flex-end":"space-between"},children:[e.hideHeading!==!0&&i.jsx(D.TitleRegular,{color:e.chartHeading.color??o.COLORS.content.secondary,children:e.chartHeading.heading}),e.allowChartPopup&&i.jsx("div",{style:{display:"flex",justifyContent:"flex-end"},children:i.jsx("div",{children:i.jsx(z.IconButton,{Icon:q.default,onClick:()=>{y(!0)}})})})]}),e.customLegend&&i.jsxs("div",{style:{display:"flex",flexDirection:x,justifyContent:"space-between"},children:[i.jsx(v.HeaderIconWrapper,{children:c.map((t,a)=>i.jsx("div",{children:i.jsx("div",{children:t})},a))}),E()]}),i.jsx("div",{className:"graph__wrapper",children:i.jsx("div",{style:{height:e.graphCanvasHeight??500,width:e.graphCanvasWidth??"auto"},children:i.jsx(P.Bar,{options:C,data:G})})}),g&&i.jsx(M.StyledModal,{open:g,onClose:()=>y(!1),closeOnOutsideClick:!0,headingTitle:e.chartHeading?.heading,width:"85%",children:i.jsxs("div",{className:"graph__wrapper",style:{padding:"8px"},children:[e.customLegend&&E(!0),i.jsx("div",{style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"},children:i.jsx(P.Bar,{options:C,data:w})})]})})]})};exports.StackedBarChart=Y;
 //# sourceMappingURL=StackedBarChart.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"StackedBarChart.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.tsx"],"sourcesContent":["import MaximizeIcon from '@src/assets/icons/maximize.svg';\nimport {\n\tBarElement,\n\tCategoryScale,\n\tChart as ChartJS,\n\tLegend,\n\tLinearScale,\n\tTooltip,\n} from 'chart.js';\nimport ChartDataLabels from 'chartjs-plugin-datalabels';\nimport { useMemo, useState } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport { IconButton } from '@src/components/icon-button';\nimport { StyledModal } from '@src/components/modals';\nimport { BodyTiny, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS, FONTS } from '@src/constants/Theme';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from '../utils/calcPercentage';\nimport {\n\tCOLOR_SCHEMA,\n\tGRAPH_ORIENTATION,\n\tStackedBarGraphI,\n} from './StackedBarChart.model';\nimport {\n\tGraphContainerWrapper,\n\tHeaderIconWrapper,\n} from './StackedBarChart.styles';\n\nChartJS.register(\n\tCategoryScale,\n\tLinearScale,\n\tBarElement,\n\tTooltip,\n\tLegend,\n\tChartDataLabels,\n);\n\nconst truncateBars = (data, labels, limit) => {\n\tif (labels.length <= limit)\n\t\treturn {\n\t\t\ttruncatedData: data,\n\t\t\ttruncatedLabels: labels,\n\t\t\toriginalData: data,\n\t\t\toriginalLabels: labels,\n\t\t};\n\tconst truncatedData = data.map((d) => d.slice(0, limit));\n\tconst othersData = data.map((d) =>\n\t\td.slice(limit).reduce((acc, curr) => acc + curr, 0),\n\t);\n\ttruncatedData.forEach((d, i) => d.push(othersData[i]));\n\tconst truncatedLabels = labels.slice(0, limit);\n\ttruncatedLabels.push('Others');\n\treturn {\n\t\ttruncatedData,\n\t\ttruncatedLabels,\n\t\toriginalData: data,\n\t\toriginalLabels: labels,\n\t};\n};\n\nexport const StackedBarChart = (props: StackedBarGraphI) => {\n\tconst { headerIcons = [], legendsAndIconDirection = 'row' } = props;\n\tconst [showPopup, setShowPopup] = useState(false);\n\tconst dummyValues = [250, 1000, 800, 1500, 300, 600];\n\tconst noDataPresent = props.yAxis.data.length === 0;\n\tconst yAxisConfigForNoData = {\n\t\tmin: 0,\n\t\tmax: 2000,\n\t\tstepSize: 200,\n\t};\n\n\tconst colorScaleBrand = [\n\t\t'#5E07BB',\n\t\t'#9E77ED',\n\t\t'#D2AEFF',\n\t\t'#F7D7FF',\n\t\t'#CDE1FF',\n\t\t'#92AFFA',\n\t\t'#3935E1',\n\t];\n\n\tconst colourScalePastel = [\n\t\t'#E6C7FF',\n\t\t'#FEC6C6',\n\t\t'#FEDEF3',\n\t\t'#DEEFFF',\n\t\t'#FFD8B1',\n\t\t'#C7E5FF',\n\t\t'#FFD3E6',\n\t\t'#C9FFE5',\n\t\t'#FFE3C7',\n\t\t'#D9D9FF',\n\t];\n\n\t// Determine which color scale to use based on props\n\tconst getColorScale = () => {\n\t\t// If custom bar colors are provided, use them\n\t\tif (props.customBarColors) return props.customBarColors;\n\n\t\t// If custom brand or pastel colors are provided\n\t\tif (props.customColourScaleBrand \|\| props.customColourScalePastel) {\n\t\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\t\treturn props.customColourScalePastel;\n\t\t\t} else {\n\t\t\t\treturn props.customColourScaleBrand;\n\t\t\t}\n\t\t}\n\n\t\t// Use default color scales based on schema\n\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\treturn colourScalePastel;\n\t\t} else {\n\t\t\treturn colorScaleBrand;\n\t\t}\n\t};\n\n\tconst colourScale = getColorScale();\n\tconst hoverColourScale = props.customHoverColour;\n\n\t// Memoized bar configuration settings\n\tconst barConfig = useMemo(\n\t\t() => ({\n\t\t\tbarPercentage: props?.barPercentage \|\| 0.4,\n\t\t\tcategoryPercentage: props?.categoryPercentage ?? 1,\n\t\t\tpointStyle: 'circle',\n\t\t\tbarWidth: props.barWidth,\n\t\t\tborderRadius: props?.borderRadius \|\| undefined,\n\t\t\t// If borderRadius is an object, disable border skipping\n\t\t\t...(typeof props?.borderRadius === 'object'\n\t\t\t\t? { borderSkipped: false }\n\t\t\t\t: {}),\n\t\t\t// If bar gap is enabled, add transparent borders for spacing\n\t\t\t...(props?.addBarGap?.flag\n\t\t\t\t? {\n\t\t\t\t\t\tborderWidth: {\n\t\t\t\t\t\t\ttop: props?.addBarGap?.value \|\| 2,\n\t\t\t\t\t\t\tbottom: props?.addBarGap?.value \|\| 2,\n\t\t\t\t\t\t\tright: 0,\n\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tborderColor: 'transparent',\n\t\t\t\t }\n\t\t\t\t: {}),\n\t\t}),\n\t\t[\n\t\t\tprops.barWidth,\n\t\t\tprops?.borderRadius,\n\t\t\tprops?.barPercentage,\n\t\t\tprops?.addBarGap,\n\t\t],\n\t);\n\n\t// Transform y-axis data into a map grouped by dataset name\n\tconst dataSetMap = {};\n\tprops.yAxis.data.map((ele) => {\n\t\tele.map((obj) => {\n\t\t\tif (dataSetMap[obj.name]) {\n\t\t\t\tdataSetMap[obj.name].push(obj.value);\n\t\t\t} else {\n\t\t\t\tdataSetMap[obj.name] = [obj.value];\n\t\t\t}\n\t\t});\n\t});\n\n\t// Create datasets for chart with colors and bar configuration\n\tconst yAxisStackedData = Object.keys(dataSetMap).map((key, ind) => {\n\t\treturn {\n\t\t\tlabel: key,\n\t\t\tdata: dataSetMap[key],\n\t\t\tbackgroundColor: colourScale?.[ind],\n\t\t\thoverBackgroundColor:\n\t\t\t\thoverColourScale === undefined ? undefined : hoverColourScale[ind],\n\t\t\t...barConfig,\n\t\t};\n\t});\n\n\t// Conditionally reorder datasets so smaller values are drawn on top (for overlapping bars)\n\tlet reorderedYAxisData;\n\tif (props.renderInHeightWiseManner) {\n\t\treorderedYAxisData = yAxisStackedData\n\t\t\t.map((dataset, datasetIndex) => {\n\t\t\t\treturn {\n\t\t\t\t\t...dataset,\n\t\t\t\t\t// Add order property: higher values = drawn first (behind)\n\t\t\t\t\torder: dataset.data.reduce((sum, val) => sum + (val \|\| 0), 0),\n\t\t\t\t};\n\t\t\t})\n\t\t\t.sort((a, b) => b.order - a.order);\n\t} else {\n\t\treorderedYAxisData = yAxisStackedData;\n\t}\n\n\t// Extract labels from x-axis data (either string or object with name property)\n\tlet labels = props.xAxis.data.map((data) =>\n\t\ttypeof data === 'string' ? data : data.name,\n\t);\n\n\t// Keep track of original data before any truncation\n\tlet originalData = reorderedYAxisData;\n\t// Truncate bars if limit is specified\n\tif (props.truncateBars) {\n\t\tconst truncated = truncateBars(\n\t\t\treorderedYAxisData.map((d) => d.data),\n\t\t\tlabels,\n\t\t\tprops.truncateBars,\n\t\t);\n\t\treorderedYAxisData.forEach((d, i) => (d.data = truncated.truncatedData[i]));\n\t\tlabels = truncated.truncatedLabels;\n\t\toriginalData = truncated.originalData.map((data, i) => ({\n\t\t\t...reorderedYAxisData[i],\n\t\t\tdata,\n\t\t}));\n\t}\n\n\tconst options = {\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\t// Show legend only if data exists and custom legend is not used\n\t\t\t\tdisplay: !noDataPresent && !props.customLegend,\n\t\t\t\tlabels: {\n\t\t\t\t\tusePointStyle: true,\n\t\t\t\t\tfontSize: 2,\n\t\t\t\t},\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\t// Enable tooltip only when data is present\n\t\t\t\tenabled: !noDataPresent,\n\t\t\t\tcallbacks: {\n\t\t\t\t\tlabel: props.tooltipConfig?.labelCallback,\n\t\t\t\t\ttitle: props.tooltipConfig?.titleCallback,\n\t\t\t\t\tfooter: props.tooltipConfig?.footerCallback,\n\t\t\t\t},\n\t\t\t\tfooterFont: props.tooltipConfig?.footerStyles?.footerFont,\n\t\t\t},\n\t\t\tdatalabels: {\n\t\t\t\tdisplay: props.showTotal ?? false,\n\t\t\t\tanchor: 'end' as const,\n\t\t\t\talign: 'end' as const,\n\t\t\t\tclamp: true,\n\t\t\t\t// Format total value label for stacked bars\n\t\t\t\tformatter: (_, context) => {\n\t\t\t\t\tconst datasetIndex = context.datasetIndex;\n\t\t\t\t\tconst datasets = context.chart.data.datasets;\n\t\t\t\t\t// Only show label on the last dataset (top of stack)\n\t\t\t\t\tif (datasetIndex !== datasets.length - 1) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t\tconst dataIndex = context.dataIndex;\n\t\t\t\t\t// Calculate sum across all datasets for this data point\n\t\t\t\t\tlet sum = 0;\n\t\t\t\t\tfor (let i = 0; i < datasets.length; i++) {\n\t\t\t\t\t\tsum += datasets[i].data[dataIndex] ?? 0;\n\t\t\t\t\t}\n\t\t\t\t\tif (!sum) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t\t// Format values under 1000 as-is, others as 'k' format\n\t\t\t\t\tif (sum < 1000) {\n\t\t\t\t\t\treturn sum;\n\t\t\t\t\t}\n\t\t\t\t\treturn (sum / 1000).toString().substring(0, 4) + 'k';\n\t\t\t\t},\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tlayout: {\n\t\t\tpadding: {\n\t\t\t\t// Add right padding for horizontal orientation when showing totals\n\t\t\t\tright:\n\t\t\t\t\tprops.showTotal && props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? 50\n\t\t\t\t\t\t: 0,\n\t\t\t\t// Add top padding for non-horizontal orientation when showing totals\n\t\t\t\ttop:\n\t\t\t\t\tprops.showTotal && props.orientation != GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? 50\n\t\t\t\t\t\t: 0,\n\t\t\t},\n\t\t},\n\t\tresponsive: true,\n\t\tmaintainAspectRatio: false,\n\t\tlegend: {\n\t\t\tdisplay: !props.customLegend,\n\t\t\tlabels: {\n\t\t\t\tusePointStyle: true,\n\t\t\t},\n\t\t},\n\t\t// Set index axis based on orientation (y for horizontal, x for vertical)\n\t\tindexAxis: (props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t? 'y'\n\t\t\t: 'x') as 'y' \| 'x',\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, x-axis shows y-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.yAxis?.title\n\t\t\t\t\t\t: props.xAxis?.title),\n\t\t\t\t\ttext:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.yAxis?.title\n\t\t\t\t\t\t\t: props.xAxis?.title,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.yAxis?.titleColor\n\t\t\t\t\t\t\t: props.xAxis?.titleColor) ?? COLORS.content.secondary,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\t// Show grid lines for horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.x === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.x),\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.yAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t// Format tick labels based on orientation\n\t\t\t\t\tcallback:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tconst suffix = props.yAxis?.axisSuffix \|\| '';\n\t\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: props.xAxis?.axisSuffix\n\t\t\t\t\t\t\t? (value) => `${value}${props.xAxis.axisSuffix}`\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if x-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t\ty: {\n\t\t\t\t// Set equal height if flag is enabled (for symmetric charts)\n\t\t\t\t...(props?.equalHeight?.flag\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tsuggestedMin: -props?.equalHeight.max, // Set negative side\n\t\t\t\t\t\t\tsuggestedMax: props?.equalHeight.max, // Set positive side\n\t\t\t\t\t }\n\t\t\t\t\t: {}),\n\t\t\t\tmax: props?.yAxis?.max,\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, y-axis shows x-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.xAxis?.title\n\t\t\t\t\t\t: props.yAxis?.title),\n\t\t\t\t\ttext:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.xAxis?.title\n\t\t\t\t\t\t\t: props.yAxis?.title,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.xAxis?.titleColor\n\t\t\t\t\t\t\t: props.yAxis?.titleColor) ?? COLORS.content.secondary,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\t// Show grid lines for non-horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation !== GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.y === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.y),\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tstepSize:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.xAxis?.stepSize\n\t\t\t\t\t\t\t: props.yAxis?.stepSize,\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.xAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t// Apply no-data config if no data exists\n\t\t\t\t\t...(noDataPresent ? yAxisConfigForNoData : {}),\n\t\t\t\t\t// Use custom callback if provided, otherwise format based on orientation\n\t\t\t\t\tcallback: props?.ticksCallback\n\t\t\t\t\t\t? props?.ticksCallback\n\t\t\t\t\t\t: props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tconst suffix = props.xAxis?.axisSuffix \|\| '';\n\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: props.yAxis?.axisSuffix\n\t\t\t\t\t\t? (value) => `${value}${props.yAxis.axisSuffix}`\n\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if y-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t},\n\t\t// Handle bar click events\n\t\tonClick: (e, activeEls) => {\n\t\t\tif (!props.onBarClick) return;\n\t\t\tconst datasetIndex = activeEls[0].datasetIndex;\n\t\t\tconst dataIndex = activeEls[0].index;\n\t\t\tconst yAxisLabel = e.chart.data.datasets[datasetIndex].label;\n\t\t\tconst xAxisLabel = e.chart.data.labels[dataIndex];\n\t\t\tprops.onBarClick(xAxisLabel, yAxisLabel);\n\t\t},\n\t\t// Change cursor to pointer on hover when bar is clickable\n\t\tonHover: (e, activeEls) => {\n\t\t\tif (!props.onBarClick) return;\n\t\t\tif (activeEls.length) e.native.target.style.cursor = 'pointer';\n\t\t},\n\t};\n\n\t// Clean up tick callbacks based on orientation\n\tif (!props.orientation \|\| props.orientation === GRAPH_ORIENTATION.VERTICAL) {\n\t\tdelete options.scales.x.ticks['callback'];\n\t} else {\n\t\tdelete options.scales.y.ticks['callback'];\n\t}\n\n\t// Prepare data for the chart\n\tlet chartDatasets;\n\tif (noDataPresent) {\n\t\tchartDatasets = [{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' }];\n\t} else {\n\t\tchartDatasets = reorderedYAxisData;\n\t}\n\n\tconst data = {\n\t\tlabels: labels,\n\t\tdatasets: chartDatasets,\n\t};\n\n\t// Prepare original chart data (used for popup modal)\n\tlet originalChartDatasets;\n\tif (noDataPresent) {\n\t\toriginalChartDatasets = [\n\t\t\t{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' },\n\t\t];\n\t} else {\n\t\toriginalChartDatasets = originalData;\n\t}\n\n\tconst originalChartData = {\n\t\tlabels: props.xAxis.data.map((data) =>\n\t\t\ttypeof data === 'string' ? data : data.name,\n\t\t),\n\t\tdatasets: originalChartDatasets,\n\t};\n\n\t// Render custom legend with color boxes\n\tconst renderLegend = (isPopup = false) => {\n\t\t// Determine justification based on whether popup is allowed and current context\n\t\tlet justification;\n\t\tif (props.allowChartPopup && !isPopup) {\n\t\t\tjustification = 'flex-start';\n\t\t} else {\n\t\t\tjustification = 'flex-end';\n\t\t}\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\toverflowY: 'scroll',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\tgap: '10px',\n\t\t\t\t\tpadding: '0px 24px 12px 24px',\n\t\t\t\t\tjustifyContent: justification,\n\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{yAxisStackedData.map((_item) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={_item.label.replace(' ', '_')}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\tgap: '8px',\n\t\t\t\t\t\t\t\tmarginTop: '4px',\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\tbackgroundColor: _item.backgroundColor,\n\t\t\t\t\t\t\t\t\twidth: '16px',\n\t\t\t\t\t\t\t\t\theight: '16px',\n\t\t\t\t\t\t\t\t\tborderRadius: '2px',\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<BodyTiny color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t{_item.label}\n\t\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t);\n\t};\n\n\treturn (\n\t\t<GraphContainerWrapper\n\t\t\tstyle={props.wrapperStyle ?? {}}\n\t\t\tpadding={props.outerPadding}\n\t\t\tcustomLegend={props.customLegend}\n\t\t>\n\t\t\t{props.chartHeading && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 24,\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: props.hideHeading ? 'flex-end' : 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{props.hideHeading !== true && (\n\t\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\t\tcolor={props.chartHeading.color ?? COLORS.content.secondary}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{props.chartHeading.heading}\n\t\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t)}\n\t\t\t\t\t{props.allowChartPopup && (\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\tjustifyContent: 'flex-end',\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\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={MaximizeIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetShowPopup(true);\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</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.customLegend && (\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: legendsAndIconDirection,\n\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<HeaderIconWrapper>\n\t\t\t\t\t\t{headerIcons.map((icon, index) => (\n\t\t\t\t\t\t\t<div key={index}>\n\t\t\t\t\t\t\t\t<div>{icon}</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</HeaderIconWrapper>\n\t\t\t\t\t{renderLegend()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className=\"graph__wrapper\">\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\theight: props.graphCanvasHeight ?? 500,\n\t\t\t\t\t\twidth: props.graphCanvasWidth ?? 'auto',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Bar options={options} data={data} />\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t{showPopup && (\n\t\t\t\t<StyledModal\n\t\t\t\t\topen={showPopup}\n\t\t\t\t\tonClose={() => setShowPopup(false)}\n\t\t\t\t\tcloseOnOutsideClick\n\t\t\t\t\theadingTitle={props.chartHeading?.heading}\n\t\t\t\t\twidth=\"85%\"\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"graph__wrapper\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpadding: '8px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.customLegend && renderLegend(true)}\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\theight: '70vh',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tpadding: '16px',\n\t\t\t\t\t\t\t\tborderRadius: '8px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Bar options={options} data={originalChartData} />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</GraphContainerWrapper>\n\t);\n};\n"],"names":["ChartJS","CategoryScale","LinearScale","BarElement","Tooltip","Legend","ChartDataLabels","truncateBars","data","labels","limit","truncatedData","d","othersData","acc","curr","i","truncatedLabels","StackedBarChart","props","headerIcons","legendsAndIconDirection","showPopup","setShowPopup","useState","dummyValues","noDataPresent","yAxisConfigForNoData","colorScaleBrand","colourScalePastel","colourScale","COLOR_SCHEMA","hoverColourScale","barConfig","useMemo","dataSetMap","ele","obj","yAxisStackedData","key","ind","reorderedYAxisData","dataset","datasetIndex","sum","val","a","b","originalData","truncated","options","_","context","datasets","dataIndex","COLORS","GRAPH_ORIENTATION","FONTS","value","formattedValue","truncateValueForInternationalStore","truncateValueForIndianStore","suffix","e","activeEls","yAxisLabel","xAxisLabel","chartDatasets","originalChartDatasets","originalChartData","renderLegend","isPopup","justification","jsx","_item","jsxs","BodyTiny","GraphContainerWrapper","TitleRegular","IconButton","MaximizeIcon","HeaderIconWrapper","icon","index","Bar","StyledModal"],"mappings":"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"}
1	+ {"version":3,"file":"StackedBarChart.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.tsx"],"sourcesContent":["import MaximizeIcon from '@src/assets/icons/maximize.svg';\nimport {\n\tBarElement,\n\tCategoryScale,\n\tChart as ChartJS,\n\tLegend,\n\tLinearScale,\n\tTooltip,\n} from 'chart.js';\nimport ChartDataLabels from 'chartjs-plugin-datalabels';\nimport { useMemo, useState } from 'react';\nimport { Bar } from 'react-chartjs-2';\nimport { IconButton } from '@src/components/icon-button';\nimport { StyledModal } from '@src/components/modals';\nimport { BodyTiny, TitleRegular } from '@src/components/TypographyStyle';\nimport { COLORS, FONTS } from '@src/constants/Theme';\nimport {\n\ttruncateValueForIndianStore,\n\ttruncateValueForInternationalStore,\n} from '../utils/calcPercentage';\nimport {\n\tCOLOR_SCHEMA,\n\tGRAPH_ORIENTATION,\n\tStackedBarGraphI,\n} from './StackedBarChart.model';\nimport {\n\tGraphContainerWrapper,\n\tHeaderIconWrapper,\n} from './StackedBarChart.styles';\n\nChartJS.register(\n\tCategoryScale,\n\tLinearScale,\n\tBarElement,\n\tTooltip,\n\tLegend,\n\tChartDataLabels,\n);\n\nconst truncateBars = (data, labels, limit) => {\n\tif (labels.length <= limit)\n\t\treturn {\n\t\t\ttruncatedData: data,\n\t\t\ttruncatedLabels: labels,\n\t\t\toriginalData: data,\n\t\t\toriginalLabels: labels,\n\t\t};\n\tconst truncatedData = data.map((d) => d.slice(0, limit));\n\tconst othersData = data.map((d) =>\n\t\td.slice(limit).reduce((acc, curr) => acc + curr, 0),\n\t);\n\ttruncatedData.forEach((d, i) => d.push(othersData[i]));\n\tconst truncatedLabels = labels.slice(0, limit);\n\ttruncatedLabels.push('Others');\n\treturn {\n\t\ttruncatedData,\n\t\ttruncatedLabels,\n\t\toriginalData: data,\n\t\toriginalLabels: labels,\n\t};\n};\n\nexport const StackedBarChart = (props: StackedBarGraphI) => {\n\tconst { headerIcons = [], legendsAndIconDirection = 'row' } = props;\n\tconst [showPopup, setShowPopup] = useState(false);\n\tconst dummyValues = [250, 1000, 800, 1500, 300, 600];\n\tconst noDataPresent = props.yAxis.data.length === 0;\n\tconst yAxisConfigForNoData = {\n\t\tmin: 0,\n\t\tmax: 2000,\n\t\tstepSize: 200,\n\t};\n\n\tconst colorScaleBrand = [\n\t\t'#5E07BB',\n\t\t'#9E77ED',\n\t\t'#D2AEFF',\n\t\t'#F7D7FF',\n\t\t'#CDE1FF',\n\t\t'#92AFFA',\n\t\t'#3935E1',\n\t];\n\n\tconst colourScalePastel = [\n\t\t'#E6C7FF',\n\t\t'#FEC6C6',\n\t\t'#FEDEF3',\n\t\t'#DEEFFF',\n\t\t'#FFD8B1',\n\t\t'#C7E5FF',\n\t\t'#FFD3E6',\n\t\t'#C9FFE5',\n\t\t'#FFE3C7',\n\t\t'#D9D9FF',\n\t];\n\n\t// Determine which color scale to use based on props\n\tconst getColorScale = () => {\n\t\t// If custom bar colors are provided, use them\n\t\tif (props.customBarColors) return props.customBarColors;\n\n\t\t// If custom brand or pastel colors are provided\n\t\tif (props.customColourScaleBrand \|\| props.customColourScalePastel) {\n\t\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\t\treturn props.customColourScalePastel;\n\t\t\t} else {\n\t\t\t\treturn props.customColourScaleBrand;\n\t\t\t}\n\t\t}\n\n\t\t// Use default color scales based on schema\n\t\tif (props.colorSchema === COLOR_SCHEMA.PASTEL) {\n\t\t\treturn colourScalePastel;\n\t\t} else {\n\t\t\treturn colorScaleBrand;\n\t\t}\n\t};\n\n\tconst colourScale = getColorScale();\n\tconst hoverColourScale = props.customHoverColour;\n\n\t// Memoized bar configuration settings\n\tconst barConfig = useMemo(\n\t\t() => ({\n\t\t\tbarPercentage: props?.barPercentage \|\| 0.4,\n\t\t\tcategoryPercentage: 1,\n\t\t\tpointStyle: 'circle',\n\t\t\tbarWidth: props.barWidth,\n\t\t\tborderRadius: props?.borderRadius \|\| undefined,\n\t\t\t// If borderRadius is an object, disable border skipping\n\t\t\t...(typeof props?.borderRadius === 'object'\n\t\t\t\t? { borderSkipped: false }\n\t\t\t\t: {}),\n\t\t\t// If bar gap is enabled, add transparent borders for spacing\n\t\t\t...(props?.addBarGap?.flag\n\t\t\t\t? {\n\t\t\t\t\t\tborderWidth: {\n\t\t\t\t\t\t\ttop: props?.addBarGap?.value \|\| 2,\n\t\t\t\t\t\t\tbottom: props?.addBarGap?.value \|\| 2,\n\t\t\t\t\t\t\tright: 0,\n\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tborderColor: 'transparent',\n\t\t\t\t }\n\t\t\t\t: {}),\n\t\t}),\n\t\t[\n\t\t\tprops.barWidth,\n\t\t\tprops?.borderRadius,\n\t\t\tprops?.barPercentage,\n\t\t\tprops?.addBarGap,\n\t\t],\n\t);\n\n\t// Transform y-axis data into a map grouped by dataset name\n\tconst dataSetMap = {};\n\tprops.yAxis.data.map((ele) => {\n\t\tele.map((obj) => {\n\t\t\tif (dataSetMap[obj.name]) {\n\t\t\t\tdataSetMap[obj.name].push(obj.value);\n\t\t\t} else {\n\t\t\t\tdataSetMap[obj.name] = [obj.value];\n\t\t\t}\n\t\t});\n\t});\n\n\t// Create datasets for chart with colors and bar configuration\n\tconst yAxisStackedData = Object.keys(dataSetMap).map((key, ind) => {\n\t\treturn {\n\t\t\tlabel: key,\n\t\t\tdata: dataSetMap[key],\n\t\t\tbackgroundColor: colourScale?.[ind],\n\t\t\thoverBackgroundColor:\n\t\t\t\thoverColourScale === undefined ? undefined : hoverColourScale[ind],\n\t\t\t...barConfig,\n\t\t};\n\t});\n\n\t// Conditionally reorder datasets so smaller values are drawn on top (for overlapping bars)\n\tlet reorderedYAxisData;\n\tif (props.renderInHeightWiseManner) {\n\t\treorderedYAxisData = yAxisStackedData\n\t\t\t.map((dataset, datasetIndex) => {\n\t\t\t\treturn {\n\t\t\t\t\t...dataset,\n\t\t\t\t\t// Add order property: higher values = drawn first (behind)\n\t\t\t\t\torder: dataset.data.reduce((sum, val) => sum + (val \|\| 0), 0),\n\t\t\t\t};\n\t\t\t})\n\t\t\t.sort((a, b) => b.order - a.order);\n\t} else {\n\t\treorderedYAxisData = yAxisStackedData;\n\t}\n\n\t// Extract labels from x-axis data (either string or object with name property)\n\tlet labels = props.xAxis.data.map((data) =>\n\t\ttypeof data === 'string' ? data : data.name,\n\t);\n\n\t// Keep track of original data before any truncation\n\tlet originalData = reorderedYAxisData;\n\t// Truncate bars if limit is specified\n\tif (props.truncateBars) {\n\t\tconst truncated = truncateBars(\n\t\t\treorderedYAxisData.map((d) => d.data),\n\t\t\tlabels,\n\t\t\tprops.truncateBars,\n\t\t);\n\t\treorderedYAxisData.forEach((d, i) => (d.data = truncated.truncatedData[i]));\n\t\tlabels = truncated.truncatedLabels;\n\t\toriginalData = truncated.originalData.map((data, i) => ({\n\t\t\t...reorderedYAxisData[i],\n\t\t\tdata,\n\t\t}));\n\t}\n\n\tconst options = {\n\t\tplugins: {\n\t\t\tlegend: {\n\t\t\t\t// Show legend only if data exists and custom legend is not used\n\t\t\t\tdisplay: !noDataPresent && !props.customLegend,\n\t\t\t\tlabels: {\n\t\t\t\t\tusePointStyle: true,\n\t\t\t\t\tfontSize: 2,\n\t\t\t\t},\n\t\t\t},\n\t\t\ttooltip: {\n\t\t\t\t// Enable tooltip only when data is present\n\t\t\t\tenabled: !noDataPresent,\n\t\t\t\tcallbacks: {\n\t\t\t\t\tlabel: props.tooltipConfig?.labelCallback,\n\t\t\t\t\ttitle: props.tooltipConfig?.titleCallback,\n\t\t\t\t\tfooter: props.tooltipConfig?.footerCallback,\n\t\t\t\t},\n\t\t\t\tfooterFont: props.tooltipConfig?.footerStyles?.footerFont,\n\t\t\t},\n\t\t\tdatalabels: {\n\t\t\t\tdisplay: props.showTotal ?? false,\n\t\t\t\tanchor: 'end' as const,\n\t\t\t\talign: 'end' as const,\n\t\t\t\tclamp: true,\n\t\t\t\t// Format total value label for stacked bars\n\t\t\t\tformatter: (_, context) => {\n\t\t\t\t\tconst datasetIndex = context.datasetIndex;\n\t\t\t\t\tconst datasets = context.chart.data.datasets;\n\t\t\t\t\t// Only show label on the last dataset (top of stack)\n\t\t\t\t\tif (datasetIndex !== datasets.length - 1) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t\tconst dataIndex = context.dataIndex;\n\t\t\t\t\t// Calculate sum across all datasets for this data point\n\t\t\t\t\tlet sum = 0;\n\t\t\t\t\tfor (let i = 0; i < datasets.length; i++) {\n\t\t\t\t\t\tsum += datasets[i].data[dataIndex] ?? 0;\n\t\t\t\t\t}\n\t\t\t\t\tif (!sum) {\n\t\t\t\t\t\treturn '';\n\t\t\t\t\t}\n\t\t\t\t\t// Format values under 1000 as-is, others as 'k' format\n\t\t\t\t\tif (sum < 1000) {\n\t\t\t\t\t\treturn sum;\n\t\t\t\t\t}\n\t\t\t\t\treturn (sum / 1000).toString().substring(0, 4) + 'k';\n\t\t\t\t},\n\t\t\t\tcolor: COLORS.content.secondary,\n\t\t\t},\n\t\t},\n\t\tlayout: {\n\t\t\tpadding: {\n\t\t\t\t// Add right padding for horizontal orientation when showing totals\n\t\t\t\tright:\n\t\t\t\t\tprops.showTotal && props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? 50\n\t\t\t\t\t\t: 0,\n\t\t\t\t// Add top padding for non-horizontal orientation when showing totals\n\t\t\t\ttop:\n\t\t\t\t\tprops.showTotal && props.orientation != GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? 50\n\t\t\t\t\t\t: 0,\n\t\t\t},\n\t\t},\n\t\tresponsive: true,\n\t\tmaintainAspectRatio: false,\n\t\tlegend: {\n\t\t\tdisplay: !props.customLegend,\n\t\t\tlabels: {\n\t\t\t\tusePointStyle: true,\n\t\t\t},\n\t\t},\n\t\t// Set index axis based on orientation (y for horizontal, x for vertical)\n\t\tindexAxis: (props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t? 'y'\n\t\t\t: 'x') as 'y' \| 'x',\n\t\tscales: {\n\t\t\tx: {\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, x-axis shows y-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.yAxis?.title\n\t\t\t\t\t\t: props.xAxis?.title),\n\t\t\t\t\ttext:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.yAxis?.title\n\t\t\t\t\t\t\t: props.xAxis?.title,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.yAxis?.titleColor\n\t\t\t\t\t\t\t: props.xAxis?.titleColor) ?? COLORS.content.secondary,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\t// Show grid lines for horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.x === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.x),\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.yAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t// Format tick labels based on orientation\n\t\t\t\t\tcallback:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tconst suffix = props.yAxis?.axisSuffix \|\| '';\n\t\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: props.xAxis?.axisSuffix\n\t\t\t\t\t\t\t? (value) => `${value}${props.xAxis.axisSuffix}`\n\t\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if x-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t\ty: {\n\t\t\t\t// Set equal height if flag is enabled (for symmetric charts)\n\t\t\t\t...(props?.equalHeight?.flag\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tsuggestedMin: -props?.equalHeight.max, // Set negative side\n\t\t\t\t\t\t\tsuggestedMax: props?.equalHeight.max, // Set positive side\n\t\t\t\t\t }\n\t\t\t\t\t: {}),\n\t\t\t\tmax: props?.yAxis?.max,\n\t\t\t\ttitle: {\n\t\t\t\t\t// For horizontal orientation, y-axis shows x-axis data and vice versa\n\t\t\t\t\tdisplay: !!(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? props.xAxis?.title\n\t\t\t\t\t\t: props.yAxis?.title),\n\t\t\t\t\ttext:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.xAxis?.title\n\t\t\t\t\t\t\t: props.yAxis?.title,\n\t\t\t\t\tcolor:\n\t\t\t\t\t\t(props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.xAxis?.titleColor\n\t\t\t\t\t\t\t: props.yAxis?.titleColor) ?? COLORS.content.secondary,\n\t\t\t\t\tfont: { size: FONTS.caption.fontSize },\n\t\t\t\t},\n\t\t\t\tgrid: {\n\t\t\t\t\t// Show grid lines for non-horizontal orientation (default true unless specified)\n\t\t\t\t\tdisplay:\n\t\t\t\t\t\tprops.orientation !== GRAPH_ORIENTATION.HORIZONTAL &&\n\t\t\t\t\t\t(typeof props?.showGridLines?.y === 'undefined'\n\t\t\t\t\t\t\t? true\n\t\t\t\t\t\t\t: props?.showGridLines?.y),\n\t\t\t\t\tcolor: COLORS.background.base,\n\t\t\t\t},\n\t\t\t\tticks: {\n\t\t\t\t\tstepSize:\n\t\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t\t? props.xAxis?.stepSize\n\t\t\t\t\t\t\t: props.yAxis?.stepSize,\n\t\t\t\t\tfontSize: FONTS.caption.fontSize,\n\t\t\t\t\tcolor: props.xAxis.labelColor ?? COLORS.content.secondary,\n\t\t\t\t\t// Apply no-data config if no data exists\n\t\t\t\t\t...(noDataPresent ? yAxisConfigForNoData : {}),\n\t\t\t\t\t// Use custom callback if provided, otherwise format based on orientation\n\t\t\t\t\tcallback: props?.ticksCallback\n\t\t\t\t\t\t? props?.ticksCallback\n\t\t\t\t\t\t: props.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? (value) => {\n\t\t\t\t\t\t\t\t// For horizontal, format and truncate based on store type\n\t\t\t\t\t\t\t\tlet formattedValue;\n\t\t\t\t\t\t\t\tif (props.isInternationalStore) {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForInternationalStore(value);\n\t\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\t\tformattedValue = truncateValueForIndianStore(value);\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tconst suffix = props.xAxis?.axisSuffix \|\| '';\n\t\t\t\t\t\t\t\treturn `${formattedValue}${suffix}`;\n\t\t\t\t\t\t }\n\t\t\t\t\t\t: props.yAxis?.axisSuffix\n\t\t\t\t\t\t? (value) => `${value}${props.yAxis.axisSuffix}`\n\t\t\t\t\t\t: undefined,\n\t\t\t\t},\n\t\t\t\t// Determine if y-axis should be stacked (default true)\n\t\t\t\tstacked:\n\t\t\t\t\tprops.orientation === GRAPH_ORIENTATION.HORIZONTAL\n\t\t\t\t\t\t? typeof props.xAxis?.stacked === 'boolean'\n\t\t\t\t\t\t\t? props.xAxis?.stacked\n\t\t\t\t\t\t\t: true\n\t\t\t\t\t\t: typeof props.yAxis?.stacked === 'boolean'\n\t\t\t\t\t\t? props.yAxis?.stacked\n\t\t\t\t\t\t: true,\n\t\t\t},\n\t\t},\n\t\t// Handle bar click events\n\t\tonClick: (e, activeEls) => {\n\t\t\tif (!props.onBarClick) return;\n\t\t\tconst datasetIndex = activeEls[0].datasetIndex;\n\t\t\tconst dataIndex = activeEls[0].index;\n\t\t\tconst yAxisLabel = e.chart.data.datasets[datasetIndex].label;\n\t\t\tconst xAxisLabel = e.chart.data.labels[dataIndex];\n\t\t\tprops.onBarClick(xAxisLabel, yAxisLabel);\n\t\t},\n\t\t// Change cursor to pointer on hover when bar is clickable\n\t\tonHover: (e, activeEls) => {\n\t\t\tif (!props.onBarClick) return;\n\t\t\tif (activeEls.length) e.native.target.style.cursor = 'pointer';\n\t\t},\n\t};\n\n\t// Clean up tick callbacks based on orientation\n\tif (!props.orientation \|\| props.orientation === GRAPH_ORIENTATION.VERTICAL) {\n\t\tdelete options.scales.x.ticks['callback'];\n\t} else {\n\t\tdelete options.scales.y.ticks['callback'];\n\t}\n\n\t// Prepare data for the chart\n\tlet chartDatasets;\n\tif (noDataPresent) {\n\t\tchartDatasets = [{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' }];\n\t} else {\n\t\tchartDatasets = reorderedYAxisData;\n\t}\n\n\tconst data = {\n\t\tlabels: labels,\n\t\tdatasets: chartDatasets,\n\t};\n\n\t// Prepare original chart data (used for popup modal)\n\tlet originalChartDatasets;\n\tif (noDataPresent) {\n\t\toriginalChartDatasets = [\n\t\t\t{ data: dummyValues, backgroundColor: 'rgba(0,0,0,0)' },\n\t\t];\n\t} else {\n\t\toriginalChartDatasets = originalData;\n\t}\n\n\tconst originalChartData = {\n\t\tlabels: props.xAxis.data.map((data) =>\n\t\t\ttypeof data === 'string' ? data : data.name,\n\t\t),\n\t\tdatasets: originalChartDatasets,\n\t};\n\n\t// Render custom legend with color boxes\n\tconst renderLegend = (isPopup = false) => {\n\t\t// Determine justification based on whether popup is allowed and current context\n\t\tlet justification;\n\t\tif (props.allowChartPopup && !isPopup) {\n\t\t\tjustification = 'flex-start';\n\t\t} else {\n\t\t\tjustification = 'flex-end';\n\t\t}\n\n\t\treturn (\n\t\t\t<div\n\t\t\t\tstyle={{\n\t\t\t\t\toverflowY: 'scroll',\n\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\tflexDirection: 'row',\n\t\t\t\t\tgap: '10px',\n\t\t\t\t\tpadding: '0px 24px 12px 24px',\n\t\t\t\t\tjustifyContent: justification,\n\t\t\t\t\tflexWrap: 'wrap',\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t{yAxisStackedData.map((_item) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tkey={_item.label.replace(' ', '_')}\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\t\t\talignItems: 'center',\n\t\t\t\t\t\t\t\tgap: '8px',\n\t\t\t\t\t\t\t\tmarginTop: '4px',\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\tbackgroundColor: _item.backgroundColor,\n\t\t\t\t\t\t\t\t\twidth: '16px',\n\t\t\t\t\t\t\t\t\theight: '16px',\n\t\t\t\t\t\t\t\t\tborderRadius: '2px',\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<BodyTiny color={COLORS.content.secondary}>\n\t\t\t\t\t\t\t\t{_item.label}\n\t\t\t\t\t\t\t</BodyTiny>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t</div>\n\t\t);\n\t};\n\n\treturn (\n\t\t<GraphContainerWrapper\n\t\t\tstyle={props.wrapperStyle ?? {}}\n\t\t\tpadding={props.outerPadding}\n\t\t\tcustomLegend={props.customLegend}\n\t\t>\n\t\t\t{props.chartHeading && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tmarginBottom: 24,\n\t\t\t\t\t\tdisplay: 'flex',\n\t\t\t\t\t\tjustifyContent: props.hideHeading ? 'flex-end' : 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{props.hideHeading !== true && (\n\t\t\t\t\t\t<TitleRegular\n\t\t\t\t\t\t\tcolor={props.chartHeading.color ?? COLORS.content.secondary}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{props.chartHeading.heading}\n\t\t\t\t\t\t</TitleRegular>\n\t\t\t\t\t)}\n\t\t\t\t\t{props.allowChartPopup && (\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\tjustifyContent: 'flex-end',\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\t<IconButton\n\t\t\t\t\t\t\t\t\tIcon={MaximizeIcon}\n\t\t\t\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\t\t\t\tsetShowPopup(true);\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</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{props.customLegend && (\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: legendsAndIconDirection,\n\t\t\t\t\t\tjustifyContent: 'space-between',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<HeaderIconWrapper>\n\t\t\t\t\t\t{headerIcons.map((icon, index) => (\n\t\t\t\t\t\t\t<div key={index}>\n\t\t\t\t\t\t\t\t<div>{icon}</div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</HeaderIconWrapper>\n\t\t\t\t\t{renderLegend()}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t<div className=\"graph__wrapper\">\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\theight: props.graphCanvasHeight ?? 500,\n\t\t\t\t\t\twidth: props.graphCanvasWidth ?? 'auto',\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<Bar options={options} data={data} />\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t{showPopup && (\n\t\t\t\t<StyledModal\n\t\t\t\t\topen={showPopup}\n\t\t\t\t\tonClose={() => setShowPopup(false)}\n\t\t\t\t\tcloseOnOutsideClick\n\t\t\t\t\theadingTitle={props.chartHeading?.heading}\n\t\t\t\t\twidth=\"85%\"\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"graph__wrapper\"\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\tpadding: '8px',\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t{props.customLegend && renderLegend(true)}\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\theight: '70vh',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tpadding: '16px',\n\t\t\t\t\t\t\t\tborderRadius: '8px',\n\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Bar options={options} data={originalChartData} />\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</StyledModal>\n\t\t\t)}\n\t\t</GraphContainerWrapper>\n\t);\n};\n"],"names":["ChartJS","CategoryScale","LinearScale","BarElement","Tooltip","Legend","ChartDataLabels","truncateBars","data","labels","limit","truncatedData","d","othersData","acc","curr","i","truncatedLabels","StackedBarChart","props","headerIcons","legendsAndIconDirection","showPopup","setShowPopup","useState","dummyValues","noDataPresent","yAxisConfigForNoData","colorScaleBrand","colourScalePastel","colourScale","COLOR_SCHEMA","hoverColourScale","barConfig","useMemo","dataSetMap","ele","obj","yAxisStackedData","key","ind","reorderedYAxisData","dataset","datasetIndex","sum","val","a","b","originalData","truncated","options","_","context","datasets","dataIndex","COLORS","GRAPH_ORIENTATION","FONTS","value","formattedValue","truncateValueForInternationalStore","truncateValueForIndianStore","suffix","e","activeEls","yAxisLabel","xAxisLabel","chartDatasets","originalChartDatasets","originalChartData","renderLegend","isPopup","justification","jsx","_item","jsxs","BodyTiny","GraphContainerWrapper","TitleRegular","IconButton","MaximizeIcon","HeaderIconWrapper","icon","index","Bar","StyledModal"],"mappings":"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"}

package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.model.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StackedBarChart.model.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.model.ts"],"sourcesContent":["import { FontSpec, TooltipItem } from 'chart.js';\n\nexport interface AxisDetailsI {\n\ttitle?: string;\n\ttitleColor?: string;\n\tdata: XAxisDataI[] \| string[];\n\tlabelColor?: string;\n\tstepSize?: number;\n\tstacked?: boolean;\n\taxisSuffix?: string; // Suffix to append to axis values (e.g., '%', 'k', 'M')\n\tmax?: number;\n}\n\nexport interface XAxisDataI {\n\tname: string;\n\tvalue: number;\n}\n\nexport interface RGBColorI {\n\tr: number;\n\tg: number;\n\tb: number;\n\ta?: number;\n}\n\nexport interface ChartHeadingI {\n\theading: string;\n\tcolor?: string;\n}\n\nexport enum COLOR_SCHEMA {\n\tBRAND = 'brand',\n\tPASTEL = 'pastel',\n}\n\nexport enum GRAPH_ORIENTATION {\n\tVERTICAL = 'vertical',\n\tHORIZONTAL = 'horizontal',\n}\n\nexport interface StackedBarGraphI {\n\tgraphCanvasHeight?: number \| string;\n\tgraphCanvasWidth?: string;\n\ttickColor?: string;\n\tlabelColor?: string;\n\tchartHeading?: ChartHeadingI;\n\txAxis: AxisDetailsI;\n\tyAxis: AxisDetailsI;\n\tbarColorRGBA: RGBColorI;\n\touterPadding?: string;\n\tonBarClick?: (xAxisLabel: string, yAxisLabel: string) => void;\n\tcolorSchema?: COLOR_SCHEMA;\n\torientation?: GRAPH_ORIENTATION;\n\tbarWidth?: number;\n\twrapperStyle?: React.CSSProperties;\n\tcustomLegend?: boolean;\n\tshowTotal?: boolean;\n\ttooltipConfig?: {\n\t\ttitleCallback?: (toolTipItems: TooltipItem<'bar'>[]) => string \| string[];\n\t\tlabelCallback?: (toolTipItem: TooltipItem<'bar'>) => string \| string[];\n\t\tfooterCallback?: (toolTipItems: TooltipItem<'bar'>[]) => string \| string[];\n\t\tfooterStyles?: {\n\t\t\tfooterFont?: Partial<FontSpec>;\n\t\t};\n\t};\n\tcustomColourScaleBrand?: string[];\n\tcustomColourScalePastel?: string[];\n\tcustomHoverColour?: string[];\n\tcustomBarColors?: string[] /** Custom colors for individual bars in the stack /;\n\tisInternationalStore?: boolean;\n\ttruncateBars?: number;\n\tallowChartPopup?: boolean;\n\thideHeading?: boolean;\n\t/* borderRadius - if number passes only the top bar of the stack will be given radius. Send object to apply border in all the bars of the stack /\n\tborderRadius?:\n\t\t\| number\n\t\t\| {\n\t\t\t\ttopLeft?: number;\n\t\t\t\ttopRight?: number;\n\t\t\t\tbottomLeft?: number;\n\t\t\t\tbottomRight?: number;\n\t\t };\n\tshowGridLines?: { x?: boolean; y?: boolean };\n\tequalHeight?: { flag: boolean; max: number };\n\tbarPercentage?: number; // 0 to 1\n\~~tcategoryPercentage?: number;\n\~~taddBarGap?: { flag: boolean; value: number };\n\tticksCallback?: (value: number \| string) => string;\n\tlegendsAndIconDirection?: 'row-reverse' \| 'row';\n\theaderIcons?: React.ReactNode[];\n\trenderInHeightWiseManner?: boolean /* When true, renders smaller bars on top of larger bars */;\n}\n"],"names":["COLOR_SCHEMA","GRAPH_ORIENTATION"],"mappings":"gFA8BO,IAAKA,GAAAA,IACXA,EAAA,MAAQ,QACRA,EAAA,OAAS,SAFEA,IAAAA,GAAA,CAAA,CAAA,EAKAC,GAAAA,IACXA,EAAA,SAAW,WACXA,EAAA,WAAa,aAFFA,IAAAA,GAAA,CAAA,CAAA"}
1	+ {"version":3,"file":"StackedBarChart.model.js","sources":["../../../../../../src/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.model.ts"],"sourcesContent":["import { FontSpec, TooltipItem } from 'chart.js';\n\nexport interface AxisDetailsI {\n\ttitle?: string;\n\ttitleColor?: string;\n\tdata: XAxisDataI[] \| string[];\n\tlabelColor?: string;\n\tstepSize?: number;\n\tstacked?: boolean;\n\taxisSuffix?: string; // Suffix to append to axis values (e.g., '%', 'k', 'M')\n\tmax?: number;\n}\n\nexport interface XAxisDataI {\n\tname: string;\n\tvalue: number;\n}\n\nexport interface RGBColorI {\n\tr: number;\n\tg: number;\n\tb: number;\n\ta?: number;\n}\n\nexport interface ChartHeadingI {\n\theading: string;\n\tcolor?: string;\n}\n\nexport enum COLOR_SCHEMA {\n\tBRAND = 'brand',\n\tPASTEL = 'pastel',\n}\n\nexport enum GRAPH_ORIENTATION {\n\tVERTICAL = 'vertical',\n\tHORIZONTAL = 'horizontal',\n}\n\nexport interface StackedBarGraphI {\n\tgraphCanvasHeight?: number \| string;\n\tgraphCanvasWidth?: string;\n\ttickColor?: string;\n\tlabelColor?: string;\n\tchartHeading?: ChartHeadingI;\n\txAxis: AxisDetailsI;\n\tyAxis: AxisDetailsI;\n\tbarColorRGBA: RGBColorI;\n\touterPadding?: string;\n\tonBarClick?: (xAxisLabel: string, yAxisLabel: string) => void;\n\tcolorSchema?: COLOR_SCHEMA;\n\torientation?: GRAPH_ORIENTATION;\n\tbarWidth?: number;\n\twrapperStyle?: React.CSSProperties;\n\tcustomLegend?: boolean;\n\tshowTotal?: boolean;\n\ttooltipConfig?: {\n\t\ttitleCallback?: (toolTipItems: TooltipItem<'bar'>[]) => string \| string[];\n\t\tlabelCallback?: (toolTipItem: TooltipItem<'bar'>) => string \| string[];\n\t\tfooterCallback?: (toolTipItems: TooltipItem<'bar'>[]) => string \| string[];\n\t\tfooterStyles?: {\n\t\t\tfooterFont?: Partial<FontSpec>;\n\t\t};\n\t};\n\tcustomColourScaleBrand?: string[];\n\tcustomColourScalePastel?: string[];\n\tcustomHoverColour?: string[];\n\tcustomBarColors?: string[] /** Custom colors for individual bars in the stack /;\n\tisInternationalStore?: boolean;\n\ttruncateBars?: number;\n\tallowChartPopup?: boolean;\n\thideHeading?: boolean;\n\t/* borderRadius - if number passes only the top bar of the stack will be given radius. Send object to apply border in all the bars of the stack /\n\tborderRadius?:\n\t\t\| number\n\t\t\| {\n\t\t\t\ttopLeft?: number;\n\t\t\t\ttopRight?: number;\n\t\t\t\tbottomLeft?: number;\n\t\t\t\tbottomRight?: number;\n\t\t };\n\tshowGridLines?: { x?: boolean; y?: boolean };\n\tequalHeight?: { flag: boolean; max: number };\n\tbarPercentage?: number; // 0 to 1\n\taddBarGap?: { flag: boolean; value: number };\n\tticksCallback?: (value: number \| string) => string;\n\tlegendsAndIconDirection?: 'row-reverse' \| 'row';\n\theaderIcons?: React.ReactNode[];\n\trenderInHeightWiseManner?: boolean /* When true, renders smaller bars on top of larger bars */;\n}\n"],"names":["COLOR_SCHEMA","GRAPH_ORIENTATION"],"mappings":"gFA8BO,IAAKA,GAAAA,IACXA,EAAA,MAAQ,QACRA,EAAA,OAAS,SAFEA,IAAAA,GAAA,CAAA,CAAA,EAKAC,GAAAA,IACXA,EAAA,SAAW,WACXA,EAAA,WAAa,aAFFA,IAAAA,GAAA,CAAA,CAAA"}