@esri/solutions-components 0.8.1 → 0.8.2

Sign up to get free protection for your applications and to get access to all the features.
@@ -277,10 +277,10 @@ export class MapDrawTools {
277
277
  * @protected
278
278
  */
279
279
  _clearSketch() {
280
- var _a;
281
- this._sketchWidget.viewModel.cancel();
280
+ var _a, _b;
281
+ (_a = this._sketchWidget) === null || _a === void 0 ? void 0 : _a.viewModel.cancel();
282
282
  this.graphics = [];
283
- (_a = this._sketchGraphicsLayer) === null || _a === void 0 ? void 0 : _a.removeAll();
283
+ (_b = this._sketchGraphicsLayer) === null || _b === void 0 ? void 0 : _b.removeAll();
284
284
  }
285
285
  /**
286
286
  * Emit the undo event
@@ -87,6 +87,14 @@ export class MapSelectTools {
87
87
  }
88
88
  }
89
89
  }
90
+ /**
91
+ * Called each time the mapView prop is changed.
92
+ */
93
+ async mapViewWatchHandler(v, oldV) {
94
+ if (v && v !== oldV) {
95
+ await this._init();
96
+ }
97
+ }
90
98
  /**
91
99
  * Called each time the searchConfiguration prop is changed.
92
100
  *
@@ -94,7 +102,7 @@ export class MapSelectTools {
94
102
  */
95
103
  async watchSearchConfigurationHandler(newValue, oldValue) {
96
104
  if (JSON.stringify(newValue) !== JSON.stringify(oldValue)) {
97
- this._initSearchWidget();
105
+ await this._initSearchWidget();
98
106
  }
99
107
  }
100
108
  //--------------------------------------------------------------------------
@@ -178,12 +186,6 @@ export class MapSelectTools {
178
186
  */
179
187
  async componentDidLoad() {
180
188
  await this._init();
181
- await this._searchWidget.when(() => {
182
- var _a;
183
- this._searchWidget.allPlaceholder = ((_a = this.searchConfiguration) === null || _a === void 0 ? void 0 : _a.allPlaceholder) &&
184
- this.searchConfiguration.allPlaceholder.toLowerCase() !== "find address or place" ?
185
- this.searchConfiguration.allPlaceholder : this._translations.placeholder;
186
- });
187
189
  }
188
190
  /**
189
191
  * Renders the component.
@@ -270,7 +272,7 @@ export class MapSelectTools {
270
272
  async _init() {
271
273
  this._initGraphicsLayer();
272
274
  await this._initSelectionSet();
273
- this._initSearchWidget();
275
+ await this._initSearchWidget();
274
276
  }
275
277
  /**
276
278
  * Initialize the state of the component with any stored values in a selection set
@@ -316,7 +318,7 @@ export class MapSelectTools {
316
318
  *
317
319
  * @protected
318
320
  */
319
- _initSearchWidget() {
321
+ async _initSearchWidget() {
320
322
  if (this.mapView && this._searchElement) {
321
323
  const searchConfiguration = this._getSearchConfig(this.searchConfiguration, this.mapView);
322
324
  const searchOptions = Object.assign({ view: this.mapView, container: this._searchElement, searchTerm: this._searchTerm }, searchConfiguration);
@@ -345,6 +347,12 @@ export class MapSelectTools {
345
347
  void this._clearResults(false, clearLabel);
346
348
  }
347
349
  });
350
+ await this._searchWidget.when(() => {
351
+ var _a;
352
+ this._searchWidget.allPlaceholder = ((_a = this.searchConfiguration) === null || _a === void 0 ? void 0 : _a.allPlaceholder) &&
353
+ this.searchConfiguration.allPlaceholder.toLowerCase() !== "find address or place" ?
354
+ this.searchConfiguration.allPlaceholder : this._translations.placeholder;
355
+ });
348
356
  }
349
357
  }
350
358
  /**
@@ -412,19 +420,21 @@ export class MapSelectTools {
412
420
  */
413
421
  _initGraphicsLayer() {
414
422
  const title = this._translations.bufferLayer;
415
- const bufferIndex = this.mapView.map.layers.findIndex((l) => l.title === title);
416
- if (bufferIndex > -1) {
417
- this._bufferGraphicsLayer = this.mapView.map.layers.getItemAt(bufferIndex);
418
- }
419
- else {
420
- this._bufferGraphicsLayer = new this.GraphicsLayer({ title, listMode: "hide" });
421
- state.managedLayers.push(title);
422
- const sketchIndex = this.mapView.map.layers.findIndex((l) => l.title === this._translations.sketchLayer);
423
- if (sketchIndex > -1) {
424
- this.mapView.map.layers.add(this._bufferGraphicsLayer, sketchIndex);
423
+ if (this.mapView) {
424
+ const bufferIndex = this.mapView.map.layers.findIndex((l) => l.title === title);
425
+ if (bufferIndex > -1) {
426
+ this._bufferGraphicsLayer = this.mapView.map.layers.getItemAt(bufferIndex);
425
427
  }
426
428
  else {
427
- this.mapView.map.layers.add(this._bufferGraphicsLayer);
429
+ this._bufferGraphicsLayer = new this.GraphicsLayer({ title, listMode: "hide" });
430
+ state.managedLayers.push(title);
431
+ const sketchIndex = this.mapView.map.layers.findIndex((l) => l.title === this._translations.sketchLayer);
432
+ if (sketchIndex > -1) {
433
+ this.mapView.map.layers.add(this._bufferGraphicsLayer, sketchIndex);
434
+ }
435
+ else {
436
+ this.mapView.map.layers.add(this._bufferGraphicsLayer);
437
+ }
428
438
  }
429
439
  }
430
440
  }
@@ -1220,6 +1230,9 @@ export class MapSelectTools {
1220
1230
  return [{
1221
1231
  "propName": "geometries",
1222
1232
  "methodName": "watchGeometriesHandler"
1233
+ }, {
1234
+ "propName": "mapView",
1235
+ "methodName": "mapViewWatchHandler"
1223
1236
  }, {
1224
1237
  "propName": "searchConfiguration",
1225
1238
  "methodName": "watchSearchConfigurationHandler"
@@ -84,6 +84,7 @@ export class PublicNotification {
84
84
  if (v === null || v === void 0 ? void 0 : v.popup) {
85
85
  this._popupsEnabled = v === null || v === void 0 ? void 0 : v.popup.autoOpenEnabled;
86
86
  }
87
+ this._initSearchConfiguration(this.searchConfiguration);
87
88
  }
88
89
  /**
89
90
  * Called each time the searchConfiguration prop is changed.
@@ -92,7 +93,7 @@ export class PublicNotification {
92
93
  */
93
94
  async watchSearchConfigurationHandler(newValue, oldValue) {
94
95
  const s_newValue = JSON.stringify(newValue);
95
- if (s_newValue !== JSON.stringify(oldValue)) {
96
+ if (this.mapView && (s_newValue !== JSON.stringify(oldValue) || (s_newValue && !this._searchConfiguration))) {
96
97
  this._searchConfiguration = JSON.parse(s_newValue);
97
98
  this.searchConfigurationChange.emit(this._searchConfiguration);
98
99
  // force back to list page before we create Search
@@ -181,6 +182,12 @@ export class PublicNotification {
181
182
  const headerSlot = this._isMobile ? "footer" : "header";
182
183
  return (h(Host, null, h("calcite-shell", null, h("calcite-action-bar", { class: "border-bottom-1 action-bar-size", "expand-disabled": true, layout: "horizontal", slot: headerSlot }, this._getActionGroup("list-check", EPageType.LIST, this._translations.myLists), this.showRefineSelection ? this._getActionGroup("test-data", EPageType.REFINE, this._translations.refineSelection) : null, this._getActionGroup("export", EPageType.EXPORT, this._translations.export)), this._getPage(this._pageType))));
183
184
  }
185
+ /**
186
+ * StencilJS: Called once just after the component is first loaded.
187
+ */
188
+ async componentDidLoad() {
189
+ this._initSearchConfiguration(this.searchConfiguration);
190
+ }
184
191
  /**
185
192
  * StencilJS: Called every time the component is disconnected from the DOM
186
193
  */
@@ -207,6 +214,22 @@ export class PublicNotification {
207
214
  this._geometryEngine = geometryEngine;
208
215
  this._jsonUtils = jsonUtils;
209
216
  }
217
+ /**
218
+ * Load the search configuration
219
+ *
220
+ * @returns Promise resolving when function is done
221
+ *
222
+ * @protected
223
+ */
224
+ _initSearchConfiguration(v) {
225
+ if (this.searchConfiguration && !this._searchConfiguration && this.mapView) {
226
+ this._searchConfiguration = v;
227
+ this.searchConfigurationChange.emit(this._searchConfiguration);
228
+ // force back to list page before we create Search
229
+ // https://devtopia.esri.com/WebGIS/arcgis-template-configuration/issues/3402
230
+ void this._home();
231
+ }
232
+ }
210
233
  /**
211
234
  * Initialize the default symbols that will be used when creating new graphics
212
235
  *
@@ -274,10 +274,10 @@ const MapDrawTools = /*@__PURE__*/ proxyCustomElement(class MapDrawTools extends
274
274
  * @protected
275
275
  */
276
276
  _clearSketch() {
277
- var _a;
278
- this._sketchWidget.viewModel.cancel();
277
+ var _a, _b;
278
+ (_a = this._sketchWidget) === null || _a === void 0 ? void 0 : _a.viewModel.cancel();
279
279
  this.graphics = [];
280
- (_a = this._sketchGraphicsLayer) === null || _a === void 0 ? void 0 : _a.removeAll();
280
+ (_b = this._sketchGraphicsLayer) === null || _b === void 0 ? void 0 : _b.removeAll();
281
281
  }
282
282
  /**
283
283
  * Emit the undo event
@@ -103,6 +103,14 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
103
103
  }
104
104
  }
105
105
  }
106
+ /**
107
+ * Called each time the mapView prop is changed.
108
+ */
109
+ async mapViewWatchHandler(v, oldV) {
110
+ if (v && v !== oldV) {
111
+ await this._init();
112
+ }
113
+ }
106
114
  /**
107
115
  * Called each time the searchConfiguration prop is changed.
108
116
  *
@@ -110,7 +118,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
110
118
  */
111
119
  async watchSearchConfigurationHandler(newValue, oldValue) {
112
120
  if (JSON.stringify(newValue) !== JSON.stringify(oldValue)) {
113
- this._initSearchWidget();
121
+ await this._initSearchWidget();
114
122
  }
115
123
  }
116
124
  //--------------------------------------------------------------------------
@@ -194,12 +202,6 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
194
202
  */
195
203
  async componentDidLoad() {
196
204
  await this._init();
197
- await this._searchWidget.when(() => {
198
- var _a;
199
- this._searchWidget.allPlaceholder = ((_a = this.searchConfiguration) === null || _a === void 0 ? void 0 : _a.allPlaceholder) &&
200
- this.searchConfiguration.allPlaceholder.toLowerCase() !== "find address or place" ?
201
- this.searchConfiguration.allPlaceholder : this._translations.placeholder;
202
- });
203
205
  }
204
206
  /**
205
207
  * Renders the component.
@@ -286,7 +288,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
286
288
  async _init() {
287
289
  this._initGraphicsLayer();
288
290
  await this._initSelectionSet();
289
- this._initSearchWidget();
291
+ await this._initSearchWidget();
290
292
  }
291
293
  /**
292
294
  * Initialize the state of the component with any stored values in a selection set
@@ -332,7 +334,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
332
334
  *
333
335
  * @protected
334
336
  */
335
- _initSearchWidget() {
337
+ async _initSearchWidget() {
336
338
  if (this.mapView && this._searchElement) {
337
339
  const searchConfiguration = this._getSearchConfig(this.searchConfiguration, this.mapView);
338
340
  const searchOptions = Object.assign({ view: this.mapView, container: this._searchElement, searchTerm: this._searchTerm }, searchConfiguration);
@@ -361,6 +363,12 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
361
363
  void this._clearResults(false, clearLabel);
362
364
  }
363
365
  });
366
+ await this._searchWidget.when(() => {
367
+ var _a;
368
+ this._searchWidget.allPlaceholder = ((_a = this.searchConfiguration) === null || _a === void 0 ? void 0 : _a.allPlaceholder) &&
369
+ this.searchConfiguration.allPlaceholder.toLowerCase() !== "find address or place" ?
370
+ this.searchConfiguration.allPlaceholder : this._translations.placeholder;
371
+ });
364
372
  }
365
373
  }
366
374
  /**
@@ -428,19 +436,21 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
428
436
  */
429
437
  _initGraphicsLayer() {
430
438
  const title = this._translations.bufferLayer;
431
- const bufferIndex = this.mapView.map.layers.findIndex((l) => l.title === title);
432
- if (bufferIndex > -1) {
433
- this._bufferGraphicsLayer = this.mapView.map.layers.getItemAt(bufferIndex);
434
- }
435
- else {
436
- this._bufferGraphicsLayer = new this.GraphicsLayer({ title, listMode: "hide" });
437
- state.managedLayers.push(title);
438
- const sketchIndex = this.mapView.map.layers.findIndex((l) => l.title === this._translations.sketchLayer);
439
- if (sketchIndex > -1) {
440
- this.mapView.map.layers.add(this._bufferGraphicsLayer, sketchIndex);
439
+ if (this.mapView) {
440
+ const bufferIndex = this.mapView.map.layers.findIndex((l) => l.title === title);
441
+ if (bufferIndex > -1) {
442
+ this._bufferGraphicsLayer = this.mapView.map.layers.getItemAt(bufferIndex);
441
443
  }
442
444
  else {
443
- this.mapView.map.layers.add(this._bufferGraphicsLayer);
445
+ this._bufferGraphicsLayer = new this.GraphicsLayer({ title, listMode: "hide" });
446
+ state.managedLayers.push(title);
447
+ const sketchIndex = this.mapView.map.layers.findIndex((l) => l.title === this._translations.sketchLayer);
448
+ if (sketchIndex > -1) {
449
+ this.mapView.map.layers.add(this._bufferGraphicsLayer, sketchIndex);
450
+ }
451
+ else {
452
+ this.mapView.map.layers.add(this._bufferGraphicsLayer);
453
+ }
444
454
  }
445
455
  }
446
456
  }
@@ -798,6 +808,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
798
808
  get el() { return this; }
799
809
  static get watchers() { return {
800
810
  "geometries": ["watchGeometriesHandler"],
811
+ "mapView": ["mapViewWatchHandler"],
801
812
  "searchConfiguration": ["watchSearchConfigurationHandler"]
802
813
  }; }
803
814
  static get style() { return mapSelectToolsCss; }
@@ -830,6 +841,7 @@ const MapSelectTools = /*@__PURE__*/ proxyCustomElement(class MapSelectTools ext
830
841
  "getSelection": [64]
831
842
  }, [[8, "searchConfigurationChange", "searchConfigurationChangeChanged"], [8, "distanceChanged", "distanceChanged"], [8, "unitChanged", "unitChanged"]], {
832
843
  "geometries": ["watchGeometriesHandler"],
844
+ "mapView": ["mapViewWatchHandler"],
833
845
  "searchConfiguration": ["watchSearchConfigurationHandler"]
834
846
  }]);
835
847
  function defineCustomElement() {
@@ -117,6 +117,7 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class PublicNotifi
117
117
  if (v === null || v === void 0 ? void 0 : v.popup) {
118
118
  this._popupsEnabled = v === null || v === void 0 ? void 0 : v.popup.autoOpenEnabled;
119
119
  }
120
+ this._initSearchConfiguration(this.searchConfiguration);
120
121
  }
121
122
  /**
122
123
  * Called each time the searchConfiguration prop is changed.
@@ -125,7 +126,7 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class PublicNotifi
125
126
  */
126
127
  async watchSearchConfigurationHandler(newValue, oldValue) {
127
128
  const s_newValue = JSON.stringify(newValue);
128
- if (s_newValue !== JSON.stringify(oldValue)) {
129
+ if (this.mapView && (s_newValue !== JSON.stringify(oldValue) || (s_newValue && !this._searchConfiguration))) {
129
130
  this._searchConfiguration = JSON.parse(s_newValue);
130
131
  this.searchConfigurationChange.emit(this._searchConfiguration);
131
132
  // force back to list page before we create Search
@@ -214,6 +215,12 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class PublicNotifi
214
215
  const headerSlot = this._isMobile ? "footer" : "header";
215
216
  return (h(Host, null, h("calcite-shell", null, h("calcite-action-bar", { class: "border-bottom-1 action-bar-size", "expand-disabled": true, layout: "horizontal", slot: headerSlot }, this._getActionGroup("list-check", EPageType.LIST, this._translations.myLists), this.showRefineSelection ? this._getActionGroup("test-data", EPageType.REFINE, this._translations.refineSelection) : null, this._getActionGroup("export", EPageType.EXPORT, this._translations.export)), this._getPage(this._pageType))));
216
217
  }
218
+ /**
219
+ * StencilJS: Called once just after the component is first loaded.
220
+ */
221
+ async componentDidLoad() {
222
+ this._initSearchConfiguration(this.searchConfiguration);
223
+ }
217
224
  /**
218
225
  * StencilJS: Called every time the component is disconnected from the DOM
219
226
  */
@@ -240,6 +247,22 @@ const PublicNotification$1 = /*@__PURE__*/ proxyCustomElement(class PublicNotifi
240
247
  this._geometryEngine = geometryEngine;
241
248
  this._jsonUtils = jsonUtils;
242
249
  }
250
+ /**
251
+ * Load the search configuration
252
+ *
253
+ * @returns Promise resolving when function is done
254
+ *
255
+ * @protected
256
+ */
257
+ _initSearchConfiguration(v) {
258
+ if (this.searchConfiguration && !this._searchConfiguration && this.mapView) {
259
+ this._searchConfiguration = v;
260
+ this.searchConfigurationChange.emit(this._searchConfiguration);
261
+ // force back to list page before we create Search
262
+ // https://devtopia.esri.com/WebGIS/arcgis-template-configuration/issues/3402
263
+ void this._home();
264
+ }
265
+ }
243
266
  /**
244
267
  * Initialize the default symbols that will be used when creating new graphics
245
268
  *
@@ -571,10 +571,10 @@ const MapDrawTools = class {
571
571
  * @protected
572
572
  */
573
573
  _clearSketch() {
574
- var _a;
575
- this._sketchWidget.viewModel.cancel();
574
+ var _a, _b;
575
+ (_a = this._sketchWidget) === null || _a === void 0 ? void 0 : _a.viewModel.cancel();
576
576
  this.graphics = [];
577
- (_a = this._sketchGraphicsLayer) === null || _a === void 0 ? void 0 : _a.removeAll();
577
+ (_b = this._sketchGraphicsLayer) === null || _b === void 0 ? void 0 : _b.removeAll();
578
578
  }
579
579
  /**
580
580
  * Emit the undo event