@cdc/chart 4.25.3 → 4.25.6

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 (86) hide show
  1. package/dist/cdcchart.js +46641 -42561
  2. package/index.html +130 -129
  3. package/package.json +22 -27
  4. package/src/CdcChartComponent.tsx +75 -35
  5. package/src/_stories/Chart.CI.stories.tsx +10 -0
  6. package/src/_stories/Chart.DynamicSeries.stories.tsx +68 -49
  7. package/src/_stories/Chart.stories.tsx +99 -86
  8. package/src/_stories/ChartPrefixSuffix.stories.tsx +29 -32
  9. package/{examples/private/line-issue.json → src/_stories/_mock/barchart_labels.mock.json} +150 -35
  10. package/src/_stories/_mock/dynamic_series_bar_config.json +1 -1
  11. package/src/_stories/_mock/dynamic_series_suppression_mock.json +610 -0
  12. package/{examples/private/not-loading.json → src/_stories/_mock/pie_calculated_area.json} +152 -95
  13. package/src/components/Annotations/components/AnnotationDropdown.tsx +2 -2
  14. package/src/components/AreaChart/components/AreaChart.jsx +33 -5
  15. package/src/components/Axis/Categorical.Axis.tsx +2 -2
  16. package/src/components/BarChart/components/BarChart.Horizontal.tsx +38 -37
  17. package/src/components/BarChart/components/BarChart.StackedHorizontal.tsx +18 -8
  18. package/src/components/BarChart/components/BarChart.StackedVertical.tsx +8 -8
  19. package/src/components/BarChart/components/BarChart.Vertical.tsx +47 -36
  20. package/src/components/BarChart/components/{BarChart.jsx → BarChart.tsx} +23 -5
  21. package/src/components/BarChart/components/context.tsx +20 -2
  22. package/src/components/BarChart/helpers/getBarHeights.ts +47 -0
  23. package/src/components/BarChart/helpers/index.ts +5 -2
  24. package/src/components/BarChart/helpers/tests/getBarHeights.test.ts +83 -0
  25. package/src/{hooks → components/BarChart/helpers}/useBarChart.ts +9 -46
  26. package/src/components/BoxPlot/BoxPlot.tsx +2 -1
  27. package/src/components/Brush/BrushChart.tsx +73 -0
  28. package/src/components/Brush/BrushController..tsx +39 -0
  29. package/src/components/DeviationBar.jsx +2 -2
  30. package/src/components/EditorPanel/EditorPanel.tsx +232 -147
  31. package/src/components/EditorPanel/components/Panels/Panel.General.tsx +36 -36
  32. package/src/components/EditorPanel/components/Panels/Panel.Series.tsx +52 -25
  33. package/src/components/EditorPanel/components/Panels/Panel.Visual.tsx +12 -4
  34. package/src/components/EditorPanel/components/Panels/panelVisual.styles.css +8 -0
  35. package/src/components/EditorPanel/useEditorPermissions.ts +5 -5
  36. package/src/components/ForestPlot/ForestPlot.tsx +2 -2
  37. package/src/components/HoverLine/HoverLine.tsx +74 -0
  38. package/src/components/Legend/Legend.Component.tsx +1 -1
  39. package/src/components/Legend/Legend.Suppression.tsx +59 -25
  40. package/src/components/Legend/helpers/createFormatLabels.tsx +28 -0
  41. package/src/components/Legend/helpers/index.ts +1 -1
  42. package/src/components/LineChart/LineChartProps.ts +3 -1
  43. package/src/components/LineChart/components/LineChart.Circle.tsx +72 -119
  44. package/src/components/LineChart/helpers.ts +133 -56
  45. package/src/components/LineChart/index.tsx +106 -55
  46. package/src/components/LinearChart.tsx +178 -198
  47. package/src/components/PairedBarChart.jsx +3 -2
  48. package/src/components/PieChart/PieChart.tsx +127 -102
  49. package/src/components/ScatterPlot/ScatterPlot.jsx +5 -0
  50. package/src/components/Sparkline/components/SparkLine.tsx +80 -18
  51. package/src/data/initial-state.js +11 -6
  52. package/src/helpers/countNumOfTicks.ts +1 -1
  53. package/src/helpers/dataHelpers.ts +23 -2
  54. package/src/helpers/getNewRuntime.ts +35 -0
  55. package/src/helpers/getPiePercent.ts +22 -0
  56. package/src/helpers/getTransformedData.ts +22 -0
  57. package/src/helpers/sizeHelpers.ts +1 -1
  58. package/src/helpers/tests/getNewRuntime.test.ts +82 -0
  59. package/src/helpers/tests/getPiePercent.test.ts +38 -0
  60. package/src/hooks/useMinMax.ts +21 -28
  61. package/src/hooks/useRightAxis.ts +5 -3
  62. package/src/hooks/useScales.ts +15 -6
  63. package/src/hooks/useTooltip.tsx +218 -203
  64. package/src/index.jsx +2 -2
  65. package/src/scss/main.scss +13 -6
  66. package/src/store/chart.actions.ts +2 -6
  67. package/src/store/chart.reducer.ts +23 -23
  68. package/src/types/ChartConfig.ts +11 -3
  69. package/src/types/ChartContext.ts +0 -2
  70. package/examples/private/DEV-8850-2.json +0 -493
  71. package/examples/private/DEV-9822.json +0 -574
  72. package/examples/private/DEV-9840.json +0 -553
  73. package/examples/private/DEV-9850-3.json +0 -461
  74. package/examples/private/chart.json +0 -1084
  75. package/examples/private/ci_formatted.json +0 -202
  76. package/examples/private/ci_issue.json +0 -3016
  77. package/examples/private/completed.json +0 -634
  78. package/examples/private/dem-data-long.csv +0 -20
  79. package/examples/private/dem-data-long.json +0 -36
  80. package/examples/private/demographic_data.csv +0 -157
  81. package/examples/private/demographic_data.json +0 -2654
  82. package/examples/private/demographic_dynamic.json +0 -443
  83. package/examples/private/demographic_standard.json +0 -560
  84. package/examples/private/ehdi.json +0 -29939
  85. package/examples/private/test.json +0 -493
  86. package/src/components/ZoomBrush.tsx +0 -251
