@esri/solutions-components 0.10.6 → 0.10.8

package/dist/components/layer-table2.js

@@ -57,6 +57,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         super();
         this.__registerHost();
         this.featureSelectionChange = createEvent(this, "featureSelectionChange", 7);
+        this.toggleFilter = createEvent(this, "toggleFilter", 7);
         this.defaultGlobalId = undefined;
         this.defaultLayerId = undefined;
         this.defaultOid = undefined;
@@ -76,6 +77,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         this.showNewestFirst = undefined;
         this.zoomAndScrollToSelected = undefined;
         this.zoomToScale = undefined;
+        this.createFilterModal = true;
         this._allIds = [];
         this._controlsThatFit = undefined;
         this._csvExporting = false;
@@ -327,7 +329,9 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
      */
     async mapInfoWatchHandler() {
         this._resetColumnTemplates();
-        this._initLayerExpressions();
+        if (this.createFilterModal) {
+            this._initLayerExpressions();
+        }
         this._initToolInfos();
         this._updateToolbar();
         await this._sortTable();
@@ -357,7 +361,9 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
             this._floorField = this._layer.floorInfo?.floorField;
             this._updateFloorDefinitionExpression();
             await this._resetTable();
-            this._initLayerExpressions();
+            if (this.createFilterModal) {
+                this._initLayerExpressions();
+            }
             this._updateShareUrl();
             this._fetchingData = false;
         });
@@ -381,6 +387,30 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
     //  Methods (public)
     //
     //--------------------------------------------------------------------------
+    /**
+     * Reset the filter
+     */
+    async filterReset() {
+        void this._handleFilterListReset();
+    }
+    /**
+     * Updates the filter
+     */
+    async filterUpdate() {
+        this._handleFilterUpdate();
+    }
+    /**
+     * Closes the filter
+     */
+    async closeFilter() {
+        await this._closeFilter();
+    }
+    /**
+     * refresh the feature table
+     */
+    async refresh() {
+        await this._refresh();
+    }
     //--------------------------------------------------------------------------
     //
     //  Events (public)
@@ -390,6 +420,10 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
      * Emitted on demand when a layer is selected
      */
     featureSelectionChange;
+    /**
+     * Emitted on demand when filter action is clicked
+     */
+    toggleFilter;
     /**
      * Scroll and zoom to the selected feature from the Features widget.
      *
@@ -421,6 +455,14 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
             }
         }
     }
+    /**
+   * Handles layer selection change to show new table
+   *
+   * @param evt CustomEvent the id for the current layer
+   */
+    async layerSelectionChange(evt) {
+        await this._layerSelectionChanged(evt);
+    }
     /**
      * Refresh the table when edits are completed
      */
@@ -488,9 +530,9 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         const selected = this.selectedIds.length.toString();
         const tableHeightClass = this.isMobile ? "height-full" : "height-full-adjusted";
         this._validateActiveActions();
-        return (h(Host, { key: '547a08c45cc3a0b0bdb5ab841ee202d2d43018dc' }, h("calcite-shell", { key: '7ac39e863586727df7685eb5c3faffd87c46bf9d' }, this._getTableControlRow("header"), h("div", { key: '322dc4820b17365f3f202ce43d85330d25081eb5', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: '764955f3cf9371a5ff554821613fffbc9e0bd705', class: "height-full width-full" }, h("calcite-loader", { key: '031fc6520de11b166111626501f0208f1b69c9ff', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: '8d62258ee356fdf6bc6c03f88848a32270ce5eed', class: tableNodeClass, ref: this.onTableNodeCreate })), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
+        return (h(Host, { key: '17071727cb283d84afb8beab8382bd3623f35920' }, h("calcite-shell", { key: 'f8508d67fd4b100fdc3f52b7db63194714cf216b' }, this._getTableControlRow("header"), h("div", { key: '5c1ebcb0530764a9568dc5dae153632a3d9491c8', class: `width-full ${tableHeightClass}` }, h("calcite-panel", { key: '7a6420894e4e50e2b4cda6e5ebe043134f4c0397', class: "height-full width-full" }, h("calcite-loader", { key: '48d4fe7e27fae877ca0e4caa22555968636f6c33', class: loadingClass, label: this._translations.fetchingData, scale: "l" }), h("div", { key: 'cce71356e8ca141d1a18b32944d4fa03af8aae33', class: tableNodeClass, ref: this.onTableNodeCreate })), !this.isMobile ? (h("div", { class: "bottom-left text-color height-19" }, this._translations.recordsSelected
             .replace("{{total}}", total)
-            .replace("{{selected}}", selected))) : undefined)), this._filterModal()));
+            .replace("{{selected}}", selected))) : undefined)), this.createFilterModal && this._filterModal()));
     }
     /**
      * Called once after the component is loaded
@@ -559,7 +601,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
     _getActionBar() {
         const containerClass = this.isMobile ? "width-full" : "";
         const mobileClass = this.isMobile ? "border-top" : "";
-        return (h("calcite-action-bar", { class: containerClass, expandDisabled: true, expanded: true, id: this._getId("bar"), layout: "horizontal" }, h("div", { class: `border-end ${containerClass} ${mobileClass}`, id: "solutions-map-layer-picker-container" }, h("map-layer-picker", { appearance: "transparent", defaultLayerId: this.defaultLayerId, display: "inline-flex", height: 50, isMobile: this.isMobile, mapView: this.mapView, onLayerSelectionChange: (evt) => void this._layerSelectionChanged(evt), onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, placeholderIcon: "layers", scale: "l", showSingleLayerAsLabel: true, showTables: true, type: "dropdown" })), !this.isMobile ? this._getActions() : undefined));
+        return (h("calcite-action-bar", { class: containerClass, expandDisabled: true, expanded: true, id: this._getId("bar"), layout: "horizontal" }, h("div", { class: `border-end ${containerClass} ${mobileClass}`, id: "solutions-map-layer-picker-container" }, h("map-layer-picker", { appearance: "transparent", defaultLayerId: this.defaultLayerId, display: "inline-flex", height: 50, isMobile: this.isMobile, mapView: this.mapView, onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, placeholderIcon: "layers", scale: "l", selectedIds: this._layer ? [this._layer?.id] : [], showSingleLayerAsLabel: true, showTables: true, type: "dropdown" })), !this.isMobile ? this._getActions() : undefined));
     }
     /**
      * Get the actions that are used for various interactions with the table
@@ -604,15 +646,19 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
      */
     _validateEnabledActions() {
         const featuresSelected = this._featuresSelected();
+        const showMultipleEdits = this.selectedIds.length > 1 && this._layer?.capabilities?.operations?.supportsUpdate;
         const selectionDependant = [
             "zoom-to-object",
+            "pencil",
             "trash",
             "erase",
             "selected-items-filter"
         ];
         this._toolInfos?.forEach(ti => {
             if (ti && selectionDependant.indexOf(ti.icon) > -1) {
-                ti.disabled = !featuresSelected;
+                // disable the pencil icon if multiple features are not selected
+                // For other icons disable them if any feature is not selected
+                ti.disabled = ti.icon === "pencil" ? !showMultipleEdits : !featuresSelected;
             }
         });
     }
