@servicetitan/marketing-ui 1.4.0 → 1.7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/charts/line-chart/components/body.d.ts.map +1 -1
- package/dist/components/charts/line-chart/components/body.js +2 -1
- package/dist/components/charts/line-chart/components/body.js.map +1 -1
- package/dist/components/charts/line-chart/components/body.module.less +1 -1
- package/dist/components/charts/line-chart/components/hover-popover.d.ts.map +1 -1
- package/dist/components/charts/line-chart/components/hover-popover.js +4 -1
- package/dist/components/charts/line-chart/components/hover-popover.js.map +1 -1
- package/dist/components/charts/line-chart/components/stuff.d.ts +1 -0
- package/dist/components/charts/line-chart/components/stuff.d.ts.map +1 -1
- package/dist/components/charts/line-chart/components/stuff.js +11 -2
- package/dist/components/charts/line-chart/components/stuff.js.map +1 -1
- package/dist/components/charts/line-chart/components/stuff.module.less +12 -3
- package/dist/components/charts/line-chart/components/svg-bars.d.ts +1 -0
- package/dist/components/charts/line-chart/components/svg-bars.d.ts.map +1 -1
- package/dist/components/charts/line-chart/components/svg-bars.js +15 -7
- package/dist/components/charts/line-chart/components/svg-bars.js.map +1 -1
- package/dist/components/charts/line-chart/components/svg-body.d.ts.map +1 -1
- package/dist/components/charts/line-chart/components/svg-body.js +2 -1
- package/dist/components/charts/line-chart/components/svg-body.js.map +1 -1
- package/dist/components/charts/line-chart/line-chart.stories.d.ts +1 -0
- package/dist/components/charts/line-chart/line-chart.stories.d.ts.map +1 -1
- package/dist/components/charts/line-chart/line-chart.stories.js +55 -1
- package/dist/components/charts/line-chart/line-chart.stories.js.map +1 -1
- package/dist/components/charts/line-chart/stores/line-chart.store.d.ts.map +1 -1
- package/dist/components/charts/line-chart/stores/line-chart.store.js +19 -5
- package/dist/components/charts/line-chart/stores/line-chart.store.js.map +1 -1
- package/dist/components/charts/line-chart/stores/svg.store.js +1 -1
- package/dist/components/charts/line-chart/stores/svg.store.js.map +1 -1
- package/dist/components/charts/line-chart/utils/interfaces.d.ts +1 -1
- package/dist/components/charts/line-chart/utils/interfaces.d.ts.map +1 -1
- package/dist/components/stat/stat-card.d.ts.map +1 -1
- package/dist/components/stat/stat-card.js +4 -3
- package/dist/components/stat/stat-card.js.map +1 -1
- package/dist/components/stat/stat-card.module.less +7 -0
- package/dist/components/stat/stat-extended-card.d.ts.map +1 -1
- package/dist/components/stat/stat-extended-card.js +21 -1
- package/dist/components/stat/stat-extended-card.js.map +1 -1
- package/dist/utils/formatters.js +1 -1
- package/package.json +2 -2
- package/src/components/charts/line-chart/components/body.module.less +1 -1
- package/src/components/charts/line-chart/components/body.tsx +5 -2
- package/src/components/charts/line-chart/components/hover-popover.tsx +1 -0
- package/src/components/charts/line-chart/components/stuff.module.less +12 -3
- package/src/components/charts/line-chart/components/stuff.module.less.d.ts +2 -0
- package/src/components/charts/line-chart/components/stuff.tsx +25 -3
- package/src/components/charts/line-chart/components/svg-bars.tsx +37 -19
- package/src/components/charts/line-chart/components/svg-body.tsx +8 -0
- package/src/components/charts/line-chart/line-chart.stories.tsx +66 -0
- package/src/components/charts/line-chart/stores/line-chart.store.ts +23 -5
- package/src/components/charts/line-chart/stores/svg.store.ts +1 -1
- package/src/components/charts/line-chart/utils/interfaces.ts +1 -1
- package/src/components/stat/stat-card.module.less +7 -0
- package/src/components/stat/stat-card.module.less.d.ts +1 -0
- package/src/components/stat/stat-card.tsx +3 -1
- package/src/components/stat/stat-extended-card.tsx +4 -3
- package/src/utils/__tests__/formatters.test.ts +1 -1
- package/src/utils/formatters.ts +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"body.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/body.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAiB/D,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,cAAc,CAAC,EAAE,MAAM,CAAA;CAAE,
|
|
1
|
+
{"version":3,"file":"body.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/body.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0C,MAAM,OAAO,CAAC;AAiB/D,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,cAAc,CAAC,EAAE,MAAM,CAAA;CAAE,CA0FtD,CAAC"}
|
|
@@ -54,6 +54,7 @@ exports.Body = react_ioc_1.provide({ singletons: [svg_store_1.SvgStore] })(mobx_
|
|
|
54
54
|
'border-right': !!right && display.yRight,
|
|
55
55
|
}) }, { children: periods.length ? (jsx_runtime_1.jsxs(react_1.default.Fragment, { children: [periods.length !== labels.length && (jsx_runtime_1.jsx("div", Object.assign({ className: Styles.labelBorders }, { children: labels
|
|
56
56
|
.map(([text, flex], ind) => [flex, `${ind}${text}`])
|
|
57
|
-
.map(([flex, key]) => (jsx_runtime_1.jsx("div", { style: { flex } }, key))) }), void 0)), jsx_runtime_1.jsx(svg_body_1.SvgBody, { horizontalGrid: display.yGrid, metrics: metrics }, void 0), jsx_runtime_1.jsx(hover_popover_1.HoverPopover, {}, void 0), jsx_runtime_1.jsx(svg_body_1.SvgBodyHover, { onValueHover: onBarHover, onValueLeave: onBarLeave }, void 0)] }, void 0)) : (jsx_runtime_1.jsx(design_system_1.Stack, Object.assign({ className: "h-100", justifyContent: "center", alignItems: "center" }, { children: "No Data" }), void 0)) }), void 0) }), void 0), right && jsx_runtime_1.jsx(sidebar_1.Sidebar, { settings: right, right: true, classNameTitle: classNameTitle }, void 0)] }), void 0), display.xLabels && (jsx_runtime_1.jsx(stuff_1.XAxisLabels, { labels: labels, width: (_a = rect === null || rect === void 0 ? void 0 : rect.width) !== null && _a !== void 0 ? _a : 0, left: (_b = left === null || left === void 0 ? void 0 : left.width) !== null && _b !== void 0 ? _b : 0, right: (_c = right === null || right === void 0 ? void 0 : right.width) !== null && _c !== void 0 ? _c : 0, labelsMerged: periods.length !== labels.length, hasBars: !!metrics.filter(m => m.type === 'bar'
|
|
57
|
+
.map(([flex, key]) => (jsx_runtime_1.jsx("div", { style: { flex } }, key))) }), void 0)), jsx_runtime_1.jsx(svg_body_1.SvgBody, { horizontalGrid: display.yGrid, metrics: metrics }, void 0), jsx_runtime_1.jsx(hover_popover_1.HoverPopover, {}, void 0), jsx_runtime_1.jsx(svg_body_1.SvgBodyHover, { onValueHover: onBarHover, onValueLeave: onBarLeave }, void 0)] }, void 0)) : (jsx_runtime_1.jsx(design_system_1.Stack, Object.assign({ className: "h-100", justifyContent: "center", alignItems: "center" }, { children: "No Data" }), void 0)) }), void 0) }), void 0), right && jsx_runtime_1.jsx(sidebar_1.Sidebar, { settings: right, right: true, classNameTitle: classNameTitle }, void 0)] }), void 0), display.xLabels && (jsx_runtime_1.jsx(stuff_1.XAxisLabels, { labels: labels, width: (_a = rect === null || rect === void 0 ? void 0 : rect.width) !== null && _a !== void 0 ? _a : 0, left: (_b = left === null || left === void 0 ? void 0 : left.width) !== null && _b !== void 0 ? _b : 0, right: (_c = right === null || right === void 0 ? void 0 : right.width) !== null && _c !== void 0 ? _c : 0, labelsMerged: periods.length !== labels.length, hasBars: !!metrics.filter(m => m.type === 'bar' || m.type === 'stacked-bar')
|
|
58
|
+
.length }, void 0)), display.metricsTitlePosition === 'bottom' && (jsx_runtime_1.jsx(design_system_1.Stack, Object.assign({ direction: "row", justifyContent: "center", className: "p-3" }, { children: jsx_runtime_1.jsx(stuff_1.MetricsTitle, { metrics: metrics }, void 0) }), void 0))] }), void 0));
|
|
58
59
|
}));
|
|
59
60
|
//# sourceMappingURL=body.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"body.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/body.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"body.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/body.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hover-popover.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/hover-popover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAYpD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,
|
|
1
|
+
{"version":3,"file":"hover-popover.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/hover-popover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAYpD,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAiE/B,CAAC"}
|
|
@@ -53,6 +53,9 @@ exports.HoverPopover = mobx_react_1.observer(() => {
|
|
|
53
53
|
}
|
|
54
54
|
const period = periods[hoveredIndex];
|
|
55
55
|
const partialWeek = !!period.partial;
|
|
56
|
-
return (jsx_runtime_1.jsxs(react_1.default.Fragment, { children: [jsx_runtime_1.jsx("div", { className: Styles.line, style: { left: svgStore.fpx(svgStore.periodX(hoveredIndex)) + '%' } }, void 0), jsx_runtime_1.jsxs("div", Object.assign({ className: classnames_1.default(Styles.popover, 'bg-white border border-radius-1 p-1'), style: popoverStyle }, { children: [jsx_runtime_1.jsx(design_system_1.BodyText, Object.assign({ size: "small", bold: true }, { children: formatDateTitle(period) }), void 0), partialWeek && (jsx_runtime_1.jsx(design_system_1.BodyText, Object.assign({ size: "xsmall", subdued: true }, { children: "Partial week" }), void 0)), metrics.map(m =>
|
|
56
|
+
return (jsx_runtime_1.jsxs(react_1.default.Fragment, { children: [jsx_runtime_1.jsx("div", { className: Styles.line, style: { left: svgStore.fpx(svgStore.periodX(hoveredIndex)) + '%' } }, void 0), jsx_runtime_1.jsxs("div", Object.assign({ className: classnames_1.default(Styles.popover, 'bg-white border border-radius-1 p-1'), style: popoverStyle }, { children: [jsx_runtime_1.jsx(design_system_1.BodyText, Object.assign({ size: "small", bold: true }, { children: formatDateTitle(period) }), void 0), partialWeek && (jsx_runtime_1.jsx(design_system_1.BodyText, Object.assign({ size: "xsmall", subdued: true }, { children: "Partial week" }), void 0)), metrics.map(m => {
|
|
57
|
+
var _a;
|
|
58
|
+
return m.values[hoveredIndex] !== undefined && (jsx_runtime_1.jsx(stuff_1.ColorTag, { label: formatValue(m.title, m.values[hoveredIndex], m.isRight), color: m.color, className: "m-t-1", dashed: (_a = m.opts) === null || _a === void 0 ? void 0 : _a.dashed, small: true }, m.title));
|
|
59
|
+
})] }), void 0)] }, void 0));
|
|
57
60
|
});
|
|
58
61
|
//# sourceMappingURL=hover-popover.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hover-popover.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/hover-popover.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAoD;AACpD,4DAAoC;AACpC,2CAAsC;AACtC,uDAA0D;AAC1D,+DAAuD;AACvD,iEAA4D;AAC5D,mDAA+C;AAC/C,oDAAmD;AACnD,4CAA2D;AAC3D,oEAAsD;AACtD,mCAAmC;AAEtB,QAAA,YAAY,GAAa,qBAAQ,CAAC,GAAG,EAAE;IAChD,MAAM,CAAC,EAAE,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,QAAQ,CAAC,GAAG,2BAAe,CACvF,iCAAc,EACd,oBAAQ,CACX,CAAC;IAEF,MAAM,eAAe,GAAG,eAAO,CAAC,GAAG,EAAE,CAAC,iCAAwB,CAAC,UAAU,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAC1F,MAAM,WAAW,GAAG,mBAAW,CAC3B,CAAC,KAAa,EAAE,KAAa,EAAE,OAAgB,EAAE,EAAE,CAC/C,yBAAY,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC,KAAK,CAAC;QACrF,GAAG;QACH,KAAK,EACT,CAAC,OAAO,CAAC,CACZ,CAAC;IACF,MAAM,YAAY,GAAG,eAAO,CAAC,GAAG,EAAE;QAC9B,MAAM,GAAG,GAAG,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC;QAE3C,IAAI,YAAY,GAAG,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE;YACnC,OAAO,EAAE,IAAI,EAAE,GAAG,QAAQ,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC;SAChD;QAED,OAAO,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,EAAE,CAAC;IACpD,CAAC,EAAE,CAAC,QAAQ,EAAE,YAAY,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC;IAE7C,IAAI,YAAY,GAAG,CAAC,IAAI,YAAY,IAAI,OAAO,CAAC,MAAM,EAAE;QACpD,OAAO,IAAI,CAAC;KACf;IAED,MAAM,MAAM,GAAG,OAAO,CAAC,YAAY,CAAE,CAAC;IACtC,MAAM,WAAW,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC;IAErC,OAAO,CACH,mBAAC,eAAK,CAAC,QAAQ,eACX,2BACI,SAAS,EAAE,MAAM,CAAC,IAAI,EACtB,KAAK,EAAE,EAAE,IAAI,EAAE,QAAQ,CAAC,GAAG,CAAC,QAAQ,CAAC,OAAO,CAAC,YAAY,CAAC,CAAC,GAAG,GAAG,EAAE,WACrE,EACF,0CACI,SAAS,EAAE,oBAAU,CAAC,MAAM,CAAC,OAAO,EAAE,qCAAqC,CAAC,EAC5E,KAAK,EAAE,YAAY,iBAEnB,kBAAC,wBAAQ,kBAAC,IAAI,EAAC,OAAO,EAAC,IAAI,sBACtB,eAAe,CAAC,MAAM,CAAC,YACjB,EACV,WAAW,IAAI,CACZ,kBAAC,wBAAQ,kBAAC,IAAI,EAAC,QAAQ,EAAC,OAAO,gDAEpB,CACd,EACA,OAAO,CAAC,GAAG,CACR,CAAC,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"hover-popover.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/hover-popover.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stuff.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/stuff.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiC,MAAM,OAAO,CAAC;AAItD,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAE5D,UAAU,aAAa;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"stuff.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/stuff.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiC,MAAM,OAAO,CAAC;AAItD,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAE5D,UAAU,aAAa;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAoB5C,CAAC;AAEF,UAAU,iBAAiB;IACvB,OAAO,EAAE,eAAe,EAAE,CAAC;CAC9B;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAYpD,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC;IAC/B,MAAM,EAAE,YAAY,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,OAAO,CAAC;CACpB,CAsEA,CAAC"}
|
|
@@ -28,9 +28,18 @@ const react_1 = require("react");
|
|
|
28
28
|
const classnames_1 = __importDefault(require("classnames"));
|
|
29
29
|
const design_system_1 = require("@servicetitan/design-system");
|
|
30
30
|
const Styles = __importStar(require("./stuff.module.less"));
|
|
31
|
-
const ColorTag = ({ label, color, className, small }) => (jsx_runtime_1.jsxs(design_system_1.Stack, Object.assign({ alignItems: "center", className: className }, { children: [jsx_runtime_1.jsx("div", { style:
|
|
31
|
+
const ColorTag = ({ label, color, className, small, dashed }) => (jsx_runtime_1.jsxs(design_system_1.Stack, Object.assign({ alignItems: "center", className: className }, { children: [jsx_runtime_1.jsx("div", { style: dashed
|
|
32
|
+
? {
|
|
33
|
+
borderColor: color,
|
|
34
|
+
}
|
|
35
|
+
: {
|
|
36
|
+
backgroundColor: color,
|
|
37
|
+
}, className: classnames_1.default(Styles.colorTag, dashed && Styles.colorTagDashed, small && Styles.colorTagSmall) }, void 0), jsx_runtime_1.jsx(design_system_1.BodyText, Object.assign({ size: small ? 'xsmall' : 'small' }, { children: label }), void 0)] }), void 0));
|
|
32
38
|
exports.ColorTag = ColorTag;
|
|
33
|
-
const MetricsTitle = ({ metrics }) => (jsx_runtime_1.jsx(design_system_1.Stack, Object.assign({ alignItems: "center" }, { children: metrics.map(m =>
|
|
39
|
+
const MetricsTitle = ({ metrics }) => (jsx_runtime_1.jsx(design_system_1.Stack, Object.assign({ alignItems: "center" }, { children: metrics.map(m => {
|
|
40
|
+
var _a;
|
|
41
|
+
return (jsx_runtime_1.jsx(exports.ColorTag, { label: m.title, color: m.color, dashed: (_a = m.opts) === null || _a === void 0 ? void 0 : _a.dashed, className: "m-r-4" }, m.id));
|
|
42
|
+
}) }), void 0));
|
|
34
43
|
exports.MetricsTitle = MetricsTitle;
|
|
35
44
|
const XAxisLabels = ({ labels, width, left, right, labelsMerged, hasBars }) => {
|
|
36
45
|
const data = react_1.useMemo(() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stuff.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/stuff.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,iCAAsD;AACtD,4DAAoC;AACpC,+DAA8D;AAC9D,4DAA8C;
|
|
1
|
+
{"version":3,"file":"stuff.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/stuff.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,10 +1,19 @@
|
|
|
1
1
|
@import (reference) '~@servicetitan/tokens/dist/tokens.less';
|
|
2
2
|
|
|
3
3
|
.color-tag {
|
|
4
|
-
width: @spacing-
|
|
5
|
-
height: @spacing-2;
|
|
4
|
+
width: @spacing-3;
|
|
6
5
|
margin-right: @spacing-1;
|
|
7
|
-
|
|
6
|
+
height: 3px;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.color-tag-dashed {
|
|
10
|
+
height: 0;
|
|
11
|
+
border-top-style: dashed;
|
|
12
|
+
border-top-width: 3px;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.color-tag-small {
|
|
16
|
+
width: @spacing-2;
|
|
8
17
|
}
|
|
9
18
|
|
|
10
19
|
.x-axis-label {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"svg-bars.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/svg-bars.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAI3D,UAAU,YAAY;IAClB,OAAO,EAAE,WAAW,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"svg-bars.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/svg-bars.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAI3D,UAAU,YAAY;IAClB,OAAO,EAAE,WAAW,EAAE,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;CAC/B;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAgDzC,CAAC;AAEH,UAAU,iBAAiB;IACvB,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;CAC9B;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAyBnD,CAAC"}
|
|
@@ -6,25 +6,33 @@ const mobx_react_1 = require("mobx-react");
|
|
|
6
6
|
const react_ioc_1 = require("@servicetitan/react-ioc");
|
|
7
7
|
const key_1 = require("../utils/key");
|
|
8
8
|
const svg_store_1 = require("../stores/svg.store");
|
|
9
|
-
exports.SvgBars = mobx_react_1.observer(({ metrics }) => {
|
|
9
|
+
exports.SvgBars = mobx_react_1.observer(({ metrics, isStackedBarChart }) => {
|
|
10
10
|
const [store] = react_ioc_1.useDependencies(svg_store_1.SvgStore);
|
|
11
11
|
const { fpx, fpy, barWidth, length } = store;
|
|
12
12
|
const barWidthHalf = barWidth / 2;
|
|
13
13
|
const paths = [];
|
|
14
14
|
for (let i = 0; i < length; i++) {
|
|
15
15
|
const x = store.periodX(i);
|
|
16
|
-
const values = metrics
|
|
17
|
-
.map(m => {
|
|
16
|
+
const values = metrics.map(m => {
|
|
18
17
|
var _a, _b, _c;
|
|
19
18
|
return ({
|
|
20
19
|
id: m.id,
|
|
21
20
|
color: (_c = (_b = (_a = m.valuesOpts) === null || _a === void 0 ? void 0 : _a[i]) === null || _b === void 0 ? void 0 : _b.color) !== null && _c !== void 0 ? _c : m.color,
|
|
22
21
|
val: store.periodY(m, i),
|
|
23
22
|
});
|
|
24
|
-
})
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
23
|
+
});
|
|
24
|
+
if (isStackedBarChart) {
|
|
25
|
+
let stackedBarHeight = values.reduce((sum, curr) => sum + curr.val, 0);
|
|
26
|
+
for (const value of values) {
|
|
27
|
+
paths.push(jsx_runtime_1.jsx("rect", { x: fpx(x - barWidthHalf), y: fpy(stackedBarHeight), width: fpx(barWidth), height: fpx(value.val), fill: value.color }, key_1.keyVal(value.id, i)));
|
|
28
|
+
stackedBarHeight -= value.val;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
else {
|
|
32
|
+
values.sort((a, b) => b.val - a.val);
|
|
33
|
+
for (const value of values) {
|
|
34
|
+
paths.push(jsx_runtime_1.jsx("rect", { x: fpx(x - barWidthHalf), y: fpy(value.val), width: fpx(barWidth), height: fpx(value.val), fill: value.color }, key_1.keyVal(value.id, i)));
|
|
35
|
+
}
|
|
28
36
|
}
|
|
29
37
|
}
|
|
30
38
|
return jsx_runtime_1.jsx("g", { children: paths }, void 0);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"svg-bars.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/svg-bars.tsx"],"names":[],"mappings":";;;;AACA,2CAAsC;AACtC,uDAA0D;AAE1D,sCAAsC;AACtC,mDAA+C;
|
|
1
|
+
{"version":3,"file":"svg-bars.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/svg-bars.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"svg-body.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/svg-body.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AA8B3D,UAAU,YAAY;IAClB,cAAc,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,WAAW,EAAE,CAAC;CAC1B;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,
|
|
1
|
+
{"version":3,"file":"svg-body.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/svg-body.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAM1B,OAAO,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AA8B3D,UAAU,YAAY;IAClB,cAAc,EAAE,OAAO,CAAC;IACxB,OAAO,EAAE,WAAW,EAAE,CAAC;CAC1B;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAyBzC,CAAC;AAEH,UAAU,iBAAiB;IACvB,YAAY,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;IAChC,YAAY,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;CACnC;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAIpD,CAAC"}
|
|
@@ -43,8 +43,9 @@ const SvgGrid = () => {
|
|
|
43
43
|
exports.SvgBody = mobx_react_1.observer(({ horizontalGrid, metrics }) => {
|
|
44
44
|
const [{ key }] = react_ioc_1.useDependencies(svg_store_1.SvgStore);
|
|
45
45
|
const barMetrics = metrics.filter(m => m.type === 'bar');
|
|
46
|
+
const stackedBarMetrics = metrics.filter(m => m.type === 'stacked-bar');
|
|
46
47
|
const lineMetrics = metrics.filter(m => m.type === 'line');
|
|
47
|
-
return (jsx_runtime_1.jsxs("svg", Object.assign({ className: Styles.svgBody, viewBox: "0 0 100 100", preserveAspectRatio: "none", vectorEffect: "non-scaling-stroke" }, { children: [horizontalGrid && jsx_runtime_1.jsx(SvgGrid, {}, void 0), !!barMetrics.length && jsx_runtime_1.jsx(svg_bars_1.SvgBars, { metrics: barMetrics }, key_1.keyVal('bars', key)), !!lineMetrics.length && jsx_runtime_1.jsx(svg_lines_1.SvgLines, { metrics: lineMetrics }, key_1.keyVal('lines', key))] }), void 0));
|
|
48
|
+
return (jsx_runtime_1.jsxs("svg", Object.assign({ className: Styles.svgBody, viewBox: "0 0 100 100", preserveAspectRatio: "none", vectorEffect: "non-scaling-stroke" }, { children: [horizontalGrid && jsx_runtime_1.jsx(SvgGrid, {}, void 0), !!barMetrics.length && jsx_runtime_1.jsx(svg_bars_1.SvgBars, { metrics: barMetrics }, key_1.keyVal('bars', key)), !!stackedBarMetrics.length && (jsx_runtime_1.jsx(svg_bars_1.SvgBars, { metrics: stackedBarMetrics, isStackedBarChart: true }, key_1.keyVal('stacked-bars', key))), !!lineMetrics.length && jsx_runtime_1.jsx(svg_lines_1.SvgLines, { metrics: lineMetrics }, key_1.keyVal('lines', key))] }), void 0));
|
|
48
49
|
});
|
|
49
50
|
const SvgBodyHover = ({ onValueHover, onValueLeave }) => (jsx_runtime_1.jsx("svg", Object.assign({ className: Styles.svgHover, viewBox: "0 0 100 100", preserveAspectRatio: "none" }, { children: jsx_runtime_1.jsx(svg_bars_1.SvgBarsHover, { onHover: onValueHover, onLeave: onValueLeave }, void 0) }), void 0));
|
|
50
51
|
exports.SvgBodyHover = SvgBodyHover;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"svg-body.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/svg-body.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AACA,2CAAsC;AACtC,kEAA0C;AAC1C,uDAA0D;AAE1D,mDAA+C;AAE/C,sCAAsC;AAEtC,yCAAmD;AACnD,2CAAuC;AACvC,0DAA4C;AAE5C,MAAM,OAAO,GAAa,GAAG,EAAE;IAC3B,MAAM,KAAK,GAAG,EAAE,CAAC;IAEjB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,EAAE;QAC7B,MAAM,CAAC,GAAG,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC;QAEzB,KAAK,CAAC,IAAI,CACN,4BACI,SAAS,EAAE,MAAM,CAAC,IAAI,EAEtB,EAAE,EAAC,GAAG,EACN,EAAE,EAAE,CAAC,EACL,EAAE,EAAC,MAAM,EACT,EAAE,EAAE,CAAC,EACL,MAAM,EAAE,gBAAM,CAAC,cAAc,EAC7B,WAAW,EAAC,GAAG,IANV,CAAC,CAOR,CACL,CAAC;KACL;IAED,OAAO,mCAAI,KAAK,WAAK,CAAC;AAC1B,CAAC,CAAC;AAOW,QAAA,OAAO,GAA2B,qBAAQ,CAAC,CAAC,EAAE,cAAc,EAAE,OAAO,EAAE,EAAE,EAAE;IACpF,MAAM,CAAC,EAAE,GAAG,EAAE,CAAC,GAAG,2BAAe,CAAC,oBAAQ,CAAC,CAAC;IAC5C,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,KAAK,CAAC,CAAC;IACzD,MAAM,WAAW,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC;IAE3D,OAAO,CACH,0CACI,SAAS,EAAE,MAAM,CAAC,OAAO,EACzB,OAAO,EAAC,aAAa,EACrB,mBAAmB,EAAC,MAAM,EAC1B,YAAY,EAAC,oBAAoB,iBAEhC,cAAc,IAAI,kBAAC,OAAO,aAAG,EAC7B,CAAC,CAAC,UAAU,CAAC,MAAM,IAAI,kBAAC,kBAAO,IAA2B,OAAO,EAAE,UAAU,IAAxC,YAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAyB,EACjF,CAAC,CAAC,WAAW,CAAC,MAAM,IAAI,kBAAC,oBAAQ,IAA4B,OAAO,EAAE,WAAW,IAA1C,YAAM,CAAC,OAAO,EAAE,GAAG,CAAC,CAA0B,aACpF,CACT,CAAC;AACN,CAAC,CAAC,CAAC;AAOI,MAAM,YAAY,GAAgC,CAAC,EAAE,YAAY,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC,CACzF,yCAAK,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAE,OAAO,EAAC,aAAa,EAAC,mBAAmB,EAAC,MAAM,gBAC7E,kBAAC,uBAAY,IAAC,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,YAAY,WAAI,YAC5D,CACT,CAAC;AAJW,QAAA,YAAY,gBAIvB"}
|
|
1
|
+
{"version":3,"file":"svg-body.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/components/svg-body.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AACA,2CAAsC;AACtC,kEAA0C;AAC1C,uDAA0D;AAE1D,mDAA+C;AAE/C,sCAAsC;AAEtC,yCAAmD;AACnD,2CAAuC;AACvC,0DAA4C;AAE5C,MAAM,OAAO,GAAa,GAAG,EAAE;IAC3B,MAAM,KAAK,GAAG,EAAE,CAAC;IAEjB,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,EAAE;QAC7B,MAAM,CAAC,GAAG,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC;QAEzB,KAAK,CAAC,IAAI,CACN,4BACI,SAAS,EAAE,MAAM,CAAC,IAAI,EAEtB,EAAE,EAAC,GAAG,EACN,EAAE,EAAE,CAAC,EACL,EAAE,EAAC,MAAM,EACT,EAAE,EAAE,CAAC,EACL,MAAM,EAAE,gBAAM,CAAC,cAAc,EAC7B,WAAW,EAAC,GAAG,IANV,CAAC,CAOR,CACL,CAAC;KACL;IAED,OAAO,mCAAI,KAAK,WAAK,CAAC;AAC1B,CAAC,CAAC;AAOW,QAAA,OAAO,GAA2B,qBAAQ,CAAC,CAAC,EAAE,cAAc,EAAE,OAAO,EAAE,EAAE,EAAE;IACpF,MAAM,CAAC,EAAE,GAAG,EAAE,CAAC,GAAG,2BAAe,CAAC,oBAAQ,CAAC,CAAC;IAC5C,MAAM,UAAU,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,KAAK,CAAC,CAAC;IACzD,MAAM,iBAAiB,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,aAAa,CAAC,CAAC;IACxE,MAAM,WAAW,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC;IAE3D,OAAO,CACH,0CACI,SAAS,EAAE,MAAM,CAAC,OAAO,EACzB,OAAO,EAAC,aAAa,EACrB,mBAAmB,EAAC,MAAM,EAC1B,YAAY,EAAC,oBAAoB,iBAEhC,cAAc,IAAI,kBAAC,OAAO,aAAG,EAC7B,CAAC,CAAC,UAAU,CAAC,MAAM,IAAI,kBAAC,kBAAO,IAA2B,OAAO,EAAE,UAAU,IAAxC,YAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAyB,EACjF,CAAC,CAAC,iBAAiB,CAAC,MAAM,IAAI,CAC3B,kBAAC,kBAAO,IAEJ,OAAO,EAAE,iBAAiB,EAC1B,iBAAiB,UAFZ,YAAM,CAAC,cAAc,EAAE,GAAG,CAAC,CAGlC,CACL,EACA,CAAC,CAAC,WAAW,CAAC,MAAM,IAAI,kBAAC,oBAAQ,IAA4B,OAAO,EAAE,WAAW,IAA1C,YAAM,CAAC,OAAO,EAAE,GAAG,CAAC,CAA0B,aACpF,CACT,CAAC;AACN,CAAC,CAAC,CAAC;AAOI,MAAM,YAAY,GAAgC,CAAC,EAAE,YAAY,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC,CACzF,yCAAK,SAAS,EAAE,MAAM,CAAC,QAAQ,EAAE,OAAO,EAAC,aAAa,EAAC,mBAAmB,EAAC,MAAM,gBAC7E,kBAAC,uBAAY,IAAC,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,YAAY,WAAI,YAC5D,CACT,CAAC;AAJW,QAAA,YAAY,gBAIvB"}
|
|
@@ -6,6 +6,7 @@ declare const _default: {
|
|
|
6
6
|
};
|
|
7
7
|
export default _default;
|
|
8
8
|
export declare const lineChartDailyBottomTitles: () => JSX.Element;
|
|
9
|
+
export declare const stackedBarChartDailyBottomTitles: () => JSX.Element;
|
|
9
10
|
export declare const lineChartWeekly: () => JSX.Element;
|
|
10
11
|
export declare const lineChartMergedDays: FC;
|
|
11
12
|
export declare const lineChartIndexes: FC;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"line-chart.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/charts/line-chart/line-chart.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;;;;;;AAI5C,wBAIE;
|
|
1
|
+
{"version":3,"file":"line-chart.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/charts/line-chart/line-chart.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;;;;;;AAI5C,wBAIE;AAkFF,eAAO,MAAM,0BAA0B,mBA4BtC,CAAC;AAEF,eAAO,MAAM,gCAAgC,mBAkC5C,CAAC;AAEF,eAAO,MAAM,eAAe,mBA2B3B,CAAC;AA2BF,eAAO,MAAM,mBAAmB,EAAE,EA8BjC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,EA8B9B,CAAC"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.lineChartIndexes = exports.lineChartMergedDays = exports.lineChartWeekly = exports.lineChartDailyBottomTitles = void 0;
|
|
3
|
+
exports.lineChartIndexes = exports.lineChartMergedDays = exports.lineChartWeekly = exports.stackedBarChartDailyBottomTitles = exports.lineChartDailyBottomTitles = void 0;
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const react_1 = require("react");
|
|
6
6
|
const design_system_1 = require("@servicetitan/design-system");
|
|
@@ -33,6 +33,33 @@ const dailyValues = (() => {
|
|
|
33
33
|
],
|
|
34
34
|
};
|
|
35
35
|
})();
|
|
36
|
+
const stackedBarChartValues = (() => {
|
|
37
|
+
const periods = [];
|
|
38
|
+
const days = new Date(2021, 7, 0).getDate();
|
|
39
|
+
for (let i = 1; i <= days; i++) {
|
|
40
|
+
periods.push({
|
|
41
|
+
from: new Date(2021, 7, i),
|
|
42
|
+
to: new Date(2021, 7, i + 1),
|
|
43
|
+
});
|
|
44
|
+
}
|
|
45
|
+
return {
|
|
46
|
+
periods,
|
|
47
|
+
values: [
|
|
48
|
+
{
|
|
49
|
+
metricId: 2,
|
|
50
|
+
values: periods.map((_, index) => 15 + (index % 5) * 15),
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
metricId: 3,
|
|
54
|
+
values: periods.map((_, index) => 10 + (index % 5) * 10),
|
|
55
|
+
},
|
|
56
|
+
{
|
|
57
|
+
metricId: 4,
|
|
58
|
+
values: periods.map((_, index) => 5 + (index % 5) * 5),
|
|
59
|
+
},
|
|
60
|
+
],
|
|
61
|
+
};
|
|
62
|
+
})();
|
|
36
63
|
const weeklyValues = (() => {
|
|
37
64
|
const periods = [];
|
|
38
65
|
for (let i = 0; i <= 15; i++) {
|
|
@@ -75,6 +102,33 @@ const lineChartDailyBottomTitles = () => (jsx_runtime_1.jsx(index_1.LineChart, {
|
|
|
75
102
|
metricsTitlePosition: 'bottom',
|
|
76
103
|
} }, void 0));
|
|
77
104
|
exports.lineChartDailyBottomTitles = lineChartDailyBottomTitles;
|
|
105
|
+
const stackedBarChartDailyBottomTitles = () => {
|
|
106
|
+
return (jsx_runtime_1.jsx(index_1.LineChart, { resolution: "day", metrics: [
|
|
107
|
+
{
|
|
108
|
+
id: 2,
|
|
109
|
+
title: 'Lead Calls',
|
|
110
|
+
type: 'stacked-bar',
|
|
111
|
+
color: '#D0D8DD',
|
|
112
|
+
},
|
|
113
|
+
{
|
|
114
|
+
id: 3,
|
|
115
|
+
title: 'Online Bookings',
|
|
116
|
+
type: 'stacked-bar',
|
|
117
|
+
color: '#08BFDF',
|
|
118
|
+
},
|
|
119
|
+
{
|
|
120
|
+
id: 4,
|
|
121
|
+
title: 'Manual Calls',
|
|
122
|
+
type: 'stacked-bar',
|
|
123
|
+
color: '#1FBC70',
|
|
124
|
+
},
|
|
125
|
+
], metricValues: stackedBarChartValues.values, periods: dailyValues.periods, titleY: "Left title", display: {
|
|
126
|
+
yLeft: false,
|
|
127
|
+
yLeftFormat: 'number',
|
|
128
|
+
metricsTitlePosition: 'bottom',
|
|
129
|
+
} }, void 0));
|
|
130
|
+
};
|
|
131
|
+
exports.stackedBarChartDailyBottomTitles = stackedBarChartDailyBottomTitles;
|
|
78
132
|
const lineChartWeekly = () => (jsx_runtime_1.jsx(index_1.LineChart, { resolution: "week", metrics: [
|
|
79
133
|
{
|
|
80
134
|
id: 1,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"line-chart.stories.js","sourceRoot":"","sources":["../../../../src/components/charts/line-chart/line-chart.stories.tsx"],"names":[],"mappings":";;;;AAAA,iCAA4C;AAC5C,+DAAmD;AACnD,mCAAqD;AAErD,kBAAe;IACX,KAAK,EAAE,+BAA+B;IACtC,SAAS,EAAE,iBAAS;IACpB,UAAU,EAAE,EAAE;CACjB,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,GAAG,EAAE;IACtB,MAAM,OAAO,GAAsB,EAAE,CAAC;IACtC,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,EAAE,CAAC;IAE5C,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,IAAI,EAAE,CAAC,EAAE,EAAE;QAC5B,OAAO,CAAC,IAAI,CAAC;YACT,IAAI,EAAE,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,CAAC;YAC1B,EAAE,EAAE,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;SAC/B,CAAC,CAAC;KACN;IAED,OAAO;QACH,OAAO;QACP,MAAM,EAAE;YACJ;gBACI,QAAQ,EAAE,CAAC;gBACX,MAAM,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC;aAC/D;YACD;gBACI,QAAQ,EAAE,CAAC;gBACX,MAAM,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;aACtE;SACJ;KACJ,CAAC;AACN,CAAC,CAAC,EAAE,CAAC;AAEL,MAAM,YAAY,GAAG,CAAC,GAAG,EAAE;IACvB,MAAM,OAAO,GAAsB,EAAE,CAAC;IAEtC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,EAAE,EAAE;QAC1B,OAAO,CAAC,IAAI,CAAC;YACT,IAAI,EAAE,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;SACrC,CAAC,CAAC;KACN;IAED,OAAO;QACH,OAAO;QACP,MAAM,EAAE;YACJ;gBACI,QAAQ,EAAE,CAAC;gBACX,MAAM,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC;aAC/D;YACD;gBACI,QAAQ,EAAE,CAAC;gBACX,MAAM,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC;aACzD;SACJ;KACJ,CAAC;AACN,CAAC,CAAC,EAAE,CAAC;AAEE,MAAM,0BAA0B,GAAG,GAAG,EAAE,CAAC,CAC5C,kBAAC,iBAAS,IACN,UAAU,EAAC,KAAK,EAChB,OAAO,EAAE;QACL;YACI,EAAE,EAAE,CAAC;YACL,KAAK,EAAE,SAAS;YAChB,KAAK,EAAE,SAAS;YAChB,IAAI,EAAE,KAAK;SACd;QACD;YACI,EAAE,EAAE,CAAC;YACL,KAAK,EAAE,SAAS;YAChB,KAAK,EAAE,QAAQ;YACf,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;YACtB,OAAO,EAAE,IAAI;SAChB;KACJ,EACD,YAAY,EAAE,WAAW,CAAC,MAAM,EAChC,OAAO,EAAE,WAAW,CAAC,OAAO,EAC5B,MAAM,EAAC,YAAY,EACnB,OAAO,EAAE;QACL,KAAK,EAAE,KAAK;QACZ,WAAW,EAAE,OAAO;QACpB,oBAAoB,EAAE,QAAQ;KACjC,WACH,CACL,CAAC;AA5BW,QAAA,0BAA0B,8BA4BrC;AAEK,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,CACjC,kBAAC,iBAAS,IACN,UAAU,EAAC,MAAM,EACjB,OAAO,EAAE;QACL;YACI,EAAE,EAAE,CAAC;YACL,KAAK,EAAE,SAAS;YAChB,KAAK,EAAE,SAAS;YAChB,IAAI,EAAE,MAAM;SACf;QACD;YACI,EAAE,EAAE,CAAC;YACL,KAAK,EAAE,SAAS;YAChB,KAAK,EAAE,SAAS;YAChB,IAAI,EAAE,MAAM;YACZ,OAAO,EAAE,IAAI;SAChB;KACJ,EACD,YAAY,EAAE,YAAY,CAAC,MAAM,EACjC,OAAO,EAAE,YAAY,CAAC,OAAO,EAC7B,OAAO,EAAE;QACL,KAAK,EAAE,IAAI;QACX,MAAM,EAAE,IAAI;QACZ,WAAW,EAAE,YAAY;QACzB,oBAAoB,EAAE,KAAK;KAC9B,WACH,CACL,CAAC;AA3BW,QAAA,eAAe,mBA2B1B;AAEF,MAAM,aAAa,GAAG,GAAG,EAAE;IACvB,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,gBAAQ,EAAO,CAAC;IAC1C,MAAM,OAAO,GAAG;QACZ,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE;QACxD,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE;QACtD,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE;QAC1D,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE;QAClD,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE;QACrD,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE;KACvD,CAAC;IAEF,OAAO,CACH,kBAAC,oBAAI,CAAC,MAAM,IACR,KAAK,EAAC,GAAG,EACT,IAAI,QACJ,OAAO,QACP,KAAK,EAAC,8BAA8B,EACpC,WAAW,EAAC,gBAAgB,EAC5B,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,EACjD,KAAK,EAAE,KAAK,WACd,CACL,CAAC;AACN,CAAC,CAAC;AAEK,MAAM,mBAAmB,GAAO,GAAG,EAAE,CAAC,CACzC,yCAAK,KAAK,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,gBAC1B,kBAAC,iBAAS,IACN,UAAU,EAAC,MAAM,EACjB,OAAO,EAAE;YACL;gBACI,EAAE,EAAE,CAAC;gBACL,KAAK,EAAE,SAAS;gBAChB,KAAK,EAAE,SAAS;gBAChB,IAAI,EAAE,KAAK;aACd;YACD;gBACI,EAAE,EAAE,CAAC;gBACL,KAAK,EAAE,SAAS;gBAChB,KAAK,EAAE,SAAS;gBAChB,IAAI,EAAE,MAAM;gBACZ,OAAO,EAAE,IAAI;aAChB;SACJ,EACD,YAAY,EAAE,YAAY,CAAC,MAAM,EACjC,OAAO,EAAE,YAAY,CAAC,OAAO,EAC7B,MAAM,EAAC,YAAY,EACnB,OAAO,EAAE;YACL,KAAK,EAAE,IAAI;YACX,MAAM,EAAE,IAAI;YACZ,WAAW,EAAE,YAAY;YACzB,oBAAoB,EAAE,KAAK;SAC9B,WACH,YACA,CACT,CAAC;AA9BW,QAAA,mBAAmB,uBA8B9B;AAEK,MAAM,gBAAgB,GAAO,GAAG,EAAE,CAAC,CACtC,uCACI,kBAAC,aAAa,aAAG,EACjB,kBAAC,iBAAS,IACN,UAAU,EAAC,MAAM,EACjB,OAAO,EAAE;gBACL;oBACI,EAAE,EAAE,CAAC;oBACL,KAAK,EAAE,SAAS;oBAChB,KAAK,EAAE,SAAS;oBAChB,IAAI,EAAE,KAAK;iBACd;gBACD;oBACI,EAAE,EAAE,CAAC;oBACL,KAAK,EAAE,SAAS;oBAChB,KAAK,EAAE,SAAS;oBAChB,IAAI,EAAE,MAAM;oBACZ,OAAO,EAAE,IAAI;iBAChB;aACJ,EACD,YAAY,EAAE,YAAY,CAAC,MAAM,EACjC,OAAO,EAAE,YAAY,CAAC,OAAO,EAC7B,OAAO,EAAE;gBACL,KAAK,EAAE,IAAI;gBACX,MAAM,EAAE,IAAI;gBACZ,WAAW,EAAE,YAAY;gBACzB,oBAAoB,EAAE,KAAK;aAC9B,WACH,YACA,CACT,CAAC;AA9BW,QAAA,gBAAgB,oBA8B3B"}
|
|
1
|
+
{"version":3,"file":"line-chart.stories.js","sourceRoot":"","sources":["../../../../src/components/charts/line-chart/line-chart.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"line-chart.store.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/stores/line-chart.store.ts"],"names":[],"mappings":"AAEA,OAAO,EACH,gBAAgB,EAGhB,eAAe,EACf,cAAc,EACd,mBAAmB,EACtB,MAAM,qBAAqB,CAAC;AAE7B,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;
|
|
1
|
+
{"version":3,"file":"line-chart.store.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/stores/line-chart.store.ts"],"names":[],"mappings":"AAEA,OAAO,EACH,gBAAgB,EAGhB,eAAe,EACf,cAAc,EACd,mBAAmB,EACtB,MAAM,qBAAqB,CAAC;AAE7B,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAsEhF,qBACa,cAAc;IACX,MAAM,UAAS;IACf,OAAO,EAAE,gBAAgB,CAAoB;IAC7C,OAAO,EAAE,WAAW,EAAE,CAAM;IAC5B,OAAO,EAAE,eAAe,EAAE,CAAM;IAChC,UAAU,EAAE,mBAAmB,CAAS;IAExC,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,KAAK,CAAC,EAAE,mBAAmB,CAAC;IAE5B,YAAY,SAAM;;IAMtB,IAAI,UAAW,cAAc,UAsCnC;IAEM,eAAe,UAAW,MAAM,aAAa,OAAO,UAM1D;CACL"}
|
|
@@ -14,15 +14,29 @@ const react_ioc_1 = require("@servicetitan/react-ioc");
|
|
|
14
14
|
const mobx_1 = require("mobx");
|
|
15
15
|
const const_1 = require("../utils/const");
|
|
16
16
|
const formatters_1 = require("../utils/formatters");
|
|
17
|
-
const getSideMetricsSettings = (
|
|
17
|
+
const getSideMetricsSettings = (metrics, values, range, title, format) => {
|
|
18
|
+
var _a;
|
|
18
19
|
let maxRange = range !== null && range !== void 0 ? range : 0;
|
|
20
|
+
const lineBarMetricIDs = metrics
|
|
21
|
+
.filter(m => m.type === 'line' || m.type === 'bar')
|
|
22
|
+
.map(m => m.id);
|
|
23
|
+
const stackedBarMetricIDs = metrics.filter(m => m.type === 'stacked-bar').map(m => m.id);
|
|
19
24
|
if (!maxRange) {
|
|
20
|
-
maxRange = values.reduce((sum, metricValues) =>
|
|
25
|
+
maxRange = values.reduce((sum, metricValues) => lineBarMetricIDs.includes(metricValues.metricId)
|
|
21
26
|
? Math.max(sum, metricValues.values.reduce((acc, v) => Math.max(acc, v), 0))
|
|
22
27
|
: sum, 0);
|
|
23
28
|
}
|
|
29
|
+
if (stackedBarMetricIDs.length) {
|
|
30
|
+
const stackChartMetricValues = values
|
|
31
|
+
.filter(metricValues => stackedBarMetricIDs.includes(metricValues.metricId))
|
|
32
|
+
.map(metric => metric.values);
|
|
33
|
+
const summedStackedMetrics = (_a = stackChartMetricValues[0]) === null || _a === void 0 ? void 0 : _a.map((value, i) => stackChartMetricValues.reduce((sum, metricValues) => sum + metricValues[i], 0));
|
|
34
|
+
if (summedStackedMetrics === null || summedStackedMetrics === void 0 ? void 0 : summedStackedMetrics.length) {
|
|
35
|
+
maxRange = Math.max(...summedStackedMetrics, maxRange);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
24
38
|
if (!maxRange) {
|
|
25
|
-
if (!
|
|
39
|
+
if (!lineBarMetricIDs.length && !stackedBarMetricIDs.length) {
|
|
26
40
|
return undefined;
|
|
27
41
|
}
|
|
28
42
|
maxRange = 10;
|
|
@@ -102,8 +116,8 @@ let LineChartStore = class LineChartStore {
|
|
|
102
116
|
const mv = props.metricValues.find(mv => mv.metricId === m.id);
|
|
103
117
|
return Object.assign(Object.assign({}, m), { isRight: !!m.isRight, type: (_a = m.type) !== null && _a !== void 0 ? _a : 'line', opts: (_b = m.opts) !== null && _b !== void 0 ? _b : {}, values: (_c = mv === null || mv === void 0 ? void 0 : mv.values) !== null && _c !== void 0 ? _c : [], valuesOpts: mv === null || mv === void 0 ? void 0 : mv.opts });
|
|
104
118
|
});
|
|
105
|
-
this.left = getSideMetricsSettings(this.metrics.filter(m => !m.isRight)
|
|
106
|
-
this.right = getSideMetricsSettings(this.metrics.filter(m => m.isRight)
|
|
119
|
+
this.left = getSideMetricsSettings(this.metrics.filter(m => !m.isRight), props.metricValues, props.maxRange, props.titleY, this.display.yLeftFormat);
|
|
120
|
+
this.right = getSideMetricsSettings(this.metrics.filter(m => m.isRight), props.metricValues, props.maxRangeRight, props.titleYRight, this.display.yRightFormat);
|
|
107
121
|
this.resolution = props.resolution;
|
|
108
122
|
this.periods = props.periods || [];
|
|
109
123
|
this.hoveredIndex = -1;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"line-chart.store.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/stores/line-chart.store.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,uDAAqD;AACrD,+BAA0D;AAS1D,0CAAgD;AAEhD,oDAAmD;AAEnD,MAAM,sBAAsB,GAAG,CAC3B,
|
|
1
|
+
{"version":3,"file":"line-chart.store.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/stores/line-chart.store.ts"],"names":[],"mappings":"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"}
|
|
@@ -65,7 +65,7 @@ let SvgStore = class SvgStore {
|
|
|
65
65
|
value: (length, metrics, maxValueLeft, maxValueRight) => {
|
|
66
66
|
this.length = length || 1;
|
|
67
67
|
this.key = Date.now();
|
|
68
|
-
const hasBars = !!metrics.filter(m => m.type === 'bar').length;
|
|
68
|
+
const hasBars = !!metrics.filter(m => m.type === 'bar' || m.type === 'stacked-bar').length;
|
|
69
69
|
if (hasBars) {
|
|
70
70
|
this.fullBarWidth = 100 / this.length;
|
|
71
71
|
this.xOffset = this.fullBarWidth / 2;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"svg.store.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/stores/svg.store.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,uDAAqD;AACrD,+BAA0D;AAG1D,MAAM,gBAAgB,GAAG,GAAG,CAAC;AAC7B,MAAM,WAAW,GAAG,CAAC,CAAC;AAGtB,IAAa,QAAQ,GAArB,MAAa,QAAQ;IAUjB;QATY;;;;mBAAM,CAAC;WAAC;QACR;;;;mBAAS,CAAC;WAAC;QACX;;;;mBAAU,CAAC;WAAC;QACZ;;;;mBAAW,CAAC;WAAC;QAEzB;;;;mBAAuB,CAAC;WAAC;QACzB;;;;mBAAuB,CAAC;WAAC;QACzB;;;;mBAAwB,CAAC;WAAC;QAMlB;;;;mBAAO,CACX,MAAc,EACd,OAAsB,EACtB,YAAoB,EACpB,aAAqB,EACvB,EAAE;gBACA,IAAI,CAAC,MAAM,GAAG,MAAM,IAAI,CAAC,CAAC;gBAC1B,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;gBAEtB,MAAM,OAAO,GAAG,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,KAAK,CAAC,CAAC,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"svg.store.js","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/stores/svg.store.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
export declare type LineChartResolution = 'hour' | 'day' | 'week' | 'month';
|
|
3
|
-
export declare type LineChartMetricType = 'line' | 'bar';
|
|
3
|
+
export declare type LineChartMetricType = 'line' | 'bar' | 'stacked-bar';
|
|
4
4
|
export declare type LineChartMetricsTitlePosition = 'top' | 'top-right' | 'bottom';
|
|
5
5
|
export interface LineChartMetricOpts {
|
|
6
6
|
dashed?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/utils/interfaces.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,oBAAY,mBAAmB,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;AACpE,oBAAY,mBAAmB,GAAG,MAAM,GAAG,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../../../src/components/charts/line-chart/utils/interfaces.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,oBAAY,mBAAmB,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;AACpE,oBAAY,mBAAmB,GAAG,MAAM,GAAG,KAAK,GAAG,aAAa,CAAC;AACjE,oBAAY,6BAA6B,GAAG,KAAK,GAAG,WAAW,GAAG,QAAQ,CAAC;AAE3E,MAAM,WAAW,mBAAmB;IAChC,MAAM,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,eAAe;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,IAAI,CAAC,EAAE,mBAAmB,CAAC;CAC9B;AAED,MAAM,WAAW,eAAe;IAC5B,IAAI,EAAE,IAAI,CAAC;IACX,EAAE,CAAC,EAAE,IAAI,CAAC;IACV,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,oBAAY,wBAAwB,GAC9B,SAAS,GACT;IACI,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAER,MAAM,WAAW,qBAAqB;IAClC,QAAQ,EAAE,MAAM,CAAC;IACjB,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,IAAI,CAAC,EAAE,wBAAwB,EAAE,CAAC;CACrC;AAED,MAAM,WAAW,aAAa;IAC1B,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,YAAY,EAAE,qBAAqB,EAAE,CAAC;IACtC,UAAU,EAAE,mBAAmB,CAAC;CACnC;AAED,oBAAY,kCAAkC,GAAG,QAAQ,GAAG,OAAO,GAAG,YAAY,CAAC;AACnF,oBAAY,8BAA8B,GAAG,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC;AACrE,oBAAY,2BAA2B,GACjC,8BAA8B,GAC9B,kCAAkC,CAAC;AAEzC,MAAM,WAAW,gBAAgB;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,OAAO,CAAC;IACf,KAAK,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,2BAA2B,CAAC;IAC1C,YAAY,CAAC,EAAE,2BAA2B,CAAC;IAC3C,oBAAoB,CAAC,EAAE,6BAA6B,CAAC;IACrD,iBAAiB,CAAC,EAAE,2BAA2B,CAAC;IAChD,kBAAkB,CAAC,EAAE,2BAA2B,CAAC;CACpD;AAED,MAAM,WAAW,cAAe,SAAQ,aAAa;IACjD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,OAAO,EAAE,eAAe,EAAE,CAAC;IAC3B,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,OAAO,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,MAAM,WAAW,kBAAmB,SAAQ,cAAc;IACtD,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;CAC1B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stat-card.d.ts","sourceRoot":"","sources":["../../../src/components/stat/stat-card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAEH,mBAAmB,EAItB,MAAM,6BAA6B,CAAC;AAErC,OAAO,EAAe,eAAe,EAAE,MAAM,wBAAwB,CAAC;AA0BtE,UAAU,aAAa;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC;IACnC,MAAM,EAAE,eAAe,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,
|
|
1
|
+
{"version":3,"file":"stat-card.d.ts","sourceRoot":"","sources":["../../../src/components/stat/stat-card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAEH,mBAAmB,EAItB,MAAM,6BAA6B,CAAC;AAErC,OAAO,EAAe,eAAe,EAAE,MAAM,wBAAwB,CAAC;AA0BtE,UAAU,aAAa;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,mBAAmB,CAAC,MAAM,CAAC,CAAC;IACnC,MAAM,EAAE,eAAe,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAyC5C,CAAC;AAEF,MAAM,WAAW,aAAa;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA8C5C,CAAC"}
|
|
@@ -46,7 +46,8 @@ const formatDifferencePercentage = (value, isPlus) => {
|
|
|
46
46
|
const StatDiff = ({ value, prev, size, format, inverted, neutral, className, }) => {
|
|
47
47
|
const percents = format === 'percent';
|
|
48
48
|
const [absDiff, diffPercent, isIncrease] = calculateDiff(value !== null && value !== void 0 ? value : 0, prev !== null && prev !== void 0 ? prev : 0, percents);
|
|
49
|
-
|
|
49
|
+
const diff = absDiff === 0 ? '' : isIncrease ? '▲ ' : '▼ ';
|
|
50
|
+
let text = '';
|
|
50
51
|
if (percents) {
|
|
51
52
|
text += formatDifferencePercentage(absDiff, isIncrease);
|
|
52
53
|
}
|
|
@@ -56,11 +57,11 @@ const StatDiff = ({ value, prev, size, format, inverted, neutral, className, })
|
|
|
56
57
|
text += ` (${formatDifferencePercentage(diffPercent, isIncrease)})`;
|
|
57
58
|
}
|
|
58
59
|
}
|
|
59
|
-
return (jsx_runtime_1.
|
|
60
|
+
return (jsx_runtime_1.jsxs(design_system_1.BodyText, Object.assign({ className: classnames_1.default(Styles.statDiff, {
|
|
60
61
|
'c-red-500': !neutral && (inverted ? isIncrease : !isIncrease),
|
|
61
62
|
'c-green-500': !neutral && (inverted ? !isIncrease : isIncrease),
|
|
62
63
|
'c-neutral-200': !!neutral,
|
|
63
|
-
}, className), size: size !== null && size !== void 0 ? size : 'small' }, { children: value === undefined ? '\u00A0' : text }), void 0));
|
|
64
|
+
}, className), size: size !== null && size !== void 0 ? size : 'small' }, { children: [jsx_runtime_1.jsx("span", { children: diff }, void 0), value === undefined ? '\u00A0' : text] }), void 0));
|
|
64
65
|
};
|
|
65
66
|
exports.StatDiff = StatDiff;
|
|
66
67
|
const StatCard = ({ title, description, value, percent, money, rate, prev, clean, inverted, neutral, fill, valueOnly, className, }) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stat-card.js","sourceRoot":"","sources":["../../../src/components/stat/stat-card.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AACA,4DAAoC;AACpC,+DAMqC;AACrC,gEAAkD;AAClD,uDAAsE;AAEtE,MAAM,aAAa,GAAG,CAClB,KAAa,EACb,IAAY,EACZ,QAAkB,EACO,EAAE;IAC3B,MAAM,IAAI,GAAG,CAAC,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACnD,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IAC/B,MAAM,WAAW,GAAG,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,OAAO,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,OAAO,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;IAEnF,OAAO,CAAC,OAAO,EAAE,WAAW,EAAE,IAAI,IAAI,CAAC,CAAC,CAAC;AAC7C,CAAC,CAAC;AAEF,MAAM,gBAAgB,GAAG,CAAC,KAAa,EAAE,MAAe,EAAE,MAAuB,EAAU,EAAE;IACzF,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,wBAAW,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;AAC7D,CAAC,CAAC;AAEF,MAAM,0BAA0B,GAAG,CAAC,KAAa,EAAE,MAAe,EAAU,EAAE;IAC1E,IAAI,CAAC,KAAK,EAAE;QACR,OAAO,EAAE,CAAC;KACb;IAED,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,wBAAW,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC;AACpE,CAAC,CAAC;AAYK,MAAM,QAAQ,GAA4B,CAAC,EAC9C,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,OAAO,EACP,SAAS,GACZ,EAAE,EAAE;IACD,MAAM,QAAQ,GAAG,MAAM,KAAK,SAAS,CAAC;IACtC,MAAM,CAAC,OAAO,EAAE,WAAW,EAAE,UAAU,CAAC,GAAG,aAAa,CAAC,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,CAAC,EAAE,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,CAAC,EAAE,QAAQ,CAAC,CAAC;IAC1F,
|
|
1
|
+
{"version":3,"file":"stat-card.js","sourceRoot":"","sources":["../../../src/components/stat/stat-card.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stat-extended-card.d.ts","sourceRoot":"","sources":["../../../src/components/stat/stat-extended-card.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"stat-extended-card.d.ts","sourceRoot":"","sources":["../../../src/components/stat/stat-extended-card.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAOlC,MAAM,WAAW,qBAAqB;IAClC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AACD,eAAO,MAAM,gBAAgB,EAAE,EAAE,CAAC,qBAAqB,CA4DtD,CAAC"}
|
|
@@ -1,4 +1,23 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
|
5
|
+
}) : (function(o, m, k, k2) {
|
|
6
|
+
if (k2 === undefined) k2 = k;
|
|
7
|
+
o[k2] = m[k];
|
|
8
|
+
}));
|
|
9
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
10
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
11
|
+
}) : function(o, v) {
|
|
12
|
+
o["default"] = v;
|
|
13
|
+
});
|
|
14
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
15
|
+
if (mod && mod.__esModule) return mod;
|
|
16
|
+
var result = {};
|
|
17
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
18
|
+
__setModuleDefault(result, mod);
|
|
19
|
+
return result;
|
|
20
|
+
};
|
|
2
21
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
22
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
23
|
};
|
|
@@ -9,11 +28,12 @@ const classnames_1 = __importDefault(require("classnames"));
|
|
|
9
28
|
const design_system_1 = require("@servicetitan/design-system");
|
|
10
29
|
const formatters_1 = require("../../utils/formatters");
|
|
11
30
|
const stat_card_1 = require("./stat-card");
|
|
31
|
+
const Styles = __importStar(require("./stat-card.module.less"));
|
|
12
32
|
const StatExtendedCard = ({ title, title2, description, value, goal, prev, percent, money, rate, inverted, neutral, fill, className, }) => {
|
|
13
33
|
const format = money ? 'money' : percent ? 'percent' : rate ? 'rate' : 'number';
|
|
14
34
|
return (jsx_runtime_1.jsxs("div", Object.assign({ className: classnames_1.default('p-3 bg-white border border-radius-2', {
|
|
15
35
|
'flex-grow-1 flex-basis-0': fill,
|
|
16
|
-
}, className) }, { children: [jsx_runtime_1.jsxs(design_system_1.Stack, { children: [jsx_runtime_1.jsx(design_system_1.Headline, Object.assign({ size: "small" }, { children: title }), void 0), !!description && (jsx_runtime_1.jsx(design_system_1.Tooltip, Object.assign({ text: description }, { children: jsx_runtime_1.jsx(design_system_1.Icon, { name: "info", size: 18, className: "c-neutral-80 m-l-half" }, void 0) }), void 0))] }, void 0), jsx_runtime_1.jsx(design_system_1.Eyebrow, Object.assign({ size: "small", className: "m-t-
|
|
36
|
+
}, className) }, { children: [jsx_runtime_1.jsxs(design_system_1.Stack, { children: [jsx_runtime_1.jsx(design_system_1.Headline, Object.assign({ size: "small" }, { children: title }), void 0), !!description && (jsx_runtime_1.jsx(design_system_1.Tooltip, Object.assign({ text: description }, { children: jsx_runtime_1.jsx(design_system_1.Icon, { name: "info", size: 18, className: "c-neutral-80 m-l-half" }, void 0) }), void 0))] }, void 0), jsx_runtime_1.jsx(design_system_1.Eyebrow, Object.assign({ size: "small", className: "m-t-2 c-black" }, { children: title2 }), void 0), jsx_runtime_1.jsx(design_system_1.Stack, Object.assign({ justifyContent: "space-between", className: "m-t-half" }, { children: jsx_runtime_1.jsxs(design_system_1.Stack, Object.assign({ alignItems: "flex-end", className: "flex-grow-1 flex-basis-0" }, { children: [jsx_runtime_1.jsx(design_system_1.Headline, Object.assign({ className: "m-b-0-i m-r-half fw-normal-i", size: "xlarge" }, { children: formatters_1.formatValue(value, format) }), void 0), goal !== undefined ? (jsx_runtime_1.jsxs(design_system_1.BodyText, Object.assign({ subdued: true }, { children: ["/ ", formatters_1.formatValue(goal, format), " (Goal)"] }), void 0)) : prev !== undefined ? (jsx_runtime_1.jsx(stat_card_1.StatDiff, { value: value, prev: prev, format: format, inverted: inverted, neutral: neutral, className: classnames_1.default(Styles.statExtendedDiff, 'm-l-1') }, void 0)) : undefined] }), void 0) }), void 0)] }), void 0));
|
|
17
37
|
};
|
|
18
38
|
exports.StatExtendedCard = StatExtendedCard;
|
|
19
39
|
//# sourceMappingURL=stat-extended-card.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stat-extended-card.js","sourceRoot":"","sources":["../../../src/components/stat/stat-extended-card.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"stat-extended-card.js","sourceRoot":"","sources":["../../../src/components/stat/stat-extended-card.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AACA,4DAAoC;AACpC,+DAAgG;AAChG,uDAAqD;AACrD,2CAAuC;AACvC,gEAAkD;AAiB3C,MAAM,gBAAgB,GAA8B,CAAC,EACxD,KAAK,EACL,MAAM,EACN,WAAW,EACX,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,SAAS,GACZ,EAAE,EAAE;IACD,MAAM,MAAM,GAAG,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC;IAEhF,OAAO,CACH,0CACI,SAAS,EAAE,oBAAU,CACjB,qCAAqC,EACrC;YACI,0BAA0B,EAAE,IAAI;SACnC,EACD,SAAS,CACZ,iBAED,mBAAC,qBAAK,eACF,kBAAC,wBAAQ,kBAAC,IAAI,EAAC,OAAO,gBAAE,KAAK,YAAY,EACxC,CAAC,CAAC,WAAW,IAAI,CACd,kBAAC,uBAAO,kBAAC,IAAI,EAAE,WAAW,gBACtB,kBAAC,oBAAI,IAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAE,EAAE,EAAE,SAAS,EAAC,uBAAuB,WAAG,YAC1D,CACb,YACG,EACR,kBAAC,uBAAO,kBAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,eAAe,gBAC1C,MAAM,YACD,EAEV,kBAAC,qBAAK,kBAAC,cAAc,EAAC,eAAe,EAAC,SAAS,EAAC,UAAU,gBACtD,mBAAC,qBAAK,kBAAC,UAAU,EAAC,UAAU,EAAC,SAAS,EAAC,0BAA0B,iBAC7D,kBAAC,wBAAQ,kBAAC,SAAS,EAAC,8BAA8B,EAAC,IAAI,EAAC,QAAQ,gBAC3D,wBAAW,CAAC,KAAK,EAAE,MAAM,CAAC,YACpB,EACV,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CAClB,mBAAC,wBAAQ,kBAAC,OAAO,6BAAI,wBAAW,CAAC,IAAI,EAAE,MAAM,CAAC,wBAAmB,CACpE,CAAC,CAAC,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,CACrB,kBAAC,oBAAQ,IACL,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,oBAAU,CAAC,MAAM,CAAC,gBAAgB,EAAE,OAAO,CAAC,WACzD,CACL,CAAC,CAAC,CAAC,SAAS,aACT,YACJ,aACN,CACT,CAAC;AACN,CAAC,CAAC;AA5DW,QAAA,gBAAgB,oBA4D3B"}
|
package/dist/utils/formatters.js
CHANGED
|
@@ -25,7 +25,7 @@ const formatPercentValue = (value) => {
|
|
|
25
25
|
if (!value) {
|
|
26
26
|
return '0';
|
|
27
27
|
}
|
|
28
|
-
const valueMain = value ? Math.abs(Math.
|
|
28
|
+
const valueMain = value ? Math.abs(Math.round(value)) : 0;
|
|
29
29
|
if (valueMain > 0) {
|
|
30
30
|
return accounting.formatNumber(valueMain, 0);
|
|
31
31
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@servicetitan/marketing-ui",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.7.0",
|
|
4
4
|
"description": "Marketing UI component and utils",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -50,5 +50,5 @@
|
|
|
50
50
|
"less": true,
|
|
51
51
|
"webpack": false
|
|
52
52
|
},
|
|
53
|
-
"gitHead": "
|
|
53
|
+
"gitHead": "bc6ae4e18c6ad7a6d9d2be761a36cf8606bb9b5e"
|
|
54
54
|
}
|
|
@@ -91,11 +91,14 @@ export const Body: React.FC<{ classNameTitle?: string }> = provide({ singletons:
|
|
|
91
91
|
left={left?.width ?? 0}
|
|
92
92
|
right={right?.width ?? 0}
|
|
93
93
|
labelsMerged={periods.length !== labels.length}
|
|
94
|
-
hasBars={
|
|
94
|
+
hasBars={
|
|
95
|
+
!!metrics.filter(m => m.type === 'bar' || m.type === 'stacked-bar')
|
|
96
|
+
.length
|
|
97
|
+
}
|
|
95
98
|
/>
|
|
96
99
|
)}
|
|
97
100
|
{display.metricsTitlePosition === 'bottom' && (
|
|
98
|
-
<Stack direction="row" justifyContent="center" className="p-
|
|
101
|
+
<Stack direction="row" justifyContent="center" className="p-3">
|
|
99
102
|
<MetricsTitle metrics={metrics} />
|
|
100
103
|
</Stack>
|
|
101
104
|
)}
|
|
@@ -1,10 +1,19 @@
|
|
|
1
1
|
@import (reference) '~@servicetitan/tokens/dist/tokens.less';
|
|
2
2
|
|
|
3
3
|
.color-tag {
|
|
4
|
-
width: @spacing-
|
|
5
|
-
height: @spacing-2;
|
|
4
|
+
width: @spacing-3;
|
|
6
5
|
margin-right: @spacing-1;
|
|
7
|
-
|
|
6
|
+
height: 3px;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.color-tag-dashed {
|
|
10
|
+
height: 0;
|
|
11
|
+
border-top-style: dashed;
|
|
12
|
+
border-top-width: 3px;
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
.color-tag-small {
|
|
16
|
+
width: @spacing-2;
|
|
8
17
|
}
|
|
9
18
|
|
|
10
19
|
.x-axis-label {
|
|
@@ -10,11 +10,27 @@ interface ColorTagProps {
|
|
|
10
10
|
color: string;
|
|
11
11
|
className?: string;
|
|
12
12
|
small?: boolean;
|
|
13
|
+
dashed?: boolean;
|
|
13
14
|
}
|
|
14
15
|
|
|
15
|
-
export const ColorTag: React.FC<ColorTagProps> = ({ label, color, className, small }) => (
|
|
16
|
+
export const ColorTag: React.FC<ColorTagProps> = ({ label, color, className, small, dashed }) => (
|
|
16
17
|
<Stack alignItems="center" className={className}>
|
|
17
|
-
<div
|
|
18
|
+
<div
|
|
19
|
+
style={
|
|
20
|
+
dashed
|
|
21
|
+
? {
|
|
22
|
+
borderColor: color,
|
|
23
|
+
}
|
|
24
|
+
: {
|
|
25
|
+
backgroundColor: color,
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
className={classNames(
|
|
29
|
+
Styles.colorTag,
|
|
30
|
+
dashed && Styles.colorTagDashed,
|
|
31
|
+
small && Styles.colorTagSmall
|
|
32
|
+
)}
|
|
33
|
+
/>
|
|
18
34
|
<BodyText size={small ? 'xsmall' : 'small'}>{label}</BodyText>
|
|
19
35
|
</Stack>
|
|
20
36
|
);
|
|
@@ -26,7 +42,13 @@ interface MetricsTitleProps {
|
|
|
26
42
|
export const MetricsTitle: React.FC<MetricsTitleProps> = ({ metrics }) => (
|
|
27
43
|
<Stack alignItems="center">
|
|
28
44
|
{metrics.map(m => (
|
|
29
|
-
<ColorTag
|
|
45
|
+
<ColorTag
|
|
46
|
+
key={m.id}
|
|
47
|
+
label={m.title}
|
|
48
|
+
color={m.color}
|
|
49
|
+
dashed={m.opts?.dashed}
|
|
50
|
+
className="m-r-4"
|
|
51
|
+
/>
|
|
30
52
|
))}
|
|
31
53
|
</Stack>
|
|
32
54
|
);
|
|
@@ -7,9 +7,10 @@ import { SvgStore } from '../stores/svg.store';
|
|
|
7
7
|
|
|
8
8
|
interface SvgBarsProps {
|
|
9
9
|
metrics: ChartMetric[];
|
|
10
|
+
isStackedBarChart?: boolean;
|
|
10
11
|
}
|
|
11
12
|
|
|
12
|
-
export const SvgBars: React.FC<SvgBarsProps> = observer(({ metrics }) => {
|
|
13
|
+
export const SvgBars: React.FC<SvgBarsProps> = observer(({ metrics, isStackedBarChart }) => {
|
|
13
14
|
const [store] = useDependencies(SvgStore);
|
|
14
15
|
const { fpx, fpy, barWidth, length } = store;
|
|
15
16
|
const barWidthHalf = barWidth / 2;
|
|
@@ -17,25 +18,42 @@ export const SvgBars: React.FC<SvgBarsProps> = observer(({ metrics }) => {
|
|
|
17
18
|
|
|
18
19
|
for (let i = 0; i < length; i++) {
|
|
19
20
|
const x = store.periodX(i);
|
|
20
|
-
const values = metrics
|
|
21
|
-
.
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
}))
|
|
26
|
-
.sort((a, b) => b.val - a.val);
|
|
21
|
+
const values = metrics.map(m => ({
|
|
22
|
+
id: m.id,
|
|
23
|
+
color: m.valuesOpts?.[i]?.color ?? m.color,
|
|
24
|
+
val: store.periodY(m, i),
|
|
25
|
+
}));
|
|
27
26
|
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
27
|
+
if (isStackedBarChart) {
|
|
28
|
+
let stackedBarHeight = values.reduce((sum, curr) => sum + curr.val, 0);
|
|
29
|
+
|
|
30
|
+
for (const value of values) {
|
|
31
|
+
paths.push(
|
|
32
|
+
<rect
|
|
33
|
+
key={keyVal(value.id, i)}
|
|
34
|
+
x={fpx(x - barWidthHalf)}
|
|
35
|
+
y={fpy(stackedBarHeight)}
|
|
36
|
+
width={fpx(barWidth)}
|
|
37
|
+
height={fpx(value.val)}
|
|
38
|
+
fill={value.color}
|
|
39
|
+
/>
|
|
40
|
+
);
|
|
41
|
+
stackedBarHeight -= value.val;
|
|
42
|
+
}
|
|
43
|
+
} else {
|
|
44
|
+
values.sort((a, b) => b.val - a.val);
|
|
45
|
+
for (const value of values) {
|
|
46
|
+
paths.push(
|
|
47
|
+
<rect
|
|
48
|
+
key={keyVal(value.id, i)}
|
|
49
|
+
x={fpx(x - barWidthHalf)}
|
|
50
|
+
y={fpy(value.val)}
|
|
51
|
+
width={fpx(barWidth)}
|
|
52
|
+
height={fpx(value.val)}
|
|
53
|
+
fill={value.color}
|
|
54
|
+
/>
|
|
55
|
+
);
|
|
56
|
+
}
|
|
39
57
|
}
|
|
40
58
|
}
|
|
41
59
|
|
|
@@ -42,6 +42,7 @@ interface SvgBodyProps {
|
|
|
42
42
|
export const SvgBody: React.FC<SvgBodyProps> = observer(({ horizontalGrid, metrics }) => {
|
|
43
43
|
const [{ key }] = useDependencies(SvgStore);
|
|
44
44
|
const barMetrics = metrics.filter(m => m.type === 'bar');
|
|
45
|
+
const stackedBarMetrics = metrics.filter(m => m.type === 'stacked-bar');
|
|
45
46
|
const lineMetrics = metrics.filter(m => m.type === 'line');
|
|
46
47
|
|
|
47
48
|
return (
|
|
@@ -53,6 +54,13 @@ export const SvgBody: React.FC<SvgBodyProps> = observer(({ horizontalGrid, metri
|
|
|
53
54
|
>
|
|
54
55
|
{horizontalGrid && <SvgGrid />}
|
|
55
56
|
{!!barMetrics.length && <SvgBars key={keyVal('bars', key)} metrics={barMetrics} />}
|
|
57
|
+
{!!stackedBarMetrics.length && (
|
|
58
|
+
<SvgBars
|
|
59
|
+
key={keyVal('stacked-bars', key)}
|
|
60
|
+
metrics={stackedBarMetrics}
|
|
61
|
+
isStackedBarChart
|
|
62
|
+
/>
|
|
63
|
+
)}
|
|
56
64
|
{!!lineMetrics.length && <SvgLines key={keyVal('lines', key)} metrics={lineMetrics} />}
|
|
57
65
|
</svg>
|
|
58
66
|
);
|
|
@@ -34,6 +34,36 @@ const dailyValues = (() => {
|
|
|
34
34
|
};
|
|
35
35
|
})();
|
|
36
36
|
|
|
37
|
+
const stackedBarChartValues = (() => {
|
|
38
|
+
const periods: LineChartPeriod[] = [];
|
|
39
|
+
const days = new Date(2021, 7, 0).getDate();
|
|
40
|
+
|
|
41
|
+
for (let i = 1; i <= days; i++) {
|
|
42
|
+
periods.push({
|
|
43
|
+
from: new Date(2021, 7, i),
|
|
44
|
+
to: new Date(2021, 7, i + 1),
|
|
45
|
+
});
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
return {
|
|
49
|
+
periods,
|
|
50
|
+
values: [
|
|
51
|
+
{
|
|
52
|
+
metricId: 2,
|
|
53
|
+
values: periods.map((_, index) => 15 + (index % 5) * 15),
|
|
54
|
+
},
|
|
55
|
+
{
|
|
56
|
+
metricId: 3,
|
|
57
|
+
values: periods.map((_, index) => 10 + (index % 5) * 10),
|
|
58
|
+
},
|
|
59
|
+
{
|
|
60
|
+
metricId: 4,
|
|
61
|
+
values: periods.map((_, index) => 5 + (index % 5) * 5),
|
|
62
|
+
},
|
|
63
|
+
],
|
|
64
|
+
};
|
|
65
|
+
})();
|
|
66
|
+
|
|
37
67
|
const weeklyValues = (() => {
|
|
38
68
|
const periods: LineChartPeriod[] = [];
|
|
39
69
|
|
|
@@ -88,6 +118,42 @@ export const lineChartDailyBottomTitles = () => (
|
|
|
88
118
|
/>
|
|
89
119
|
);
|
|
90
120
|
|
|
121
|
+
export const stackedBarChartDailyBottomTitles = () => {
|
|
122
|
+
return (
|
|
123
|
+
<LineChart
|
|
124
|
+
resolution="day"
|
|
125
|
+
metrics={[
|
|
126
|
+
{
|
|
127
|
+
id: 2,
|
|
128
|
+
title: 'Lead Calls',
|
|
129
|
+
type: 'stacked-bar',
|
|
130
|
+
color: '#D0D8DD',
|
|
131
|
+
},
|
|
132
|
+
{
|
|
133
|
+
id: 3,
|
|
134
|
+
title: 'Online Bookings',
|
|
135
|
+
type: 'stacked-bar',
|
|
136
|
+
color: '#08BFDF',
|
|
137
|
+
},
|
|
138
|
+
{
|
|
139
|
+
id: 4,
|
|
140
|
+
title: 'Manual Calls',
|
|
141
|
+
type: 'stacked-bar',
|
|
142
|
+
color: '#1FBC70',
|
|
143
|
+
},
|
|
144
|
+
]}
|
|
145
|
+
metricValues={stackedBarChartValues.values}
|
|
146
|
+
periods={dailyValues.periods}
|
|
147
|
+
titleY="Left title"
|
|
148
|
+
display={{
|
|
149
|
+
yLeft: false,
|
|
150
|
+
yLeftFormat: 'number',
|
|
151
|
+
metricsTitlePosition: 'bottom',
|
|
152
|
+
}}
|
|
153
|
+
/>
|
|
154
|
+
);
|
|
155
|
+
};
|
|
156
|
+
|
|
91
157
|
export const lineChartWeekly = () => (
|
|
92
158
|
<LineChart
|
|
93
159
|
resolution="week"
|
|
@@ -13,18 +13,22 @@ import { ChartMetric, SideMetricsSettings } from '../utils/internal-interfaces';
|
|
|
13
13
|
import { getFormatter } from '../utils/formatters';
|
|
14
14
|
|
|
15
15
|
const getSideMetricsSettings = (
|
|
16
|
-
|
|
16
|
+
metrics: ChartMetric[],
|
|
17
17
|
values: LineChartMetricValues[],
|
|
18
18
|
range?: number,
|
|
19
19
|
title?: string,
|
|
20
20
|
format?: LineChartDisplayValueFormat
|
|
21
21
|
): SideMetricsSettings | undefined => {
|
|
22
22
|
let maxRange = range ?? 0;
|
|
23
|
+
const lineBarMetricIDs = metrics
|
|
24
|
+
.filter(m => m.type === 'line' || m.type === 'bar')
|
|
25
|
+
.map(m => m.id);
|
|
26
|
+
const stackedBarMetricIDs = metrics.filter(m => m.type === 'stacked-bar').map(m => m.id);
|
|
23
27
|
|
|
24
28
|
if (!maxRange) {
|
|
25
29
|
maxRange = values.reduce(
|
|
26
30
|
(sum, metricValues) =>
|
|
27
|
-
|
|
31
|
+
lineBarMetricIDs.includes(metricValues.metricId)
|
|
28
32
|
? Math.max(
|
|
29
33
|
sum,
|
|
30
34
|
metricValues.values.reduce((acc, v) => Math.max(acc, v), 0)
|
|
@@ -34,8 +38,22 @@ const getSideMetricsSettings = (
|
|
|
34
38
|
);
|
|
35
39
|
}
|
|
36
40
|
|
|
41
|
+
if (stackedBarMetricIDs.length) {
|
|
42
|
+
const stackChartMetricValues = values
|
|
43
|
+
.filter(metricValues => stackedBarMetricIDs.includes(metricValues.metricId))
|
|
44
|
+
.map(metric => metric.values);
|
|
45
|
+
|
|
46
|
+
const summedStackedMetrics = stackChartMetricValues[0]?.map((value, i) =>
|
|
47
|
+
stackChartMetricValues.reduce((sum, metricValues) => sum + metricValues[i], 0)
|
|
48
|
+
);
|
|
49
|
+
|
|
50
|
+
if (summedStackedMetrics?.length) {
|
|
51
|
+
maxRange = Math.max(...summedStackedMetrics, maxRange);
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
|
|
37
55
|
if (!maxRange) {
|
|
38
|
-
if (!
|
|
56
|
+
if (!lineBarMetricIDs.length && !stackedBarMetricIDs.length) {
|
|
39
57
|
return undefined;
|
|
40
58
|
}
|
|
41
59
|
|
|
@@ -98,14 +116,14 @@ export class LineChartStore {
|
|
|
98
116
|
});
|
|
99
117
|
|
|
100
118
|
this.left = getSideMetricsSettings(
|
|
101
|
-
this.metrics.filter(m => !m.isRight)
|
|
119
|
+
this.metrics.filter(m => !m.isRight),
|
|
102
120
|
props.metricValues,
|
|
103
121
|
props.maxRange,
|
|
104
122
|
props.titleY,
|
|
105
123
|
this.display.yLeftFormat
|
|
106
124
|
);
|
|
107
125
|
this.right = getSideMetricsSettings(
|
|
108
|
-
this.metrics.filter(m => m.isRight)
|
|
126
|
+
this.metrics.filter(m => m.isRight),
|
|
109
127
|
props.metricValues,
|
|
110
128
|
props.maxRangeRight,
|
|
111
129
|
props.titleYRight,
|
|
@@ -29,7 +29,7 @@ export class SvgStore {
|
|
|
29
29
|
this.length = length || 1;
|
|
30
30
|
this.key = Date.now();
|
|
31
31
|
|
|
32
|
-
const hasBars = !!metrics.filter(m => m.type === 'bar').length;
|
|
32
|
+
const hasBars = !!metrics.filter(m => m.type === 'bar' || m.type === 'stacked-bar').length;
|
|
33
33
|
|
|
34
34
|
if (hasBars) {
|
|
35
35
|
this.fullBarWidth = 100 / this.length;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
|
|
3
3
|
export type LineChartResolution = 'hour' | 'day' | 'week' | 'month';
|
|
4
|
-
export type LineChartMetricType = 'line' | 'bar';
|
|
4
|
+
export type LineChartMetricType = 'line' | 'bar' | 'stacked-bar';
|
|
5
5
|
export type LineChartMetricsTitlePosition = 'top' | 'top-right' | 'bottom';
|
|
6
6
|
|
|
7
7
|
export interface LineChartMetricOpts {
|
|
@@ -55,7 +55,8 @@ export const StatDiff: React.FC<StatDiffProps> = ({
|
|
|
55
55
|
}) => {
|
|
56
56
|
const percents = format === 'percent';
|
|
57
57
|
const [absDiff, diffPercent, isIncrease] = calculateDiff(value ?? 0, prev ?? 0, percents);
|
|
58
|
-
|
|
58
|
+
const diff = absDiff === 0 ? '' : isIncrease ? '▲ ' : '▼ ';
|
|
59
|
+
let text = '';
|
|
59
60
|
|
|
60
61
|
if (percents) {
|
|
61
62
|
text += formatDifferencePercentage(absDiff, isIncrease);
|
|
@@ -80,6 +81,7 @@ export const StatDiff: React.FC<StatDiffProps> = ({
|
|
|
80
81
|
)}
|
|
81
82
|
size={size ?? 'small'}
|
|
82
83
|
>
|
|
84
|
+
<span>{diff}</span>
|
|
83
85
|
{value === undefined ? '\u00A0' : text}
|
|
84
86
|
</BodyText>
|
|
85
87
|
);
|
|
@@ -3,6 +3,7 @@ import classNames from 'classnames';
|
|
|
3
3
|
import { BodyText, Icon, Headline, Eyebrow, Stack, Tooltip } from '@servicetitan/design-system';
|
|
4
4
|
import { formatValue } from '../../utils/formatters';
|
|
5
5
|
import { StatDiff } from './stat-card';
|
|
6
|
+
import * as Styles from './stat-card.module.less';
|
|
6
7
|
|
|
7
8
|
export interface StatExtendedCardProps {
|
|
8
9
|
title: string;
|
|
@@ -54,11 +55,11 @@ export const StatExtendedCard: FC<StatExtendedCardProps> = ({
|
|
|
54
55
|
</Tooltip>
|
|
55
56
|
)}
|
|
56
57
|
</Stack>
|
|
57
|
-
<Eyebrow size="small" className="m-t-
|
|
58
|
+
<Eyebrow size="small" className="m-t-2 c-black">
|
|
58
59
|
{title2}
|
|
59
60
|
</Eyebrow>
|
|
60
61
|
|
|
61
|
-
<Stack justifyContent="space-between">
|
|
62
|
+
<Stack justifyContent="space-between" className="m-t-half">
|
|
62
63
|
<Stack alignItems="flex-end" className="flex-grow-1 flex-basis-0">
|
|
63
64
|
<Headline className="m-b-0-i m-r-half fw-normal-i" size="xlarge">
|
|
64
65
|
{formatValue(value, format)}
|
|
@@ -72,7 +73,7 @@ export const StatExtendedCard: FC<StatExtendedCardProps> = ({
|
|
|
72
73
|
format={format}
|
|
73
74
|
inverted={inverted}
|
|
74
75
|
neutral={neutral}
|
|
75
|
-
className=
|
|
76
|
+
className={classNames(Styles.statExtendedDiff, 'm-l-1')}
|
|
76
77
|
/>
|
|
77
78
|
) : undefined}
|
|
78
79
|
</Stack>
|
package/src/utils/formatters.ts
CHANGED
|
@@ -7,7 +7,7 @@ const formatPercentValue = (value: number): string => {
|
|
|
7
7
|
return '0';
|
|
8
8
|
}
|
|
9
9
|
|
|
10
|
-
const valueMain = value ? Math.abs(Math.
|
|
10
|
+
const valueMain = value ? Math.abs(Math.round(value)) : 0;
|
|
11
11
|
|
|
12
12
|
if (valueMain > 0) {
|
|
13
13
|
return accounting.formatNumber(valueMain, 0);
|