@esri/solutions-components 0.7.7 → 0.7.9

package/dist/cjs/{utils-41eb3a01.js → utils-35b31785.js}

@@ -5,7 +5,7 @@
  */
 'use strict';
 
-const locale = require('./locale-56c3447b.js');
+const locale = require('./locale-9b9d0e94.js');
 const index = require('./index-22bb61da.js');
 
 exports.EInputType = void 0;

package/dist/collection/components/crowdsource-manager/crowdsource-manager.css

@@ -17,7 +17,7 @@
 :host {
   display: block;
   --calcite-label-margin-bottom: 0px;
-  --solutions-theme-foreground-color: var(--calcite-ui-foreground-1);
+  --solutions-theme-foreground-color: var(--calcite-color-foreground-1);
 }
 
 .padding-1-2 {
@@ -78,16 +78,16 @@
 }
 
 .border {
-  border: 1px solid var(--calcite-ui-border-3);
+  border: 1px solid var(--calcite-color-border-3);
 }
 
 .border-bottom {
-  border-bottom: 1px solid var(--calcite-ui-border-3);
+  border-bottom: 1px solid var(--calcite-color-border-3);
 }
 
 .border-sides {
-  border-left: 1px solid var(--calcite-ui-border-3);
-  border-right: 1px solid var(--calcite-ui-border-3);
+  border-left: 1px solid var(--calcite-color-border-3);
+  border-right: 1px solid var(--calcite-color-border-3);
 }
 
 .position-relative {

package/dist/collection/components/crowdsource-manager/crowdsource-manager.js

@@ -62,6 +62,7 @@ export class CrowdsourceManager {
         this._layoutMode = ELayoutMode.GRID;
         this._mapView = undefined;
         this._panelOpen = true;
+        this._tableOnly = false;
     }
     //--------------------------------------------------------------------------
     //
@@ -111,6 +112,16 @@ export class CrowdsourceManager {
     //  Events (public)
     //
     //--------------------------------------------------------------------------
+    /**
+     * Listen for idsFound event to be fired so we can know that all layer ids have been fetched
+     */
+    async idsFound(evt) {
+        const ids = evt.detail;
+        this._tableOnly = ids.tableIds.length > 0 && ids.layerIds.length === 0;
+        if (this._tableOnly) {
+            this._expandPopup = true;
+        }
+    }
     /**
      * Listen for layoutChanged event to be fired so we can adjust the layout
      */
@@ -308,7 +319,7 @@ export class CrowdsourceManager {
         const tooltip = this._expandPopup ? this._translations.collapsePopup : this._translations.expandPopup;
         const themeClass = this.theme === "dark" ? "calcite-mode-dark" : "calcite-mode-light";
         const popupNodeClass = !this._expandPopup ? "height-full" : ((_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.length) === 1 ? "position-absolute-0" : "position-absolute-50";
-        return (h("div", { class: "calcite-mode-dark " + popupNodeClass }, h("calcite-panel", null, h("div", { class: "display-flex align-items-center", slot: "header-content" }, h("calcite-icon", { icon: "information", scale: "s" }), h("div", { class: "padding-inline-start-75" }, this._translations.information)), h("calcite-action", { icon: icon, id: id, onClick: () => this._togglePopup(), slot: "header-actions-end", text: "" }), h("calcite-tooltip", { class: themeClass, label: "", placement: "bottom", "reference-element": id }, h("span", null, tooltip)), this._getCardNode())));
+        return (h("div", { class: "calcite-mode-dark " + popupNodeClass }, h("calcite-panel", null, h("div", { class: "display-flex align-items-center", slot: "header-content" }, h("calcite-icon", { icon: "information", scale: "s" }), h("div", { class: "padding-inline-start-75" }, this._translations.information)), h("calcite-action", { disabled: this._tableOnly, icon: icon, id: id, onClick: () => this._togglePopup(), slot: "header-actions-end", text: "" }), !this._tableOnly ? h("calcite-tooltip", { class: themeClass, label: "", placement: "bottom", "reference-element": id }, h("span", null, tooltip)) : undefined, this._getCardNode())));
     }
     /**
      * Toggle the popup information
@@ -982,7 +993,8 @@ export class CrowdsourceManager {
             "_translations": {},
             "_layoutMode": {},
             "_mapView": {},
-            "_panelOpen": {}
+            "_panelOpen": {},
+            "_tableOnly": {}
         };
     }
     static get elementRef() { return "el"; }
@@ -1006,6 +1018,12 @@ export class CrowdsourceManager {
     }
     static get listeners() {
         return [{
+                "name": "idsFound",
+                "method": "idsFound",
+                "target": "window",
+                "capture": false,
+                "passive": false
+            }, {
                 "name": "layoutChanged",
                 "method": "layoutChanged",
                 "target": "window",

package/dist/collection/components/edit-card/edit-card.css

@@ -35,7 +35,7 @@
 }
 
 #feature-form {
-  --calcite-ui-background: none;
+  --calcite-color-background: none;
   padding-top: 0px;
 }
 
@@ -50,11 +50,11 @@
 .esri-editor__prompt--danger {
   position: relative !important;
   width: 100% !important;
-  background-color: var(--calcite-ui-foreground-1) !important;
+  background-color: var(--calcite-color-foreground-1) !important;
 }
 
 .esri-feature__content-node {
-  background-color: var(--calcite-ui-foreground-1) !important;
+  background-color: var(--calcite-color-foreground-1) !important;
 }
 
 .esri-editor__panel-toolbar {

package/dist/collection/components/info-card/info-card.css

@@ -50,7 +50,7 @@
 }
 
 .top-border {
-  border-top: 1px solid var(--calcite-ui-border-1);
+  border-top: 1px solid var(--calcite-color-border-1);
 }
 
 .min-width-100 {
@@ -63,6 +63,6 @@
 
 .esri-features__container {
   padding: 0.5rem !important;
-  background-color: var(--calcite-ui-foreground-1) !important;
+  background-color: var(--calcite-color-foreground-1) !important;
   height: 100% !important;
 }

package/dist/collection/components/json-editor/json-editor.css

@@ -15,126 +15,6 @@
 */
 :host {
   display: block;
-  box-sizing: border-box;
-  margin-left: 0.75rem;
-  margin-right: 0.75rem;
-  min-width: 0;
-  flex-grow: 0;
-  flex-shrink: 1;
-}
-:host-group-1-up > .block {
-  flex-basis: calc(100% - 1.5rem);
-  width: calc(100% - 1.5rem);
-}
-:host-group-2-up > .block {
-  flex-basis: calc(50% - 1.5rem);
-  width: calc(50% - 1.5rem);
-}
-:host-group-3-up > .block {
-  flex-basis: calc(33.33333% - 1.5rem);
-  width: calc(33.33333% - 1.5rem);
-}
-:host-group-4-up > .block {
-  flex-basis: calc(25% - 1.5rem);
-  width: calc(25% - 1.5rem);
-}
-:host-group-5-up > .block {
-  flex-basis: calc(20% - 1.5rem);
-  width: calc(20% - 1.5rem);
-}
-:host-group-6-up > .block {
-  flex-basis: calc(16.66666% - 1.5rem);
-  width: calc(16.66666% - 1.5rem);
-}
-:host-group-7-up > .block {
-  flex-basis: calc(14.2857% - 1.5rem);
-  width: calc(14.2857% - 1.5rem);
-}
-:host-group-8-up > .block {
-  flex-basis: calc(12.5% - 1.5rem);
-  width: calc(12.5% - 1.5rem);
-}
-.tablet-block-group-1-up > :host {
-    flex-basis: calc(100% - 1.5rem);
-    width: calc(100% - 1.5rem);
-  }
-.tablet-block-group-2-up > :host {
-    flex-basis: calc(50% - 1.5rem);
-    width: calc(50% - 1.5rem);
-  }
-.tablet-block-group-3-up > :host {
-    flex-basis: calc(33.33333% - 1.5rem);
-    width: calc(33.33333% - 1.5rem);
-  }
-.tablet-block-group-4-up > :host {
-    flex-basis: calc(25% - 1.5rem);
-    width: calc(25% - 1.5rem);
-  }
-.tablet-block-group-5-up > :host {
-    flex-basis: calc(20% - 1.5rem);
-    width: calc(20% - 1.5rem);
-  }
-.tablet-block-group-6-up > :host {
-    flex-basis: calc(16.66666% - 1.5rem);
-    width: calc(16.66666% - 1.5rem);
-  }
-.tablet-block-group-7-up > :host {
-    flex-basis: calc(14.2857% - 1.5rem);
-    width: calc(14.2857% - 1.5rem);
-  }
-.tablet-block-group-8-up > :host {
-    flex-basis: calc(12.5% - 1.5rem);
-    width: calc(12.5% - 1.5rem);
-  }
-.phone-block-group-1-up > :host {
-    flex-basis: calc(100% - 1.5rem);
-    width: calc(100% - 1.5rem);
-  }
-.phone-block-group-2-up > :host {
-    flex-basis: calc(50% - 1.5rem);
-    width: calc(50% - 1.5rem);
-  }
-.phone-block-group-3-up > :host {
-    flex-basis: calc(33.33333% - 1.5rem);
-    width: calc(33.33333% - 1.5rem);
-  }
-.phone-block-group-4-up > :host {
-    flex-basis: calc(25% - 1.5rem);
-    width: calc(25% - 1.5rem);
-  }
-.phone-block-group-5-up > :host {
-    flex-basis: calc(20% - 1.5rem);
-    width: calc(20% - 1.5rem);
-  }
-.phone-block-group-6-up > :host {
-    flex-basis: calc(16.66666% - 1.5rem);
-    width: calc(16.66666% - 1.5rem);
-  }
-.phone-block-group-7-up > :host {
-    flex-basis: calc(14.2857% - 1.5rem);
-    width: calc(14.2857% - 1.5rem);
-  }
-.phone-block-group-8-up > :host {
-    flex-basis: calc(12.5% - 1.5rem);
-    width: calc(12.5% - 1.5rem);
-  }
-.code-face :host {
-  letter-spacing: 0em;
-  font-family: "Consolas", "Andale Mono", "Lucida Console", "Monaco", monospace;
-  font-weight: 400;
-  font-style: normal;
-}
-.code-face :host b, .code-face :host strong {
-  font-weight: 400;
-}
-.code-italic :host {
-  letter-spacing: 0em;
-  font-family: "Consolas", "Andale Mono", "Lucida Console", "Monaco", monospace;
-  font-weight: 400;
-  font-style: italic;
-}
-.code-italic :host b, .code-italic :host strong {
-  font-weight: 400;
 }
 
 .editor-container {
@@ -229,8 +109,8 @@ html[dir=rtl] .editor-buttons {
   margin: 0px;
   height: 100%;
   width: 100%;
-  padding: 0px;
   overflow: hidden;
+  padding: 0px;
   max-height: 100% !important;
 }
 
@@ -241,8 +121,8 @@ html[dir=rtl] .editor-buttons {
   margin: 0px;
   height: 100%;
   width: 50%;
-  padding: 0px;
   overflow: hidden;
+  padding: 0px;
   max-height: 100% !important;
 }
 
@@ -253,7 +133,7 @@ html[dir=rtl] .editor-buttons {
   margin: 0px;
   height: 100%;
   width: 50%;
-  padding: 0px;
   overflow: hidden;
+  padding: 0px;
   max-height: 100% !important;
 }

package/dist/collection/components/layer-table/layer-table.css

@@ -35,15 +35,15 @@
 }
 
 .table-border {
-  border: 1px solid var(--calcite-ui-border-2);
+  border: 1px solid var(--calcite-color-border-2);
 }
 
 .border-end {
-  border-inline-end: 1px solid var(--calcite-ui-border-2);
+  border-inline-end: 1px solid var(--calcite-color-border-2);
 }
 
 .border-bottom {
-  border-bottom: 1px solid var(--calcite-ui-border-2);
+  border-bottom: 1px solid var(--calcite-color-border-2);
 }
 
 .padding-5 {
@@ -81,11 +81,11 @@ html[dir="rtl"] .bottom-left {
 }
 
 .background {
-  background-color: var(--calcite-ui-background);
+  background-color: var(--calcite-color-background);
 }
 
 .text-color {
-  color: var(--calcite-ui-text-1);
+  color: var(--calcite-color-text-1);
 }
 
 .align-center {
@@ -93,7 +93,7 @@ html[dir="rtl"] .bottom-left {
 }
 
 .danger-color {
-  color: var(--calcite-ui-danger);
+  color: var(--calcite-color-status-danger);
 }
 
 .esri-feature-table vaadin-grid {
@@ -101,16 +101,13 @@ html[dir="rtl"] .bottom-left {
 }
 
 vaadin-grid-cell-content {
-  padding: var(--lumo-space-xs) var(--lumo-space-m) !important;
   font-size: 14px !important;
+  color: var(--calcite-color-text-3) !important;
 }
 
 .share-action {
   position: absolute;
   right: 0;
-  margin-top: 4px;
-  margin-inline-end: 4px;
-  margin-bottom: 4px;
 }
 
 html[dir="rtl"] .share-action {
@@ -122,11 +119,11 @@ html[dir="rtl"] .share-action {
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
-  opacity: var(--calcite-ui-opacity-disabled);
+  opacity: var(--calcite-opacity-disabled);
   pointer-events: none;
 }
 
 .instant-app-share {
-  height: 42px !important;
+  height: 50px !important;
   display: inline-flex;
 }

package/dist/collection/components/layer-table/layer-table.js

@@ -297,7 +297,7 @@ export class LayerTable {
      * @returns The dom node that contains the controls
      */
     _getActionBar() {
-        return (h("calcite-action-bar", { expandDisabled: true, expanded: true, id: this._getId("bar"), layout: "horizontal" }, h("div", { class: "border-end", id: "solutions-map-layer-picker-container" }, h("map-layer-picker", { appearance: "transparent", defaultLayerId: this.defaultLayerId, mapView: this.mapView, onLayerSelectionChange: (evt) => this._layerSelectionChanged(evt), onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, placeholderIcon: "layers", scale: "l", showSingleLayerAsLabel: true, showTables: true, type: "dropdown" })), this._getActions()));
+        return (h("calcite-action-bar", { expandDisabled: true, expanded: true, id: this._getId("bar"), layout: "horizontal" }, h("div", { class: "border-end", id: "solutions-map-layer-picker-container" }, h("map-layer-picker", { appearance: "transparent", defaultLayerId: this.defaultLayerId, display: "inline-flex", height: 50, mapView: this.mapView, onLayerSelectionChange: (evt) => this._layerSelectionChanged(evt), onlyShowUpdatableLayers: this.onlyShowUpdatableLayers, placeholderIcon: "layers", scale: "l", showSingleLayerAsLabel: true, showTables: true, type: "dropdown" })), this._getActions()));
     }
     /**
      * Get the actions that are used for various interactions with the table
@@ -630,7 +630,7 @@ export class LayerTable {
      * @returns VNode The node representing the DOM element that will contain the action
      */
     _getShare(icon) {
-        return (h("div", { class: "share-action", id: this._getId(icon) }, h("instant-apps-social-share", { autoUpdateShareUrl: false, class: "instant-app-share", embed: this.shareIncludeEmbed, popoverButtonIconScale: "s", ref: el => this._shareNode = el, scale: "m", shareButtonColor: "neutral", socialMedia: this.shareIncludeSocial, view: this.mapView }), this._getToolTip("bottom", icon, this._translations.share)));
+        return (h("div", { class: "share-action", id: this._getId(icon) }, h("instant-apps-social-share", { autoUpdateShareUrl: false, class: "instant-app-share", embed: this.shareIncludeEmbed, popoverButtonIconScale: "s", ref: el => this._shareNode = el, scale: "m", shareButtonColor: "neutral", shareButtonType: "action", socialMedia: this.shareIncludeSocial, view: this.mapView }), this._getToolTip("bottom", icon, this._translations.share)));
     }
     /**
      * Called each time the values that are used for custom url params change
@@ -1009,9 +1009,9 @@ export class LayerTable {
      * @returns void
      */
     _initLayerExpressions() {
-        var _a;
-        const layerExpressions = (_a = this.mapInfo.filterConfig) === null || _a === void 0 ? void 0 : _a.layerExpressions;
-        this._layerExpressions = layerExpressions.filter((exp) => exp.id === this._layer.id);
+        var _a, _b;
+        const layerExpressions = (_b = (_a = this.mapInfo) === null || _a === void 0 ? void 0 : _a.filterConfig) === null || _b === void 0 ? void 0 : _b.layerExpressions;
+        this._layerExpressions = layerExpressions ? layerExpressions.filter((exp) => exp.id === this._layer.id) : [];
     }
     /**
      * Select all rows that are not currently selectd
@@ -1114,6 +1114,7 @@ export class LayerTable {
                 fieldInfos.some(fieldInfo => {
                     if (fieldInfo.name === columnTemplate.fieldName) {
                         columnTemplate.label = fieldInfo.alias;
+                        columnTemplate.menuConfig = this._getMenuConfig(fieldInfo.name);
                         return true;
                     }
                 });
@@ -1122,12 +1123,48 @@ export class LayerTable {
                 return {
                     type: "field",
                     fieldName: fieldInfo.name,
-                    label: fieldInfo.alias
+                    label: fieldInfo.alias,
+                    menuConfig: this._getMenuConfig(fieldInfo.name)
                 };
             });
         }
         return columnTemplates;
     }
+    /**
+     * Get the menu config that adds the ability to hide the current column
+     *
+     * @returns void
+     * @protected
+     */
+    _getMenuConfig(name) {
+        return {
+            items: [
+                {
+                    label: this._translations.hideField,
+                    iconClass: "esri-icon-non-visible",
+                    autoCloseMenu: true,
+                    clickFunction: () => {
+                        this._handleHideClick(name);
+                    }
+                }
+            ]
+        };
+    }
+    /**
+     * Hide the table column for the provided name
+     *
+     * @returns void
+     * @protected
+     */
+    _handleHideClick(name) {
+        this._columnsInfo[name] = false;
+        this._table.hideColumn(name);
+        this._table.tableTemplate.columnTemplates.forEach((columnTemplate) => {
+            if (columnTemplate.fieldName === name) {
+                columnTemplate.visible = false;
+            }
+        });
+    }
     /**
      * Fetches the component's translations
      *

package/dist/collection/components/layout-manager/layout-manager.css

@@ -1,73 +1,73 @@
-/** @license
- * Copyright 2023 Esri
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *    http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-:host {
-  display: block;
-}
-
-.action-center {
-  -webkit-box-align: center;
-  -webkit-align-items: center;
-  -ms-grid-row-align: center;
-  align-items: center;
-  align-content: center;
-  justify-content: center;
-}
-
-.display-flex {
-  display: flex;
-}
-
-.icon-color {
-  --calcite-ui-icon-color: var(--calcite-ui-brand);
-}
-
-.icon {
-  cursor: pointer;
-}
-
-.tooltip-message {
-  padding: 5px 8px;
-  font-weight: var(--calcite-font-weight-normal);
-  color: var(--calcite-ui-text-2);
-}
-
-.header-text {
-  font-size: var(--calcite-font-size-0);
-  font-weight: var(--calcite-font-weight-medium);
-  padding-inline: 0.75rem;
-  padding-block: 0.875rem;
-  line-height: 1.25rem;
-}
-
-.img-background {
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  width: 38px;
-  height: 26px;
-}
-
-.grid-background {
-  background-image: url('../../assets/data/images/grid.png');
-}
-
-.horizontal-background {
-  background-image: url('../../assets/data/images/horizontal.png');
-}
-
-.vertical-background {
-  background-image: url('../../assets/data/images/vertical.png');
-}
+/** @license
+ * Copyright 2023 Esri
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *    http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+:host {
+  display: block;
+}
+
+.action-center {
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-grid-row-align: center;
+  align-items: center;
+  align-content: center;
+  justify-content: center;
+}
+
+.display-flex {
+  display: flex;
+}
+
+.icon-color {
+  --calcite-color-icon-color: var(--calcite-color-brand);
+}
+
+.icon {
+  cursor: pointer;
+}
+
+.tooltip-message {
+  padding: 5px 8px;
+  font-weight: var(--calcite-font-weight-normal);
+  color: var(--calcite-color-text-2);
+}
+
+.header-text {
+  font-size: var(--calcite-font-size-0);
+  font-weight: var(--calcite-font-weight-medium);
+  padding-inline: 0.75rem;
+  padding-block: 0.875rem;
+  line-height: 1.25rem;
+}
+
+.img-background {
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  width: 38px;
+  height: 26px;
+}
+
+.grid-background {
+  background-image: url('../../assets/data/images/grid.png');
+}
+
+.horizontal-background {
+  background-image: url('../../assets/data/images/horizontal.png');
+}
+
+.vertical-background {
+  background-image: url('../../assets/data/images/vertical.png');
+}

package/dist/collection/components/map-draw-tools/map-draw-tools.css

@@ -19,7 +19,7 @@
 }
 
 .border {
-  outline: 1px solid var(--calcite-ui-border-input);
+  outline: 1px solid var(--calcite-color-border-input);
 }
 
 .div-visible {

package/dist/collection/components/map-layer-picker/map-layer-picker.css

@@ -20,14 +20,13 @@
 
 .map-layer-picker-container {
   width: 100%;
-  height: 100%;
+  align-items: center;
 }
 
 .map-layer-picker {
   position: relative;
   width: 100%;
   display: inline-block;
-  height: 100%;
 }
 
 .padding-bottom-1 {
@@ -52,7 +51,7 @@
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
-  opacity: var(--calcite-ui-opacity-disabled);
+  opacity: var(--calcite-opacity-disabled);
   pointer-events: none;
 }
 
@@ -71,3 +70,7 @@
 .padding-start-1 {
   padding-inline-start: 1rem;
 }
+
+.cursor-default {
+  cursor: default;
+}