@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.
Files changed (109) hide show
  1. package/dist/assets/t9n/layer-table/resources.json +1 -1
  2. package/dist/assets/t9n/layer-table/resources_en.json +1 -1
  3. package/dist/assets/t9n/map-layer-picker/resources.json +4 -0
  4. package/dist/assets/t9n/map-layer-picker/resources_en.json +4 -0
  5. package/dist/cjs/basemap-gallery_6.cjs.entry.js +20 -5
  6. package/dist/cjs/buffer-tools_4.cjs.entry.js +1 -1
  7. package/dist/cjs/calcite-chip_3.cjs.entry.js +803 -0
  8. package/dist/cjs/calcite-combobox_6.cjs.entry.js +76 -28
  9. package/dist/cjs/card-manager_3.cjs.entry.js +112 -54
  10. package/dist/cjs/crowdsource-manager.cjs.entry.js +18 -5
  11. package/dist/cjs/{downloadUtils-fb4744e0.js → downloadUtils-34a515ad.js} +2 -2
  12. package/dist/cjs/edit-card_2.cjs.entry.js +5 -0
  13. package/dist/cjs/{index.es-372e33de.js → index.es-0ba11065.js} +2 -2
  14. package/dist/cjs/loader.cjs.js +1 -1
  15. package/dist/cjs/map-select-tools_3.cjs.entry.js +3 -3
  16. package/dist/cjs/{mapViewUtils-a4dd36ec.js → mapViewUtils-a2884698.js} +39 -55
  17. package/dist/cjs/public-notification.cjs.entry.js +3 -3
  18. package/dist/cjs/{publicNotificationStore-b69862af.js → publicNotificationStore-610bd880.js} +0 -4
  19. package/dist/cjs/solutions-components.cjs.js +1 -1
  20. package/dist/collection/components/basemap-gallery/basemap-gallery.js +23 -1
  21. package/dist/collection/components/card-manager/card-manager.js +2 -2
  22. package/dist/collection/components/crowdsource-manager/crowdsource-manager.js +171 -5
  23. package/dist/collection/components/edit-card/edit-card.js +19 -0
  24. package/dist/collection/components/layer-table/layer-table.js +127 -47
  25. package/dist/collection/components/map-card/map-card.js +115 -5
  26. package/dist/collection/components/map-layer-picker/map-layer-picker.css +4 -0
  27. package/dist/collection/components/map-layer-picker/map-layer-picker.js +107 -27
  28. package/dist/collection/components/map-picker/map-picker.css +5 -1
  29. package/dist/collection/components/map-picker/map-picker.js +3 -3
  30. package/dist/collection/components/map-tools/map-tools.js +104 -1
  31. package/dist/collection/utils/interfaces.ts +12 -1
  32. package/dist/collection/utils/mapViewUtils.js +38 -52
  33. package/dist/collection/utils/mapViewUtils.ts +41 -57
  34. package/dist/collection/utils/publicNotificationStore.js +0 -4
  35. package/dist/collection/utils/publicNotificationStore.ts +0 -4
  36. package/dist/components/basemap-gallery2.js +2 -0
  37. package/dist/components/card-manager2.js +2 -2
  38. package/dist/components/crowdsource-manager.js +27 -6
  39. package/dist/components/edit-card2.js +5 -0
  40. package/dist/components/layer-table2.js +136 -78
  41. package/dist/components/map-card2.js +17 -5
  42. package/dist/components/map-layer-picker2.js +114 -52
  43. package/dist/components/map-picker2.js +4 -4
  44. package/dist/components/map-select-tools2.js +55 -43
  45. package/dist/components/map-tools2.js +20 -1
  46. package/dist/components/mapViewUtils.js +39 -53
  47. package/dist/components/public-notification.js +1 -1
  48. package/dist/components/publicNotificationStore.js +0 -4
  49. package/dist/components/refine-selection2.js +61 -49
  50. package/dist/esm/basemap-gallery_6.entry.js +20 -5
  51. package/dist/esm/buffer-tools_4.entry.js +1 -1
  52. package/dist/esm/calcite-chip_3.entry.js +797 -0
  53. package/dist/esm/calcite-combobox_6.entry.js +76 -28
  54. package/dist/esm/card-manager_3.entry.js +112 -54
  55. package/dist/esm/crowdsource-manager.entry.js +18 -5
  56. package/dist/esm/{downloadUtils-67c7a6c8.js → downloadUtils-ac67a786.js} +2 -2
  57. package/dist/esm/edit-card_2.entry.js +5 -0
  58. package/dist/esm/{index.es-59a67d3d.js → index.es-f553598f.js} +2 -2
  59. package/dist/esm/loader.js +1 -1
  60. package/dist/esm/map-select-tools_3.entry.js +3 -3
  61. package/dist/esm/{mapViewUtils-00a04d52.js → mapViewUtils-8141d8c1.js} +39 -53
  62. package/dist/esm/public-notification.entry.js +3 -3
  63. package/dist/esm/{publicNotificationStore-90a6a274.js → publicNotificationStore-dcf39a55.js} +0 -4
  64. package/dist/esm/solutions-components.js +1 -1
  65. package/dist/solutions-components/p-08b52ed8.entry.js +6 -0
  66. package/dist/solutions-components/p-16362eb4.js +36 -0
  67. package/dist/solutions-components/{p-3691a072.js → p-1ab414e0.js} +2 -2
  68. package/dist/solutions-components/{p-73ab9d9a.entry.js → p-3d7aa1b2.entry.js} +1 -1
  69. package/dist/solutions-components/{p-9a8c51bf.entry.js → p-57cf6784.entry.js} +1 -1
  70. package/dist/solutions-components/p-64b22d57.entry.js +6 -0
  71. package/dist/solutions-components/p-654dd5df.entry.js +6 -0
  72. package/dist/solutions-components/{p-f9166fcb.js → p-a26711e8.js} +1 -1
  73. package/dist/solutions-components/p-b1c8c6d7.entry.js +6 -0
  74. package/dist/solutions-components/{p-b892e595.entry.js → p-b9d29f30.entry.js} +1 -1
  75. package/dist/solutions-components/{p-1b41181b.js → p-c8d0ce92.js} +2 -2
  76. package/dist/solutions-components/{p-0219a1a9.entry.js → p-e76949eb.entry.js} +6 -6
  77. package/dist/solutions-components/p-ee7e2f00.entry.js +34 -0
  78. package/dist/solutions-components/solutions-components.esm.js +1 -1
  79. package/dist/solutions-components/utils/interfaces.ts +12 -1
  80. package/dist/solutions-components/utils/mapViewUtils.ts +41 -57
  81. package/dist/solutions-components/utils/publicNotificationStore.ts +0 -4
  82. package/dist/types/components/basemap-gallery/basemap-gallery.d.ts +5 -0
  83. package/dist/types/components/crowdsource-manager/crowdsource-manager.d.ts +37 -1
  84. package/dist/types/components/edit-card/edit-card.d.ts +8 -0
  85. package/dist/types/components/layer-table/layer-table.d.ts +40 -0
  86. package/dist/types/components/map-card/map-card.d.ts +25 -1
  87. package/dist/types/components/map-layer-picker/map-layer-picker.d.ts +50 -3
  88. package/dist/types/components/map-picker/map-picker.d.ts +2 -2
  89. package/dist/types/components/map-tools/map-tools.d.ts +21 -1
  90. package/dist/types/components.d.ts +182 -2
  91. package/dist/types/preact.d.ts +6 -3
  92. package/dist/types/utils/interfaces.d.ts +10 -1
  93. package/dist/types/utils/mapViewUtils.d.ts +8 -24
  94. package/dist/types/utils/publicNotificationStore.d.ts +0 -2
  95. package/package.json +1 -1
  96. package/dist/cjs/calcite-chip.cjs.entry.js +0 -259
  97. package/dist/cjs/calcite-notice.cjs.entry.js +0 -139
  98. package/dist/cjs/calcite-tooltip.cjs.entry.js +0 -439
  99. package/dist/esm/calcite-chip.entry.js +0 -255
  100. package/dist/esm/calcite-notice.entry.js +0 -135
  101. package/dist/esm/calcite-tooltip.entry.js +0 -435
  102. package/dist/solutions-components/p-2cff8331.entry.js +0 -6
  103. package/dist/solutions-components/p-3a6c8fc3.entry.js +0 -6
  104. package/dist/solutions-components/p-3b1fc7a2.entry.js +0 -6
  105. package/dist/solutions-components/p-767002cd.js +0 -36
  106. package/dist/solutions-components/p-a776b7e6.entry.js +0 -6
  107. package/dist/solutions-components/p-be36d5ed.entry.js +0 -22
  108. package/dist/solutions-components/p-c644edf5.entry.js +0 -11
  109. 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.mapChanged.emit({
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"; }
@@ -40,3 +40,7 @@
40
40
  .max-width-350 {
41
41
  max-width: 350px;
42
42
  }
43
+
44
+ .height-100 {
45
+ height: 100%;
46
+ }
@@ -19,7 +19,8 @@
19
19
  * limitations under the License.
20
20
  */
21
21
  import { Host, h } from "@stencil/core";
22
- import { getMapLayerHash, getMapLayerIds, getMapTableHash, getMapTableIds } from "../../utils/mapViewUtils";
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
- const hasLayers = Object.keys(state.layerNameHash).length > 0;
50
- const hasTables = Object.keys(state.tableNameHash).length > 0 && this.showTables;
51
- if (hasLayers || hasTables) {
52
- this._setSelectedLayer(this.ids[0], hasLayers ? "layer" : "table");
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(state.layerNameHash).indexOf(id) > -1 ?
87
- state.layerNameHash[id] : Object.keys(state.tableNameHash).indexOf(id) > -1 ?
88
- state.tableNameHash[id] : "";
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 name = itemType === "layer" ? state.layerNameHash[id] : state.tableNameHash[id];
148
- return this.type === "combobox" ? (h("calcite-combobox-item", { textLabel: name, value: id })) :
149
- this.type === "select" ? (h("calcite-option", { label: name, value: id })) :
150
- (h("calcite-dropdown-item", { onClick: () => void this._setSelectedLayer(id, itemType) }, name));
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, type) {
156
- this.selectedName = type === "layer" ? state.layerNameHash[id] : state.tableNameHash[id];
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
- const mapLayerIds = await getMapLayerIds(this.mapView);
168
- const mapTableIds = this.showTables ? await getMapTableIds(this.mapView) : [];
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 _initStateHash() {
182
- if (this.mapView) {
183
- state.layerNameHash = await getMapLayerHash(this.mapView);
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
- const name = state.layerNameHash[id];
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 : name);
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
- const name = state.tableNameHash[id];
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-scrim-background);
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.mapInfoChange.emit(v[0]);
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
- return (h(Host, null, h("div", null, h("div", { class: "box-shadow" }, this._getActionGroup(toggleIcon, false, expandTip, () => this._toggleTools())), h("div", { class: `margin-top-1-2 box-shadow ${toolsClass}` }, this._getActionGroup("legend", false, this._translations.legend, () => this._showLegend()), this._getActionGroup("magnifying-glass", false, this._translations.search, () => this._search()), this._getActionGroup(fullscreenIcon, false, fullscreenTip, () => this._expand()), this._getActionGroup("basemap", false, this._translations.basemap, () => this._toggleBasemapPicker()))), h("basemap-gallery", { 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; } })));
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]: 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
+ }