@cdc/chart 4.22.10 → 4.22.11

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 (72) hide show
  1. package/README.md +5 -5
  2. package/dist/cdcchart.js +4 -4
  3. package/examples/age-adjusted-rates.json +1486 -1218
  4. package/examples/case-rate-example-config.json +1 -1
  5. package/examples/covid-confidence-example-config.json +33 -33
  6. package/examples/covid-example-config.json +34 -34
  7. package/examples/covid-example-data-confidence.json +30 -30
  8. package/examples/covid-example-data.json +20 -20
  9. package/examples/cutoff-example-config.json +36 -36
  10. package/examples/cutoff-example-data.json +36 -36
  11. package/examples/date-exclusions-config.json +1 -1
  12. package/examples/dynamic-legends.json +124 -124
  13. package/examples/gallery/bar-chart-horizontal/horizontal-bar-chart-with-numbers-on-bar.json +191 -197
  14. package/examples/gallery/bar-chart-horizontal/horizontal-bar-chart.json +230 -240
  15. package/examples/gallery/bar-chart-horizontal/horizontal-stacked.json +239 -247
  16. package/examples/gallery/bar-chart-vertical/combo-line-chart.json +136 -136
  17. package/examples/gallery/bar-chart-vertical/vertical-bar-chart-categorical.json +79 -79
  18. package/examples/gallery/bar-chart-vertical/vertical-bar-chart-stacked.json +80 -80
  19. package/examples/gallery/bar-chart-vertical/vertical-bar-chart-with-confidence.json +67 -67
  20. package/examples/gallery/bar-chart-vertical/vertical-bar-chart.json +110 -110
  21. package/examples/gallery/lollipop/lollipop-style-horizontal.json +215 -219
  22. package/examples/gallery/paired-bar/paired-bar-chart.json +195 -195
  23. package/examples/horizontal-chart.json +35 -35
  24. package/examples/horizontal-stacked-bar-chart.json +34 -34
  25. package/examples/line-chart.json +75 -75
  26. package/examples/paired-bar-data.json +16 -14
  27. package/examples/paired-bar-example.json +48 -48
  28. package/examples/paired-bar-formatted.json +36 -36
  29. package/examples/planet-chart-horizontal-example-config.json +33 -33
  30. package/examples/planet-combo-example-config.json +34 -31
  31. package/examples/planet-example-config.json +35 -33
  32. package/examples/planet-example-data.json +56 -56
  33. package/examples/planet-pie-example-config.json +28 -28
  34. package/examples/private/filters.json +170 -0
  35. package/examples/private/line-test-data.json +21 -21
  36. package/examples/private/line-test-two.json +209 -215
  37. package/examples/private/line-test.json +101 -101
  38. package/examples/private/new.json +48800 -0
  39. package/examples/private/shawn.json +1105 -1295
  40. package/examples/private/test.json +10123 -10123
  41. package/examples/private/yaxis-test.json +4 -3
  42. package/examples/private/yaxis.json +26 -26
  43. package/examples/stacked-vertical-bar-example.json +1 -1
  44. package/examples/temp-example-config.json +61 -54
  45. package/examples/temp-example-data.json +1 -1
  46. package/package.json +2 -2
  47. package/src/CdcChart.tsx +339 -380
  48. package/src/components/BarChart.tsx +425 -469
  49. package/src/components/DataTable.tsx +164 -195
  50. package/src/components/EditorPanel.js +1009 -710
  51. package/src/components/Legend.js +279 -329
  52. package/src/components/LineChart.tsx +90 -79
  53. package/src/components/LinearChart.tsx +376 -434
  54. package/src/components/PairedBarChart.tsx +197 -213
  55. package/src/components/PieChart.tsx +95 -151
  56. package/src/components/SparkLine.js +179 -201
  57. package/src/components/useIntersectionObserver.tsx +17 -20
  58. package/src/context.tsx +3 -3
  59. package/src/data/initial-state.js +37 -16
  60. package/src/hooks/useActiveElement.js +13 -13
  61. package/src/hooks/useChartClasses.js +34 -28
  62. package/src/hooks/useColorPalette.ts +56 -63
  63. package/src/hooks/useLegendClasses.js +18 -10
  64. package/src/hooks/useReduceData.ts +62 -78
  65. package/src/hooks/useRightAxis.js +25 -0
  66. package/src/hooks/useTopAxis.js +6 -0
  67. package/src/index.html +45 -45
  68. package/src/index.tsx +13 -16
  69. package/src/scss/DataTable.scss +5 -4
  70. package/src/scss/editor-panel.scss +71 -69
  71. package/src/scss/main.scss +157 -114
  72. package/src/scss/variables.scss +1 -1
