@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
package/index.html CHANGED
@@ -1,38 +1,39 @@
1
1
  <!DOCTYPE html>
2
2
  <html lang="en">
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
6
- <style>
7
- body {
8
- margin: 0;
9
- border-top: none !important;
10
- }
11
-
12
- .cdc-map-outer-container {
13
- min-height: 100vh;
14
- }
15
-
16
- /* .react-container + .react-container {
3
+
4
+ <head>
5
+ <meta charset="utf-8" />
6
+ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
7
+ <style>
8
+ body {
9
+ margin: 0;
10
+ border-top: none !important;
11
+ }
12
+
13
+ .cdc-map-outer-container {
14
+ min-height: 100vh;
15
+ }
16
+
17
+ /* .react-container + .react-container {
17
18
  margin-top: 3rem;
18
19
  } */
19
- </style>
20
- <link rel="stylesheet prefetch" href="https://www.cdc.gov/TemplatePackage/5.0/css/app.min.css?_=71669" />
21
- </head>
20
+ </style>
21
+ <link rel="stylesheet prefetch" href="https://www.cdc.gov/TemplatePackage/5.0/css/app.min.css?_=71669" />
22
+ </head>
22
23
 
23
- <body>
24
- <!-- SANKEY EXAMPLE -->
25
- <!-- <div class="container d-flex flex-wrap body-wrapper bg-white" style="width: 750px">
24
+ <body>
25
+ <!-- SANKEY EXAMPLE -->
26
+ <!-- <div class="container d-flex flex-wrap body-wrapper bg-white" style="width: 750px">
26
27
  <main class="col-lg-9 order-lg-2" role="main" aria-label="Main Content Area">
27
28
  <div class="row">
28
29
  <div class="col-md-12"> -->
29
- <!-- <div class="react-container" data-config="/examples/feature/sankey/sankey-example-data.json"></div> -->
30
- <!-- </div>
30
+ <!-- <div class="react-container" data-config="/examples/feature/sankey/sankey-example-data.json"></div> -->
31
+ <!-- </div>
31
32
  </div>
32
33
  </main>
33
34
  </div> -->
34
35
 
35
- <!--
36
+ <!--
36
37
  EXAMPLES:
37
38
  chart/examples/features: different chart types and tests
38
39
  chart/examples/private: an ignored git folder used for addl. troubleshooting.
@@ -44,123 +45,123 @@
44
45
 
45
46
  -->
46
47
 
