@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
package/index.html CHANGED
@@ -1,25 +1,36 @@
1
1
  <!DOCTYPE html>
2
2
  <html lang="en">
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
- /* max-width: 1000px; */
10
- margin: 0 auto !important;
11
- display: flex;
12
- flex-direction: column;
13
- justify-content: center;
14
- }
15
-
16
- .react-container+.react-container {
17
- margin-top: 3rem;
18
- }
19
- </style>
20
- </head>
21
-
22
- <body>
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
+ /* max-width: 1000px; */
9
+ margin: 0 auto !important;
10
+ display: flex;
11
+ flex-direction: column;
12
+ justify-content: center;
13
+ }
14
+
15
+ .react-container + .react-container {
16
+ margin-top: 3rem;
17
+ }
18
+ </style>
19
+ <link rel="stylesheet prefetch" href="https://www.cdc.gov/TemplatePackage/contrib/libs/bootstrap/latest/css/bootstrap.min.css?_=39423" />
20
+ <link rel="stylesheet prefetch" href="https://www.cdc.gov/TemplatePackage/4.0/assets/css/app.min.css?_=39423" />
21
+ </head>
22
+
23
+ <body>
24
+ <!-- SANKEY EXAMPLE -->
25
+ <!-- <div class="container d-flex flex-wrap body-wrapper bg-white">
26
+ <main class="col-lg-9 order-lg-2" role="main" aria-label="Main Content Area">
27
+ <div class="row">
28
+ <div class="col-md-12"> -->
29
+ <!-- <div class="react-container" data-config="/examples/feature/sankey/sankey-example-data.json"></div> -->
30
+ <!-- </div>
31
+ </div>
32
+ </main>
33
+ </div> -->
23
34
 
24
35
  <!--
25
36
  EXAMPLES:
@@ -33,87 +44,86 @@
33
44
 
34
45
  -->
35
46
 
