@cdc/map 2.6.0 → 2.6.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 (61) hide show
  1. package/convert-topojson.js +70 -0
  2. package/dist/cdcmap.js +190 -0
  3. package/examples/default-county.json +105 -0
  4. package/examples/default-single-state.json +109 -0
  5. package/examples/default-usa.json +968 -0
  6. package/examples/default-world.json +1495 -0
  7. package/examples/example-city-state.json +474 -0
  8. package/examples/example-world-map.json +1596 -0
  9. package/examples/gender-rate-map.json +1 -0
  10. package/package.json +50 -50
  11. package/src/CdcMap.js +1384 -0
  12. package/src/components/CityList.js +93 -0
  13. package/src/components/CountyMap.js +556 -0
  14. package/src/components/DataTable.js +357 -0
  15. package/src/components/EditorPanel.js +2111 -0
  16. package/src/components/Geo.js +21 -0
  17. package/src/components/Modal.js +31 -0
  18. package/src/components/NavigationMenu.js +66 -0
  19. package/src/components/Sidebar.js +167 -0
  20. package/src/components/SingleStateMap.js +326 -0
  21. package/src/components/UsaMap.js +342 -0
  22. package/src/components/WorldMap.js +175 -0
  23. package/src/components/ZoomableGroup.js +47 -0
  24. package/src/data/abbreviations.js +57 -0
  25. package/src/data/color-palettes.js +200 -0
  26. package/src/data/county-map-halfquality.json +58453 -0
  27. package/src/data/county-map-quarterquality.json +1 -0
  28. package/src/data/county-topo.json +1 -0
  29. package/src/data/dfc-map.json +1 -0
  30. package/src/data/initial-state.js +60 -0
  31. package/src/data/newtest.json +1 -0
  32. package/src/data/state-abbreviations.js +60 -0
  33. package/src/data/supported-geos.js +3775 -0
  34. package/src/data/test.json +1 -0
  35. package/src/data/us-hex-topo.json +1 -0
  36. package/src/data/us-topo.json +1 -0
  37. package/src/data/world-topo.json +1 -0
  38. package/src/hooks/useActiveElement.js +19 -0
  39. package/src/hooks/useZoomPan.js +110 -0
  40. package/src/images/active-checkmark.svg +1 -0
  41. package/src/images/asc.svg +1 -0
  42. package/src/images/close.svg +1 -0
  43. package/src/images/desc.svg +1 -0
  44. package/src/images/external-link.svg +1 -0
  45. package/src/images/icon-download-img.svg +1 -0
  46. package/src/images/icon-download-pdf.svg +1 -0
  47. package/src/images/inactive-checkmark.svg +1 -0
  48. package/src/images/map-folded.svg +1 -0
  49. package/src/index.html +29 -0
  50. package/src/index.js +20 -0
  51. package/src/scss/btn.scss +69 -0
  52. package/src/scss/datatable.scss +7 -0
  53. package/src/scss/editor-panel.scss +654 -0
  54. package/src/scss/main.scss +224 -0
  55. package/src/scss/map.scss +188 -0
  56. package/src/scss/sidebar.scss +146 -0
  57. package/src/scss/tooltips.scss +30 -0
  58. package/src/scss/variables.scss +1 -0
  59. package/uploads/upload-example-city-state.json +392 -0
  60. package/uploads/upload-example-world-data.json +1490 -0
  61. package/LICENSE +0 -201
