@cdc/chart 4.24.1 → 4.24.3

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 (82) hide show
  1. package/dist/cdcchart.js +48948 -37923
  2. package/examples/{private/combo.json → chart-regression-1.json} +40 -31
  3. package/examples/chart-regression-2.json +2360 -0
  4. package/examples/feature/filters/url-filter.json +1076 -0
  5. package/examples/feature/line/line-chart-preliminary.json +84 -37
  6. package/examples/feature/line/line-chart.json +2 -1
  7. package/examples/feature/regions/index.json +55 -5
  8. package/examples/feature/sankey/sankey-example-data.json +1364 -0
  9. package/examples/feature/sankey/sankey_chart_data.csv +20 -0
  10. package/examples/gallery/bar-chart-vertical/vertical-bar-chart-stacked.json +306 -19
  11. package/examples/sparkline.json +868 -0
  12. package/index.html +128 -121
  13. package/package.json +4 -2
  14. package/src/CdcChart.tsx +73 -38
  15. package/src/_stories/ChartEditor.stories.tsx +15 -4
  16. package/src/_stories/_mock/pie_config.json +4 -3
  17. package/src/_stories/_mock/url_filter.json +1076 -0
  18. package/src/components/AreaChart/components/AreaChart.Stacked.jsx +2 -1
  19. package/src/components/AreaChart/components/AreaChart.jsx +2 -25
  20. package/src/components/BarChart/components/BarChart.Horizontal.tsx +39 -49
  21. package/src/components/BarChart/components/BarChart.StackedHorizontal.tsx +36 -56
  22. package/src/components/BarChart/components/BarChart.StackedVertical.tsx +36 -41
  23. package/src/components/BarChart/components/BarChart.Vertical.tsx +48 -64
  24. package/src/components/BoxPlot/BoxPlot.jsx +11 -9
  25. package/src/components/DeviationBar.jsx +3 -3
  26. package/src/components/EditorPanel/EditorPanel.tsx +1717 -1961
  27. package/src/components/EditorPanel/EditorPanelContext.ts +40 -0
  28. package/src/components/EditorPanel/components/Panels/Panel.BoxPlot.tsx +148 -0
  29. package/src/components/EditorPanel/components/{Panel.ForestPlotSettings.tsx → Panels/Panel.ForestPlotSettings.tsx} +16 -7
  30. package/src/components/EditorPanel/components/Panels/Panel.General.tsx +160 -0
  31. package/src/components/EditorPanel/components/{Panel.Regions.tsx → Panels/Panel.Regions.tsx} +6 -6
  32. package/src/components/EditorPanel/components/Panels/Panel.Sankey.tsx +108 -0
  33. package/src/components/EditorPanel/components/{Panel.Series.tsx → Panels/Panel.Series.tsx} +50 -6
  34. package/src/components/EditorPanel/components/Panels/Panel.Visual.tsx +338 -0
  35. package/src/components/EditorPanel/components/Panels/index.tsx +19 -0
  36. package/src/components/EditorPanel/components/panels.scss +11 -0
  37. package/src/components/EditorPanel/editor-panel.scss +1 -13
  38. package/src/components/EditorPanel/useEditorPermissions.js +44 -13
  39. package/src/components/Legend/Legend.Component.tsx +207 -0
  40. package/src/components/Legend/Legend.tsx +8 -327
  41. package/src/components/Legend/helpers/createFormatLabels.tsx +140 -0
  42. package/src/components/LineChart/LineChartProps.ts +2 -1
  43. package/src/components/LineChart/components/LineChart.Circle.tsx +85 -52
  44. package/src/components/LineChart/helpers.ts +3 -3
  45. package/src/components/LineChart/index.tsx +99 -23
  46. package/src/components/LinearChart.jsx +12 -33
  47. package/src/components/PairedBarChart.jsx +10 -12
  48. package/src/components/PieChart/PieChart.tsx +80 -27
  49. package/src/components/Regions/components/Regions.tsx +120 -69
  50. package/src/components/Sankey/index.tsx +434 -0
  51. package/src/components/Sankey/sankey.scss +153 -0
  52. package/src/components/Sankey/types/index.ts +16 -0
  53. package/src/components/ScatterPlot/ScatterPlot.jsx +1 -0
  54. package/src/components/Sparkline/{SparkLine.jsx → components/SparkLine.tsx} +14 -30
  55. package/src/components/Sparkline/index.scss +3 -0
  56. package/src/components/Sparkline/index.tsx +1 -1
  57. package/src/components/ZoomBrush.tsx +2 -1
  58. package/src/data/initial-state.js +51 -4
  59. package/src/helpers/computeMarginBottom.ts +4 -3
  60. package/src/helpers/tests/computeMarginBottom.test.ts +2 -1
  61. package/src/hooks/useBarChart.js +5 -2
  62. package/src/hooks/useHighlightedBars.js +1 -1
  63. package/src/hooks/useMinMax.ts +3 -3
  64. package/src/hooks/useScales.ts +28 -18
  65. package/src/hooks/useTooltip.tsx +19 -14
  66. package/src/scss/main.scss +8 -96
  67. package/src/types/ChartConfig.ts +47 -20
  68. package/src/types/ChartContext.ts +17 -4
  69. package/src/types/Label.ts +7 -0
  70. package/examples/private/chart-t.json +0 -3740
  71. package/examples/private/epi-data.csv +0 -13
  72. package/examples/private/epi-data.json +0 -62
  73. package/examples/private/epi.json +0 -403
  74. package/examples/private/occupancy.json +0 -109283
  75. package/examples/private/prod-line-config.json +0 -401
  76. package/examples/private/region-data.json +0 -822
  77. package/examples/private/region-testing.json +0 -312
  78. package/examples/private/scaling.json +0 -45325
  79. package/examples/private/testing-data.json +0 -1739
  80. package/examples/private/testing.json +0 -816
  81. package/src/components/EditorPanel/components/Panel.DateHighlighting.tsx +0 -109
  82. package/src/components/EditorPanel/components/Panels.tsx +0 -13