36
- <!-- GENERIC CHART TYPES -->
37
- <!-- <div class="react-container" data-config="/examples/private/prod-line-config.json"></div> -->
38
- <!-- <div class="react-container" data-config="/examples/private/chart-t.json"></div> -->
39
- <!-- <div class="react-container" data-config="/examples/feature/bar/additional-column-tooltip.json"></div> -->
40
- <!-- <div class="react-container" data-config="https://cdc.gov/poxvirus/mpox/modules/data-viz/mpx-trends_1.json"></div> -->
41
- <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-date-city-temperature.json"></div> -->
42
- <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-date-apple.json"></div> -->
43
- <!-- <div class="react-container" data-config="/examples/feature/forest-plot/linear.json"></div> -->
44
- <!-- <div class="react-container" data-config="/examples/feature/forest-plot/logarithmic.json"></div> -->
45
- <!-- <div class="react-container" data-config="/examples/feature/forest-plot/forest-plot.json"></div> -->
46
- <!-- <div class="react-container" data-config="/examples/feature/pie/planet-pie-example-config.json"></div> -->
47
- <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Viz.json></div> -->
48
- <!-- <div class="react-container" data-config=/examples/feature/regions/index.json></div> -->
49
- <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Regions_Viz.json></div> -->
50
- <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Regions_Viz.json></div> -->
51
- <!-- <div class="react-container" data-config="/examples/feature/forecasting/forecasting.json"></div> -->
52
- <!-- <div class="react-container" data-config="/examples/feature/forecasting/combo-forecasting.json"></div> -->
53
- <!-- <div class="react-container" data-config="/examples/feature/forecasting/effective_reproduction.json"></div> -->
54
- <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-date.json"></div> -->
55
- <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-category.json"></div> -->
56
- <!-- <div class="react-container" data-config="/examples/feature/scatterplot/scatterplot.json"></div> -->
57
- <!-- <div class="react-container" data-config="/examples/feature/deviation/planet-deviation-config.json"></div> -->
58
- <!-- <div class="react-container" data-config="/examples/feature/boxplot/boxplot.json"></div> -->
59
- <!-- <div class="react-container" data-config="/examples/feature/combo/planet-combo-example-config.json"></div> -->
60
- <!-- <div class="react-container" data-config="/examples/feature/combo/right-issues.json"></div> -->
61
- <!-- <div class="react-container" data-config="/examples/feature/paired-bar/paired-bar-example.json"></div> -->
62
-
63
- <!-- BAR -->
64
- <!-- <div class="react-container" data-config="/examples/feature/bar/planet-example-config.json"></div> -->
65
- <!-- <div class="react-container" data-config="/examples/feature/bar/planet-chart-horizontal-example-config.json"></div> -->
66
- <!-- <div class="react-container" data-config="/examples/feature/bar/example-bar-chart.json"></div> -->
67
- <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-chart-max-increase.json"></div> -->
68
- <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-chart.json"></div> -->
69
- <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-stacked-bar-chart.json"></div> -->
70
- <!-- <div class="react-container" data-config="/examples/feature/bar/planet-chart-horizontal-example-config.json"></div> -->
71
-
72
- <!-- SPARKLINE -->
73
- <!-- <div class="react-container" data-config="/examples/feature/dev-4261.json"></div> -->
74
-
75
- <!-- TESTS DATA TABLE SORTING -->
76
- <!-- Bar Chart with Confidence Intervals (bottom of page) -->
77
- <!-- <div class="react-container" data-config="https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Example_Bar_CI.json"></div> -->
78
- <!-- TPOXX Patient Data -->
79
- <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/tpoxx_weekly_race_eth.json"></div> -->
80
- <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpx-tpoxx-age-gender.json"></div> -->
81
- <!-- Non-Variola Orthopoxvirus (NVO) Laboratory Testing by Demographics -->
82
- <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/poxvirus/mpox/modules/data-viz/lab-data.json"></div> -->
83
- <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/poxvirus/mpox/modules/data-viz/lab-data-age.json"></div> -->
84
- <!-- PROBLEM WITH THEIR PAGE CONFIG or CONFLICT with -->
85
- <!-- CORS ERROR pulling data on Covid Flu RSV page at https://wwwdev-cdc.msappproxy.net/respiratory-viruses/index.html-->
86
- <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/respiratory-viruses/modules/emergency-dept-visits_live.json"></div> -->
87
- <!-- MPOX -->
88
- <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpox-demographics-monthly.json"></div> -->
89
- <!-- <div class="react-container" data-config="/https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpx-age-sex1.json"></div> -->
90
-
91
-
92
- <!-- TESTS DATE EXCLUSIONS -->
93
- <!-- <div class="react-container" data-config="/examples/feature/tests-date-exclusions/date-exclusions-config.json"></div> -->
94
- <!-- <div class="react-container" data-config="/examples/feature/tests-case-rate/case-rate-example-config.json"></div> -->
95
-
96
- <!-- TESTS BIG SMALL-->
97
- <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-line.json"></div> -->
98
- <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-bar.json"></div> -->
99
- <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-negative.json"></div> -->
100
- <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/line-chart-max-increase.json"></div> -->
101
-
102
- <!-- TESTS NONNUMERICS -->
103
- <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/planet-pie-example-config-nonnumeric.json"></div> -->
104
- <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/example-combo-bar-nonnumeric.json"></div> -->
105
- <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/example-bar-chart-nonnumeric.json"></div> -->
106
- <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/sparkline-chart-nonnumeric.json"></div> -->
107
- <!-- <div class="react-container" data-config="/examples/feature/bar/lollipop.json"></div> -->
108
- <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/stacked-vertical-bar-example-nonnumerics.json"></div> -->
109
-
110
- <!-- TESTS CUTOFF -->
111
- <!-- <div class="react-container" data-config="/examples/feature/tests-cutoff/cutoff-example-config.json"></div> -->
112
-
113
- <!-- TESTS COVID -->
114
- <!-- <div class="react-container" data-config="/examples/feature/tests-covid/covid-confidence-example-config.json"></div> -->
115
- <!-- <div class="react-container" data-config="/examples/feature/tests-covid/covid-example-config.json"></div> -->
116
-
47
+ <!-- GENERIC CHART TYPES -->
48
+ <!-- <div class="react-container" data-config="/examples/private/rvr.json"></div> -->
49
+ <!-- <div class="react-container" data-config="/examples/feature/filters/url-filter.json"></div> -->
50
+ <!-- <div class="react-container" data-config="/examples/feature/bar/additional-column-tooltip.json"></div> -->
51
+ <!-- <div class="react-container" data-config="https://cdc.gov/poxvirus/mpox/modules/data-viz/mpx-trends_1.json"></div> -->
52
+ <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-date-city-temperature.json"></div> -->
53
+ <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-date-apple.json"></div> -->
54
+ <!-- <div class="react-container" data-config="/examples/feature/forest-plot/linear.json"></div> -->
55
+ <!-- <div class="react-container" data-config="/examples/feature/forest-plot/logarithmic.json"></div> -->
56
+ <!-- <div class="react-container" data-config="/examples/feature/forest-plot/forest-plot.json"></div> -->
57
+ <!-- <div class="react-container" data-config="/examples/feature/pie/planet-pie-example-config.json"></div> -->
58
+ <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Viz.json></div> -->
59
+ <!-- <div class="react-container" data-config=/examples/feature/regions/index.json></div> -->
60
+ <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Regions_Viz.json></div> -->
61
+ <!-- <div class="react-container" data-config=https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Line_Chart_Regions_Viz.json></div> -->
62
+ <!-- <div class="react-container" data-config="/examples/feature/forecasting/forecasting.json"></div> -->
63
+ <!-- <div class="react-container" data-config="/examples/feature/forecasting/combo-forecasting.json"></div> -->
64
+ <!-- <div class="react-container" data-config="/examples/feature/forecasting/effective_reproduction.json"></div> -->
65
+ <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-date.json"></div> -->
66
+ <!-- <div class="react-container" data-config="/examples/feature/area/area-chart-category.json"></div> -->
67
+ <!-- <div class="react-container" data-config="/examples/feature/scatterplot/scatterplot.json"></div> -->
68
+ <!-- <div class="react-container" data-config="/examples/feature/deviation/planet-deviation-config.json"></div> -->
69
+ <!-- <div class="react-container" data-config="/examples/feature/boxplot/boxplot.json"></div> -->
70
+ <!-- <div class="react-container" data-config="/examples/feature/combo/planet-combo-example-config.json"></div> -->
71
+ <!-- <div class="react-container" data-config="/examples/feature/combo/right-issues.json"></div> -->
72
+ <div class="react-container" data-config="/examples/region-issue.json"></div>
73
+
74
+ <!-- BAR -->
75
+ <!-- <div class="react-container" data-config="/examples/feature/bar/planet-example-config.json"></div> -->
76
+ <!-- <div class="react-container" data-config="/examples/feature/bar/planet-chart-horizontal-example-config.json"></div> -->
77
+ <!-- <div class="react-container" data-config="/examples/feature/bar/example-bar-chart.json"></div> -->
78
+ <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-chart-max-increase.json"></div> -->
79
+ <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-chart.json"></div> -->
80
+ <!-- <div class="react-container" data-config="/examples/feature/bar/horizontal-stacked-bar-chart.json"></div> -->
81
+ <!-- <div class="react-container" data-config="/examples/feature/bar/planet-chart-horizontal-example-config.json"></div> -->
82
+
83
+ <!-- SPARKLINE -->
84
+ <!-- <div class="react-container" data-config="/examples/feature/dev-4261.json"></div> -->
85
+
86
+ <!-- TESTS DATA TABLE SORTING -->
87
+ <!-- Bar Chart with Confidence Intervals (bottom of page) -->
88
+ <!-- <div class="react-container" data-config="https://www.cdc.gov/wcms/4.0/cdc-wp/data-presentation/examples/Example_Bar_CI.json"></div> -->
89
+ <!-- TPOXX Patient Data -->
90
+ <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/tpoxx_weekly_race_eth.json"></div> -->
91
+ <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpx-tpoxx-age-gender.json"></div> -->
92
+ <!-- Non-Variola Orthopoxvirus (NVO) Laboratory Testing by Demographics -->
93
+ <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/poxvirus/mpox/modules/data-viz/lab-data.json"></div> -->
94
+ <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/poxvirus/mpox/modules/data-viz/lab-data-age.json"></div> -->
95
+ <!-- PROBLEM WITH THEIR PAGE CONFIG or CONFLICT with -->
96
+ <!-- CORS ERROR pulling data on Covid Flu RSV page at https://wwwdev-cdc.msappproxy.net/respiratory-viruses/index.html-->
97
+ <!-- <div class="react-container" data-config="https://wwwdev-cdc.msappproxy.net/respiratory-viruses/modules/emergency-dept-visits_live.json"></div> -->
98
+ <!-- MPOX -->
99
+ <!-- <div class="react-container" data-config="https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpox-demographics-monthly.json"></div> -->
100
+ <!-- <div class="react-container" data-config="/https://www.cdc.gov/poxvirus/mpox/modules/data-viz/mpx-age-sex1.json"></div> -->
101
+
102
+ <!-- TESTS DATE EXCLUSIONS -->
103
+ <!-- <div class="react-container" data-config="/examples/feature/tests-date-exclusions/date-exclusions-config.json"></div> -->
104
+ <!-- <div class="react-container" data-config="/examples/feature/tests-case-rate/case-rate-example-config.json"></div> -->
105
+
106
+ <!-- TESTS BIG SMALL-->
107
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-line.json"></div> -->
108
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-bar.json"></div> -->
109
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/big-small-test-negative.json"></div> -->
110
+ <!-- <div class="react-container" data-config="/examples/feature/tests-big-small/line-chart-max-increase.json"></div> -->
111
+
112
+ <!-- TESTS NONNUMERICS -->
113
+ <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/planet-pie-example-config-nonnumeric.json"></div> -->
114
+ <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/example-combo-bar-nonnumeric.json"></div> -->
115
+ <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/example-bar-chart-nonnumeric.json"></div> -->
116
+ <!-- <div class="react-container" data-config="/examples/sparkline.json"></div> -->
117
+ <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/sparkline-chart-nonnumeric.json"></div> -->
118
+ <!-- <div class="react-container" data-config="/examples/feature/bar/lollipop.json"></div> -->
119
+ <!-- <div class="react-container" data-config="/examples/feature/tests-non-numerics/stacked-vertical-bar-example-nonnumerics.json"></div> -->
120
+
121
+ <!-- TESTS CUTOFF -->
122
+ <!-- <div class="react-container" data-config="/examples/feature/tests-cutoff/cutoff-example-config.json"></div> -->
123
+
124
+ <!-- TESTS COVID -->
125
+ <!-- <div class="react-container" data-config="/examples/feature/tests-covid/covid-confidence-example-config.json"></div> -->
126
+ <!-- <div class="react-container" data-config="/examples/feature/tests-covid/covid-example-config.json"></div> -->
117
127
 