@@ -0,0 +1 @@
1
+ <svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M432 320h-32c-8.837 0-16 7.163-16 16v112H64V128h144c8.837 0 16-7.163 16-16V80c0-8.837-7.163-16-16-16H48C21.49 64 0 85.49 0 112v352c0 26.51 21.49 48 48 48h352c26.51 0 48-21.49 48-48V336c0-8.837-7.163-16-16-16zM488 0H360c-21.37 0-32.05 25.91-17 41l35.73 35.73L135 320.37a24 24 0 000 34L157.67 377a24 24 0 0034 0l243.61-243.68L471 169c15 15 41 4.5 41-17V24c0-13.255-10.745-24-24-24z" fill-rule="nonzero"/></svg>
@@ -0,0 +1 @@
1
+ <svg aria-hidden="true" focusable="false" data-prefix="far" data-icon="file-image" class="svg-inline--fa fa-file-image fa-w-12" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path fill="currentColor" d="M369.9 97.9L286 14C277 5 264.8-.1 252.1-.1H48C21.5 0 0 21.5 0 48v416c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48V131.9c0-12.7-5.1-25-14.1-34zM332.1 128H256V51.9l76.1 76.1zM48 464V48h160v104c0 13.3 10.7 24 24 24h104v288H48zm32-48h224V288l-23.5-23.5c-4.7-4.7-12.3-4.7-17 0L176 352l-39.5-39.5c-4.7-4.7-12.3-4.7-17 0L80 352v64zm48-240c-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48-21.5-48-48-48z"></path></svg>
@@ -0,0 +1 @@
1
+ <svg aria-hidden="true" focusable="false" data-prefix="far" data-icon="file-pdf" class="svg-inline--fa fa-file-pdf fa-w-12" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path fill="currentColor" d="M369.9 97.9L286 14C277 5 264.8-.1 252.1-.1H48C21.5 0 0 21.5 0 48v416c0 26.5 21.5 48 48 48h288c26.5 0 48-21.5 48-48V131.9c0-12.7-5.1-25-14.1-34zM332.1 128H256V51.9l76.1 76.1zM48 464V48h160v104c0 13.3 10.7 24 24 24h104v288H48zm250.2-143.7c-12.2-12-47-8.7-64.4-6.5-17.2-10.5-28.7-25-36.8-46.3 3.9-16.1 10.1-40.6 5.4-56-4.2-26.2-37.8-23.6-42.6-5.9-4.4 16.1-.4 38.5 7 67.1-10 23.9-24.9 56-35.4 74.4-20 10.3-47 26.2-51 46.2-3.3 15.8 26 55.2 76.1-31.2 22.4-7.4 46.8-16.5 68.4-20.1 18.9 10.2 41 17 55.8 17 25.5 0 28-28.2 17.5-38.7zm-198.1 77.8c5.1-13.7 24.5-29.5 30.4-35-19 30.3-30.4 35.7-30.4 35zm81.6-190.6c7.4 0 6.7 32.1 1.8 40.8-4.4-13.9-4.3-40.8-1.8-40.8zm-24.4 136.6c9.7-16.9 18-37 24.7-54.7 8.3 15.1 18.9 27.2 30.1 35.5-20.8 4.3-38.9 13.1-54.8 19.2zm131.6-5s-5 6-37.3-7.8c35.1-2.6 40.9 5.4 37.3 7.8z"></path></svg>
@@ -0,0 +1 @@
1
+ <svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><g fill="none" fill-rule="evenodd"><path d="M-2-2h24v24H-2z"/><path d="M10 1.5A8.504 8.504 0 001.5 10c0 4.692 3.808 8.5 8.5 8.5s8.5-3.808 8.5-8.5-3.808-8.5-8.5-8.5z" stroke="#4C4C4C" stroke-width="3"/></g></svg>
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path d="M0 117.66v346.32c0 11.32 11.43 19.06 21.94 14.86L160 416V32L20.12 87.95A32.006 32.006 0 000 117.66zM192 416l192 64V96L192 32v384zM554.06 33.16L416 96v384l139.88-55.95A31.996 31.996 0 00576 394.34V48.02c0-11.32-11.43-19.06-21.94-14.86z"/></svg>
package/src/index.html ADDED
@@ -0,0 +1,29 @@
1
+ <!DOCTYPE html>
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 type="text/css">
7
+ body {
8
+ margin: 0;
9
+ }
10
+ .cdc-map-outer-container {
11
+ min-height: 100vh;
12
+ }
13
+ </style>
14
+ </head>
15
+ <body>
16
+ <!-- DEFAULT EXAMPLES -->
17
+ <!-- <div class="react-container react-container--maps" data-config="/examples/default-county.json"></div> -->
18
+ <!-- <div class="react-container react-container--maps" data-config="/examples/default-usa.json"></div> -->
19
+ <!-- <div class="react-container react-container--maps" data-config="/examples/default-world.json"></div> -->
20
+ <!-- <div class="react-container react-container--maps" data-config="/examples/default-single-state.json"></div> -->
21
+
22
+ <!-- TP4 EXAMPLES -->
23
+ <div class="react-container react-container--maps" data-config="/examples/example-city-state.json"></div>
24
+ <!-- <div class="react-container react-container--maps" data-config="/examples/example-world-map.json"></div> -->
25
+
26
+
27
+ <noscript>You need to enable JavaScript to run this app.</noscript>
28
+ </body>
29
+ </html>
package/src/index.js ADDED
@@ -0,0 +1,20 @@
1
+ import React, { StrictMode } from 'react';
2
+ import ReactDOM from 'react-dom';
3
+
4
+ import CdcMap from './CdcMap';
5
+
6
+ // Editor flag available when working in standalone mode
7
+ let isEditor = window.location.href.includes('editor=true');
8
+
9
+ const domContainer = document.querySelector('.react-container')
10
+
11
+ ReactDOM.render(
12
+ <StrictMode>
13
+ <CdcMap
14
+ isEditor={isEditor}
15
+ configUrl={domContainer.attributes['data-config'].value}
16
+ containerEl={domContainer}
17
+ />
18
+ </StrictMode>,
19
+ domContainer
20
+ );
@@ -0,0 +1,69 @@
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
+ }
@@ -0,0 +1,7 @@
1
+ .data-table-container {
2
+ margin: 0;
3
+ @include breakpointClass(md) {
4
+ margin: 1em;
5
+ }
6
+
7
+ }