@bikdotai/bik-component-library 0.0.727-beta.34 → 0.0.727

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 (39) hide show
  1. package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
  2. package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  3. package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
  4. package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  5. package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
  6. package/dist/cjs/components/TypographyStyle.d.ts +0 -8
  7. package/dist/cjs/components/TypographyStyle.js +12 -13
  8. package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsTrend.d.ts +1 -0
  9. package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsTrend.js +1 -1
  10. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js +1 -1
  11. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.model.d.ts +6 -1
  12. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js +1 -1
  13. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.d.ts +6 -0
  14. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.js +23 -2
  15. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraphModel.d.ts +12 -0
  16. package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraphModel.js +1 -0
  17. package/dist/cjs/components/bik-layout/MockMenus.d.ts +0 -1
  18. package/dist/cjs/components/toaster/Toaster.d.ts +0 -2
  19. package/dist/cjs/components/toaster/Toaster.js +1 -1
  20. package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
  21. package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  22. package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
  23. package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
  24. package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
  25. package/dist/esm/components/TypographyStyle.d.ts +0 -8
  26. package/dist/esm/components/TypographyStyle.js +11 -12
  27. package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsTrend.d.ts +1 -0
  28. package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsTrend.js +1 -1
  29. package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js +1 -1
  30. package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.model.d.ts +6 -1
  31. package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js +1 -1
  32. package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.d.ts +6 -0
  33. package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.js +24 -3
  34. package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraphModel.d.ts +12 -0
  35. package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraphModel.js +1 -0
  36. package/dist/esm/components/bik-layout/MockMenus.d.ts +0 -1
  37. package/dist/esm/components/toaster/Toaster.d.ts +0 -2
  38. package/dist/esm/components/toaster/Toaster.js +1 -1
  39. package/package.json +1 -1
package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
- import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
2
+ import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
3
3
  declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
4
4
  export default EventsTrigger;
package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
1
+ import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
2
2
  export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
- import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
2
+ import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
3
3
  declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
4
4
  export default IGTrigger;
package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
1
+ import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
2
2
  export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { DropdownOption } from "../../../dropdown/type";
3
- import { QueryBuilderProperty } from "../../Types/QueryBuilder.type";
4
- import { QueryBuilderNodeProps } from "../../Types/QueryBuilderNodeProps.type";
3
+ import { QueryBuilderProperty } from "../../types/QueryBuilder.type";
4
+ import { QueryBuilderNodeProps } from "../../types/QueryBuilderNodeProps.type";
5
5
  declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
6
6
  cacheKey: string;
7
7
  propertyAddBtnText: string;
