@hisptz/dhis2-analytics 1.0.43 → 1.0.45

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/build/cjs/components/CircularProgressDashboard/index.js +15 -0
  2. package/build/cjs/components/Map/components/MapLayer/components/GoogleEngineLayer/services/api.js +3 -2
  3. package/build/cjs/components/Map/components/MapLayer/components/GoogleEngineLayer/services/engine.js +1 -9
  4. package/build/cjs/components/SingleValueContainer/index.js +16 -0
  5. package/build/es/components/CircularProgressDashboard/index.js +1 -0
  6. package/build/es/components/Map/components/MapLayer/components/GoogleEngineLayer/services/api.js +2 -1
  7. package/build/es/components/Map/components/MapLayer/components/GoogleEngineLayer/services/engine.js +1 -1
  8. package/build/es/components/SingleValueContainer/index.js +1 -0
  9. package/build/types/components/CircularProgressDashboard/index.d.ts +1 -0
  10. package/build/types/components/SingleValueContainer/index.d.ts +1 -0
  11. package/package.json +13 -7
  12. package/build/cjs/components/ChartAnalytics/ChartAnalytics.stories.js +0 -253
  13. package/build/cjs/components/ChartAnalytics/data/column-data.json +0 -210
  14. package/build/cjs/components/ChartAnalytics/data/complex-multi-series-data.json +0 -124
  15. package/build/cjs/components/ChartAnalytics/data/multi-series-data.json +0 -536
  16. package/build/cjs/components/ChartAnalytics/data/pie-data.json +0 -115
  17. package/build/cjs/components/ChartAnalytics/data/stacked-chart-data.json +0 -415
  18. package/build/cjs/components/CircularProgressDashboard/CircularProgressIndicator.stories.js +0 -45
  19. package/build/cjs/components/CustomPivotTable/CustomPivotTable.stories.js +0 -69
  20. package/build/cjs/components/Map/Map.stories.js +0 -352
  21. package/build/cjs/components/SingleValueContainer/SingleValueContainer.stories.js +0 -127
  22. package/build/cjs/components/Visualization/Visualization.stories.js +0 -138
  23. package/build/cjs/dataProviders/map.js +0 -31
  24. package/build/es/components/ChartAnalytics/ChartAnalytics.stories.js +0 -235
  25. package/build/es/components/ChartAnalytics/data/column-data.json +0 -210
  26. package/build/es/components/ChartAnalytics/data/complex-multi-series-data.json +0 -124
  27. package/build/es/components/ChartAnalytics/data/multi-series-data.json +0 -536
  28. package/build/es/components/ChartAnalytics/data/pie-data.json +0 -115
  29. package/build/es/components/ChartAnalytics/data/stacked-chart-data.json +0 -415
  30. package/build/es/components/CircularProgressDashboard/CircularProgressIndicator.stories.js +0 -34
  31. package/build/es/components/CustomPivotTable/CustomPivotTable.stories.js +0 -59
  32. package/build/es/components/Map/Map.stories.js +0 -334
  33. package/build/es/components/SingleValueContainer/SingleValueContainer.stories.js +0 -115
  34. package/build/es/components/Visualization/Visualization.stories.js +0 -129
  35. package/build/es/dataProviders/map.js +0 -24
  36. package/build/types/components/Map/components/MapLayer/components/GoogleEngineLayer/services/api.d.ts +0 -1