118
128
  <!--
119
129
  GALLERY EXAMPLES BELOW THIS LINE...
@@ -121,28 +131,25 @@
121
131
 
122
132
  -->
123
133
 
124
- <!-- GENERIC CHART TYPES -->
125
- <!-- <div class="react-container" data-config="/examples/gallery/paired-bar/paired-bar-chart.json"></div> -->
126
- <div class="react-container" data-config="/examples/feature/line/line-chart-preliminary.json"></div>
127
-
128
-
129
- <!-- HORIZONTAL BAR CHARTS -->
130
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-bar-chart-with-numbers-on-bar.json"></div> -->
131
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-bar-chart.json"></div> -->
132
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-stacked.json"></div> -->
134
+ <!-- GENERIC CHART TYPES -->
135
+ <!-- <div class="react-container" data-config="/examples/gallery/paired-bar/paired-bar-chart.json"></div> -->
136
+ <!-- <div class="react-container" data-config="/examples/feature/line/line-chart.json"></div> -->
133
137
 
134
- <!-- VERTICAL BAR CHARTS -->
135
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/combo-line-chart.json"></div> -->
136
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-categorical.json"></div> -->
137
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-stacked.json"></div> -->
138
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-confidence.json"></div> -->
139
- <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart.json"></div> -->
140
- <!-- <div class="react-container" data-config="https://www.cdc.gov/respiratory-viruses/modules/respiratory-virus-activity/emergency-dept-visits_live.json"></div> -->
138
+ <!-- HORIZONTAL BAR CHARTS -->
139
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-bar-chart-with-numbers-on-bar.json"></div> -->
140
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-bar-chart.json"></div> -->
141
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-horizontal/horizontal-stacked.json"></div> -->
141
142
 