47
- <!-- GENERIC CHART TYPES -->
48
- <div class="react-container" data-config="/examples/private/ari-other-conditions-1.json"></div>
49
- <!-- <div class="react-container" data-config="/examples/cases-year.json"></div>-->
50
- <!-- <div class="react-container" data-config="/examples/test.json"></div> -->
51
- <!-- <div class="react-container" data-config="/examples/feature/line/line-chart.json"></div> -->
52
- <!-- <div class="react-container" data-config="/examples/dev-8332.json"></div> -->
53
- <!-- <div class="react-container" data-config="/examples/feature/annotations/index.json"></div> -->
54
- <!-- <div class="react-container" data-config="/examples/feature/filters/url-filter.json"></div> -->
55
- <!-- <div class="react-container" data-config="/examples/feature/bar/additional-column-tooltip.json"></div> -->
56
- <!-- <div class="react-container" data-config="https://cdc.gov/poxvirus/mpox/modules/data-viz/mpx-trends_1.json"></div> -->
57
- <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-date-apple.json"></div> -->
58
- <!-- <div class="react-container" data-config="/examples/feature/forest-plot/linear.json"></div> -->
59
- <!-- <div class="react-container" data-config="/examples/feature/forest-plot/logarithmic.json"></div> -->
60
- <!-- <div class="react-container" data-config="/examples/feature/forest-plot/forest-plot.json"></div> -->
61
- <!-- <div class="react-container" data-config="/examples/feature/pie/planet-pie-example-config.json"></div> -->
62
- <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Viz.json></div> -->
63
- <!-- <div class="react-container" data-config=/examples/feature/regions/index.json></div> -->
64
- <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Regions_Viz.json></div> -->
65
- <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Regions_Viz.json></div> -->
66
- <!-- <div class="react-container" data-config="/examples/feature/forecasting/forecasting.json"></div> -->
67
- <!-- <div class="react-container" data-config="/examples/feature/forecasting/combo-forecasting.json"></div> -->
68
- <!-- <div class="react-container" data-config="/examples/feature/forecasting/effective_reproduction.json"></div> -->
69
- <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-date.json"></div> -->
70
- <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-category.json"></div> -->
71
- <!-- <div class="react-container" data-config="/examples/scatterplot-image-download.json"></div> -->
72
- <!-- <div class="react-container" data-config="/examples/feature/deviation/planet-deviation-config.json"></div> -->
73
- <!-- <div class="react-container" data-config="/examples/private/test.json"></div> -->
74
- <!-- <div class="react-container" data-config="/examples/feature/combo/planet-combo-example-config.json"></div> -->
75
- <!-- <div class="react-container" data-config="/examples/feature/combo/right-issues.json"></div> -->
76
- <!-- <div class="react-container" data-config="/examples/dev-9822.json"></div> -->
77
-
78
- <!-- BAR -->
79
- <!-- <div class="react-container" data-config="/examples/feature/bar/planet-example-config.json"></div> -->
80
- <!-- <div class="react-container" data-config="/examples/feature/bar/planet-chart-horizontal-example-config.json"></div> -->
81
- <!-- <div class="react-container" data-config="/examples/feature/bar/example-bar-chart.json"></div> -->
82
- <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-chart-max-increase.json"></div> -->
83
- <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-chart.json"></div> -->
84
- <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-stacked-bar-chart.json"></div> -->
85
- <!-- <div class="react-container" data-config="/examples/feature/bar/planet-chart-horizontal-example-config.json"></div> -->
86
-
87
- <!-- TESTS DATA TABLE SORTING -->
88
- <!-- Bar Chart with Confidence Intervals (bottom of page) -->
89
- <!-- <div class="react-container" data-config="https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Example_Bar_CI.json"></div> -->
90
- <!-- TPOXX Patient Data -->
91
- <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/tpoxx_weekly_race_eth.json"></div> -->
92
- <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpx-tpoxx-age-gender.json"></div> -->
93
- <!-- Non-Variola Orthopoxvirus (NVO) Laboratory Testing by Demographics -->
94
- <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/poxvirus/mpox/modules/data-viz/lab-data.json"></div> -->
95
- <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/poxvirus/mpox/modules/data-viz/lab-data-age.json"></div> -->
96
- <!-- PROBLEM WITH THEIR PAGE CONFIG or CONFLICT with -->
97
- <!-- CORS ERROR pulling data on Covid Flu RSV page at https://wwwdev-cdc.msappproxy.net/respiratory-viruses/index.html-->
98
- <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/respiratory-viruses/modules/emergency-dept-visits_live.json"></div> -->
99
- <!-- MPOX -->
100
- <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpox-demographics-monthly.json"></div> -->
101
- <!-- <div class="react-container" data-config="/https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpx-age-sex1.json"></div> -->
102
-
103
- <!-- TESTS DATE EXCLUSIONS -->
104
- <!-- <div class="react-container" data-config="/examples/feature/boxplot/boxplot.json"></div> -->
105
- <!-- <div class="react-container" data-config="/examples/feature/tests-case-rate/case-rate-example-config.json"></div> -->
106
-
107
- <!-- TESTS BIG SMALL-->
108
- <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-line.json"></div> -->
109
- <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-bar.json"></div> -->
110
- <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-negative.json"></div> -->
111
- <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/line-chart-max-increase.json"></div> -->
112
-
113
- <!-- TESTS NONNUMERICS -->
114
- <!-- <div
48
+ <!-- GENERIC CHART TYPES -->
49
+ <!-- <div class="react-container" data-config="/examples/private/ari-other-conditions-1.json"></div> -->
50
+ <!-- <div class="react-container" data-config="/examples/private/Viral-Respiratory-Deaths-Age.json"></div> -->
51
+ <!-- <div class="react-container" data-config="/examples/cases-year.json"></div>-->
52
+ <!-- <div class="react-container" data-config="/examples/test.json"></div> -->
53
+ <!-- <div class="react-container" data-config="/examples/feature/line/line-chart.json"></div> -->
54
+ <!-- <div class="react-container" data-config="/examples/dev-8332.json"></div> -->
55
+ <!-- <div class="react-container" data-config="/examples/feature/annotations/index.json"></div> -->
56
+ <!-- <div class="react-container" data-config="/examples/feature/filters/url-filter.json"></div> -->
57
+ <!-- <div class="react-container" data-config="/examples/feature/bar/additional-column-tooltip.json"></div> -->
58
+ <!-- <div class="react-container" data-config="https://cdc.gov/poxvirus/mpox/modules/data-viz/mpx-trends_1.json"></div> -->
59
+ <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-date-apple.json"></div> -->
60
+ <!-- <div class="react-container" data-config="/examples/feature/forest-plot/linear.json"></div> -->
61
+ <!-- <div class="react-container" data-config="/examples/feature/forest-plot/logarithmic.json"></div> -->
62
+ <!-- <div class="react-container" data-config="/examples/feature/forest-plot/forest-plot.json"></div> -->
63
+ <!-- <div class="react-container" data-config="/examples/feature/pie/planet-pie-example-config.json"></div> -->
64
+ <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Viz.json></div> -->
65
+ <!-- <div class="react-container" data-config=/examples/feature/regions/index.json></div> -->
66
+ <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Regions_Viz.json></div> -->
67
+ <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Regions_Viz.json></div> -->
68
+ <!-- <div class="react-container" data-config="/examples/feature/forecasting/forecasting.json"></div> -->
69
+ <!-- <div class="react-container" data-config="/examples/feature/forecasting/combo-forecasting.json"></div> -->
70
+ <!-- <div class="react-container" data-config="/examples/feature/forecasting/effective_reproduction.json"></div> -->
71
+ <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-date.json"></div> -->
72
+ <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-category.json"></div> -->
73
+ <!-- <div class="react-container" data-config="/examples/scatterplot-image-download.json"></div> -->
74
+ <!-- <div class="react-container" data-config="/examples/feature/deviation/planet-deviation-config.json"></div> -->
75
+ <!-- <div class="react-container" data-config="/examples/private/test.json"></div> -->
76
+ <!-- <div class="react-container" data-config="/examples/feature/combo/planet-combo-example-config.json"></div> -->
77
+ <!-- <div class="react-container" data-config="/examples/feature/combo/right-issues.json"></div> -->
78
+ <!-- <div class="react-container" data-config="/examples/dev-9822.json"></div> -->
79
+
80
+ <!-- BAR -->
81
+ <!-- <div class="react-container" data-config="/examples/feature/bar/planet-example-config.json"></div> -->
82
+ <!-- <div class="react-container" data-config="/examples/feature/bar/planet-chart-horizontal-example-config.json"></div> -->
83
+ <!-- <div class="react-container" data-config="/examples/feature/bar/example-bar-chart.json"></div> -->
84
+ <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-chart-max-increase.json"></div> -->
85
+ <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-chart.json"></div> -->
86
+ <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-stacked-bar-chart.json"></div> -->
87
+ <!-- <div class="react-container" data-config="/examples/feature/bar/planet-chart-horizontal-example-config.json"></div> -->
88
+
89
+ <!-- TESTS DATA TABLE SORTING -->
90
+ <!-- Bar Chart with Confidence Intervals (bottom of page) -->
91
+ <!-- <div class="react-container" data-config="https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Example_Bar_CI.json"></div> -->
92
+ <!-- TPOXX Patient Data -->
93
+ <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/tpoxx_weekly_race_eth.json"></div> -->
94
+ <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpx-tpoxx-age-gender.json"></div> -->
95
+ <!-- Non-Variola Orthopoxvirus (NVO) Laboratory Testing by Demographics -->
96
+ <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/poxvirus/mpox/modules/data-viz/lab-data.json"></div> -->
97
+ <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/poxvirus/mpox/modules/data-viz/lab-data-age.json"></div> -->
98
+ <!-- PROBLEM WITH THEIR PAGE CONFIG or CONFLICT with -->
99
+ <!-- CORS ERROR pulling data on Covid Flu RSV page at https://wwwdev-cdc.msappproxy.net/respiratory-viruses/index.html-->
100
+ <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/respiratory-viruses/modules/emergency-dept-visits_live.json"></div> -->
101
+ <!-- MPOX -->
102
+ <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpox-demographics-monthly.json"></div> -->
103
+ <!-- <div class="react-container" data-config="/https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpx-age-sex1.json"></div> -->
104
+
105
+ <!-- TESTS DATE EXCLUSIONS -->
106
+ <!-- <div class="react-container" data-config="/examples/feature/boxplot/boxplot.json"></div> -->
107
+ <!-- <div class="react-container" data-config="/examples/feature/tests-case-rate/case-rate-example-config.json"></div> -->
108
+
109
+ <!-- TESTS BIG SMALL-->
110
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-line.json"></div> -->
111
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-bar.json"></div> -->
112
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-negative.json"></div> -->
113
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/line-chart-max-increase.json"></div> -->
114
+
115
+ <!-- TESTS NONNUMERICS -->
116
+ <!-- <div
115
117
  class="react-container"
