@cdc/chart 4.23.3 → 4.23.5

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 (98) hide show
  1. package/dist/cdcchart.js +52543 -50830
  2. package/examples/feature/__data__/area-chart.json +56 -0
  3. package/examples/{planet-example-data.json → feature/__data__/planet-example-data.json} +3 -8
  4. package/examples/feature/__data__/planet-logaritmic-data.json +56 -0
  5. package/examples/feature/area/area-chart-category.json +240 -0
  6. package/examples/{area-chart.json → feature/area/area-chart-date.json} +70 -13
  7. package/examples/feature/bar/example-bar-chart.json +558 -0
  8. package/examples/{horizontal-chart-max-increase.json → feature/bar/horizontal-chart-max-increase.json} +10 -4
  9. package/examples/{horizontal-chart.json → feature/bar/horizontal-chart.json} +10 -4
  10. package/examples/{horizontal-stacked-bar-chart.json → feature/bar/horizontal-stacked-bar-chart.json} +7 -3
  11. package/examples/{planet-chart-horizontal-example-config.json → feature/bar/planet-chart-horizontal-example-config.json} +8 -3
  12. package/examples/feature/bar/planet-chart-logaritmic-config.json +170 -0
  13. package/examples/{planet-example-config.json → feature/bar/planet-example-config.json} +2 -2
  14. package/examples/{box-plot.json → feature/boxplot/boxplot.json} +7 -7
  15. package/examples/feature/boxplot/testing.csv +38 -0
  16. package/examples/feature/boxplot/valid-boxplot.csv +17 -0
  17. package/examples/feature/combo/combochart-categories_are_numbers .json +18 -0
  18. package/examples/{planet-combo-example-config.json → feature/combo/planet-combo-example-config.json} +1 -1
  19. package/examples/{planet-deviation-config.json → feature/deviation/planet-deviation-config.json} +2 -2
  20. package/examples/{planet-deviation-data.json → feature/deviation/planet-deviation-data.json} +9 -9
  21. package/examples/feature/filters/filter-testing.json +212 -0
  22. package/examples/feature/forecasting/case_date_example.csv +130 -0
  23. package/examples/feature/forecasting/effective_reproduction.json +202 -0
  24. package/examples/feature/forecasting/r_data.csv +130 -0
  25. package/examples/feature/forecasting/random_data.csv +366 -0
  26. package/examples/feature/line/line-chart.json +124 -0
  27. package/examples/{paired-bar-example.json → feature/paired-bar/paired-bar-example.json} +10 -4
  28. package/examples/{planet-pie-example-config.json → feature/pie/planet-pie-example-config.json} +2 -2
  29. package/examples/{scatterplot.json → feature/scatterplot/scatterplot.json} +1 -1
  30. package/examples/feature/test-highlight/test-highlight-2.json +789 -0
  31. package/examples/feature/test-highlight/test-highlight-vertical.json +561 -0
  32. package/examples/feature/test-highlight/test-highlight.json +100 -0
  33. package/examples/{case-rate-example-config.json → feature/tests-case-rate/case-rate-example-config.json} +2 -2
  34. package/examples/{covid-confidence-example-config.json → feature/tests-covid/covid-confidence-example-config.json} +8 -3
  35. package/examples/{covid-example-config.json → feature/tests-covid/covid-example-config.json} +7 -3
  36. package/examples/{cutoff-example-config.json → feature/tests-cutoff/cutoff-example-config.json} +7 -3
  37. package/examples/{date-exclusions-config.json → feature/tests-date-exclusions/date-exclusions-config.json} +2 -2
  38. package/examples/{example-bar-chart-nonnumeric.json → feature/tests-non-numerics/example-bar-chart-nonnumeric.json} +1 -1
  39. package/examples/{planet-pie-example-config-nonnumeric.json → feature/tests-non-numerics/planet-pie-example-config-nonnumeric.json} +2 -2
  40. package/examples/{sparkline-chart-nonnumeric.json → feature/tests-non-numerics/sparkline-chart-nonnumeric.json} +1 -1
  41. package/examples/{stacked-vertical-bar-example-nonnumerics.json → feature/tests-non-numerics/stacked-vertical-bar-example-nonnumerics.json} +1 -2
  42. package/examples/gallery/bar-chart-horizontal/horizontal-highlight.json +345 -0
  43. package/examples/gallery/bar-chart-vertical/combo-line-chart.json +145 -7
  44. package/examples/gallery/paired-bar/paired-bar-chart.json +1 -0
  45. package/index.html +73 -49
  46. package/package.json +2 -2
  47. package/src/CdcChart.jsx +405 -40
  48. package/src/components/AreaChart.jsx +122 -80
  49. package/src/components/BarChart.jsx +126 -49
  50. package/src/components/BoxPlot.jsx +28 -20
  51. package/src/components/DataTable.jsx +7 -6
  52. package/src/components/DeviationBar.jsx +34 -34
  53. package/src/components/EditorPanel.jsx +1332 -352
  54. package/src/components/Legend.jsx +40 -4
  55. package/src/components/LineChart.jsx +10 -23
  56. package/src/components/LinearChart.jsx +133 -286
  57. package/src/components/PairedBarChart.jsx +6 -6
  58. package/src/components/PieChart.jsx +2 -4
  59. package/src/components/SparkLine.jsx +6 -42
  60. package/src/data/initial-state.js +23 -4
  61. package/src/hooks/useHighlightedBars.js +154 -0
  62. package/src/hooks/useMinMax.js +92 -0
  63. package/src/hooks/useReduceData.js +31 -57
  64. package/src/hooks/useScales.js +202 -0
  65. package/src/index.jsx +2 -1
  66. package/src/scss/editor-panel.scss +15 -0
  67. package/src/scss/main.scss +8 -6
  68. package/examples/box-plot.csv +0 -5
  69. package/examples/dynamic-legends.json +0 -125
  70. package/examples/example-bar-chart.json +0 -36
  71. package/examples/line-chart.json +0 -34
  72. package/examples/temp-example-config.json +0 -64
  73. package/examples/temp-example-data.json +0 -130
  74. package/src/components/Filters.jsx +0 -126
  75. /package/examples/{age-adjusted-rates.json → feature/__data__/age-adjusted-rates.json} +0 -0
  76. /package/examples/{new-data.csv → feature/__data__/new-data.csv} +0 -0
  77. /package/examples/{planet-example-data-max-increase.json → feature/__data__/planet-example-data-max-increase.json} +0 -0
  78. /package/examples/{Barchart_with_negative.json → feature/bar/Barchart_with_negative.json} +0 -0
  79. /package/examples/{stacked-vertical-bar-example-negative.json → feature/bar/stacked-vertical-bar-example-negative.json} +0 -0
  80. /package/examples/{stacked-vertical-bar-example.json → feature/bar/stacked-vertical-bar-example.json} +0 -0
  81. /package/examples/{box-plot-data.json → feature/boxplot/box-plot-data.json} +0 -0
  82. /package/examples/{newdata.json → feature/boxplot/boxplot-data.json} +0 -0
  83. /package/examples/{line-chart-max-increase.json → feature/line/line-chart-max-increase.json} +0 -0
  84. /package/examples/{paired-bar-data.json → feature/paired-bar/paired-bar-data.json} +0 -0
  85. /package/examples/{paired-bar-formatted.json → feature/paired-bar/paired-bar-formatted.json} +0 -0
  86. /package/examples/{scatterplot-continuous.csv → feature/scatterplot/scatterplot-continuous.csv} +0 -0
  87. /package/examples/{example-sparkline.json → feature/sparkline/example-sparkline.json} +0 -0
  88. /package/examples/{big-small-test-bar.json → feature/tests-big-small/big-small-test-bar.json} +0 -0
  89. /package/examples/{big-small-test-line.json → feature/tests-big-small/big-small-test-line.json} +0 -0
  90. /package/examples/{big-small-test-negative.json → feature/tests-big-small/big-small-test-negative.json} +0 -0
  91. /package/examples/{case-rate-example-data.json → feature/tests-case-rate/case-rate-example-data.json} +0 -0
  92. /package/examples/{covid-example-data-confidence.json → feature/tests-covid/covid-example-data-confidence.json} +0 -0
  93. /package/examples/{covid-example-data.json → feature/tests-covid/covid-example-data.json} +0 -0
  94. /package/examples/{cutoff-example-data.json → feature/tests-cutoff/cutoff-example-data.json} +0 -0
  95. /package/examples/{date-exclusions-data.json → feature/tests-date-exclusions/date-exclusions-data.json} +0 -0
  96. /package/examples/{example-combo-bar-nonnumeric.json → feature/tests-non-numerics/example-combo-bar-nonnumeric.json} +0 -0
  97. /package/examples/{line-chart-nonnumeric.json → feature/tests-non-numerics/line-chart-nonnumeric.json} +0 -0
  98. /package/examples/{planet-example-data-nonnumeric.json → feature/tests-non-numerics/planet-example-data-nonnumeric.json} +0 -0
