@esri/solutions-components 0.6.13 → 0.6.14
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.
- 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
|
@@ -30,10 +30,18 @@ export class CrowdsourceManager {
|
|
|
30
30
|
this._shouldSetMapView = false;
|
|
31
31
|
this.classicGrid = false;
|
|
32
32
|
this.enableAutoRefresh = true;
|
|
33
|
+
this.enableFullscreen = true;
|
|
33
34
|
this.enableInlineEdit = false;
|
|
35
|
+
this.enableLegend = true;
|
|
36
|
+
this.enableSearch = true;
|
|
37
|
+
this.enableHome = true;
|
|
38
|
+
this.enableZoom = true;
|
|
39
|
+
this.enableBasemap = true;
|
|
40
|
+
this.basemapConfig = undefined;
|
|
34
41
|
this.showNewestFirst = true;
|
|
35
42
|
this.hideMap = false;
|
|
36
43
|
this.mapInfos = [];
|
|
44
|
+
this.onlyShowUpdatableLayers = true;
|
|
37
45
|
this.searchConfiguration = undefined;
|
|
38
46
|
this.zoomAndScrollToSelected = false;
|
|
39
47
|
this._expandPopup = false;
|
|
@@ -68,13 +76,18 @@ export class CrowdsourceManager {
|
|
|
68
76
|
*/
|
|
69
77
|
async mapChanged(evt) {
|
|
70
78
|
this._mapChange = evt.detail;
|
|
79
|
+
await this._mapChange.mapView.when(() => {
|
|
80
|
+
this._setMapView();
|
|
81
|
+
});
|
|
82
|
+
}
|
|
83
|
+
/**
|
|
84
|
+
* Listen for beforeMapChanged and minimize the popup if it's expanded
|
|
85
|
+
*/
|
|
86
|
+
async beforeMapChanged() {
|
|
71
87
|
if (this._expandPopup) {
|
|
72
88
|
this._shouldSetMapView = true;
|
|
73
89
|
this._expandPopup = false;
|
|
74
90
|
}
|
|
75
|
-
else {
|
|
76
|
-
this._setMapView();
|
|
77
|
-
}
|
|
78
91
|
}
|
|
79
92
|
//--------------------------------------------------------------------------
|
|
80
93
|
//
|
|
@@ -233,7 +246,7 @@ export class CrowdsourceManager {
|
|
|
233
246
|
const mapDisplayClass = this.classicGrid && layoutMode === ELayoutMode.GRID ? "display-flex height-full width-1-2" :
|
|
234
247
|
layoutMode === ELayoutMode.GRID && !hideMap ? "" : "display-none";
|
|
235
248
|
const mapContainerClass = this.classicGrid && layoutMode === ELayoutMode.GRID ? "width-full" : this._expandPopup ? "height-50-px" : "adjusted-height-50";
|
|
236
|
-
return (h("div", { class: `${mapContainerClass} overflow-hidden ${mapDisplayClass}` }, h("map-card", { class: "width-full", mapInfos: this.mapInfos })));
|
|
249
|
+
return (h("div", { class: `${mapContainerClass} overflow-hidden ${mapDisplayClass}` }, h("map-card", { basemapConfig: this.basemapConfig, class: "width-full", enableBasemap: this.enableBasemap, enableFullscreen: this.enableFullscreen, enableLegend: this.enableLegend, enableSearch: this.enableSearch, mapInfos: this.mapInfos })));
|
|
237
250
|
}
|
|
238
251
|
/**
|
|
239
252
|
* Get the expand node for the popup information
|
|
@@ -287,7 +300,7 @@ export class CrowdsourceManager {
|
|
|
287
300
|
const toggleSlot = this.classicGrid && layoutMode !== ELayoutMode.VERTICAL ? "footer" :
|
|
288
301
|
this.classicGrid && layoutMode === ELayoutMode.VERTICAL ? "panel-end" :
|
|
289
302
|
layoutMode === ELayoutMode.HORIZONTAL ? "header" : "panel-start";
|
|
290
|
-
return (h("calcite-shell", { class: tableSizeClass + " border-bottom" }, h("calcite-action-bar", { class: "border", expandDisabled: true, layout: toggleLayout, slot: toggleSlot }, h("calcite-action", { class: "toggle-node", icon: icon, id: id, onClick: () => this._toggleLayout(), text: "" }), h("calcite-tooltip", { label: tooltip, placement: "bottom", "reference-element": id }, h("span", null, tooltip))), h("div", { class: "width-full height-full position-relative" }, h("layer-table", { enableAutoRefresh: this.enableAutoRefresh, enableInlineEdit: this.enableInlineEdit, mapInfo: this._mapInfo, mapView: this === null || this === void 0 ? void 0 : this._mapView, showNewestFirst: this.showNewestFirst, zoomAndScrollToSelected: this.zoomAndScrollToSelected }))));
|
|
303
|
+
return (h("calcite-shell", { class: tableSizeClass + " border-bottom" }, h("calcite-action-bar", { class: "border", expandDisabled: true, layout: toggleLayout, slot: toggleSlot }, h("calcite-action", { class: "toggle-node", icon: icon, id: id, onClick: () => this._toggleLayout(), text: "" }), h("calcite-tooltip", { label: tooltip, placement: "bottom", "reference-element": id }, h("span", null, tooltip))), h("div", { class: "width-full height-full position-relative" }, h("layer-table", { enableAutoRefresh: this.enableAutoRefresh, enableInlineEdit: this.enableInlineEdit, mapInfo: this._mapInfo, mapView: this === null || this === void 0 ? void 0 : this._mapView, onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, showNewestFirst: this.showNewestFirst, zoomAndScrollToSelected: this.zoomAndScrollToSelected }))));
|
|
291
304
|
}
|
|
292
305
|
/**
|
|
293
306
|
* Open/Close the appropriate panel.
|
|
@@ -384,6 +397,24 @@ export class CrowdsourceManager {
|
|
|
384
397
|
"reflect": false,
|
|
385
398
|
"defaultValue": "true"
|
|
386
399
|
},
|
|
400
|
+
"enableFullscreen": {
|
|
401
|
+
"type": "boolean",
|
|
402
|
+
"mutable": false,
|
|
403
|
+
"complexType": {
|
|
404
|
+
"original": "boolean",
|
|
405
|
+
"resolved": "boolean",
|
|
406
|
+
"references": {}
|
|
407
|
+
},
|
|
408
|
+
"required": false,
|
|
409
|
+
"optional": false,
|
|
410
|
+
"docs": {
|
|
411
|
+
"tags": [],
|
|
412
|
+
"text": "boolean: when true the fullscreen widget will be available"
|
|
413
|
+
},
|
|
414
|
+
"attribute": "enable-fullscreen",
|
|
415
|
+
"reflect": false,
|
|
416
|
+
"defaultValue": "true"
|
|
417
|
+
},
|
|
387
418
|
"enableInlineEdit": {
|
|
388
419
|
"type": "boolean",
|
|
389
420
|
"mutable": false,
|
|
@@ -402,6 +433,117 @@ export class CrowdsourceManager {
|
|
|
402
433
|
"reflect": false,
|
|
403
434
|
"defaultValue": "false"
|
|
404
435
|
},
|
|
436
|
+
"enableLegend": {
|
|
437
|
+
"type": "boolean",
|
|
438
|
+
"mutable": false,
|
|
439
|
+
"complexType": {
|
|
440
|
+
"original": "boolean",
|
|
441
|
+
"resolved": "boolean",
|
|
442
|
+
"references": {}
|
|
443
|
+
},
|
|
444
|
+
"required": false,
|
|
445
|
+
"optional": false,
|
|
446
|
+
"docs": {
|
|
447
|
+
"tags": [],
|
|
448
|
+
"text": "boolean: when true the legend widget will be available"
|
|
449
|
+
},
|
|
450
|
+
"attribute": "enable-legend",
|
|
451
|
+
"reflect": false,
|
|
452
|
+
"defaultValue": "true"
|
|
453
|
+
},
|
|
454
|
+
"enableSearch": {
|
|
455
|
+
"type": "boolean",
|
|
456
|
+
"mutable": false,
|
|
457
|
+
"complexType": {
|
|
458
|
+
"original": "boolean",
|
|
459
|
+
"resolved": "boolean",
|
|
460
|
+
"references": {}
|
|
461
|
+
},
|
|
462
|
+
"required": false,
|
|
463
|
+
"optional": false,
|
|
464
|
+
"docs": {
|
|
465
|
+
"tags": [],
|
|
466
|
+
"text": "boolean: when true the search widget will be available"
|
|
467
|
+
},
|
|
468
|
+
"attribute": "enable-search",
|
|
469
|
+
"reflect": false,
|
|
470
|
+
"defaultValue": "true"
|
|
471
|
+
},
|
|
472
|
+
"enableHome": {
|
|
473
|
+
"type": "boolean",
|
|
474
|
+
"mutable": false,
|
|
475
|
+
"complexType": {
|
|
476
|
+
"original": "boolean",
|
|
477
|
+
"resolved": "boolean",
|
|
478
|
+
"references": {}
|
|
479
|
+
},
|
|
480
|
+
"required": false,
|
|
481
|
+
"optional": false,
|
|
482
|
+
"docs": {
|
|
483
|
+
"tags": [],
|
|
484
|
+
"text": "boolean: when true the home widget will be available"
|
|
485
|
+
},
|
|
486
|
+
"attribute": "enable-home",
|
|
487
|
+
"reflect": false,
|
|
488
|
+
"defaultValue": "true"
|
|
489
|
+
},
|
|
490
|
+
"enableZoom": {
|
|
491
|
+
"type": "boolean",
|
|
492
|
+
"mutable": false,
|
|
493
|
+
"complexType": {
|
|
494
|
+
"original": "boolean",
|
|
495
|
+
"resolved": "boolean",
|
|
496
|
+
"references": {}
|
|
497
|
+
},
|
|
498
|
+
"required": false,
|
|
499
|
+
"optional": false,
|
|
500
|
+
"docs": {
|
|
501
|
+
"tags": [],
|
|
502
|
+
"text": "boolean: when true the zoom widget will be available"
|
|
503
|
+
},
|
|
504
|
+
"attribute": "enable-zoom",
|
|
505
|
+
"reflect": false,
|
|
506
|
+
"defaultValue": "true"
|
|
507
|
+
},
|
|
508
|
+
"enableBasemap": {
|
|
509
|
+
"type": "boolean",
|
|
510
|
+
"mutable": false,
|
|
511
|
+
"complexType": {
|
|
512
|
+
"original": "boolean",
|
|
513
|
+
"resolved": "boolean",
|
|
514
|
+
"references": {}
|
|
515
|
+
},
|
|
516
|
+
"required": false,
|
|
517
|
+
"optional": false,
|
|
518
|
+
"docs": {
|
|
519
|
+
"tags": [],
|
|
520
|
+
"text": "boolean: when true the basemap widget will be available"
|
|
521
|
+
},
|
|
522
|
+
"attribute": "enable-basemap",
|
|
523
|
+
"reflect": false,
|
|
524
|
+
"defaultValue": "true"
|
|
525
|
+
},
|
|
526
|
+
"basemapConfig": {
|
|
527
|
+
"type": "unknown",
|
|
528
|
+
"mutable": false,
|
|
529
|
+
"complexType": {
|
|
530
|
+
"original": "IBasemapConfig",
|
|
531
|
+
"resolved": "IBasemapConfig",
|
|
532
|
+
"references": {
|
|
533
|
+
"IBasemapConfig": {
|
|
534
|
+
"location": "import",
|
|
535
|
+
"path": "../../utils/interfaces",
|
|
536
|
+
"id": "src/utils/interfaces.ts::IBasemapConfig"
|
|
537
|
+
}
|
|
538
|
+
}
|
|
539
|
+
},
|
|
540
|
+
"required": false,
|
|
541
|
+
"optional": false,
|
|
542
|
+
"docs": {
|
|
543
|
+
"tags": [],
|
|
544
|
+
"text": "IBasemapConfig: List of any basemaps to filter out from the basemap widget"
|
|
545
|
+
}
|
|
546
|
+
},
|
|
405
547
|
"showNewestFirst": {
|
|
406
548
|
"type": "boolean",
|
|
407
549
|
"mutable": false,
|
|
@@ -460,6 +602,24 @@ export class CrowdsourceManager {
|
|
|
460
602
|
},
|
|
461
603
|
"defaultValue": "[]"
|
|
462
604
|
},
|
|
605
|
+
"onlyShowUpdatableLayers": {
|
|
606
|
+
"type": "boolean",
|
|
607
|
+
"mutable": false,
|
|
608
|
+
"complexType": {
|
|
609
|
+
"original": "boolean",
|
|
610
|
+
"resolved": "boolean",
|
|
611
|
+
"references": {}
|
|
612
|
+
},
|
|
613
|
+
"required": false,
|
|
614
|
+
"optional": false,
|
|
615
|
+
"docs": {
|
|
616
|
+
"tags": [],
|
|
617
|
+
"text": "boolean: When true only editable layers that support the update capability will be available"
|
|
618
|
+
},
|
|
619
|
+
"attribute": "only-show-updatable-layers",
|
|
620
|
+
"reflect": false,
|
|
621
|
+
"defaultValue": "true"
|
|
622
|
+
},
|
|
463
623
|
"searchConfiguration": {
|
|
464
624
|
"type": "unknown",
|
|
465
625
|
"mutable": false,
|
|
@@ -524,6 +684,12 @@ export class CrowdsourceManager {
|
|
|
524
684
|
"target": "window",
|
|
525
685
|
"capture": false,
|
|
526
686
|
"passive": false
|
|
687
|
+
}, {
|
|
688
|
+
"name": "beforeMapChanged",
|
|
689
|
+
"method": "beforeMapChanged",
|
|
690
|
+
"target": "window",
|
|
691
|
+
"capture": false,
|
|
692
|
+
"passive": false
|
|
527
693
|
}];
|
|
528
694
|
}
|
|
529
695
|
}
|
|
@@ -85,6 +85,10 @@ export class EditCard {
|
|
|
85
85
|
}
|
|
86
86
|
if (((_a = this.graphics) === null || _a === void 0 ? void 0 : _a.length) > 0 && ((_b = this.graphics[0]) === null || _b === void 0 ? void 0 : _b.layer)) {
|
|
87
87
|
this._layer = this.graphics[0].layer;
|
|
88
|
+
if (this._layerEditHandle) {
|
|
89
|
+
this._layerEditHandle.remove();
|
|
90
|
+
}
|
|
91
|
+
this._layerEditHandle = this._layer.on("edits", () => this.editsComplete.emit());
|
|
88
92
|
}
|
|
89
93
|
}
|
|
90
94
|
/**
|
|
@@ -284,6 +288,21 @@ export class EditCard {
|
|
|
284
288
|
"resolved": "void",
|
|
285
289
|
"references": {}
|
|
286
290
|
}
|
|
291
|
+
}, {
|
|
292
|
+
"method": "editsComplete",
|
|
293
|
+
"name": "editsComplete",
|
|
294
|
+
"bubbles": true,
|
|
295
|
+
"cancelable": true,
|
|
296
|
+
"composed": true,
|
|
297
|
+
"docs": {
|
|
298
|
+
"tags": [],
|
|
299
|
+
"text": "Emitted on demand when edits are completed on current edit layer"
|
|
300
|
+
},
|
|
301
|
+
"complexType": {
|
|
302
|
+
"original": "void",
|
|
303
|
+
"resolved": "void",
|
|
304
|
+
"references": {}
|
|
305
|
+
}
|
|
287
306
|
}];
|
|
288
307
|
}
|
|
289
308
|
static get elementRef() { return "el"; }
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
import { Host, h } from "@stencil/core";
|
|
22
22
|
import { loadModules } from "../../utils/loadModules";
|
|
23
23
|
import { getLocaleComponentStrings } from "../../utils/locale";
|
|
24
|
-
import {
|
|
24
|
+
import { getLayerOrTable, goToSelection } from "../../utils/mapViewUtils";
|
|
25
25
|
import { queryFeaturesByID, queryAllIds } from "../../utils/queryUtils";
|
|
26
26
|
import * as downloadUtils from "../../utils/downloadUtils";
|
|
27
27
|
export class LayerTable {
|
|
@@ -49,6 +49,7 @@ export class LayerTable {
|
|
|
49
49
|
this.enableInlineEdit = undefined;
|
|
50
50
|
this.mapInfo = undefined;
|
|
51
51
|
this.mapView = undefined;
|
|
52
|
+
this.onlyShowUpdatableLayers = undefined;
|
|
52
53
|
this.showNewestFirst = undefined;
|
|
53
54
|
this.zoomAndScrollToSelected = undefined;
|
|
54
55
|
this._alertOpen = false;
|
|
@@ -69,13 +70,12 @@ export class LayerTable {
|
|
|
69
70
|
* watch for changes in map view and get the first layer
|
|
70
71
|
*/
|
|
71
72
|
async mapViewWatchHandler() {
|
|
72
|
-
this.
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
this.reactiveUtils.on(() => this.mapView, "click", (event) => {
|
|
73
|
+
if (this._mapClickHandle) {
|
|
74
|
+
this._mapClickHandle.remove();
|
|
75
|
+
}
|
|
76
|
+
this._mapClickHandle = this.reactiveUtils.on(() => this.mapView, "click", (event) => {
|
|
76
77
|
void this._mapClicked(event);
|
|
77
78
|
});
|
|
78
|
-
this._fetchingData = false;
|
|
79
79
|
}
|
|
80
80
|
/**
|
|
81
81
|
* watch for changes in layer view and verify if it has editing enabled
|
|
@@ -132,6 +132,22 @@ export class LayerTable {
|
|
|
132
132
|
}
|
|
133
133
|
}
|
|
134
134
|
}
|
|
135
|
+
/**
|
|
136
|
+
* Refresh the table when edits are completed
|
|
137
|
+
*
|
|
138
|
+
*/
|
|
139
|
+
editsComplete() {
|
|
140
|
+
this._refresh();
|
|
141
|
+
}
|
|
142
|
+
/**
|
|
143
|
+
* Refresh the table when edits are completed
|
|
144
|
+
*
|
|
145
|
+
*/
|
|
146
|
+
noLayersFound() {
|
|
147
|
+
this._layer = undefined;
|
|
148
|
+
this._allIds = [];
|
|
149
|
+
this._clearSelection();
|
|
150
|
+
}
|
|
135
151
|
//--------------------------------------------------------------------------
|
|
136
152
|
//
|
|
137
153
|
// Functions (lifecycle)
|
|
@@ -150,9 +166,6 @@ export class LayerTable {
|
|
|
150
166
|
* Renders the component.
|
|
151
167
|
*/
|
|
152
168
|
render() {
|
|
153
|
-
if (!this._layer) {
|
|
154
|
-
return null;
|
|
155
|
-
}
|
|
156
169
|
const tableNodeClass = this._fetchingData ? "display-none" : "";
|
|
157
170
|
const loadingClass = this._fetchingData ? "" : "display-none";
|
|
158
171
|
const total = this._allIds.length.toString();
|
|
@@ -190,9 +203,37 @@ export class LayerTable {
|
|
|
190
203
|
*/
|
|
191
204
|
_getTableControlRow(slot) {
|
|
192
205
|
const featuresSelected = this._selectedIndexes.length > 0;
|
|
193
|
-
return (h("div", { class: "display-flex table-border height-51", slot: slot }, h("calcite-action-bar", { expandDisabled: true, expanded: true, layout: "horizontal" }, h("div", { class: "border-end" }, h("map-layer-picker", { appearance: "transparent", mapView: this.mapView, onLayerSelectionChange: (evt) => this._layerSelectionChanged(evt), placeholderIcon: "layers", scale: "l", type: "dropdown" })),
|
|
206
|
+
return (h("div", { class: "display-flex table-border height-51", slot: slot }, h("calcite-action-bar", { expandDisabled: true, expanded: true, layout: "horizontal" }, h("div", { class: "border-end" }, h("map-layer-picker", { appearance: "transparent", mapView: this.mapView, onLayerSelectionChange: (evt) => this._layerSelectionChanged(evt), onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, placeholderIcon: "layers", scale: "l", type: "dropdown" })), this._getAction("zoom-to-object", this._translations.zoom, () => this._zoom(), !featuresSelected), this._getAction("filter", this._translations.filters, () => this._filter(), false), this._deleteEnabled ? this._getDangerAction("trash", this._translations.delete, () => this._delete(), !featuresSelected) : undefined, this._getAction("erase", this._translations.clearSelection, () => this._clearSelection(), !featuresSelected)), h("calcite-dropdown", { disabled: this._layer === undefined }, h("calcite-action", { appearance: "solid", label: "", slot: "trigger", text: "" }, h("calcite-button", { appearance: "transparent", iconEnd: "chevron-down", kind: "neutral" }, this._translations.more)), h("calcite-dropdown-group", { "selection-mode": "none" }, h("calcite-dropdown-item", { iconStart: "list-check-all", onClick: () => this._selectAll() }, this._translations.selectAll), h("calcite-dropdown-item", { iconStart: "selected-items-filter", onClick: () => this._toggleShowSelected() }, this._showOnlySelected ? this._translations.showAll :
|
|
194
207
|
this._translations.showSelected), h("calcite-dropdown-item", { iconStart: "compare", onClick: () => this._switchSelected() }, this._translations.switchSelected), h("calcite-dropdown-item", { iconStart: "refresh", onClick: () => this._refresh() }, this._translations.refresh), h("calcite-dropdown-item", { iconStart: "export", onClick: () => void this._exportToCSV() }, this._translations.exportCSV)))));
|
|
195
208
|
}
|
|
209
|
+
/**
|
|
210
|
+
* Get an action and tooltip
|
|
211
|
+
*
|
|
212
|
+
* @param icon string the name of the icon to display, will also be used as the id
|
|
213
|
+
* @param label string the text to display and label the action
|
|
214
|
+
* @param func any the function to execute
|
|
215
|
+
* @param disabled boolean when true the user will not be able to interact with the action
|
|
216
|
+
*
|
|
217
|
+
* @returns VNode The node representing the DOM element that will contain the action
|
|
218
|
+
*/
|
|
219
|
+
_getAction(icon, label, func, disabled) {
|
|
220
|
+
const _disabled = this._layer === undefined ? true : disabled;
|
|
221
|
+
return (h("div", { class: "display-flex" }, h("calcite-action", { appearance: "solid", disabled: _disabled, icon: icon, id: icon, label: label, onClick: func, text: label, textEnabled: true }), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": icon }, h("span", null, label))));
|
|
222
|
+
}
|
|
223
|
+
/**
|
|
224
|
+
* Get an action with danger color icon and text
|
|
225
|
+
*
|
|
226
|
+
* @param icon string the name of the icon to display, will also be used as the id
|
|
227
|
+
* @param label string the text to display and label the action
|
|
228
|
+
* @param func any the function to execute
|
|
229
|
+
* @param disabled boolean when true the user will not be able to interact with the action
|
|
230
|
+
*
|
|
231
|
+
* @returns VNode The node representing the DOM element that will contain the action
|
|
232
|
+
*/
|
|
233
|
+
_getDangerAction(icon, label, func, disabled) {
|
|
234
|
+
const _disabled = this._layer === undefined ? true : disabled;
|
|
235
|
+
return (h("div", { class: "display-flex" }, h("calcite-action", { appearance: "solid", disabled: _disabled, id: icon, onClick: func, text: "" }, h("calcite-button", { appearance: "transparent", iconStart: icon, kind: "danger" }, label)), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": icon }, h("span", null, label))));
|
|
236
|
+
}
|
|
196
237
|
/**
|
|
197
238
|
* Initialize the FeatureTable
|
|
198
239
|
*
|
|
@@ -202,7 +243,7 @@ export class LayerTable {
|
|
|
202
243
|
*/
|
|
203
244
|
async _getTable(node, columnTemplates) {
|
|
204
245
|
if (this._layer) {
|
|
205
|
-
await this._layer.when(
|
|
246
|
+
await this._layer.when(() => {
|
|
206
247
|
this._table = new this.FeatureTable({
|
|
207
248
|
autoRefreshEnabled: this.enableAutoRefresh,
|
|
208
249
|
layer: this._layer,
|
|
@@ -219,25 +260,25 @@ export class LayerTable {
|
|
|
219
260
|
},
|
|
220
261
|
container: node
|
|
221
262
|
});
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
263
|
+
});
|
|
264
|
+
this._checkEditEnabled();
|
|
265
|
+
await this._table.when(() => {
|
|
266
|
+
this._table.highlightIds.on("change", () => {
|
|
267
|
+
this._selectedIndexes = this._table.highlightIds.toArray();
|
|
268
|
+
if (this._showOnlySelected) {
|
|
269
|
+
if (this._selectedIndexes.length > 0) {
|
|
270
|
+
this._table.filterBySelection();
|
|
271
|
+
}
|
|
272
|
+
else {
|
|
273
|
+
this._toggleShowSelected();
|
|
233
274
|
}
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
275
|
+
}
|
|
276
|
+
this.featureSelectionChange.emit(this._selectedIndexes);
|
|
277
|
+
});
|
|
278
|
+
this.reactiveUtils.watch(() => this._table.activeSortOrders, (sortOrders) => {
|
|
279
|
+
var _a, _b, _c, _d;
|
|
280
|
+
this._sortActive = this._layer ? (sortOrders.length > 0 && ((_a = sortOrders[0]) === null || _a === void 0 ? void 0 : _a.direction) === "asc" || ((_b = sortOrders[0]) === null || _b === void 0 ? void 0 : _b.direction) === "desc") ||
|
|
281
|
+
((_c = sortOrders[0]) === null || _c === void 0 ? void 0 : _c.direction) === null && ((_d = sortOrders[0]) === null || _d === void 0 ? void 0 : _d.fieldName) === this._layer.objectIdField : false;
|
|
241
282
|
});
|
|
242
283
|
});
|
|
243
284
|
}
|
|
@@ -248,20 +289,30 @@ export class LayerTable {
|
|
|
248
289
|
* @returns void
|
|
249
290
|
*/
|
|
250
291
|
async _resetTable() {
|
|
251
|
-
if (this.
|
|
292
|
+
if (this._table) {
|
|
252
293
|
this._clearSelection();
|
|
253
294
|
this._allIds = [];
|
|
254
295
|
this.featureSelectionChange.emit(this._selectedIndexes);
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
296
|
+
if (this._layer) {
|
|
297
|
+
await this._layer.when(() => {
|
|
298
|
+
const columnTemplates = this._getColumnTemplates(this._layer.id);
|
|
299
|
+
this._table.layer = this._layer;
|
|
300
|
+
this._table.tableTemplate.columnTemplates = columnTemplates;
|
|
301
|
+
this._table.view = this.mapView;
|
|
302
|
+
this._checkEditEnabled();
|
|
303
|
+
this._table.editingEnabled = this._editEnabled && this.enableInlineEdit;
|
|
304
|
+
});
|
|
305
|
+
await this._table.when(() => {
|
|
306
|
+
this._table.clearSelectionFilter();
|
|
307
|
+
});
|
|
308
|
+
this._showOnlySelected = false;
|
|
309
|
+
this._sortActive = false;
|
|
310
|
+
await this._sortTable();
|
|
311
|
+
}
|
|
312
|
+
else {
|
|
313
|
+
this._table.view = this.mapView;
|
|
314
|
+
this._table.layer = this._layer;
|
|
315
|
+
}
|
|
265
316
|
}
|
|
266
317
|
}
|
|
267
318
|
/**
|
|
@@ -282,11 +333,10 @@ export class LayerTable {
|
|
|
282
333
|
if (this._table && this._layer && !this._sortActive) {
|
|
283
334
|
if (!this._tableSorting && this.showNewestFirst) {
|
|
284
335
|
this._tableSorting = true;
|
|
285
|
-
await this._table.when(
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
});
|
|
336
|
+
await this._table.when();
|
|
337
|
+
await this._layer.when(() => {
|
|
338
|
+
this._table.sortColumn(this._layer.objectIdField, "desc");
|
|
339
|
+
this._tableSorting = false;
|
|
290
340
|
});
|
|
291
341
|
}
|
|
292
342
|
}
|
|
@@ -484,11 +534,12 @@ export class LayerTable {
|
|
|
484
534
|
* @returns a promise that will resolve when the operation is complete
|
|
485
535
|
*/
|
|
486
536
|
async _layerSelectionChanged(evt) {
|
|
537
|
+
var _a;
|
|
487
538
|
const id = evt.detail[0];
|
|
488
|
-
if (id !== this._layer.id || this._allIds.length === 0) {
|
|
539
|
+
if (id !== ((_a = this._layer) === null || _a === void 0 ? void 0 : _a.id) || this._allIds.length === 0) {
|
|
489
540
|
this._fetchingData = true;
|
|
490
541
|
const columnTemplates = this._getColumnTemplates(id);
|
|
491
|
-
this._layer = await
|
|
542
|
+
this._layer = await getLayerOrTable(this.mapView, id);
|
|
492
543
|
this._allIds = await queryAllIds(this._layer);
|
|
493
544
|
if (!this._table) {
|
|
494
545
|
await this._getTable(this._tableNode, columnTemplates);
|
|
@@ -623,6 +674,23 @@ export class LayerTable {
|
|
|
623
674
|
"text": "esri/views/View: https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html"
|
|
624
675
|
}
|
|
625
676
|
},
|
|
677
|
+
"onlyShowUpdatableLayers": {
|
|
678
|
+
"type": "boolean",
|
|
679
|
+
"mutable": false,
|
|
680
|
+
"complexType": {
|
|
681
|
+
"original": "boolean",
|
|
682
|
+
"resolved": "boolean",
|
|
683
|
+
"references": {}
|
|
684
|
+
},
|
|
685
|
+
"required": false,
|
|
686
|
+
"optional": false,
|
|
687
|
+
"docs": {
|
|
688
|
+
"tags": [],
|
|
689
|
+
"text": "boolean: When true only editable layers that support the update capability will be available"
|
|
690
|
+
},
|
|
691
|
+
"attribute": "only-show-updatable-layers",
|
|
692
|
+
"reflect": false
|
|
693
|
+
},
|
|
626
694
|
"showNewestFirst": {
|
|
627
695
|
"type": "boolean",
|
|
628
696
|
"mutable": false,
|
|
@@ -737,6 +805,18 @@ export class LayerTable {
|
|
|
737
805
|
"target": "window",
|
|
738
806
|
"capture": false,
|
|
739
807
|
"passive": false
|
|
808
|
+
}, {
|
|
809
|
+
"name": "editsComplete",
|
|
810
|
+
"method": "editsComplete",
|
|
811
|
+
"target": "window",
|
|
812
|
+
"capture": false,
|
|
813
|
+
"passive": false
|
|
814
|
+
}, {
|
|
815
|
+
"name": "noLayersFound",
|
|
816
|
+
"method": "noLayersFound",
|
|
817
|
+
"target": "window",
|
|
818
|
+
"capture": false,
|
|
819
|
+
"passive": false
|
|
740
820
|
}];
|
|
741
821
|
}
|
|
742
822
|
}
|