@@ -1,334 +0,0 @@
1
- import React from "react";
2
- import { Map } from "./index";
3
- const Template = args => /*#__PURE__*/React.createElement(Map, args);
4
- export const BaseMap = Template.bind({});
5
- BaseMap.args = {
6
- orgUnitSelection: {
7
- orgUnits: [],
8
- userOrgUnit: true,
9
- userSubUnit: true,
10
- userSubX2Unit: true
11
- }
12
- };
13
- export const Controls = Template.bind({});
14
- Controls.args = {
15
- orgUnitSelection: {
16
- orgUnits: [],
17
- userOrgUnit: true,
18
- userSubUnit: true,
19
- userSubX2Unit: true
20
- },
21
- controls: [{
22
- type: "print",
23
- position: "topleft",
24
- options: {
25
- hidden: false,
26
- hideControlContainer: true,
27
- sizeModes: ["A4Landscape", "A4Portrait", "Current"]
28
- }
29
- }]
30
- };
31
- export const BoundaryLayer = Template.bind({});
32
- BoundaryLayer.args = {
33
- orgUnitSelection: {
34
- orgUnits: [],
35
- userOrgUnit: true,
36
- userSubUnit: true,
37
- userSubX2Unit: true
38
- },
39
- boundaryLayer: {
40
- enabled: true
41
- }
42
- };
43
- export const BoundaryLayerWithLevels = Template.bind({});
44
- BoundaryLayerWithLevels.args = {
45
- orgUnitSelection: {
46
- orgUnits: [{
47
- id: "ImspTQPwCqd",
48
- displayName: "Sierra Leone",
49
- name: "Sierra Leone",
50
- path: "/ImspTQPwCqd",
51
- children: []
52
- }],
53
- levels: ["2"]
54
- },
55
- boundaryLayer: {
56
- enabled: true
57
- }
58
- };
59
- export const ChoroplethThematicLayer = Template.bind({});
60
- ChoroplethThematicLayer.args = {
61
- orgUnitSelection: {
62
- orgUnits: [],
63
- userOrgUnit: true,
64
- userSubUnit: true,
65
- userSubX2Unit: false
66
- },
67
- boundaryLayer: {
68
- enabled: true
69
- },
70
- thematicLayers: [{
71
- type: "choropleth",
72
- id: "choropleth",
73
- enabled: true,
74
- dataItem: {
75
- id: "Uvn6LCg7dVU",
76
- displayName: "ANC 1 Coverage",
77
- type: "indicator"
78
- },
79
- control: {
80
- enabled: true,
81
- position: "topright"
82
- }
83
- }],
84
- periodSelection: {
85
- periods: ["2022"]
86
- },
87
- legends: {
88
- enabled: true,
89
- position: "topright",
90
- collapsible: true
91
- }
92
- };
93
- export const BubbleThematicLayer = Template.bind({});
94
- BubbleThematicLayer.args = {
95
- orgUnitSelection: {
96
- orgUnits: [],
97
- userOrgUnit: true,
98
- userSubUnit: true,
99
- userSubX2Unit: true
100
- },
101
- boundaryLayer: {
102
- enabled: true
103
- },
104
- thematicLayers: [{
105
- type: "bubble",
106
- id: "bubble",
107
- enabled: true,
108
- dataItem: {
109
- id: "Uvn6LCg7dVU",
110
- displayName: "ANC 1 Coverage",
111
- type: "indicator"
112
- },
113
- control: {
114
- enabled: true,
115
- position: "topright"
116
- },
117
- radius: {
118
- min: 0,
119
- max: 40
120
- }
121
- }],
122
- legends: {
123
- enabled: true,
124
- position: "topright",
125
- collapsible: true
126
- },
127
- periodSelection: {
128
- periods: ["2022"]
129
- },
130
- controls: [{
131
- type: "fullscreen",
132
- position: "topleft"
133
- }]
134
- };
135
- export const AllThematicLayers = Template.bind({});
136
- AllThematicLayers.args = {
137
- orgUnitSelection: {
138
- orgUnits: [],
139
- userOrgUnit: true,
140
- userSubUnit: true,
141
- userSubX2Unit: true
142
- },
143
- boundaryLayer: {
144
- enabled: true
145
- },
146
- thematicLayers: [{
147
- type: "choropleth",
148
- id: "ReUHfIn0pTQ",
149
- enabled: true,
150
- dataItem: {
151
- id: "ReUHfIn0pTQ",
152
- displayName: "ANC 1-3 Dropout Rate",
153
- type: "indicator",
154
- legendSet: "fqs276KXCXi"
155
- },
156
- control: {
157
- enabled: true,
158
- position: "topright"
159
- }
160
- }, {
161
- type: "choropleth",
162
- id: "Uvn6LCg7dVU",
163
- enabled: true,
164
- dataItem: {
165
- id: "Uvn6LCg7dVU",
166
- displayName: "ANC 1 Coverage",
167
- type: "indicator"
168
- },
169
- control: {
170
- enabled: true,
171
- position: "topright"
172
- }
173
- }],
174
- legends: {
175
- enabled: true,
176
- position: "topright",
177
- collapsible: true
178
- },
179
- periodSelection: {
180
- periods: ["2022"]
181
- },
182
- controls: [{
183
- type: "scale",
184
- position: "bottomleft",
185
- options: {
186
- imperial: false,
187
- metric: true
188
- }
189
- }, {
190
- type: "fullscreen",
191
- position: "bottomleft"
192
- }]
193
- };
194
- export const ChoroplethThematicLayerWithLevels = Template.bind({});
195
- ChoroplethThematicLayerWithLevels.args = {
196
- orgUnitSelection: {
197
- orgUnits: [{
198
- id: "ImspTQPwCqd",
199
- displayName: "Sierra Leone",
200
- name: "Sierra Leone",
201
- path: "/ImspTQPwCqd",
202
- children: []
203
- }],
204
- levels: ["3"]
205
- },
206
- boundaryLayer: {
207
- enabled: true
208
- },
209
- thematicLayers: [{
210
- type: "choropleth",
211
- id: "choropleth",
212
- enabled: true,
213
- dataItem: {
214
- id: "Uvn6LCg7dVU",
215
- displayName: "ANC 1 Coverage",
216
- type: "indicator"
217
- },
218
- control: {
219
- enabled: true,
220
- position: "topright"
221
- }
222
- }],
223
- legends: {
224
- enabled: true,
225
- position: "topright",
226
- collapsible: true
227
- },
228
- periodSelection: {
229
- periods: ["2022"]
230
- },
231
- controls: [{
232
- type: "print",
233
- position: "topleft",
234
- options: {
235
- hidden: false,
236
- hideControlContainer: true,
237
- sizeModes: ["A4Landscape", "A4Portrait", "Current"]
238
- }
239
- }]
240
- };
241
- export const PointLayer = Template.bind({});
242
- PointLayer.args = {
243
- orgUnitSelection: {
244
- orgUnits: [],
245
- userOrgUnit: true,
246
- userSubUnit: true,
247
- userSubX2Unit: false
248
- },
249
- thematicLayers: [{
250
- type: "choropleth",
251
- id: "choropleth",
252
- enabled: true,
253
- dataItem: {
254
- id: "Uvn6LCg7dVU",
255
- displayName: "ANC 1 Coverage",
256
- type: "indicator"
257
- },
258
- control: {
259
- enabled: true,
260
- position: "topright"
261
- }
262
- }],
263
- periodSelection: {
264
- periods: ["2022"]
265
- },
266
- pointLayer: {
267
- enabled: true,
268
- label: "Facilities",
269
- level: "m9lBJogzE95",
270
- style: {
271
- groupSet: "J5jldMd8OHv"
272
- }
273
- }
274
- };
275
- export const GoogleEarthEngineLayers = Template.bind({});
276
- GoogleEarthEngineLayers.args = {
277
- orgUnitSelection: {
278
- orgUnits: [],
279
- userOrgUnit: true,
280
- userSubUnit: true,
281
- userSubX2Unit: false
282
- },
283
- thematicLayers: [],
284
- periodSelection: {
285
- periods: ["2022"]
286
- },
287
- earthEngineLayers: [{
288
- name: "Population",
289
- type: "population",
290
- id: "population",
291
- enabled: false,
292
- params: {
293
- min: 0,
294
- max: 10,
295
- palette: "#f7fbff,#deebf7,#c6dbef,#9ecae1,#6baed6,#4292c6,#2171b5,#08519c,#08306b"
296
- },
297
- aggregations: ["sum", "mean"],
298
- filters: {
299
- period: "2020"
300
- }
301
- }, {
302
- name: "Footprints",
303
- type: "footprints",
304
- id: "footprints",
305
- aggregations: ["count"],
306
- enabled: false
307
- }, {
308
- name: "Land Cover",
309
- type: "landCover",
310
- id: "landCover",
311
- enabled: true,
312
- aggregations: ["percentage"]
313
- }],
314
- pointLayer: {
315
- enabled: false,
316
- label: "Facilities",
317
- level: "m9lBJogzE95",
318
- style: {
319
- groupSet: "J5jldMd8OHv"
320
- }
321
- }
322
- };
323
- export default {
324
- title: "Analytics/Map",
325
- component: Map,
326
- decorators: [MapStory => {
327
- return /*#__PURE__*/React.createElement("div", {
328
- style: {
329
- width: "100%",
330
- height: "100%"
331
- }
332
- }, /*#__PURE__*/React.createElement(MapStory, null));
333
- }]
334
- };
@@ -1,115 +0,0 @@
1
- import React from "react";
2
- import { SingleValueContainer } from ".";
3
- const Template = args => /*#__PURE__*/React.createElement(SingleValueContainer, args);
4
- export const Default = Template.bind({});
5
- Default.args = {
6
- title: "PRIORITY INDICATORS",
7
- singleValueItems: [{
8
- label: "Total Bookings",
9
- value: 136
10
- }, {
11
- label: "At least one dose",
12
- value: 45,
13
- percentage: 23,
14
- color: "#0D47A1"
15
- }, {
16
- label: "Partially vaccinated",
17
- value: 13,
18
- percentage: 17,
19
- color: "#0D47A1"
20
- }, {
21
- label: "Fully vaccinated",
22
- value: 126,
23
- percentage: 83,
24
- color: "#0D47A1"
25
- }, {
26
- label: "Number of AEFI",
27
- value: 26
28
- }]
29
- };
30
- export const AnimatedAllValues = Template.bind({});
31
- AnimatedAllValues.args = {
32
- title: "PRIORITY INDICATORS",
33
- animationDuration: 1500,
34
- animationDelay: 500,
35
- singleValueItems: [{
36
- label: "Total Bookings",
37
- value: 136344
38
- }, {
39
- label: "At least one dose",
40
- value: 4423,
41
- percentage: 23,
42
- color: "#0D47A1"
43
- }, {
44
- label: "Partially vaccinated",
45
- value: 1394,
46
- percentage: 17,
47
- color: "#0D47A1"
48
- }, {
49
- label: "Fully vaccinated",
50
- value: 12432,
51
- percentage: 83,
52
- color: "#0D47A1"
53
- }, {
54
- label: "Number of AEFI",
55
- value: 26423
56
- }]
57
- };
58
- export const AnimatedSingleValue = Template.bind({});
59
- AnimatedSingleValue.args = {
60
- title: "PRIORITY INDICATORS",
61
- singleValueItems: [{
62
- label: "Total Bookings",
63
- value: 13634244,
64
- animationDuration: 1000,
65
- animationDelay: 100
66
- }, {
67
- label: "At least one dose",
68
- value: 45423,
69
- percentage: 23,
70
- color: "#0D47A1",
71
- animationDuration: 1000,
72
- animationDelay: 600
73
- }, {
74
- label: "Partially vaccinated",
75
- value: 13434,
76
- percentage: 17,
77
- color: "#0D47A1",
78
- animationDuration: 1000,
79
- animationDelay: 1100
80
- }, {
81
- label: "Fully vaccinated",
82
- value: 126432,
83
- percentage: 83,
84
- color: "#0D47A1",
85
- animationDuration: 1000,
86
- animationDelay: 1600
87
- }, {
88
- label: "Number of AEFI",
89
- value: 268423,
90
- animationDuration: 1000,
91
- animationDelay: 2000
92
- }]
93
- };
94
- export const SingleValuesWithDecimalPlaces = Template.bind({});
95
- SingleValuesWithDecimalPlaces.args = {
96
- title: "ENROLLMENTS",
97
- animationDuration: 1500,
98
- animationDelay: 500,
99
- singleValueItems: [{
100
- label: "Number of Enrolled Clients",
101
- value: 268423,
102
- decimalPlaces: 3
103
- }, {
104
- label: "Number of Served Clients",
105
- value: 268423,
106
- decimalPlaces: 1
107
- }]
108
- };
109
- export default {
110
- title: "Analytics/Single Value Container",
111
- component: SingleValueContainer,
112
- decorators: [SingleValueStory => {
113
- return /*#__PURE__*/React.createElement(SingleValueStory, null);
114
- }]
115
- };
@@ -1,129 +0,0 @@
1
- import { setupHighchartsModules } from "../ChartAnalytics";
2
- import { Visualization } from "./index";
3
- import HighCharts from "highcharts";
4
- import React from "react";
5
- import { Box, Card, CssReset } from "@dhis2/ui";
6
- const Template = args => /*#__PURE__*/React.createElement(Visualization, args);
7
- setupHighchartsModules(HighCharts);
8
- export const Default = Template.bind({});
9
- Default.args = {
10
- dimensions: {
11
- dx: ["Uvn6LCg7dVU", "OdiHJayrsKo", "sB79w2hiLp8", "AUqdhY4mpvp"],
12
- pe: ["LAST_6_MONTHS"],
13
- ou: ["USER_ORGUNIT_CHILDREN"]
14
- },
15
- layout: {
16
- columns: ["dx"],
17
- filters: [],
18
- rows: ["ou", "pe"]
19
- },
20
- defaultVisualizationType: "pivot-table",
21
- config: {
22
- chart: {
23
- layout: {
24
- series: ["dx"],
25
- category: ["pe"],
26
- filter: ["ou"]
27
- },
28
- type: "column"
29
- },
30
- map: {
31
- thematicLayers: [{
32
- type: "choropleth",
33
- id: "Uvn6LCg7dVU",
34
- enabled: true,
35
- control: {
36
- enabled: true,
37
- position: "topright"
38
- },
39
- dataItem: {
40
- displayName: "Uvn6LCg7dVU",
41
- id: "Uvn6LCg7dVU",
42
- type: "indicator",
43
- legendConfig: {
44
- colorClass: "BrBG",
45
- scale: 7
46
- }
47
- }
48
- }, {
49
- type: "choropleth",
50
- id: "OdiHJayrsKo",
51
- enabled: true,
52
- control: {
53
- enabled: true,
54
- position: "topright"
55
- },
56
- dataItem: {
57
- displayName: "OdiHJayrsKo",
58
- id: "OdiHJayrsKo",
59
- type: "indicator",
60
- legendConfig: {
61
- colorClass: "BrBG",
62
- scale: 7
63
- }
64
- }
65
- }, {
66
- type: "choropleth",
67
- id: "sB79w2hiLp8",
68
- enabled: true,
69
- control: {
70
- enabled: true,
71
- position: "topright"
72
- },
73
- dataItem: {
74
- displayName: "sB79w2hiLp8",
75
- id: "sB79w2hiLp8",
76
- type: "indicator",
77
- legendConfig: {
78
- colorClass: "BrBG",
79
- scale: 7
80
- }
81
- }
82
- }, {
83
- type: "choropleth",
84
- id: "AUqdhY4mpvp",
85
- enabled: true,
86
- control: {
87
- enabled: true,
88
- position: "topright"
89
- },
90
- dataItem: {
91
- displayName: "AUqdhY4mpvp",
92
- id: "AUqdhY4mpvp",
93
- type: "indicator",
94
- legendConfig: {
95
- colorClass: "BrBG",
96
- scale: 7
97
- }
98
- }
99
- }],
100
- legends: {
101
- enabled: true,
102
- position: "topright",
103
- collapsible: true
104
- }
105
- },
106
- pivotTable: {
107
- fixColumnHeaders: true,
108
- fixRowHeaders: true
109
- }
110
- }
111
- };
112
- export default {
113
- title: "Analytics/Visualization",
114
- component: Visualization,
115
- decorators: [ChartStory => {
116
- return /*#__PURE__*/React.createElement(Box, {
117
- width: "600",
118
- height: "500"
119
- }, /*#__PURE__*/React.createElement(Card, null, /*#__PURE__*/React.createElement("div", {
120
- style: {
121
- width: 1000,
122
- height: "100%",
123
- display: "flex",
124
- gap: 8,
125
- flexDirection: "column"
126
- }
127
- }, /*#__PURE__*/React.createElement(CssReset, null), /*#__PURE__*/React.createElement(ChartStory, null))));
128
- }]
129
- };
@@ -1,24 +0,0 @@
1
- import { CustomDataProvider } from "@dhis2/app-runtime";
2
- import React from "react";
3
- import mapData from "../../data/map.json";
4
- export default function MapDataProvider(_ref) {
5
- let {
6
- children
7
- } = _ref;
8
- return /*#__PURE__*/React.createElement(CustomDataProvider, {
9
- data: {
10
- ...mapData,
11
- geoFeatures: async (type, query) => {
12
- return mapData.geoFeatures;
13
- },
14
- analytics: async (type, query) => {
15
- var _query$params;
16
- if (query !== null && query !== void 0 && (_query$params = query.params) !== null && _query$params !== void 0 && _query$params.skipData) {
17
- return mapData.analytics;
18
- } else {
19
- return mapData.analyticsWithData;
20
- }
21
- }
22
- }
23
- }, children);
24
- }
@@ -1 +0,0 @@
1
- export const AbstractOverlay: Function;