@cdc/map 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 (119) hide show
  1. package/.idea/map.iml +12 -0
  2. package/.idea/modules.xml +8 -0
  3. package/.idea/vcs.xml +6 -0
  4. package/dist/cdcmap.js +31254 -32242
  5. package/examples/hex-colors.json +3 -3
  6. package/examples/m2.json +32904 -0
  7. package/examples/private/test.json +470 -1457
  8. package/examples/private/{mmr.json → wastewatermap.json} +86 -115
  9. package/index.html +36 -63
  10. package/package.json +7 -19
  11. package/src/CdcMap.tsx +56 -1552
  12. package/src/CdcMapComponent.tsx +608 -0
  13. package/src/_stories/CdcMap.Legend.Gradient.stories.tsx +10 -0
  14. package/src/_stories/CdcMap.Legend.stories.tsx +67 -0
  15. package/src/_stories/CdcMap.Table.stories.tsx +19 -0
  16. package/src/_stories/CdcMap.stories.tsx +12 -1
  17. package/src/_stories/UsaMap.NoData.stories.tsx +4 -4
  18. package/src/_stories/_mock/default-patterns.json +8 -5
  19. package/src/_stories/_mock/legend-bins.json +428 -0
  20. package/{examples/private/default-patterns.json → src/_stories/_mock/legends/legend-tests.json} +36 -131
  21. package/src/cdcMapComponent.styles.css +9 -0
  22. package/src/components/Annotation/Annotation.Draggable.tsx +27 -26
  23. package/src/components/Annotation/AnnotationDropdown.tsx +5 -6
  24. package/src/components/BubbleList.tsx +135 -49
  25. package/src/components/CityList.tsx +89 -87
  26. package/src/components/DataTable.tsx +8 -8
  27. package/src/components/EditorPanel/components/EditorPanel.tsx +823 -885
  28. package/src/components/EditorPanel/components/Error.tsx +9 -2
  29. package/src/components/EditorPanel/components/HexShapeSettings.tsx +127 -141
  30. package/src/components/EditorPanel/components/Panels/Panel.Annotate.tsx +55 -86
  31. package/src/components/EditorPanel/components/Panels/Panel.PatternSettings.tsx +89 -75
  32. package/src/components/EditorPanel/components/editorPanel.styles.css +95 -0
  33. package/src/components/Geo.tsx +9 -1
  34. package/src/components/GoogleMap/components/GoogleMap.tsx +1 -1
  35. package/src/components/Legend/components/Legend.tsx +92 -87
  36. package/src/components/Legend/components/LegendGroup/Legend.Group.tsx +128 -0
  37. package/src/components/Legend/components/LegendGroup/legend.group.css +27 -0
  38. package/src/components/Legend/components/LegendItem.Hex.tsx +4 -1
  39. package/src/components/Legend/components/index.scss +74 -17
  40. package/src/components/Modal.tsx +17 -7
  41. package/src/components/NavigationMenu.tsx +11 -9
  42. package/src/components/UsaMap/components/SingleState/SingleState.CountyOutput.tsx +12 -8
  43. package/src/components/UsaMap/components/SingleState/SingleState.StateOutput.tsx +4 -4
  44. package/src/components/UsaMap/components/TerritoriesSection.tsx +33 -10
  45. package/src/components/UsaMap/components/Territory/Territory.Hexagon.tsx +12 -10
  46. package/src/components/UsaMap/components/Territory/Territory.Rectangle.tsx +12 -14
  47. package/src/components/UsaMap/components/Territory/TerritoryShape.ts +2 -1
  48. package/src/components/UsaMap/components/UsaMap.County.tsx +138 -96
  49. package/src/components/UsaMap/components/UsaMap.Region.styles.css +72 -0
  50. package/src/components/UsaMap/components/UsaMap.Region.tsx +56 -103
  51. package/src/components/UsaMap/components/UsaMap.SingleState.styles.css +10 -0
  52. package/src/components/UsaMap/components/UsaMap.SingleState.tsx +65 -74
  53. package/src/components/UsaMap/components/UsaMap.State.tsx +112 -91
  54. package/src/components/UsaMap/helpers/map.ts +1 -1
  55. package/src/components/UsaMap/helpers/shapes.ts +20 -7
  56. package/src/components/WorldMap/WorldMap.tsx +64 -118
  57. package/src/components/WorldMap/worldMap.styles.css +28 -0
  58. package/src/components/ZoomControls.tsx +15 -13
  59. package/src/components/zoomControls.styles.css +53 -0
  60. package/src/context.ts +17 -9
  61. package/src/data/initial-state.js +5 -2
  62. package/src/helpers/addUIDs.ts +150 -0
  63. package/src/helpers/applyColorToLegend.ts +39 -64
  64. package/src/helpers/applyLegendToRow.ts +51 -0
  65. package/src/helpers/colorDistributions.ts +12 -0
  66. package/src/helpers/constants.ts +44 -0
  67. package/src/helpers/displayGeoName.ts +9 -2
  68. package/src/helpers/formatLegendLocation.ts +3 -2
  69. package/src/helpers/generateColorsArray.ts +2 -1
  70. package/src/helpers/generateRuntimeData.ts +78 -0
  71. package/src/helpers/generateRuntimeFilters.ts +63 -0
  72. package/src/helpers/generateRuntimeLegend.ts +566 -0
  73. package/src/helpers/generateRuntimeLegendHash.ts +16 -15
  74. package/src/helpers/getColumnNames.ts +19 -0
  75. package/src/helpers/getMapContainerClasses.ts +23 -0
  76. package/src/helpers/getStatePicked.ts +8 -0
  77. package/src/helpers/handleMapTabbing.ts +31 -0
  78. package/src/helpers/hashObj.ts +1 -1
  79. package/src/helpers/index.ts +22 -0
  80. package/src/helpers/navigationHandler.ts +3 -3
  81. package/src/helpers/resetLegendToggles.ts +13 -0
  82. package/src/helpers/setBinNumbers.ts +5 -0
  83. package/src/helpers/sortSpecialClassesLast.ts +7 -0
  84. package/src/helpers/tests/getColumnNames.test.ts +52 -0
  85. package/src/helpers/titleCase.ts +1 -1
  86. package/src/helpers/toggleLegendActive.ts +25 -0
  87. package/src/hooks/useApplyTooltipsToGeo.tsx +51 -0
  88. package/src/hooks/useColumnsRequiredChecker.ts +51 -0
  89. package/src/hooks/useGeoClickHandler.ts +45 -0
  90. package/src/hooks/useLegendSeparators.ts +26 -0
  91. package/src/hooks/useMapLayers.tsx +34 -60
  92. package/src/hooks/useModal.ts +22 -0
  93. package/src/hooks/useResizeObserver.ts +4 -5
  94. package/src/hooks/useStateZoom.tsx +52 -75
  95. package/src/hooks/useTooltip.ts +2 -3
  96. package/src/index.jsx +3 -9
  97. package/src/scss/editor-panel.scss +3 -99
  98. package/src/scss/main.scss +1 -19
  99. package/src/scss/map.scss +15 -220
  100. package/src/store/map.actions.ts +46 -0
  101. package/src/store/map.reducer.ts +96 -0
  102. package/src/types/Annotations.ts +24 -0
  103. package/src/types/MapConfig.ts +23 -3
  104. package/src/types/MapContext.ts +36 -35
  105. package/src/types/Modal.ts +1 -0
  106. package/src/types/RuntimeData.ts +3 -0
  107. package/examples/private/DEV-9644.json +0 -184
  108. package/examples/private/DEV-9989.json +0 -229
  109. package/examples/private/ardi.json +0 -180
  110. package/examples/private/colors 2.json +0 -416
  111. package/examples/private/colors.json +0 -416
  112. package/examples/private/colors.json.zip +0 -0
  113. package/examples/private/customColors.json +0 -45348
  114. package/examples/test.json +0 -183
  115. package/src/helpers/closeModal.ts +0 -9
  116. package/src/scss/btn.scss +0 -69
  117. package/src/scss/filters.scss +0 -27
  118. package/src/scss/variables.scss +0 -1
  119. /package/src/hooks/{useActiveElement.js → useActiveElement.ts} +0 -0