@@ -646,6 +692,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
      */
     _initToolInfos() {
         const featuresSelected = this._featuresSelected();
+        const showMultipleEdits = this.selectedIds.length > 1 && this._layer?.capabilities?.operations?.supportsUpdate;
         const featuresEmpty = this._featuresEmpty();
         const hasFilterExpressions = this._hasFilterExpressions();
         if (this._translations) {
@@ -664,10 +711,20 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
                     icon: "filter",
                     indicator: false,
                     label: this._translations.filters,
-                    func: () => this._toggleFilter(),
+                    func: () => this.createFilterModal ? this._toggleFilter() : this.toggleFilter.emit(),
                     disabled: false,
                     isOverflow: false
                 } : undefined,
+                !this.mapHidden ? {
+                    active: false,
+                    icon: "pencil",
+                    indicator: false,
+                    label: this._translations.editMultiple,
+                    func: () => alert(this._translations.editMultiple),
+                    disabled: !showMultipleEdits,
+                    isOverflow: false,
+                    isSublist: false
+                } : undefined,
                 this._deleteEnabled ? {
                     active: undefined,
                     icon: "trash",
@@ -852,7 +909,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
     _setControlsThatFit(controlsThatFit, skipControls) {
         let update = JSON.stringify(controlsThatFit) !== JSON.stringify(this._controlsThatFit);
         const actionbar = document.getElementById("solutions-action-bar");
-        actionbar.childNodes.forEach((n) => {
+        actionbar?.childNodes?.forEach((n) => {
             if (skipControls.indexOf(n.id) < 0 && !update) {
                 update = this._controlsThatFit.map(c => c.id).indexOf(n.id) < 0;
             }
@@ -1721,6 +1778,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         "showNewestFirst": [4, "show-newest-first"],
         "zoomAndScrollToSelected": [4, "zoom-and-scroll-to-selected"],
         "zoomToScale": [2, "zoom-to-scale"],
+        "createFilterModal": [4, "create-filter-modal"],
         "_allIds": [32],
         "_controlsThatFit": [32],
         "_csvExporting": [32],
@@ -1732,8 +1790,12 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
         "_showHideOpen": [32],
         "_showOnlySelected": [32],
         "_toolInfos": [32],
-        "_translations": [32]
-    }, [[8, "selectionChanged", "selectionChanged"], [8, "editsComplete", "editsComplete"], [8, "facilityChanged", "facilityChanged"], [8, "levelChanged", "levelChanged"], [8, "siteChanged", "siteChanged"], [8, "noLayersFound", "noLayersFound"]], {
+        "_translations": [32],
+        "filterReset": [64],
+        "filterUpdate": [64],
+        "closeFilter": [64],
+        "refresh": [64]
+    }, [[8, "selectionChanged", "selectionChanged"], [8, "layerSelectionChange", "layerSelectionChange"], [8, "editsComplete", "editsComplete"], [8, "facilityChanged", "facilityChanged"], [8, "levelChanged", "levelChanged"], [8, "siteChanged", "siteChanged"], [8, "noLayersFound", "noLayersFound"]], {
         "defaultOid": ["defaultOidWatchHandler"],
         "defaultGlobalId": ["defaultGlobalIdWatchHandler"],
         "enableCSV": ["enableCSVWatchHandler"],