package/index.html CHANGED
@@ -20,44 +20,78 @@
20
20
  </head>
21
21
 
22
22
  <body>
23
- <!-- <div class="react-container" data-config="/examples/temp-example-config.json"></div> -->
24
-
25
- <!-- <select id="cove_select">
26
- <option value=""">Choose An Option</option>
27
- <option value="Non-Hispanic White">Non-Hispanic White</option>
28
- <option value="Hispanic or Latino">Test 2</option>
29
- </select> -->
30
-
31
- <!-- <div class="react-container" data-config="/examples/dynamic-legends.json"></div> -->
32
- <!-- <div class="react-container" data-config="/examples/cutoff-example-config.json"></div> -->
33
- <!-- <div class="react-container" data-config="/examples/covid-confidence-example-config.json"></div> -->
34
- <!-- <div class="react-container" data-config="/examples/planet-example-config.json"></div> -->
35
- <!-- <div class="react-container" data-config="/examples/planet-chart-horizontal-example-config.json"></div> -->
36
- <!-- <div class="react-container" data-config="/examples/planet-example-config.json"></div> -->
37
- <!-- <div class="react-container" data-config="/examples/example-sparkline.json"></div> -->
38
- <!-- <div class="react-container" data-config="/examples/date-exclusions-config.json"></div> -->
39
- <!-- <div class="react-container" data-config="/examples/case-rate-example-config.json"></div> -->
40
- <!-- <div class="react-container" data-config="/examples/example-bar-chart.json"></div> -->
41
- <!-- <div class="react-container" data-config="/examples/example-sparkline.json"></div> -->
42
- <!-- DATA PRESENTATION GALLERY: https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/bar-chart.html#examples -->
43
-
44
- <div class="react-container" data-config="/examples/gallery/line/line.json"></div>
45
- <!-- EDGE CASES -->
46
- <!-- <div class="react-container" data-config="/examples/big-small-test-line.json"></div> -->
47
- <!-- <div class="react-container" data-config="/examples/big-small-test-bar.json"></div> -->
48
- <!-- <div class="react-container" data-config="/examples/big-small-test-negative.json"></div> -->
49
- <!-- <div class="react-container" data-config="/examples/line-chart-max-increase.json"></div> -->
50
- <!-- <div class="react-container" data-config="/examples/horizontal-chart-max-increase.json"></div> -->
51
-
52
- <!-- NONNUMERIC TESTS -->
53
- <!-- <div class="react-container" data-config="/examples/planet-pie-example-config-nonnumeric.json"></div> -->
54
- <!-- <div class="react-container" data-config="/examples/planet-pie-example-config.json"></div> -->
55
- <!-- <div class="react-container" data-config="/examples/example-combo-bar-nonnumeric.json"></div> -->
56
- <!-- <div class="react-container" data-config="/examples/example-bar-chart-nonnumeric.json"></div> -->
57
- <!-- <div class="react-container" data-config="/examples/line-chart.json"></div> -->
58
- <!-- <div class="react-container" data-config="/examples/sparkline-chart-nonnumeric.json"></div> -->
59
- <!-- <div class="react-container" data-config="/examples/area-chart.json"></div> -->
60
- <!-- <div class="react-container" data-config="/examples/scatterplot.json"></div> -->
23
+
24
+ <!--
25
+ EXAMPLES:
26
+ chart/examples/features: different chart types and tests
27
+ chart/examples/private: an ignored git folder used for addl. troubleshooting.
28
+ chart/examples/gallery: examples pulled from the cdc data visualization gallery
29
+ chart/examples/__data__: a folder for storing re-usable fictional datasets
30
+
31
+ GALLERY EXAMPLES ARE FOUND HERE:
32
+ https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/example-data-map-cities-states.html
33
+
34
+ -->
35
+
36
+ <!-- GENERIC CHART TYPES -->
37
+ <div class="react-container" data-config="/examples/feature/filters/filter-testing.json"></div>
38
+ <!-- <div class="react-container" data-config="/examples/feature/pie/planet-pie-example-config.json"></div> -->
39
+ <!-- <div class="react-container" data-config="/examples/feature/line/line-chart.json"></div> -->
40
+ <!-- <div class="react-container" data-config="/examples/feature/test-highlight/test-highlight.json"></div> -->
41
+ <!-- <div class="react-container" data-config="/examples/feature/test-highlight/test-highlight-vertical.json"></div> -->
42
+ <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-category.json"></div> -->
43
+ <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-date.json"></div> -->
44
+ <!-- <div class="react-container" data-config="/examples/feature/scatterplot/scatterplot.json"></div> -->
45
+ <!-- <div class="react-container" data-config="/examples/feature/deviation/planet-deviation-config.json"></div> -->
46
+ <!-- <div class="react-container" data-config="/examples/feature/boxplot/boxplot.json"></div> -->
47
+ <!-- <div class="react-container" data-config="/examples/feature/combo/planet-combo-example-config.json"></div> -->
48
+ <!-- <div class="react-container" data-config="/examples/feature/paired-bar/paired-bar-example.json"></div> -->
49
+
50
+ <!-- BAR -->
51
+ <!-- <div class="react-container" data-config="/examples/feature/bar/planet-example-config.json"></div> -->
52
+ <!-- <div class="react-container" data-config="/examples/feature/bar/planet-chart-horizontal-example-config.json"></div> -->
53
+ <!-- <div class="react-container" data-config="/examples/feature/bar/example-bar-chart.json"></div> -->
54
+ <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-chart-max-increase.json"></div> -->
55
+ <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-chart.json"></div> -->
56
+ <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-stacked-bar-chart.json"></div> -->
57
+ <!-- <div class="react-container" data-config="/examples/feature/bar/planet-chart-horizontal-example-config.json"></div> -->
58
+
59
+ <!-- SPARKLINE -->
60
+ <!-- <div class="react-container" data-config="/examples/feature/sparkline/example-sparkline.json"></div> -->
61
+
62
+ <!-- TESTS DATE EXCLUSIONS -->
63
+ <!-- <div class="react-container" data-config="/examples/feature/tests-date-exclusions/date-exclusions-config.json"></div> -->
64
+ <!-- <div class="react-container" data-config="/examples/feature/tests-case-rate/case-rate-example-config.json"></div> -->
65
+
66
+ <!-- TESTS BIG SMALL-->
67
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-line.json"></div> -->
68
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-bar.json"></div> -->
69
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-negative.json"></div> -->
70
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/line-chart-max-increase.json"></div> -->
71
+
72
+ <!-- TESTS NONNUMERICS -->
73
+ <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/planet-pie-example-config-nonnumeric.json"></div> -->
74
+ <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/example-combo-bar-nonnumeric.json"></div> -->
75
+ <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/example-bar-chart-nonnumeric.json"></div> -->
76
+ <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/sparkline-chart-nonnumeric.json"></div> -->
77
+ <div class="react-container" data-config="/examples/feature/tests-non-numerics/stacked-vertical-bar-example-nonnumerics.json"></div>
78
+
79
+ <!-- TESTS CUTOFF -->
80
+ <!-- <div class="react-container" data-config="/examples/feature/tests-cutoff/cutoff-example-config.json"></div> -->
81
+
82
+ <!-- TESTS COVID -->
83
+ <!-- <div class="react-container" data-config="/examples/feature/tests-covid/covid-confidence-example-config.json"></div> -->
84
+ <!-- <div class="react-container" data-config="/examples/feature/tests-covid/covid-example-config.json"></div> -->
85
+
86
+
87
+ <!--
88
+ GALLERY EXAMPLES BELOW THIS LINE...
89
+ https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/example-data-map-cities-states.html
90
+
91
+ -->
92
+
93
+ <!-- GENERIC CHART TYPES -->
94
+ <!-- <div class="react-container" data-config="/examples/gallery/paired-bar/paired-bar-chart.json"></div> -->
61
95
 
62
96
  <!-- HORIZONTAL BAR CHARTS -->
63
97
  <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-bar-chart-with-numbers-on-bar.json"></div> -->
@@ -65,23 +99,13 @@
65
99
  <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-stacked.json"></div> -->
66
100
 
67
101
  <!-- VERTICAL BAR CHARTS -->
68
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/combo-line-chart.json"></div> -->
102
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/combo-line-chart.json"></div> -->
69
103
  <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-categorical.json"></div> -->
70
104
  <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-stacked.json"></div> -->
71
- <!-- <div class="react-container" data-config="/examples/stacked-vertical-bar-example-nonnumerics.json"></div> -->
72
105
  <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-confidence.json"></div> -->
73
106
  <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-confidence.json"></div> -->
74
107
  <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart.json"></div> -->
75
108
 
76
- <!-- <div class="react-container" data-config="/examples/area-chart.json"></div> -->
77
- <!-- <div class="react-container" data-config="/examples/scatterplot.json"></div> -->
78
- <!-- <div class="react-container" data-config="/examples/box-plot.json"></div> -->
79
- <!-- Paired bar Chart -->
80
- <!-- <div class="react-container" data-config="/examples/gallery/paired-bar/paired-bar-chart.json"></div> -->
81
-
82
- <!-- Deviation Bar Chart -->
83
- <!-- <div class="react-container" data-config="/examples/planet-deviation-config.json"></div> -->
84
-
85
109
  <noscript>You need to enable JavaScript to run this app.</noscript>
86
110
  </body>
87
111
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cdc/chart",
3
- "version": "4.23.3",
3
+ "version": "4.23.5",
4
4
  "description": "React component for visualizing tabular data in various types of charts",
5
5
  "moduleName": "CdcChart",
6
6
  "main": "dist/cdcchart",
@@ -57,7 +57,7 @@
57
57
  "react": "^18.2.0",
58
58
  "react-dom": "^18.2.0"
59
59
  },
60
- "gitHead": "6fa3b11db159d38538f18023fe70b67a29e7d327",
60
+ "gitHead": "34add3436994ca3cf13e51f313add4d70377f53e",
61
61
  "devDependencies": {
62
62
  "resize-observer-polyfill": "^1.5.1"
63
63
  }