@cdc/chart 4.25.10 → 4.26.1

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 (135) hide show
  1. package/dist/{cdcchart-1a1724a1.es.js → cdcchart-dgT_1dIT.es.js} +136 -151
  2. package/dist/cdcchart.js +44003 -43518
  3. package/examples/feature/__data__/planet-example-data.json +1 -1
  4. package/examples/feature/boxplot/valid-boxplot.csv +38 -17
  5. package/examples/feature/pie/planet-pie-example-config.json +48 -2
  6. package/examples/private/DEV-11825.json +573 -0
  7. package/examples/private/DEV-12100.json +1303 -0
  8. package/examples/private/cat-y.json +1235 -0
  9. package/examples/private/data-points.json +228 -0
  10. package/examples/private/height.json +3915 -0
  11. package/examples/private/links.json +569 -0
  12. package/examples/private/na.json +913 -0
  13. package/examples/private/quadrant.txt +30 -0
  14. package/examples/private/test-data.csv +28 -0
  15. package/examples/private/test-forecast.json +5510 -0
  16. package/examples/private/warming-stripe-test.json +2578 -0
  17. package/examples/private/warming-stripes.json +4763 -0
  18. package/examples/tech-adoption-with-links.json +560 -0
  19. package/index.html +16 -140
  20. package/package.json +6 -5
  21. package/preview.html +1616 -0
  22. package/src/CdcChart.tsx +8 -11
  23. package/src/CdcChartComponent.tsx +329 -124
  24. package/src/_stories/Chart.Combo.stories.tsx +18 -0
  25. package/src/_stories/Chart.Forecast.stories.tsx +36 -0
  26. package/src/_stories/Chart.HTMLInDataTable.stories.tsx +520 -0
  27. package/src/_stories/Chart.Patterns.stories.tsx +2 -1
  28. package/src/_stories/Chart.PreserveDecimals.stories.tsx +220 -0
  29. package/src/_stories/Chart.Regions.Categorical.stories.tsx +148 -0
  30. package/src/_stories/Chart.Regions.DateScale.stories.tsx +197 -0
  31. package/src/_stories/Chart.Regions.DateTimeScale.stories.tsx +297 -0
  32. package/src/_stories/Chart.SmallMultiples.stories.tsx +47 -0
  33. package/src/_stories/Chart.stories.tsx +8 -0
  34. package/src/_stories/ChartAnnotation.stories.tsx +6 -3
  35. package/src/_stories/ChartBar.Editor.stories.tsx +3585 -0
  36. package/src/_stories/ChartBrush.Editor.stories.tsx +295 -0
  37. package/src/_stories/ChartBrush.stories.tsx +50 -0
  38. package/src/_stories/ChartEditor.Editor.stories.tsx +656 -0
  39. package/src/_stories/ChartEditor.stories.tsx +1 -2
  40. package/src/_stories/TechAdoptionWithLinks.stories.tsx +27 -0
  41. package/src/_stories/_mock/brush_enabled.json +326 -0
  42. package/src/_stories/_mock/brush_mock.json +2 -69
  43. package/src/_stories/_mock/combo.json +451 -0
  44. package/src/_stories/_mock/editor-test-configs.json +376 -0
  45. package/src/_stories/_mock/editor-test-datasets.json +477 -0
  46. package/src/_stories/_mock/editor-tests/bar-chart-editor-test.json +255 -0
  47. package/src/_stories/_mock/editor-tests/bar-chart-general-test.json +267 -0
  48. package/src/_stories/_mock/editor-tests/bar-chart-test.json +237 -0
  49. package/src/_stories/_mock/forecast_combo_with_gaps.json +913 -0
  50. package/src/_stories/_mock/horizontal-bars-dynamic-y-axis.json +413 -0
  51. package/src/_stories/_mock/pie_config.json +257 -62
  52. package/src/_stories/_mock/small_multiples/small_multiples_bars.json +1944 -0
  53. package/src/_stories/_mock/small_multiples/small_multiples_big_data_bars.json +1114 -0
  54. package/src/_stories/_mock/small_multiples/small_multiples_lines.json +2646 -0
  55. package/src/_stories/_mock/small_multiples/small_multiples_lines_colors.json +1305 -0
  56. package/src/_stories/_mock/small_multiples/small_multiples_stacked_bars.json +1936 -0
  57. package/src/components/Annotations/components/findNearestDatum.ts +6 -41
  58. package/src/components/AreaChart/components/AreaChart.Stacked.jsx +10 -7
  59. package/src/components/AreaChart/index.tsx +1 -2
  60. package/src/components/Axis/Categorical.Axis.tsx +6 -7
  61. package/src/components/BarChart/components/BarChart.Horizontal.tsx +181 -27
  62. package/src/components/BarChart/components/BarChart.StackedHorizontal.tsx +3 -1
  63. package/src/components/BarChart/components/BarChart.StackedVertical.tsx +1 -0
  64. package/src/components/BarChart/components/BarChart.Vertical.tsx +8 -9
  65. package/src/components/BarChart/components/context.tsx +1 -0
  66. package/src/components/BarChart/helpers/useBarChart.ts +14 -2
  67. package/src/components/BoxPlot/helpers/index.ts +3 -3
  68. package/src/components/Brush/BrushSelector.tsx +1258 -0
  69. package/src/components/Brush/MiniChartPreview.tsx +283 -0
  70. package/src/components/DeviationBar.jsx +9 -7
  71. package/src/components/EditorPanel/EditorPanel.tsx +2720 -2586
  72. package/src/components/EditorPanel/components/Panels/Panel.Annotate.tsx +96 -111
  73. package/src/components/EditorPanel/components/Panels/Panel.ForestPlotSettings.tsx +56 -34
  74. package/src/components/EditorPanel/components/Panels/Panel.General.tsx +76 -31
  75. package/src/components/EditorPanel/components/Panels/Panel.PatternSettings.tsx +104 -55
  76. package/src/components/EditorPanel/components/Panels/Panel.Series.tsx +54 -49
  77. package/src/components/EditorPanel/components/Panels/Panel.SmallMultiples.tsx +427 -0
  78. package/src/components/EditorPanel/components/Panels/Panel.Visual.tsx +96 -48
  79. package/src/components/EditorPanel/components/Panels/index.tsx +3 -1
  80. package/src/components/EditorPanel/editor-panel.scss +0 -20
  81. package/src/components/EditorPanel/useEditorPermissions.ts +36 -31
  82. package/src/components/Forecasting/Forecasting.tsx +139 -21
  83. package/src/components/Legend/Legend.Component.tsx +16 -9
  84. package/src/components/Legend/Legend.tsx +3 -2
  85. package/src/components/Legend/helpers/createFormatLabels.tsx +325 -176
  86. package/src/components/Legend/helpers/getLegendClasses.ts +0 -1
  87. package/src/components/Legend/helpers/index.ts +10 -6
  88. package/src/components/LineChart/LineChartProps.ts +0 -3
  89. package/src/components/LineChart/helpers.ts +1 -1
  90. package/src/components/LineChart/index.tsx +36 -13
  91. package/src/components/LinearChart.tsx +559 -499
  92. package/src/components/PairedBarChart.jsx +20 -3
  93. package/src/components/Regions/components/Regions.tsx +366 -144
  94. package/src/components/Sankey/types/index.ts +1 -1
  95. package/src/components/ScatterPlot/ScatterPlot.jsx +2 -2
  96. package/src/components/SmallMultiples/SmallMultipleTile.tsx +202 -0
  97. package/src/components/SmallMultiples/SmallMultiples.css +32 -0
  98. package/src/components/SmallMultiples/SmallMultiples.tsx +271 -0
  99. package/src/components/SmallMultiples/index.ts +2 -0
  100. package/src/components/WarmingStripes/WarmingStripes.tsx +160 -0
  101. package/src/components/WarmingStripes/WarmingStripesGradientLegend.css +35 -0
  102. package/src/components/WarmingStripes/WarmingStripesGradientLegend.tsx +104 -0
  103. package/src/components/WarmingStripes/index.tsx +3 -0
  104. package/src/data/initial-state.js +16 -2
  105. package/src/helpers/buildForecastPaletteOptions.ts +0 -38
  106. package/src/helpers/calculateHorizontalBarCategoryLabelWidth.ts +57 -0
  107. package/src/helpers/getColorScale.ts +10 -0
  108. package/src/{hooks/useMinMax.ts → helpers/getMinMax.ts} +26 -14
  109. package/src/helpers/getYAxisAutoPadding.ts +53 -0
  110. package/src/helpers/sizeHelpers.ts +0 -20
  111. package/src/helpers/smallMultiplesHelpers.ts +529 -0
  112. package/src/hooks/useChartHoverAnalytics.tsx +10 -9
  113. package/src/hooks/useProgrammaticTooltip.ts +96 -0
  114. package/src/hooks/useScales.ts +98 -34
  115. package/src/hooks/useSmallMultipleSynchronization.ts +59 -0
  116. package/src/hooks/useTooltip.tsx +91 -25
  117. package/src/scss/DataTable.scss +0 -4
  118. package/src/scss/main.scss +18 -83
  119. package/src/store/chart.actions.ts +2 -0
  120. package/src/store/chart.reducer.ts +4 -0
  121. package/src/test/CdcChart.test.jsx +1 -1
  122. package/src/types/ChartConfig.ts +27 -6
  123. package/src/types/ChartContext.ts +3 -0
  124. package/src/types/Label.ts +1 -0
  125. package/src/utils/analyticsTracking.ts +19 -0
  126. package/LICENSE +0 -201
  127. package/src/_stories/_mock/pie_data.json +0 -218
  128. package/src/components/AreaChart/components/AreaChart.jsx +0 -109
  129. package/src/components/Brush/BrushChart.tsx +0 -128
  130. package/src/components/Brush/BrushController.tsx +0 -71
  131. package/src/components/Brush/types.tsx +0 -8
  132. package/src/components/BrushChart.tsx +0 -223
  133. package/src/helpers/sort.ts +0 -7
  134. package/src/hooks/useActiveElement.js +0 -19
  135. package/src/hooks/useChartClasses.js +0 -41