package/examples/case-rate-example-config.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "title": "Case Rate Data",
3
3
  "theme": "theme-blue",
4
- "dataUrl": "/examples/case-rate-example-data.json",
4
+ "dataUrl": "/examples/case-rate-example-data.json",
5
5
  "visualizationType": "Bar",
6
6
  "visualizationSubType": "horizontal",
7
7
  "series": [],
package/examples/covid-confidence-example-config.json CHANGED
@@ -1,35 +1,35 @@
1
1
  {
2
- "title": "Confidence Age-adjusted COVID-19-associated hospitalization rates by race and ethnicity — COVID-NET, March 1–December 26, 2020",
3
- "dataUrl": "/examples/covid-example-data-confidence.json",
4
- "visualizationType": "Bar",
5
- "fontSize": "small",
6
- "series": [{"dataKey": "Age-adjusted rate", "label": "Rate"}],
7
- "confidenceKeys": {
8
- "lower": "Lower",
9
- "upper": "Upper"
10
- },
11
- "dataFormat": {
12
- "commas": false,
13
- "prefix": "Lorem",
14
- "suffix": "Suffix"
15
- },
16
- "padding": {
17
- "left": 10,
18
- "right": 10
19
- },
20
- "yAxis": {
21
- "dataKey": "Age-adjusted rate",
22
- "gridLines": true,
23
- "numTicks": 3,
24
- "size": 80
25
- },
26
- "xAxis": {
27
- "dataKey": "Race",
28
- "tickRotation": 20,
29
- "size": 130
30
- },
31
- "table": {
32
- "label": "Age-adjusted COVID-19-associated hospitalization rates by race and ethnicity",
33
- "expanded": true
34
- }
2
+ "title": "Confidence Age-adjusted COVID-19-associated hospitalization rates by race and ethnicity — COVID-NET, March 1–December 26, 2020",
3
+ "dataUrl": "/examples/covid-example-data-confidence.json",
4
+ "visualizationType": "Bar",
5
+ "fontSize": "small",
6
+ "series": [{ "dataKey": "Age-adjusted rate", "label": "Rate" }],
7
+ "confidenceKeys": {
8
+ "lower": "Lower",
9
+ "upper": "Upper"
10
+ },
11
+ "dataFormat": {
12
+ "commas": false,
13
+ "prefix": "Lorem",
14
+ "suffix": "Suffix"
15
+ },
16
+ "padding": {
17
+ "left": 10,
18
+ "right": 10
19
+ },
20
+ "yAxis": {
21
+ "dataKey": "Age-adjusted rate",
22
+ "gridLines": true,
23
+ "numTicks": 3,
24
+ "size": 80
25
+ },
26
+ "xAxis": {
27
+ "dataKey": "Race",
28
+ "tickRotation": 20,
29
+ "size": 130
30
+ },
31
+ "table": {
32
+ "label": "Age-adjusted COVID-19-associated hospitalization rates by race and ethnicity",
33
+ "expanded": true
34
+ }
35
35
  }
package/examples/covid-example-config.json CHANGED
@@ -1,36 +1,36 @@
1
1
  {
2
- "title": "Non Configdence Age-adjusted COVID-19-associated hospitalization rates by race and ethnicity — COVID-NET, March 1–December 26, 2020",
3
- "theme": "theme-brown",
4
- "dataUrl": "/examples/covid-example-data.json",
5
- "visualizationType": "Bar",
6
- "visualizationSubType": "horizontal",
7
- "series": [{"dataKey": "Age-adjusted rate"}],
8
- "barThickness": 0.3,
9
- "height": 300,
10
- "dataFormat": {
11
- "commas": false,
12
- "prefix": "",
13
- "suffix": ""
14
- },
15
- "padding": {
16
- "left": 10,
17
- "right": 10
18
- },
19
- "yAxis": {
20
- "gridLines": false,
21
- "numTicks": 3
22
- },
23
- "xAxis": {
24
- "dataKey": "Race",
25
- "size": 20,
26
- "wrap": true
27
- },
28
- "legend": {
29
- "hide": true
30
- },
31
- "table": {
32
- "label": "Age-adjusted COVID-19-associated hospitalization rates by race and ethnicity",
33
- "expanded": true,
34
- "download": true
35
- }
2
+ "title": "Non Configdence Age-adjusted COVID-19-associated hospitalization rates by race and ethnicity — COVID-NET, March 1–December 26, 2020",
3
+ "theme": "theme-brown",
4
+ "dataUrl": "/examples/covid-example-data.json",
5
+ "visualizationType": "Bar",
6
+ "visualizationSubType": "horizontal",
7
+ "series": [{ "dataKey": "Age-adjusted rate" }],
8
+ "barThickness": 0.3,
9
+ "height": 300,
10
+ "dataFormat": {
11
+ "commas": false,
12
+ "prefix": "",
13
+ "suffix": ""
14
+ },
15
+ "padding": {
16
+ "left": 10,
17
+ "right": 10
18
+ },
19
+ "yAxis": {
20
+ "gridLines": false,
21
+ "numTicks": 3
22
+ },
23
+ "xAxis": {
24
+ "dataKey": "Race",
25
+ "size": 20,
26
+ "wrap": true
27
+ },
28
+ "legend": {
29
+ "hide": true
30
+ },
31
+ "table": {
32
+ "label": "Age-adjusted COVID-19-associated hospitalization rates by race and ethnicity",
33
+ "expanded": true,
34
+ "download": true
35
+ }
36
36
  }
