@esri/solutions-components 0.6.13 → 0.6.14
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/assets/t9n/layer-table/resources.json +1 -1
- package/dist/assets/t9n/layer-table/resources_en.json +1 -1
- package/dist/assets/t9n/map-layer-picker/resources.json +4 -0
- package/dist/assets/t9n/map-layer-picker/resources_en.json +4 -0
- package/dist/cjs/basemap-gallery_6.cjs.entry.js +20 -5
- package/dist/cjs/buffer-tools_4.cjs.entry.js +1 -1
- package/dist/cjs/calcite-chip_3.cjs.entry.js +803 -0
- package/dist/cjs/calcite-combobox_6.cjs.entry.js +76 -28
- package/dist/cjs/card-manager_3.cjs.entry.js +112 -54
- package/dist/cjs/crowdsource-manager.cjs.entry.js +18 -5
- package/dist/cjs/{downloadUtils-fb4744e0.js → downloadUtils-34a515ad.js} +2 -2
- package/dist/cjs/edit-card_2.cjs.entry.js +5 -0
- package/dist/cjs/{index.es-372e33de.js → index.es-0ba11065.js} +2 -2
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/map-select-tools_3.cjs.entry.js +3 -3
- package/dist/cjs/{mapViewUtils-a4dd36ec.js → mapViewUtils-a2884698.js} +39 -55
- package/dist/cjs/public-notification.cjs.entry.js +3 -3
- package/dist/cjs/{publicNotificationStore-b69862af.js → publicNotificationStore-610bd880.js} +0 -4
- package/dist/cjs/solutions-components.cjs.js +1 -1
- package/dist/collection/components/basemap-gallery/basemap-gallery.js +23 -1
- package/dist/collection/components/card-manager/card-manager.js +2 -2
- package/dist/collection/components/crowdsource-manager/crowdsource-manager.js +171 -5
- package/dist/collection/components/edit-card/edit-card.js +19 -0
- package/dist/collection/components/layer-table/layer-table.js +127 -47
- package/dist/collection/components/map-card/map-card.js +115 -5
- package/dist/collection/components/map-layer-picker/map-layer-picker.css +4 -0
- package/dist/collection/components/map-layer-picker/map-layer-picker.js +107 -27
- package/dist/collection/components/map-picker/map-picker.css +5 -1
- package/dist/collection/components/map-picker/map-picker.js +3 -3
- package/dist/collection/components/map-tools/map-tools.js +104 -1
- package/dist/collection/utils/interfaces.ts +12 -1
- package/dist/collection/utils/mapViewUtils.js +38 -52
- package/dist/collection/utils/mapViewUtils.ts +41 -57
- package/dist/collection/utils/publicNotificationStore.js +0 -4
- package/dist/collection/utils/publicNotificationStore.ts +0 -4
- package/dist/components/basemap-gallery2.js +2 -0
- package/dist/components/card-manager2.js +2 -2
- package/dist/components/crowdsource-manager.js +27 -6
- package/dist/components/edit-card2.js +5 -0
- package/dist/components/layer-table2.js +136 -78
- package/dist/components/map-card2.js +17 -5
- package/dist/components/map-layer-picker2.js +114 -52
- package/dist/components/map-picker2.js +4 -4
- package/dist/components/map-select-tools2.js +55 -43
- package/dist/components/map-tools2.js +20 -1
- package/dist/components/mapViewUtils.js +39 -53
- package/dist/components/public-notification.js +1 -1
- package/dist/components/publicNotificationStore.js +0 -4
- package/dist/components/refine-selection2.js +61 -49
- package/dist/esm/basemap-gallery_6.entry.js +20 -5
- package/dist/esm/buffer-tools_4.entry.js +1 -1
- package/dist/esm/calcite-chip_3.entry.js +797 -0
- package/dist/esm/calcite-combobox_6.entry.js +76 -28
- package/dist/esm/card-manager_3.entry.js +112 -54
- package/dist/esm/crowdsource-manager.entry.js +18 -5
- package/dist/esm/{downloadUtils-67c7a6c8.js → downloadUtils-ac67a786.js} +2 -2
- package/dist/esm/edit-card_2.entry.js +5 -0
- package/dist/esm/{index.es-59a67d3d.js → index.es-f553598f.js} +2 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/map-select-tools_3.entry.js +3 -3
- package/dist/esm/{mapViewUtils-00a04d52.js → mapViewUtils-8141d8c1.js} +39 -53
- package/dist/esm/public-notification.entry.js +3 -3
- package/dist/esm/{publicNotificationStore-90a6a274.js → publicNotificationStore-dcf39a55.js} +0 -4
- package/dist/esm/solutions-components.js +1 -1
- package/dist/solutions-components/p-08b52ed8.entry.js +6 -0
- package/dist/solutions-components/p-16362eb4.js +36 -0
- package/dist/solutions-components/{p-3691a072.js → p-1ab414e0.js} +2 -2
- package/dist/solutions-components/{p-73ab9d9a.entry.js → p-3d7aa1b2.entry.js} +1 -1
- package/dist/solutions-components/{p-9a8c51bf.entry.js → p-57cf6784.entry.js} +1 -1
- package/dist/solutions-components/p-64b22d57.entry.js +6 -0
- package/dist/solutions-components/p-654dd5df.entry.js +6 -0
- package/dist/solutions-components/{p-f9166fcb.js → p-a26711e8.js} +1 -1
- package/dist/solutions-components/p-b1c8c6d7.entry.js +6 -0
- package/dist/solutions-components/{p-b892e595.entry.js → p-b9d29f30.entry.js} +1 -1
- package/dist/solutions-components/{p-1b41181b.js → p-c8d0ce92.js} +2 -2
- package/dist/solutions-components/{p-0219a1a9.entry.js → p-e76949eb.entry.js} +6 -6
- package/dist/solutions-components/p-ee7e2f00.entry.js +34 -0
- package/dist/solutions-components/solutions-components.esm.js +1 -1
- package/dist/solutions-components/utils/interfaces.ts +12 -1
- package/dist/solutions-components/utils/mapViewUtils.ts +41 -57
- package/dist/solutions-components/utils/publicNotificationStore.ts +0 -4
- package/dist/types/components/basemap-gallery/basemap-gallery.d.ts +5 -0
- package/dist/types/components/crowdsource-manager/crowdsource-manager.d.ts +37 -1
- package/dist/types/components/edit-card/edit-card.d.ts +8 -0
- package/dist/types/components/layer-table/layer-table.d.ts +40 -0
- package/dist/types/components/map-card/map-card.d.ts +25 -1
- package/dist/types/components/map-layer-picker/map-layer-picker.d.ts +50 -3
- package/dist/types/components/map-picker/map-picker.d.ts +2 -2
- package/dist/types/components/map-tools/map-tools.d.ts +21 -1
- package/dist/types/components.d.ts +182 -2
- package/dist/types/preact.d.ts +6 -3
- package/dist/types/utils/interfaces.d.ts +10 -1
- package/dist/types/utils/mapViewUtils.d.ts +8 -24
- package/dist/types/utils/publicNotificationStore.d.ts +0 -2
- package/package.json +1 -1
- package/dist/cjs/calcite-chip.cjs.entry.js +0 -259
- package/dist/cjs/calcite-notice.cjs.entry.js +0 -139
- package/dist/cjs/calcite-tooltip.cjs.entry.js +0 -439
- package/dist/esm/calcite-chip.entry.js +0 -255
- package/dist/esm/calcite-notice.entry.js +0 -135
- package/dist/esm/calcite-tooltip.entry.js +0 -435
- package/dist/solutions-components/p-2cff8331.entry.js +0 -6
- package/dist/solutions-components/p-3a6c8fc3.entry.js +0 -6
- package/dist/solutions-components/p-3b1fc7a2.entry.js +0 -6
- package/dist/solutions-components/p-767002cd.js +0 -36
- package/dist/solutions-components/p-a776b7e6.entry.js +0 -6
- package/dist/solutions-components/p-be36d5ed.entry.js +0 -22
- package/dist/solutions-components/p-c644edf5.entry.js +0 -11
- package/dist/solutions-components/p-cfd88a2f.entry.js +0 -11
@@ -32,6 +32,11 @@ export class MapCard {
|
|
32
32
|
* string: the id of map currently displayed
|
33
33
|
*/
|
34
34
|
this._loadedId = "";
|
35
|
+
this.enableLegend = undefined;
|
36
|
+
this.enableFullscreen = undefined;
|
37
|
+
this.enableSearch = undefined;
|
38
|
+
this.enableBasemap = undefined;
|
39
|
+
this.basemapConfig = undefined;
|
35
40
|
this.mapInfos = [];
|
36
41
|
this.mapView = undefined;
|
37
42
|
this._searchConfiguration = undefined;
|
@@ -58,7 +63,7 @@ export class MapCard {
|
|
58
63
|
* Renders the component.
|
59
64
|
*/
|
60
65
|
render() {
|
61
|
-
return (h(Host, null, h("map-picker", { mapInfos: this.mapInfos }), h("div", { class: "map-height", ref: (el) => (this._mapDiv = el) }), h("map-tools", { class: "box-shadow", mapView: this.mapView, ref: (el) => this._mapTools = el, searchConfiguration: this._searchConfiguration })));
|
66
|
+
return (h(Host, null, h("map-picker", { mapInfos: this.mapInfos }), h("div", { class: "map-height", ref: (el) => (this._mapDiv = el) }), h("map-tools", { basemapConfig: this.basemapConfig, class: "box-shadow", enableBasemap: this.enableBasemap, enableFullscreen: this.enableFullscreen, enableLegend: this.enableLegend, enableSearch: this.enableSearch, mapView: this.mapView, ref: (el) => this._mapTools = el, searchConfiguration: this._searchConfiguration })));
|
62
67
|
}
|
63
68
|
//--------------------------------------------------------------------------
|
64
69
|
//
|
@@ -108,16 +113,17 @@ export class MapCard {
|
|
108
113
|
});
|
109
114
|
this._loadedId = id;
|
110
115
|
this._searchConfiguration = this._webMapInfo.searchConfiguration;
|
111
|
-
this.
|
112
|
-
id: id,
|
113
|
-
mapView: this.mapView
|
114
|
-
});
|
116
|
+
this.beforeMapChanged.emit();
|
115
117
|
await this.mapView.when(() => {
|
116
118
|
const home = new this.Home({
|
117
119
|
view: this.mapView
|
118
120
|
});
|
119
121
|
this.mapView.ui.add(home, { position: "top-left", index: 3 });
|
120
122
|
this.mapView.ui.add(this._mapTools, { position: "top-right", index: 0 });
|
123
|
+
this.mapChanged.emit({
|
124
|
+
id: id,
|
125
|
+
mapView: this.mapView
|
126
|
+
});
|
121
127
|
});
|
122
128
|
}
|
123
129
|
}
|
@@ -134,6 +140,95 @@ export class MapCard {
|
|
134
140
|
}
|
135
141
|
static get properties() {
|
136
142
|
return {
|
143
|
+
"enableLegend": {
|
144
|
+
"type": "boolean",
|
145
|
+
"mutable": false,
|
146
|
+
"complexType": {
|
147
|
+
"original": "boolean",
|
148
|
+
"resolved": "boolean",
|
149
|
+
"references": {}
|
150
|
+
},
|
151
|
+
"required": false,
|
152
|
+
"optional": false,
|
153
|
+
"docs": {
|
154
|
+
"tags": [],
|
155
|
+
"text": "boolean: when true the legend widget will be available"
|
156
|
+
},
|
157
|
+
"attribute": "enable-legend",
|
158
|
+
"reflect": false
|
159
|
+
},
|
160
|
+
"enableFullscreen": {
|
161
|
+
"type": "boolean",
|
162
|
+
"mutable": false,
|
163
|
+
"complexType": {
|
164
|
+
"original": "boolean",
|
165
|
+
"resolved": "boolean",
|
166
|
+
"references": {}
|
167
|
+
},
|
168
|
+
"required": false,
|
169
|
+
"optional": false,
|
170
|
+
"docs": {
|
171
|
+
"tags": [],
|
172
|
+
"text": "boolean: when true the fullscreen widget will be available"
|
173
|
+
},
|
174
|
+
"attribute": "enable-fullscreen",
|
175
|
+
"reflect": false
|
176
|
+
},
|
177
|
+
"enableSearch": {
|
178
|
+
"type": "boolean",
|
179
|
+
"mutable": false,
|
180
|
+
"complexType": {
|
181
|
+
"original": "boolean",
|
182
|
+
"resolved": "boolean",
|
183
|
+
"references": {}
|
184
|
+
},
|
185
|
+
"required": false,
|
186
|
+
"optional": false,
|
187
|
+
"docs": {
|
188
|
+
"tags": [],
|
189
|
+
"text": "boolean: when true the search widget will be available"
|
190
|
+
},
|
191
|
+
"attribute": "enable-search",
|
192
|
+
"reflect": false
|
193
|
+
},
|
194
|
+
"enableBasemap": {
|
195
|
+
"type": "boolean",
|
196
|
+
"mutable": false,
|
197
|
+
"complexType": {
|
198
|
+
"original": "boolean",
|
199
|
+
"resolved": "boolean",
|
200
|
+
"references": {}
|
201
|
+
},
|
202
|
+
"required": false,
|
203
|
+
"optional": false,
|
204
|
+
"docs": {
|
205
|
+
"tags": [],
|
206
|
+
"text": "boolean: when true the basemap widget will be available"
|
207
|
+
},
|
208
|
+
"attribute": "enable-basemap",
|
209
|
+
"reflect": false
|
210
|
+
},
|
211
|
+
"basemapConfig": {
|
212
|
+
"type": "unknown",
|
213
|
+
"mutable": false,
|
214
|
+
"complexType": {
|
215
|
+
"original": "IBasemapConfig",
|
216
|
+
"resolved": "IBasemapConfig",
|
217
|
+
"references": {
|
218
|
+
"IBasemapConfig": {
|
219
|
+
"location": "import",
|
220
|
+
"path": "../../utils/interfaces",
|
221
|
+
"id": "src/utils/interfaces.ts::IBasemapConfig"
|
222
|
+
}
|
223
|
+
}
|
224
|
+
},
|
225
|
+
"required": false,
|
226
|
+
"optional": false,
|
227
|
+
"docs": {
|
228
|
+
"tags": [],
|
229
|
+
"text": "IBasemapConfig: List of any basemaps to filter out from the basemap widget"
|
230
|
+
}
|
231
|
+
},
|
137
232
|
"mapInfos": {
|
138
233
|
"type": "unknown",
|
139
234
|
"mutable": false,
|
@@ -206,6 +301,21 @@ export class MapCard {
|
|
206
301
|
}
|
207
302
|
}
|
208
303
|
}
|
304
|
+
}, {
|
305
|
+
"method": "beforeMapChanged",
|
306
|
+
"name": "beforeMapChanged",
|
307
|
+
"bubbles": true,
|
308
|
+
"cancelable": true,
|
309
|
+
"composed": true,
|
310
|
+
"docs": {
|
311
|
+
"tags": [],
|
312
|
+
"text": "Emitted before a new map is loaded"
|
313
|
+
},
|
314
|
+
"complexType": {
|
315
|
+
"original": "void",
|
316
|
+
"resolved": "void",
|
317
|
+
"references": {}
|
318
|
+
}
|
209
319
|
}];
|
210
320
|
}
|
211
321
|
static get elementRef() { return "el"; }
|
@@ -19,7 +19,8 @@
|
|
19
19
|
* limitations under the License.
|
20
20
|
*/
|
21
21
|
import { Host, h } from "@stencil/core";
|
22
|
-
import {
|
22
|
+
import { getLocaleComponentStrings } from "../../utils/locale";
|
23
|
+
import { getMapLayerHash, getMapTableHash } from "../../utils/mapViewUtils";
|
23
24
|
import state from "../../utils/publicNotificationStore";
|
24
25
|
export class MapLayerPicker {
|
25
26
|
constructor() {
|
@@ -27,13 +28,16 @@ export class MapLayerPicker {
|
|
27
28
|
this.enabledLayerIds = [];
|
28
29
|
this.enabledTableIds = [];
|
29
30
|
this.mapView = undefined;
|
31
|
+
this.onlyShowUpdatableLayers = undefined;
|
30
32
|
this.placeholderIcon = "";
|
31
33
|
this.selectedIds = [];
|
32
34
|
this.scale = "m";
|
33
35
|
this.showTables = true;
|
34
36
|
this.type = "select";
|
37
|
+
this._hasValidLayers = true;
|
35
38
|
this.ids = [];
|
36
39
|
this.selectedName = "";
|
40
|
+
this._translations = undefined;
|
37
41
|
}
|
38
42
|
//--------------------------------------------------------------------------
|
39
43
|
//
|
@@ -46,10 +50,13 @@ export class MapLayerPicker {
|
|
46
50
|
*/
|
47
51
|
async mapViewWatchHandler() {
|
48
52
|
await this._setLayers();
|
49
|
-
|
50
|
-
|
51
|
-
|
52
|
-
|
53
|
+
if (this.ids.length > 0) {
|
54
|
+
this._hasValidLayers = true;
|
55
|
+
this._setSelectedLayer(this.ids[0]);
|
56
|
+
}
|
57
|
+
else {
|
58
|
+
this._hasValidLayers = false;
|
59
|
+
this.noLayersFound.emit();
|
53
60
|
}
|
54
61
|
}
|
55
62
|
//--------------------------------------------------------------------------
|
@@ -61,6 +68,7 @@ export class MapLayerPicker {
|
|
61
68
|
* StencilJS: Called once just after the component is first connected to the DOM.
|
62
69
|
*/
|
63
70
|
async componentWillLoad() {
|
71
|
+
await this._getTranslations();
|
64
72
|
await this._setLayers();
|
65
73
|
if (this.ids.length > 0 || this.selectedIds.length === 1) {
|
66
74
|
this.layerSelectionChange.emit(this.selectedIds.length === 1 ? [this.selectedIds[0]] : [this.ids[0]]);
|
@@ -70,7 +78,7 @@ export class MapLayerPicker {
|
|
70
78
|
* Renders the component.
|
71
79
|
*/
|
72
80
|
render() {
|
73
|
-
return (h(Host, null, h("div", { class: "map-layer-picker-container" }, h("div", { class: "map-layer-picker" }, this.type === "combobox" ? this._getCombobox() :
|
81
|
+
return (h(Host, null, h("div", { class: "map-layer-picker-container" }, h("div", { class: "map-layer-picker" }, !this._hasValidLayers ? this._getInvalidPlaceholder() : this.type === "combobox" ? this._getCombobox() :
|
74
82
|
this.type === "select" ? this._getSelect() : this._getDropdown()))));
|
75
83
|
}
|
76
84
|
/**
|
@@ -83,9 +91,9 @@ export class MapLayerPicker {
|
|
83
91
|
this._layerElement.value = id;
|
84
92
|
}
|
85
93
|
else if (this.type === "dropdown") {
|
86
|
-
this.selectedName = Object.keys(
|
87
|
-
|
88
|
-
|
94
|
+
this.selectedName = Object.keys(this._layerNameHash).indexOf(id) > -1 ?
|
95
|
+
this._layerNameHash[id].name : Object.keys(this._tableNameHash).indexOf(id) > -1 ?
|
96
|
+
this._tableNameHash[id].name : "";
|
89
97
|
}
|
90
98
|
}
|
91
99
|
}
|
@@ -94,6 +102,14 @@ export class MapLayerPicker {
|
|
94
102
|
// Functions (protected)
|
95
103
|
//
|
96
104
|
//--------------------------------------------------------------------------
|
105
|
+
/**
|
106
|
+
* Create a notice to inform the user that no layers were found
|
107
|
+
*
|
108
|
+
* @returns Calcite Notice component with the message
|
109
|
+
*/
|
110
|
+
_getInvalidPlaceholder() {
|
111
|
+
return (h("div", null, h("calcite-notice", { class: "height-100", icon: "exclamation-mark-triangle", id: "no-valid-layers", kind: "danger", open: true }, h("div", { slot: "message" }, this._translations.noLayersFound)), h("calcite-tooltip", { label: this._translations.enableEditUpdate, placement: "bottom", "reference-element": "no-valid-layers" }, h("span", null, this._translations.enableEditUpdate))));
|
112
|
+
}
|
97
113
|
/**
|
98
114
|
* Create a list of layers from the map
|
99
115
|
*
|
@@ -144,16 +160,21 @@ export class MapLayerPicker {
|
|
144
160
|
* @returns A dom node with the name of the layer or table
|
145
161
|
*/
|
146
162
|
_getItem(id, itemType) {
|
147
|
-
const
|
148
|
-
|
149
|
-
|
150
|
-
|
163
|
+
const item = itemType === "layer" ? this._layerNameHash[id] : this._tableNameHash[id];
|
164
|
+
const disabled = this.onlyShowUpdatableLayers ? !item.supportsUpdate : false;
|
165
|
+
const name = item.name;
|
166
|
+
return this.type === "combobox" ? (h("calcite-combobox-item", { disabled: disabled, textLabel: name, value: id })) :
|
167
|
+
this.type === "select" ? (h("calcite-option", { disabled: disabled, label: name, value: id })) :
|
168
|
+
(h("calcite-dropdown-item", { disabled: disabled, onClick: disabled ? undefined : () => void this._setSelectedLayer(id) }, name));
|
151
169
|
}
|
152
170
|
/**
|
153
171
|
* Store the layer name based on the user selection
|
154
172
|
*/
|
155
|
-
_setSelectedLayer(id
|
156
|
-
|
173
|
+
_setSelectedLayer(id) {
|
174
|
+
const item = Object.keys(this._layerNameHash).indexOf(id) > -1 ?
|
175
|
+
this._layerNameHash[id] : Object.keys(this._tableNameHash).indexOf(id) > -1 ?
|
176
|
+
this._tableNameHash[id] : undefined;
|
177
|
+
this.selectedName = item === null || item === void 0 ? void 0 : item.name;
|
157
178
|
this.selectedIds = [id];
|
158
179
|
this.layerSelectionChange.emit(this.selectedIds);
|
159
180
|
}
|
@@ -164,25 +185,38 @@ export class MapLayerPicker {
|
|
164
185
|
*/
|
165
186
|
async _setLayers() {
|
166
187
|
if (this.mapView) {
|
167
|
-
|
168
|
-
const
|
188
|
+
await this._initLayerTableHash();
|
189
|
+
const mapLayerIds = this.onlyShowUpdatableLayers ?
|
190
|
+
this._getEditableIds(this._layerNameHash) : Object.keys(this._layerNameHash);
|
191
|
+
const mapTableIds = this.showTables ? this.onlyShowUpdatableLayers ?
|
192
|
+
this._getEditableIds(this._tableNameHash) : Object.keys(this._tableNameHash) : [];
|
169
193
|
this.ids = [
|
170
194
|
...mapLayerIds.filter(n => { var _a; return ((_a = this.enabledLayerIds) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.enabledLayerIds.indexOf(n) > -1 : true; }),
|
171
195
|
...mapTableIds.filter(n => { var _a; return ((_a = this.enabledTableIds) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.enabledTableIds.indexOf(n) > -1 : true; }),
|
172
196
|
];
|
173
|
-
await this._initStateHash();
|
174
197
|
}
|
175
198
|
}
|
199
|
+
/**
|
200
|
+
* Fetch the ids of all layers that support edits with the update capability
|
201
|
+
*
|
202
|
+
* @returns array of layer ids
|
203
|
+
*/
|
204
|
+
_getEditableIds(hash) {
|
205
|
+
return Object.keys(hash).reduce((prev, cur) => {
|
206
|
+
if (hash[cur].supportsUpdate) {
|
207
|
+
prev.push(cur);
|
208
|
+
}
|
209
|
+
return prev;
|
210
|
+
}, []);
|
211
|
+
}
|
176
212
|
/**
|
177
213
|
* Create a layer id:title hash for layer name display
|
178
214
|
*
|
179
215
|
* @returns Promise when the operation has completed
|
180
216
|
*/
|
181
|
-
async
|
182
|
-
|
183
|
-
|
184
|
-
state.tableNameHash = this.showTables ? await getMapTableHash(this.mapView) : {};
|
185
|
-
}
|
217
|
+
async _initLayerTableHash() {
|
218
|
+
this._layerNameHash = await getMapLayerHash(this.mapView, this.onlyShowUpdatableLayers);
|
219
|
+
this._tableNameHash = this.showTables ? await getMapTableHash(this.mapView, this.onlyShowUpdatableLayers) : {};
|
186
220
|
}
|
187
221
|
/**
|
188
222
|
* Evaluate if the id exists in the current hash and verify if it should be excluded
|
@@ -190,9 +224,10 @@ export class MapLayerPicker {
|
|
190
224
|
* @returns boolean when true the layer will be used in the current layer picker type
|
191
225
|
*/
|
192
226
|
_validLayer(id) {
|
193
|
-
|
227
|
+
var _a;
|
228
|
+
const name = (_a = this._layerNameHash[id]) === null || _a === void 0 ? void 0 : _a.name;
|
194
229
|
return name && state.managedLayers.indexOf(name) < 0 && (this.enabledLayerIds.length > 0 ?
|
195
|
-
this.enabledLayerIds.indexOf(id) > -1 :
|
230
|
+
this.enabledLayerIds.indexOf(id) > -1 : true);
|
196
231
|
}
|
197
232
|
/**
|
198
233
|
* Evaluate if the id exists in the current hash and verify if it should be excluded
|
@@ -200,7 +235,8 @@ export class MapLayerPicker {
|
|
200
235
|
* @returns boolean when true the table will be used in the current layer picker type
|
201
236
|
*/
|
202
237
|
_validTable(id) {
|
203
|
-
|
238
|
+
var _a;
|
239
|
+
const name = (_a = this._tableNameHash[id]) === null || _a === void 0 ? void 0 : _a.name;
|
204
240
|
const validName = name && this.showTables;
|
205
241
|
return validName ? state.managedTables.indexOf(name) < 0 &&
|
206
242
|
(this.enabledTableIds.length > 0 ? this.enabledTableIds.indexOf(id) > -1 : true) : validName;
|
@@ -217,6 +253,16 @@ export class MapLayerPicker {
|
|
217
253
|
this.layerSelectionChange.emit(this.selectedIds);
|
218
254
|
}
|
219
255
|
}
|
256
|
+
/**
|
257
|
+
* Fetches the component's translations
|
258
|
+
*
|
259
|
+
* @returns Promise when complete
|
260
|
+
* @protected
|
261
|
+
*/
|
262
|
+
async _getTranslations() {
|
263
|
+
const messages = await getLocaleComponentStrings(this.el);
|
264
|
+
this._translations = messages[0];
|
265
|
+
}
|
220
266
|
static get is() { return "map-layer-picker"; }
|
221
267
|
static get originalStyleUrls() {
|
222
268
|
return {
|
@@ -300,6 +346,23 @@ export class MapLayerPicker {
|
|
300
346
|
"text": "esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html"
|
301
347
|
}
|
302
348
|
},
|
349
|
+
"onlyShowUpdatableLayers": {
|
350
|
+
"type": "boolean",
|
351
|
+
"mutable": false,
|
352
|
+
"complexType": {
|
353
|
+
"original": "boolean",
|
354
|
+
"resolved": "boolean",
|
355
|
+
"references": {}
|
356
|
+
},
|
357
|
+
"required": false,
|
358
|
+
"optional": false,
|
359
|
+
"docs": {
|
360
|
+
"tags": [],
|
361
|
+
"text": "boolean: When true only editable layers that support the update capability will be available"
|
362
|
+
},
|
363
|
+
"attribute": "only-show-updatable-layers",
|
364
|
+
"reflect": false
|
365
|
+
},
|
303
366
|
"placeholderIcon": {
|
304
367
|
"type": "string",
|
305
368
|
"mutable": false,
|
@@ -392,12 +455,29 @@ export class MapLayerPicker {
|
|
392
455
|
}
|
393
456
|
static get states() {
|
394
457
|
return {
|
458
|
+
"_hasValidLayers": {},
|
395
459
|
"ids": {},
|
396
|
-
"selectedName": {}
|
460
|
+
"selectedName": {},
|
461
|
+
"_translations": {}
|
397
462
|
};
|
398
463
|
}
|
399
464
|
static get events() {
|
400
465
|
return [{
|
466
|
+
"method": "noLayersFound",
|
467
|
+
"name": "noLayersFound",
|
468
|
+
"bubbles": true,
|
469
|
+
"cancelable": true,
|
470
|
+
"composed": true,
|
471
|
+
"docs": {
|
472
|
+
"tags": [],
|
473
|
+
"text": "Emitted on demand when no valid layers are found"
|
474
|
+
},
|
475
|
+
"complexType": {
|
476
|
+
"original": "void",
|
477
|
+
"resolved": "void",
|
478
|
+
"references": {}
|
479
|
+
}
|
480
|
+
}, {
|
401
481
|
"method": "layerSelectionChange",
|
402
482
|
"name": "layerSelectionChange",
|
403
483
|
"bubbles": true,
|
@@ -48,7 +48,7 @@
|
|
48
48
|
flex-direction: column;
|
49
49
|
overflow: hidden;
|
50
50
|
animation: calcite-scrim-fade-in var(--calcite-internal-animation-timing-medium) ease-in-out;
|
51
|
-
background-color: var(--calcite-
|
51
|
+
background-color: var(--calcite-ui-background);
|
52
52
|
z-index: 1000;
|
53
53
|
width: 100%;
|
54
54
|
height: -moz-fit-content;
|
@@ -62,3 +62,7 @@
|
|
62
62
|
.action-bar-color {
|
63
63
|
background-color: var(--calcite-ui-border-3) !important;
|
64
64
|
}
|
65
|
+
|
66
|
+
.align-center {
|
67
|
+
align-items: center;
|
68
|
+
}
|
@@ -46,9 +46,9 @@ export class MapPicker {
|
|
46
46
|
/**
|
47
47
|
* Called each time the mapInfos prop is changed.
|
48
48
|
*/
|
49
|
-
mapInfosWatchHandler(v, oldV) {
|
49
|
+
async mapInfosWatchHandler(v, oldV) {
|
50
50
|
if (v && JSON.stringify(v) !== JSON.stringify(oldV)) {
|
51
|
-
this.
|
51
|
+
this._webMapSelected(v[0]);
|
52
52
|
}
|
53
53
|
}
|
54
54
|
//--------------------------------------------------------------------------
|
@@ -73,7 +73,7 @@ export class MapPicker {
|
|
73
73
|
/**
|
74
74
|
* Called once after the component has loaded
|
75
75
|
*/
|
76
|
-
componentDidLoad() {
|
76
|
+
async componentDidLoad() {
|
77
77
|
const webMapInfo = this.mapInfos && this.mapInfos.length > 0 ? this.mapInfos[0] : undefined;
|
78
78
|
if (webMapInfo) {
|
79
79
|
this._webMapSelected(webMapInfo);
|
@@ -22,6 +22,11 @@ import { Host, h } from "@stencil/core";
|
|
22
22
|
import { getLocaleComponentStrings } from "../../utils/locale";
|
23
23
|
export class MapTools {
|
24
24
|
constructor() {
|
25
|
+
this.enableLegend = undefined;
|
26
|
+
this.enableFullscreen = undefined;
|
27
|
+
this.enableSearch = undefined;
|
28
|
+
this.enableBasemap = undefined;
|
29
|
+
this.basemapConfig = undefined;
|
25
30
|
this.layout = "vertical";
|
26
31
|
this.mapView = undefined;
|
27
32
|
this.searchConfiguration = undefined;
|
@@ -125,7 +130,16 @@ export class MapTools {
|
|
125
130
|
const fullscreenIcon = this._showFullscreen ? "full-screen-exit" : "full-screen";
|
126
131
|
const fullscreenTip = this._showFullscreen ? this._translations.exitFullscreen : this._translations.enterFullscreen;
|
127
132
|
const expandTip = this._showTools ? this._translations.collapse : this._translations.expand;
|
128
|
-
|
133
|
+
const containerClass = !this.enableBasemap && !this.enableFullscreen && !this.enableLegend && !this.enableSearch ? "display-none" : "";
|
134
|
+
return (h(Host, null, h("div", { class: containerClass }, h("div", { class: "box-shadow" }, this._getActionGroup(toggleIcon, false, expandTip, () => this._toggleTools())), h("div", { class: `margin-top-1-2 box-shadow ${toolsClass}` }, this.enableLegend ?
|
135
|
+
this._getActionGroup("legend", false, this._translations.legend, () => this._showLegend()) :
|
136
|
+
undefined, this.enableSearch ?
|
137
|
+
this._getActionGroup("magnifying-glass", false, this._translations.search, () => this._search()) :
|
138
|
+
undefined, this.enableFullscreen ?
|
139
|
+
this._getActionGroup(fullscreenIcon, false, fullscreenTip, () => this._expand()) :
|
140
|
+
undefined, this.enableBasemap ?
|
141
|
+
this._getActionGroup("basemap", false, this._translations.basemap, () => this._toggleBasemapPicker()) :
|
142
|
+
undefined)), h("basemap-gallery", { basemapConfig: this.basemapConfig, class: basemapClass, mapView: this.mapView, ref: (el) => { this._basemapElement = el; } }), h("map-search", { class: searchClass, mapView: this.mapView, ref: (el) => { this._searchElement = el; }, searchConfiguration: this.searchConfiguration }), h("map-legend", { class: legendClass, mapView: this.mapView, ref: (el) => { this._legendElement = el; } }), h("map-fullscreen", { class: fullscreenClass, mapView: this.mapView, ref: (el) => { this._fullscreenElement = el; } })));
|
129
143
|
}
|
130
144
|
//--------------------------------------------------------------------------
|
131
145
|
//
|
@@ -217,6 +231,95 @@ export class MapTools {
|
|
217
231
|
}
|
218
232
|
static get properties() {
|
219
233
|
return {
|
234
|
+
"enableLegend": {
|
235
|
+
"type": "boolean",
|
236
|
+
"mutable": false,
|
237
|
+
"complexType": {
|
238
|
+
"original": "boolean",
|
239
|
+
"resolved": "boolean",
|
240
|
+
"references": {}
|
241
|
+
},
|
242
|
+
"required": false,
|
243
|
+
"optional": false,
|
244
|
+
"docs": {
|
245
|
+
"tags": [],
|
246
|
+
"text": "boolean: when true the legend widget will be available"
|
247
|
+
},
|
248
|
+
"attribute": "enable-legend",
|
249
|
+
"reflect": false
|
250
|
+
},
|
251
|
+
"enableFullscreen": {
|
252
|
+
"type": "boolean",
|
253
|
+
"mutable": false,
|
254
|
+
"complexType": {
|
255
|
+
"original": "boolean",
|
256
|
+
"resolved": "boolean",
|
257
|
+
"references": {}
|
258
|
+
},
|
259
|
+
"required": false,
|
260
|
+
"optional": false,
|
261
|
+
"docs": {
|
262
|
+
"tags": [],
|
263
|
+
"text": "boolean: when true the fullscreen widget will be available"
|
264
|
+
},
|
265
|
+
"attribute": "enable-fullscreen",
|
266
|
+
"reflect": false
|
267
|
+
},
|
268
|
+
"enableSearch": {
|
269
|
+
"type": "boolean",
|
270
|
+
"mutable": false,
|
271
|
+
"complexType": {
|
272
|
+
"original": "boolean",
|
273
|
+
"resolved": "boolean",
|
274
|
+
"references": {}
|
275
|
+
},
|
276
|
+
"required": false,
|
277
|
+
"optional": false,
|
278
|
+
"docs": {
|
279
|
+
"tags": [],
|
280
|
+
"text": "boolean: when true the search widget will be available"
|
281
|
+
},
|
282
|
+
"attribute": "enable-search",
|
283
|
+
"reflect": false
|
284
|
+
},
|
285
|
+
"enableBasemap": {
|
286
|
+
"type": "boolean",
|
287
|
+
"mutable": false,
|
288
|
+
"complexType": {
|
289
|
+
"original": "boolean",
|
290
|
+
"resolved": "boolean",
|
291
|
+
"references": {}
|
292
|
+
},
|
293
|
+
"required": false,
|
294
|
+
"optional": false,
|
295
|
+
"docs": {
|
296
|
+
"tags": [],
|
297
|
+
"text": "boolean: when true the basemap widget will be available"
|
298
|
+
},
|
299
|
+
"attribute": "enable-basemap",
|
300
|
+
"reflect": false
|
301
|
+
},
|
302
|
+
"basemapConfig": {
|
303
|
+
"type": "unknown",
|
304
|
+
"mutable": false,
|
305
|
+
"complexType": {
|
306
|
+
"original": "IBasemapConfig",
|
307
|
+
"resolved": "IBasemapConfig",
|
308
|
+
"references": {
|
309
|
+
"IBasemapConfig": {
|
310
|
+
"location": "import",
|
311
|
+
"path": "../../utils/interfaces",
|
312
|
+
"id": "src/utils/interfaces.ts::IBasemapConfig"
|
313
|
+
}
|
314
|
+
}
|
315
|
+
},
|
316
|
+
"required": false,
|
317
|
+
"optional": false,
|
318
|
+
"docs": {
|
319
|
+
"tags": [],
|
320
|
+
"text": "IBasemapConfig: List of any basemaps to filter out from the basemap widget"
|
321
|
+
}
|
322
|
+
},
|
220
323
|
"layout": {
|
221
324
|
"type": "string",
|
222
325
|
"mutable": false,
|
@@ -165,7 +165,12 @@ export interface IValueChange {
|
|
165
165
|
* Layer or table id and title key value pair
|
166
166
|
*/
|
167
167
|
export interface IMapItemHash {
|
168
|
-
[key: string]:
|
168
|
+
[key: string]: ILayerHashInfo;
|
169
|
+
}
|
170
|
+
|
171
|
+
export interface ILayerHashInfo {
|
172
|
+
name: string;
|
173
|
+
supportsUpdate: boolean;
|
169
174
|
}
|
170
175
|
|
171
176
|
/**
|
@@ -444,6 +449,8 @@ export interface IMapInfo {
|
|
444
449
|
searchConfiguration?: ISearchConfiguration;
|
445
450
|
filters?: any[]; // TODO generate an interface for this once we know how it will be passed in
|
446
451
|
layerInfos?: ILayerInfo[];
|
452
|
+
_hasValidLayers?: boolean;
|
453
|
+
visible: boolean;
|
447
454
|
}
|
448
455
|
|
449
456
|
export interface ILayerInfo {
|
@@ -466,3 +473,7 @@ export interface IExportInfo {
|
|
466
473
|
layerView?: __esri.FeatureLayerView;
|
467
474
|
selectionSetNames: string[];
|
468
475
|
}
|
476
|
+
|
477
|
+
export interface IBasemapConfig {
|
478
|
+
basemapIdsToFilter: string[];
|
479
|
+
}
|