116
118
  data-config="/examples/feature/tests-non-numerics/planet-pie-example-config-nonnumeric.json"
117
119
  ></div> -->
118
- <div
119
- class="react-container"
120
- data-config="/examples/feature/tests-non-numerics/example-combo-bar-nonnumeric.json"
121
- ></div>
122
- <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/example-bar-chart-nonnumeric.json"></div> -->
123
- <!-- <div class="react-container" data-config="/examples/sparkline.json"></div> -->
124
- <!-- <div
120
+ <div class="react-container" data-config="/examples/feature/tests-non-numerics/example-combo-bar-nonnumeric.json">
121
+ </div>
122
+ <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/example-bar-chart-nonnumeric.json"></div> -->
123
+ <!-- <div class="react-container" data-config="/examples/sparkline.json"></div> -->
124
+ <!-- <div
125
125
  class="react-container"
126
126
  data-config="/examples/feature/tests-non-numerics/sparkline-chart-nonnumeric.json"
127
127
  ></div> -->
128
- <!-- <div class="react-container" data-config="/examples/region-issue.json"></div> -->
129
- <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/stacked-vertical-bar-example-nonnumerics.json"></div> -->
128
+ <!-- <div class="react-container" data-config="/examples/region-issue.json"></div> -->
129
+ <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/stacked-vertical-bar-example-nonnumerics.json"></div> -->
130
130
 