@@ -0,0 +1,228 @@
1
+
2
+ 90°
3
+
4
+
5
+ 179°
6
+
7
+
8
+ 10
9
+
10
+ 0
11
+
12
+
13
+ 90°
14
+
15
+
16
+ 100
17
+
18
+ 90
19
+
20
+
21
+ 179°
22
+
23
+
24
+ 80
25
+
26
+ 90
27
+
28
+
29
+ 180°
30
+
31
+
32
+ 269°
33
+
34
+
35
+ 10
36
+
37
+ 0
38
+
39
+
40
+ 1°–89°
41
+
42
+ 90
43
+
44
+ 100
45
+
46
+
47
+ 90
48
+
49
+ 80
50
+
51
+
52
+ 269°–360°
53
+
54
+
55
+ 269°–360°
56
+
57
+
58
+ 90
59
+
60
+ 80
61
+
62
+ 90
63
+
64
+
65
+ 269°
66
+
67
+
68
+ 92°
69
+
70
+
71
+ 90
72
+
73
+ 90
74
+
75
+ 90
76
+
77
+
78
+ 1°–179°
79
+
80
+
81
+ 90
82
+
83
+ 80
84
+
85
+ 80
86
+
87
+
88
+ 0°–180°
89
+
90
+
91
+ 90
92
+
93
+ 100
94
+
95
+ 80
96
+
97
+
98
+ 269°
99
+
100
+
101
+ 92°
102
+
103
+
104
+ 0
105
+
106
+ 0
107
+
108
+ 0
109
+
110
+
111
+ 135°
112
+
113
+
114
+ 0
115
+
116
+ 0
117
+
118
+ 20
119
+
120
+
121
+ 68°
122
+
123
+
124
+ 0
125
+
126
+ 20
127
+
128
+ 0
129
+
130
+
131
+ 68°
132
+
133
+ If point is 20 pixels or less above x-axis (i.e., it's a low value and close to 0) position label 0.5rem / 9px above and 0.25rem / 4.5px to the left of point: 91°–179°
134
+
135
+ First data point
136
+
137
+ Position label 0.5rem / 9px above point when segment is in Quadrant 3 (angle created is 180°–269°)
138
+
139
+ If the point isn't near the x-axis, position label 0.5rem / 9px below point when segment is in Quadrant 2 (angle created is: 91°–179°)
140
+
141
+ Last data point
142
+
143
+ Position label 0.5rem / 9px above point when final segment is in Quadrant 4 (and angle created is 269°–360°)
144
+
145
+
146
+
147
+ This also works for when last data point is near x-axis (i.e. it's a low value that's close to 0)
148
+
149
+ If the point isn't near the x-axis and final segment is in Quadrant 1 (angle created is: 1°–89°), position label 0.5rem / 9px below point
150
+
151
+ If the point is 20 pixels or less above x-axis (i.e., it's a low value and close to 0) and angle created is 0°–89° then position label 0.5rem / 9px above and 0.25rem / 4.5px to the right of point
152
+
153
+
154
+ 0
155
+
156
+ 10
157
+
158
+
159
+ 0°–89°
160
+
161
+
162
+ Quadrant 3
163
+
164
+ Quadrant 4
165
+
166
+
167
+ Quadrant 2
168
+
169
+ Quadrant 1
170
+
171
+
172
+ would NOT have segments like this
173
+
174
+
175
+ Quadrant 3
176
+
177
+ Quadrant 4
178
+
179
+
180
+ Quadrant 2
181
+
182
+ Quadrant 1
183
+
184
+
185
+ ending segments on right half
186
+
187
+
188
+ starting segments on left half
189
+
190
+
191
+ When looking at segments, think of them as being arranged in a grid with quadrants
192
+
193
+
194
+
195
+ Starting segment (denoted in purple) should always be in Quadrants 1 or 2
196
+
197
+
198
+
199
+ Ending segment (denoted in pink) should always be in Quadrants 3 and 4
200
+
201
+
202
+ Middle data point
203
+
204
+
205
+ Want labels to not overlap with points/lines like so:
206
+
207
+ If the point isn't near the x-axis, position label 0.5rem / 9px below it when starting segment is in Quadrant 1 and ending segment is in Quadrant 2 and the angle created is 1°–179°
208
+
209
+
210
+
211
+ Position label 0.5rem / 9px above point when starting segment is in Quadrant 4 and ending segment is in Quadrant 3 and the angle created is 0°–180°
212
+
213
+
214
+ Mapping of possible starting and ending segments
215
+
216
+ Position the label 0.5rem / 9px above and 0.5rem / 9px to the left of the point if starting segment is in Quadrant 4 and ending segment is in Quadrant 2 and the angle created is 92°–269°
217
+
218
+ If the point is 20 pixels or less above x-axis (i.e., it's a low value and close to 0) and starting sement is in Quadrant 1 and ending segment is in Quadrant 2 then calculate the angle between the 2 segments:
219
+
220
+
221
+
222
+ If it's 135°–180° then position the label 0.5rem / 9px above the point
223
+
224
+
225
+ If it's less than135°, calculate the angle created by the ending segment, if it's 68° or more then position the label 0.5rem / 9px above and 0.5rem / 9px to the right of the point
226
+ Otherwise, position the label 0.5rem / 9px above and 0.5rem / 9px to the left of the point
227
+ Position the label 0.5rem / 9px above and 0.5rem / 9px to the right of the point if starting segment is in Quadrant 1 and ending segment is in Quadrant 3 and the angle created is 92°–269°
228
+