@servicetitan/marketing-ui 5.9.0 → 5.11.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/ads/ads-stat.js +21 -10
- package/dist/components/ads/ads-stat.js.map +1 -1
- package/dist/components/charts/funnel-chart/components/funnel-chart.js +118 -6
- package/dist/components/charts/funnel-chart/components/funnel-chart.js.map +1 -1
- package/dist/components/charts/funnel-chart/components/funnel-chart.module.less.d.ts +9 -0
- package/dist/components/charts/funnel-chart/components/funnel-svg.js +62 -12
- package/dist/components/charts/funnel-chart/components/funnel-svg.js.map +1 -1
- package/dist/components/charts/funnel-chart/index.js +1 -0
- package/dist/components/charts/funnel-chart/index.js.map +1 -1
- package/dist/components/charts/funnel-chart/utils/const.js +1 -0
- package/dist/components/charts/funnel-chart/utils/const.js.map +1 -1
- package/dist/components/charts/funnel-chart/utils/interface.js +2 -1
- package/dist/components/charts/funnel-chart/utils/interface.js.map +1 -1
- package/dist/components/charts/line-chart/components/body.js +105 -16
- package/dist/components/charts/line-chart/components/body.js.map +1 -1
- package/dist/components/charts/line-chart/components/body.module.less.d.ts +4 -0
- package/dist/components/charts/line-chart/components/container.js +12 -4
- package/dist/components/charts/line-chart/components/container.js.map +1 -1
- package/dist/components/charts/line-chart/components/hover-popover.js +56 -13
- package/dist/components/charts/line-chart/components/hover-popover.js.map +1 -1
- package/dist/components/charts/line-chart/components/hover-popover.module.less.d.ts +5 -0
- package/dist/components/charts/line-chart/components/sidebar.js +35 -5
- package/dist/components/charts/line-chart/components/sidebar.js.map +1 -1
- package/dist/components/charts/line-chart/components/sidebar.module.less.d.ts +13 -0
- package/dist/components/charts/line-chart/components/stuff.js +73 -32
- package/dist/components/charts/line-chart/components/stuff.js.map +1 -1
- package/dist/components/charts/line-chart/components/stuff.module.less.d.ts +6 -0
- package/dist/components/charts/line-chart/components/svg-bars.js +58 -26
- package/dist/components/charts/line-chart/components/svg-bars.js.map +1 -1
- package/dist/components/charts/line-chart/components/svg-body.js +52 -11
- package/dist/components/charts/line-chart/components/svg-body.js.map +1 -1
- package/dist/components/charts/line-chart/components/svg-lines.js +46 -27
- package/dist/components/charts/line-chart/components/svg-lines.js.map +1 -1
- package/dist/components/charts/line-chart/components/svg.module.less.d.ts +5 -0
- package/dist/components/charts/line-chart/index.js +1 -0
- package/dist/components/charts/line-chart/index.js.map +1 -1
- package/dist/components/charts/line-chart/stores/line-chart.store.js +98 -137
- package/dist/components/charts/line-chart/stores/line-chart.store.js.map +1 -1
- package/dist/components/charts/line-chart/stores/svg.store.js +66 -108
- package/dist/components/charts/line-chart/stores/svg.store.js.map +1 -1
- package/dist/components/charts/line-chart/utils/const.js +8 -7
- package/dist/components/charts/line-chart/utils/const.js.map +1 -1
- package/dist/components/charts/line-chart/utils/formatters.js +13 -11
- package/dist/components/charts/line-chart/utils/formatters.js.map +1 -1
- package/dist/components/charts/line-chart/utils/interfaces.js +2 -1
- package/dist/components/charts/line-chart/utils/interfaces.js.map +1 -1
- package/dist/components/charts/line-chart/utils/internal-interfaces.js +2 -1
- package/dist/components/charts/line-chart/utils/internal-interfaces.js.map +1 -1
- package/dist/components/charts/line-chart/utils/key.js +2 -1
- package/dist/components/charts/line-chart/utils/key.js.map +1 -1
- package/dist/components/charts/line-chart/utils/labels.js +50 -46
- package/dist/components/charts/line-chart/utils/labels.js.map +1 -1
- package/dist/components/charts/pie-chart/components/pie-chart.js +60 -6
- package/dist/components/charts/pie-chart/components/pie-chart.js.map +1 -1
- package/dist/components/charts/pie-chart/components/pie-chart.module.less.d.ts +3 -0
- package/dist/components/charts/pie-chart/components/pie.js +176 -39
- package/dist/components/charts/pie-chart/components/pie.js.map +1 -1
- package/dist/components/charts/pie-chart/index.js +2 -0
- package/dist/components/charts/pie-chart/index.js.map +1 -1
- package/dist/components/charts/pie-chart/utils/const.js +55 -39
- package/dist/components/charts/pie-chart/utils/const.js.map +1 -1
- package/dist/components/charts/pie-chart/utils/interface.js +2 -1
- package/dist/components/charts/pie-chart/utils/interface.js.map +1 -1
- package/dist/components/image-cropper/image-cropper.js +74 -88
- package/dist/components/image-cropper/image-cropper.js.map +1 -1
- package/dist/components/stat/stat-card.js +68 -22
- package/dist/components/stat/stat-card.js.map +1 -1
- package/dist/components/stat/stat-card.module.less.d.ts +5 -0
- package/dist/components/stat/stat-extended-card.js +76 -4
- package/dist/components/stat/stat-extended-card.js.map +1 -1
- package/dist/components/ui/action-button/action-button.js +33 -7
- package/dist/components/ui/action-button/action-button.js.map +1 -1
- package/dist/components/ui/action-button/action-button.module.less.d.ts +9 -0
- package/dist/components/ui/action-button/index.js +1 -0
- package/dist/components/ui/action-button/index.js.map +1 -1
- package/dist/components/ui/centered-spinner/centered-spinner.js +20 -2
- package/dist/components/ui/centered-spinner/centered-spinner.js.map +1 -1
- package/dist/components/ui/date-range-picker/date-range-picker.js +71 -35
- package/dist/components/ui/date-range-picker/date-range-picker.js.map +1 -1
- package/dist/components/ui/date-range-picker/date-range-picker.module.less.d.ts +4 -0
- package/dist/components/ui/disabled-button.js +12 -3
- package/dist/components/ui/disabled-button.js.map +1 -1
- package/dist/components/ui/label-with-hint/label-with-hint.js +23 -1
- package/dist/components/ui/label-with-hint/label-with-hint.js.map +1 -1
- package/dist/components/ui/line-text/index.js +1 -0
- package/dist/components/ui/line-text/index.js.map +1 -1
- package/dist/components/ui/line-text/line-text.js +71 -12
- package/dist/components/ui/line-text/line-text.js.map +1 -1
- package/dist/components/ui/line-text/line-text.module.less.d.ts +6 -0
- package/dist/components/ui/title-popover/index.js +1 -0
- package/dist/components/ui/title-popover/index.js.map +1 -1
- package/dist/components/ui/title-popover/title-popover.js +78 -69
- package/dist/components/ui/title-popover/title-popover.js.map +1 -1
- package/dist/components/ui/title-popover/title-popover.module.less.d.ts +3 -0
- package/dist/index.js +3 -1
- package/dist/index.js.map +1 -1
- package/dist/utils/ads-texts.js +2 -1
- package/dist/utils/ads-texts.js.map +1 -1
- package/dist/utils/date/date-range-picker-options.js +90 -68
- package/dist/utils/date/date-range-picker-options.js.map +1 -1
- package/dist/utils/date/date-range-picker-state.js +42 -43
- package/dist/utils/date/date-range-picker-state.js.map +1 -1
- package/dist/utils/date/date-tenant.js +4 -6
- package/dist/utils/date/date-tenant.js.map +1 -1
- package/dist/utils/date/date.js +5 -9
- package/dist/utils/date/date.js.map +1 -1
- package/dist/utils/date/index.js +1 -0
- package/dist/utils/date/index.js.map +1 -1
- package/dist/utils/format-big-numbers.js +11 -6
- package/dist/utils/format-big-numbers.js.map +1 -1
- package/dist/utils/formatters.js +8 -7
- package/dist/utils/formatters.js.map +1 -1
- package/dist/utils/helpers.js +9 -12
- package/dist/utils/helpers.js.map +1 -1
- package/dist/utils/marketing-parner-handlers.js +9 -12
- package/dist/utils/marketing-parner-handlers.js.map +1 -1
- package/dist/utils/string-case.js +1 -0
- package/dist/utils/string-case.js.map +1 -1
- package/dist/utils/use-client-rect.js +19 -19
- package/dist/utils/use-client-rect.js.map +1 -1
- package/dist/utils/use-target-range-store.js +7 -6
- package/dist/utils/use-target-range-store.js.map +1 -1
- package/package.json +11 -11
- package/dist/components/charts/funnel-chart/funnel-chart.stories.js +0 -76
- package/dist/components/charts/funnel-chart/funnel-chart.stories.js.map +0 -1
- package/dist/components/charts/line-chart/line-chart.stories.js +0 -225
- package/dist/components/charts/line-chart/line-chart.stories.js.map +0 -1
- package/dist/components/charts/pie-chart/pie-chart.stories.js +0 -22
- package/dist/components/charts/pie-chart/pie-chart.stories.js.map +0 -1
- package/dist/components/image-cropper/image-cropper.stories.js +0 -39
- package/dist/components/image-cropper/image-cropper.stories.js.map +0 -1
- package/dist/components/stat/stat-cards.stories.js +0 -16
- package/dist/components/stat/stat-cards.stories.js.map +0 -1
- package/dist/components/stat/stat-extended-card.stories.js +0 -12
- package/dist/components/stat/stat-extended-card.stories.js.map +0 -1
- package/dist/components/ui/action-button/action-button.stories.js +0 -11
- package/dist/components/ui/action-button/action-button.stories.js.map +0 -1
- package/dist/components/ui/centered-spinner/centered-spinner.stories.js +0 -12
- package/dist/components/ui/centered-spinner/centered-spinner.stories.js.map +0 -1
- package/dist/components/ui/date-range-picker/date-range-picker.stories.js +0 -18
- package/dist/components/ui/date-range-picker/date-range-picker.stories.js.map +0 -1
- package/dist/components/ui/label-with-hint/label-with-hint.stories.js +0 -12
- package/dist/components/ui/label-with-hint/label-with-hint.stories.js.map +0 -1
- package/dist/components/ui/line-text/line-text-body.stories.js +0 -11
- package/dist/components/ui/line-text/line-text-body.stories.js.map +0 -1
- package/dist/components/ui/line-text/line-text-head.stories.js +0 -11
- package/dist/components/ui/line-text/line-text-head.stories.js.map +0 -1
- package/dist/components/ui/title-popover/title-popover.stories.js +0 -17
- package/dist/components/ui/title-popover/title-popover.stories.js.map +0 -1
- package/dist/utils/__tests__/format-big-numbers.test.js +0 -16
- package/dist/utils/__tests__/format-big-numbers.test.js.map +0 -1
- package/dist/utils/__tests__/formatters.test.js +0 -45
- package/dist/utils/__tests__/formatters.test.js.map +0 -1
- package/dist/utils/__tests__/helpers.test.js +0 -31
- package/dist/utils/__tests__/helpers.test.js.map +0 -1
- package/dist/utils/__tests__/string-case.test.js +0 -20
- package/dist/utils/__tests__/string-case.test.js.map +0 -1
- package/dist/utils/date/__mocks__/date-mock.js +0 -19
- package/dist/utils/date/__mocks__/date-mock.js.map +0 -1
- package/dist/utils/date/__tests__/date-range-picker.test.js +0 -93
- package/dist/utils/date/__tests__/date-range-picker.test.js.map +0 -1
- package/dist/utils/date/__tests__/date-tenant.test.js +0 -29
- package/dist/utils/date/__tests__/date-tenant.test.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/charts/line-chart/stores/line-chart.store.ts"],"sourcesContent":["import { injectable } from '@servicetitan/react-ioc';\nimport { action, observable, makeObservable } from 'mobx';\nimport {\n LineChartDisplay,\n LineChartDisplayValueFormat,\n LineChartMetricValues,\n LineChartPeriod,\n LineChartProps,\n LineChartResolution,\n} from '../utils/interfaces';\nimport { defaultDisplay } from '../utils/const';\nimport { ChartMetric, SideMetricsSettings } from '../utils/internal-interfaces';\nimport { getFormatter } from '../utils/formatters';\n\nconst getSideMetricsSettings = (\n metrics: ChartMetric[],\n values: LineChartMetricValues[],\n range?: number,\n title?: string,\n format?: LineChartDisplayValueFormat\n): SideMetricsSettings | undefined => {\n let maxRange = range ?? 0;\n const lineBarMetricIDs = metrics\n .filter(m => m.type === 'line' || m.type === 'bar' || m.type === 'grouped-bar')\n .map(m => m.id);\n const stackedBarMetricIDs = metrics.filter(m => m.type === 'stacked-bar').map(m => m.id);\n\n if (!maxRange) {\n maxRange = values.reduce(\n (sum, metricValues) =>\n lineBarMetricIDs.includes(metricValues.metricId)\n ? Math.max(\n sum,\n metricValues.values.reduce((acc, v) => Math.max(acc, v), 0)\n )\n : sum,\n 0\n );\n }\n\n if (stackedBarMetricIDs.length) {\n const stackChartMetricValues = values\n .filter(metricValues => stackedBarMetricIDs.includes(metricValues.metricId))\n .map(metric => metric.values);\n\n const summedStackedMetrics = stackChartMetricValues[0]?.map((value, i) =>\n stackChartMetricValues.reduce((sum, metricValues) => sum + metricValues[i], 0)\n );\n\n if (summedStackedMetrics?.length) {\n maxRange = Math.max(...summedStackedMetrics, maxRange);\n }\n }\n\n if (!maxRange) {\n if (!lineBarMetricIDs.length && !stackedBarMetricIDs.length) {\n return undefined;\n }\n\n maxRange = 10;\n }\n\n maxRange = Math.max(maxRange, 10);\n\n if (format === 'moneyShort' && maxRange > 1000 && maxRange < 10000) {\n maxRange = 10000;\n }\n\n const sums = [];\n const step = maxRange / 10;\n const formatter = getFormatter(format);\n\n for (let i = 0; i < 10; i++) {\n sums.push(formatter(maxRange - i * step));\n }\n\n const width = title ? 64 : 48;\n\n return { maxRange, maxValue: 1.1 * maxRange, title: title ?? '', values: sums, width };\n};\n\n@injectable()\nexport class LineChartStore {\n @observable isInit = false;\n @observable display: LineChartDisplay = defaultDisplay();\n @observable metrics: ChartMetric[] = [];\n @observable periods: LineChartPeriod[] = [];\n @observable resolution: LineChartResolution = 'day';\n\n @observable left?: SideMetricsSettings;\n @observable right?: SideMetricsSettings;\n\n @observable hoveredIndex = -1;\n\n constructor() {\n makeObservable(this);\n }\n\n @action init = (props: LineChartProps) => {\n this.display = {\n ...defaultDisplay(),\n ...(props.display ?? {}),\n };\n\n this.metrics = props.metrics.map(m => {\n const mv = props.metricValues.find(mv => mv.metricId === m.id);\n\n return {\n ...m,\n isRight: !!m.isRight,\n type: m.type ?? 'line',\n opts: m.opts ?? {},\n values: mv?.values ?? [],\n valuesOpts: mv?.opts,\n };\n });\n\n this.left = getSideMetricsSettings(\n this.metrics.filter(m => !m.isRight),\n props.metricValues,\n props.maxRange,\n props.titleY,\n this.display.yLeftFormat\n );\n this.right = getSideMetricsSettings(\n this.metrics.filter(m => m.isRight),\n props.metricValues,\n props.maxRangeRight,\n props.titleYRight,\n this.display.yRightFormat\n );\n\n this.resolution = props.resolution;\n this.periods = props.periods || [];\n this.hoveredIndex = -1;\n this.isInit = true;\n };\n\n @action setHoveredIndex = (index: number, isHovered: boolean) => {\n if (isHovered) {\n this.hoveredIndex = index;\n } else if (index === this.hoveredIndex) {\n this.hoveredIndex = -1;\n }\n };\n}\n"],"names":["injectable","action","observable","makeObservable","LineChartDisplay","LineChartResolution","defaultDisplay","SideMetricsSettings","getFormatter","getSideMetricsSettings","metrics","values","range","title","format","maxRange","lineBarMetricIDs","filter","m","type","map","id","stackedBarMetricIDs","reduce","sum","metricValues","includes","metricId","Math","max","acc","v","length","stackChartMetricValues","metric","summedStackedMetrics","value","i","undefined","sums","step","formatter","push","width","maxValue","LineChartStore","isInit","display","periods","resolution","left","right","hoveredIndex","init","props","mv","find","isRight","opts","valuesOpts","titleY","yLeftFormat","maxRangeRight","titleYRight","yRightFormat","setHoveredIndex","index","isHovered"],"mappings":"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"}
|
|
@@ -1,131 +1,89 @@
|
|
|
1
|
-
|
|
1
|
+
function _define_property(obj, key, value) {
|
|
2
|
+
if (key in obj) {
|
|
3
|
+
Object.defineProperty(obj, key, {
|
|
4
|
+
value: value,
|
|
5
|
+
enumerable: true,
|
|
6
|
+
configurable: true,
|
|
7
|
+
writable: true
|
|
8
|
+
});
|
|
9
|
+
} else {
|
|
10
|
+
obj[key] = value;
|
|
11
|
+
}
|
|
12
|
+
return obj;
|
|
13
|
+
}
|
|
14
|
+
function _ts_decorate(decorators, target, key, desc) {
|
|
2
15
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
3
16
|
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
|
|
4
|
-
else for
|
|
17
|
+
else for(var i = decorators.length - 1; i >= 0; i--)if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
5
18
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
6
|
-
}
|
|
7
|
-
|
|
19
|
+
}
|
|
20
|
+
function _ts_metadata(k, v) {
|
|
8
21
|
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
|
9
|
-
}
|
|
22
|
+
}
|
|
10
23
|
import { injectable } from '@servicetitan/react-ioc';
|
|
11
24
|
import { action, observable, makeObservable } from 'mobx';
|
|
12
25
|
const barRelativeWidth = 0.8;
|
|
13
26
|
const maxBarWidth = 7;
|
|
14
|
-
|
|
15
|
-
constructor() {
|
|
16
|
-
Object.defineProperty(this, "key", {
|
|
17
|
-
enumerable: true,
|
|
18
|
-
configurable: true,
|
|
19
|
-
writable: true,
|
|
20
|
-
value: 0
|
|
21
|
-
});
|
|
22
|
-
Object.defineProperty(this, "length", {
|
|
23
|
-
enumerable: true,
|
|
24
|
-
configurable: true,
|
|
25
|
-
writable: true,
|
|
26
|
-
value: 1
|
|
27
|
-
});
|
|
28
|
-
Object.defineProperty(this, "xOffset", {
|
|
29
|
-
enumerable: true,
|
|
30
|
-
configurable: true,
|
|
31
|
-
writable: true,
|
|
32
|
-
value: 0
|
|
33
|
-
});
|
|
34
|
-
Object.defineProperty(this, "barWidth", {
|
|
35
|
-
enumerable: true,
|
|
36
|
-
configurable: true,
|
|
37
|
-
writable: true,
|
|
38
|
-
value: 0
|
|
39
|
-
});
|
|
40
|
-
Object.defineProperty(this, "fullBarWidth", {
|
|
41
|
-
enumerable: true,
|
|
42
|
-
configurable: true,
|
|
43
|
-
writable: true,
|
|
44
|
-
value: 0
|
|
45
|
-
});
|
|
46
|
-
Object.defineProperty(this, "maxValueLeft", {
|
|
47
|
-
enumerable: true,
|
|
48
|
-
configurable: true,
|
|
49
|
-
writable: true,
|
|
50
|
-
value: 0
|
|
51
|
-
});
|
|
52
|
-
Object.defineProperty(this, "maxValueRight", {
|
|
53
|
-
enumerable: true,
|
|
54
|
-
configurable: true,
|
|
55
|
-
writable: true,
|
|
56
|
-
value: 0
|
|
57
|
-
});
|
|
58
|
-
Object.defineProperty(this, "init", {
|
|
59
|
-
enumerable: true,
|
|
60
|
-
configurable: true,
|
|
61
|
-
writable: true,
|
|
62
|
-
value: (length, metrics, maxValueLeft, maxValueRight) => {
|
|
63
|
-
this.length = length || 1;
|
|
64
|
-
this.key = Date.now();
|
|
65
|
-
const hasBars = !!metrics.filter(m => m.type === 'bar' || m.type === 'stacked-bar' || m.type === 'grouped-bar').length;
|
|
66
|
-
if (hasBars) {
|
|
67
|
-
this.fullBarWidth = 100 / this.length;
|
|
68
|
-
this.xOffset = this.fullBarWidth / 2;
|
|
69
|
-
}
|
|
70
|
-
else {
|
|
71
|
-
this.fullBarWidth = 100 / (this.length - 1);
|
|
72
|
-
this.xOffset = 0;
|
|
73
|
-
}
|
|
74
|
-
this.barWidth = Math.min(barRelativeWidth * this.fullBarWidth, maxBarWidth);
|
|
75
|
-
this.maxValueLeft = maxValueLeft;
|
|
76
|
-
this.maxValueRight = maxValueRight;
|
|
77
|
-
}
|
|
78
|
-
});
|
|
79
|
-
Object.defineProperty(this, "fpx", {
|
|
80
|
-
enumerable: true,
|
|
81
|
-
configurable: true,
|
|
82
|
-
writable: true,
|
|
83
|
-
value: (val) => {
|
|
84
|
-
return val.toFixed(1);
|
|
85
|
-
}
|
|
86
|
-
});
|
|
87
|
-
Object.defineProperty(this, "fpy", {
|
|
88
|
-
enumerable: true,
|
|
89
|
-
configurable: true,
|
|
90
|
-
writable: true,
|
|
91
|
-
value: (val) => {
|
|
92
|
-
return (100 - val).toFixed(1);
|
|
93
|
-
}
|
|
94
|
-
});
|
|
95
|
-
makeObservable(this);
|
|
96
|
-
}
|
|
27
|
+
export class SvgStore {
|
|
97
28
|
periodX(index) {
|
|
98
29
|
return this.xOffset + this.fullBarWidth * index;
|
|
99
30
|
}
|
|
100
31
|
periodY(m, ind) {
|
|
101
32
|
const value = ind < 0 || ind >= m.values.length ? 0 : m.values[ind];
|
|
102
33
|
const maxValue = m.isRight ? this.maxValueRight : this.maxValueLeft;
|
|
103
|
-
return value && maxValue ?
|
|
34
|
+
return value && maxValue ? 100 * value / maxValue : 0;
|
|
35
|
+
}
|
|
36
|
+
constructor(){
|
|
37
|
+
_define_property(this, "key", 0);
|
|
38
|
+
_define_property(this, "length", 1);
|
|
39
|
+
_define_property(this, "xOffset", 0);
|
|
40
|
+
_define_property(this, "barWidth", 0);
|
|
41
|
+
_define_property(this, "fullBarWidth", 0);
|
|
42
|
+
_define_property(this, "maxValueLeft", 0);
|
|
43
|
+
_define_property(this, "maxValueRight", 0);
|
|
44
|
+
_define_property(this, "init", (length, metrics, maxValueLeft, maxValueRight)=>{
|
|
45
|
+
this.length = length || 1;
|
|
46
|
+
this.key = Date.now();
|
|
47
|
+
const hasBars = !!metrics.filter((m)=>m.type === 'bar' || m.type === 'stacked-bar' || m.type === 'grouped-bar').length;
|
|
48
|
+
if (hasBars) {
|
|
49
|
+
this.fullBarWidth = 100 / this.length;
|
|
50
|
+
this.xOffset = this.fullBarWidth / 2;
|
|
51
|
+
} else {
|
|
52
|
+
this.fullBarWidth = 100 / (this.length - 1);
|
|
53
|
+
this.xOffset = 0;
|
|
54
|
+
}
|
|
55
|
+
this.barWidth = Math.min(barRelativeWidth * this.fullBarWidth, maxBarWidth);
|
|
56
|
+
this.maxValueLeft = maxValueLeft;
|
|
57
|
+
this.maxValueRight = maxValueRight;
|
|
58
|
+
});
|
|
59
|
+
_define_property(this, "fpx", (val)=>{
|
|
60
|
+
return val.toFixed(1);
|
|
61
|
+
});
|
|
62
|
+
_define_property(this, "fpy", (val)=>{
|
|
63
|
+
return (100 - val).toFixed(1);
|
|
64
|
+
});
|
|
65
|
+
makeObservable(this);
|
|
104
66
|
}
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
observable
|
|
108
|
-
__metadata("design:type", Object)
|
|
67
|
+
}
|
|
68
|
+
_ts_decorate([
|
|
69
|
+
observable
|
|
109
70
|
], SvgStore.prototype, "key", void 0);
|
|
110
|
-
|
|
111
|
-
observable
|
|
112
|
-
__metadata("design:type", Object)
|
|
71
|
+
_ts_decorate([
|
|
72
|
+
observable
|
|
113
73
|
], SvgStore.prototype, "length", void 0);
|
|
114
|
-
|
|
115
|
-
observable
|
|
116
|
-
__metadata("design:type", Object)
|
|
74
|
+
_ts_decorate([
|
|
75
|
+
observable
|
|
117
76
|
], SvgStore.prototype, "xOffset", void 0);
|
|
118
|
-
|
|
119
|
-
observable
|
|
120
|
-
__metadata("design:type", Object)
|
|
77
|
+
_ts_decorate([
|
|
78
|
+
observable
|
|
121
79
|
], SvgStore.prototype, "barWidth", void 0);
|
|
122
|
-
|
|
123
|
-
action
|
|
124
|
-
__metadata("design:type", Object)
|
|
80
|
+
_ts_decorate([
|
|
81
|
+
action
|
|
125
82
|
], SvgStore.prototype, "init", void 0);
|
|
126
|
-
SvgStore =
|
|
83
|
+
SvgStore = _ts_decorate([
|
|
127
84
|
injectable(),
|
|
128
|
-
|
|
85
|
+
_ts_metadata("design:type", Function),
|
|
86
|
+
_ts_metadata("design:paramtypes", [])
|
|
129
87
|
], SvgStore);
|
|
130
|
-
|
|
88
|
+
|
|
131
89
|
//# sourceMappingURL=svg.store.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/charts/line-chart/stores/svg.store.ts"],"sourcesContent":["import { injectable } from '@servicetitan/react-ioc';\nimport { action, observable, makeObservable } from 'mobx';\nimport { ChartMetric } from '../utils/internal-interfaces';\n\nconst barRelativeWidth = 0.8;\nconst maxBarWidth = 7;\n\n@injectable()\nexport class SvgStore {\n @observable key = 0;\n @observable length = 1;\n @observable xOffset = 0;\n @observable barWidth = 0;\n\n private fullBarWidth = 0;\n private maxValueLeft = 0;\n private maxValueRight = 0;\n\n constructor() {\n makeObservable(this);\n }\n\n @action init = (\n length: number,\n metrics: ChartMetric[],\n maxValueLeft: number,\n maxValueRight: number\n ) => {\n this.length = length || 1;\n this.key = Date.now();\n\n const hasBars = !!metrics.filter(\n m => m.type === 'bar' || m.type === 'stacked-bar' || m.type === 'grouped-bar'\n ).length;\n\n if (hasBars) {\n this.fullBarWidth = 100 / this.length;\n this.xOffset = this.fullBarWidth / 2;\n } else {\n this.fullBarWidth = 100 / (this.length - 1);\n this.xOffset = 0;\n }\n\n this.barWidth = Math.min(barRelativeWidth * this.fullBarWidth, maxBarWidth);\n this.maxValueLeft = maxValueLeft;\n this.maxValueRight = maxValueRight;\n };\n\n periodX(index: number): number {\n return this.xOffset + this.fullBarWidth * index;\n }\n\n periodY(m: ChartMetric, ind: number): number {\n const value = ind < 0 || ind >= m.values.length ? 0 : m.values[ind];\n const maxValue = m.isRight ? this.maxValueRight : this.maxValueLeft;\n\n return value && maxValue ? (100 * value) / maxValue : 0;\n }\n\n fpx = (val: number): string => {\n return val.toFixed(1);\n };\n\n fpy = (val: number): string => {\n return (100 - val).toFixed(1);\n };\n}\n"],"names":["injectable","action","observable","makeObservable","barRelativeWidth","maxBarWidth","SvgStore","periodX","index","xOffset","fullBarWidth","periodY","m","ind","value","values","length","maxValue","isRight","maxValueRight","maxValueLeft","key","barWidth","init","metrics","Date","now","hasBars","filter","type","Math","min","fpx","val","toFixed","fpy"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,SAASA,UAAU,QAAQ,0BAA0B;AACrD,SAASC,MAAM,EAAEC,UAAU,EAAEC,cAAc,QAAQ,OAAO;AAG1D,MAAMC,mBAAmB;AACzB,MAAMC,cAAc;AAGpB,OAAO,MAAMC;IAwCTC,QAAQC,KAAa,EAAU;QAC3B,OAAO,IAAI,CAACC,OAAO,GAAG,IAAI,CAACC,YAAY,GAAGF;IAC9C;IAEAG,QAAQC,CAAc,EAAEC,GAAW,EAAU;QACzC,MAAMC,QAAQD,MAAM,KAAKA,OAAOD,EAAEG,MAAM,CAACC,MAAM,GAAG,IAAIJ,EAAEG,MAAM,CAACF,IAAI;QACnE,MAAMI,WAAWL,EAAEM,OAAO,GAAG,IAAI,CAACC,aAAa,GAAG,IAAI,CAACC,YAAY;QAEnE,OAAON,SAASG,WAAW,AAAC,MAAMH,QAASG,WAAW;IAC1D;IAvCA,aAAc;QATd,uBAAYI,OAAM;QAClB,uBAAYL,UAAS;QACrB,uBAAYP,WAAU;QACtB,uBAAYa,YAAW;QAEvB,uBAAQZ,gBAAe;QACvB,uBAAQU,gBAAe;QACvB,uBAAQD,iBAAgB;QAMxB,uBAAQI,QAAO,CACXP,QACAQ,SACAJ,cACAD;YAEA,IAAI,CAACH,MAAM,GAAGA,UAAU;YACxB,IAAI,CAACK,GAAG,GAAGI,KAAKC,GAAG;YAEnB,MAAMC,UAAU,CAAC,CAACH,QAAQI,MAAM,CAC5BhB,CAAAA,IAAKA,EAAEiB,IAAI,KAAK,SAASjB,EAAEiB,IAAI,KAAK,iBAAiBjB,EAAEiB,IAAI,KAAK,eAClEb,MAAM;YAER,IAAIW,SAAS;gBACT,IAAI,CAACjB,YAAY,GAAG,MAAM,IAAI,CAACM,MAAM;gBACrC,IAAI,CAACP,OAAO,GAAG,IAAI,CAACC,YAAY,GAAG;YACvC,OAAO;gBACH,IAAI,CAACA,YAAY,GAAG,MAAO,CAAA,IAAI,CAACM,MAAM,GAAG,CAAA;gBACzC,IAAI,CAACP,OAAO,GAAG;YACnB;YAEA,IAAI,CAACa,QAAQ,GAAGQ,KAAKC,GAAG,CAAC3B,mBAAmB,IAAI,CAACM,YAAY,EAAEL;YAC/D,IAAI,CAACe,YAAY,GAAGA;YACpB,IAAI,CAACD,aAAa,GAAGA;QACzB;QAaAa,uBAAAA,OAAM,CAACC;YACH,OAAOA,IAAIC,OAAO,CAAC;QACvB;QAEAC,uBAAAA,OAAM,CAACF;YACH,OAAO,AAAC,CAAA,MAAMA,GAAE,EAAGC,OAAO,CAAC;QAC/B;QA9CI/B,eAAe,IAAI;IACvB;AA8CJ"}
|
|
@@ -2,12 +2,13 @@ export const chartResolutionTitles = {
|
|
|
2
2
|
hour: 'by hour',
|
|
3
3
|
day: 'by day',
|
|
4
4
|
week: 'by week',
|
|
5
|
-
month: 'by month'
|
|
5
|
+
month: 'by month'
|
|
6
6
|
};
|
|
7
|
-
export const defaultDisplay = ()
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
});
|
|
7
|
+
export const defaultDisplay = ()=>({
|
|
8
|
+
xLabels: true,
|
|
9
|
+
yGrid: true,
|
|
10
|
+
yLeft: true,
|
|
11
|
+
yRight: true
|
|
12
|
+
});
|
|
13
|
+
|
|
13
14
|
//# sourceMappingURL=const.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/charts/line-chart/utils/const.ts"],"sourcesContent":["import { LineChartResolution, LineChartDisplay } from './interfaces';\n\nexport const chartResolutionTitles: Record<LineChartResolution, string> = {\n hour: 'by hour',\n day: 'by day',\n week: 'by week',\n month: 'by month',\n};\n\nexport const defaultDisplay = (): LineChartDisplay => ({\n xLabels: true,\n yGrid: true,\n yLeft: true,\n yRight: true,\n});\n"],"names":["chartResolutionTitles","hour","day","week","month","defaultDisplay","xLabels","yGrid","yLeft","yRight"],"mappings":"AAEA,OAAO,MAAMA,wBAA6D;IACtEC,MAAM;IACNC,KAAK;IACLC,MAAM;IACNC,OAAO;AACX,EAAE;AAEF,OAAO,MAAMC,iBAAiB,IAAyB,CAAA;QACnDC,SAAS;QACTC,OAAO;QACPC,OAAO;QACPC,QAAQ;IACZ,CAAA,EAAG"}
|
|
@@ -1,22 +1,24 @@
|
|
|
1
1
|
import { formatMoney } from 'accounting';
|
|
2
2
|
export const formatters = {
|
|
3
|
-
number: (value)
|
|
4
|
-
money: (value)
|
|
5
|
-
moneyShort: (value)
|
|
6
|
-
const postfixes = [
|
|
3
|
+
number: (value)=>Math.round(value).toLocaleString(),
|
|
4
|
+
money: (value)=>formatMoney(value, undefined, 0),
|
|
5
|
+
moneyShort: (value)=>{
|
|
6
|
+
const postfixes = [
|
|
7
|
+
'',
|
|
8
|
+
'K',
|
|
9
|
+
'M',
|
|
10
|
+
'B'
|
|
11
|
+
];
|
|
7
12
|
let val = value;
|
|
8
|
-
for
|
|
13
|
+
for(let i = 0; i < postfixes.length; i++){
|
|
9
14
|
if (val < 1000 || i === postfixes.length - 1) {
|
|
10
15
|
return formatMoney(Math.round(val), undefined, 0) + postfixes[i];
|
|
11
16
|
}
|
|
12
17
|
val = val / 1000;
|
|
13
18
|
}
|
|
14
19
|
return '';
|
|
15
|
-
}
|
|
20
|
+
}
|
|
16
21
|
};
|
|
17
|
-
export const getFormatter = (format)
|
|
18
|
-
|
|
19
|
-
? formatters[format] || formatters.number
|
|
20
|
-
: format
|
|
21
|
-
: formatters.number;
|
|
22
|
+
export const getFormatter = (format)=>format ? typeof format === 'string' ? formatters[format] || formatters.number : format : formatters.number;
|
|
23
|
+
|
|
22
24
|
//# sourceMappingURL=formatters.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/charts/line-chart/utils/formatters.ts"],"sourcesContent":["import { formatMoney } from 'accounting';\nimport {\n LineChartDisplayValueFormat,\n LineChartDisplayValueFormatter,\n LineChartDisplayValueFormatterName,\n} from './interfaces';\n\nexport const formatters: Record<\n LineChartDisplayValueFormatterName,\n LineChartDisplayValueFormatter\n> = {\n number: (value: number) => Math.round(value).toLocaleString(),\n money: (value: number) => formatMoney(value, undefined, 0),\n moneyShort: (value: number) => {\n const postfixes = ['', 'K', 'M', 'B'];\n let val = value;\n\n for (let i = 0; i < postfixes.length; i++) {\n if (val < 1000 || i === postfixes.length - 1) {\n return formatMoney(Math.round(val), undefined, 0) + postfixes[i];\n }\n\n val = val / 1000;\n }\n\n return '';\n },\n};\n\nexport const getFormatter = (\n format?: LineChartDisplayValueFormat\n): LineChartDisplayValueFormatter =>\n format\n ? typeof format === 'string'\n ? formatters[format] || formatters.number\n : format\n : formatters.number;\n"],"names":["formatMoney","formatters","number","value","Math","round","toLocaleString","money","undefined","moneyShort","postfixes","val","i","length","getFormatter","format"],"mappings":"AAAA,SAASA,WAAW,QAAQ,aAAa;AAOzC,OAAO,MAAMC,aAGT;IACAC,QAAQ,CAACC,QAAkBC,KAAKC,KAAK,CAACF,OAAOG,cAAc;IAC3DC,OAAO,CAACJ,QAAkBH,YAAYG,OAAOK,WAAW;IACxDC,YAAY,CAACN;QACT,MAAMO,YAAY;YAAC;YAAI;YAAK;YAAK;SAAI;QACrC,IAAIC,MAAMR;QAEV,IAAK,IAAIS,IAAI,GAAGA,IAAIF,UAAUG,MAAM,EAAED,IAAK;YACvC,IAAID,MAAM,QAAQC,MAAMF,UAAUG,MAAM,GAAG,GAAG;gBAC1C,OAAOb,YAAYI,KAAKC,KAAK,CAACM,MAAMH,WAAW,KAAKE,SAAS,CAACE,EAAE;YACpE;YAEAD,MAAMA,MAAM;QAChB;QAEA,OAAO;IACX;AACJ,EAAE;AAEF,OAAO,MAAMG,eAAe,CACxBC,SAEAA,SACM,OAAOA,WAAW,WACdd,UAAU,CAACc,OAAO,IAAId,WAAWC,MAAM,GACvCa,SACJd,WAAWC,MAAM,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/charts/line-chart/utils/interfaces.ts"],"sourcesContent":["import { ReactElement } from 'react';\n\nexport type LineChartResolution = 'hour' | 'day' | 'week' | 'month';\nexport type LineChartMetricType = 'line' | 'bar' | 'stacked-bar' | 'grouped-bar';\nexport type LineChartMetricsTitlePosition = 'top' | 'top-right' | 'bottom';\n\nexport interface LineChartMetricOpts {\n dashed?: boolean;\n}\n\nexport interface LineChartMetric {\n id: number;\n color: string;\n title: string;\n opacity?: number;\n isRight?: boolean;\n type?: LineChartMetricType;\n opts?: LineChartMetricOpts;\n}\n\nexport interface LineChartPeriod {\n from: Date;\n to?: Date;\n partial?: boolean;\n}\n\nexport type LineChartMetricValueOpts =\n | undefined\n | {\n color?: string;\n };\n\nexport interface LineChartMetricValues {\n metricId: number;\n values: number[];\n opts?: LineChartMetricValueOpts[];\n}\n\nexport interface LineChartData {\n periods: LineChartPeriod[];\n metricValues: LineChartMetricValues[];\n resolution: LineChartResolution;\n}\n\nexport type LineChartDisplayValueFormatterName = 'number' | 'money' | 'moneyShort';\nexport type LineChartDisplayValueFormatter = (val: number) => string;\nexport type LineChartDisplayValueFormat =\n | LineChartDisplayValueFormatter\n | LineChartDisplayValueFormatterName;\n\nexport interface LineChartDisplay {\n xLabels: boolean;\n yGrid: boolean;\n yLeft: boolean;\n yRight: boolean;\n yLeftFormat?: LineChartDisplayValueFormat;\n yRightFormat?: LineChartDisplayValueFormat;\n metricsTitlePosition?: LineChartMetricsTitlePosition;\n metricsLeftFormat?: LineChartDisplayValueFormat;\n metricsRightFormat?: LineChartDisplayValueFormat;\n}\n\nexport interface LineChartProps extends LineChartData {\n maxRange?: number;\n titleY?: string;\n maxRangeRight?: number;\n titleYRight?: string;\n\n metrics: LineChartMetric[];\n from?: Date;\n display?: Partial<LineChartDisplay>;\n className?: string;\n classNameTitle?: string;\n}\n\nexport interface LineChartCardProps extends LineChartProps {\n title: string;\n headerRight?: ReactElement;\n loading?: boolean;\n grayControls?: boolean;\n}\n"],"names":[],"mappings":"AA2EA,WAKC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/charts/line-chart/utils/internal-interfaces.ts"],"sourcesContent":["import { LineChartMetricOpts, LineChartMetricType, LineChartMetricValueOpts } from './interfaces';\n\nexport interface SideMetricsSettings {\n maxRange: number;\n maxValue: number;\n title: string;\n values: string[];\n width: number;\n}\n\nexport interface ChartMetric {\n id: number;\n color: string;\n title: string;\n isRight: boolean;\n type: LineChartMetricType;\n opts: LineChartMetricOpts;\n values: number[];\n opacity?: number;\n valuesOpts?: LineChartMetricValueOpts[];\n}\n\nexport type ChartXLabels = [string, number][];\n"],"names":[],"mappings":"AAsBA,WAA8C"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/charts/line-chart/utils/key.ts"],"sourcesContent":["export const keyVal = (val: string | number, i: number) => `${val}-${i}`;\n"],"names":["keyVal","val","i"],"mappings":"AAAA,OAAO,MAAMA,SAAS,CAACC,KAAsBC,IAAc,GAAGD,IAAI,CAAC,EAAEC,GAAG,CAAC"}
|
|
@@ -2,96 +2,100 @@ import moment from 'moment';
|
|
|
2
2
|
const xLabelFormats = {
|
|
3
3
|
hour: 'HH:mm',
|
|
4
4
|
day: 'MM/DD',
|
|
5
|
-
month: 'MMM'
|
|
5
|
+
month: 'MMM'
|
|
6
6
|
};
|
|
7
|
-
export const getXLabels = (periods, resolution, width)
|
|
7
|
+
export const getXLabels = (periods, resolution, width)=>{
|
|
8
8
|
let labels = [];
|
|
9
9
|
if (resolution === 'hour') {
|
|
10
10
|
if (width / periods.length < 76) {
|
|
11
11
|
let day = -1;
|
|
12
|
-
for (const p of periods)
|
|
12
|
+
for (const p of periods){
|
|
13
13
|
const d = p.from.getDay();
|
|
14
14
|
if (d === day) {
|
|
15
15
|
labels[labels.length - 1][1]++;
|
|
16
16
|
continue;
|
|
17
17
|
}
|
|
18
18
|
day = d;
|
|
19
|
-
labels.push([
|
|
19
|
+
labels.push([
|
|
20
|
+
moment(p.from).format(xLabelFormats.day),
|
|
21
|
+
1
|
|
22
|
+
]);
|
|
20
23
|
}
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
var _a;
|
|
24
|
+
} else {
|
|
25
|
+
labels = periods.map((p)=>{
|
|
26
|
+
var _p_to;
|
|
25
27
|
return [
|
|
26
|
-
moment(p.from).format(xLabelFormats.hour) +
|
|
27
|
-
|
|
28
|
-
moment((_a = p.to) !== null && _a !== void 0 ? _a : p.from).format(xLabelFormats.hour),
|
|
29
|
-
1,
|
|
28
|
+
moment(p.from).format(xLabelFormats.hour) + ' - ' + moment((_p_to = p.to) !== null && _p_to !== void 0 ? _p_to : p.from).format(xLabelFormats.hour),
|
|
29
|
+
1
|
|
30
30
|
];
|
|
31
31
|
});
|
|
32
32
|
}
|
|
33
|
-
}
|
|
34
|
-
else if (resolution === 'day') {
|
|
33
|
+
} else if (resolution === 'day') {
|
|
35
34
|
if (width / periods.length < 40) {
|
|
36
35
|
let month = -1;
|
|
37
|
-
for (const p of periods)
|
|
36
|
+
for (const p of periods){
|
|
38
37
|
const m = p.from.getMonth();
|
|
39
38
|
if (m === month) {
|
|
40
39
|
labels[labels.length - 1][1]++;
|
|
41
40
|
continue;
|
|
42
41
|
}
|
|
43
42
|
month = m;
|
|
44
|
-
labels.push([
|
|
43
|
+
labels.push([
|
|
44
|
+
moment(p.from).format(xLabelFormats.month),
|
|
45
|
+
1
|
|
46
|
+
]);
|
|
45
47
|
}
|
|
48
|
+
} else {
|
|
49
|
+
labels = periods.map((p)=>[
|
|
50
|
+
moment(p.from).format(xLabelFormats.day),
|
|
51
|
+
1
|
|
52
|
+
]);
|
|
46
53
|
}
|
|
47
|
-
|
|
48
|
-
labels = periods.map(p => [moment(p.from).format(xLabelFormats.day), 1]);
|
|
49
|
-
}
|
|
50
|
-
}
|
|
51
|
-
else if (resolution === 'week') {
|
|
54
|
+
} else if (resolution === 'week') {
|
|
52
55
|
if (width / periods.length < 76) {
|
|
53
56
|
let month = -1;
|
|
54
|
-
for (const p of periods)
|
|
57
|
+
for (const p of periods){
|
|
55
58
|
const m = p.from.getMonth();
|
|
56
|
-
if (m === month ||
|
|
59
|
+
if (m === month || month > 0 && p.from.getDate() < 4) {
|
|
57
60
|
labels[labels.length - 1][1]++;
|
|
58
61
|
continue;
|
|
59
62
|
}
|
|
60
63
|
if (p.to && p.to.getDate() > 3) {
|
|
61
64
|
month = p.to.getMonth();
|
|
62
|
-
labels.push([
|
|
63
|
-
|
|
64
|
-
|
|
65
|
+
labels.push([
|
|
66
|
+
moment(p.to).format(xLabelFormats.month),
|
|
67
|
+
1
|
|
68
|
+
]);
|
|
69
|
+
} else {
|
|
65
70
|
month = m;
|
|
66
|
-
labels.push([
|
|
71
|
+
labels.push([
|
|
72
|
+
moment(p.from).format(xLabelFormats.month),
|
|
73
|
+
1
|
|
74
|
+
]);
|
|
67
75
|
}
|
|
68
76
|
}
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
var _a;
|
|
77
|
+
} else {
|
|
78
|
+
labels = periods.map((p)=>{
|
|
79
|
+
var _p_to;
|
|
73
80
|
return [
|
|
74
|
-
moment(p.from).format(xLabelFormats.day) +
|
|
75
|
-
|
|
76
|
-
moment((_a = p.to) !== null && _a !== void 0 ? _a : p.from).format(xLabelFormats.day),
|
|
77
|
-
1,
|
|
81
|
+
moment(p.from).format(xLabelFormats.day) + ' - ' + moment((_p_to = p.to) !== null && _p_to !== void 0 ? _p_to : p.from).format(xLabelFormats.day),
|
|
82
|
+
1
|
|
78
83
|
];
|
|
79
84
|
});
|
|
80
85
|
}
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
|
|
86
|
+
} else if (resolution === 'month') {
|
|
87
|
+
labels = periods.map((p)=>[
|
|
88
|
+
moment(p.from).format(xLabelFormats.month),
|
|
89
|
+
1
|
|
90
|
+
]);
|
|
84
91
|
}
|
|
85
92
|
return labels;
|
|
86
93
|
};
|
|
87
94
|
export const periodDateTitleFormatter = {
|
|
88
|
-
hour: period
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
moment(period.to).format('HH:mm'),
|
|
93
|
-
day: period => moment(period.from).format('MMMM DD, YYYY'),
|
|
94
|
-
month: period => moment(period.from).format('MMMM YYYY'),
|
|
95
|
-
week: period => moment(period.from).format('MM/DD/YYYY') + '-' + moment(period.to).format('MM/DD/YYYY'),
|
|
95
|
+
hour: (period)=>moment(period.from).format('MM/DD') + ' ' + moment(period.from).format('HH:mm') + ' - ' + moment(period.to).format('HH:mm'),
|
|
96
|
+
day: (period)=>moment(period.from).format('MMMM DD, YYYY'),
|
|
97
|
+
month: (period)=>moment(period.from).format('MMMM YYYY'),
|
|
98
|
+
week: (period)=>moment(period.from).format('MM/DD/YYYY') + '-' + moment(period.to).format('MM/DD/YYYY')
|
|
96
99
|
};
|
|
100
|
+
|
|
97
101
|
//# sourceMappingURL=labels.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["../../../../../src/components/charts/line-chart/utils/labels.ts"],"sourcesContent":["import moment from 'moment';\nimport { LineChartPeriod, LineChartResolution } from './interfaces';\nimport { ChartXLabels } from './internal-interfaces';\n\nconst xLabelFormats = {\n hour: 'HH:mm',\n day: 'MM/DD',\n month: 'MMM',\n};\n\nexport const getXLabels = (\n periods: LineChartPeriod[],\n resolution: LineChartResolution,\n width: number\n): ChartXLabels => {\n let labels: [string, number][] = [];\n\n if (resolution === 'hour') {\n if (width / periods.length < 76) {\n let day = -1;\n\n for (const p of periods) {\n const d = p.from.getDay();\n\n if (d === day) {\n labels[labels.length - 1][1]++;\n\n continue;\n }\n\n day = d;\n labels.push([moment(p.from).format(xLabelFormats.day), 1]);\n }\n } else {\n labels = periods.map(p => [\n moment(p.from).format(xLabelFormats.hour) +\n ' - ' +\n moment(p.to ?? p.from).format(xLabelFormats.hour),\n 1,\n ]);\n }\n } else if (resolution === 'day') {\n if (width / periods.length < 40) {\n let month = -1;\n\n for (const p of periods) {\n const m = p.from.getMonth();\n\n if (m === month) {\n labels[labels.length - 1][1]++;\n\n continue;\n }\n\n month = m;\n labels.push([moment(p.from).format(xLabelFormats.month), 1]);\n }\n } else {\n labels = periods.map(p => [moment(p.from).format(xLabelFormats.day), 1]);\n }\n } else if (resolution === 'week') {\n if (width / periods.length < 76) {\n let month = -1;\n\n for (const p of periods) {\n const m = p.from.getMonth();\n\n if (m === month || (month > 0 && p.from.getDate() < 4)) {\n labels[labels.length - 1][1]++;\n\n continue;\n }\n\n if (p.to && p.to.getDate() > 3) {\n month = p.to.getMonth();\n labels.push([moment(p.to).format(xLabelFormats.month), 1]);\n } else {\n month = m;\n labels.push([moment(p.from).format(xLabelFormats.month), 1]);\n }\n }\n } else {\n labels = periods.map(p => [\n moment(p.from).format(xLabelFormats.day) +\n ' - ' +\n moment(p.to ?? p.from).format(xLabelFormats.day),\n 1,\n ]);\n }\n } else if (resolution === 'month') {\n labels = periods.map(p => [moment(p.from).format(xLabelFormats.month), 1]);\n }\n\n return labels;\n};\n\nexport const periodDateTitleFormatter: Record<\n LineChartResolution,\n (period: LineChartPeriod) => string\n> = {\n hour: period =>\n moment(period.from).format('MM/DD') +\n ' ' +\n moment(period.from).format('HH:mm') +\n ' - ' +\n moment(period.to).format('HH:mm'),\n day: period => moment(period.from).format('MMMM DD, YYYY'),\n month: period => moment(period.from).format('MMMM YYYY'),\n week: period =>\n moment(period.from).format('MM/DD/YYYY') + '-' + moment(period.to).format('MM/DD/YYYY'),\n};\n"],"names":["moment","xLabelFormats","hour","day","month","getXLabels","periods","resolution","width","labels","length","p","d","from","getDay","push","format","map","to","m","getMonth","getDate","periodDateTitleFormatter","period","week"],"mappings":"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"}
|