@@ -1,183 +0,0 @@
1
- {
2
- "general": {
3
- "geoType": "us-county",
4
- "type": "us-geocode",
5
- "geoBorderColor": "darkGray",
6
- "headerColor": "theme-blue",
7
- "showTitle": true,
8
- "showSidebar": true,
9
- "showDownloadButton": true,
10
- "showDownloadMediaButton": false,
11
- "displayAsHex": false,
12
- "displayStateLabels": false,
13
- "territoriesLabel": "Territories",
14
- "language": "en",
15
- "hasRegions": false,
16
- "expandDataTable": false,
17
- "fullBorder": false,
18
- "palette": {
19
- "isReversed": false
20
- },
21
- "allowMapZoom": true,
22
- "hideGeoColumnInTooltip": false,
23
- "hidePrimaryColumnInTooltip": false,
24
- "subtext": "<p class=\"mb-3\"><strong>Note:</strong> Click on a detection category in the legend to remove sites with that detection category from the map.</p>\n\n<h2 class=\"h3\"><strong>About the Data</strong></h2>\n<p class=\"mb-2\"><strong>Detection categories:</strong><p/>\n\n<p class=\"mb-2\"><span class=\"color-indicator\" style=\"background-color: #d73027;border: 1px solid rgba(0, 0, 0, 0.3);\"> </span> Consistent detection: Mpox virus was detected in more than 80% of samples in the past 4 weeks AND the most recent detection was within the past 2 weeks.</p>\n\n<p class=\"mb-2\"><span class=\"color-indicator\" style=\"background-color: #ffcc00;border: 1px solid rgba(0, 0, 0, 0.3);\"> </span> Intermittent detection: Mpox virus was detected in 1% to 80% of samples in the past 4 weeks AND the most recent detection was within the past 2 weeks.</p>\n\n<p class=\"mb-2\"><span><span class=\"color-indicator\" style=\"background-color: #0e4183;border: 1px solid rgba(0, 0, 0, 0.3);\"> </span> No detection: Mpox virus was not detected in any samples from the site in the past 4 weeks OR the most recent detection was more than 2 weeks ago.</p>\n\n\n\n\n\n<p class=\"mb-2\"><span class=\"color-indicator\" style=\"background-color: #afafaf;border: 1px solid rgba(0, 0, 0, 0.3);\"> </span> No recent data: Too few samples were submitted (fewer than 3) in the past 4 weeks.</p>\n\n<p class=\"mt-3 mb-2\"><strong>Interpretation: </strong><p/>\n\n<p class=\"mb-2\">Laboratory tests used for mpox wastewater surveillance can tell us if the virus’s genetic material (viral DNA) is in untreated community wastewater. The tests cannot tell us if there is infectious virus in wastewater, only that the virus’s genetic material is present. We do not know if mpox virus remains infectious, or for how long, in untreated wastewater. No detection of mpox virus in wastewater means there is no evidence from wastewater data that mpox is spreading in the local community. However, very low infection levels may be below the detection limit for wastewater testing. Intermittent or consistent detection means there are likely ongoing mpox infections in the community.<p/>\n",
25
- "geoLabelOverride": "Sewershed"
26
- },
27
- "type": "map",
28
- "color": "pinkpurple",
29
- "columns": {
30
- "geo": {
31
- "name": "sewershed",
32
- "label": "Location",
33
- "tooltip": false,
34
- "dataTable": true
35
- },
36
- "primary": {
37
- "dataTable": true,
38
- "tooltip": true,
39
- "prefix": "",
40
- "suffix": "",
41
- "name": "pcr_target_detect_cat",
42
- "label": "Detection Classification"
43
- },
44
- "navigate": {
45
- "name": ""
46
- },
47
- "latitude": {
48
- "name": "latitude"
49
- },
50
- "longitude": {
51
- "name": "longitude"
52
- },
53
- "additionalColumn1": {
54
- "label": "Sampling Location",
55
- "dataTable": false,
56
- "tooltips": false,
57
- "prefix": "",
58
- "suffix": "",
59
- "name": "location",
60
- "tooltip": true
61
- },
62
- "additionalColumn2": {
63
- "label": "Sewershed Jurisdiction",
64
- "dataTable": false,
65
- "tooltips": false,
66
- "prefix": "",
67
- "suffix": "",
68
- "name": "jurisdiction",
69
- "tooltip": true
70
- },
71
- "additionalColumn3": {
72
- "label": "Counties",
73
- "dataTable": false,
74
- "tooltips": false,
75
- "prefix": "",
76
- "suffix": "",
77
- "name": "counties",
78
- "tooltip": true
79
- },
80
- "additionalColumn4": {
81
- "label": "Population",
82
- "dataTable": false,
83
- "tooltips": false,
84
- "prefix": "",
85
- "suffix": "",
86
- "name": "population_served",
87
- "tooltip": true,
88
- "useCommas": true
89
- },
90
- "additionalColumn5": {
91
- "label": "Samples collected",
92
- "dataTable": false,
93
- "tooltips": false,
94
- "prefix": "",
95
- "suffix": "",
96
- "name": "total_samples",
97
- "tooltip": true
98
- },
99
- "additionalColumn6": {
100
- "label": "Samples that were positive",
101
- "dataTable": false,
102
- "tooltips": false,
103
- "prefix": "",
104
- "suffix": "",
105
- "name": "pos_samples",
106
- "tooltip": true
107
- }
108
- },
109
- "legend": {
110
- "descriptions": {},
111
- "specialClasses": [],
112
- "unified": false,
113
- "singleColumn": false,
114
- "singleRow": false,
115
- "dynamicDescription": false,
116
- "type": "category",
117
- "numberOfItems": 3,
118
- "position": "bottom",
119
- "title": "Legend",
120
- "categoryValuesOrder": [
121
- "Consistent detection",
122
- "Intermittent detection",
123
- "No detection",
124
- "No recent data"
125
- ],
126
- "additionalCategories": [
127
- "Consistent detection",
128
- "Intermittent detection",
129
- "No detection",
130
- "No recent data",
131
- ""
132
- ]
133
- },
134
- "filters": [],
135
- "dataTable": {
136
- "title": "Data Table",
137
- "forceDisplay": true
138
- },
139
- "table": {
140
- "showDownloadUrl": false
141
- },
142
- "tooltips": {
143
- "appearanceType": "hover",
144
- "linkLabel": "Learn More",
145
- "capitalizeLabels": true
146
- },
147
- "runtime": {
148
- "editorErrorMessage": []
149
- },
150
- "visual": {
151
- "minBubbleSize": 1,
152
- "maxBubbleSize": 20,
153
- "extraBubbleBorder": false,
154
- "cityStyle": "circle",
155
- "geoCodeCircleSize": "2",
156
- "showBubbleZeros": false
157
- },
158
- "mapPosition": {
159
- "coordinates": [
160
- 0,
161
- 30
162
- ],
163
- "zoom": 1
164
- },
165
- "datasets": {},
166
- "customColors": [
167
- "#d73027",
168
- "#d73027",
169
- "#ffcc00",
170
- "#ffcc00",
171
- "#0e4183",
172
- "#0e4183",
173
- "#Cccccc",
174
- "#Cccccc"
175
- ],
176
- "dataUrl": "https://www.cdc.gov/poxvirus/monkeypox/data/wastewater/exported_files/NWSS_Public_Monkeypox_Data.csv",
177
- "dataFileName": "https://www.cdc.gov/poxvirus/monkeypox/data/wastewater/exported_files/NWSS_Public_Monkeypox_Data.csv",
178
- "dataFileSourceType": "url",
179
- "dataDescription": {
180
- "horizontal": false,
181
- "series": false
182
- }
183
- }
@@ -1,9 +0,0 @@
1
- export const closeModal = ({ target }, modal: string, setModal: Function) => {
2
- if (
3
- 'string' === typeof target.className &&
4
- (target.className.includes('modal-close') || target.className.includes('modal-background')) &&
5
- null !== modal
6
- ) {
7
- setModal(null)
8
- }
9
- }
package/src/scss/btn.scss DELETED
@@ -1,69 +0,0 @@
1
- $btn-radius: 6px;
2
-
3
- .cdc-open-viz-module .btn-group {
4
- display: inline-flex;
5
- flex-flow: row;
6
- justify-content: flex-start;
7
- align-items: flex-start;
8
- border-radius: 6px;
9
- background-color: transparent;
10
-
11
- .btn {
12
- display: flex;
13
- justify-content: center;
14
- align-items: center;
15
- position: relative;
16
- padding: 8px 14px;
17
- margin: 0;
18
- color: inherit;
19
- background-color: #fff;
20
- border: 1px solid #dedede;
21
- border-radius: $btn-radius;
22
- user-select: none;
23
- align-self: stretch;
24
- flex: 1 0 auto;
25
-
26
- &::before {
27
- content: '';
28
- display: block;
29
- position: absolute;
30
- top: 0;
31
- left: 0;
32
- width: 100%;
33
- height: 100%;
34
- background-color: transparent;
35
- border-radius: $btn-radius;
36
- box-shadow: none;
37
- transition: box-shadow 0.6s cubic-bezier(0.16, 1, 0.3, 1);
38
- z-index: -1;
39
- }
40
-
41
- &:hover {
42
- background-color: #fff;
43
-
44
- &::before {
45
- box-shadow: 0 5px 12px -8px rgba(0, 0, 0, .5);
46
- }
47
- }
48
-
49
- &:first-of-type:not(:last-of-type) {
50
- border-radius: $btn-radius 0 0 $btn-radius;
51
- }
52
-
53
- &:not(:first-of-type):not(:last-of-type) {
54
- border-radius: 0;
55
- border-left: 0;
56
- }
57
-
58
- &:last-of-type:not(:first-of-type) {
59
- border-radius: 0 $btn-radius $btn-radius 0;
60
- border-left: 0;
61
- }
62
- }
63
-
64
- .btn__icon {
65
- display: inline;
66
- width: 18px;
67
- height: auto;
68
- }
69
- }
@@ -1,27 +0,0 @@
1
- .cdc-open-viz-module .cdc-map-inner-container .filters-section,
2
- .cove .cdc-map-inner-container .filters-section {
3
- &__title {
4
- margin: 15px 0;
5
- }
6
-
7
- &__wrapper {
8
- hr {
9
- margin-bottom: 20px;
10
- }
11
-
12
- label {
13
- display: inherit;
14
- margin-bottom: 5px;
15
- font-size: 16px;
16
- }
17
- }
18
-
19
- @include breakpoint(md) {
20
- display: flex;
21
- flex-wrap: wrap;
22
- }
23
-
24
- .single-filter {
25
- margin-bottom: 0.5em;
26
- }
27
- }
@@ -1 +0,0 @@
1
- $editorWidth: 350px;