142
- <noscript>You need to enable JavaScript to run this app.</noscript>
143
- </body>
143
+ <!-- VERTICAL BAR CHARTS -->
144
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/combo-line-chart.json"></div> -->
145
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-categorical.json"></div> -->
146
+ <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-stacked.json"></div>
147
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart-confidence.json"></div> -->
148
+ <!-- <div class="react-container" data-config="/examples/gallery/bar-chart-vertical/vertical-bar-chart.json"></div> -->
149
+ <!-- <div class="react-container" data-config="https://www.cdc.gov/respiratory-viruses/modules/respiratory-virus-activity/emergency-dept-visits_live.json"></div> -->
144
150
 
145
- <script type="module" src="./src/index.jsx"></script>
146
- </body>
151
+ <noscript>You need to enable JavaScript to run this app.</noscript>
147
152
 
153
+ <script type="module" src="./src/index.jsx"></script>
154
+ </body>
148
155
  </html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cdc/chart",
3
- "version": "4.24.1",
3
+ "version": "4.24.3",
4
4
  "description": "React component for visualizing tabular data in various types of charts",
5
5
  "moduleName": "CdcChart",
6
6
  "main": "dist/cdcchart",
@@ -43,6 +43,7 @@
43
43
  "chroma-js": "^2.1.2",
44
44
  "d3-array": "^2.8.0",
45
45
  "d3-format": "^3.1.0",
46
+ "d3-sankey": "^0.12.3",
46
47
  "d3-time-format": "^3.0.0",
47
48
  "html-react-parser": "^3.0.8",
48
49
  "js-base64": "^2.5.2",
@@ -59,8 +60,9 @@
59
60
  "react": "^18.2.0",
60
61
  "react-dom": "^18.2.0"
61
62
  },
62
- "gitHead": "a352a3f74f4b681191e3244061dbb3621f36eec3",
63
+ "gitHead": "9c7ef7ca74f2d2a1e04d923b133fe0fc557a62bf",
63
64
  "devDependencies": {
65
+ "@types/d3-sankey": "^0.12.4",
64
66
  "resize-observer-polyfill": "^1.5.1"
65
67
  }
66
68
  }