131
- <!-- TESTS CUTOFF -->
132
- <!-- <div class="react-container" data-config="/examples/feature/tests-cutoff/cutoff-example-config.json"></div> -->
131
+ <!-- TESTS CUTOFF -->
132
+ <!-- <div class="react-container" data-config="/examples/feature/tests-cutoff/cutoff-example-config.json"></div> -->
133
133
 
134
- <!-- TESTS COVID -->
135
- <!-- <div class="react-container" data-config="/examples/feature/tests-covid/covid-confidence-example-config.json"></div> -->
136
- <!-- <div class="react-container" data-config="/examples/feature/tests-covid/covid-example-config.json"></div> -->
134
+ <!-- TESTS COVID -->
135
+ <!-- <div class="react-container" data-config="/examples/feature/tests-covid/covid-confidence-example-config.json"></div> -->
136
+ <!-- <div class="react-container" data-config="/examples/feature/tests-covid/covid-example-config.json"></div> -->
137
137
 
138
- <!--
138
+ <!--
139
139
  GALLERY EXAMPLES BELOW THIS LINE...
140
140
  https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/example-data-map-cities-states.html
141
141
 
142
142
  -->
143
143
 
144
- <!-- GENERIC CHART TYPES -->
145
- <!-- <div class="react-container" data-config="/examples/gallery/paired-bar/paired-bar-chart.json"></div> -->
146
- <!-- <div class="react-container" data-config="/examples/feature/line/line-chart.json"></div> -->
147
- <!-- <div class="react-container" data-config="/examples/feature/annotations/index.json"></div> -->
148
-
149
- <!-- HORIZONTAL BAR CHARTS -->
150
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-bar-chart-with-numbers-on-bar.json"></div> -->
151
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-bar-chart.json"></div> -->
152
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-stacked.json"></div> -->
153
-
154
- <!-- VERTICAL BAR CHARTS -->
155
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/combo-line-chart.json"></div> -->
156
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-categorical.json"></div> -->
157
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-stacked.json"></div> -->
158
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-confidence.json"></div> -->
159
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart.json"></div> -->
160
- <!-- <div class="react-container" data-config="https://www.cdc.gov/respiratory-viruses/modules/respiratory-virus-activity/emergency-dept-visits_live.json"></div> -->
161
-
162
- <noscript>You need to enable JavaScript to run this app.</noscript>
163
-
164
- <script type="module" src="./src/index.jsx"></script>
165
- </body>
166
- </html>
144
+ <!-- GENERIC CHART TYPES -->
145
+ <!-- <div class="react-container" data-config="/examples/gallery/paired-bar/paired-bar-chart.json"></div> -->
146
+ <!-- <div class="react-container" data-config="/examples/feature/line/line-chart.json"></div> -->
147
+ <!-- <div class="react-container" data-config="/examples/feature/annotations/index.json"></div> -->
148
+
149
+ <!-- HORIZONTAL BAR CHARTS -->
150
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-bar-chart-with-numbers-on-bar.json"></div> -->
151
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-bar-chart.json"></div> -->
152
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-stacked.json"></div> -->
153
+
154
+ <!-- VERTICAL BAR CHARTS -->
155
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/combo-line-chart.json"></div> -->
156
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-categorical.json"></div> -->
157
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-stacked.json"></div> -->
158
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-confidence.json"></div> -->
159
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart.json"></div> -->
160
+ <!-- <div class="react-container" data-config="https://www.cdc.gov/respiratory-viruses/modules/respiratory-virus-activity/emergency-dept-visits_live.json"></div> -->
161
+
162
+ <noscript>You need to enable JavaScript to run this app.</noscript>
163
+
164
+ <script type="module" src="./src/index.jsx"></script>
165
+ </body>
166
+
167
+ </html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cdc/chart",
3
- "version": "4.25.3",
3
+ "version": "4.25.6",
4
4
  "description": "React component for visualizing tabular data in various types of charts",