package/dist/cjs/components/TypographyStyle.d.ts CHANGED
@@ -1,8 +1,3 @@
1
- interface customStyles {
2
- fontWeight?: number;
3
- fontSize?: number;
4
- width?: number;
5
- }
6
1
  export declare const TitleXlarge: import("styled-components").StyledComponent<"div", any, {
7
2
  numberOfLines?: number | undefined;
8
3
  color?: string | undefined;
@@ -42,7 +37,6 @@ export declare const BodyPrimary: import("styled-components").StyledComponent<"d
42
37
  export declare const BodySecondary: import("styled-components").StyledComponent<"div", any, {
43
38
  numberOfLines?: number | undefined;
44
39
  color?: string | undefined;
45
- customStyles?: customStyles | undefined;
46
40
  }, never>;
47
41
  export declare const ButtonRegularAI: import("styled-components").StyledComponent<"div", any, {
48
42
  numberOfLines?: number | undefined;
@@ -56,7 +50,6 @@ export declare const BodyPrimaryLink: import("styled-components").StyledComponen
56
50
  export declare const BodySecondaryLink: import("styled-components").StyledComponent<"div", any, {
57
51
  numberOfLines?: number | undefined;
58
52
  color?: string | undefined;
59
- customStyles?: customStyles | undefined;
60
53
  }, never>;
61
54
  export declare const BodyCaption: import("styled-components").StyledComponent<"div", any, {
62
55
  numberOfLines?: number | undefined;
@@ -118,4 +111,3 @@ export declare const Tiny: import("styled-components").StyledComponent<"div", an
118
111
  numberOfLines?: number | undefined;
119
112
  color?: string | undefined;
120
113
  }, never>;
121
- export {};
package/dist/cjs/components/TypographyStyle.js CHANGED
@@ -78,7 +78,7 @@
78
78
  overflow: hidden;
79
79
  display: -webkit-box;
80
80
  -webkit-line-clamp: ${e=>e.numberOfLines};
81
- `,h=o.default.div`
81
+ `,g=o.default.div`
82
82
  font-family: Inter;
83
83
  color: ${e=>e.color||t.COLORS.text.primary};
84
84
  font-weight: ${t.FONTS.bodyPrimary.fontWeight};
@@ -88,12 +88,11 @@
88
88
  overflow: hidden;
89
89
  display: -webkit-box;
90
90
  -webkit-line-clamp: ${e=>e.numberOfLines};
91
- `,g=o.default.div`
91
+ `,h=o.default.div`
92
92
  font-family: Inter;
93
- width: ${e=>{var t;return n(null===(t=e.customStyles)||void 0===t?void 0:t.width)}};
94
93
  color: ${e=>e.color||t.COLORS.text.primary};
95
- font-weight: ${e=>{var i;return(null===(i=e.customStyles)||void 0===i?void 0:i.fontWeight)||t.FONTS.bodySecondary.fontWeight}};
96
- font-size: ${e=>{var i;return n(null===(i=e.customStyles)||void 0===i?void 0:i.fontSize)||n(t.FONTS.bodySecondary.fontSize)}};
94
+ font-weight: ${t.FONTS.bodySecondary.fontWeight};
95
+ font-size: ${n(t.FONTS.bodySecondary.fontSize)};
97
96
  line-height: ${n(t.FONTS.bodySecondary.lineHeight)};
98
97
  -webkit-box-orient: vertical;
99
98
  overflow: hidden;
@@ -115,12 +114,12 @@
115
114
  -webkit-text-fill-color: transparent;
116
115
  background-clip: text;
117
116
  text-fill-color: transparent;
118
- `,p=o.default(h)`
117
+ `,p=o.default(g)`
119
118
  text-decoration: underline;
120
119
  color: ${t.COLORS.content.brand};
121
120
  text-decoration-color: ${t.COLORS.content.brand};
122
121
  cursor: pointer;
123
- `,w=o.default(g)`
122
+ `,w=o.default(h)`
124
123
  text-decoration: underline;
125
124
  color: ${t.COLORS.content.brand};
126
125
  text-decoration-color: ${t.COLORS.content.brand};
@@ -137,7 +136,7 @@
137
136
  -webkit-line-clamp: ${e=>e.numberOfLines};
138
137
  word-break: break-word;
139
138
  overflow-wrap: break-word;
140
- `,s=o.default.div`
139
+ `,x=o.default.div`
141
140
  font-family: Inter;
142
141
  color: ${e=>e.color||t.COLORS.text.primary};
143
142
  font-weight: ${t.FONTS.caption.fontWeight};
@@ -153,7 +152,7 @@
153
152
  -webkit-text-fill-color: transparent;
154
153
  background-clip: text;
155
154
  text-fill-color: transparent;
156
- `,x=o.default.div`
155
+ `,$=o.default.div`
157
156
  color: ${e=>e.color||t.COLORS.text.primary};
158
157
  font-weight: ${t.FONTS.tiny.fontWeight};
159
158
  font-size: ${n(t.FONTS.tiny.fontSize)};
@@ -162,7 +161,7 @@
162
161
  overflow: hidden;
163
162
  display: -webkit-box;
164
163
  -webkit-line-clamp: ${e=>e.numberOfLines};
165
- `,$=o.default.div`
164
+ `,s=o.default.div`
166
165
  color: ${e=>e.color||t.COLORS.text.primary};
167
166
  font-weight: ${t.FONTS.tiny.fontWeight};
168
167
  font-size: ${n(t.FONTS.tiny.fontSize)};
@@ -213,7 +212,7 @@
213
212
  overflow: hidden;
214
213
  display: -webkit-box;
215
214
  -webkit-line-clamp: ${e=>e.numberOfLines};
216
- `,v=o.default.div`
215
+ `,T=o.default.div`
217
216
  font-family: Inter;
218
217
  color: ${e=>e.color||t.COLORS.text.primary};
219
218
  font-weight: ${t.FONTS.subHeading.fontWeight};
@@ -223,7 +222,7 @@
223
222
  overflow: hidden;
224
223
  display: -webkit-box;
225
224
  -webkit-line-clamp: ${e=>e.numberOfLines};
226
- `,T=o.default.div`
225
+ `,v=o.default.div`
227
226
  font-family: Inter;
228
227
  color: ${e=>e.color||t.COLORS.text.primary};
229
228
  font-weight: ${t.FONTS.bodyRegular.fontWeight};
@@ -293,4 +292,4 @@
293
292
  overflow: hidden;
294
293
  display: -webkit-box;
295
294
  -webkit-line-clamp: ${e=>e.numberOfLines};
296
- `;exports.AiBodyCaption=s,exports.AiBodyTiny=$,exports.BodyCaption=y,exports.BodyLarge=O,exports.BodyPrimary=h,exports.BodyPrimaryLink=p,exports.BodyRegular=T,exports.BodySecondary=g,exports.BodySecondaryLink=w,exports.BodySmall=z,exports.BodyTiny=x,exports.ButtonLarge=m,exports.ButtonLargeAI=u,exports.ButtonRegular=k,exports.ButtonRegularAI=S,exports.Caption=F,exports.CaptionBold=R,exports.Display=c,exports.SmallRegular=f,exports.SubHeading=v,exports.TextPlaceholder=N,exports.Tiny=C,exports.TitleFour=L,exports.TitleLarge=r,exports.TitleMedium=a,exports.TitleRegular=d,exports.TitleSmall=b,exports.TitleXlarge=l;
295
+ `;exports.AiBodyCaption=x,exports.AiBodyTiny=s,exports.BodyCaption=y,exports.BodyLarge=O,exports.BodyPrimary=g,exports.BodyPrimaryLink=p,exports.BodyRegular=v,exports.BodySecondary=h,exports.BodySecondaryLink=w,exports.BodySmall=z,exports.BodyTiny=$,exports.ButtonLarge=m,exports.ButtonLargeAI=u,exports.ButtonRegular=k,exports.ButtonRegularAI=S,exports.Caption=F,exports.CaptionBold=R,exports.Display=c,exports.SmallRegular=f,exports.SubHeading=T,exports.TextPlaceholder=N,exports.Tiny=C,exports.TitleFour=L,exports.TitleLarge=r,exports.TitleMedium=a,exports.TitleRegular=d,exports.TitleSmall=b,exports.TitleXlarge=l;
package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsTrend.d.ts CHANGED
@@ -4,6 +4,7 @@ export interface AnalyticsTrendInterface {
4
4
  value?: number | string;
5
5
  trendPercent?: number;
6
6
  trendRaw?: number;
7
+ trendRawString?: string;
7
8
  formatVal?: boolean;
8
9
  timeline?: 'today' | 'yesterday' | '7 days' | '30 days' | 'custom';
9
10
  customRange?: Date[];
package/dist/cjs/components/analytics-chips-and-dropdowns/AnalyticsTrend.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("react"),n=require("../shimmer/ShimmerComponent/ShimmerStyled.js"),i=require("../../utils/DateUtils.js"),s=require("../../constants/Theme.js"),r=require("../../assets/icons/arrow_down.svg.js"),o=require("../../assets/icons/arrow_up.svg.js"),l=require("../../assets/icons/info.svg.js"),a=require("../tag/Tag.js"),c=require("../tooltips/Tooltip.js"),x=require("../TypographyStyle.js"),u=require("./chart/utils/calcPercentage.js"),d=require("./CommonStyles.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=m(t);const j=n=>{let{percent:l,direction:a,timeline:d,customRange:m,trendRaw:p,prefixSymbol:j,trendIconStyle:g,isInternationalStore:h,tooltipTimelineText:y,customTimelineText:R}=n;const b=()=>{const e=((null!=p?p:0)>0?"+":"")+(null!=j?j:"");return void 0===p?"--":`${null!=e?e:""}${(()=>{let e="--";if(p)return e=String(h?u.truncateValueForInternationalStore(Math.abs(p)):u.truncateValueForIndianStore(Math.abs(p))),p<0?"-"+e:e})()}`},[f,O]=t.useState(b()),[S,T]=t.useState(R||"");t.useEffect((()=>{R||T("today"===d?"vs yesterday":"yesterday"===d?"vs 1 day before":"7 days"===d?"vs last 7 days":"30 days"===d?"vs last 30 days":"custom"===d&&m?i.default.getAnalyticsCustomDateTimelineText(m):"")}),[d,m]),t.useEffect((()=>{O(b())}),[p]);const v="negative"===a?r.default:o.default,E="negative"===a?s.COLORS.background.negative.vibrant:"positive"===a?s.COLORS.background.positive.vibrant:s.COLORS.content.placeholder;return e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof l&&e.jsxRuntimeExports.jsx(v,{color:E,height:16,width:16,style:Object.assign({marginRight:2},null!=g?g:{})}),"number"==typeof l&&a&&e.jsxRuntimeExports.jsxs(x.Caption,Object.assign({style:{color:E}},{children:["neutral"===a?0:l<1e3?l:">999","%"]})),!!p&&e.jsxRuntimeExports.jsx(x.Caption,Object.assign({style:{marginLeft:4,color:s.COLORS.content.placeholder}},{children:`(${f})`})),d&&(y?e.jsxRuntimeExports.jsx(c.Tooltip,Object.assign({body:y,placement:"bottom"},{children:e.jsxRuntimeExports.jsx(x.Caption,Object.assign({style:{marginLeft:4,color:s.COLORS.content.placeholder}},{children:R||S}))})):e.jsxRuntimeExports.jsx(x.Caption,Object.assign({style:{marginLeft:4,color:s.COLORS.content.placeholder}},{children:R||S})))]}))};exports.AnalyticsTrend=t=>{let{title:i,value:r,trendPercent:o,type:m="horizontal",timeline:g,customRange:h,tooltip:y,card:R=!0,rightSeparator:b=!1,size:f="big",share:O=!1,formatVal:S,prefixSymbol:T,trailingIcon:v,onTrailIconClick:E,iconTooltipBody:C,funnelPercent:w,isLoading:I,trendRaw:$,suffixText:L,trendStyle:q,trendContainerStyle:D,trendIconStyle:F,containerStyle:M,prevTrendDiff:k,relativePercentageDiff:P,isInternationalStore:V,Icon:_,iconContainerStyle:z,tooltipTimelineText:A,customTimelineText:N}=t;const B="big"===f?x.TitleLarge:x.TitleMedium,W=void 0!==o?o<0?"negative":0===o?"neutral":"positive":void 0,U=void 0!==o?O?Math.round(o):Math.abs(Math.round(o)):void 0;return e.jsxRuntimeExports.jsx(d.AnalyticsTrendContainer,Object.assign({card:R,style:Object.assign({},M)},{children:e.jsxRuntimeExports.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:_?12:4,borderRightWidth:b?1:0,borderRightColor:s.COLORS.stroke.primary,borderRightStyle:"solid",paddingLeft:R?0:24,paddingRight:R?0:24,height:"100%",justifyContent:_?"flex-start":"space-between",alignItems:"center"},null!=D?D:{})},{children:[!!_&&e.jsxRuntimeExports.jsx(d.IconContainer,Object.assign({style:Object.assign({},z)},{children:e.jsxRuntimeExports.jsx(_,{})})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"column",gap:4,height:"100%"},null!=q?q:{})},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e.jsxRuntimeExports.jsx(x.BodyCaption,Object.assign({style:{color:s.COLORS.content.secondary}},{children:i})),y&&e.jsxRuntimeExports.jsx(c.Tooltip,Object.assign({body:y,placement:"right",width:300},{children:e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",cursor:"pointer",height:"100%"}},{children:e.jsxRuntimeExports.jsx(l.default,{color:s.COLORS.content.primary,height:16,width:16})}))}))]})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:12,alignItems:"center"},O?{justifyContent:"space-between"}:{})},{children:[I&&e.jsxRuntimeExports.jsx(n.ShimmerComponentStyled,{width:108,height:26}),!I&&e.jsxRuntimeExports.jsx(B,Object.assign({style:{color:s.COLORS.content.primary}},{children:void 0===r?"--":"number"==typeof r&&S?r>999?V?`${null!=T?T:""}${u.truncateValueForInternationalStore(r)} ${null!=L?L:""}`:`${null!=T?T:""}${u.truncateValueForIndianStore(r)} ${null!=L?L:""}`:`${null!=T?T:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(r)} ${null!=L?L:""}`:`${null!=T?T:""}${r} ${null!=L?L:""}`})),"number"==typeof P&&e.jsxRuntimeExports.jsx(a.Tag,{tagText:`${P}%`,theme:"light",type:"neutral"}),"horizontal"===m&&!I&&!O&&e.jsxRuntimeExports.jsx(j,{timeline:g,customRange:h,percent:U,direction:W,trendRaw:$,prefixSymbol:T,trendIconStyle:F,isInternationalStore:V,tooltipTimelineText:A,customTimelineText:N}),I&&!O&&"horizontal"===m&&e.jsxRuntimeExports.jsx(n.ShimmerComponentStyled,{height:20,width:141,marginTop:6}),"vertical"===m&&!I&&void 0!==w&&e.jsxRuntimeExports.jsx(a.Tag,{tagText:`${w} %`,theme:"light",type:"neutral"}),O&&!I&&void 0!==U&&e.jsxRuntimeExports.jsx(a.Tag,{tagText:`${U} %`,theme:"light",type:"neutral"}),O||I||!k||0==k?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):e.jsxRuntimeExports.jsx(a.Tag,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(k),theme:"light",type:"neutral"})]})),"vertical"===m&&!I&&!O&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginTop:10}},{children:e.jsxRuntimeExports.jsx(j,{timeline:g,customRange:h,percent:U,direction:W,trendRaw:$,prefixSymbol:T,trendIconStyle:F,isInternationalStore:V,tooltipTimelineText:A,customTimelineText:N})})),I&&"vertical"===m&&e.jsxRuntimeExports.jsx(n.ShimmerComponentStyled,{height:20,width:141,marginTop:6})]})),C&&!I&&e.jsxRuntimeExports.jsx(c.Tooltip,Object.assign({body:C,placement:"right"},{children:v&&e.jsxRuntimeExports.jsx("div",Object.assign({className:"icon--holder",onClick:E},{children:p.default.createElement(v,{height:20,width:20,color:s.COLORS.content.secondary})}))}))]}))}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("react"),n=require("../shimmer/ShimmerComponent/ShimmerStyled.js"),i=require("../../utils/DateUtils.js"),s=require("../../constants/Theme.js"),r=require("../../assets/icons/arrow_down.svg.js"),o=require("../../assets/icons/arrow_up.svg.js"),l=require("../../assets/icons/info.svg.js"),a=require("../tag/Tag.js"),c=require("../tooltips/Tooltip.js"),x=require("../TypographyStyle.js"),u=require("./chart/utils/calcPercentage.js"),d=require("./CommonStyles.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=m(t);const j=n=>{let{percent:l,direction:a,timeline:d,customRange:m,trendRaw:p,trendRawString:j,prefixSymbol:g,trendIconStyle:h,isInternationalStore:y,tooltipTimelineText:R,customTimelineText:b}=n;const f=()=>{const e=((null!=p?p:0)>0?"+":"")+(null!=g?g:"");return void 0===p?"--":`${null!=e?e:""}${(()=>{let e="--";if(p)return e=String(y?u.truncateValueForInternationalStore(Math.abs(p)):u.truncateValueForIndianStore(Math.abs(p))),p<0?"-"+e:e})()}`},[S,O]=t.useState(f()),[T,v]=t.useState(b||"");t.useEffect((()=>{b||v("today"===d?"vs yesterday":"yesterday"===d?"vs 1 day before":"7 days"===d?"vs last 7 days":"30 days"===d?"vs last 30 days":"custom"===d&&m?i.default.getAnalyticsCustomDateTimelineText(m):"")}),[d,m]),t.useEffect((()=>{O(f())}),[p]);const E="negative"===a?r.default:o.default,C="negative"===a?s.COLORS.background.negative.vibrant:"positive"===a?s.COLORS.background.positive.vibrant:s.COLORS.content.placeholder;return e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof l&&e.jsxRuntimeExports.jsx(E,{color:C,height:16,width:16,style:Object.assign({marginRight:2},null!=h?h:{})}),"number"==typeof l&&a&&e.jsxRuntimeExports.jsxs(x.Caption,Object.assign({style:{color:C}},{children:["neutral"===a?0:l<1e3?l:">999","%"]})),!!p&&e.jsxRuntimeExports.jsx(x.Caption,Object.assign({style:{marginLeft:4,color:s.COLORS.content.placeholder}},{children:`(${S})`})),!p&&((null==j?void 0:j.length)||0)>0&&e.jsxRuntimeExports.jsx(x.Caption,Object.assign({style:{marginLeft:4,color:s.COLORS.content.placeholder}},{children:`${j}`})),d&&(R?e.jsxRuntimeExports.jsx(c.Tooltip,Object.assign({body:R,placement:"bottom"},{children:e.jsxRuntimeExports.jsx(x.Caption,Object.assign({style:{marginLeft:4,color:s.COLORS.content.placeholder}},{children:b||T}))})):e.jsxRuntimeExports.jsx(x.Caption,Object.assign({style:{marginLeft:4,color:s.COLORS.content.placeholder}},{children:b||T})))]}))};exports.AnalyticsTrend=t=>{let{title:i,value:r,trendPercent:o,type:m="horizontal",timeline:g,customRange:h,tooltip:y,card:R=!0,rightSeparator:b=!1,size:f="big",share:S=!1,formatVal:O,prefixSymbol:T,trailingIcon:v,onTrailIconClick:E,iconTooltipBody:C,funnelPercent:w,isLoading:I,trendRaw:$,trendRawString:L,suffixText:q,trendStyle:D,trendContainerStyle:F,trendIconStyle:M,containerStyle:k,prevTrendDiff:P,relativePercentageDiff:V,isInternationalStore:_,Icon:z,iconContainerStyle:A,tooltipTimelineText:N,customTimelineText:B}=t;const W="big"===f?x.TitleLarge:x.TitleMedium,U=void 0!==o?o<0?"negative":0===o?"neutral":"positive":void 0,G=void 0!==o?S?Math.round(o):Math.abs(Math.round(o)):void 0;return e.jsxRuntimeExports.jsx(d.AnalyticsTrendContainer,Object.assign({card:R,style:Object.assign({},k)},{children:e.jsxRuntimeExports.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:z?12:4,borderRightWidth:b?1:0,borderRightColor:s.COLORS.stroke.primary,borderRightStyle:"solid",paddingLeft:R?0:24,paddingRight:R?0:24,height:"100%",justifyContent:z?"flex-start":"space-between",alignItems:"center"},null!=F?F:{})},{children:[!!z&&e.jsxRuntimeExports.jsx(d.IconContainer,Object.assign({style:Object.assign({},A)},{children:e.jsxRuntimeExports.jsx(z,{})})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"column",gap:4,height:"100%"},null!=D?D:{})},{children:[e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e.jsxRuntimeExports.jsx(x.BodyCaption,Object.assign({style:{color:s.COLORS.content.secondary}},{children:i})),y&&e.jsxRuntimeExports.jsx(c.Tooltip,Object.assign({body:y,placement:"right",width:300},{children:e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",cursor:"pointer",height:"100%"}},{children:e.jsxRuntimeExports.jsx(l.default,{color:s.COLORS.content.primary,height:16,width:16})}))}))]})),e.jsxRuntimeExports.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:12,alignItems:"center"},S?{justifyContent:"space-between"}:{})},{children:[I&&e.jsxRuntimeExports.jsx(n.ShimmerComponentStyled,{width:108,height:26}),!I&&e.jsxRuntimeExports.jsx(W,Object.assign({style:{color:s.COLORS.content.primary}},{children:void 0===r?"--":"number"==typeof r&&O?r>999?_?`${null!=T?T:""}${u.truncateValueForInternationalStore(r)} ${null!=q?q:""}`:`${null!=T?T:""}${u.truncateValueForIndianStore(r)} ${null!=q?q:""}`:`${null!=T?T:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(r)} ${null!=q?q:""}`:`${null!=T?T:""}${r} ${null!=q?q:""}`})),"number"==typeof V&&e.jsxRuntimeExports.jsx(a.Tag,{tagText:`${V}%`,theme:"light",type:"neutral"}),"horizontal"===m&&!I&&!S&&e.jsxRuntimeExports.jsx(j,{timeline:g,customRange:h,percent:G,direction:U,trendRaw:$,trendRawString:L,prefixSymbol:T,trendIconStyle:M,isInternationalStore:_,tooltipTimelineText:N,customTimelineText:B}),I&&!S&&"horizontal"===m&&e.jsxRuntimeExports.jsx(n.ShimmerComponentStyled,{height:20,width:141,marginTop:6}),"vertical"===m&&!I&&void 0!==w&&e.jsxRuntimeExports.jsx(a.Tag,{tagText:`${w} %`,theme:"light",type:"neutral"}),S&&!I&&void 0!==G&&e.jsxRuntimeExports.jsx(a.Tag,{tagText:`${G} %`,theme:"light",type:"neutral"}),S||I||!P||0==P?e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{}):e.jsxRuntimeExports.jsx(a.Tag,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(P),theme:"light",type:"neutral"})]})),"vertical"===m&&!I&&!S&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginTop:10}},{children:e.jsxRuntimeExports.jsx(j,{timeline:g,customRange:h,percent:G,direction:U,trendRaw:$,trendRawString:L,prefixSymbol:T,trendIconStyle:M,isInternationalStore:_,tooltipTimelineText:N,customTimelineText:B})})),I&&"vertical"===m&&e.jsxRuntimeExports.jsx(n.ShimmerComponentStyled,{height:20,width:141,marginTop:6})]})),C&&!I&&e.jsxRuntimeExports.jsx(c.Tooltip,Object.assign({body:C,placement:"right"},{children:v&&e.jsxRuntimeExports.jsx("div",Object.assign({className:"icon--holder",onClick:E},{children:p.default.createElement(v,{height:20,width:20,color:s.COLORS.content.secondary})}))}))]}))}))};
package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../node_modules/react/jsx-runtime.js"),t=require("../../../../assets/icons/maximize.svg.js"),i=require("chart.js"),o=require("chartjs-plugin-datalabels"),a=require("react"),l=require("react-chartjs-2"),n=require("../../../icon-button/IconButton.js"),s=require("../../../modals/styledModal.js"),r=require("../../../TypographyStyle.js"),d=require("../../../../constants/Theme.js"),c=require("../utils/calcPercentage.js"),u=require("./StackedBarChart.model.js"),x=require("./StackedBarChart.styles.js");function v(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=v(o);i.Chart.register(i.CategoryScale,i.LinearScale,i.BarElement,i.Tooltip,i.Legend,p.default);exports.StackedBarChart=i=>{var o,v,p,g,O,b,h,R,A,j,y,m,C,I,T,E,f,N,S,H,L,k,F,P,_,G,B,w,D,q,Z,z,M,W,V,Y,J,K,Q,U,X,$;const{headerIcons:ee=[],legendsAndIconDirection:te="row"}=i,[ie,oe]=a.useState(!1),ae=[250,1e3,800,1500,300,600],le=0===i.yAxis.data.length,ne=void 0===i.customColourScaleBrand&&void 0===i.customColourScalePastel?i.colorSchema===u.COLOR_SCHEMA.PASTEL?["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"]:["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"]:i.colorSchema===u.COLOR_SCHEMA.PASTEL?i.customColourScalePastel:i.customColourScaleBrand,se=i.customHoverColour,re=a.useMemo((()=>{var e,t,o;return Object.assign(Object.assign({barPercentage:(null==i?void 0:i.barPercentage)||.4,categoryPercentage:1,pointStyle:"circle",barWidth:i.barWidth,borderRadius:(null==i?void 0:i.borderRadius)||void 0},"object"==typeof(null==i?void 0:i.borderRadius)?{borderSkipped:!1}:{}),(null===(e=null==i?void 0:i.addBarGap)||void 0===e?void 0:e.flag)?{borderWidth:{top:(null===(t=null==i?void 0:i.addBarGap)||void 0===t?void 0:t.value)||2,bottom:(null===(o=null==i?void 0:i.addBarGap)||void 0===o?void 0:o.value)||2,right:0,left:0},borderColor:"transparent"}:{})}),[i.barWidth,null==i?void 0:i.borderRadius,null==i?void 0:i.barPercentage,null==i?void 0:i.addBarGap]),de={};i.yAxis.data.map((e=>{e.map((e=>{de[e.name]?de[e.name].push(e.value):de[e.name]=[e.value]}))}));const ce=Object.keys(de).map(((e,t)=>Object.assign({label:e,data:de[e],backgroundColor:null==ne?void 0:ne[t],hoverBackgroundColor:void 0===se?void 0:se[t]},re)));let ue=i.xAxis.data.map((e=>"string"==typeof e?e:e.name)),xe=ce;if(i.truncateBars){const e=((e,t,i)=>{if(t.length<=i)return{truncatedData:e,truncatedLabels:t,originalData:e,originalLabels:t};const o=e.map((e=>e.slice(0,i))),a=e.map((e=>e.slice(i).reduce(((e,t)=>e+t),0)));o.forEach(((e,t)=>e.push(a[t])));const l=t.slice(0,i);return l.push("Others"),{truncatedData:o,truncatedLabels:l,originalData:e,originalLabels:t}})(ce.map((e=>e.data)),ue,i.truncateBars);ce.forEach(((t,i)=>t.data=e.truncatedData[i])),ue=e.truncatedLabels,xe=e.originalData.map(((e,t)=>Object.assign(Object.assign({},ce[t]),{data:e})))}const ve={plugins:{legend:{display:!le&&!i.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!le,callbacks:{label:null===(o=i.tooltipConfig)||void 0===o?void 0:o.labelCallback,title:null===(v=i.tooltipConfig)||void 0===v?void 0:v.titleCallback,footer:null===(p=i.tooltipConfig)||void 0===p?void 0:p.footerCallback},footerFont:null===(O=null===(g=i.tooltipConfig)||void 0===g?void 0:g.footerStyles)||void 0===O?void 0:O.footerFont},datalabels:{display:null!==(b=i.showTotal)&&void 0!==b&&b,anchor:"end",align:"end",clamp:!0,formatter:(e,t)=>{var i;const o=t.datasetIndex,a=t.chart.data.datasets;if(o!==a.length-1)return"";const l=t.dataIndex;let n=0;for(let e=0;e<a.length;e++)n+=null!==(i=a[e].data[l])&&void 0!==i?i:0;return n?n<1e3?n:(n/1e3).toString().substring(0,4)+"k":""},color:d.COLORS.content.secondary}},layout:{padding:{right:i.showTotal&&i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:i.showTotal&&i.orientation!=u.GRAPH_ORIENTATION.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!i.customLegend,labels:{usePointStyle:!0}},indexAxis:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(h=i.yAxis)||void 0===h?void 0:h.title:null===(R=i.xAxis)||void 0===R?void 0:R.title),text:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(A=i.yAxis)||void 0===A?void 0:A.title:null===(j=i.xAxis)||void 0===j?void 0:j.title,color:null!==(C=i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(y=i.yAxis)||void 0===y?void 0:y.titleColor:null===(m=i.xAxis)||void 0===m?void 0:m.titleColor)&&void 0!==C?C:d.COLORS.content.secondary,font:{size:d.FONTS.caption.fontSize}},grid:{display:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(I=null==i?void 0:i.showGridLines)||void 0===I?void 0:I.x)||(null===(T=null==i?void 0:i.showGridLines)||void 0===T?void 0:T.x)),color:d.COLORS.background.base},ticks:{fontSize:d.FONTS.caption.fontSize,color:null!==(E=i.yAxis.labelColor)&&void 0!==E?E:d.COLORS.content.secondary,callback:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?i.isInternationalStore?c.truncateValueForInternationalStore:c.truncateValueForIndianStore:void 0},stacked:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(f=i.yAxis)||void 0===f?void 0:f.stacked)||(null===(N=i.yAxis)||void 0===N?void 0:N.stacked):"boolean"!=typeof(null===(S=i.xAxis)||void 0===S?void 0:S.stacked)||(null===(H=i.xAxis)||void 0===H?void 0:H.stacked)},y:Object.assign(Object.assign({},(null===(L=null==i?void 0:i.equalHeight)||void 0===L?void 0:L.flag)?{suggestedMin:-(null==i?void 0:i.equalHeight.max),suggestedMax:null==i?void 0:i.equalHeight.max}:{}),{title:{display:!!(i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(k=i.xAxis)||void 0===k?void 0:k.title:null===(F=i.yAxis)||void 0===F?void 0:F.title),text:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(P=i.xAxis)||void 0===P?void 0:P.title:null===(_=i.yAxis)||void 0===_?void 0:_.title,color:null!==(w=i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(G=i.xAxis)||void 0===G?void 0:G.titleColor:null===(B=i.yAxis)||void 0===B?void 0:B.titleColor)&&void 0!==w?w:d.COLORS.content.secondary,font:{size:d.FONTS.caption.fontSize}},grid:{display:i.orientation!==u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(D=null==i?void 0:i.showGridLines)||void 0===D?void 0:D.y)||(null===(q=null==i?void 0:i.showGridLines)||void 0===q?void 0:q.y)),color:d.COLORS.background.base},ticks:Object.assign(Object.assign({stepSize:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(Z=i.xAxis)||void 0===Z?void 0:Z.stepSize:null===(z=i.yAxis)||void 0===z?void 0:z.stepSize,fontSize:d.FONTS.caption.fontSize,color:null!==(M=i.xAxis.labelColor)&&void 0!==M?M:d.COLORS.content.secondary},le?{min:0,max:2e3,stepSize:200}:{}),{callback:(null==i?void 0:i.ticksCallback)?null==i?void 0:i.ticksCallback:i.orientation!==u.GRAPH_ORIENTATION.VERTICAL?i.isInternationalStore?c.truncateValueForInternationalStore:c.truncateValueForIndianStore:void 0}),stacked:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(W=i.xAxis)||void 0===W?void 0:W.stacked)||(null===(V=i.xAxis)||void 0===V?void 0:V.stacked):"boolean"!=typeof(null===(Y=i.yAxis)||void 0===Y?void 0:Y.stacked)||(null===(J=i.yAxis)||void 0===J?void 0:J.stacked)})},onClick:(e,t)=>{if(!i.onBarClick)return;const o=t[0].datasetIndex,a=t[0].index,l=e.chart.data.datasets[o].label,n=e.chart.data.labels[a];i.onBarClick(n,l)},onHover:(e,t)=>{i.onBarClick&&t.length&&(e.native.target.style.cursor="pointer")}};i.orientation&&i.orientation!==u.GRAPH_ORIENTATION.VERTICAL?delete ve.scales.y.ticks.callback:delete ve.scales.x.ticks.callback;const pe={labels:ue,datasets:le?[{data:ae,backgroundColor:"rgba(0,0,0,0)"}]:ce},ge={labels:i.xAxis.data.map((e=>"string"==typeof e?e:e.name)),datasets:le?[{data:ae,backgroundColor:"rgba(0,0,0,0)"}]:xe},Oe=function(){let t=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return e.jsxRuntimeExports.jsx("div",Object.assign({style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:i.allowChartPopup&&!t?"flex-start":"flex-end",flexWrap:"wrap"}},{children:ce.map((t=>e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[e.jsxRuntimeExports.jsx("div",{style:{backgroundColor:t.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),e.jsxRuntimeExports.jsx(r.BodyTiny,Object.assign({color:d.COLORS.content.secondary},{children:t.label}))]}),t.label.replace(" ","_"))))}))};return e.jsxRuntimeExports.jsxs(x.GraphContainerWrapper,Object.assign({style:null!==(K=i.wrapperStyle)&&void 0!==K?K:{},padding:i.outerPadding,customLegend:i.customLegend},{children:[i.chartHeading&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:i.hideHeading?"flex-end":"space-between"}},{children:[!0!==i.hideHeading&&e.jsxRuntimeExports.jsx(r.TitleRegular,Object.assign({color:null!==(Q=i.chartHeading.color)&&void 0!==Q?Q:d.COLORS.content.secondary},{children:i.chartHeading.heading})),i.allowChartPopup&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end"}},{children:e.jsxRuntimeExports.jsx("div",{children:e.jsxRuntimeExports.jsx(n.IconButton,{Icon:t.default,onClick:()=>{oe(!0)}})})}))]})),i.customLegend&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:te,justifyContent:"space-between"}},{children:[e.jsxRuntimeExports.jsx(x.HeaderIconWrapper,{children:ee.map(((t,i)=>e.jsxRuntimeExports.jsx("div",{children:e.jsxRuntimeExports.jsx("div",{children:t})},i)))}),Oe()]})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"graph__wrapper"},{children:e.jsxRuntimeExports.jsx("div",Object.assign({style:{height:null!==(U=i.graphCanvasHeight)&&void 0!==U?U:500,width:null!==(X=i.graphCanvasWidth)&&void 0!==X?X:"auto"}},{children:e.jsxRuntimeExports.jsx(l.Bar,{options:ve,data:pe})}))})),ie&&e.jsxRuntimeExports.jsx(s.StyledModal,Object.assign({open:ie,onClose:()=>oe(!1),closeOnOutsideClick:!0,headingTitle:null===($=i.chartHeading)||void 0===$?void 0:$.heading,width:"85%"},{children:e.jsxRuntimeExports.jsxs("div",Object.assign({className:"graph__wrapper",style:{padding:"8px"}},{children:[i.customLegend&&Oe(!0),e.jsxRuntimeExports.jsx("div",Object.assign({style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"}},{children:e.jsxRuntimeExports.jsx(l.Bar,{options:ve,data:ge})}))]}))}))]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../node_modules/react/jsx-runtime.js"),t=require("../../../../assets/icons/maximize.svg.js"),i=require("chart.js"),o=require("chartjs-plugin-datalabels"),a=require("react"),l=require("react-chartjs-2"),n=require("../../../icon-button/IconButton.js"),s=require("../../../modals/styledModal.js"),r=require("../../../TypographyStyle.js"),d=require("../../../../constants/Theme.js"),c=require("../utils/calcPercentage.js"),u=require("./StackedBarChart.model.js"),x=require("./StackedBarChart.styles.js");function v(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=v(o);i.Chart.register(i.CategoryScale,i.LinearScale,i.BarElement,i.Tooltip,i.Legend,p.default);exports.StackedBarChart=i=>{var o,v,p,O,g,A,b,h,R,j,y,m,f,C,I,T,E,S,N,H,L,k,F,P,B,_,G,w,D,q,Z,z,M,W,$,V,Y,J,K,Q,U,X,ee,te,ie;const{headerIcons:oe=[],legendsAndIconDirection:ae="row"}=i,[le,ne]=a.useState(!1),se=[250,1e3,800,1500,300,600],re=0===i.yAxis.data.length,de=["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],ce=["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"],ue=i.customBarColors?i.customBarColors:i.customColourScaleBrand||i.customColourScalePastel?i.colorSchema===u.COLOR_SCHEMA.PASTEL?i.customColourScalePastel:i.customColourScaleBrand:i.colorSchema===u.COLOR_SCHEMA.PASTEL?ce:de,xe=i.customHoverColour,ve=a.useMemo((()=>{var e,t,o;return Object.assign(Object.assign({barPercentage:(null==i?void 0:i.barPercentage)||.4,categoryPercentage:1,pointStyle:"circle",barWidth:i.barWidth,borderRadius:(null==i?void 0:i.borderRadius)||void 0},"object"==typeof(null==i?void 0:i.borderRadius)?{borderSkipped:!1}:{}),(null===(e=null==i?void 0:i.addBarGap)||void 0===e?void 0:e.flag)?{borderWidth:{top:(null===(t=null==i?void 0:i.addBarGap)||void 0===t?void 0:t.value)||2,bottom:(null===(o=null==i?void 0:i.addBarGap)||void 0===o?void 0:o.value)||2,right:0,left:0},borderColor:"transparent"}:{})}),[i.barWidth,null==i?void 0:i.borderRadius,null==i?void 0:i.barPercentage,null==i?void 0:i.addBarGap]),pe={};i.yAxis.data.map((e=>{e.map((e=>{pe[e.name]?pe[e.name].push(e.value):pe[e.name]=[e.value]}))}));const Oe=Object.keys(pe).map(((e,t)=>Object.assign({label:e,data:pe[e],backgroundColor:null==ue?void 0:ue[t],hoverBackgroundColor:void 0===xe?void 0:xe[t]},ve)));let ge;ge=i.renderInHeightWiseManner?Oe.map(((e,t)=>Object.assign(Object.assign({},e),{order:e.data.reduce(((e,t)=>e+(t||0)),0)}))).sort(((e,t)=>t.order-e.order)):Oe;let Ae=i.xAxis.data.map((e=>"string"==typeof e?e:e.name)),be=ge;if(i.truncateBars){const e=((e,t,i)=>{if(t.length<=i)return{truncatedData:e,truncatedLabels:t,originalData:e,originalLabels:t};const o=e.map((e=>e.slice(0,i))),a=e.map((e=>e.slice(i).reduce(((e,t)=>e+t),0)));o.forEach(((e,t)=>e.push(a[t])));const l=t.slice(0,i);return l.push("Others"),{truncatedData:o,truncatedLabels:l,originalData:e,originalLabels:t}})(ge.map((e=>e.data)),Ae,i.truncateBars);ge.forEach(((t,i)=>t.data=e.truncatedData[i])),Ae=e.truncatedLabels,be=e.originalData.map(((e,t)=>Object.assign(Object.assign({},ge[t]),{data:e})))}const he={plugins:{legend:{display:!re&&!i.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!re,callbacks:{label:null===(o=i.tooltipConfig)||void 0===o?void 0:o.labelCallback,title:null===(v=i.tooltipConfig)||void 0===v?void 0:v.titleCallback,footer:null===(p=i.tooltipConfig)||void 0===p?void 0:p.footerCallback},footerFont:null===(g=null===(O=i.tooltipConfig)||void 0===O?void 0:O.footerStyles)||void 0===g?void 0:g.footerFont},datalabels:{display:null!==(A=i.showTotal)&&void 0!==A&&A,anchor:"end",align:"end",clamp:!0,formatter:(e,t)=>{var i;const o=t.datasetIndex,a=t.chart.data.datasets;if(o!==a.length-1)return"";const l=t.dataIndex;let n=0;for(let e=0;e<a.length;e++)n+=null!==(i=a[e].data[l])&&void 0!==i?i:0;return n?n<1e3?n:(n/1e3).toString().substring(0,4)+"k":""},color:d.COLORS.content.secondary}},layout:{padding:{right:i.showTotal&&i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?50:0,top:i.showTotal&&i.orientation!=u.GRAPH_ORIENTATION.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!i.customLegend,labels:{usePointStyle:!0}},indexAxis:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(b=i.yAxis)||void 0===b?void 0:b.title:null===(h=i.xAxis)||void 0===h?void 0:h.title),text:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(R=i.yAxis)||void 0===R?void 0:R.title:null===(j=i.xAxis)||void 0===j?void 0:j.title,color:null!==(f=i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(y=i.yAxis)||void 0===y?void 0:y.titleColor:null===(m=i.xAxis)||void 0===m?void 0:m.titleColor)&&void 0!==f?f:d.COLORS.content.secondary,font:{size:d.FONTS.caption.fontSize}},grid:{display:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(C=null==i?void 0:i.showGridLines)||void 0===C?void 0:C.x)||(null===(I=null==i?void 0:i.showGridLines)||void 0===I?void 0:I.x)),color:d.COLORS.background.base},ticks:{fontSize:d.FONTS.caption.fontSize,color:null!==(T=i.yAxis.labelColor)&&void 0!==T?T:d.COLORS.content.secondary,callback:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?e=>{var t;let o;o=i.isInternationalStore?c.truncateValueForInternationalStore(e):c.truncateValueForIndianStore(e);return`${o}${(null===(t=i.yAxis)||void 0===t?void 0:t.axisSuffix)||""}`}:(null===(E=i.xAxis)||void 0===E?void 0:E.axisSuffix)?e=>`${e}${i.xAxis.axisSuffix}`:void 0},stacked:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(S=i.yAxis)||void 0===S?void 0:S.stacked)||(null===(N=i.yAxis)||void 0===N?void 0:N.stacked):"boolean"!=typeof(null===(H=i.xAxis)||void 0===H?void 0:H.stacked)||(null===(L=i.xAxis)||void 0===L?void 0:L.stacked)},y:Object.assign(Object.assign({},(null===(k=null==i?void 0:i.equalHeight)||void 0===k?void 0:k.flag)?{suggestedMin:-(null==i?void 0:i.equalHeight.max),suggestedMax:null==i?void 0:i.equalHeight.max}:{}),{max:null===(F=null==i?void 0:i.yAxis)||void 0===F?void 0:F.max,title:{display:!!(i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(P=i.xAxis)||void 0===P?void 0:P.title:null===(B=i.yAxis)||void 0===B?void 0:B.title),text:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(_=i.xAxis)||void 0===_?void 0:_.title:null===(G=i.yAxis)||void 0===G?void 0:G.title,color:null!==(q=i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(w=i.xAxis)||void 0===w?void 0:w.titleColor:null===(D=i.yAxis)||void 0===D?void 0:D.titleColor)&&void 0!==q?q:d.COLORS.content.secondary,font:{size:d.FONTS.caption.fontSize}},grid:{display:i.orientation!==u.GRAPH_ORIENTATION.HORIZONTAL&&(void 0===(null===(Z=null==i?void 0:i.showGridLines)||void 0===Z?void 0:Z.y)||(null===(z=null==i?void 0:i.showGridLines)||void 0===z?void 0:z.y)),color:d.COLORS.background.base},ticks:Object.assign(Object.assign({stepSize:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?null===(M=i.xAxis)||void 0===M?void 0:M.stepSize:null===(W=i.yAxis)||void 0===W?void 0:W.stepSize,fontSize:d.FONTS.caption.fontSize,color:null!==($=i.xAxis.labelColor)&&void 0!==$?$:d.COLORS.content.secondary},re?{min:0,max:2e3,stepSize:200}:{}),{callback:(null==i?void 0:i.ticksCallback)?null==i?void 0:i.ticksCallback:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?e=>{var t;let o;o=i.isInternationalStore?c.truncateValueForInternationalStore(e):c.truncateValueForIndianStore(e);return`${o}${(null===(t=i.xAxis)||void 0===t?void 0:t.axisSuffix)||""}`}:(null===(V=i.yAxis)||void 0===V?void 0:V.axisSuffix)?e=>`${e}${i.yAxis.axisSuffix}`:void 0}),stacked:i.orientation===u.GRAPH_ORIENTATION.HORIZONTAL?"boolean"!=typeof(null===(Y=i.xAxis)||void 0===Y?void 0:Y.stacked)||(null===(J=i.xAxis)||void 0===J?void 0:J.stacked):"boolean"!=typeof(null===(K=i.yAxis)||void 0===K?void 0:K.stacked)||(null===(Q=i.yAxis)||void 0===Q?void 0:Q.stacked)})},onClick:(e,t)=>{if(!i.onBarClick)return;const o=t[0].datasetIndex,a=t[0].index,l=e.chart.data.datasets[o].label,n=e.chart.data.labels[a];i.onBarClick(n,l)},onHover:(e,t)=>{i.onBarClick&&t.length&&(e.native.target.style.cursor="pointer")}};let Re;i.orientation&&i.orientation!==u.GRAPH_ORIENTATION.VERTICAL?delete he.scales.y.ticks.callback:delete he.scales.x.ticks.callback,Re=re?[{data:se,backgroundColor:"rgba(0,0,0,0)"}]:ge;const je={labels:Ae,datasets:Re};let ye;ye=re?[{data:se,backgroundColor:"rgba(0,0,0,0)"}]:be;const me={labels:i.xAxis.data.map((e=>"string"==typeof e?e:e.name)),datasets:ye},fe=function(){let t,o=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return t=i.allowChartPopup&&!o?"flex-start":"flex-end",e.jsxRuntimeExports.jsx("div",Object.assign({style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:t,flexWrap:"wrap"}},{children:Oe.map((t=>e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[e.jsxRuntimeExports.jsx("div",{style:{backgroundColor:t.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),e.jsxRuntimeExports.jsx(r.BodyTiny,Object.assign({color:d.COLORS.content.secondary},{children:t.label}))]}),t.label.replace(" ","_"))))}))};return e.jsxRuntimeExports.jsxs(x.GraphContainerWrapper,Object.assign({style:null!==(U=i.wrapperStyle)&&void 0!==U?U:{},padding:i.outerPadding,customLegend:i.customLegend},{children:[i.chartHeading&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:i.hideHeading?"flex-end":"space-between"}},{children:[!0!==i.hideHeading&&e.jsxRuntimeExports.jsx(r.TitleRegular,Object.assign({color:null!==(X=i.chartHeading.color)&&void 0!==X?X:d.COLORS.content.secondary},{children:i.chartHeading.heading})),i.allowChartPopup&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end"}},{children:e.jsxRuntimeExports.jsx("div",{children:e.jsxRuntimeExports.jsx(n.IconButton,{Icon:t.default,onClick:()=>{ne(!0)}})})}))]})),i.customLegend&&e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:ae,justifyContent:"space-between"}},{children:[e.jsxRuntimeExports.jsx(x.HeaderIconWrapper,{children:oe.map(((t,i)=>e.jsxRuntimeExports.jsx("div",{children:e.jsxRuntimeExports.jsx("div",{children:t})},i)))}),fe()]})),e.jsxRuntimeExports.jsx("div",Object.assign({className:"graph__wrapper"},{children:e.jsxRuntimeExports.jsx("div",Object.assign({style:{height:null!==(ee=i.graphCanvasHeight)&&void 0!==ee?ee:500,width:null!==(te=i.graphCanvasWidth)&&void 0!==te?te:"auto"}},{children:e.jsxRuntimeExports.jsx(l.Bar,{options:he,data:je})}))})),le&&e.jsxRuntimeExports.jsx(s.StyledModal,Object.assign({open:le,onClose:()=>ne(!1),closeOnOutsideClick:!0,headingTitle:null===(ie=i.chartHeading)||void 0===ie?void 0:ie.heading,width:"85%"},{children:e.jsxRuntimeExports.jsxs("div",Object.assign({className:"graph__wrapper",style:{padding:"8px"}},{children:[i.customLegend&&fe(!0),e.jsxRuntimeExports.jsx("div",Object.assign({style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"}},{children:e.jsxRuntimeExports.jsx(l.Bar,{options:he,data:me})}))]}))}))]}))};
package/dist/cjs/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.model.d.ts CHANGED
@@ -7,6 +7,8 @@ export interface AxisDetailsI {
7
7
  labelColor?: string;
8
8
  stepSize?: number;
9
9
  stacked?: boolean;
10
+ axisSuffix?: string;
11
+ max?: number;
10
12
  }
11
13
  export interface XAxisDataI {
12
14
  name: string;
@@ -58,10 +60,12 @@ export interface StackedBarGraphI {
58
60
  customColourScaleBrand?: string[];
59
61
  customColourScalePastel?: string[];
60
62
  customHoverColour?: string[];
63
+ customBarColors?: string[] /** Custom colors for individual bars in the stack */;
61
64
  isInternationalStore?: boolean;
62
65
  truncateBars?: number;
63
66
  allowChartPopup?: boolean;
64
67
  hideHeading?: boolean;
68
+ /** 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 */
65
69
  borderRadius?: number | {
66
70
  topLeft?: number;
67
71
  topRight?: number;
@@ -81,7 +85,8 @@ export interface StackedBarGraphI {
81
85
  flag: boolean;
82
86
  value: number;
83
87
  };
84
- ticksCallback?: (value: number) => string;
88
+ ticksCallback?: (value: number | string) => string;
85
89
  legendsAndIconDirection?: 'row-reverse' | 'row';
86
90
  headerIcons?: React.ReactNode[];
91
+ renderInHeightWiseManner?: boolean /** When true, renders smaller bars on top of larger bars */;
87
92
  }
package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../../node_modules/react/jsx-runtime.js"),i=require("chart.js"),t=require("react-chartjs-2"),r=require("../../../TypographyStyle.js"),o=require("../../../../constants/Theme.js"),s=require("../LineChart/LineChart.styled.js"),a=require("./VerticalBarAndLinearGraph.styles.js");i.Chart.register(i.CategoryScale,i.LinearScale,i.BarElement,i.Tooltip);exports.VerticalBarAndLinearGraph=i=>{var n,l,x,c,d;const p=[0,0,0,0,0,0],g=-1===i.barAxis.data.findIndex((e=>0!==e)),b=-1===i.lineAxis.data.findIndex((e=>0!==e)),u={min:0,max:2e3,stepSize:200},j=[{legend:i.barAxis.title,color:i.barAxis.graphColor},{legend:i.lineAxis.title,color:i.lineAxis.graphColor}],h={responsive:!0,plugins:{legend:{display:!1}},scales:{x:{title:{display:!!i.xAxis.title,text:i.xAxis.title,color:i.xAxis.titleColor,font:{size:o.FONTS.caption.fontSize}},grid:{display:!1,borderColor:o.COLORS.background.base},ticks:{fontSize:o.FONTS.caption.fontSize,color:null!==(n=i.xAxis.labelColor)&&void 0!==n?n:o.COLORS.content.secondary}},bar:{position:"left",title:{display:!!i.barAxis.title,text:i.barAxis.title,color:i.barAxis.titleColor,font:{size:o.FONTS.caption.fontSize}},grid:{borderColor:"white",color:o.COLORS.background.base},ticks:Object.assign({fontSize:o.FONTS.caption.fontSize,color:null!==(l=i.barAxis.labelColor)&&void 0!==l?l:o.COLORS.content.secondary},g?u:{})},line:{position:"right",title:{display:!!i.lineAxis.title,text:i.lineAxis.title,color:i.lineAxis.titleColor,font:{size:o.FONTS.caption.fontSize}},grid:{display:!1,borderColor:"white",color:o.COLORS.background.base},ticks:Object.assign({fontSize:o.FONTS.caption.fontSize,color:null!==(x=i.lineAxis.labelColor)&&void 0!==x?x:o.COLORS.content.secondary},b?u:{}),display:!0}},maintainAspectRatio:!1},A={labels:i.xAxis.forceShowXAxis?i.xAxis.data.map((e=>e.toString())):g&&b?["-","-","-","-","-","-"]:i.xAxis.data.map((e=>e.toString())),datasets:[{yAxisID:"line",type:"line",data:b?p:i.lineAxis.data,borderColor:i.lineAxis.graphColor||"rgba(0,0,0,0)",borderWidth:2,fill:!1,pointRadius:1},{yAxisID:"bar",type:"bar",data:g?p:i.barAxis.data,backgroundColor:i.barAxis.graphColor||"rgba(0,0,0,0)",barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return e.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:2}},{children:[e.jsxRuntimeExports.jsx(s.LegendWrapper,Object.assign({position:"center"},{children:j.map(((i,t)=>{let{legend:o,color:a}=i;return o?e.jsxRuntimeExports.jsxs(s.LegendContainer,{children:[e.jsxRuntimeExports.jsx(s.LegendColor,{color:a}),e.jsxRuntimeExports.jsx(r.SmallRegular,Object.assign({color:"#667085"},{children:o}))]},t):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})}))})),e.jsxRuntimeExports.jsxs(a.GraphContainerWrapper,{children:[i.chartHeading&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginBottom:24}},{children:e.jsxRuntimeExports.jsx(r.TitleRegular,Object.assign({color:null!==(c=i.chartHeading.color)&&void 0!==c?c:o.COLORS.content.secondary},{children:i.chartHeading.heading}))})),e.jsxRuntimeExports.jsx("div",Object.assign({style:{height:null!==(d=i.graphCanvasHeight)&&void 0!==d?d:500}},{children:e.jsxRuntimeExports.jsx(t.Chart,{type:"bar",data:A,options:h})}))]})]}))};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var i=require("../../../../node_modules/react/jsx-runtime.js"),e=require("chart.js"),t=require("react-chartjs-2"),r=require("../../../TypographyStyle.js"),a=require("../../../../constants/Theme.js"),o=require("../LineChart/LineChart.styled.js"),n=require("../utils/calcPercentage.js"),l=require("./VerticalBarAndLinearGraph.styles.js"),s=require("./VerticalBarAndLinearGraphModel.js");e.Chart.register(e.CategoryScale,e.LinearScale,e.BarElement,e.Tooltip);exports.VerticalBarAndLinearGraph=e=>{var x,d,c,u,p,A,b,g,j,S;const O=[0,0,0,0,0,0],h=["-","-","-","-","-","-"],R=-1===e.barAxis.data.findIndex((i=>0!==i)),f=-1===e.lineAxis.data.findIndex((i=>0!==i)),m=!e.lineAxis2||-1===e.lineAxis2.data.findIndex((i=>0!==i)),C={min:0,max:2e3,stepSize:200},y=[{legend:e.barAxis.title,color:e.barAxis.graphColor},{legend:e.lineAxis.title,color:e.lineAxis.graphColor},...e.lineAxis2?[{legend:e.lineAxis2.title,color:e.lineAxis2.graphColor}]:[]],v={responsive:!0,plugins:{legend:{display:!1},tooltip:{callbacks:{label:i=>{var t;const r=i.raw,a=i.dataset;let o="";"bar"===a.yAxisID?o=e.barAxis.axisSuffix||"":"line"===a.yAxisID?o=e.lineAxis.axisSuffix||"":"line2"===a.yAxisID&&(o=(null===(t=e.lineAxis2)||void 0===t?void 0:t.axisSuffix)||"");let l=r;return e.orientation===s.GRAPH_ORIENTATION.HORIZONTAL&&(l=e.isInternationalStore?n.truncateValueForInternationalStore(r):n.truncateValueForIndianStore(r)),`${l}${o}`}}}},scales:{x:{title:{display:!!e.xAxis.title,text:e.xAxis.title,color:e.xAxis.titleColor,font:{size:a.FONTS.caption.fontSize}},grid:{display:!1,borderColor:a.COLORS.background.base},ticks:{fontSize:a.FONTS.caption.fontSize,color:null!==(x=e.xAxis.labelColor)&&void 0!==x?x:a.COLORS.content.secondary,callback:(null===(d=e.xAxis)||void 0===d?void 0:d.axisSuffix)?i=>`${i}${e.xAxis.axisSuffix}`:void 0}},bar:{position:"left",title:{display:!!e.barAxis.title,text:e.barAxis.title,color:e.barAxis.titleColor,font:{size:a.FONTS.caption.fontSize}},grid:{borderColor:"white",color:a.COLORS.background.base},max:null===(c=null==e?void 0:e.barAxis)||void 0===c?void 0:c.max,ticks:Object.assign(Object.assign({fontSize:a.FONTS.caption.fontSize,color:null!==(u=e.barAxis.labelColor)&&void 0!==u?u:a.COLORS.content.secondary},R?C:{}),{callback:e.orientation===s.GRAPH_ORIENTATION.HORIZONTAL?i=>{var t;let r;r=e.isInternationalStore?n.truncateValueForInternationalStore(i):n.truncateValueForIndianStore(i);return`${r}${(null===(t=e.barAxis)||void 0===t?void 0:t.axisSuffix)||""}`}:(null===(p=e.barAxis)||void 0===p?void 0:p.axisSuffix)?i=>`${i}${e.barAxis.axisSuffix}`:void 0})},line:{position:"right",title:{display:!!e.lineAxis.title,text:e.lineAxis.title,color:e.lineAxis.titleColor,font:{size:a.FONTS.caption.fontSize}},max:null===(A=null==e?void 0:e.lineAxis)||void 0===A?void 0:A.max,grid:{display:!1,borderColor:"white",color:a.COLORS.background.base},ticks:Object.assign(Object.assign({fontSize:a.FONTS.caption.fontSize,color:null!==(b=e.lineAxis.labelColor)&&void 0!==b?b:a.COLORS.content.secondary},f?C:{}),{callback:e.orientation===s.GRAPH_ORIENTATION.HORIZONTAL?i=>{var t;let r;r=e.isInternationalStore?n.truncateValueForInternationalStore(i):n.truncateValueForIndianStore(i);return`${r}${(null===(t=e.lineAxis)||void 0===t?void 0:t.axisSuffix)||""}`}:(null===(g=e.lineAxis)||void 0===g?void 0:g.axisSuffix)?i=>`${i}${e.lineAxis.axisSuffix}`:void 0}),display:!0}},maintainAspectRatio:!1};let I,L,T,E;e.orientation&&e.orientation!==s.GRAPH_ORIENTATION.VERTICAL?(delete v.scales.bar.ticks.callback,delete v.scales.line.ticks.callback):delete v.scales.x.ticks.callback,I=e.xAxis.forceShowXAxis?e.xAxis.data.map((i=>i.toString())):R&&f&&m?h:e.xAxis.data.map((i=>i.toString())),L=e.noDummyValues?e.lineAxis.data:f?O:e.lineAxis.data,e.lineAxis2&&(T=e.noDummyValues?e.lineAxis2.data:m?O:e.lineAxis2.data),E=e.noDummyValues?e.barAxis.data:R?O:e.barAxis.data;const k={labels:I,datasets:[{yAxisID:"line",type:"line",data:L,borderColor:e.lineAxis.graphColor||"rgba(0,0,0,0)",backgroundColor:e.lineAxis.graphColor,borderWidth:2,fill:!1,pointRadius:e.pointRadius||1},...e.lineAxis2?[{yAxisID:"line",type:"line",data:T,borderColor:e.lineAxis2.graphColor||"rgba(0,0,0,0)",borderWidth:2,fill:!1,pointRadius:e.pointRadius||1,backgroundColor:e.lineAxis2.graphColor}]:[],{yAxisID:"bar",type:"bar",data:E,backgroundColor:e.barAxis.graphColor||"rgba(0,0,0,0)",barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return i.jsxRuntimeExports.jsxs(l.GraphWrapper,{children:[e.customLegend?i.jsxRuntimeExports.jsx(l.LegendsWrapper,{children:y.map(((e,t)=>{let{legend:o,color:n}=e;return o?i.jsxRuntimeExports.jsxs(l.LegendMiddleWrapper,{children:[i.jsxRuntimeExports.jsx(l.LegendColorBox,{color:n}),i.jsxRuntimeExports.jsx(r.BodyTiny,Object.assign({color:a.COLORS.content.secondary},{children:o}))]},t):null}))}):i.jsxRuntimeExports.jsx(o.LegendWrapper,Object.assign({position:"center"},{children:y.map(((e,t)=>{let{legend:a,color:n}=e;return a?i.jsxRuntimeExports.jsxs(o.LegendContainer,{children:[i.jsxRuntimeExports.jsx(o.LegendColor,{color:n}),i.jsxRuntimeExports.jsx(r.SmallRegular,Object.assign({color:"#667085"},{children:a}))]},t):i.jsxRuntimeExports.jsx(i.jsxRuntimeExports.Fragment,{})}))})),i.jsxRuntimeExports.jsxs(l.GraphContainerWrapper,{children:[e.chartHeading&&i.jsxRuntimeExports.jsx("div",Object.assign({style:{marginBottom:24}},{children:i.jsxRuntimeExports.jsx(r.TitleRegular,Object.assign({color:null!==(j=e.chartHeading.color)&&void 0!==j?j:a.COLORS.content.secondary},{children:e.chartHeading.heading}))})),i.jsxRuntimeExports.jsx("div",Object.assign({style:{height:null!==(S=e.graphCanvasHeight)&&void 0!==S?S:500}},{children:i.jsxRuntimeExports.jsx(t.Chart,{type:"bar",data:k,options:v})}))]})]})};
package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.d.ts CHANGED
@@ -1 +1,7 @@
1
1
  export declare const GraphContainerWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
2
+ export declare const LegendsWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
3
+ export declare const LegendMiddleWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
4
+ export declare const LegendColorBox: import("styled-components").StyledComponent<"div", any, {
5
+ color: string;
6
+ }, never>;
7
+ export declare const GraphWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.js CHANGED
@@ -1,4 +1,25 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("../../../../constants/Theme.js");function t(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const n=t(e).default.div`
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),r=require("../../../../constants/Theme.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=p(e);const d=t.default.div`
2
2
  background-color: ${r.COLORS.surface.standard};
3
3
  padding: 0;
4
- `;exports.GraphContainerWrapper=n;
4
+ `,a=t.default.div`
5
+ display: flex;
6
+ flex-direction: row;
7
+ gap: 10px;
8
+ padding: 0px 24px 12px 24px;
9
+ justify-content: flex-end;
10
+ flex-wrap: wrap;
11
+ `,o=t.default.div`
12
+ display: flex;
13
+ align-items: center;
14
+ gap: 8px;
15
+ margin-top: 4px;
16
+ `,i=t.default.div`
17
+ background-color: ${e=>e.color};
18
+ width: 16px;
19
+ height: 16px;
20
+ border-radius: 2px;
21
+ `,n=t.default.div`
22
+ display: flex;
23
+ flex-direction: column;
24
+ gap: 2px;
25
+ `;exports.GraphContainerWrapper=d,exports.GraphWrapper=n,exports.LegendColorBox=i,exports.LegendMiddleWrapper=o,exports.LegendsWrapper=a;
package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraphModel.d.ts CHANGED
@@ -4,11 +4,17 @@ export interface AxisDetailsI {
4
4
  data: number[] | string[];
5
5
  labelColor?: string;
6
6
  graphColor?: string;
7
+ axisSuffix?: string;
8
+ max?: number;
7
9
  }
8
10
  export interface ChartHeadingI {
9
11
  heading: string;
10
12
  color?: string;
11
13
  }
14
+ export declare enum GRAPH_ORIENTATION {
15
+ VERTICAL = "vertical",
16
+ HORIZONTAL = "horizontal"
17
+ }
12
18
  export interface VerticalBarAndLinearGraphI {
13
19
  graphCanvasHeight?: number;
14
20
  tickColor?: string;
@@ -18,5 +24,11 @@ export interface VerticalBarAndLinearGraphI {
18
24
  forceShowXAxis?: boolean;
19
25
  };
20
26
  lineAxis: AxisDetailsI;
27
+ lineAxis2?: AxisDetailsI;
21
28
  barAxis: AxisDetailsI;
29
+ isInternationalStore?: boolean;
30
+ customLegend?: boolean;
31
+ orientation?: GRAPH_ORIENTATION;
32
+ noDummyValues?: boolean;
33
+ pointRadius?: number;
22
34
  }
package/dist/cjs/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraphModel.js ADDED
@@ -0,0 +1 @@
1
+ "use strict";var e;Object.defineProperty(exports,"__esModule",{value:!0}),exports.GRAPH_ORIENTATION=void 0,(e=exports.GRAPH_ORIENTATION||(exports.GRAPH_ORIENTATION={})).VERTICAL="vertical",e.HORIZONTAL="horizontal";
package/dist/cjs/components/bik-layout/MockMenus.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  export declare const Menus: ({
3
2
  displayName: string;
4
3
  key: number;
package/dist/cjs/components/toaster/Toaster.d.ts CHANGED
@@ -11,8 +11,6 @@ export type ToasterProps = {
11
11
  subText?: string;
12
12
  position?: ToastPosition;
13
13
  type?: 'info' | 'success' | 'error' | 'default' | 'warning';
14
- duration?: number;
15
- blocking?: boolean;
16
14
  closeOnClick?: boolean;
17
15
  hideProgressBar?: boolean;
18
16
  autoClose?: number | false | undefined;
package/dist/cjs/components/toaster/Toaster.js CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../node_modules/react/jsx-runtime.js"),e=require("../../assets/icons/alert_triangle.svg.js"),o=require("../../assets/icons/check.svg.js"),n=require("../../assets/icons/cross.svg.js"),s=require("../../assets/icons/errorInfo.svg.js"),i=require("../../assets/icons/info.svg.js"),r=require("react"),u=require("react-dom"),l=require("react-toastify"),c=require("../button/Button.js"),d=require("./Toaster.styled.js"),a=require("../TypographyStyle.js"),x=require("../../constants/Theme.js");function p(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var j=p(r),h=p(u);const y=e=>t.jsxRuntimeExports.jsxs(a.BodySecondary,Object.assign({color:"#9E9E9E",customStyles:{fontWeight:600,fontSize:14,width:18}},{children:[e.duration,"s"]})),g=e=>{const o="default"===e.type?x.COLORS.content.primary:"success"===e.type?x.COLORS.content.positive:"error"===e.type?x.COLORS.content.negative:"warning"===e.type?x.COLORS.content.warning:x.COLORS.content.brand,{timerValue:s}=r.useContext(f),i=(!e.blocking||-1!==s)&&(e.blocking&&s>0);return t.jsxRuntimeExports.jsx("div",Object.assign({tabIndex:i?-1:0,role:"button",style:{width:20,display:"flex",cursor:i?"not-allowed":"pointer",alignSelf:""+(e.alignTop?"flex-start":"center"),opacity:i?.5:1},onClick:()=>{!i&&e.closeToast&&e.closeToast()},onKeyDown:t=>{"Enter"===t.key&&!i&&e.closeToast&&e.closeToast()}},{children:s>0?t.jsxRuntimeExports.jsx(y,{duration:s}):t.jsxRuntimeExports.jsx(n.default,{height:20,width:20,color:o})}))},v=e=>{var o,n;const s=x.COLORS.content.placeholder,{toasterText:i}=r.useContext(f);return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:t.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexGrow:1}},{children:[t.jsxRuntimeExports.jsx("div",Object.assign({style:{flexGrow:1,marginRight:32,display:"flex",alignItems:"center"}},{children:t.jsxRuntimeExports.jsxs("div",{children:[e.subText?t.jsxRuntimeExports.jsx(a.TitleSmall,Object.assign({color:"inherit"},{children:null!==(o=e.toastText)&&void 0!==o?o:i})):t.jsxRuntimeExports.jsx(a.BodySecondary,Object.assign({color:"inherit"},{children:null!==(n=e.toastText)&&void 0!==n?n:i})),e.subText&&t.jsxRuntimeExports.jsx("div",Object.assign({style:{marginTop:2}},{children:t.jsxRuntimeExports.jsx(a.BodyCaption,Object.assign({color:x.COLORS.content.secondary},{children:e.subText}))}))]})})),e.showButton&&t.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px",marginRight:{showSecondButton:4,showButton:0}[e.showSecondButton?"showSecondButton":"showButton"]}},{children:t.jsxRuntimeExports.jsx(c.Button,{buttonText:e.buttonText,buttonType:"tertiaryGray",color:x.COLORS.content.secondary,onClick:e.onButtonClick})})),e.showSecondButton&&t.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px"}},{children:t.jsxRuntimeExports.jsx(c.Button,{buttonText:e.secondButtonText,buttonType:"tertiaryGray",color:x.COLORS.content.secondary,onClick:e.onSecondButtonClick})})),e.showButton||e.showSecondButton?t.jsxRuntimeExports.jsx("div",{style:{height:28,alignSelf:"center",marginLeft:8,marginRight:8,borderRight:`1px solid ${s}`,borderRadius:1}}):null]}))})},f=j.default.createContext({toasterText:"",timerValue:-1});exports.Toaster=n=>{const u=r.useRef(n.toastId||"default-toast"),[c,a]=r.useState(n.text),[p,j]=r.useState(n.duration||-1),y=l.cssTransition({enter:"Toastify__slide-enter",exit:"Toastify__slide-exit"}),b="default"===n.type?null:"success"===n.type?t.jsxRuntimeExports.jsx(o.default,{width:20,height:20,color:x.COLORS.content.positive}):"error"===n.type?t.jsxRuntimeExports.jsx(s.default,{width:20,height:20,color:x.COLORS.content.negative}):"warning"===n.type?t.jsxRuntimeExports.jsx(e.default,{width:20,height:20,color:x.COLORS.content.warning}):t.jsxRuntimeExports.jsx(i.default,{width:20,height:20,color:x.COLORS.content.brand});r.useEffect((()=>{u.current&&u.current===n.toastId?(a(n.text),l.toast.update(u.current,{autoClose:n.autoClose})):u.current&&u.current!==n.toastId&&m(n.text)}),[n.toastId,n.text]),r.useEffect((()=>{if(!n.duration)return;j(n.duration);const t=setInterval((()=>{j((e=>{const o=e-1;return o<=0?(clearInterval(t),0):o}))}),1e3);return()=>clearInterval(t)}),[n.duration]);const m=e=>{var o,s,i,r,c,d,a,x,p,j,h,f,m,T,B,R;void 0!==n.hideLeftIcon||n.leftIcon?l.toast(t.jsxRuntimeExports.jsx(v,{toastText:e,type:n.type||"info",buttonText:null===(o=n.buttonProps)||void 0===o?void 0:o.buttonText,secondButtonText:null===(s=n.secondButtonProps)||void 0===s?void 0:s.buttonText,showButton:null===(i=n.buttonProps)||void 0===i?void 0:i.showButton,showSecondButton:null===(r=n.secondButtonProps)||void 0===r?void 0:r.showButton,onButtonClick:null===(c=n.buttonProps)||void 0===c?void 0:c.onButtonClick,onSecondButtonClick:null===(d=n.secondButtonProps)||void 0===d?void 0:d.onButtonClick,subText:n.subText}),{onClose:n.onCloseToast?n.onCloseToast:()=>({}),icon:!0!==n.hideLeftIcon&&(n.leftIcon?n.leftIcon:"default"!==n.type&&t.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:b}))),type:n.type,closeButton:t.jsxRuntimeExports.jsx(g,{type:n.type||"default",alignTop:!(!n.subText||(null===(a=n.buttonProps)||void 0===a?void 0:a.showButton)||(null===(x=n.secondButtonProps)||void 0===x?void 0:x.showButton)),blocking:n.blocking}),toastId:n.toastId||"default-toast",transition:y}):u.current=l.toast(t.jsxRuntimeExports.jsx(v,{toastText:e,type:n.type||"info",buttonText:null===(p=n.buttonProps)||void 0===p?void 0:p.buttonText,secondButtonText:null===(j=n.secondButtonProps)||void 0===j?void 0:j.buttonText,showButton:null===(h=n.buttonProps)||void 0===h?void 0:h.showButton,showSecondButton:null===(f=n.secondButtonProps)||void 0===f?void 0:f.showButton,onButtonClick:null===(m=n.buttonProps)||void 0===m?void 0:m.onButtonClick,onSecondButtonClick:null===(T=n.secondButtonProps)||void 0===T?void 0:T.onButtonClick,subText:n.subText}),{onClose:n.onCloseToast?n.onCloseToast:()=>({}),type:n.type,icon:"default"!==n.type&&t.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:b})),closeButton:t.jsxRuntimeExports.jsx(g,{type:n.type||"default",alignTop:!(!n.subText||(null===(B=n.buttonProps)||void 0===B?void 0:B.showButton)||(null===(R=n.secondButtonProps)||void 0===R?void 0:R.showButton)),blocking:n.blocking}),toastId:n.toastId||"default-toast",transition:y})};return r.useEffect((()=>{m()}),[]),h.default.createPortal(t.jsxRuntimeExports.jsx(d.ToasterStyled,Object.assign({width:n.width,height:n.height,zIndex:n.zIndex,isSubTextIncluded:!!n.subText,type:n.type},{children:t.jsxRuntimeExports.jsx(f.Provider,Object.assign({value:{toasterText:c,timerValue:p}},{children:t.jsxRuntimeExports.jsx(l.ToastContainer,{position:n.position||"top-right",closeOnClick:n.closeOnClick||!1,hideProgressBar:n.hideProgressBar||!1,draggable:!1,autoClose:n.autoClose||!1,theme:"colored"})}))})),document.body)};
1
+ "use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../node_modules/react/jsx-runtime.js"),o=require("../../assets/icons/alert_triangle.svg.js"),e=require("../../assets/icons/check.svg.js"),s=require("../../assets/icons/cross.svg.js"),n=require("../../assets/icons/errorInfo.svg.js"),i=require("../../assets/icons/info.svg.js"),r=require("react"),u=require("react-dom"),l=require("react-toastify"),d=require("../button/Button.js"),c=require("./Toaster.styled.js"),x=require("../TypographyStyle.js"),a=require("../../constants/Theme.js");function p(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var j=p(r),h=p(u);const y=o=>{const e=(o.type,a.COLORS.content.secondary);return t.jsxRuntimeExports.jsx("div",Object.assign({tabIndex:0,role:"button",style:{width:20,display:"flex",cursor:"pointer",alignSelf:""+(o.alignTop?"flex-start":"center")},onClick:o.closeToast,onKeyDown:t=>{"Enter"===t.key&&o.closeToast&&o.closeToast()}},{children:t.jsxRuntimeExports.jsx(s.default,{height:20,width:20,color:e})}))},v=o=>{var e,s;const n=a.COLORS.content.placeholder,{toasterText:i}=r.useContext(g);return t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:t.jsxRuntimeExports.jsxs("div",Object.assign({style:{display:"flex",flexGrow:1}},{children:[t.jsxRuntimeExports.jsx("div",Object.assign({style:{flexGrow:1,marginRight:32,display:"flex",alignItems:"center"}},{children:t.jsxRuntimeExports.jsxs("div",{children:[o.subText?t.jsxRuntimeExports.jsx(x.TitleSmall,Object.assign({color:"inherit"},{children:null!==(e=o.toastText)&&void 0!==e?e:i})):t.jsxRuntimeExports.jsx(x.BodySecondary,Object.assign({color:"inherit"},{children:null!==(s=o.toastText)&&void 0!==s?s:i})),o.subText&&t.jsxRuntimeExports.jsx("div",Object.assign({style:{marginTop:2}},{children:t.jsxRuntimeExports.jsx(x.BodyCaption,Object.assign({color:a.COLORS.content.secondary},{children:o.subText}))}))]})})),o.showButton&&t.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px",marginRight:{showSecondButton:4,showButton:0}[o.showSecondButton?"showSecondButton":"showButton"]}},{children:t.jsxRuntimeExports.jsx(d.Button,{buttonText:o.buttonText,buttonType:"tertiaryGray",color:a.COLORS.content.secondary,onClick:o.onButtonClick})})),o.showSecondButton&&t.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px"}},{children:t.jsxRuntimeExports.jsx(d.Button,{buttonText:o.secondButtonText,buttonType:"tertiaryGray",color:a.COLORS.content.secondary,onClick:o.onSecondButtonClick})})),o.showButton||o.showSecondButton?t.jsxRuntimeExports.jsx("div",{style:{height:28,alignSelf:"center",marginLeft:8,marginRight:8,borderRight:`1px solid ${n}`,borderRadius:1}}):null]}))})},g=j.default.createContext({toasterText:""});exports.Toaster=s=>{const u=r.useRef(s.toastId||"default-toast"),[d,x]=r.useState(s.text),p=l.cssTransition({enter:"Toastify__slide-enter",exit:"Toastify__slide-exit"}),j="default"===s.type?null:"success"===s.type?t.jsxRuntimeExports.jsx(e.default,{width:20,height:20,color:a.COLORS.content.positive}):"error"===s.type?t.jsxRuntimeExports.jsx(n.default,{width:20,height:20,color:a.COLORS.content.negative}):"warning"===s.type?t.jsxRuntimeExports.jsx(o.default,{width:20,height:20,color:a.COLORS.content.warning}):t.jsxRuntimeExports.jsx(i.default,{width:20,height:20,color:a.COLORS.content.brand});r.useEffect((()=>{u.current&&u.current===s.toastId?(x(s.text),l.toast.update(u.current,{autoClose:s.autoClose})):u.current&&u.current!==s.toastId&&f(s.text)}),[s.toastId,s.text]);const f=o=>{var e,n,i,r,d,c,x,a,h,g,f,b,T,B,m,R;void 0!==s.hideLeftIcon||s.leftIcon?l.toast(t.jsxRuntimeExports.jsx(v,{toastText:o,type:s.type||"info",buttonText:null===(e=s.buttonProps)||void 0===e?void 0:e.buttonText,secondButtonText:null===(n=s.secondButtonProps)||void 0===n?void 0:n.buttonText,showButton:null===(i=s.buttonProps)||void 0===i?void 0:i.showButton,showSecondButton:null===(r=s.secondButtonProps)||void 0===r?void 0:r.showButton,onButtonClick:null===(d=s.buttonProps)||void 0===d?void 0:d.onButtonClick,onSecondButtonClick:null===(c=s.secondButtonProps)||void 0===c?void 0:c.onButtonClick,subText:s.subText}),{onClose:s.onCloseToast?s.onCloseToast:()=>({}),icon:!0!==s.hideLeftIcon&&(s.leftIcon?s.leftIcon:"default"!==s.type&&t.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:j}))),type:s.type,closeButton:t.jsxRuntimeExports.jsx(y,{type:s.type||"default",alignTop:!(!s.subText||(null===(x=s.buttonProps)||void 0===x?void 0:x.showButton)||(null===(a=s.secondButtonProps)||void 0===a?void 0:a.showButton))}),toastId:s.toastId||"default-toast",transition:p}):u.current=l.toast(t.jsxRuntimeExports.jsx(v,{toastText:o,type:s.type||"info",buttonText:null===(h=s.buttonProps)||void 0===h?void 0:h.buttonText,secondButtonText:null===(g=s.secondButtonProps)||void 0===g?void 0:g.buttonText,showButton:null===(f=s.buttonProps)||void 0===f?void 0:f.showButton,showSecondButton:null===(b=s.secondButtonProps)||void 0===b?void 0:b.showButton,onButtonClick:null===(T=s.buttonProps)||void 0===T?void 0:T.onButtonClick,onSecondButtonClick:null===(B=s.secondButtonProps)||void 0===B?void 0:B.onButtonClick,subText:s.subText}),{onClose:s.onCloseToast?s.onCloseToast:()=>({}),type:s.type,icon:"default"!==s.type&&t.jsxRuntimeExports.jsx("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:j})),closeButton:t.jsxRuntimeExports.jsx(y,{type:s.type||"default",alignTop:!(!s.subText||(null===(m=s.buttonProps)||void 0===m?void 0:m.showButton)||(null===(R=s.secondButtonProps)||void 0===R?void 0:R.showButton))}),toastId:s.toastId||"default-toast",transition:p})};return r.useEffect((()=>{f()}),[]),h.default.createPortal(t.jsxRuntimeExports.jsx(c.ToasterStyled,Object.assign({width:s.width,height:s.height,zIndex:s.zIndex,isSubTextIncluded:!!s.subText,type:s.type},{children:t.jsxRuntimeExports.jsx(g.Provider,Object.assign({value:{toasterText:d}},{children:t.jsxRuntimeExports.jsx(l.ToastContainer,{position:s.position||"top-right",closeOnClick:s.closeOnClick||!1,hideProgressBar:s.hideProgressBar||!1,draggable:!1,autoClose:s.autoClose||!1,theme:"colored"})}))})),document.body)};
package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
- import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
2
+ import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
3
3
  declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
4
4
  export default EventsTrigger;
package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
1
+ import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
2
2
  export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts CHANGED
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
- import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
2
+ import { QueryBuilderNodeProps } from "../../../types/QueryBuilderNodeProps.type";
3
3
  declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
4
4
  export default IGTrigger;
package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts CHANGED
@@ -1,2 +1,2 @@
1
- import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
1
+ import { QueryBuilderAPIData } from "../../../types/QueryBuilderAPI.type";
2
2
  export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { DropdownOption } from "../../../dropdown/type";
3
- import { QueryBuilderProperty } from "../../Types/QueryBuilder.type";
4
- import { QueryBuilderNodeProps } from "../../Types/QueryBuilderNodeProps.type";
3
+ import { QueryBuilderProperty } from "../../types/QueryBuilder.type";
4
+ import { QueryBuilderNodeProps } from "../../types/QueryBuilderNodeProps.type";
5
5
  declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
6
6
  cacheKey: string;
7
7
  propertyAddBtnText: string;
package/dist/esm/components/TypographyStyle.d.ts CHANGED
@@ -1,8 +1,3 @@
1
- interface customStyles {
2
- fontWeight?: number;
3
- fontSize?: number;
4
- width?: number;
5
- }
6
1
  export declare const TitleXlarge: import("styled-components").StyledComponent<"div", any, {
7
2
  numberOfLines?: number | undefined;
8
3
  color?: string | undefined;
@@ -42,7 +37,6 @@ export declare const BodyPrimary: import("styled-components").StyledComponent<"d
42
37
  export declare const BodySecondary: import("styled-components").StyledComponent<"div", any, {
43
38
  numberOfLines?: number | undefined;
44
39
  color?: string | undefined;
45
- customStyles?: customStyles | undefined;
46
40
  }, never>;
47
41
  export declare const ButtonRegularAI: import("styled-components").StyledComponent<"div", any, {
48
42
  numberOfLines?: number | undefined;
@@ -56,7 +50,6 @@ export declare const BodyPrimaryLink: import("styled-components").StyledComponen
56
50
  export declare const BodySecondaryLink: import("styled-components").StyledComponent<"div", any, {
57
51
  numberOfLines?: number | undefined;
58
52
  color?: string | undefined;
59
- customStyles?: customStyles | undefined;
60
53
  }, never>;
61
54
  export declare const BodyCaption: import("styled-components").StyledComponent<"div", any, {
62
55
  numberOfLines?: number | undefined;
@@ -118,4 +111,3 @@ export declare const Tiny: import("styled-components").StyledComponent<"div", an
118
111
  numberOfLines?: number | undefined;
119
112
  color?: string | undefined;
120
113
  }, never>;
121
- export {};
package/dist/esm/components/TypographyStyle.js CHANGED
@@ -90,10 +90,9 @@ import e from"styled-components";import{COLORS as i,FONTS as t}from"../constants
90
90
  -webkit-line-clamp: ${e=>e.numberOfLines};
91
91
  `,g=e.div`
92
92
  font-family: Inter;
93
- width: ${e=>{var i;return o(null===(i=e.customStyles)||void 0===i?void 0:i.width)}};
94
93
  color: ${e=>e.color||i.text.primary};
95
- font-weight: ${e=>{var i;return(null===(i=e.customStyles)||void 0===i?void 0:i.fontWeight)||t.bodySecondary.fontWeight}};
96
- font-size: ${e=>{var i;return o(null===(i=e.customStyles)||void 0===i?void 0:i.fontSize)||o(t.bodySecondary.fontSize)}};
94
+ font-weight: ${t.bodySecondary.fontWeight};
95
+ font-size: ${o(t.bodySecondary.fontSize)};
97
96
  line-height: ${o(t.bodySecondary.lineHeight)};
98
97
  -webkit-box-orient: vertical;
99
98
  overflow: hidden;
@@ -125,7 +124,7 @@ import e from"styled-components";import{COLORS as i,FONTS as t}from"../constants
125
124
  color: ${i.content.brand};
126
125
  text-decoration-color: ${i.content.brand};
127
126
  cursor: pointer;
128
- `,y=e.div`
127
+ `,p=e.div`
129
128
  font-family: Inter;
130
129
  color: ${e=>e.color||i.text.primary};
131
130
  font-weight: ${t.caption.fontWeight};
@@ -137,7 +136,7 @@ import e from"styled-components";import{COLORS as i,FONTS as t}from"../constants
137
136
  -webkit-line-clamp: ${e=>e.numberOfLines};
138
137
  word-break: break-word;
139
138
  overflow-wrap: break-word;
140
- `,p=e.div`
139
+ `,y=e.div`
141
140
  font-family: Inter;
142
141
  color: ${e=>e.color||i.text.primary};
143
142
  font-weight: ${t.caption.fontWeight};
@@ -162,7 +161,7 @@ import e from"styled-components";import{COLORS as i,FONTS as t}from"../constants
162
161
  overflow: hidden;
163
162
  display: -webkit-box;
164
163
  -webkit-line-clamp: ${e=>e.numberOfLines};
165
- `,s=e.div`
164
+ `,k=e.div`
166
165
  color: ${e=>e.color||i.text.primary};
167
166
  font-weight: ${t.tiny.fontWeight};
168
167
  font-size: ${o(t.tiny.fontSize)};
@@ -177,7 +176,7 @@ import e from"styled-components";import{COLORS as i,FONTS as t}from"../constants
177
176
  -webkit-text-fill-color: transparent;
178
177
  background-clip: text;
179
178
  text-fill-color: transparent;
180
- `,k=e.div`
179
+ `,s=e.div`
181
180
  font-family: Inter;
182
181
  color: ${e=>e.color||i.text.primary};
183
182
  font-weight: ${t.buttonLarge.fontWeight};
@@ -223,7 +222,7 @@ import e from"styled-components";import{COLORS as i,FONTS as t}from"../constants
223
222
  overflow: hidden;
224
223
  display: -webkit-box;
225
224
  -webkit-line-clamp: ${e=>e.numberOfLines};
226
- `,S=e.div`
225
+ `,L=e.div`
227
226
  font-family: Inter;
228
227
  color: ${e=>e.color||i.text.primary};
229
228
  font-weight: ${t.bodyRegular.fontWeight};
@@ -233,7 +232,7 @@ import e from"styled-components";import{COLORS as i,FONTS as t}from"../constants
233
232
  overflow: hidden;
234
233
  display: -webkit-box;
235
234
  -webkit-line-clamp: ${e=>e.numberOfLines};
236
- `,L=e.div`
235
+ `,S=e.div`
237
236
  font-family: Inter;
238
237
  color: ${i.text.primary};
239
238
  font-weight: ${t.caption.fontWeight};
@@ -253,7 +252,7 @@ import e from"styled-components";import{COLORS as i,FONTS as t}from"../constants
253
252
  overflow: hidden;
254
253
  display: -webkit-box;
255
254
  -webkit-line-clamp: ${e=>e.numberOfLines};
256
- `,W=e.div`
255
+ `,O=e.div`
257
256
  font-family: Inter;
258
257
  color: ${i.text.primary};
259
258
  font-weight: ${t.title4.fontWeight};
@@ -263,7 +262,7 @@ import e from"styled-components";import{COLORS as i,FONTS as t}from"../constants
263
262
  overflow: hidden;
264
263
  display: -webkit-box;
265
264
  -webkit-line-clamp: ${e=>e.numberOfLines};
266
- `,O=e.div`
265
+ `,W=e.div`
267
266
  font-family: Inter;
268
267
  color: ${i.text.primary};
269
268
  font-weight: ${t.bodySmall.fontWeight};
@@ -293,4 +292,4 @@ import e from"styled-components";import{COLORS as i,FONTS as t}from"../constants
293
292
  overflow: hidden;
294
293
  display: -webkit-box;
295
294
  -webkit-line-clamp: ${e=>e.numberOfLines};
296
- `;export{p as AiBodyCaption,s as AiBodyTiny,y as BodyCaption,c as BodyLarge,h as BodyPrimary,$ as BodyPrimaryLink,S as BodyRegular,g as BodySecondary,m as BodySecondaryLink,O as BodySmall,x as BodyTiny,k as ButtonLarge,v as ButtonLargeAI,u as ButtonRegular,w as ButtonRegularAI,L as Caption,I as CaptionBold,d as Display,a as SmallRegular,z as SubHeading,H as TextPlaceholder,R as Tiny,W as TitleFour,l as TitleLarge,r as TitleMedium,f as TitleRegular,b as TitleSmall,n as TitleXlarge};
295
+ `;export{y as AiBodyCaption,k as AiBodyTiny,p as BodyCaption,c as BodyLarge,h as BodyPrimary,$ as BodyPrimaryLink,L as BodyRegular,g as BodySecondary,m as BodySecondaryLink,W as BodySmall,x as BodyTiny,s as ButtonLarge,v as ButtonLargeAI,u as ButtonRegular,w as ButtonRegularAI,S as Caption,I as CaptionBold,d as Display,a as SmallRegular,z as SubHeading,H as TextPlaceholder,R as Tiny,O as TitleFour,l as TitleLarge,r as TitleMedium,f as TitleRegular,b as TitleSmall,n as TitleXlarge};
package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsTrend.d.ts CHANGED
@@ -4,6 +4,7 @@ export interface AnalyticsTrendInterface {
4
4
  value?: number | string;
5
5
  trendPercent?: number;
6
6
  trendRaw?: number;
7
+ trendRawString?: string;
7
8
  formatVal?: boolean;
8
9
  timeline?: 'today' | 'yesterday' | '7 days' | '30 days' | 'custom';
9
10
  customRange?: Date[];
package/dist/esm/components/analytics-chips-and-dropdowns/AnalyticsTrend.js CHANGED
@@ -1 +1 @@
1
- import{j as e}from"../../node_modules/react/jsx-runtime.js";import t,{useState as i,useEffect as n}from"react";import{ShimmerComponentStyled as s}from"../shimmer/ShimmerComponent/ShimmerStyled.js";import r from"../../utils/DateUtils.js";import{COLORS as o}from"../../constants/Theme.js";import l from"../../assets/icons/arrow_down.svg.js";import a from"../../assets/icons/arrow_up.svg.js";import c from"../../assets/icons/info.svg.js";import{Tag as d}from"../tag/Tag.js";import{Tooltip as m}from"../tooltips/Tooltip.js";import{BodyCaption as g,Caption as h,TitleLarge as p,TitleMedium as j}from"../TypographyStyle.js";import{truncateValueForInternationalStore as y,truncateValueForIndianStore as x}from"./chart/utils/calcPercentage.js";import{AnalyticsTrendContainer as u,IconContainer as b}from"./CommonStyles.js";const f=i=>{let{title:n,value:r,trendPercent:l,type:a="horizontal",timeline:h,customRange:f,tooltip:T,card:O=!0,rightSeparator:S=!1,size:w="big",share:$=!1,formatVal:I,prefixSymbol:R,trailingIcon:C,onTrailIconClick:D,iconTooltipBody:M,funnelPercent:k,isLoading:L,trendRaw:z,suffixText:F,trendStyle:P,trendContainerStyle:N,trendIconStyle:_,containerStyle:W,prevTrendDiff:A,relativePercentageDiff:B,isInternationalStore:E,Icon:U,iconContainerStyle:V,tooltipTimelineText:q,customTimelineText:G}=i;const H="big"===w?p:j,J=void 0!==l?l<0?"negative":0===l?"neutral":"positive":void 0,K=void 0!==l?$?Math.round(l):Math.abs(Math.round(l)):void 0;return e.jsx(u,Object.assign({card:O,style:Object.assign({},W)},{children:e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:U?12:4,borderRightWidth:S?1:0,borderRightColor:o.stroke.primary,borderRightStyle:"solid",paddingLeft:O?0:24,paddingRight:O?0:24,height:"100%",justifyContent:U?"flex-start":"space-between",alignItems:"center"},null!=N?N:{})},{children:[!!U&&e.jsx(b,Object.assign({style:Object.assign({},V)},{children:e.jsx(U,{})})),e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"column",gap:4,height:"100%"},null!=P?P:{})},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e.jsx(g,Object.assign({style:{color:o.content.secondary}},{children:n})),T&&e.jsx(m,Object.assign({body:T,placement:"right",width:300},{children:e.jsx("div",Object.assign({style:{display:"flex",cursor:"pointer",height:"100%"}},{children:e.jsx(c,{color:o.content.primary,height:16,width:16})}))}))]})),e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:12,alignItems:"center"},$?{justifyContent:"space-between"}:{})},{children:[L&&e.jsx(s,{width:108,height:26}),!L&&e.jsx(H,Object.assign({style:{color:o.content.primary}},{children:void 0===r?"--":"number"==typeof r&&I?r>999?E?`${null!=R?R:""}${y(r)} ${null!=F?F:""}`:`${null!=R?R:""}${x(r)} ${null!=F?F:""}`:`${null!=R?R:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(r)} ${null!=F?F:""}`:`${null!=R?R:""}${r} ${null!=F?F:""}`})),"number"==typeof B&&e.jsx(d,{tagText:`${B}%`,theme:"light",type:"neutral"}),"horizontal"===a&&!L&&!$&&e.jsx(v,{timeline:h,customRange:f,percent:K,direction:J,trendRaw:z,prefixSymbol:R,trendIconStyle:_,isInternationalStore:E,tooltipTimelineText:q,customTimelineText:G}),L&&!$&&"horizontal"===a&&e.jsx(s,{height:20,width:141,marginTop:6}),"vertical"===a&&!L&&void 0!==k&&e.jsx(d,{tagText:`${k} %`,theme:"light",type:"neutral"}),$&&!L&&void 0!==K&&e.jsx(d,{tagText:`${K} %`,theme:"light",type:"neutral"}),$||L||!A||0==A?e.jsx(e.Fragment,{}):e.jsx(d,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(A),theme:"light",type:"neutral"})]})),"vertical"===a&&!L&&!$&&e.jsx("div",Object.assign({style:{marginTop:10}},{children:e.jsx(v,{timeline:h,customRange:f,percent:K,direction:J,trendRaw:z,prefixSymbol:R,trendIconStyle:_,isInternationalStore:E,tooltipTimelineText:q,customTimelineText:G})})),L&&"vertical"===a&&e.jsx(s,{height:20,width:141,marginTop:6})]})),M&&!L&&e.jsx(m,Object.assign({body:M,placement:"right"},{children:C&&e.jsx("div",Object.assign({className:"icon--holder",onClick:D},{children:t.createElement(C,{height:20,width:20,color:o.content.secondary})}))}))]}))}))},v=t=>{let{percent:s,direction:c,timeline:d,customRange:g,trendRaw:p,prefixSymbol:j,trendIconStyle:u,isInternationalStore:b,tooltipTimelineText:f,customTimelineText:v}=t;const T=()=>{const e=((null!=p?p:0)>0?"+":"")+(null!=j?j:"");return void 0===p?"--":`${null!=e?e:""}${(()=>{let e="--";if(p)return e=String(b?y(Math.abs(p)):x(Math.abs(p))),p<0?"-"+e:e})()}`},[O,S]=i(T()),[w,$]=i(v||"");n((()=>{v||$("today"===d?"vs yesterday":"yesterday"===d?"vs 1 day before":"7 days"===d?"vs last 7 days":"30 days"===d?"vs last 30 days":"custom"===d&&g?r.getAnalyticsCustomDateTimelineText(g):"")}),[d,g]),n((()=>{S(T())}),[p]);const I="negative"===c?l:a,R="negative"===c?o.background.negative.vibrant:"positive"===c?o.background.positive.vibrant:o.content.placeholder;return e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof s&&e.jsx(I,{color:R,height:16,width:16,style:Object.assign({marginRight:2},null!=u?u:{})}),"number"==typeof s&&c&&e.jsxs(h,Object.assign({style:{color:R}},{children:["neutral"===c?0:s<1e3?s:">999","%"]})),!!p&&e.jsx(h,Object.assign({style:{marginLeft:4,color:o.content.placeholder}},{children:`(${O})`})),d&&(f?e.jsx(m,Object.assign({body:f,placement:"bottom"},{children:e.jsx(h,Object.assign({style:{marginLeft:4,color:o.content.placeholder}},{children:v||w}))})):e.jsx(h,Object.assign({style:{marginLeft:4,color:o.content.placeholder}},{children:v||w})))]}))};export{f as AnalyticsTrend};
1
+ import{j as e}from"../../node_modules/react/jsx-runtime.js";import t,{useState as i,useEffect as n}from"react";import{ShimmerComponentStyled as r}from"../shimmer/ShimmerComponent/ShimmerStyled.js";import s from"../../utils/DateUtils.js";import{COLORS as o}from"../../constants/Theme.js";import l from"../../assets/icons/arrow_down.svg.js";import a from"../../assets/icons/arrow_up.svg.js";import c from"../../assets/icons/info.svg.js";import{Tag as d}from"../tag/Tag.js";import{Tooltip as m}from"../tooltips/Tooltip.js";import{BodyCaption as g,Caption as h,TitleLarge as p,TitleMedium as j}from"../TypographyStyle.js";import{truncateValueForInternationalStore as y,truncateValueForIndianStore as x}from"./chart/utils/calcPercentage.js";import{AnalyticsTrendContainer as u,IconContainer as b}from"./CommonStyles.js";const f=i=>{let{title:n,value:s,trendPercent:l,type:a="horizontal",timeline:h,customRange:f,tooltip:T,card:S=!0,rightSeparator:w=!1,size:O="big",share:$=!1,formatVal:I,prefixSymbol:R,trailingIcon:C,onTrailIconClick:D,iconTooltipBody:L,funnelPercent:M,isLoading:k,trendRaw:z,trendRawString:F,suffixText:P,trendStyle:N,trendContainerStyle:_,trendIconStyle:W,containerStyle:A,prevTrendDiff:B,relativePercentageDiff:E,isInternationalStore:U,Icon:V,iconContainerStyle:q,tooltipTimelineText:G,customTimelineText:H}=i;const J="big"===O?p:j,K=void 0!==l?l<0?"negative":0===l?"neutral":"positive":void 0,Q=void 0!==l?$?Math.round(l):Math.abs(Math.round(l)):void 0;return e.jsx(u,Object.assign({card:S,style:Object.assign({},A)},{children:e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:V?12:4,borderRightWidth:w?1:0,borderRightColor:o.stroke.primary,borderRightStyle:"solid",paddingLeft:S?0:24,paddingRight:S?0:24,height:"100%",justifyContent:V?"flex-start":"space-between",alignItems:"center"},null!=_?_:{})},{children:[!!V&&e.jsx(b,Object.assign({style:Object.assign({},q)},{children:e.jsx(V,{})})),e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"column",gap:4,height:"100%"},null!=N?N:{})},{children:[e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",gap:4,alignItems:"center"}},{children:[e.jsx(g,Object.assign({style:{color:o.content.secondary}},{children:n})),T&&e.jsx(m,Object.assign({body:T,placement:"right",width:300},{children:e.jsx("div",Object.assign({style:{display:"flex",cursor:"pointer",height:"100%"}},{children:e.jsx(c,{color:o.content.primary,height:16,width:16})}))}))]})),e.jsxs("div",Object.assign({style:Object.assign({display:"flex",flexDirection:"row",gap:12,alignItems:"center"},$?{justifyContent:"space-between"}:{})},{children:[k&&e.jsx(r,{width:108,height:26}),!k&&e.jsx(J,Object.assign({style:{color:o.content.primary}},{children:void 0===s?"--":"number"==typeof s&&I?s>999?U?`${null!=R?R:""}${y(s)} ${null!=P?P:""}`:`${null!=R?R:""}${x(s)} ${null!=P?P:""}`:`${null!=R?R:""}${new Intl.NumberFormat("en-IN",{maximumFractionDigits:2}).format(s)} ${null!=P?P:""}`:`${null!=R?R:""}${s} ${null!=P?P:""}`})),"number"==typeof E&&e.jsx(d,{tagText:`${E}%`,theme:"light",type:"neutral"}),"horizontal"===a&&!k&&!$&&e.jsx(v,{timeline:h,customRange:f,percent:Q,direction:K,trendRaw:z,trendRawString:F,prefixSymbol:R,trendIconStyle:W,isInternationalStore:U,tooltipTimelineText:G,customTimelineText:H}),k&&!$&&"horizontal"===a&&e.jsx(r,{height:20,width:141,marginTop:6}),"vertical"===a&&!k&&void 0!==M&&e.jsx(d,{tagText:`${M} %`,theme:"light",type:"neutral"}),$&&!k&&void 0!==Q&&e.jsx(d,{tagText:`${Q} %`,theme:"light",type:"neutral"}),$||k||!B||0==B?e.jsx(e.Fragment,{}):e.jsx(d,{tagText:(e=>{const t=Math.abs(e);return t%1!=0?`${t.toFixed(1)} %`:`${t} %`})(B),theme:"light",type:"neutral"})]})),"vertical"===a&&!k&&!$&&e.jsx("div",Object.assign({style:{marginTop:10}},{children:e.jsx(v,{timeline:h,customRange:f,percent:Q,direction:K,trendRaw:z,trendRawString:F,prefixSymbol:R,trendIconStyle:W,isInternationalStore:U,tooltipTimelineText:G,customTimelineText:H})})),k&&"vertical"===a&&e.jsx(r,{height:20,width:141,marginTop:6})]})),L&&!k&&e.jsx(m,Object.assign({body:L,placement:"right"},{children:C&&e.jsx("div",Object.assign({className:"icon--holder",onClick:D},{children:t.createElement(C,{height:20,width:20,color:o.content.secondary})}))}))]}))}))},v=t=>{let{percent:r,direction:c,timeline:d,customRange:g,trendRaw:p,trendRawString:j,prefixSymbol:u,trendIconStyle:b,isInternationalStore:f,tooltipTimelineText:v,customTimelineText:T}=t;const S=()=>{const e=((null!=p?p:0)>0?"+":"")+(null!=u?u:"");return void 0===p?"--":`${null!=e?e:""}${(()=>{let e="--";if(p)return e=String(f?y(Math.abs(p)):x(Math.abs(p))),p<0?"-"+e:e})()}`},[w,O]=i(S()),[$,I]=i(T||"");n((()=>{T||I("today"===d?"vs yesterday":"yesterday"===d?"vs 1 day before":"7 days"===d?"vs last 7 days":"30 days"===d?"vs last 30 days":"custom"===d&&g?s.getAnalyticsCustomDateTimelineText(g):"")}),[d,g]),n((()=>{O(S())}),[p]);const R="negative"===c?l:a,C="negative"===c?o.background.negative.vibrant:"positive"===c?o.background.positive.vibrant:o.content.placeholder;return e.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",flexDirection:"row",flexWrap:"wrap"}},{children:["number"==typeof r&&e.jsx(R,{color:C,height:16,width:16,style:Object.assign({marginRight:2},null!=b?b:{})}),"number"==typeof r&&c&&e.jsxs(h,Object.assign({style:{color:C}},{children:["neutral"===c?0:r<1e3?r:">999","%"]})),!!p&&e.jsx(h,Object.assign({style:{marginLeft:4,color:o.content.placeholder}},{children:`(${w})`})),!p&&((null==j?void 0:j.length)||0)>0&&e.jsx(h,Object.assign({style:{marginLeft:4,color:o.content.placeholder}},{children:`${j}`})),d&&(v?e.jsx(m,Object.assign({body:v,placement:"bottom"},{children:e.jsx(h,Object.assign({style:{marginLeft:4,color:o.content.placeholder}},{children:T||$}))})):e.jsx(h,Object.assign({style:{marginLeft:4,color:o.content.placeholder}},{children:T||$})))]}))};export{f as AnalyticsTrend};
package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.js CHANGED
@@ -1 +1 @@
1
- import{j as o}from"../../../../node_modules/react/jsx-runtime.js";import i from"../../../../assets/icons/maximize.svg.js";import{Chart as t,CategoryScale as e,LinearScale as a,BarElement as l,Tooltip as n,Legend as d}from"chart.js";import s from"chartjs-plugin-datalabels";import{useState as r,useMemo as c}from"react";import{Bar as u}from"react-chartjs-2";import{IconButton as v}from"../../../icon-button/IconButton.js";import{StyledModal as p}from"../../../modals/styledModal.js";import{TitleRegular as g,BodyTiny as x}from"../../../TypographyStyle.js";import{COLORS as b,FONTS as h}from"../../../../constants/Theme.js";import{truncateValueForInternationalStore as m,truncateValueForIndianStore as y}from"../utils/calcPercentage.js";import{COLOR_SCHEMA as f,GRAPH_ORIENTATION as j}from"./StackedBarChart.model.js";import{GraphContainerWrapper as O,HeaderIconWrapper as A}from"./StackedBarChart.styles.js";t.register(e,a,l,n,d,s);const C=t=>{var e,a,l,n,d,s,C,k,L,F,S,H,I,T,R,w,E,B,D,N,Z,z,P,G,W,_,q,M,V,Y,J,K,Q,U,X,$,oo,io,to,eo,ao,lo;const{headerIcons:no=[],legendsAndIconDirection:so="row"}=t,[ro,co]=r(!1),uo=[250,1e3,800,1500,300,600],vo=0===t.yAxis.data.length,po=void 0===t.customColourScaleBrand&&void 0===t.customColourScalePastel?t.colorSchema===f.PASTEL?["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"]:["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"]:t.colorSchema===f.PASTEL?t.customColourScalePastel:t.customColourScaleBrand,go=t.customHoverColour,xo=c((()=>{var o,i,e;return Object.assign(Object.assign({barPercentage:(null==t?void 0:t.barPercentage)||.4,categoryPercentage:1,pointStyle:"circle",barWidth:t.barWidth,borderRadius:(null==t?void 0:t.borderRadius)||void 0},"object"==typeof(null==t?void 0:t.borderRadius)?{borderSkipped:!1}:{}),(null===(o=null==t?void 0:t.addBarGap)||void 0===o?void 0:o.flag)?{borderWidth:{top:(null===(i=null==t?void 0:t.addBarGap)||void 0===i?void 0:i.value)||2,bottom:(null===(e=null==t?void 0:t.addBarGap)||void 0===e?void 0:e.value)||2,right:0,left:0},borderColor:"transparent"}:{})}),[t.barWidth,null==t?void 0:t.borderRadius,null==t?void 0:t.barPercentage,null==t?void 0:t.addBarGap]),bo={};t.yAxis.data.map((o=>{o.map((o=>{bo[o.name]?bo[o.name].push(o.value):bo[o.name]=[o.value]}))}));const ho=Object.keys(bo).map(((o,i)=>Object.assign({label:o,data:bo[o],backgroundColor:null==po?void 0:po[i],hoverBackgroundColor:void 0===go?void 0:go[i]},xo)));let mo=t.xAxis.data.map((o=>"string"==typeof o?o:o.name)),yo=ho;if(t.truncateBars){const o=((o,i,t)=>{if(i.length<=t)return{truncatedData:o,truncatedLabels:i,originalData:o,originalLabels:i};const e=o.map((o=>o.slice(0,t))),a=o.map((o=>o.slice(t).reduce(((o,i)=>o+i),0)));e.forEach(((o,i)=>o.push(a[i])));const l=i.slice(0,t);return l.push("Others"),{truncatedData:e,truncatedLabels:l,originalData:o,originalLabels:i}})(ho.map((o=>o.data)),mo,t.truncateBars);ho.forEach(((i,t)=>i.data=o.truncatedData[t])),mo=o.truncatedLabels,yo=o.originalData.map(((o,i)=>Object.assign(Object.assign({},ho[i]),{data:o})))}const fo={plugins:{legend:{display:!vo&&!t.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!vo,callbacks:{label:null===(e=t.tooltipConfig)||void 0===e?void 0:e.labelCallback,title:null===(a=t.tooltipConfig)||void 0===a?void 0:a.titleCallback,footer:null===(l=t.tooltipConfig)||void 0===l?void 0:l.footerCallback},footerFont:null===(d=null===(n=t.tooltipConfig)||void 0===n?void 0:n.footerStyles)||void 0===d?void 0:d.footerFont},datalabels:{display:null!==(s=t.showTotal)&&void 0!==s&&s,anchor:"end",align:"end",clamp:!0,formatter:(o,i)=>{var t;const e=i.datasetIndex,a=i.chart.data.datasets;if(e!==a.length-1)return"";const l=i.dataIndex;let n=0;for(let o=0;o<a.length;o++)n+=null!==(t=a[o].data[l])&&void 0!==t?t:0;return n?n<1e3?n:(n/1e3).toString().substring(0,4)+"k":""},color:b.content.secondary}},layout:{padding:{right:t.showTotal&&t.orientation===j.HORIZONTAL?50:0,top:t.showTotal&&t.orientation!=j.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!t.customLegend,labels:{usePointStyle:!0}},indexAxis:t.orientation===j.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(t.orientation===j.HORIZONTAL?null===(C=t.yAxis)||void 0===C?void 0:C.title:null===(k=t.xAxis)||void 0===k?void 0:k.title),text:t.orientation===j.HORIZONTAL?null===(L=t.yAxis)||void 0===L?void 0:L.title:null===(F=t.xAxis)||void 0===F?void 0:F.title,color:null!==(I=t.orientation===j.HORIZONTAL?null===(S=t.yAxis)||void 0===S?void 0:S.titleColor:null===(H=t.xAxis)||void 0===H?void 0:H.titleColor)&&void 0!==I?I:b.content.secondary,font:{size:h.caption.fontSize}},grid:{display:t.orientation===j.HORIZONTAL&&(void 0===(null===(T=null==t?void 0:t.showGridLines)||void 0===T?void 0:T.x)||(null===(R=null==t?void 0:t.showGridLines)||void 0===R?void 0:R.x)),color:b.background.base},ticks:{fontSize:h.caption.fontSize,color:null!==(w=t.yAxis.labelColor)&&void 0!==w?w:b.content.secondary,callback:t.orientation===j.HORIZONTAL?t.isInternationalStore?m:y:void 0},stacked:t.orientation===j.HORIZONTAL?"boolean"!=typeof(null===(E=t.yAxis)||void 0===E?void 0:E.stacked)||(null===(B=t.yAxis)||void 0===B?void 0:B.stacked):"boolean"!=typeof(null===(D=t.xAxis)||void 0===D?void 0:D.stacked)||(null===(N=t.xAxis)||void 0===N?void 0:N.stacked)},y:Object.assign(Object.assign({},(null===(Z=null==t?void 0:t.equalHeight)||void 0===Z?void 0:Z.flag)?{suggestedMin:-(null==t?void 0:t.equalHeight.max),suggestedMax:null==t?void 0:t.equalHeight.max}:{}),{title:{display:!!(t.orientation===j.HORIZONTAL?null===(z=t.xAxis)||void 0===z?void 0:z.title:null===(P=t.yAxis)||void 0===P?void 0:P.title),text:t.orientation===j.HORIZONTAL?null===(G=t.xAxis)||void 0===G?void 0:G.title:null===(W=t.yAxis)||void 0===W?void 0:W.title,color:null!==(M=t.orientation===j.HORIZONTAL?null===(_=t.xAxis)||void 0===_?void 0:_.titleColor:null===(q=t.yAxis)||void 0===q?void 0:q.titleColor)&&void 0!==M?M:b.content.secondary,font:{size:h.caption.fontSize}},grid:{display:t.orientation!==j.HORIZONTAL&&(void 0===(null===(V=null==t?void 0:t.showGridLines)||void 0===V?void 0:V.y)||(null===(Y=null==t?void 0:t.showGridLines)||void 0===Y?void 0:Y.y)),color:b.background.base},ticks:Object.assign(Object.assign({stepSize:t.orientation===j.HORIZONTAL?null===(J=t.xAxis)||void 0===J?void 0:J.stepSize:null===(K=t.yAxis)||void 0===K?void 0:K.stepSize,fontSize:h.caption.fontSize,color:null!==(Q=t.xAxis.labelColor)&&void 0!==Q?Q:b.content.secondary},vo?{min:0,max:2e3,stepSize:200}:{}),{callback:(null==t?void 0:t.ticksCallback)?null==t?void 0:t.ticksCallback:t.orientation!==j.VERTICAL?t.isInternationalStore?m:y:void 0}),stacked:t.orientation===j.HORIZONTAL?"boolean"!=typeof(null===(U=t.xAxis)||void 0===U?void 0:U.stacked)||(null===(X=t.xAxis)||void 0===X?void 0:X.stacked):"boolean"!=typeof(null===($=t.yAxis)||void 0===$?void 0:$.stacked)||(null===(oo=t.yAxis)||void 0===oo?void 0:oo.stacked)})},onClick:(o,i)=>{if(!t.onBarClick)return;const e=i[0].datasetIndex,a=i[0].index,l=o.chart.data.datasets[e].label,n=o.chart.data.labels[a];t.onBarClick(n,l)},onHover:(o,i)=>{t.onBarClick&&i.length&&(o.native.target.style.cursor="pointer")}};t.orientation&&t.orientation!==j.VERTICAL?delete fo.scales.y.ticks.callback:delete fo.scales.x.ticks.callback;const jo={labels:mo,datasets:vo?[{data:uo,backgroundColor:"rgba(0,0,0,0)"}]:ho},Oo={labels:t.xAxis.data.map((o=>"string"==typeof o?o:o.name)),datasets:vo?[{data:uo,backgroundColor:"rgba(0,0,0,0)"}]:yo},Ao=function(){let i=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return o.jsx("div",Object.assign({style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:t.allowChartPopup&&!i?"flex-start":"flex-end",flexWrap:"wrap"}},{children:ho.map((i=>o.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[o.jsx("div",{style:{backgroundColor:i.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),o.jsx(x,Object.assign({color:b.content.secondary},{children:i.label}))]}),i.label.replace(" ","_"))))}))};return o.jsxs(O,Object.assign({style:null!==(io=t.wrapperStyle)&&void 0!==io?io:{},padding:t.outerPadding,customLegend:t.customLegend},{children:[t.chartHeading&&o.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:t.hideHeading?"flex-end":"space-between"}},{children:[!0!==t.hideHeading&&o.jsx(g,Object.assign({color:null!==(to=t.chartHeading.color)&&void 0!==to?to:b.content.secondary},{children:t.chartHeading.heading})),t.allowChartPopup&&o.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end"}},{children:o.jsx("div",{children:o.jsx(v,{Icon:i,onClick:()=>{co(!0)}})})}))]})),t.customLegend&&o.jsxs("div",Object.assign({style:{display:"flex",flexDirection:so,justifyContent:"space-between"}},{children:[o.jsx(A,{children:no.map(((i,t)=>o.jsx("div",{children:o.jsx("div",{children:i})},t)))}),Ao()]})),o.jsx("div",Object.assign({className:"graph__wrapper"},{children:o.jsx("div",Object.assign({style:{height:null!==(eo=t.graphCanvasHeight)&&void 0!==eo?eo:500,width:null!==(ao=t.graphCanvasWidth)&&void 0!==ao?ao:"auto"}},{children:o.jsx(u,{options:fo,data:jo})}))})),ro&&o.jsx(p,Object.assign({open:ro,onClose:()=>co(!1),closeOnOutsideClick:!0,headingTitle:null===(lo=t.chartHeading)||void 0===lo?void 0:lo.heading,width:"85%"},{children:o.jsxs("div",Object.assign({className:"graph__wrapper",style:{padding:"8px"}},{children:[t.customLegend&&Ao(!0),o.jsx("div",Object.assign({style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"}},{children:o.jsx(u,{options:fo,data:Oo})}))]}))}))]}))};export{C as StackedBarChart};
1
+ import{j as i}from"../../../../node_modules/react/jsx-runtime.js";import o from"../../../../assets/icons/maximize.svg.js";import{Chart as t,CategoryScale as e,LinearScale as l,BarElement as a,Tooltip as n,Legend as s}from"chart.js";import d from"chartjs-plugin-datalabels";import{useState as r,useMemo as c}from"react";import{Bar as u}from"react-chartjs-2";import{IconButton as v}from"../../../icon-button/IconButton.js";import{StyledModal as x}from"../../../modals/styledModal.js";import{TitleRegular as p,BodyTiny as g}from"../../../TypographyStyle.js";import{COLORS as b,FONTS as h}from"../../../../constants/Theme.js";import{truncateValueForInternationalStore as m,truncateValueForIndianStore as f}from"../utils/calcPercentage.js";import{GRAPH_ORIENTATION as y,COLOR_SCHEMA as j}from"./StackedBarChart.model.js";import{GraphContainerWrapper as A,HeaderIconWrapper as O}from"./StackedBarChart.styles.js";t.register(e,l,a,n,s,d);const C=t=>{var e,l,a,n,s,d,C,k,S,L,F,H,I,T,R,w,B,E,D,N,Z,z,P,G,$,W,_,M,q,V,Y,J,K,Q,U,X,ii,oi,ti,ei,li,ai,ni,si,di;const{headerIcons:ri=[],legendsAndIconDirection:ci="row"}=t,[ui,vi]=r(!1),xi=[250,1e3,800,1500,300,600],pi=0===t.yAxis.data.length,gi=["#5E07BB","#9E77ED","#D2AEFF","#F7D7FF","#CDE1FF","#92AFFA","#3935E1"],bi=["#E6C7FF","#FEC6C6","#FEDEF3","#DEEFFF","#FFD8B1","#C7E5FF","#FFD3E6","#C9FFE5","#FFE3C7","#D9D9FF"],hi=t.customBarColors?t.customBarColors:t.customColourScaleBrand||t.customColourScalePastel?t.colorSchema===j.PASTEL?t.customColourScalePastel:t.customColourScaleBrand:t.colorSchema===j.PASTEL?bi:gi,mi=t.customHoverColour,fi=c((()=>{var i,o,e;return Object.assign(Object.assign({barPercentage:(null==t?void 0:t.barPercentage)||.4,categoryPercentage:1,pointStyle:"circle",barWidth:t.barWidth,borderRadius:(null==t?void 0:t.borderRadius)||void 0},"object"==typeof(null==t?void 0:t.borderRadius)?{borderSkipped:!1}:{}),(null===(i=null==t?void 0:t.addBarGap)||void 0===i?void 0:i.flag)?{borderWidth:{top:(null===(o=null==t?void 0:t.addBarGap)||void 0===o?void 0:o.value)||2,bottom:(null===(e=null==t?void 0:t.addBarGap)||void 0===e?void 0:e.value)||2,right:0,left:0},borderColor:"transparent"}:{})}),[t.barWidth,null==t?void 0:t.borderRadius,null==t?void 0:t.barPercentage,null==t?void 0:t.addBarGap]),yi={};t.yAxis.data.map((i=>{i.map((i=>{yi[i.name]?yi[i.name].push(i.value):yi[i.name]=[i.value]}))}));const ji=Object.keys(yi).map(((i,o)=>Object.assign({label:i,data:yi[i],backgroundColor:null==hi?void 0:hi[o],hoverBackgroundColor:void 0===mi?void 0:mi[o]},fi)));let Ai;Ai=t.renderInHeightWiseManner?ji.map(((i,o)=>Object.assign(Object.assign({},i),{order:i.data.reduce(((i,o)=>i+(o||0)),0)}))).sort(((i,o)=>o.order-i.order)):ji;let Oi=t.xAxis.data.map((i=>"string"==typeof i?i:i.name)),Ci=Ai;if(t.truncateBars){const i=((i,o,t)=>{if(o.length<=t)return{truncatedData:i,truncatedLabels:o,originalData:i,originalLabels:o};const e=i.map((i=>i.slice(0,t))),l=i.map((i=>i.slice(t).reduce(((i,o)=>i+o),0)));e.forEach(((i,o)=>i.push(l[o])));const a=o.slice(0,t);return a.push("Others"),{truncatedData:e,truncatedLabels:a,originalData:i,originalLabels:o}})(Ai.map((i=>i.data)),Oi,t.truncateBars);Ai.forEach(((o,t)=>o.data=i.truncatedData[t])),Oi=i.truncatedLabels,Ci=i.originalData.map(((i,o)=>Object.assign(Object.assign({},Ai[o]),{data:i})))}const ki={plugins:{legend:{display:!pi&&!t.customLegend,labels:{usePointStyle:!0,fontSize:2}},tooltip:{enabled:!pi,callbacks:{label:null===(e=t.tooltipConfig)||void 0===e?void 0:e.labelCallback,title:null===(l=t.tooltipConfig)||void 0===l?void 0:l.titleCallback,footer:null===(a=t.tooltipConfig)||void 0===a?void 0:a.footerCallback},footerFont:null===(s=null===(n=t.tooltipConfig)||void 0===n?void 0:n.footerStyles)||void 0===s?void 0:s.footerFont},datalabels:{display:null!==(d=t.showTotal)&&void 0!==d&&d,anchor:"end",align:"end",clamp:!0,formatter:(i,o)=>{var t;const e=o.datasetIndex,l=o.chart.data.datasets;if(e!==l.length-1)return"";const a=o.dataIndex;let n=0;for(let i=0;i<l.length;i++)n+=null!==(t=l[i].data[a])&&void 0!==t?t:0;return n?n<1e3?n:(n/1e3).toString().substring(0,4)+"k":""},color:b.content.secondary}},layout:{padding:{right:t.showTotal&&t.orientation===y.HORIZONTAL?50:0,top:t.showTotal&&t.orientation!=y.HORIZONTAL?50:0}},responsive:!0,maintainAspectRatio:!1,legend:{display:!t.customLegend,labels:{usePointStyle:!0}},indexAxis:t.orientation===y.HORIZONTAL?"y":"x",scales:{x:{title:{display:!!(t.orientation===y.HORIZONTAL?null===(C=t.yAxis)||void 0===C?void 0:C.title:null===(k=t.xAxis)||void 0===k?void 0:k.title),text:t.orientation===y.HORIZONTAL?null===(S=t.yAxis)||void 0===S?void 0:S.title:null===(L=t.xAxis)||void 0===L?void 0:L.title,color:null!==(I=t.orientation===y.HORIZONTAL?null===(F=t.yAxis)||void 0===F?void 0:F.titleColor:null===(H=t.xAxis)||void 0===H?void 0:H.titleColor)&&void 0!==I?I:b.content.secondary,font:{size:h.caption.fontSize}},grid:{display:t.orientation===y.HORIZONTAL&&(void 0===(null===(T=null==t?void 0:t.showGridLines)||void 0===T?void 0:T.x)||(null===(R=null==t?void 0:t.showGridLines)||void 0===R?void 0:R.x)),color:b.background.base},ticks:{fontSize:h.caption.fontSize,color:null!==(w=t.yAxis.labelColor)&&void 0!==w?w:b.content.secondary,callback:t.orientation===y.HORIZONTAL?i=>{var o;let e;e=t.isInternationalStore?m(i):f(i);return`${e}${(null===(o=t.yAxis)||void 0===o?void 0:o.axisSuffix)||""}`}:(null===(B=t.xAxis)||void 0===B?void 0:B.axisSuffix)?i=>`${i}${t.xAxis.axisSuffix}`:void 0},stacked:t.orientation===y.HORIZONTAL?"boolean"!=typeof(null===(E=t.yAxis)||void 0===E?void 0:E.stacked)||(null===(D=t.yAxis)||void 0===D?void 0:D.stacked):"boolean"!=typeof(null===(N=t.xAxis)||void 0===N?void 0:N.stacked)||(null===(Z=t.xAxis)||void 0===Z?void 0:Z.stacked)},y:Object.assign(Object.assign({},(null===(z=null==t?void 0:t.equalHeight)||void 0===z?void 0:z.flag)?{suggestedMin:-(null==t?void 0:t.equalHeight.max),suggestedMax:null==t?void 0:t.equalHeight.max}:{}),{max:null===(P=null==t?void 0:t.yAxis)||void 0===P?void 0:P.max,title:{display:!!(t.orientation===y.HORIZONTAL?null===(G=t.xAxis)||void 0===G?void 0:G.title:null===($=t.yAxis)||void 0===$?void 0:$.title),text:t.orientation===y.HORIZONTAL?null===(W=t.xAxis)||void 0===W?void 0:W.title:null===(_=t.yAxis)||void 0===_?void 0:_.title,color:null!==(V=t.orientation===y.HORIZONTAL?null===(M=t.xAxis)||void 0===M?void 0:M.titleColor:null===(q=t.yAxis)||void 0===q?void 0:q.titleColor)&&void 0!==V?V:b.content.secondary,font:{size:h.caption.fontSize}},grid:{display:t.orientation!==y.HORIZONTAL&&(void 0===(null===(Y=null==t?void 0:t.showGridLines)||void 0===Y?void 0:Y.y)||(null===(J=null==t?void 0:t.showGridLines)||void 0===J?void 0:J.y)),color:b.background.base},ticks:Object.assign(Object.assign({stepSize:t.orientation===y.HORIZONTAL?null===(K=t.xAxis)||void 0===K?void 0:K.stepSize:null===(Q=t.yAxis)||void 0===Q?void 0:Q.stepSize,fontSize:h.caption.fontSize,color:null!==(U=t.xAxis.labelColor)&&void 0!==U?U:b.content.secondary},pi?{min:0,max:2e3,stepSize:200}:{}),{callback:(null==t?void 0:t.ticksCallback)?null==t?void 0:t.ticksCallback:t.orientation===y.HORIZONTAL?i=>{var o;let e;e=t.isInternationalStore?m(i):f(i);return`${e}${(null===(o=t.xAxis)||void 0===o?void 0:o.axisSuffix)||""}`}:(null===(X=t.yAxis)||void 0===X?void 0:X.axisSuffix)?i=>`${i}${t.yAxis.axisSuffix}`:void 0}),stacked:t.orientation===y.HORIZONTAL?"boolean"!=typeof(null===(ii=t.xAxis)||void 0===ii?void 0:ii.stacked)||(null===(oi=t.xAxis)||void 0===oi?void 0:oi.stacked):"boolean"!=typeof(null===(ti=t.yAxis)||void 0===ti?void 0:ti.stacked)||(null===(ei=t.yAxis)||void 0===ei?void 0:ei.stacked)})},onClick:(i,o)=>{if(!t.onBarClick)return;const e=o[0].datasetIndex,l=o[0].index,a=i.chart.data.datasets[e].label,n=i.chart.data.labels[l];t.onBarClick(n,a)},onHover:(i,o)=>{t.onBarClick&&o.length&&(i.native.target.style.cursor="pointer")}};let Si;t.orientation&&t.orientation!==y.VERTICAL?delete ki.scales.y.ticks.callback:delete ki.scales.x.ticks.callback,Si=pi?[{data:xi,backgroundColor:"rgba(0,0,0,0)"}]:Ai;const Li={labels:Oi,datasets:Si};let Fi;Fi=pi?[{data:xi,backgroundColor:"rgba(0,0,0,0)"}]:Ci;const Hi={labels:t.xAxis.data.map((i=>"string"==typeof i?i:i.name)),datasets:Fi},Ii=function(){let o,e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return o=t.allowChartPopup&&!e?"flex-start":"flex-end",i.jsx("div",Object.assign({style:{overflowY:"scroll",display:"flex",flexDirection:"row",gap:"10px",padding:"0px 24px 12px 24px",justifyContent:o,flexWrap:"wrap"}},{children:ji.map((o=>i.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",gap:"8px",marginTop:"4px"}},{children:[i.jsx("div",{style:{backgroundColor:o.backgroundColor,width:"16px",height:"16px",borderRadius:"2px"}}),i.jsx(g,Object.assign({color:b.content.secondary},{children:o.label}))]}),o.label.replace(" ","_"))))}))};return i.jsxs(A,Object.assign({style:null!==(li=t.wrapperStyle)&&void 0!==li?li:{},padding:t.outerPadding,customLegend:t.customLegend},{children:[t.chartHeading&&i.jsxs("div",Object.assign({style:{marginBottom:24,display:"flex",justifyContent:t.hideHeading?"flex-end":"space-between"}},{children:[!0!==t.hideHeading&&i.jsx(p,Object.assign({color:null!==(ai=t.chartHeading.color)&&void 0!==ai?ai:b.content.secondary},{children:t.chartHeading.heading})),t.allowChartPopup&&i.jsx("div",Object.assign({style:{display:"flex",justifyContent:"flex-end"}},{children:i.jsx("div",{children:i.jsx(v,{Icon:o,onClick:()=>{vi(!0)}})})}))]})),t.customLegend&&i.jsxs("div",Object.assign({style:{display:"flex",flexDirection:ci,justifyContent:"space-between"}},{children:[i.jsx(O,{children:ri.map(((o,t)=>i.jsx("div",{children:i.jsx("div",{children:o})},t)))}),Ii()]})),i.jsx("div",Object.assign({className:"graph__wrapper"},{children:i.jsx("div",Object.assign({style:{height:null!==(ni=t.graphCanvasHeight)&&void 0!==ni?ni:500,width:null!==(si=t.graphCanvasWidth)&&void 0!==si?si:"auto"}},{children:i.jsx(u,{options:ki,data:Li})}))})),ui&&i.jsx(x,Object.assign({open:ui,onClose:()=>vi(!1),closeOnOutsideClick:!0,headingTitle:null===(di=t.chartHeading)||void 0===di?void 0:di.heading,width:"85%"},{children:i.jsxs("div",Object.assign({className:"graph__wrapper",style:{padding:"8px"}},{children:[t.customLegend&&Ii(!0),i.jsx("div",Object.assign({style:{height:"70vh",width:"100%",padding:"16px",borderRadius:"8px"}},{children:i.jsx(u,{options:ki,data:Hi})}))]}))}))]}))};export{C as StackedBarChart};
package/dist/esm/components/analytics-chips-and-dropdowns/chart/StackedBarChart/StackedBarChart.model.d.ts CHANGED
@@ -7,6 +7,8 @@ export interface AxisDetailsI {
7
7
  labelColor?: string;
8
8
  stepSize?: number;
9
9
  stacked?: boolean;
10
+ axisSuffix?: string;
11
+ max?: number;
10
12
  }
11
13
  export interface XAxisDataI {
12
14
  name: string;
@@ -58,10 +60,12 @@ export interface StackedBarGraphI {
58
60
  customColourScaleBrand?: string[];
59
61
  customColourScalePastel?: string[];
60
62
  customHoverColour?: string[];
63
+ customBarColors?: string[] /** Custom colors for individual bars in the stack */;
61
64
  isInternationalStore?: boolean;
62
65
  truncateBars?: number;
63
66
  allowChartPopup?: boolean;
64
67
  hideHeading?: boolean;
68
+ /** 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 */
65
69
  borderRadius?: number | {
66
70
  topLeft?: number;
67
71
  topRight?: number;
@@ -81,7 +85,8 @@ export interface StackedBarGraphI {
81
85
  flag: boolean;
82
86
  value: number;
83
87
  };
84
- ticksCallback?: (value: number) => string;
88
+ ticksCallback?: (value: number | string) => string;
85
89
  legendsAndIconDirection?: 'row-reverse' | 'row';
86
90
  headerIcons?: React.ReactNode[];
91
+ renderInHeightWiseManner?: boolean /** When true, renders smaller bars on top of larger bars */;
87
92
  }
package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.js CHANGED
@@ -1 +1 @@
1
- import{j as i}from"../../../../node_modules/react/jsx-runtime.js";import{Chart as t,CategoryScale as e,LinearScale as o,BarElement as r,Tooltip as a}from"chart.js";import{Chart as s}from"react-chartjs-2";import{SmallRegular as l,TitleRegular as n}from"../../../TypographyStyle.js";import{FONTS as c,COLORS as d}from"../../../../constants/Theme.js";import{LegendWrapper as x,LegendContainer as p,LegendColor as g}from"../LineChart/LineChart.styled.js";import{GraphContainerWrapper as b}from"./VerticalBarAndLinearGraph.styles.js";t.register(e,o,r,a);const h=t=>{var e,o,r,a,h;const A=[0,0,0,0,0,0],j=-1===t.barAxis.data.findIndex((i=>0!==i)),m=-1===t.lineAxis.data.findIndex((i=>0!==i)),f={min:0,max:2e3,stepSize:200},y=[{legend:t.barAxis.title,color:t.barAxis.graphColor},{legend:t.lineAxis.title,color:t.lineAxis.graphColor}],C={responsive:!0,plugins:{legend:{display:!1}},scales:{x:{title:{display:!!t.xAxis.title,text:t.xAxis.title,color:t.xAxis.titleColor,font:{size:c.caption.fontSize}},grid:{display:!1,borderColor:d.background.base},ticks:{fontSize:c.caption.fontSize,color:null!==(e=t.xAxis.labelColor)&&void 0!==e?e:d.content.secondary}},bar:{position:"left",title:{display:!!t.barAxis.title,text:t.barAxis.title,color:t.barAxis.titleColor,font:{size:c.caption.fontSize}},grid:{borderColor:"white",color:d.background.base},ticks:Object.assign({fontSize:c.caption.fontSize,color:null!==(o=t.barAxis.labelColor)&&void 0!==o?o:d.content.secondary},j?f:{})},line:{position:"right",title:{display:!!t.lineAxis.title,text:t.lineAxis.title,color:t.lineAxis.titleColor,font:{size:c.caption.fontSize}},grid:{display:!1,borderColor:"white",color:d.background.base},ticks:Object.assign({fontSize:c.caption.fontSize,color:null!==(r=t.lineAxis.labelColor)&&void 0!==r?r:d.content.secondary},m?f:{}),display:!0}},maintainAspectRatio:!1},u={labels:t.xAxis.forceShowXAxis?t.xAxis.data.map((i=>i.toString())):j&&m?["-","-","-","-","-","-"]:t.xAxis.data.map((i=>i.toString())),datasets:[{yAxisID:"line",type:"line",data:m?A:t.lineAxis.data,borderColor:t.lineAxis.graphColor||"rgba(0,0,0,0)",borderWidth:2,fill:!1,pointRadius:1},{yAxisID:"bar",type:"bar",data:j?A:t.barAxis.data,backgroundColor:t.barAxis.graphColor||"rgba(0,0,0,0)",barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return i.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",gap:2}},{children:[i.jsx(x,Object.assign({position:"center"},{children:y.map(((t,e)=>{let{legend:o,color:r}=t;return o?i.jsxs(p,{children:[i.jsx(g,{color:r}),i.jsx(l,Object.assign({color:"#667085"},{children:o}))]},e):i.jsx(i.Fragment,{})}))})),i.jsxs(b,{children:[t.chartHeading&&i.jsx("div",Object.assign({style:{marginBottom:24}},{children:i.jsx(n,Object.assign({color:null!==(a=t.chartHeading.color)&&void 0!==a?a:d.content.secondary},{children:t.chartHeading.heading}))})),i.jsx("div",Object.assign({style:{height:null!==(h=t.graphCanvasHeight)&&void 0!==h?h:500}},{children:i.jsx(s,{type:"bar",data:u,options:C})}))]})]}))};export{h as VerticalBarAndLinearGraph};
1
+ import{j as i}from"../../../../node_modules/react/jsx-runtime.js";import{Chart as e,CategoryScale as o,LinearScale as a,BarElement as l,Tooltip as t}from"chart.js";import{Chart as r}from"react-chartjs-2";import{SmallRegular as s,TitleRegular as n,BodyTiny as x}from"../../../TypographyStyle.js";import{FONTS as d,COLORS as c}from"../../../../constants/Theme.js";import{LegendWrapper as A,LegendContainer as b,LegendColor as p}from"../LineChart/LineChart.styled.js";import{truncateValueForInternationalStore as g,truncateValueForIndianStore as u}from"../utils/calcPercentage.js";import{GraphWrapper as f,GraphContainerWrapper as h,LegendsWrapper as m,LegendMiddleWrapper as j,LegendColorBox as v}from"./VerticalBarAndLinearGraph.styles.js";import{GRAPH_ORIENTATION as y}from"./VerticalBarAndLinearGraphModel.js";e.register(o,a,l,t);const S=e=>{var o,a,l,t,S,C,k,I,O,z;const $=[0,0,0,0,0,0],R=["-","-","-","-","-","-"],D=-1===e.barAxis.data.findIndex((i=>0!==i)),L=-1===e.lineAxis.data.findIndex((i=>0!==i)),H=!e.lineAxis2||-1===e.lineAxis2.data.findIndex((i=>0!==i)),T={min:0,max:2e3,stepSize:200},V=[{legend:e.barAxis.title,color:e.barAxis.graphColor},{legend:e.lineAxis.title,color:e.lineAxis.graphColor},...e.lineAxis2?[{legend:e.lineAxis2.title,color:e.lineAxis2.graphColor}]:[]],w={responsive:!0,plugins:{legend:{display:!1},tooltip:{callbacks:{label:i=>{var o;const a=i.raw,l=i.dataset;let t="";"bar"===l.yAxisID?t=e.barAxis.axisSuffix||"":"line"===l.yAxisID?t=e.lineAxis.axisSuffix||"":"line2"===l.yAxisID&&(t=(null===(o=e.lineAxis2)||void 0===o?void 0:o.axisSuffix)||"");let r=a;return e.orientation===y.HORIZONTAL&&(r=e.isInternationalStore?g(a):u(a)),`${r}${t}`}}}},scales:{x:{title:{display:!!e.xAxis.title,text:e.xAxis.title,color:e.xAxis.titleColor,font:{size:d.caption.fontSize}},grid:{display:!1,borderColor:c.background.base},ticks:{fontSize:d.caption.fontSize,color:null!==(o=e.xAxis.labelColor)&&void 0!==o?o:c.content.secondary,callback:(null===(a=e.xAxis)||void 0===a?void 0:a.axisSuffix)?i=>`${i}${e.xAxis.axisSuffix}`:void 0}},bar:{position:"left",title:{display:!!e.barAxis.title,text:e.barAxis.title,color:e.barAxis.titleColor,font:{size:d.caption.fontSize}},grid:{borderColor:"white",color:c.background.base},max:null===(l=null==e?void 0:e.barAxis)||void 0===l?void 0:l.max,ticks:Object.assign(Object.assign({fontSize:d.caption.fontSize,color:null!==(t=e.barAxis.labelColor)&&void 0!==t?t:c.content.secondary},D?T:{}),{callback:e.orientation===y.HORIZONTAL?i=>{var o;let a;a=e.isInternationalStore?g(i):u(i);return`${a}${(null===(o=e.barAxis)||void 0===o?void 0:o.axisSuffix)||""}`}:(null===(S=e.barAxis)||void 0===S?void 0:S.axisSuffix)?i=>`${i}${e.barAxis.axisSuffix}`:void 0})},line:{position:"right",title:{display:!!e.lineAxis.title,text:e.lineAxis.title,color:e.lineAxis.titleColor,font:{size:d.caption.fontSize}},max:null===(C=null==e?void 0:e.lineAxis)||void 0===C?void 0:C.max,grid:{display:!1,borderColor:"white",color:c.background.base},ticks:Object.assign(Object.assign({fontSize:d.caption.fontSize,color:null!==(k=e.lineAxis.labelColor)&&void 0!==k?k:c.content.secondary},L?T:{}),{callback:e.orientation===y.HORIZONTAL?i=>{var o;let a;a=e.isInternationalStore?g(i):u(i);return`${a}${(null===(o=e.lineAxis)||void 0===o?void 0:o.axisSuffix)||""}`}:(null===(I=e.lineAxis)||void 0===I?void 0:I.axisSuffix)?i=>`${i}${e.lineAxis.axisSuffix}`:void 0}),display:!0}},maintainAspectRatio:!1};let B,N,P,Z;e.orientation&&e.orientation!==y.VERTICAL?(delete w.scales.bar.ticks.callback,delete w.scales.line.ticks.callback):delete w.scales.x.ticks.callback,B=e.xAxis.forceShowXAxis?e.xAxis.data.map((i=>i.toString())):D&&L&&H?R:e.xAxis.data.map((i=>i.toString())),N=e.noDummyValues?e.lineAxis.data:L?$:e.lineAxis.data,e.lineAxis2&&(P=e.noDummyValues?e.lineAxis2.data:H?$:e.lineAxis2.data),Z=e.noDummyValues?e.barAxis.data:D?$:e.barAxis.data;const G={labels:B,datasets:[{yAxisID:"line",type:"line",data:N,borderColor:e.lineAxis.graphColor||"rgba(0,0,0,0)",backgroundColor:e.lineAxis.graphColor,borderWidth:2,fill:!1,pointRadius:e.pointRadius||1},...e.lineAxis2?[{yAxisID:"line",type:"line",data:P,borderColor:e.lineAxis2.graphColor||"rgba(0,0,0,0)",borderWidth:2,fill:!1,pointRadius:e.pointRadius||1,backgroundColor:e.lineAxis2.graphColor}]:[],{yAxisID:"bar",type:"bar",data:Z,backgroundColor:e.barAxis.graphColor||"rgba(0,0,0,0)",barPercentage:.4,categoryPercentage:1,borderRadius:4}]};return i.jsxs(f,{children:[e.customLegend?i.jsx(m,{children:V.map(((e,o)=>{let{legend:a,color:l}=e;return a?i.jsxs(j,{children:[i.jsx(v,{color:l}),i.jsx(x,Object.assign({color:c.content.secondary},{children:a}))]},o):null}))}):i.jsx(A,Object.assign({position:"center"},{children:V.map(((e,o)=>{let{legend:a,color:l}=e;return a?i.jsxs(b,{children:[i.jsx(p,{color:l}),i.jsx(s,Object.assign({color:"#667085"},{children:a}))]},o):i.jsx(i.Fragment,{})}))})),i.jsxs(h,{children:[e.chartHeading&&i.jsx("div",Object.assign({style:{marginBottom:24}},{children:i.jsx(n,Object.assign({color:null!==(O=e.chartHeading.color)&&void 0!==O?O:c.content.secondary},{children:e.chartHeading.heading}))})),i.jsx("div",Object.assign({style:{height:null!==(z=e.graphCanvasHeight)&&void 0!==z?z:500}},{children:i.jsx(r,{type:"bar",data:G,options:w})}))]})]})};export{S as VerticalBarAndLinearGraph};
package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.d.ts CHANGED
@@ -1 +1,7 @@
1
1
  export declare const GraphContainerWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
2
+ export declare const LegendsWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
3
+ export declare const LegendMiddleWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
4
+ export declare const LegendColorBox: import("styled-components").StyledComponent<"div", any, {
5
+ color: string;
6
+ }, never>;
7
+ export declare const GraphWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraph.styles.js CHANGED
@@ -1,4 +1,25 @@
1
- import o from"styled-components";import{COLORS as r}from"../../../../constants/Theme.js";const t=o.div`
2
- background-color: ${r.surface.standard};
1
+ import p from"styled-components";import{COLORS as o}from"../../../../constants/Theme.js";const d=p.div`
2
+ background-color: ${o.surface.standard};
3
3
  padding: 0;
4
- `;export{t as GraphContainerWrapper};
4
+ `,i=p.div`
5
+ display: flex;
6
+ flex-direction: row;
7
+ gap: 10px;
8
+ padding: 0px 24px 12px 24px;
9
+ justify-content: flex-end;
10
+ flex-wrap: wrap;
11
+ `,e=p.div`
12
+ display: flex;
13
+ align-items: center;
14
+ gap: 8px;
15
+ margin-top: 4px;
16
+ `,r=p.div`
17
+ background-color: ${p=>p.color};
18
+ width: 16px;
19
+ height: 16px;
20
+ border-radius: 2px;
21
+ `,a=p.div`
22
+ display: flex;
23
+ flex-direction: column;
24
+ gap: 2px;
25
+ `;export{d as GraphContainerWrapper,a as GraphWrapper,r as LegendColorBox,e as LegendMiddleWrapper,i as LegendsWrapper};
package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraphModel.d.ts CHANGED
@@ -4,11 +4,17 @@ export interface AxisDetailsI {
4
4
  data: number[] | string[];
5
5
  labelColor?: string;
6
6
  graphColor?: string;
7
+ axisSuffix?: string;
8
+ max?: number;
7
9
  }
8
10
  export interface ChartHeadingI {
9
11
  heading: string;
10
12
  color?: string;
11
13
  }
14
+ export declare enum GRAPH_ORIENTATION {
15
+ VERTICAL = "vertical",
16
+ HORIZONTAL = "horizontal"
17
+ }
12
18
  export interface VerticalBarAndLinearGraphI {
13
19
  graphCanvasHeight?: number;
14
20
  tickColor?: string;
@@ -18,5 +24,11 @@ export interface VerticalBarAndLinearGraphI {
18
24
  forceShowXAxis?: boolean;
19
25
  };
20
26
  lineAxis: AxisDetailsI;
27
+ lineAxis2?: AxisDetailsI;
21
28
  barAxis: AxisDetailsI;
29
+ isInternationalStore?: boolean;
30
+ customLegend?: boolean;
31
+ orientation?: GRAPH_ORIENTATION;
32
+ noDummyValues?: boolean;
33
+ pointRadius?: number;
22
34
  }
package/dist/esm/components/analytics-chips-and-dropdowns/chart/VerticalBarAndLinearGraph/VerticalBarAndLinearGraphModel.js ADDED
@@ -0,0 +1 @@
1
+ var o;!function(o){o.VERTICAL="vertical",o.HORIZONTAL="horizontal"}(o||(o={}));export{o as GRAPH_ORIENTATION};
package/dist/esm/components/bik-layout/MockMenus.d.ts CHANGED
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  export declare const Menus: ({
3
2
  displayName: string;
4
3
  key: number;
package/dist/esm/components/toaster/Toaster.d.ts CHANGED
@@ -11,8 +11,6 @@ export type ToasterProps = {
11
11
  subText?: string;
12
12
  position?: ToastPosition;
13
13
  type?: 'info' | 'success' | 'error' | 'default' | 'warning';
14
- duration?: number;
15
- blocking?: boolean;
16
14
  closeOnClick?: boolean;
17
15
  hideProgressBar?: boolean;
18
16
  autoClose?: number | false | undefined;
package/dist/esm/components/toaster/Toaster.js CHANGED
@@ -1 +1 @@
1
- import{j as t}from"../../node_modules/react/jsx-runtime.js";import o from"../../assets/icons/alert_triangle.svg.js";import e from"../../assets/icons/check.svg.js";import n from"../../assets/icons/cross.svg.js";import s from"../../assets/icons/errorInfo.svg.js";import i from"../../assets/icons/info.svg.js";import r,{useRef as l,useState as c,useEffect as d,useContext as a}from"react";import u from"react-dom";import{cssTransition as x,toast as p,ToastContainer as h}from"react-toastify";import{Button as g}from"../button/Button.js";import{ToasterStyled as y}from"./Toaster.styled.js";import{TitleSmall as v,BodySecondary as b,BodyCaption as f}from"../TypographyStyle.js";import{COLORS as j}from"../../constants/Theme.js";const T=o=>t.jsxs(b,Object.assign({color:"#9E9E9E",customStyles:{fontWeight:600,fontSize:14,width:18}},{children:[o.duration,"s"]})),m=o=>{const e="default"===o.type?j.content.primary:"success"===o.type?j.content.positive:"error"===o.type?j.content.negative:"warning"===o.type?j.content.warning:j.content.brand,{timerValue:s}=a(C),i=(!o.blocking||-1!==s)&&(o.blocking&&s>0);return t.jsx("div",Object.assign({tabIndex:i?-1:0,role:"button",style:{width:20,display:"flex",cursor:i?"not-allowed":"pointer",alignSelf:""+(o.alignTop?"flex-start":"center"),opacity:i?.5:1},onClick:()=>{!i&&o.closeToast&&o.closeToast()},onKeyDown:t=>{"Enter"===t.key&&!i&&o.closeToast&&o.closeToast()}},{children:s>0?t.jsx(T,{duration:s}):t.jsx(n,{height:20,width:20,color:e})}))},B=o=>{var e,n;const s=j.content.placeholder,{toasterText:i}=a(C);return t.jsx(t.Fragment,{children:t.jsxs("div",Object.assign({style:{display:"flex",flexGrow:1}},{children:[t.jsx("div",Object.assign({style:{flexGrow:1,marginRight:32,display:"flex",alignItems:"center"}},{children:t.jsxs("div",{children:[o.subText?t.jsx(v,Object.assign({color:"inherit"},{children:null!==(e=o.toastText)&&void 0!==e?e:i})):t.jsx(b,Object.assign({color:"inherit"},{children:null!==(n=o.toastText)&&void 0!==n?n:i})),o.subText&&t.jsx("div",Object.assign({style:{marginTop:2}},{children:t.jsx(f,Object.assign({color:j.content.secondary},{children:o.subText}))}))]})})),o.showButton&&t.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px",marginRight:{showSecondButton:4,showButton:0}[o.showSecondButton?"showSecondButton":"showButton"]}},{children:t.jsx(g,{buttonText:o.buttonText,buttonType:"tertiaryGray",color:j.content.secondary,onClick:o.onButtonClick})})),o.showSecondButton&&t.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px"}},{children:t.jsx(g,{buttonText:o.secondButtonText,buttonType:"tertiaryGray",color:j.content.secondary,onClick:o.onSecondButtonClick})})),o.showButton||o.showSecondButton?t.jsx("div",{style:{height:28,alignSelf:"center",marginLeft:8,marginRight:8,borderRight:`1px solid ${s}`,borderRadius:1}}):null]}))})},w=n=>{const r=l(n.toastId||"default-toast"),[a,g]=c(n.text),[v,b]=c(n.duration||-1),f=x({enter:"Toastify__slide-enter",exit:"Toastify__slide-exit"}),T="default"===n.type?null:"success"===n.type?t.jsx(e,{width:20,height:20,color:j.content.positive}):"error"===n.type?t.jsx(s,{width:20,height:20,color:j.content.negative}):"warning"===n.type?t.jsx(o,{width:20,height:20,color:j.content.warning}):t.jsx(i,{width:20,height:20,color:j.content.brand});d((()=>{r.current&&r.current===n.toastId?(g(n.text),p.update(r.current,{autoClose:n.autoClose})):r.current&&r.current!==n.toastId&&w(n.text)}),[n.toastId,n.text]),d((()=>{if(!n.duration)return;b(n.duration);const t=setInterval((()=>{b((o=>{const e=o-1;return e<=0?(clearInterval(t),0):e}))}),1e3);return()=>clearInterval(t)}),[n.duration]);const w=o=>{var e,s,i,l,c,d,a,u,x,h,g,y,v,b,j,w;void 0!==n.hideLeftIcon||n.leftIcon?p(t.jsx(B,{toastText:o,type:n.type||"info",buttonText:null===(e=n.buttonProps)||void 0===e?void 0:e.buttonText,secondButtonText:null===(s=n.secondButtonProps)||void 0===s?void 0:s.buttonText,showButton:null===(i=n.buttonProps)||void 0===i?void 0:i.showButton,showSecondButton:null===(l=n.secondButtonProps)||void 0===l?void 0:l.showButton,onButtonClick:null===(c=n.buttonProps)||void 0===c?void 0:c.onButtonClick,onSecondButtonClick:null===(d=n.secondButtonProps)||void 0===d?void 0:d.onButtonClick,subText:n.subText}),{onClose:n.onCloseToast?n.onCloseToast:()=>({}),icon:!0!==n.hideLeftIcon&&(n.leftIcon?n.leftIcon:"default"!==n.type&&t.jsx("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:T}))),type:n.type,closeButton:t.jsx(m,{type:n.type||"default",alignTop:!(!n.subText||(null===(a=n.buttonProps)||void 0===a?void 0:a.showButton)||(null===(u=n.secondButtonProps)||void 0===u?void 0:u.showButton)),blocking:n.blocking}),toastId:n.toastId||"default-toast",transition:f}):r.current=p(t.jsx(B,{toastText:o,type:n.type||"info",buttonText:null===(x=n.buttonProps)||void 0===x?void 0:x.buttonText,secondButtonText:null===(h=n.secondButtonProps)||void 0===h?void 0:h.buttonText,showButton:null===(g=n.buttonProps)||void 0===g?void 0:g.showButton,showSecondButton:null===(y=n.secondButtonProps)||void 0===y?void 0:y.showButton,onButtonClick:null===(v=n.buttonProps)||void 0===v?void 0:v.onButtonClick,onSecondButtonClick:null===(b=n.secondButtonProps)||void 0===b?void 0:b.onButtonClick,subText:n.subText}),{onClose:n.onCloseToast?n.onCloseToast:()=>({}),type:n.type,icon:"default"!==n.type&&t.jsx("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:T})),closeButton:t.jsx(m,{type:n.type||"default",alignTop:!(!n.subText||(null===(j=n.buttonProps)||void 0===j?void 0:j.showButton)||(null===(w=n.secondButtonProps)||void 0===w?void 0:w.showButton)),blocking:n.blocking}),toastId:n.toastId||"default-toast",transition:f})};return d((()=>{w()}),[]),u.createPortal(t.jsx(y,Object.assign({width:n.width,height:n.height,zIndex:n.zIndex,isSubTextIncluded:!!n.subText,type:n.type},{children:t.jsx(C.Provider,Object.assign({value:{toasterText:a,timerValue:v}},{children:t.jsx(h,{position:n.position||"top-right",closeOnClick:n.closeOnClick||!1,hideProgressBar:n.hideProgressBar||!1,draggable:!1,autoClose:n.autoClose||!1,theme:"colored"})}))})),document.body)},C=r.createContext({toasterText:"",timerValue:-1});export{w as Toaster};
1
+ import{j as t}from"../../node_modules/react/jsx-runtime.js";import o from"../../assets/icons/alert_triangle.svg.js";import e from"../../assets/icons/check.svg.js";import n from"../../assets/icons/cross.svg.js";import s from"../../assets/icons/errorInfo.svg.js";import i from"../../assets/icons/info.svg.js";import l,{useRef as r,useState as d,useEffect as c,useContext as u}from"react";import a from"react-dom";import{cssTransition as x,toast as p,ToastContainer as h}from"react-toastify";import{Button as g}from"../button/Button.js";import{ToasterStyled as y}from"./Toaster.styled.js";import{TitleSmall as v,BodySecondary as j,BodyCaption as f}from"../TypographyStyle.js";import{COLORS as b}from"../../constants/Theme.js";const T=o=>{const e=(o.type,b.content.secondary);return t.jsx("div",Object.assign({tabIndex:0,role:"button",style:{width:20,display:"flex",cursor:"pointer",alignSelf:""+(o.alignTop?"flex-start":"center")},onClick:o.closeToast,onKeyDown:t=>{"Enter"===t.key&&o.closeToast&&o.closeToast()}},{children:t.jsx(n,{height:20,width:20,color:e})}))},B=o=>{var e,n;const s=b.content.placeholder,{toasterText:i}=u(w);return t.jsx(t.Fragment,{children:t.jsxs("div",Object.assign({style:{display:"flex",flexGrow:1}},{children:[t.jsx("div",Object.assign({style:{flexGrow:1,marginRight:32,display:"flex",alignItems:"center"}},{children:t.jsxs("div",{children:[o.subText?t.jsx(v,Object.assign({color:"inherit"},{children:null!==(e=o.toastText)&&void 0!==e?e:i})):t.jsx(j,Object.assign({color:"inherit"},{children:null!==(n=o.toastText)&&void 0!==n?n:i})),o.subText&&t.jsx("div",Object.assign({style:{marginTop:2}},{children:t.jsx(f,Object.assign({color:b.content.secondary},{children:o.subText}))}))]})})),o.showButton&&t.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px",marginRight:{showSecondButton:4,showButton:0}[o.showSecondButton?"showSecondButton":"showButton"]}},{children:t.jsx(g,{buttonText:o.buttonText,buttonType:"tertiaryGray",color:b.content.secondary,onClick:o.onButtonClick})})),o.showSecondButton&&t.jsx("div",Object.assign({style:{display:"flex",flexDirection:"column",alignSelf:"center",padding:"6px 4px"}},{children:t.jsx(g,{buttonText:o.secondButtonText,buttonType:"tertiaryGray",color:b.content.secondary,onClick:o.onSecondButtonClick})})),o.showButton||o.showSecondButton?t.jsx("div",{style:{height:28,alignSelf:"center",marginLeft:8,marginRight:8,borderRight:`1px solid ${s}`,borderRadius:1}}):null]}))})},m=n=>{const l=r(n.toastId||"default-toast"),[u,g]=d(n.text),v=x({enter:"Toastify__slide-enter",exit:"Toastify__slide-exit"}),j="default"===n.type?null:"success"===n.type?t.jsx(e,{width:20,height:20,color:b.content.positive}):"error"===n.type?t.jsx(s,{width:20,height:20,color:b.content.negative}):"warning"===n.type?t.jsx(o,{width:20,height:20,color:b.content.warning}):t.jsx(i,{width:20,height:20,color:b.content.brand});c((()=>{l.current&&l.current===n.toastId?(g(n.text),p.update(l.current,{autoClose:n.autoClose})):l.current&&l.current!==n.toastId&&f(n.text)}),[n.toastId,n.text]);const f=o=>{var e,s,i,r,d,c,u,a,x,h,g,y,f,b,m,w;void 0!==n.hideLeftIcon||n.leftIcon?p(t.jsx(B,{toastText:o,type:n.type||"info",buttonText:null===(e=n.buttonProps)||void 0===e?void 0:e.buttonText,secondButtonText:null===(s=n.secondButtonProps)||void 0===s?void 0:s.buttonText,showButton:null===(i=n.buttonProps)||void 0===i?void 0:i.showButton,showSecondButton:null===(r=n.secondButtonProps)||void 0===r?void 0:r.showButton,onButtonClick:null===(d=n.buttonProps)||void 0===d?void 0:d.onButtonClick,onSecondButtonClick:null===(c=n.secondButtonProps)||void 0===c?void 0:c.onButtonClick,subText:n.subText}),{onClose:n.onCloseToast?n.onCloseToast:()=>({}),icon:!0!==n.hideLeftIcon&&(n.leftIcon?n.leftIcon:"default"!==n.type&&t.jsx("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:j}))),type:n.type,closeButton:t.jsx(T,{type:n.type||"default",alignTop:!(!n.subText||(null===(u=n.buttonProps)||void 0===u?void 0:u.showButton)||(null===(a=n.secondButtonProps)||void 0===a?void 0:a.showButton))}),toastId:n.toastId||"default-toast",transition:v}):l.current=p(t.jsx(B,{toastText:o,type:n.type||"info",buttonText:null===(x=n.buttonProps)||void 0===x?void 0:x.buttonText,secondButtonText:null===(h=n.secondButtonProps)||void 0===h?void 0:h.buttonText,showButton:null===(g=n.buttonProps)||void 0===g?void 0:g.showButton,showSecondButton:null===(y=n.secondButtonProps)||void 0===y?void 0:y.showButton,onButtonClick:null===(f=n.buttonProps)||void 0===f?void 0:f.onButtonClick,onSecondButtonClick:null===(b=n.secondButtonProps)||void 0===b?void 0:b.onButtonClick,subText:n.subText}),{onClose:n.onCloseToast?n.onCloseToast:()=>({}),type:n.type,icon:"default"!==n.type&&t.jsx("div",Object.assign({style:{display:"flex",alignItems:"flex-start"}},{children:j})),closeButton:t.jsx(T,{type:n.type||"default",alignTop:!(!n.subText||(null===(m=n.buttonProps)||void 0===m?void 0:m.showButton)||(null===(w=n.secondButtonProps)||void 0===w?void 0:w.showButton))}),toastId:n.toastId||"default-toast",transition:v})};return c((()=>{f()}),[]),a.createPortal(t.jsx(y,Object.assign({width:n.width,height:n.height,zIndex:n.zIndex,isSubTextIncluded:!!n.subText,type:n.type},{children:t.jsx(w.Provider,Object.assign({value:{toasterText:u}},{children:t.jsx(h,{position:n.position||"top-right",closeOnClick:n.closeOnClick||!1,hideProgressBar:n.hideProgressBar||!1,draggable:!1,autoClose:n.autoClose||!1,theme:"colored"})}))})),document.body)},w=l.createContext({toasterText:""});export{m as Toaster};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bikdotai/bik-component-library",
3
- "version": "0.0.727-beta.34",
3
+ "version": "0.0.727",
4
4
  "description": "Bik Component Library",
5
5
  "repository": {
6
6
  "type": "git",