package/examples/covid-example-data-confidence.json CHANGED
@@ -1,32 +1,32 @@
1
1
  [
2
- {
3
- "Race": "Hispanic or Latino",
4
- "Age-adjusted rate": "644000.2",
5
- "Lower": "640000.2",
6
- "Upper": "650000.2"
7
- },
8
- {
9
- "Race": "Non-Hispanic Black",
10
- "Age-adjusted rate": "563000.7",
11
- "Lower": "560000.2",
12
- "Upper": "570000.2"
13
- },
14
- {
15
- "Race": "Non-Hispanic Asian or Pacific Islander",
16
- "Age-adjusted rate": "202000.5",
17
- "Lower": "200000.2",
18
- "Upper": "210000.2"
19
- },
20
- {
21
- "Race": "Non-Hispanic American Indian or Alaska Native",
22
- "Age-adjusted rate": "636000.1",
23
- "Lower": "630000.2",
24
- "Upper": "740000.2"
25
- },
26
- {
27
- "Race": "Non-Hispanic White",
28
- "Age-adjusted rate": "183000.6",
29
- "Lower": "180000.2",
30
- "Upper": "190000.2"
31
- }
2
+ {
3
+ "Race": "Hispanic or Latino",
4
+ "Age-adjusted rate": "644000.2",
5
+ "Lower": "640000.2",
6
+ "Upper": "650000.2"
7
+ },
8
+ {
9
+ "Race": "Non-Hispanic Black",
10
+ "Age-adjusted rate": "563000.7",
11
+ "Lower": "560000.2",
12
+ "Upper": "570000.2"
13
+ },
14
+ {
15
+ "Race": "Non-Hispanic Asian or Pacific Islander",
16
+ "Age-adjusted rate": "202000.5",
17
+ "Lower": "200000.2",
18
+ "Upper": "210000.2"
19
+ },
20
+ {
21
+ "Race": "Non-Hispanic American Indian or Alaska Native",
22
+ "Age-adjusted rate": "636000.1",
23
+ "Lower": "630000.2",
24
+ "Upper": "740000.2"
25
+ },
26
+ {
27
+ "Race": "Non-Hispanic White",
28
+ "Age-adjusted rate": "183000.6",
29
+ "Lower": "180000.2",
30
+ "Upper": "190000.2"
31
+ }
32
32
  ]
package/examples/covid-example-data.json CHANGED
@@ -1,22 +1,22 @@
1
1
  [
2
- {
3
- "Race": "Hispanic or Latino",
4
- "Age-adjusted rate": "644.2"
5
- },
6
- {
7
- "Race": "Non-Hispanic American Indian",
8
- "Age-adjusted rate": "636.1"
9
- },
10
- {
11
- "Race": "Non-Hispanic Black",
12
- "Age-adjusted rate": "563.7"
13
- },
14
- {
15
- "Race": "Non-Hispanic Asian or Pacific Islander",
16
- "Age-adjusted rate": "202.5"
17
- },
18
- {
19
- "Race": "Non-Hispanic White",
20
- "Age-adjusted rate": "183.6"
21
- }
2
+ {
3
+ "Race": "Hispanic or Latino",
4
+ "Age-adjusted rate": "644.2"
5
+ },
6
+ {
7
+ "Race": "Non-Hispanic American Indian",
8
+ "Age-adjusted rate": "636.1"
9
+ },
10
+ {
11
+ "Race": "Non-Hispanic Black",
12
+ "Age-adjusted rate": "563.7"
13
+ },
14
+ {
15
+ "Race": "Non-Hispanic Asian or Pacific Islander",
16
+ "Age-adjusted rate": "202.5"
17
+ },
18
+ {
19
+ "Race": "Non-Hispanic White",
20
+ "Age-adjusted rate": "183.6"
21
+ }
22
22
  ]