5
5
  "moduleName": "CdcChart",
6
6
  "main": "dist/cdcchart",
@@ -27,43 +27,38 @@
27
27
  "license": "Apache-2.0",
28
28
  "dependencies": {
29
29
  "@hello-pangea/dnd": "^16.2.0",
30
- "@visx/axis": "^3.0.0",
31
- "@visx/curve": "^3.0.0",
32
- "@visx/event": "^3.0.1",
33
- "@visx/glyph": "^3.3.0",
34
- "@visx/gradient": "^3.0.0",
35
- "@visx/group": "^3.0.0",
36
- "@visx/legend": "^3.0.0",
37
- "@visx/marker": "^3.0.0",
38
- "@visx/mock-data": "^3.0.0",
39
- "@visx/scale": "^3.0.0",
40
- "@visx/shape": "^3.3.0",
41
- "@visx/stats": "^3.0.0",
42
- "@visx/text": "^3.0.0",
43
- "@visx/tooltip": "^3.0.0",
44
- "chroma-js": "^2.1.2",
45
- "d3-array": "^2.8.0",
30
+ "@react-spring/web": "^9.7.5",
31
+ "@visx/axis": "3.12.0",
32
+ "@visx/curve": "3.12.0",
33
+ "@visx/event": "3.12.0",
34
+ "@visx/glyph": "3.12.0",
35
+ "@visx/gradient": "3.12.0",
36
+ "@visx/marker": "3.12.0",
37
+ "@visx/mock-data": "3.12.0",
38
+ "@visx/scale": "3.12.0",
39
+ "@visx/shape": "3.12.0",
40
+ "@visx/stats": "3.12.0",
41
+ "@visx/text": "3.12.0",
42
+ "@visx/tooltip": "3.12.0",
43
+ "d3-array": "3.2.4",
46
44
  "d3-format": "^3.1.0",
47
45
  "d3-sankey": "^0.12.3",
48
- "d3-time-format": "^3.0.0",
49
- "html-react-parser": "^3.0.8",
46
+ "d3-time-format": "4.1.0",
50
47
  "js-base64": "^2.5.2",
51
- "papaparse": "^5.3.0",
52
48
  "react-accessible-accordion": "^3.3.4",
53
- "react-icons": "^4.11.0",
54
- "react-spring": "^8.0.27",
55
- "react-table": "^7.5.0",
56
- "react-tooltip": "5.8.2-beta.3",
57
- "use-debounce": "^6.0.1",
58
- "whatwg-fetch": "^3.6.2"
49
+ "react-icons": "5.5.0",
50
+ "use-debounce": "^6.0.1"
59
51
  },
60
52
  "peerDependencies": {
61
53
  "react": "^18.2.0",
62
54
  "react-dom": "^18.2.0"
63
55
  },
64
- "gitHead": "b09566f5a7d57c8d0109e5f407257729d6b36846",
56
+ "gitHead": "6097de1ff814001880d9ac64bd66becdc092d63c",
65
57
  "devDependencies": {
58
+ "@types/d3-array": "^3.2.1",
59
+ "@types/d3-format": "^3.0.4",
66
60
  "@types/d3-sankey": "^0.12.4",
61
+ "@types/d3-time-format": "^4.0.3",
67
62
  "resize-observer-polyfill": "^1.5.1"
68
63
  }
69
64
  }