@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,13 +0,0 @@
1
- Population,Subgroup,Estimate
2
- Age group (years),18-44,"1,161,000"
3
- Age group (years),45-64,"1,061,000"
4
- Age group (years),>=65,"643,000"
5
- Sex,Men,"1,214,000"
6
- Sex,Women,"1,651,000"
7
- Race/Ethnicity,Hispanic,"382,000"
8
- Race/Ethnicity,Non-Hispanic White,"1,870,000"
9
- Race/Ethnicity,Non-Hispanic Black,"473,000"
10
- Race/Ethnicity,Non-Hispanic other,"140,000"
11
- Educational level,<High School or GED*,"448,000"
12
- Educational level,High School or GED*,"1,020,000"
13
- Educational level,>= some college,"1,366,000"
@@ -1,62 +0,0 @@
1
- [
2
- {
3
- "Population": "Age group (years)",
4
- "Subgroup": "18-44",
5
- "Estimate": "1,161,000"
6
- },
7
- {
8
- "Population": "Age group (years)",
9
- "Subgroup": "45-64",
10
- "Estimate": "1,061,000"
11
- },
12
- {
13
- "Population": "Age group (years)",
14
- "Subgroup": ">=65",
15
- "Estimate": "643,000"
16
- },
17
- {
18
- "Population": "Sex",
19
- "Subgroup": "Men",
20
- "Estimate": "1,214,000"
21
- },
22
- {
23
- "Population": "Sex",
24
- "Subgroup": "Women",
25
- "Estimate": "1,651,000"
26
- },
27
- {
28
- "Population": "Race/Ethnicity",
29
- "Subgroup": "Hispanic",
30
- "Estimate": "382,000"
31
- },
32
- {
33
- "Population": "Race/Ethnicity",
34
- "Subgroup": "Non-Hispanic White",
35
- "Estimate": "1,870,000"
36
- },
37
- {
38
- "Population": "Race/Ethnicity",
39
- "Subgroup": "Non-Hispanic Black",
40
- "Estimate": "473,000"
41
- },
42
- {
43
- "Population": "Race/Ethnicity",
44
- "Subgroup": "Non-Hispanic other",
45
- "Estimate": "140,000"
46
- },
47
- {
48
- "Population": "Educational level",
49
- "Subgroup": "<High School or GED*",
50
- "Estimate": "448,000"
51
- },
52
- {
53
- "Population": "Educational level",
54
- "Subgroup": "High School or GED*",
55
- "Estimate": "1,020,000"
56
- },
57
- {
58
- "Population": "Educational level",
59
- "Subgroup": ">= some college",
60
- "Estimate": "1,366,000"
61
- }
62
- ]
@@ -1,403 +0,0 @@
1
- {
2
- "type": "chart",
3
- "debugSvg": false,
4
- "chartMessage": {
5
- "noData": "No Data Available"
6
- },
7
- "title": "Number of people with active epilepsy in the US (2021 NHIS)",
8
- "showTitle": true,
9
- "showDownloadMediaButton": false,
10
- "theme": "theme-blue",
11
- "animate": false,
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
- "yAxis": {
33
- "hideAxis": false,
34
- "displayNumbersOnBar": false,
35
- "hideLabel": false,
36
- "hideTicks": false,
37
- "size": 50,
38
- "gridLines": false,
39
- "enablePadding": false,
40
- "min": "",
41
- "max": "",
42
- "labelColor": "#333",
43
- "tickLabelColor": "#333",
44
- "tickColor": "#333",
45
- "rightHideAxis": true,
46
- "rightAxisSize": 0,
47
- "rightLabel": "",
48
- "rightLabelOffsetSize": 0,
49
- "rightAxisLabelColor": "#333",
50
- "rightAxisTickLabelColor": "#333",
51
- "rightAxisTickColor": "#333",
52
- "numTicks": "",
53
- "axisPadding": 0,
54
- "tickRotation": 0,
55
- "anchors": [],
56
- "label": "Estimate"
57
- },
58
- "boxplot": {
59
- "plots": [],
60
- "borders": "true",
61
- "firstQuartilePercentage": 25,
62
- "thirdQuartilePercentage": 75,
63
- "boxWidthPercentage": 40,
64
- "plotOutlierValues": false,
65
- "plotNonOutlierValues": true,
66
- "legend": {
67
- "showHowToReadText": false,
68
- "howToReadText": ""
69
- },
70
- "labels": {
71
- "q1": "Lower Quartile",
72
- "q2": "q2",
73
- "q3": "Upper Quartile",
74
- "q4": "q4",
75
- "minimum": "Minimum",
76
- "maximum": "Maximum",
77
- "mean": "Mean",
78
- "median": "Median",
79
- "sd": "Standard Deviation",
80
- "iqr": "Interquartile Range",
81
- "total": "Total",
82
- "outliers": "Outliers",
83
- "values": "Values",
84
- "lowerBounds": "Lower Bounds",
85
- "upperBounds": "Upper Bounds"
86
- }
87
- },
88
- "topAxis": {
89
- "hasLine": false
90
- },
91
- "isLegendValue": false,
92
- "barThickness": 0.35,
93
- "barHeight": 25,
94
- "barSpace": 15,
95
- "heights": {
96
- "vertical": 300,
97
- "horizontal": 750
98
- },
99
- "xAxis": {
100
- "sortDates": false,
101
- "anchors": [],
102
- "type": "categorical",
103
- "showTargetLabel": true,
104
- "targetLabel": "Target",
105
- "hideAxis": false,
106
- "hideLabel": false,
107
- "hideTicks": false,
108
- "size": 75,
109
- "tickRotation": 0,
110
- "min": "",
111
- "max": "",
112
- "labelColor": "#333",
113
- "tickLabelColor": "#333",
114
- "tickColor": "#333",
115
- "numTicks": "",
116
- "labelOffset": 65,
117
- "axisPadding": 0,
118
- "target": 0,
119
- "maxTickRotation": 0,
120
- "dataKey": "Subgroup",
121
- "tickWidthMax": null,
122
- "label": "Subgroup"
123
- },
124
- "table": {
125
- "label": "Data Table",
126
- "expanded": true,
127
- "limitHeight": false,
128
- "height": "",
129
- "caption": "",
130
- "showDownloadUrl": false,
131
- "showDataTableLink": true,
132
- "indexLabel": "",
133
- "download": false,
134
- "showVertical": true,
135
- "show": false
136
- },
137
- "orientation": "vertical",
138
- "color": "pinkpurple",
139
- "columns": {},
140
- "legend": {
141
- "hide": false,
142
- "behavior": "isolate",
143
- "singleRow": false,
144
- "colorCode": "",
145
- "reverseLabelOrder": false,
146
- "description": "",
147
- "dynamicLegend": false,
148
- "dynamicLegendDefaultText": "Show All",
149
- "dynamicLegendItemLimit": 5,
150
- "dynamicLegendItemLimitMessage": "Dynamic Legend Item Limit Hit.",
151
- "dynamicLegendChartMessage": "Select Options from the Legend",
152
- "lineMode": false,
153
- "verticalSorted": false,
154
- "highlightOnHover": false
155
- },
156
- "data": [
157
- {
158
- "Population": "Age group (years)",
159
- "Subgroup": "18-44",
160
- "Estimate": "1,161,000"
161
- },
162
- {
163
- "Population": "Age group (years)",
164
- "Subgroup": "45-64",
165
- "Estimate": "1,061,000"
166
- },
167
- {
168
- "Population": "Age group (years)",
169
- "Subgroup": ">=65",
170
- "Estimate": "643,000"
171
- },
172
- {
173
- "Population": "Sex",
174
- "Subgroup": "Men",
175
- "Estimate": "1,214,000"
176
- },
177
- {
178
- "Population": "Sex",
179
- "Subgroup": "Women",
180
- "Estimate": "1,651,000"
181
- },
182
- {
183
- "Population": "Race/Ethnicity",
184
- "Subgroup": "Hispanic",
185
- "Estimate": "382,000"
186
- },
187
- {
188
- "Population": "Race/Ethnicity",
189
- "Subgroup": "Non-Hispanic White",
190
- "Estimate": "1,870,000"
191
- },
192
- {
193
- "Population": "Race/Ethnicity",
194
- "Subgroup": "Non-Hispanic Black",
195
- "Estimate": "473,000"
196
- },
197
- {
198
- "Population": "Race/Ethnicity",
199
- "Subgroup": "Non-Hispanic other",
200
- "Estimate": "140,000"
201
- },
202
- {
203
- "Population": "Educational level",
204
- "Subgroup": "<High School or GED*",
205
- "Estimate": "448,000"
206
- },
207
- {
208
- "Population": "Educational level",
209
- "Subgroup": "High School or GED*",
210
- "Estimate": "1,020,000"
211
- },
212
- {
213
- "Population": "Educational level",
214
- "Subgroup": ">= some college",
215
- "Estimate": "1,366,000"
216
- }
217
- ],
218
- "brush": {
219
- "height": 25,
220
- "data": [],
221
- "active": false,
222
- "pattern_id": "brush_pattern",
223
- "accent_color": "#ddd"
224
- },
225
- "exclusions": {
226
- "active": false,
227
- "keys": []
228
- },
229
- "palette": "sequential-bluereverse",
230
- "isPaletteReversed": true,
231
- "twoColor": {
232
- "palette": "monochrome-1",
233
- "isPaletteReversed": false
234
- },
235
- "labels": false,
236
- "dataFormat": {
237
- "commas": false,
238
- "prefix": "",
239
- "suffix": "",
240
- "abbreviated": false,
241
- "bottomSuffix": "",
242
- "bottomPrefix": "",
243
- "bottomAbbreviated": false
244
- },
245
- "confidenceKeys": {},
246
- "visual": {
247
- "border": true,
248
- "accent": true,
249
- "background": true,
250
- "verticalHoverLine": false,
251
- "horizontalHoverLine": false
252
- },
253
- "useLogScale": false,
254
- "filterBehavior": "Filter Change",
255
- "highlightedBarValues": [],
256
- "series": [
257
- {
258
- "dataKey": "Estimate",
259
- "type": "Bar",
260
- "axis": "Left",
261
- "tooltip": true
262
- }
263
- ],
264
- "tooltips": {
265
- "opacity": 90,
266
- "singleSeries": false
267
- },
268
- "forestPlot": {
269
- "startAt": 0,
270
- "colors": {
271
- "line": "",
272
- "shape": ""
273
- },
274
- "lineOfNoEffect": {
275
- "show": true
276
- },
277
- "type": "",
278
- "pooledResult": {
279
- "diamondHeight": 5,
280
- "column": ""
281
- },
282
- "estimateField": "",
283
- "estimateRadius": "",
284
- "shape": "",
285
- "rowHeight": 20,
286
- "description": {
287
- "show": true,
288
- "text": "description",
289
- "location": 0
290
- },
291
- "result": {
292
- "show": true,
293
- "text": "result",
294
- "location": 100
295
- },
296
- "radius": {
297
- "min": 1,
298
- "max": 8,
299
- "scalingColumn": ""
300
- },
301
- "regression": {
302
- "lower": 0,
303
- "upper": 0,
304
- "estimateField": 0
305
- },
306
- "leftWidthOffset": 0,
307
- "rightWidthOffset": 0,
308
- "showZeroLine": false,
309
- "hideDateCategoryCol": false,
310
- "leftLabel": "",
311
- "rightLabel": "",
312
- "width": "auto",
313
- "lowerCiField": "",
314
- "upperCiField": ""
315
- },
316
- "area": {
317
- "isStacked": false
318
- },
319
- "showChartBrush": false,
320
- "openModal": false,
321
- "uid": "chart1702240713058",
322
- "visualizationType": "Bar",
323
- "dataDescription": {
324
- "horizontal": false,
325
- "series": false
326
- },
327
- "editing": true,
328
- "validated": 4.23,
329
- "dynamicMarginTop": 0,
330
- "filters": [
331
- {
332
- "active": "45-64",
333
- "filterStyle": "dropdown",
334
- "order": "asc",
335
- "columnName": "Population",
336
- "label": "Subgroup"
337
- }
338
- ],
339
- "originalFormattedData": [
340
- {
341
- "Population": "Age group (years)",
342
- "Subgroup": "18-44",
343
- "Estimate": "1,161,000"
344
- },
345
- {
346
- "Population": "Age group (years)",
347
- "Subgroup": "45-64",
348
- "Estimate": "1,061,000"
349
- },
350
- {
351
- "Population": "Age group (years)",
352
- "Subgroup": ">=65",
353
- "Estimate": "643,000"
354
- },
355
- {
356
- "Population": "Sex",
357
- "Subgroup": "Men",
358
- "Estimate": "1,214,000"
359
- },
360
- {
361
- "Population": "Sex",
362
- "Subgroup": "Women",
363
- "Estimate": "1,651,000"
364
- },
365
- {
366
- "Population": "Race/Ethnicity",
367
- "Subgroup": "Hispanic",
368
- "Estimate": "382,000"
369
- },
370
- {
371
- "Population": "Race/Ethnicity",
372
- "Subgroup": "Non-Hispanic White",
373
- "Estimate": "1,870,000"
374
- },
375
- {
376
- "Population": "Race/Ethnicity",
377
- "Subgroup": "Non-Hispanic Black",
378
- "Estimate": "473,000"
379
- },
380
- {
381
- "Population": "Race/Ethnicity",
382
- "Subgroup": "Non-Hispanic other",
383
- "Estimate": "140,000"
384
- },
385
- {
386
- "Population": "Educational level",
387
- "Subgroup": "<High School or General Educational Diploma",
388
- "Estimate": "448,000"
389
- },
390
- {
391
- "Population": "Educational level",
392
- "Subgroup": "High School or General Educational Diploma",
393
- "Estimate": "1,020,000"
394
- },
395
- {
396
- "Population": "Educational level",
397
- "Subgroup": ">= some college",
398
- "Estimate": "1,366,000"
399
- }
400
- ],
401
- "superTitle": "",
402
- "dataKey": "dashboard_aggregate_active_epilepsy.csv"
403
- }