package/examples/cutoff-example-config.json CHANGED
@@ -1,38 +1,38 @@
1
1
  {
2
- "title": "Data Cutoff Example (< 0.1)",
3
- "theme": "theme-blue",
4
- "dataUrl": "/examples/cutoff-example-data.json",
5
- "animate": true,
6
- "animateReplay": true,
7
- "visualizationType": "Line",
8
- "series": [{"dataKey": "Value"}],
9
- "barThickness": 0.3,
10
- "height": 300,
11
- "dataCutoff": "0.1",
12
- "dataFormat": {
13
- "commas": false,
14
- "prefix": "",
15
- "suffix": ""
16
- },
17
- "padding": {
18
- "left": 10,
19
- "right": 10
20
- },
21
- "yAxis": {
22
- "label": "Value",
23
- "gridLines": false,
24
- "size": 70
25
- },
26
- "xAxis": {
27
- "label": "Category",
28
- "dataKey": "Category"
29
- },
30
- "legend": {
31
- "hide": true
32
- },
33
- "table": {
34
- "label": "Data Table",
35
- "expanded": true,
36
- "download": true
37
- }
2
+ "title": "Data Cutoff Example (< 0.1)",
3
+ "theme": "theme-blue",
4
+ "dataUrl": "/examples/cutoff-example-data.json",
5
+ "animate": true,
6
+ "animateReplay": true,
7
+ "visualizationType": "Line",
8
+ "series": [{ "dataKey": "Value" }],
9
+ "barThickness": 0.3,
10
+ "height": 300,
11
+ "dataCutoff": "0.1",
12
+ "dataFormat": {
13
+ "commas": false,
14
+ "prefix": "",
15
+ "suffix": ""
16
+ },
17
+ "padding": {
18
+ "left": 10,
19
+ "right": 10
20
+ },
21
+ "yAxis": {
22
+ "label": "Value",
23
+ "gridLines": false,
24
+ "size": 70
25
+ },
26
+ "xAxis": {
27
+ "label": "Category",
28
+ "dataKey": "Category"
29
+ },
30
+ "legend": {
31
+ "hide": true
32
+ },
33
+ "table": {
34
+ "label": "Data Table",
35
+ "expanded": true,
36
+ "download": true
37
+ }
38
38
  }
package/examples/cutoff-example-data.json CHANGED
@@ -1,38 +1,38 @@
1
1
  [
2
- {
3
- "Category": "Category 1",
4
- "Value": "0.05"
5
- },
6
- {
7
- "Category": "Category 2",
8
- "Value": "0.1"
9
- },
10
- {
11
- "Category": "Category 3",
12
- "Value": "0.2"
13
- },
14
- {
15
- "Category": "Category 4",
16
- "Value": "0.4"
17
- },
18
- {
19
- "Category": "Category 5",
20
- "Value": "0.3"
21
- },
22
- {
23
- "Category": "Category 6",
24
- "Value": null
25
- },
26
- {
27
- "Category": "Category 7",
28
- "Value": "0.5"
29
- },
30
- {
31
- "Category": "Category 8",
32
- "Value": "0.5"
33
- },
34
- {
35
- "Category": "Category 9",
36
- "Value": "0.08"
37
- }
2
+ {
3
+ "Category": "Category 1",
4
+ "Value": "0.05"
5
+ },
6
+ {
7
+ "Category": "Category 2",
8
+ "Value": "0.1"
9
+ },
10
+ {
11
+ "Category": "Category 3",
12
+ "Value": "0.2"
13
+ },
14
+ {
15
+ "Category": "Category 4",
16
+ "Value": "0.4"
17
+ },
18
+ {
19
+ "Category": "Category 5",
20
+ "Value": "0.3"
21
+ },
22
+ {
23
+ "Category": "Category 6",
24
+ "Value": null
25
+ },
26
+ {
27
+ "Category": "Category 7",
28
+ "Value": "0.5"
29
+ },
30
+ {
31
+ "Category": "Category 8",
32
+ "Value": "0.5"
33
+ },
34
+ {
35
+ "Category": "Category 9",
36
+ "Value": "0.08"
37
+ }
38
38
  ]
package/examples/date-exclusions-config.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "title": "",
3
- "dataUrl": "/examples/date-exclusions-data.json",
3
+ "dataUrl": "/examples/date-exclusions-data.json",
4
4
  "type": "chart",
5
5
  "theme": "theme-blue",
6
6
  "fontSize": "medium",