@swr-data-lab/components 2.2.0 → 2.3.0

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 (12) hide show
  1. package/dist/maplibre/Map/Map.svelte +37 -4
  2. package/dist/maplibre/MapStyle/SWRDataLabLight.js +3 -2
  3. package/dist/maplibre/MapStyle/components/Admin.js +9 -24
  4. package/dist/maplibre/MapStyle/components/Landuse.js +4 -4
  5. package/dist/maplibre/MapStyle/components/PlaceLabels.d.ts +1 -0
  6. package/dist/maplibre/MapStyle/components/PlaceLabels.js +143 -98
  7. package/dist/maplibre/MapStyle/components/Roads.js +192 -766
  8. package/dist/maplibre/MapStyle/components/Transit.js +23 -23
  9. package/dist/maplibre/MapStyle/components/Walking.js +18 -159
  10. package/dist/maplibre/MapStyle/tokens.d.ts +5 -3
  11. package/dist/maplibre/MapStyle/tokens.js +8 -6
  12. package/package.json +1 -1
package/dist/maplibre/MapStyle/components/Transit.js CHANGED
@@ -26,7 +26,7 @@ const rail_overlay = {
26
26
  },
27
27
  line_dasharray: [0.125, 6]
28
28
  };
29
- const rail_outline = {
29
+ const rail_case = {
30
30
  line_color: tokens.background,
31
31
  line_width: {
32
32
  stops: [
@@ -54,7 +54,7 @@ export default function makeTransit() {
54
54
  }
55
55
  },
56
56
  {
57
- id: 'airport-taxiway:outline',
57
+ id: 'airport-taxiway:case',
58
58
  filter: ['==', 'kind', 'taxiway'],
59
59
  paint: {
60
60
  'line-color': 'hsl(36,0%,80%)',
@@ -74,7 +74,7 @@ export default function makeTransit() {
74
74
  }
75
75
  },
76
76
  {
77
- id: 'airport-runway:outline',
77
+ id: 'airport-runway:case',
78
78
  filter: ['==', 'kind', 'runway'],
79
79
  paint: {
80
80
  'line-color': 'hsl(36,0%,80%)',
@@ -161,57 +161,57 @@ export default function makeTransit() {
161
161
  });
162
162
  const transitBridges = [
163
163
  {
164
- id: 'bridge-transport-monorail:outline',
164
+ id: 'bridge-transport-monorail:case',
165
165
  filter: ['all', ['in', 'kind', 'monorail'], ['!has', 'service'], ['==', 'bridge', true]],
166
166
  minzoom: 15,
167
167
  paint: {
168
- 'line-color': rail_outline.line_color,
169
- 'line-width': rail_outline.line_width
168
+ 'line-color': rail_case.line_color,
169
+ 'line-width': rail_case.line_width
170
170
  }
171
171
  },
172
172
  {
173
- id: 'bridge-transport-funicular:outline',
173
+ id: 'bridge-transport-funicular:case',
174
174
  filter: ['all', ['in', 'kind', 'funicular'], ['!has', 'service'], ['==', 'bridge', true]],
175
175
  minzoom: 15,
176
176
  paint: {
177
- 'line-color': rail_outline.line_color,
178
- 'line-width': rail_outline.line_width
177
+ 'line-color': rail_case.line_color,
178
+ 'line-width': rail_case.line_width
179
179
  }
180
180
  },
181
181
  {
182
- id: 'bridge-transport-tram:outline',
182
+ id: 'bridge-transport-tram:case',
183
183
  filter: ['all', ['in', 'kind', 'tram'], ['!has', 'service'], ['==', 'bridge', true]],
184
184
  minzoom: 15,
185
185
  paint: {
186
- 'line-color': rail_outline.line_color,
187
- 'line-width': rail_outline.line_width
186
+ 'line-color': rail_case.line_color,
187
+ 'line-width': rail_case.line_width
188
188
  }
189
189
  },
190
190
  {
191
- id: 'bridge-transport-narrowgauge:outline',
191
+ id: 'bridge-transport-narrowgauge:case',
192
192
  filter: ['all', ['in', 'kind', 'narrow_gauge'], ['!has', 'service'], ['==', 'bridge', true]],
193
193
  minzoom: 15,
194
194
  paint: {
195
- 'line-color': rail_outline.line_color,
196
- 'line-width': rail_outline.line_width
195
+ 'line-color': rail_case.line_color,
196
+ 'line-width': rail_case.line_width
197
197
  }
198
198
  },
199
199
  {
200
- id: 'bridge-transport-lightrail:outline',
200
+ id: 'bridge-transport-lightrail:case',
201
201
  filter: ['all', ['in', 'kind', 'light_rail'], ['!has', 'service'], ['==', 'bridge', true]],
202
202
  paint: {
203
- 'line-color': rail_outline.line_color,
204
- 'line-width': rail_outline.line_width,
205
- 'line-opacity': rail_outline.line_opacity
203
+ 'line-color': rail_case.line_color,
204
+ 'line-width': rail_case.line_width,
205
+ 'line-opacity': rail_case.line_opacity
206
206
  }
207
207
  },
208
208
  {
209
- id: 'bridge-transport-rail:outline',
209
+ id: 'bridge-transport-rail:case',
210
210
  filter: ['all', ['in', 'kind', 'rail'], ['!has', 'service'], ['==', 'bridge', true]],
211
211
  paint: {
212
- 'line-color': rail_outline.line_color,
213
- 'line-width': rail_outline.line_width,
214
- 'line-opacity': rail_outline.line_opacity
212
+ 'line-color': rail_case.line_color,
213
+ 'line-width': rail_case.line_width,
214
+ 'line-opacity': rail_case.line_opacity
215
215
  }
216
216
  },
217
217
  {
package/dist/maplibre/MapStyle/components/Walking.js CHANGED
@@ -41,7 +41,7 @@ export default function makeWalking() {
41
41
  }
42
42
  },
43
43
  {
44
- id: 'tunnel-way-footway:outline',
44
+ id: 'tunnel-way-footway:case',
45
45
  type: 'line',
46
46
  'source-layer': 'streets',
47
47
  filter: ['all', ['==', 'tunnel', true], ['in', 'kind', 'footway']],
@@ -63,7 +63,7 @@ export default function makeWalking() {
63
63
  minzoom: 15
64
64
  },
65
65
  {
66
- id: 'tunnel-way-steps:outline',
66
+ id: 'tunnel-way-steps:case',
67
67
  type: 'line',
68
68
  'source-layer': 'streets',
69
69
  filter: ['all', ['==', 'tunnel', true], ['in', 'kind', 'steps']],
@@ -85,7 +85,7 @@ export default function makeWalking() {
85
85
  minzoom: 15
86
86
  },
87
87
  {
88
- id: 'tunnel-way-path:outline',
88
+ id: 'tunnel-way-path:case',
89
89
  type: 'line',
90
90
  'source-layer': 'streets',
91
91
  filter: ['all', ['==', 'tunnel', true], ['in', 'kind', 'path']],
@@ -107,7 +107,7 @@ export default function makeWalking() {
107
107
  minzoom: 15
108
108
  },
109
109
  {
110
- id: 'tunnel-way-cycleway:outline',
110
+ id: 'tunnel-way-cycleway:case',
111
111
  type: 'line',
112
112
  'source-layer': 'streets',
113
113
  filter: ['all', ['==', 'tunnel', true], ['in', 'kind', 'cycleway']],
@@ -130,7 +130,7 @@ export default function makeWalking() {
130
130
  },
131
131
  {
132
132
  // See: https://wiki.openstreetmap.org/wiki/Tag:highway%3Dtrack
133
- id: 'tunnel-street-track:outline',
133
+ id: 'tunnel-street-track:case',
134
134
  type: 'line',
135
135
  'source-layer': 'streets',
136
136
  filter: ['all', ['==', 'kind', 'track'], ['==', 'tunnel', true]],
@@ -158,7 +158,7 @@ export default function makeWalking() {
158
158
  }
159
159
  },
160
160
  {
161
- id: 'tunnel-street-pedestrian:outline',
161
+ id: 'tunnel-street-pedestrian:case',
162
162
  type: 'line',
163
163
  'source-layer': 'streets',
164
164
  filter: ['all', ['==', 'kind', 'pedestrian'], ['==', 'tunnel', true]],
@@ -504,7 +504,7 @@ export default function makeWalking() {
504
504
  }
505
505
  },
506
506
  {
507
- id: 'way-footway:outline',
507
+ id: 'way-footway:case',
508
508
  type: 'line',
509
509
  'source-layer': 'streets',
510
510
  filter: ['all', ['!=', 'bridge', true], ['!=', 'tunnel', true], ['in', 'kind', 'footway']],
@@ -526,7 +526,7 @@ export default function makeWalking() {
526
526
  minzoom: 15
527
527
  },
528
528
  {
529
- id: 'way-steps:outline',
529
+ id: 'way-steps:case',
530
530
  type: 'line',
531
531
  'source-layer': 'streets',
532
532
  filter: ['all', ['!=', 'bridge', true], ['!=', 'tunnel', true], ['in', 'kind', 'steps']],
@@ -548,7 +548,7 @@ export default function makeWalking() {
548
548
  }
549
549
  },
550
550
  {
551
- id: 'way-path:outline',
551
+ id: 'way-path:case',
552
552
  type: 'line',
553
553
  'source-layer': 'streets',
554
554
  filter: ['all', ['!=', 'bridge', true], ['!=', 'tunnel', true], ['in', 'kind', 'path']],
@@ -570,7 +570,7 @@ export default function makeWalking() {
570
570
  }
571
571
  },
572
572
  {
573
- id: 'way-cycleway:outline',
573
+ id: 'way-cycleway:case',
574
574
  type: 'line',
575
575
  'source-layer': 'streets',
576
576
  filter: ['all', ['!=', 'bridge', true], ['!=', 'tunnel', true], ['in', 'kind', 'cycleway']],
@@ -592,7 +592,7 @@ export default function makeWalking() {
592
592
  minzoom: 15
593
593
  },
594
594
  {
595
- id: 'street-track:outline',
595
+ id: 'street-track:case',
596
596
  type: 'line',
597
597
  'source-layer': 'streets',
598
598
  filter: ['all', ['==', 'kind', 'track'], ['!=', 'bridge', true], ['!=', 'tunnel', true]],
@@ -620,7 +620,7 @@ export default function makeWalking() {
620
620
  }
621
621
  },
622
622
  {
623
- id: 'street-pedestrian:outline',
623
+ id: 'street-pedestrian:case',
624
624
  type: 'line',
625
625
  'source-layer': 'streets',
626
626
  filter: ['all', ['==', 'kind', 'pedestrian'], ['!=', 'bridge', true], ['!=', 'tunnel', true]],
@@ -951,147 +951,6 @@ export default function makeWalking() {
951
951
  return { source: 'versatiles-osm', ...el };
952
952
  });
953
953
  const walkingBridges = [
954
- {
955
- id: 'bridge-way-footway:bridge',
956
- filter: ['all', ['==', 'bridge', true], ['in', 'kind', 'footway']],
957
- layout: {
958
- 'line-cap': 'butt',
959
- 'line-join': 'round'
960
- },
961
- paint: {
962
- 'line-color': 'rgb(239,239,239)',
963
- 'line-opacity': 0.5,
964
- 'line-width': {
965
- stops: [
966
- [15, 0],
967
- [16, 7],
968
- [18, 10],
969
- [19, 17],
970
- [20, 31]
971
- ]
972
- }
973
- },
974
- minzoom: 15
975
- },
976
- {
977
- id: 'bridge-way-steps:bridge',
978
- filter: ['all', ['==', 'bridge', true], ['in', 'kind', 'steps']],
979
- layout: {
980
- 'line-cap': 'butt',
981
- 'line-join': 'round'
982
- },
983
- paint: {
984
- 'line-color': 'rgb(239,239,239)',
985
- 'line-opacity': 0.5,
986
- 'line-width': {
987
- stops: [
988
- [15, 0],
989
- [16, 7],
990
- [18, 10],
991
- [19, 17],
992
- [20, 31]
993
- ]
994
- }
995
- },
996
- minzoom: 15
997
- },
998
- {
999
- id: 'bridge-way-path:bridge',
1000
- filter: ['all', ['==', 'bridge', true], ['in', 'kind', 'path']],
1001
- layout: {
1002
- 'line-cap': 'butt',
1003
- 'line-join': 'round'
1004
- },
1005
- paint: {
1006
- 'line-color': 'rgb(239,239,239)',
1007
- 'line-opacity': 0.5,
1008
- 'line-width': {
1009
- stops: [
1010
- [15, 0],
1011
- [16, 7],
1012
- [18, 10],
1013
- [19, 17],
1014
- [20, 31]
1015
- ]
1016
- }
1017
- },
1018
- minzoom: 15
1019
- },
1020
- {
1021
- id: 'bridge-way-cycleway:bridge',
1022
- filter: ['all', ['==', 'bridge', true], ['in', 'kind', 'cycleway']],
1023
- layout: {
1024
- 'line-cap': 'butt',
1025
- 'line-join': 'round'
1026
- },
1027
- paint: {
1028
- 'line-color': 'rgb(239,239,239)',
1029
- 'line-opacity': 0.5,
1030
- 'line-width': {
1031
- stops: [
1032
- [15, 0],
1033
- [16, 7],
1034
- [18, 10],
1035
- [19, 17],
1036
- [20, 31]
1037
- ]
1038
- }
1039
- },
1040
- minzoom: 15
1041
- },
1042
- {
1043
- id: 'bridge-street-track:bridge',
1044
- filter: ['all', ['==', 'kind', 'track'], ['==', 'bridge', true]],
1045
- layout: {
1046
- 'line-cap': 'butt',
1047
- 'line-join': 'round'
1048
- },
1049
- paint: {
1050
- 'line-color': 'rgb(239,239,239)',
1051
- 'line-opacity': {
1052
- stops: [
1053
- [14, 0],
1054
- [15, 1]
1055
- ]
1056
- },
1057
- 'line-width': {
1058
- stops: [
1059
- [14, 3],
1060
- [16, 6],
1061
- [18, 25],
1062
- [19, 67],
1063
- [20, 134]
1064
- ]
1065
- }
1066
- }
1067
- },
1068
- {
1069
- id: 'bridge-street-pedestrian:bridge',
1070
- filter: ['all', ['==', 'kind', 'pedestrian'], ['==', 'bridge', true]],
1071
- layout: {
1072
- 'line-cap': 'butt',
1073
- 'line-join': 'round'
1074
- },
1075
- paint: {
1076
- 'line-color': 'rgb(239,239,239)',
1077
- 'line-opacity': {
1078
- stops: [
1079
- [12, 0],
1080
- [13, 1]
1081
- ]
1082
- },
1083
- 'line-width': {
1084
- stops: [
1085
- [12, 3],
1086
- [14, 4],
1087
- [16, 8],
1088
- [18, 36],
1089
- [19, 90],
1090
- [20, 179]
1091
- ]
1092
- }
1093
- }
1094
- },
1095
954
  {
1096
955
  id: 'bridge-street-pedestrian-zone',
1097
956
  type: 'fill',
@@ -1108,7 +967,7 @@ export default function makeWalking() {
1108
967
  }
1109
968
  },
1110
969
  {
1111
- id: 'bridge-way-footway:outline',
970
+ id: 'bridge-way-footway:case',
1112
971
  filter: ['all', ['==', 'bridge', true], ['in', 'kind', 'footway']],
1113
972
  minzoom: 15,
1114
973
  layout: {
@@ -1128,7 +987,7 @@ export default function makeWalking() {
1128
987
  }
1129
988
  },
1130
989
  {
1131
- id: 'bridge-way-steps:outline',
990
+ id: 'bridge-way-steps:case',
1132
991
  filter: ['all', ['==', 'bridge', true], ['in', 'kind', 'steps']],
1133
992
  minzoom: 15,
1134
993
  layout: {
@@ -1148,7 +1007,7 @@ export default function makeWalking() {
1148
1007
  }
1149
1008
  },
1150
1009
  {
1151
- id: 'bridge-way-path:outline',
1010
+ id: 'bridge-way-path:case',
1152
1011
  filter: ['all', ['==', 'bridge', true], ['in', 'kind', 'path']],
1153
1012
  layout: {
1154
1013
  'line-cap': 'butt'
@@ -1168,7 +1027,7 @@ export default function makeWalking() {
1168
1027
  minzoom: 15
1169
1028
  },
1170
1029
  {
1171
- id: 'bridge-way-cycleway:outline',
1030
+ id: 'bridge-way-cycleway:case',
1172
1031
  filter: ['all', ['==', 'bridge', true], ['in', 'kind', 'cycleway']],
1173
1032
  layout: {
1174
1033
  'line-cap': 'butt'
@@ -1188,7 +1047,7 @@ export default function makeWalking() {
1188
1047
  minzoom: 15
1189
1048
  },
1190
1049
  {
1191
- id: 'bridge-street-track:outline',
1050
+ id: 'bridge-street-track:case',
1192
1051
  filter: ['all', ['==', 'kind', 'track'], ['==', 'bridge', true]],
1193
1052
  paint: {
1194
1053
  'line-color': 'rgb(217,217,217)',
@@ -1211,7 +1070,7 @@ export default function makeWalking() {
1211
1070
  layout: street_layout
1212
1071
  },
1213
1072
  {
1214
- id: 'bridge-street-pedestrian:outline',
1073
+ id: 'bridge-street-pedestrian:case',
1215
1074
  filter: ['all', ['==', 'kind', 'pedestrian'], ['==', 'bridge', true]],
1216
1075
  paint: {
1217
1076
  'line-color': 'rgb(217,217,217)',
package/dist/maplibre/MapStyle/tokens.d.ts CHANGED
@@ -5,17 +5,19 @@ declare const tokens: {
5
5
  background: string;
6
6
  water: string;
7
7
  water_light: string;
8
+ water_ocean: string;
8
9
  marsh: string;
9
10
  grass: string;
10
11
  grass_dark: string;
11
12
  street_primary: string;
12
- street_primary_outline: string;
13
+ street_primary_case: string;
13
14
  street_secondary: string;
14
- street_secondary_outline: string;
15
+ street_secondary_case: string;
15
16
  street_tertiary: string;
16
- street_tertiary_outline: string;
17
+ street_tertiary_case: string;
17
18
  label_primary: string;
18
19
  label_secondary: string;
20
+ label_tertiary: string;
19
21
  building: string;
20
22
  };
21
23
  export default tokens;
package/dist/maplibre/MapStyle/tokens.js CHANGED
@@ -3,19 +3,21 @@ const tokens = {
3
3
  sans_medium: ['SWR Sans Medium'],
4
4
  sans_bold: ['SWR Sans Bold'],
5
5
  background: 'hsl(0, 0%, 100%)',
6
- water: 'hsl(210, 41%, 87%)',
6
+ water: 'hsl(210, 41%, 89%)',
7
7
  water_light: 'hsl(210, 41%, 90%)',
8
+ water_ocean: 'hsl(210, 25%, 96%)',
8
9
  marsh: 'hsl(200, 14%, 97%)',
9
10
  grass: 'hsl(149, 37%, 97%)',
10
11
  grass_dark: 'hsl(149, 37%, 93%)',
11
12
  street_primary: 'hsl(0, 0%, 95%)',
12
- street_primary_outline: 'hsla(0, 0%, 0%, 20%)',
13
+ street_primary_case: 'hsla(0, 0%, 0%, 20%)',
13
14
  street_secondary: 'hsl(0, 0%, 95%)',
14
- street_secondary_outline: 'hsl(0, 0%, 50%)',
15
+ street_secondary_case: 'hsl(0, 0%, 50%)',
15
16
  street_tertiary: 'hsl(0, 0%, 95%)',
16
- street_tertiary_outline: 'hsl(0, 0%, 50%)',
17
- label_primary: 'rgb(10, 10, 11)',
18
- label_secondary: 'hsl(240, 2%, 20%)',
17
+ street_tertiary_case: 'hsl(0, 0%, 50%)',
18
+ label_primary: 'hsl(240, 5%, 10%)',
19
+ label_secondary: 'hsl(240, 2%, 30%)',
20
+ label_tertiary: 'hsl(240, 2%, 50%)',
19
21
  building: '#f3f2f1'
20
22
  };
21
23
  export default tokens;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@swr-data-lab/components",
3
3
  "description": "SWR Data Lab component library",
4
- "version": "2.2.0",
4
+ "version": "2.3.0",
5
5
  "author": "SWR Data Lab",
6
6
  "license": "UNLICENSED",
7
7
  "type": "module",