@@ -1,574 +0,0 @@
1
- {
2
- "annotations": [],
3
- "type": "chart",
4
- "debugSvg": false,
5
- "chartMessage": {
6
- "noData": "No Data Available"
7
- },
8
- "title": "",
9
- "showTitle": true,
10
- "showDownloadMediaButton": false,
11
- "theme": "theme-blue",
12
- "animate": false,
13
- "fontSize": "medium",
14
- "lineDatapointStyle": "hover",
15
- "lineDatapointColor": "Same as Line",
16
- "barHasBorder": "false",
17
- "isLollipopChart": false,
18
- "lollipopShape": "circle",
19
- "lollipopColorStyle": "two-tone",
20
- "visualizationSubType": "regular",
21
- "barStyle": "",
22
- "roundingStyle": "standard",
23
- "tipRounding": "top",
24
- "isResponsiveTicks": false,
25
- "general": {
26
- "annotationDropdownText": "Annotations",
27
- "showDownloadButton": false,
28
- "showMissingDataLabel": true,
29
- "showSuppressedSymbol": true,
30
- "showZeroValueData": true,
31
- "hideNullValue": true
32
- },
33
- "padding": {
34
- "left": 5,
35
- "right": 5
36
- },
37
- "preliminaryData": [],
38
- "yAxis": {
39
- "hideAxis": false,
40
- "displayNumbersOnBar": false,
41
- "hideLabel": false,
42
- "hideTicks": false,
43
- "size": 50,
44
- "gridLines": false,
45
- "enablePadding": false,
46
- "min": "",
47
- "max": "",
48
- "labelColor": "#333",
49
- "tickLabelColor": "#333",
50
- "tickColor": "#333",
51
- "rightHideAxis": true,
52
- "rightAxisSize": 0,
53
- "rightLabel": "",
54
- "rightLabelOffsetSize": 0,
55
- "rightAxisLabelColor": "#333",
56
- "rightAxisTickLabelColor": "#333",
57
- "rightAxisTickColor": "#333",
58
- "numTicks": "",
59
- "axisPadding": 0,
60
- "scalePadding": 10,
61
- "tickRotation": 0,
62
- "anchors": [
63
- {
64
- "value": "7/15/2016",
65
- "color": "red",
66
- "lineStyle": "Dashed Medium"
67
- }
68
- ],
69
- "shoMissingDataLabel": true,
70
- "showMissingDataLine": true,
71
- "categories": [],
72
- "labelPlacement": "Below Bar"
73
- },
74
- "boxplot": {
75
- "plots": [],
76
- "borders": "true",
77
- "plotOutlierValues": false,
78
- "plotNonOutlierValues": true,
79
- "labels": {
80
- "q1": "Lower Quartile",
81
- "q2": "q2",
82
- "q3": "Upper Quartile",
83
- "q4": "q4",
84
- "minimum": "Minimum",
85
- "maximum": "Maximum",
86
- "mean": "Mean",
87
- "median": "Median",
88
- "sd": "Standard Deviation",
89
- "iqr": "Interquartile Range",
90
- "count": "Count",
91
- "outliers": "Outliers",
92
- "values": "Values",
93
- "lowerBounds": "Lower Bounds",
94
- "upperBounds": "Upper Bounds"
95
- }
96
- },
97
- "topAxis": {
98
- "hasLine": false
99
- },
100
- "isLegendValue": false,
101
- "barThickness": "0.37",
102
- "barHeight": 25,
103
- "barSpace": 15,
104
- "heights": {
105
- "vertical": 300,
106
- "horizontal": 1039.1999999999998
107
- },
108
- "xAxis": {
109
- "sortDates": false,
110
- "anchors": [],
111
- "type": "date",
112
- "showTargetLabel": true,
113
- "targetLabel": "Target",
114
- "hideAxis": false,
115
- "hideLabel": false,
116
- "hideTicks": false,
117
- "size": 75,
118
- "tickRotation": 0,
119
- "min": "",
120
- "max": "",
121
- "labelColor": "#333",
122
- "tickLabelColor": "#333",
123
- "tickColor": "#333",
124
- "numTicks": "",
125
- "labelOffset": 0,
126
- "axisPadding": 200,
127
- "target": 0,
128
- "maxTickRotation": 45,
129
- "padding": 5,
130
- "showYearsOnce": false,
131
- "sortByRecentDate": false,
132
- "dataKey": "Date",
133
- "dateParseFormat": "%m/%d/%Y",
134
- "dateDisplayFormat": "%m/%d/%Y",
135
- "axisBBox": 24.939998626708984,
136
- "tickWidthMax": 41
137
- },
138
- "table": {
139
- "label": "Data Table",
140
- "expanded": true,
141
- "limitHeight": false,
142
- "height": "",
143
- "caption": "",
144
- "showDownloadUrl": false,
145
- "showDataTableLink": true,
146
- "showDownloadLinkBelow": true,
147
- "indexLabel": "",
148
- "download": true,
149
- "showVertical": true,
150
- "dateDisplayFormat": "%m-%Y",
151
- "showMissingDataLabel": true,
152
- "showSuppressedSymbol": true,
153
- "show": true
154
- },
155
- "orientation": "horizontal",
156
- "color": "pinkpurple",
157
- "columns": {},
158
- "legend": {
159
- "hide": false,
160
- "behavior": "isolate",
161
- "axisAlign": true,
162
- "singleRow": true,
163
- "colorCode": "",
164
- "reverseLabelOrder": false,
165
- "description": "",
166
- "dynamicLegend": false,
167
- "dynamicLegendDefaultText": "Show All",
168
- "dynamicLegendItemLimit": 5,
169
- "dynamicLegendItemLimitMessage": "Dynamic Legend Item Limit Hit.",
170
- "dynamicLegendChartMessage": "Select Options from the Legend",
171
- "label": "",
172
- "lineMode": false,
173
- "verticalSorted": false,
174
- "highlightOnHover": false,
175
- "hideSuppressedLabels": false,
176
- "hideSuppressionLink": false,
177
- "seriesHighlight": [],
178
- "style": "circles",
179
- "subStyle": "linear blocks",
180
- "tickRotation": "",
181
- "hideBorder": {
182
- "side": false,
183
- "topBottom": true
184
- },
185
- "position": "right"
186
- },
187
- "brush": {
188
- "height": 45,
189
- "active": false
190
- },
191
- "exclusions": {
192
- "active": false,
193
- "keys": []
194
- },
195
- "palette": "qualitative-bold",
196
- "isPaletteReversed": false,
197
- "twoColor": {
198
- "palette": "monochrome-1",
199
- "isPaletteReversed": false
200
- },
201
- "labels": false,
202
- "dataFormat": {
203
- "commas": false,
204
- "prefix": "",
205
- "suffix": "",
206
- "abbreviated": false,
207
- "bottomSuffix": "",
208
- "bottomPrefix": "",
209
- "bottomAbbreviated": false
210
- },
211
- "confidenceKeys": {},
212
- "visual": {
213
- "border": true,
214
- "accent": true,
215
- "background": true,
216
- "verticalHoverLine": false,
217
- "horizontalHoverLine": false
218
- },
219
- "useLogScale": false,
220
- "filterBehavior": "Filter Change",
221
- "highlightedBarValues": [],
222
- "series": [
223
- {
224
- "dataKey": "Data 2",
225
- "type": "Bar",
226
- "axis": "Left",
227
- "tooltip": true
228
- },
229
- {
230
- "dataKey": "Data 4",
231
- "type": "Bar",
232
- "axis": "Left",
233
- "tooltip": true
234
- }
235
- ],
236
- "tooltips": {
237
- "opacity": 90,
238
- "singleSeries": false,
239
- "dateDisplayFormat": ""
240
- },
241
- "forestPlot": {
242
- "startAt": 0,
243
- "colors": {
244
- "line": "",
245
- "shape": ""
246
- },
247
- "lineOfNoEffect": {
248
- "show": true
249
- },
250
- "type": "",
251
- "pooledResult": {
252
- "diamondHeight": 5,
253
- "column": ""
254
- },
255
- "estimateField": "",
256
- "estimateRadius": "",
257
- "shape": "square",
258
- "rowHeight": 20,
259
- "description": {
260
- "show": true,
261
- "text": "description",
262
- "location": 0
263
- },
264
- "result": {
265
- "show": true,
266
- "text": "result",
267
- "location": 100
268
- },
269
- "radius": {
270
- "min": 2,
271
- "max": 10,
272
- "scalingColumn": ""
273
- },
274
- "regression": {
275
- "lower": 0,
276
- "upper": 0,
277
- "estimateField": 0
278
- },
279
- "leftWidthOffset": 0,
280
- "rightWidthOffset": 0,
281
- "showZeroLine": false,
282
- "leftLabel": "",
283
- "rightLabel": ""
284
- },
285
- "area": {
286
- "isStacked": false
287
- },
288
- "sankey": {
289
- "title": {
290
- "defaultColor": "black"
291
- },
292
- "iterations": 1,
293
- "rxValue": 0.9,
294
- "overallSize": {
295
- "width": 900,
296
- "height": 700
297
- },
298
- "margin": {
299
- "margin_y": 25,
300
- "margin_x": 0
301
- },
302
- "nodeSize": {
303
- "nodeWidth": 26,
304
- "nodeHeight": 40
305
- },
306
- "nodePadding": 55,
307
- "nodeFontColor": "black",
308
- "nodeColor": {
309
- "default": "#ff8500",
310
- "inactive": "#808080"
311
- },
312
- "linkColor": {
313
- "default": "#ffc900",
314
- "inactive": "#D3D3D3"
315
- },
316
- "opacity": {
317
- "nodeOpacityDefault": 1,
318
- "nodeOpacityInactive": 0.1,
319
- "LinkOpacityDefault": 1,
320
- "LinkOpacityInactive": 0.1
321
- },
322
- "storyNodeFontColor": "#006778",
323
- "storyNodeText": [],
324
- "nodeValueStyle": {
325
- "textBefore": "(",
326
- "textAfter": ")"
327
- },
328
- "data": []
329
- },
330
- "errors": [],
331
- "currentViewport": "lg",
332
- "id": 1,
333
- "category": "Charts",
334
- "label": "Bar",
335
- "subType": "Bar",
336
- "icon": {
337
- "key": null,
338
- "ref": null,
339
- "props": {},
340
- "_owner": null
341
- },
342
- "content": "Use bars to show comparisons between data categories.",
343
- "visualizationType": "Bar",
344
- "datasets": {},
345
- "activeVizButtonID": 1,
346
- "data": [
347
- {
348
- "Date": "1/15/2016",
349
- "Data 1": "900",
350
- "Data 2": "135",
351
- "Data 3": "300",
352
- "Data 4": "95",
353
- "Data 5": "120",
354
- "Data 6": "310"
355
- },
356
- {
357
- "Date": "2/15/2016",
358
- "Data 1": "4000",
359
- "Data 2": "90",
360
- "Data 3": "240",
361
- "Data 4": "60",
362
- "Data 5": "160",
363
- "Data 6": "2000"
364
- },
365
- {
366
- "Date": "3/15/2016",
367
- "Data 1": "500",
368
- "Data 2": "300",
369
- "Data 3": "290",
370
- "Data 4": "100",
371
- "Data 5": "200",
372
- "Data 6": "250"
373
- },
374
- {
375
- "Date": "4/15/2016",
376
- "Data 1": "1200",
377
- "Data 2": "160",
378
- "Data 3": "230",
379
- "Data 4": "180",
380
- "Data 5": "160",
381
- "Data 6": "220"
382
- },
383
- {
384
- "Date": "5/15/2016",
385
- "Data 1": "8000",
386
- "Data 2": "350",
387
- "Data 3": "300",
388
- "Data 4": "150",
389
- "Data 5": "130",
390
- "Data 6": "100"
391
- },
392
- {
393
- "Date": "6/15/2016",
394
- "Data 1": "9000",
395
- "Data 2": "220",
396
- "Data 3": "320",
397
- "Data 4": "100",
398
- "Data 5": "220",
399
- "Data 6": "300"
400
- },
401
- {
402
- "Date": "7/15/2016",
403
- "Data 1": "900",
404
- "Data 2": "235",
405
- "Data 3": "300",
406
- "Data 4": "195",
407
- "Data 5": "120",
408
- "Data 6": "610"
409
- },
410
- {
411
- "Date": "8/15/2016",
412
- "Data 1": "3000",
413
- "Data 2": "900",
414
- "Data 3": "540",
415
- "Data 4": "600",
416
- "Data 5": "120",
417
- "Data 6": "200"
418
- },
419
- {
420
- "Date": "9/15/2016",
421
- "Data 1": "700",
422
- "Data 2": "200",
423
- "Data 3": "590",
424
- "Data 4": "900",
425
- "Data 5": "400",
426
- "Data 6": "650"
427
- },
428
- {
429
- "Date": "10/15/2016",
430
- "Data 1": "2200",
431
- "Data 2": "360",
432
- "Data 3": "930",
433
- "Data 4": "880",
434
- "Data 5": "760",
435
- "Data 6": "420"
436
- },
437
- {
438
- "Date": "11/15/2016",
439
- "Data 1": "5000",
440
- "Data 2": "1350",
441
- "Data 3": "300",
442
- "Data 4": "1150",
443
- "Data 5": "230",
444
- "Data 6": "600"
445
- },
446
- {
447
- "Date": "12/15/2016",
448
- "Data 1": "6000",
449
- "Data 2": "3220",
450
- "Data 3": "540",
451
- "Data 4": "300",
452
- "Data 5": "720",
453
- "Data 6": "3000"
454
- }
455
- ],
456
- "dataFileName": "valid-area-chart.json",
457
- "dataFileSourceType": "file",
458
- "formattedData": [
459
- {
460
- "Date": "1/15/2016",
461
- "Data 1": "900",
462
- "Data 2": "135",
463
- "Data 3": "300",
464
- "Data 4": "95",
465
- "Data 5": "120",
466
- "Data 6": "310"
467
- },
468
- {
469
- "Date": "2/15/2016",
470
- "Data 1": "4000",
471
- "Data 2": "90",
472
- "Data 3": "240",
473
- "Data 4": "60",
474
- "Data 5": "160",
475
- "Data 6": "2000"
476
- },
477
- {
478
- "Date": "3/15/2016",
479
- "Data 1": "500",
480
- "Data 2": "300",
481
- "Data 3": "290",
482
- "Data 4": "100",
483
- "Data 5": "200",
484
- "Data 6": "250"
485
- },
486
- {
487
- "Date": "4/15/2016",
488
- "Data 1": "1200",
489
- "Data 2": "160",
490
- "Data 3": "230",
491
- "Data 4": "180",
492
- "Data 5": "160",
493
- "Data 6": "220"
494
- },
495
- {
496
- "Date": "5/15/2016",
497
- "Data 1": "8000",
498
- "Data 2": "350",
499
- "Data 3": "300",
500
- "Data 4": "150",
501
- "Data 5": "130",
502
- "Data 6": "100"
503
- },
504
- {
505
- "Date": "6/15/2016",
506
- "Data 1": "9000",
507
- "Data 2": "220",
508
- "Data 3": "320",
509
- "Data 4": "100",
510
- "Data 5": "220",
511
- "Data 6": "300"
512
- },
513
- {
514
- "Date": "7/15/2016",
515
- "Data 1": "900",
516
- "Data 2": "235",
517
- "Data 3": "300",
518
- "Data 4": "195",
519
- "Data 5": "120",
520
- "Data 6": "610"
521
- },
522
- {
523
- "Date": "8/15/2016",
524
- "Data 1": "3000",
525
- "Data 2": "900",
526
- "Data 3": "540",
527
- "Data 4": "600",
528
- "Data 5": "120",
529
- "Data 6": "200"
530
- },
531
- {
532
- "Date": "9/15/2016",
533
- "Data 1": "700",
534
- "Data 2": "200",
535
- "Data 3": "590",
536
- "Data 4": "900",
537
- "Data 5": "400",
538
- "Data 6": "650"
539
- },
540
- {
541
- "Date": "10/15/2016",
542
- "Data 1": "2200",
543
- "Data 2": "360",
544
- "Data 3": "930",
545
- "Data 4": "880",
546
- "Data 5": "760",
547
- "Data 6": "420"
548
- },
549
- {
550
- "Date": "11/15/2016",
551
- "Data 1": "5000",
552
- "Data 2": "1350",
553
- "Data 3": "300",
554
- "Data 4": "1150",
555
- "Data 5": "230",
556
- "Data 6": "600"
557
- },
558
- {
559
- "Date": "12/15/2016",
560
- "Data 1": "6000",
561
- "Data 2": "3220",
562
- "Data 3": "540",
563
- "Data 4": "300",
564
- "Data 5": "720",
565
- "Data 6": "3000"
566
- }
567
- ],
568
- "dataDescription": {
569
- "horizontal": false,
570
- "series": false
571
- },
572
- "version": "4.24.10",
573
- "dynamicMarginTop": 0
574
- }