@@ -1,401 +0,0 @@
1
- {
2
- "type": "chart",
3
- "debugSvg": false,
4
- "chartMessage": {
5
- "noData": "No Data Available"
6
- },
7
- "title": "Example Line Chart",
8
- "showTitle": true,
9
- "showDownloadMediaButton": false,
10
- "theme": "theme-green",
11
- "animate": true,
12
- "fontSize": "medium",
13
- "lineDatapointStyle": "hover",
14
- "lineDatapointColor": "Same as Line",
15
- "barHasBorder": "false",
16
- "isLollipopChart": false,
17
- "lollipopShape": "circle",
18
- "lollipopColorStyle": "two-tone",
19
- "visualizationSubType": "regular",
20
- "barStyle": "",
21
- "roundingStyle": "standard",
22
- "tipRounding": "top",
23
- "isResponsiveTicks": false,
24
- "general": {
25
- "showDownloadButton": false
26
- },
27
- "padding": {
28
- "left": 5,
29
- "right": 5
30
- },
31
- "suppressedData": [],
32
- "preliminaryData": [],
33
- "yAxis": {
34
- "hideAxis": false,
35
- "displayNumbersOnBar": false,
36
- "hideLabel": false,
37
- "hideTicks": false,
38
- "size": "75",
39
- "gridLines": false,
40
- "enablePadding": false,
41
- "min": "",
42
- "max": "",
43
- "labelColor": "#333",
44
- "tickLabelColor": "#333",
45
- "tickColor": "#333",
46
- "rightHideAxis": true,
47
- "rightAxisSize": 0,
48
- "rightLabel": "",
49
- "rightLabelOffsetSize": 0,
50
- "rightAxisLabelColor": "#333",
51
- "rightAxisTickLabelColor": "#333",
52
- "rightAxisTickColor": "#333",
53
- "numTicks": "9",
54
- "axisPadding": 0,
55
- "tickRotation": 0,
56
- "anchors": [],
57
- "label": "Y-Axis Example Label"
58
- },
59
- "boxplot": {
60
- "plots": [],
61
- "borders": "true",
62
- "firstQuartilePercentage": 25,
63
- "thirdQuartilePercentage": 75,
64
- "boxWidthPercentage": 40,
65
- "plotOutlierValues": false,
66
- "plotNonOutlierValues": true,
67
- "legend": {
68
- "showHowToReadText": false,
69
- "howToReadText": ""
70
- },
71
- "labels": {
72
- "q1": "Lower Quartile",
73
- "q2": "q2",
74
- "q3": "Upper Quartile",
75
- "q4": "q4",
76
- "minimum": "Minimum",
77
- "maximum": "Maximum",
78
- "mean": "Mean",
79
- "median": "Median",
80
- "sd": "Standard Deviation",
81
- "iqr": "Interquartile Range",
82
- "total": "Total",
83
- "outliers": "Outliers",
84
- "values": "Values",
85
- "lowerBounds": "Lower Bounds",
86
- "upperBounds": "Upper Bounds"
87
- }
88
- },
89
- "topAxis": {
90
- "hasLine": false
91
- },
92
- "isLegendValue": false,
93
- "barThickness": 0.35,
94
- "barHeight": 25,
95
- "barSpace": 15,
96
- "heights": {
97
- "vertical": 300,
98
- "horizontal": 750
99
- },
100
- "xAxis": {
101
- "sortDates": false,
102
- "anchors": [],
103
- "type": "date",
104
- "showTargetLabel": true,
105
- "targetLabel": "Target",
106
- "hideAxis": false,
107
- "hideLabel": false,
108
- "hideTicks": false,
109
- "size": "77",
110
- "tickRotation": "25",
111
- "min": "",
112
- "max": "",
113
- "labelColor": "#333",
114
- "tickLabelColor": "#333",
115
- "tickColor": "#333",
116
- "numTicks": "",
117
- "labelOffset": 65,
118
- "axisPadding": 0,
119
- "target": 0,
120
- "maxTickRotation": 0,
121
- "dataKey": "Date",
122
- "label": "X-Axis Example Label",
123
- "dateParseFormat": "%m/%d/%Y",
124
- "dateDisplayFormat": "%m/%d/%Y",
125
- "tickWidthMax": 91
126
- },
127
- "table": {
128
- "label": "Data Table",
129
- "expanded": true,
130
- "limitHeight": false,
131
- "height": "",
132
- "caption": "",
133
- "showDownloadUrl": false,
134
- "showDataTableLink": true,
135
- "indexLabel": "",
136
- "download": true,
137
- "showVertical": false,
138
- "show": true
139
- },
140
- "orientation": "vertical",
141
- "color": "pinkpurple",
142
- "columns": {},
143
- "legend": {
144
- "hide": false,
145
- "behavior": "isolate",
146
- "singleRow": true,
147
- "colorCode": "",
148
- "reverseLabelOrder": false,
149
- "description": "",
150
- "dynamicLegend": false,
151
- "dynamicLegendDefaultText": "Show All",
152
- "dynamicLegendItemLimit": 5,
153
- "dynamicLegendItemLimitMessage": "Dynamic Legend Item Limit Hit.",
154
- "dynamicLegendChartMessage": "Select Options from the Legend",
155
- "lineMode": false,
156
- "verticalSorted": false,
157
- "highlightOnHover": false,
158
- "position": "right",
159
- "label": "Type of Data"
160
- },
161
- "brush": {
162
- "height": 25,
163
- "data": [
164
- {
165
- "Date": "1/15/2016",
166
- "Data 1": "90",
167
- "Data 2": "135",
168
- "Data 3": "300",
169
- "Data 4": "95",
170
- "Data 5": "120",
171
- "Data 6": "310"
172
- },
173
- {
174
- "Date": "2/15/2016",
175
- "Data 1": "40",
176
- "Data 2": "90",
177
- "Data 3": "240",
178
- "Data 4": "60",
179
- "Data 5": "160",
180
- "Data 6": "200"
181
- },
182
- {
183
- "Date": "3/15/2016",
184
- "Data 1": "50",
185
- "Data 2": "300",
186
- "Data 3": "290",
187
- "Data 4": "100",
188
- "Data 5": "200",
189
- "Data 6": "250"
190
- },
191
- {
192
- "Date": "4/15/2016",
193
- "Data 1": "120",
194
- "Data 2": "160",
195
- "Data 3": "230",
196
- "Data 4": "180",
197
- "Data 5": "160",
198
- "Data 6": "220"
199
- },
200
- {
201
- "Date": "5/15/2016",
202
- "Data 1": "80",
203
- "Data 2": "350",
204
- "Data 3": "300",
205
- "Data 4": "150",
206
- "Data 5": "130",
207
- "Data 6": "100"
208
- },
209
- {
210
- "Date": "6/15/2016",
211
- "Data 1": "90",
212
- "Data 2": "220",
213
- "Data 3": "320",
214
- "Data 4": "100",
215
- "Data 5": "220",
216
- "Data 6": "300"
217
- }
218
- ],
219
- "active": false
220
- },
221
- "exclusions": {
222
- "active": false,
223
- "keys": []
224
- },
225
- "palette": "qualitative-bold",
226
- "isPaletteReversed": false,
227
- "twoColor": {
228
- "palette": "monochrome-1",
229
- "isPaletteReversed": false
230
- },
231
- "labels": false,
232
- "dataFormat": {
233
- "commas": false,
234
- "prefix": "",
235
- "suffix": "",
236
- "abbreviated": false,
237
- "bottomSuffix": "",
238
- "bottomPrefix": "",
239
- "bottomAbbreviated": false
240
- },
241
- "confidenceKeys": {},
242
- "visual": {
243
- "border": true,
244
- "accent": true,
245
- "background": true,
246
- "verticalHoverLine": false,
247
- "horizontalHoverLine": false
248
- },
249
- "useLogScale": false,
250
- "filterBehavior": "Filter Change",
251
- "highlightedBarValues": [],
252
- "series": [
253
- {
254
- "dataKey": "Data 1",
255
- "type": "Bar",
256
- "tooltip": true,
257
- "axis": "Left"
258
- },
259
- {
260
- "dataKey": "Data 2",
261
- "type": "Bar",
262
- "tooltip": true,
263
- "axis": "Left"
264
- },
265
- {
266
- "dataKey": "Data 3",
267
- "type": "Bar",
268
- "tooltip": true,
269
- "axis": "Left"
270
- },
271
- {
272
- "dataKey": "Data 4",
273
- "type": "Bar",
274
- "tooltip": true,
275
- "axis": "Left"
276
- },
277
- {
278
- "dataKey": "Data 5",
279
- "type": "Bar",
280
- "tooltip": true,
281
- "axis": "Left"
282
- },
283
- {
284
- "dataKey": "Data 6",
285
- "type": "Bar",
286
- "tooltip": true,
287
- "axis": "Left"
288
- }
289
- ],
290
- "tooltips": {
291
- "opacity": 90,
292
- "singleSeries": false
293
- },
294
- "forestPlot": {
295
- "startAt": 0,
296
- "colors": {
297
- "line": "",
298
- "shape": ""
299
- },
300
- "lineOfNoEffect": {
301
- "show": true
302
- },
303
- "type": "",
304
- "pooledResult": {
305
- "diamondHeight": 5,
306
- "column": ""
307
- },
308
- "estimateField": "",
309
- "estimateRadius": "",
310
- "shape": "square",
311
- "rowHeight": 20,
312
- "description": {
313
- "show": true,
314
- "text": "description",
315
- "location": 0
316
- },
317
- "result": {
318
- "show": true,
319
- "text": "result",
320
- "location": 100
321
- },
322
- "radius": {
323
- "min": 2,
324
- "max": 10,
325
- "scalingColumn": ""
326
- },
327
- "regression": {
328
- "lower": 0,
329
- "upper": 0,
330
- "estimateField": 0
331
- },
332
- "leftWidthOffset": 0,
333
- "rightWidthOffset": 0,
334
- "showZeroLine": false,
335
- "leftLabel": "",
336
- "rightLabel": ""
337
- },
338
- "area": {
339
- "isStacked": false
340
- },
341
- "height": "375",
342
- "data": [
343
- {
344
- "Date": "1/15/2016",
345
- "Data 1": "90",
346
- "Data 2": "135",
347
- "Data 3": "300",
348
- "Data 4": "95",
349
- "Data 5": "120",
350
- "Data 6": "310"
351
- },
352
- {
353
- "Date": "2/15/2016",
354
- "Data 1": "40",
355
- "Data 2": "90",
356
- "Data 3": "240",
357
- "Data 4": "60",
358
- "Data 5": "160",
359
- "Data 6": "200"
360
- },
361
- {
362
- "Date": "3/15/2016",
363
- "Data 1": "50",
364
- "Data 2": "300",
365
- "Data 3": "290",
366
- "Data 4": "100",
367
- "Data 5": "200",
368
- "Data 6": "250"
369
- },
370
- {
371
- "Date": "4/15/2016",
372
- "Data 1": "120",
373
- "Data 2": "160",
374
- "Data 3": "230",
375
- "Data 4": "180",
376
- "Data 5": "160",
377
- "Data 6": "220"
378
- },
379
- {
380
- "Date": "5/15/2016",
381
- "Data 1": "80",
382
- "Data 2": "350",
383
- "Data 3": "300",
384
- "Data 4": "150",
385
- "Data 5": "130",
386
- "Data 6": "100"
387
- },
388
- {
389
- "Date": "6/15/2016",
390
- "Data 1": "90",
391
- "Data 2": "220",
392
- "Data 3": "320",
393
- "Data 4": "100",
394
- "Data 5": "220",
395
- "Data 6": "300"
396
- }
397
- ],
398
- "visualizationType": "Line",
399
- "validated": 4.23,
400
- "dynamicMarginTop": 0
401
- }