@esri/solutions-components 0.7.27 → 0.7.28

Sign up to get free protection for your applications and to get access to all the features.
Files changed (28) hide show
  1. package/dist/cjs/calcite-alert_4.cjs.entry.js +12 -3
  2. package/dist/cjs/calcite-combobox_6.cjs.entry.js +1 -1
  3. package/dist/cjs/card-manager_3.cjs.entry.js +1 -0
  4. package/dist/cjs/crowdsource-manager.cjs.entry.js +12 -8
  5. package/dist/collection/components/crowdsource-manager/crowdsource-manager.css +8 -0
  6. package/dist/collection/components/crowdsource-manager/crowdsource-manager.js +11 -7
  7. package/dist/collection/components/info-card/info-card.css +4 -4
  8. package/dist/collection/components/info-card/info-card.js +11 -2
  9. package/dist/collection/components/layer-table/layer-table.js +1 -0
  10. package/dist/collection/components/map-layer-picker/map-layer-picker.js +1 -1
  11. package/dist/components/crowdsource-manager.js +12 -8
  12. package/dist/components/info-card2.js +12 -3
  13. package/dist/components/layer-table2.js +1 -0
  14. package/dist/components/map-layer-picker2.js +1 -1
  15. package/dist/esm/calcite-alert_4.entry.js +12 -3
  16. package/dist/esm/calcite-combobox_6.entry.js +1 -1
  17. package/dist/esm/card-manager_3.entry.js +1 -0
  18. package/dist/esm/crowdsource-manager.entry.js +12 -8
  19. package/dist/solutions-components/{p-dded59a7.entry.js → p-12de822a.entry.js} +1 -1
  20. package/dist/solutions-components/p-5c22e9f4.entry.js +6 -0
  21. package/dist/solutions-components/{p-934cbe40.entry.js → p-643e7ee1.entry.js} +1 -1
  22. package/dist/solutions-components/p-dbe62aaf.entry.js +6 -0
  23. package/dist/solutions-components/solutions-components.esm.js +1 -1
  24. package/dist/types/components/crowdsource-manager/crowdsource-manager.d.ts +4 -2
  25. package/dist/types/components/info-card/info-card.d.ts +9 -1
  26. package/package.json +1 -1
  27. package/dist/solutions-components/p-8308f64c.entry.js +0 -6
  28. package/dist/solutions-components/p-9549b5b1.entry.js +0 -6
@@ -654,7 +654,7 @@ const EditCard = class {
654
654
  };
655
655
  EditCard.style = editCardCss;
656
656
 
657
- const infoCardCss = ":host{display:block;--calcite-label-margin-bottom:0}.padding-1-2{padding:0.5rem}.display-none{display:none !important}.display-flex{display:flex}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.esri-features__footer{display:none !important}.button-container{justify-content:space-between;align-items:center}.top-border{border-top:1px solid var(--calcite-color-border-1)}.min-width-100{min-width:100px}.width-100{width:100%}.esri-features__container{padding:0.5rem !important;background-color:var(--calcite-color-foreground-1) !important;height:100% !important}.overflow-hidden{overflow:hidden}.height-40{height:40px}.padding-top-46{padding-top:46px}.end-border{border-inline-end:1px solid var(--calcite-color-border-1)}.font-bold{font-weight:bold}.visibility-hidden{visibility:hidden;height:0px}.padding-inline-start-1{padding-inline-start:1rem}";
657
+ const infoCardCss = ":host{display:block;--calcite-label-margin-bottom:0}.padding-1-2{padding:0.5rem}.display-none{display:none !important}.display-flex{display:flex}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.esri-features__footer{display:none !important}.button-container{justify-content:space-between;align-items:center}.top-border{border-top:1px solid var(--calcite-color-border-1)}.min-width-100{min-width:100px}.width-100{width:100%}.esri-features__container{padding:0.5rem !important;background-color:var(--calcite-color-foreground-1) !important;height:100% !important}.overflow-hidden{overflow:hidden}.height-40{height:40px}.end-border{border-inline-end:1px solid var(--calcite-color-border-1)}.font-bold{font-weight:bold}.visibility-hidden{visibility:hidden;height:0px}.padding-inline-start-1{padding-inline-start:1rem}.border-width-0{border-width:0px}";
658
658
 
659
659
  const InfoCard = class {
660
660
  constructor(hostRef) {
@@ -773,11 +773,10 @@ const InfoCard = class {
773
773
  const editButtonClass = (!this.isLoading && this._editRecordOpen) || this._showListView ? "display-none" : "";
774
774
  const nextBackDisabled = ((_b = (_a = this._features) === null || _a === void 0 ? void 0 : _a.features) === null || _b === void 0 ? void 0 : _b.length) < 2;
775
775
  const nextBackClass = this.isMobile ? "display-none" : "";
776
- const shellClass = this.isMobile && !this._editRecordOpen ? "padding-top-46" : "";
777
776
  const id = (_d = (_c = this._features) === null || _c === void 0 ? void 0 : _c.selectedFeature) === null || _d === void 0 ? void 0 : _d.getObjectId();
778
777
  const ids = parseInt(id === null || id === void 0 ? void 0 : id.toString(), 10) > -1 ? [id] : [];
779
778
  const deleteEnabled = ((_e = this._layer) === null || _e === void 0 ? void 0 : _e.editingEnabled) && ((_h = (_g = (_f = this._layer) === null || _f === void 0 ? void 0 : _f.capabilities) === null || _g === void 0 ? void 0 : _g.operations) === null || _h === void 0 ? void 0 : _h.supportsDelete);
780
- return (index.h(index.Host, null, this.isMobile && !this._editRecordOpen ? (index.h("calcite-panel", null, index.h("calcite-action", { class: "end-border", icon: "chevron-left", iconFlipRtl: true, onClick: () => this._closePopup(), scale: "s", slot: "header-actions-start", text: "" }), index.h("span", { class: "font-bold", slot: "header-content" }, this._mobileTitle))) : undefined, index.h("calcite-shell", { class: shellClass }, index.h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), index.h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), index.h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
779
+ return (index.h(index.Host, null, index.h("calcite-shell", null, this._getHeader(), index.h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), index.h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), index.h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
781
780
  index.h("div", { class: "display-flex top-border padding-1-2" }, index.h("calcite-button", { appearance: "solid", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), this.isMobile && deleteEnabled ? (index.h("delete-button", { class: "padding-inline-start-1 width-100", id: "solutions-delete", ids: ids, layer: this._layer, onEditsComplete: () => this._closePopup() })) : undefined, index.h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-edit" }, index.h("span", null, this._translations.edit)), this.isMobile ? (index.h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-delete" }, index.h("span", null, this._translations.delete))) : undefined), !nextBackDisabled && index.h("div", { class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, index.h("div", { class: "min-width-100" }, index.h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-back", onClick: () => this._back(), width: "full" }, this._translations.back), index.h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-back" }, index.h("span", null, this._translations.back))), index.h("div", null, index.h("calcite-action", { icon: "list", onClick: () => this._toggleListView(), scale: "s", text: this._count, textEnabled: true })), index.h("div", { class: "min-width-100" }, index.h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-next", onClick: () => this._next(), width: "full" }, this._translations.next), index.h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-next" }, index.h("span", null, this._translations.next))))), index.h("edit-card", { class: editClass, graphicIndex: (_j = this._features) === null || _j === void 0 ? void 0 : _j.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), index.h("calcite-alert", { icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, index.h("div", { slot: "title" }, this._translations.editDisabled), index.h("div", { slot: "message" }, this._translations.enableEditing)))));
782
781
  }
783
782
  //--------------------------------------------------------------------------
@@ -865,6 +864,16 @@ const InfoCard = class {
865
864
  }
866
865
  })) : Promise.resolve();
867
866
  }
867
+ /**
868
+ * Get the mobile header
869
+ *
870
+ * @returns the header node to display when in mobile mode
871
+ *
872
+ * @protected
873
+ */
874
+ _getHeader() {
875
+ return this.isMobile && !this._editRecordOpen ? (index.h("calcite-panel", { class: "border-width-0", slot: "header" }, index.h("calcite-action", { class: "end-border", icon: "chevron-left", iconFlipRtl: true, onClick: () => this._closePopup(), scale: "s", slot: "header-actions-start", text: "" }), index.h("span", { class: "font-bold", slot: "header-content" }, this._mobileTitle))) : undefined;
876
+ }
868
877
  /**
869
878
  * Close the popup and emit the selected features
870
879
  */
@@ -1983,7 +1983,7 @@ const MapLayerPicker = class {
1983
1983
  return (index.h(index.Host, null, index.h("div", { class: "map-layer-picker-container", style: style }, index.h("div", { class: "map-layer-picker", style: style }, !this._hasValidLayers ? this._getInvalidPlaceholder() :
1984
1984
  !this._hasMultipleLayers && this.showSingleLayerAsLabel ? this._getSingleLayerPlaceholder() :
1985
1985
  this.type === "combobox" ? this._getCombobox(id) :
1986
- this.type === "select" ? this._getSelect(id) : this._getDropdown(id), index.h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": id }, index.h("span", null, this._translations.switchLayer))))));
1986
+ this.type === "select" ? this._getSelect(id) : this._getDropdown(id)))));
1987
1987
  }
1988
1988
  /**
1989
1989
  * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
@@ -241,6 +241,7 @@ const LayerTable = class {
241
241
  if (((_a = this._toolInfos) === null || _a === void 0 ? void 0 : _a.length) > 0) {
242
242
  this._initToolInfos();
243
243
  }
244
+ this._initLayerExpressions();
244
245
  }
245
246
  /**
246
247
  * watch for changes in map view and get the first layer
@@ -14,7 +14,7 @@ const mapViewUtils = require('./mapViewUtils-8aa325de.js');
14
14
  require('./esri-loader-a91c0ec1.js');
15
15
  require('./_commonjsHelpers-384729db.js');
16
16
 
17
- const crowdsourceManagerCss = ":host{display:block;--calcite-label-margin-bottom:0px;--solutions-theme-foreground-color:var(--calcite-color-foreground-1)}.padding-1-2{padding:0.5rem}.display-flex{display:flex}.width-full{width:100%}.width-1-2{position:relative;width:50%}.width-1-3{position:relative;width:33.33%}.width-2-3{position:relative;width:66.66%}.width-0{width:0}.height-full{height:100%}.height-1-2{position:relative;height:50%}.height-0{height:0}.toggle-node{width:51px;height:51px}.overflow-hidden{overflow:hidden}.flex-column{flex-direction:column}.border{border:1px solid var(--calcite-color-border-3)}.border-bottom{border-bottom:1px solid var(--calcite-color-border-3)}.border-sides{border-left:1px solid var(--calcite-color-border-3);border-right:1px solid var(--calcite-color-border-3)}.position-relative{position:relative}.height-50{height:50%}.adjusted-height-50{height:calc(50% - 25px)}.adjusted-height-100{height:calc(100% - 50px)}.adjusted-height-100-50{height:calc(100% - 50px)}.display-none{display:none}.height-53{height:53px}.position-absolute-53{position:absolute;top:53px}.display-grid{display:grid}.height-50-px{height:50px}.padding-inline-start-75{padding-inline-start:0.75rem}.align-items-center{align-items:center}.esri-floor-filter__close-levels-button{width:40px !important;height:40px !important}.esri-floor-filter__level-button{width:40px !important;height:40px !important}.esri-floor-filter__browse-button{width:40px !important;height:40px !important}.position-absolute-50{position:absolute;top:50px;bottom:0px;left:0px;right:0px}.position-absolute-0{position:absolute;top:0px;bottom:0px;left:0px;right:0px}.visibility-hidden{visibility:hidden;height:0px}.position-fixed{position:fixed}";
17
+ const crowdsourceManagerCss = ":host{display:block;--calcite-label-margin-bottom:0px;--solutions-theme-foreground-color:var(--calcite-color-foreground-1)}.padding-1-2{padding:0.5rem}.display-flex{display:flex}.width-full{width:100%}.width-1-2{position:relative;width:50%}.width-1-3{position:relative;width:33.33%}.width-2-3{position:relative;width:66.66%}.width-0{width:0}.height-full{height:100%}.height-1-2{position:relative;height:50%}.height-0{height:0}.toggle-node{width:51px;height:51px}.overflow-hidden{overflow:hidden}.flex-column{flex-direction:column}.border{border:1px solid var(--calcite-color-border-3)}.border-bottom{border-bottom:1px solid var(--calcite-color-border-3)}.border-sides{border-left:1px solid var(--calcite-color-border-3);border-right:1px solid var(--calcite-color-border-3)}.position-relative{position:relative}.height-50{height:50%}.adjusted-height-50{height:calc(50% - 25px)}.adjusted-height-100{height:calc(100% - 50px)}.adjusted-height-100-50{height:calc(100% - 50px)}.display-none{display:none}.height-53{height:53px}.position-absolute-53{position:absolute;top:53px}.display-grid{display:grid}.height-50-px{height:50px}.padding-inline-start-75{padding-inline-start:0.75rem}.align-items-center{align-items:center}.esri-floor-filter__close-levels-button{width:40px !important;height:40px !important}.esri-floor-filter__level-button{width:40px !important;height:40px !important}.esri-floor-filter__browse-button{width:40px !important;height:40px !important}.position-absolute-50{position:absolute;top:50px;bottom:0px;left:0px;right:0px}.position-absolute-0{position:absolute;top:0px;bottom:0px;left:0px;right:0px}.visibility-hidden{visibility:hidden;height:0px}.position-fixed{position:fixed}.border-width-0{border-width:0px}.border-bottom-width-0{border-bottom-width:0px}";
18
18
 
19
19
  const CrowdsourceManager = class {
20
20
  constructor(hostRef) {
@@ -196,7 +196,9 @@ const CrowdsourceManager = class {
196
196
  * Renders the component.
197
197
  */
198
198
  render() {
199
- return (index.h(index.Host, null, index.h("calcite-shell", { class: "position-relative" }, index.h("calcite-panel", { class: "width-full height-full" }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter())));
199
+ const borderClass = this._isMobile && this._hideTable ? "border-width-0" :
200
+ this._isMobile ? "border-bottom-width-0" : "";
201
+ return (index.h(index.Host, null, index.h("calcite-shell", { class: "position-relative" }, index.h("calcite-panel", { class: `width-full height-full ${borderClass}` }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter())));
200
202
  }
201
203
  /**
202
204
  * Called after each render
@@ -260,15 +262,16 @@ const CrowdsourceManager = class {
260
262
  *
261
263
  * @param layoutMode ELayoutMode the current layout mode
262
264
  * @param panelOpen boolean indicates if all panels are open
265
+ * @param hideTable boolean when true the layer table is hidden
263
266
  *
264
267
  * @returns the css selectors
265
268
  * @protected
266
269
  */
267
- _getMapSizeClass(layoutMode, panelOpen) {
270
+ _getMapSizeClass(layoutMode, panelOpen, hideTable) {
268
271
  let sizeClass = "";
269
272
  switch (layoutMode) {
270
273
  case interfaces.ELayoutMode.HORIZONTAL:
271
- sizeClass = `${panelOpen ? "height-1-2 display-grid" : "height-0"} width-full position-relative`;
274
+ sizeClass = `${panelOpen && !hideTable ? "height-1-2 display-grid" : panelOpen && hideTable ? "height-full" : "height-0"} width-full position-relative`;
272
275
  break;
273
276
  case interfaces.ELayoutMode.GRID:
274
277
  sizeClass = `height-full position-relative ${panelOpen ? "width-1-3" : "width-0"}`;
@@ -314,19 +317,20 @@ const CrowdsourceManager = class {
314
317
  */
315
318
  _getBody(layoutMode, panelOpen, hideTable) {
316
319
  const contentClass = layoutMode === interfaces.ELayoutMode.HORIZONTAL ? "" : "display-flex";
317
- return (index.h("calcite-panel", { class: "width-full height-full" }, index.h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen), this._getTable(layoutMode, panelOpen, hideTable))));
320
+ return (index.h("calcite-panel", { class: "width-full height-full" }, index.h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen, hideTable), this._getTable(layoutMode, panelOpen, hideTable))));
318
321
  }
319
322
  /**
320
323
  * Get the map and card nodes based for the current layout options
321
324
  *
322
325
  * @param layoutMode ELayoutMode the current layout mode
323
326
  * @param panelOpen boolean indicates if all panels are open
327
+ * @param hideTable boolean when true the layer table is hidden
324
328
  *
325
329
  * @returns the map node
326
330
  * @protected
327
331
  */
328
- _getMapAndCard(layoutMode, panelOpen) {
329
- const mapSizeClass = this._getMapSizeClass(layoutMode, panelOpen);
332
+ _getMapAndCard(layoutMode, panelOpen, hideTable) {
333
+ const mapSizeClass = this._getMapSizeClass(layoutMode, panelOpen, hideTable);
330
334
  return (index.h("div", { class: `${mapSizeClass} overflow-hidden` }, this._getMapNode(layoutMode, panelOpen), this._getPopupExpandNode()));
331
335
  }
332
336
  /**
@@ -359,7 +363,7 @@ const CrowdsourceManager = class {
359
363
  const popupNodeClass = !this._expandPopup ? "height-full" : ((_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.length) === 1 || this._isMobile ? "position-absolute-0" : "position-absolute-50";
360
364
  const headerClass = this._isMobile ? "display-none height-0" : "";
361
365
  const headerTheme = !this._isMobile ? "calcite-mode-dark" : "calcite-mode-light";
362
- const containerClass = this._isMobile && this._hideTable ? "position-fixed width-full height-full" : this._isMobile ? "display-none height-0" : "";
366
+ const containerClass = this._isMobile && this._hideTable ? "position-absolute-0 width-full height-full" : this._isMobile ? "display-none height-0" : "";
363
367
  return (index.h("div", { class: `${headerTheme} ${popupNodeClass} ${containerClass}` }, index.h("calcite-panel", null, !this._isMobile ? (index.h("div", { class: `display-flex align-items-center ${headerClass}`, slot: "header-content" }, index.h("calcite-icon", { icon: "information", scale: "s" }), index.h("div", { class: "padding-inline-start-75" }, this._translations.information))) : undefined, index.h("calcite-action", { class: headerClass, disabled: this._tableOnly, icon: icon, id: id, onClick: () => this._togglePopup(), slot: "header-actions-end", text: "" }), !this._tableOnly ? index.h("calcite-tooltip", { class: themeClass, label: "", placement: "bottom", "reference-element": id }, index.h("span", null, tooltip)) : undefined, this._getCardNode())));
364
368
  }
365
369
  /**
@@ -178,3 +178,11 @@
178
178
  .position-fixed {
179
179
  position: fixed;
180
180
  }
181
+
182
+ .border-width-0 {
183
+ border-width: 0px;
184
+ }
185
+
186
+ .border-bottom-width-0 {
187
+ border-bottom-width: 0px;
188
+ }
@@ -201,7 +201,9 @@ export class CrowdsourceManager {
201
201
  * Renders the component.
202
202
  */
203
203
  render() {
204
- return (h(Host, null, h("calcite-shell", { class: "position-relative" }, h("calcite-panel", { class: "width-full height-full" }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter())));
204
+ const borderClass = this._isMobile && this._hideTable ? "border-width-0" :
205
+ this._isMobile ? "border-bottom-width-0" : "";
206
+ return (h(Host, null, h("calcite-shell", { class: "position-relative" }, h("calcite-panel", { class: `width-full height-full ${borderClass}` }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter())));
205
207
  }
206
208
  /**
207
209
  * Called after each render
@@ -265,15 +267,16 @@ export class CrowdsourceManager {
265
267
  *
266
268
  * @param layoutMode ELayoutMode the current layout mode
267
269
  * @param panelOpen boolean indicates if all panels are open
270
+ * @param hideTable boolean when true the layer table is hidden
268
271
  *
269
272
  * @returns the css selectors
270
273
  * @protected
271
274
  */
272
- _getMapSizeClass(layoutMode, panelOpen) {
275
+ _getMapSizeClass(layoutMode, panelOpen, hideTable) {
273
276
  let sizeClass = "";
274
277
  switch (layoutMode) {
275
278
  case ELayoutMode.HORIZONTAL:
276
- sizeClass = `${panelOpen ? "height-1-2 display-grid" : "height-0"} width-full position-relative`;
279
+ sizeClass = `${panelOpen && !hideTable ? "height-1-2 display-grid" : panelOpen && hideTable ? "height-full" : "height-0"} width-full position-relative`;
277
280
  break;
278
281
  case ELayoutMode.GRID:
279
282
  sizeClass = `height-full position-relative ${panelOpen ? "width-1-3" : "width-0"}`;
@@ -319,19 +322,20 @@ export class CrowdsourceManager {
319
322
  */
320
323
  _getBody(layoutMode, panelOpen, hideTable) {
321
324
  const contentClass = layoutMode === ELayoutMode.HORIZONTAL ? "" : "display-flex";
322
- return (h("calcite-panel", { class: "width-full height-full" }, h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen), this._getTable(layoutMode, panelOpen, hideTable))));
325
+ return (h("calcite-panel", { class: "width-full height-full" }, h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen, hideTable), this._getTable(layoutMode, panelOpen, hideTable))));
323
326
  }
324
327
  /**
325
328
  * Get the map and card nodes based for the current layout options
326
329
  *
327
330
  * @param layoutMode ELayoutMode the current layout mode
328
331
  * @param panelOpen boolean indicates if all panels are open
332
+ * @param hideTable boolean when true the layer table is hidden
329
333
  *
330
334
  * @returns the map node
331
335
  * @protected
332
336
  */
333
- _getMapAndCard(layoutMode, panelOpen) {
334
- const mapSizeClass = this._getMapSizeClass(layoutMode, panelOpen);
337
+ _getMapAndCard(layoutMode, panelOpen, hideTable) {
338
+ const mapSizeClass = this._getMapSizeClass(layoutMode, panelOpen, hideTable);
335
339
  return (h("div", { class: `${mapSizeClass} overflow-hidden` }, this._getMapNode(layoutMode, panelOpen), this._getPopupExpandNode()));
336
340
  }
337
341
  /**
@@ -364,7 +368,7 @@ export class CrowdsourceManager {
364
368
  const popupNodeClass = !this._expandPopup ? "height-full" : ((_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.length) === 1 || this._isMobile ? "position-absolute-0" : "position-absolute-50";
365
369
  const headerClass = this._isMobile ? "display-none height-0" : "";
366
370
  const headerTheme = !this._isMobile ? "calcite-mode-dark" : "calcite-mode-light";
367
- const containerClass = this._isMobile && this._hideTable ? "position-fixed width-full height-full" : this._isMobile ? "display-none height-0" : "";
371
+ const containerClass = this._isMobile && this._hideTable ? "position-absolute-0 width-full height-full" : this._isMobile ? "display-none height-0" : "";
368
372
  return (h("div", { class: `${headerTheme} ${popupNodeClass} ${containerClass}` }, h("calcite-panel", null, !this._isMobile ? (h("div", { class: `display-flex align-items-center ${headerClass}`, slot: "header-content" }, h("calcite-icon", { icon: "information", scale: "s" }), h("div", { class: "padding-inline-start-75" }, this._translations.information))) : undefined, h("calcite-action", { class: headerClass, 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())));
369
373
  }
370
374
  /**
@@ -75,10 +75,6 @@
75
75
  height: 40px;
76
76
  }
77
77
 
78
- .padding-top-46 {
79
- padding-top: 46px;
80
- }
81
-
82
78
  .end-border {
83
79
  border-inline-end: 1px solid var(--calcite-color-border-1);
84
80
  }
@@ -95,3 +91,7 @@
95
91
  .padding-inline-start-1 {
96
92
  padding-inline-start: 1rem;
97
93
  }
94
+
95
+ .border-width-0 {
96
+ border-width: 0px;
97
+ }
@@ -136,11 +136,10 @@ export class InfoCard {
136
136
  const editButtonClass = (!this.isLoading && this._editRecordOpen) || this._showListView ? "display-none" : "";
137
137
  const nextBackDisabled = ((_b = (_a = this._features) === null || _a === void 0 ? void 0 : _a.features) === null || _b === void 0 ? void 0 : _b.length) < 2;
138
138
  const nextBackClass = this.isMobile ? "display-none" : "";
139
- const shellClass = this.isMobile && !this._editRecordOpen ? "padding-top-46" : "";
140
139
  const id = (_d = (_c = this._features) === null || _c === void 0 ? void 0 : _c.selectedFeature) === null || _d === void 0 ? void 0 : _d.getObjectId();
141
140
  const ids = parseInt(id === null || id === void 0 ? void 0 : id.toString(), 10) > -1 ? [id] : [];
142
141
  const deleteEnabled = ((_e = this._layer) === null || _e === void 0 ? void 0 : _e.editingEnabled) && ((_h = (_g = (_f = this._layer) === null || _f === void 0 ? void 0 : _f.capabilities) === null || _g === void 0 ? void 0 : _g.operations) === null || _h === void 0 ? void 0 : _h.supportsDelete);
143
- return (h(Host, null, this.isMobile && !this._editRecordOpen ? (h("calcite-panel", null, h("calcite-action", { class: "end-border", icon: "chevron-left", iconFlipRtl: true, onClick: () => this._closePopup(), scale: "s", slot: "header-actions-start", text: "" }), h("span", { class: "font-bold", slot: "header-content" }, this._mobileTitle))) : undefined, h("calcite-shell", { class: shellClass }, h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
142
+ return (h(Host, null, h("calcite-shell", null, this._getHeader(), h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
144
143
  h("div", { class: "display-flex top-border padding-1-2" }, h("calcite-button", { appearance: "solid", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), this.isMobile && deleteEnabled ? (h("delete-button", { class: "padding-inline-start-1 width-100", id: "solutions-delete", ids: ids, layer: this._layer, onEditsComplete: () => this._closePopup() })) : undefined, h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-edit" }, h("span", null, this._translations.edit)), this.isMobile ? (h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-delete" }, h("span", null, this._translations.delete))) : undefined), !nextBackDisabled && h("div", { class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-back", onClick: () => this._back(), width: "full" }, this._translations.back), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-back" }, h("span", null, this._translations.back))), h("div", null, h("calcite-action", { icon: "list", onClick: () => this._toggleListView(), scale: "s", text: this._count, textEnabled: true })), h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-next", onClick: () => this._next(), width: "full" }, this._translations.next), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-next" }, h("span", null, this._translations.next))))), h("edit-card", { class: editClass, graphicIndex: (_j = this._features) === null || _j === void 0 ? void 0 : _j.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { slot: "title" }, this._translations.editDisabled), h("div", { slot: "message" }, this._translations.enableEditing)))));
145
144
  }
146
145
  //--------------------------------------------------------------------------
@@ -228,6 +227,16 @@ export class InfoCard {
228
227
  }
229
228
  })) : Promise.resolve();
230
229
  }
230
+ /**
231
+ * Get the mobile header
232
+ *
233
+ * @returns the header node to display when in mobile mode
234
+ *
235
+ * @protected
236
+ */
237
+ _getHeader() {
238
+ return this.isMobile && !this._editRecordOpen ? (h("calcite-panel", { class: "border-width-0", slot: "header" }, h("calcite-action", { class: "end-border", icon: "chevron-left", iconFlipRtl: true, onClick: () => this._closePopup(), scale: "s", slot: "header-actions-start", text: "" }), h("span", { class: "font-bold", slot: "header-content" }, this._mobileTitle))) : undefined;
239
+ }
231
240
  /**
232
241
  * Close the popup and emit the selected features
233
242
  */
@@ -156,6 +156,7 @@ export class LayerTable {
156
156
  if (((_a = this._toolInfos) === null || _a === void 0 ? void 0 : _a.length) > 0) {
157
157
  this._initToolInfos();
158
158
  }
159
+ this._initLayerExpressions();
159
160
  }
160
161
  /**
161
162
  * watch for changes in map view and get the first layer
@@ -100,7 +100,7 @@ export class MapLayerPicker {
100
100
  return (h(Host, null, h("div", { class: "map-layer-picker-container", style: style }, h("div", { class: "map-layer-picker", style: style }, !this._hasValidLayers ? this._getInvalidPlaceholder() :
101
101
  !this._hasMultipleLayers && this.showSingleLayerAsLabel ? this._getSingleLayerPlaceholder() :
102
102
  this.type === "combobox" ? this._getCombobox(id) :
103
- this.type === "select" ? this._getSelect(id) : this._getDropdown(id), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": id }, h("span", null, this._translations.switchLayer))))));
103
+ this.type === "select" ? this._getSelect(id) : this._getDropdown(id)))));
104
104
  }
105
105
  /**
106
106
  * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
@@ -65,7 +65,7 @@ import { d as defineCustomElement$4 } from './map-picker2.js';
65
65
  import { d as defineCustomElement$3 } from './map-search2.js';
66
66
  import { d as defineCustomElement$2 } from './map-tools2.js';
67
67
 
68
- const crowdsourceManagerCss = ":host{display:block;--calcite-label-margin-bottom:0px;--solutions-theme-foreground-color:var(--calcite-color-foreground-1)}.padding-1-2{padding:0.5rem}.display-flex{display:flex}.width-full{width:100%}.width-1-2{position:relative;width:50%}.width-1-3{position:relative;width:33.33%}.width-2-3{position:relative;width:66.66%}.width-0{width:0}.height-full{height:100%}.height-1-2{position:relative;height:50%}.height-0{height:0}.toggle-node{width:51px;height:51px}.overflow-hidden{overflow:hidden}.flex-column{flex-direction:column}.border{border:1px solid var(--calcite-color-border-3)}.border-bottom{border-bottom:1px solid var(--calcite-color-border-3)}.border-sides{border-left:1px solid var(--calcite-color-border-3);border-right:1px solid var(--calcite-color-border-3)}.position-relative{position:relative}.height-50{height:50%}.adjusted-height-50{height:calc(50% - 25px)}.adjusted-height-100{height:calc(100% - 50px)}.adjusted-height-100-50{height:calc(100% - 50px)}.display-none{display:none}.height-53{height:53px}.position-absolute-53{position:absolute;top:53px}.display-grid{display:grid}.height-50-px{height:50px}.padding-inline-start-75{padding-inline-start:0.75rem}.align-items-center{align-items:center}.esri-floor-filter__close-levels-button{width:40px !important;height:40px !important}.esri-floor-filter__level-button{width:40px !important;height:40px !important}.esri-floor-filter__browse-button{width:40px !important;height:40px !important}.position-absolute-50{position:absolute;top:50px;bottom:0px;left:0px;right:0px}.position-absolute-0{position:absolute;top:0px;bottom:0px;left:0px;right:0px}.visibility-hidden{visibility:hidden;height:0px}.position-fixed{position:fixed}";
68
+ const crowdsourceManagerCss = ":host{display:block;--calcite-label-margin-bottom:0px;--solutions-theme-foreground-color:var(--calcite-color-foreground-1)}.padding-1-2{padding:0.5rem}.display-flex{display:flex}.width-full{width:100%}.width-1-2{position:relative;width:50%}.width-1-3{position:relative;width:33.33%}.width-2-3{position:relative;width:66.66%}.width-0{width:0}.height-full{height:100%}.height-1-2{position:relative;height:50%}.height-0{height:0}.toggle-node{width:51px;height:51px}.overflow-hidden{overflow:hidden}.flex-column{flex-direction:column}.border{border:1px solid var(--calcite-color-border-3)}.border-bottom{border-bottom:1px solid var(--calcite-color-border-3)}.border-sides{border-left:1px solid var(--calcite-color-border-3);border-right:1px solid var(--calcite-color-border-3)}.position-relative{position:relative}.height-50{height:50%}.adjusted-height-50{height:calc(50% - 25px)}.adjusted-height-100{height:calc(100% - 50px)}.adjusted-height-100-50{height:calc(100% - 50px)}.display-none{display:none}.height-53{height:53px}.position-absolute-53{position:absolute;top:53px}.display-grid{display:grid}.height-50-px{height:50px}.padding-inline-start-75{padding-inline-start:0.75rem}.align-items-center{align-items:center}.esri-floor-filter__close-levels-button{width:40px !important;height:40px !important}.esri-floor-filter__level-button{width:40px !important;height:40px !important}.esri-floor-filter__browse-button{width:40px !important;height:40px !important}.position-absolute-50{position:absolute;top:50px;bottom:0px;left:0px;right:0px}.position-absolute-0{position:absolute;top:0px;bottom:0px;left:0px;right:0px}.visibility-hidden{visibility:hidden;height:0px}.position-fixed{position:fixed}.border-width-0{border-width:0px}.border-bottom-width-0{border-bottom-width:0px}";
69
69
 
70
70
  const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceManager extends HTMLElement {
71
71
  constructor() {
@@ -248,7 +248,9 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
248
248
  * Renders the component.
249
249
  */
250
250
  render() {
251
- return (h(Host, null, h("calcite-shell", { class: "position-relative" }, h("calcite-panel", { class: "width-full height-full" }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter())));
251
+ const borderClass = this._isMobile && this._hideTable ? "border-width-0" :
252
+ this._isMobile ? "border-bottom-width-0" : "";
253
+ return (h(Host, null, h("calcite-shell", { class: "position-relative" }, h("calcite-panel", { class: `width-full height-full ${borderClass}` }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter())));
252
254
  }
253
255
  /**
254
256
  * Called after each render
@@ -312,15 +314,16 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
312
314
  *
313
315
  * @param layoutMode ELayoutMode the current layout mode
314
316
  * @param panelOpen boolean indicates if all panels are open
317
+ * @param hideTable boolean when true the layer table is hidden
315
318
  *
316
319
  * @returns the css selectors
317
320
  * @protected
318
321
  */
319
- _getMapSizeClass(layoutMode, panelOpen) {
322
+ _getMapSizeClass(layoutMode, panelOpen, hideTable) {
320
323
  let sizeClass = "";
321
324
  switch (layoutMode) {
322
325
  case ELayoutMode.HORIZONTAL:
323
- sizeClass = `${panelOpen ? "height-1-2 display-grid" : "height-0"} width-full position-relative`;
326
+ sizeClass = `${panelOpen && !hideTable ? "height-1-2 display-grid" : panelOpen && hideTable ? "height-full" : "height-0"} width-full position-relative`;
324
327
  break;
325
328
  case ELayoutMode.GRID:
326
329
  sizeClass = `height-full position-relative ${panelOpen ? "width-1-3" : "width-0"}`;
@@ -366,19 +369,20 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
366
369
  */
367
370
  _getBody(layoutMode, panelOpen, hideTable) {
368
371
  const contentClass = layoutMode === ELayoutMode.HORIZONTAL ? "" : "display-flex";
369
- return (h("calcite-panel", { class: "width-full height-full" }, h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen), this._getTable(layoutMode, panelOpen, hideTable))));
372
+ return (h("calcite-panel", { class: "width-full height-full" }, h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen, hideTable), this._getTable(layoutMode, panelOpen, hideTable))));
370
373
  }
371
374
  /**
372
375
  * Get the map and card nodes based for the current layout options
373
376
  *
374
377
  * @param layoutMode ELayoutMode the current layout mode
375
378
  * @param panelOpen boolean indicates if all panels are open
379
+ * @param hideTable boolean when true the layer table is hidden
376
380
  *
377
381
  * @returns the map node
378
382
  * @protected
379
383
  */
380
- _getMapAndCard(layoutMode, panelOpen) {
381
- const mapSizeClass = this._getMapSizeClass(layoutMode, panelOpen);
384
+ _getMapAndCard(layoutMode, panelOpen, hideTable) {
385
+ const mapSizeClass = this._getMapSizeClass(layoutMode, panelOpen, hideTable);
382
386
  return (h("div", { class: `${mapSizeClass} overflow-hidden` }, this._getMapNode(layoutMode, panelOpen), this._getPopupExpandNode()));
383
387
  }
384
388
  /**
@@ -411,7 +415,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
411
415
  const popupNodeClass = !this._expandPopup ? "height-full" : ((_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.length) === 1 || this._isMobile ? "position-absolute-0" : "position-absolute-50";
412
416
  const headerClass = this._isMobile ? "display-none height-0" : "";
413
417
  const headerTheme = !this._isMobile ? "calcite-mode-dark" : "calcite-mode-light";
414
- const containerClass = this._isMobile && this._hideTable ? "position-fixed width-full height-full" : this._isMobile ? "display-none height-0" : "";
418
+ const containerClass = this._isMobile && this._hideTable ? "position-absolute-0 width-full height-full" : this._isMobile ? "display-none height-0" : "";
415
419
  return (h("div", { class: `${headerTheme} ${popupNodeClass} ${containerClass}` }, h("calcite-panel", null, !this._isMobile ? (h("div", { class: `display-flex align-items-center ${headerClass}`, slot: "header-content" }, h("calcite-icon", { icon: "information", scale: "s" }), h("div", { class: "padding-inline-start-75" }, this._translations.information))) : undefined, h("calcite-action", { class: headerClass, 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())));
416
420
  }
417
421
  /**
@@ -24,7 +24,7 @@ import { d as defineCustomElement$3 } from './tooltip.js';
24
24
  import { d as defineCustomElement$2 } from './delete-button2.js';
25
25
  import { d as defineCustomElement$1 } from './edit-card2.js';
26
26
 
27
- const infoCardCss = ":host{display:block;--calcite-label-margin-bottom:0}.padding-1-2{padding:0.5rem}.display-none{display:none !important}.display-flex{display:flex}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.esri-features__footer{display:none !important}.button-container{justify-content:space-between;align-items:center}.top-border{border-top:1px solid var(--calcite-color-border-1)}.min-width-100{min-width:100px}.width-100{width:100%}.esri-features__container{padding:0.5rem !important;background-color:var(--calcite-color-foreground-1) !important;height:100% !important}.overflow-hidden{overflow:hidden}.height-40{height:40px}.padding-top-46{padding-top:46px}.end-border{border-inline-end:1px solid var(--calcite-color-border-1)}.font-bold{font-weight:bold}.visibility-hidden{visibility:hidden;height:0px}.padding-inline-start-1{padding-inline-start:1rem}";
27
+ const infoCardCss = ":host{display:block;--calcite-label-margin-bottom:0}.padding-1-2{padding:0.5rem}.display-none{display:none !important}.display-flex{display:flex}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.esri-features__footer{display:none !important}.button-container{justify-content:space-between;align-items:center}.top-border{border-top:1px solid var(--calcite-color-border-1)}.min-width-100{min-width:100px}.width-100{width:100%}.esri-features__container{padding:0.5rem !important;background-color:var(--calcite-color-foreground-1) !important;height:100% !important}.overflow-hidden{overflow:hidden}.height-40{height:40px}.end-border{border-inline-end:1px solid var(--calcite-color-border-1)}.font-bold{font-weight:bold}.visibility-hidden{visibility:hidden;height:0px}.padding-inline-start-1{padding-inline-start:1rem}.border-width-0{border-width:0px}";
28
28
 
29
29
  const InfoCard = /*@__PURE__*/ proxyCustomElement(class InfoCard extends HTMLElement {
30
30
  constructor() {
@@ -144,11 +144,10 @@ const InfoCard = /*@__PURE__*/ proxyCustomElement(class InfoCard extends HTMLEle
144
144
  const editButtonClass = (!this.isLoading && this._editRecordOpen) || this._showListView ? "display-none" : "";
145
145
  const nextBackDisabled = ((_b = (_a = this._features) === null || _a === void 0 ? void 0 : _a.features) === null || _b === void 0 ? void 0 : _b.length) < 2;
146
146
  const nextBackClass = this.isMobile ? "display-none" : "";
147
- const shellClass = this.isMobile && !this._editRecordOpen ? "padding-top-46" : "";
148
147
  const id = (_d = (_c = this._features) === null || _c === void 0 ? void 0 : _c.selectedFeature) === null || _d === void 0 ? void 0 : _d.getObjectId();
149
148
  const ids = parseInt(id === null || id === void 0 ? void 0 : id.toString(), 10) > -1 ? [id] : [];
150
149
  const deleteEnabled = ((_e = this._layer) === null || _e === void 0 ? void 0 : _e.editingEnabled) && ((_h = (_g = (_f = this._layer) === null || _f === void 0 ? void 0 : _f.capabilities) === null || _g === void 0 ? void 0 : _g.operations) === null || _h === void 0 ? void 0 : _h.supportsDelete);
151
- return (h(Host, null, this.isMobile && !this._editRecordOpen ? (h("calcite-panel", null, h("calcite-action", { class: "end-border", icon: "chevron-left", iconFlipRtl: true, onClick: () => this._closePopup(), scale: "s", slot: "header-actions-start", text: "" }), h("span", { class: "font-bold", slot: "header-content" }, this._mobileTitle))) : undefined, h("calcite-shell", { class: shellClass }, h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
150
+ return (h(Host, null, h("calcite-shell", null, this._getHeader(), h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
152
151
  h("div", { class: "display-flex top-border padding-1-2" }, h("calcite-button", { appearance: "solid", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), this.isMobile && deleteEnabled ? (h("delete-button", { class: "padding-inline-start-1 width-100", id: "solutions-delete", ids: ids, layer: this._layer, onEditsComplete: () => this._closePopup() })) : undefined, h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-edit" }, h("span", null, this._translations.edit)), this.isMobile ? (h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-delete" }, h("span", null, this._translations.delete))) : undefined), !nextBackDisabled && h("div", { class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-back", onClick: () => this._back(), width: "full" }, this._translations.back), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-back" }, h("span", null, this._translations.back))), h("div", null, h("calcite-action", { icon: "list", onClick: () => this._toggleListView(), scale: "s", text: this._count, textEnabled: true })), h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-next", onClick: () => this._next(), width: "full" }, this._translations.next), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-next" }, h("span", null, this._translations.next))))), h("edit-card", { class: editClass, graphicIndex: (_j = this._features) === null || _j === void 0 ? void 0 : _j.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { slot: "title" }, this._translations.editDisabled), h("div", { slot: "message" }, this._translations.enableEditing)))));
153
152
  }
154
153
  //--------------------------------------------------------------------------
@@ -236,6 +235,16 @@ const InfoCard = /*@__PURE__*/ proxyCustomElement(class InfoCard extends HTMLEle
236
235
  }
237
236
  })) : Promise.resolve();
238
237
  }
238
+ /**
239
+ * Get the mobile header
240
+ *
241
+ * @returns the header node to display when in mobile mode
242
+ *
243
+ * @protected
244
+ */
245
+ _getHeader() {
246
+ return this.isMobile && !this._editRecordOpen ? (h("calcite-panel", { class: "border-width-0", slot: "header" }, h("calcite-action", { class: "end-border", icon: "chevron-left", iconFlipRtl: true, onClick: () => this._closePopup(), scale: "s", slot: "header-actions-start", text: "" }), h("span", { class: "font-bold", slot: "header-content" }, this._mobileTitle))) : undefined;
247
+ }
239
248
  /**
240
249
  * Close the popup and emit the selected features
241
250
  */
@@ -185,6 +185,7 @@ const LayerTable = /*@__PURE__*/ proxyCustomElement(class LayerTable extends HTM
185
185
  if (((_a = this._toolInfos) === null || _a === void 0 ? void 0 : _a.length) > 0) {
186
186
  this._initToolInfos();
187
187
  }
188
+ this._initLayerExpressions();
188
189
  }
189
190
  /**
190
191
  * watch for changes in map view and get the first layer
@@ -108,7 +108,7 @@ const MapLayerPicker = /*@__PURE__*/ proxyCustomElement(class MapLayerPicker ext
108
108
  return (h(Host, null, h("div", { class: "map-layer-picker-container", style: style }, h("div", { class: "map-layer-picker", style: style }, !this._hasValidLayers ? this._getInvalidPlaceholder() :
109
109
  !this._hasMultipleLayers && this.showSingleLayerAsLabel ? this._getSingleLayerPlaceholder() :
110
110
  this.type === "combobox" ? this._getCombobox(id) :
111
- this.type === "select" ? this._getSelect(id) : this._getDropdown(id), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": id }, h("span", null, this._translations.switchLayer))))));
111
+ this.type === "select" ? this._getSelect(id) : this._getDropdown(id)))));
112
112
  }
113
113
  /**
114
114
  * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
@@ -650,7 +650,7 @@ const EditCard = class {
650
650
  };
651
651
  EditCard.style = editCardCss;
652
652
 
653
- const infoCardCss = ":host{display:block;--calcite-label-margin-bottom:0}.padding-1-2{padding:0.5rem}.display-none{display:none !important}.display-flex{display:flex}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.esri-features__footer{display:none !important}.button-container{justify-content:space-between;align-items:center}.top-border{border-top:1px solid var(--calcite-color-border-1)}.min-width-100{min-width:100px}.width-100{width:100%}.esri-features__container{padding:0.5rem !important;background-color:var(--calcite-color-foreground-1) !important;height:100% !important}.overflow-hidden{overflow:hidden}.height-40{height:40px}.padding-top-46{padding-top:46px}.end-border{border-inline-end:1px solid var(--calcite-color-border-1)}.font-bold{font-weight:bold}.visibility-hidden{visibility:hidden;height:0px}.padding-inline-start-1{padding-inline-start:1rem}";
653
+ const infoCardCss = ":host{display:block;--calcite-label-margin-bottom:0}.padding-1-2{padding:0.5rem}.display-none{display:none !important}.display-flex{display:flex}.position-absolute{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto}.esri-features__footer{display:none !important}.button-container{justify-content:space-between;align-items:center}.top-border{border-top:1px solid var(--calcite-color-border-1)}.min-width-100{min-width:100px}.width-100{width:100%}.esri-features__container{padding:0.5rem !important;background-color:var(--calcite-color-foreground-1) !important;height:100% !important}.overflow-hidden{overflow:hidden}.height-40{height:40px}.end-border{border-inline-end:1px solid var(--calcite-color-border-1)}.font-bold{font-weight:bold}.visibility-hidden{visibility:hidden;height:0px}.padding-inline-start-1{padding-inline-start:1rem}.border-width-0{border-width:0px}";
654
654
 
655
655
  const InfoCard = class {
656
656
  constructor(hostRef) {
@@ -769,11 +769,10 @@ const InfoCard = class {
769
769
  const editButtonClass = (!this.isLoading && this._editRecordOpen) || this._showListView ? "display-none" : "";
770
770
  const nextBackDisabled = ((_b = (_a = this._features) === null || _a === void 0 ? void 0 : _a.features) === null || _b === void 0 ? void 0 : _b.length) < 2;
771
771
  const nextBackClass = this.isMobile ? "display-none" : "";
772
- const shellClass = this.isMobile && !this._editRecordOpen ? "padding-top-46" : "";
773
772
  const id = (_d = (_c = this._features) === null || _c === void 0 ? void 0 : _c.selectedFeature) === null || _d === void 0 ? void 0 : _d.getObjectId();
774
773
  const ids = parseInt(id === null || id === void 0 ? void 0 : id.toString(), 10) > -1 ? [id] : [];
775
774
  const deleteEnabled = ((_e = this._layer) === null || _e === void 0 ? void 0 : _e.editingEnabled) && ((_h = (_g = (_f = this._layer) === null || _f === void 0 ? void 0 : _f.capabilities) === null || _g === void 0 ? void 0 : _g.operations) === null || _h === void 0 ? void 0 : _h.supportsDelete);
776
- return (h(Host, null, this.isMobile && !this._editRecordOpen ? (h("calcite-panel", null, h("calcite-action", { class: "end-border", icon: "chevron-left", iconFlipRtl: true, onClick: () => this._closePopup(), scale: "s", slot: "header-actions-start", text: "" }), h("span", { class: "font-bold", slot: "header-content" }, this._mobileTitle))) : undefined, h("calcite-shell", { class: shellClass }, h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
775
+ return (h(Host, null, h("calcite-shell", null, this._getHeader(), h("calcite-loader", { class: loadingClass, label: this._translations.fetchingData }), h("div", { class: "esri-widget " + featureNodeClass, id: "features-node" }), h("div", { class: `${editButtonClass} width-100`, slot: "footer" }, this.allowEditing &&
777
776
  h("div", { class: "display-flex top-border padding-1-2" }, h("calcite-button", { appearance: "solid", id: "solutions-edit", onClick: () => this._openEditRecord(), width: "full" }, this._translations.edit), this.isMobile && deleteEnabled ? (h("delete-button", { class: "padding-inline-start-1 width-100", id: "solutions-delete", ids: ids, layer: this._layer, onEditsComplete: () => this._closePopup() })) : undefined, h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-edit" }, h("span", null, this._translations.edit)), this.isMobile ? (h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": "solutions-delete" }, h("span", null, this._translations.delete))) : undefined), !nextBackDisabled && h("div", { class: `display-flex padding-1-2 button-container top-border ${nextBackClass}` }, h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-back", onClick: () => this._back(), width: "full" }, this._translations.back), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-back" }, h("span", null, this._translations.back))), h("div", null, h("calcite-action", { icon: "list", onClick: () => this._toggleListView(), scale: "s", text: this._count, textEnabled: true })), h("div", { class: "min-width-100" }, h("calcite-button", { appearance: "outline", disabled: nextBackDisabled, id: "solutions-next", onClick: () => this._next(), width: "full" }, this._translations.next), h("calcite-tooltip", { label: "", placement: "top", "reference-element": "solutions-next" }, h("span", null, this._translations.next))))), h("edit-card", { class: editClass, graphicIndex: (_j = this._features) === null || _j === void 0 ? void 0 : _j.selectedFeatureIndex, graphics: this.graphics, mapView: this.mapView, open: this._editRecordOpen }), h("calcite-alert", { icon: "layer-broken", kind: "warning", label: "", onCalciteAlertClose: () => this._alertClosed(), open: this._alertOpen, placement: "top" }, h("div", { slot: "title" }, this._translations.editDisabled), h("div", { slot: "message" }, this._translations.enableEditing)))));
778
777
  }
779
778
  //--------------------------------------------------------------------------
@@ -861,6 +860,16 @@ const InfoCard = class {
861
860
  }
862
861
  })) : Promise.resolve();
863
862
  }
863
+ /**
864
+ * Get the mobile header
865
+ *
866
+ * @returns the header node to display when in mobile mode
867
+ *
868
+ * @protected
869
+ */
870
+ _getHeader() {
871
+ return this.isMobile && !this._editRecordOpen ? (h("calcite-panel", { class: "border-width-0", slot: "header" }, h("calcite-action", { class: "end-border", icon: "chevron-left", iconFlipRtl: true, onClick: () => this._closePopup(), scale: "s", slot: "header-actions-start", text: "" }), h("span", { class: "font-bold", slot: "header-content" }, this._mobileTitle))) : undefined;
872
+ }
864
873
  /**
865
874
  * Close the popup and emit the selected features
866
875
  */
@@ -1979,7 +1979,7 @@ const MapLayerPicker = class {
1979
1979
  return (h(Host, null, h("div", { class: "map-layer-picker-container", style: style }, h("div", { class: "map-layer-picker", style: style }, !this._hasValidLayers ? this._getInvalidPlaceholder() :
1980
1980
  !this._hasMultipleLayers && this.showSingleLayerAsLabel ? this._getSingleLayerPlaceholder() :
1981
1981
  this.type === "combobox" ? this._getCombobox(id) :
1982
- this.type === "select" ? this._getSelect(id) : this._getDropdown(id), h("calcite-tooltip", { label: "", placement: "bottom", "reference-element": id }, h("span", null, this._translations.switchLayer))))));
1982
+ this.type === "select" ? this._getSelect(id) : this._getDropdown(id)))));
1983
1983
  }
1984
1984
  /**
1985
1985
  * StencilJS: Called once just after the component is fully loaded and the first render() occurs.
@@ -237,6 +237,7 @@ const LayerTable = class {
237
237
  if (((_a = this._toolInfos) === null || _a === void 0 ? void 0 : _a.length) > 0) {
238
238
  this._initToolInfos();
239
239
  }
240
+ this._initLayerExpressions();
240
241
  }
241
242
  /**
242
243
  * watch for changes in map view and get the first layer
@@ -10,7 +10,7 @@ import { g as getLayerOrTable } from './mapViewUtils-6daedef8.js';
10
10
  import './esri-loader-eda07632.js';
11
11
  import './_commonjsHelpers-d5f9d613.js';
12
12
 
13
- const crowdsourceManagerCss = ":host{display:block;--calcite-label-margin-bottom:0px;--solutions-theme-foreground-color:var(--calcite-color-foreground-1)}.padding-1-2{padding:0.5rem}.display-flex{display:flex}.width-full{width:100%}.width-1-2{position:relative;width:50%}.width-1-3{position:relative;width:33.33%}.width-2-3{position:relative;width:66.66%}.width-0{width:0}.height-full{height:100%}.height-1-2{position:relative;height:50%}.height-0{height:0}.toggle-node{width:51px;height:51px}.overflow-hidden{overflow:hidden}.flex-column{flex-direction:column}.border{border:1px solid var(--calcite-color-border-3)}.border-bottom{border-bottom:1px solid var(--calcite-color-border-3)}.border-sides{border-left:1px solid var(--calcite-color-border-3);border-right:1px solid var(--calcite-color-border-3)}.position-relative{position:relative}.height-50{height:50%}.adjusted-height-50{height:calc(50% - 25px)}.adjusted-height-100{height:calc(100% - 50px)}.adjusted-height-100-50{height:calc(100% - 50px)}.display-none{display:none}.height-53{height:53px}.position-absolute-53{position:absolute;top:53px}.display-grid{display:grid}.height-50-px{height:50px}.padding-inline-start-75{padding-inline-start:0.75rem}.align-items-center{align-items:center}.esri-floor-filter__close-levels-button{width:40px !important;height:40px !important}.esri-floor-filter__level-button{width:40px !important;height:40px !important}.esri-floor-filter__browse-button{width:40px !important;height:40px !important}.position-absolute-50{position:absolute;top:50px;bottom:0px;left:0px;right:0px}.position-absolute-0{position:absolute;top:0px;bottom:0px;left:0px;right:0px}.visibility-hidden{visibility:hidden;height:0px}.position-fixed{position:fixed}";
13
+ const crowdsourceManagerCss = ":host{display:block;--calcite-label-margin-bottom:0px;--solutions-theme-foreground-color:var(--calcite-color-foreground-1)}.padding-1-2{padding:0.5rem}.display-flex{display:flex}.width-full{width:100%}.width-1-2{position:relative;width:50%}.width-1-3{position:relative;width:33.33%}.width-2-3{position:relative;width:66.66%}.width-0{width:0}.height-full{height:100%}.height-1-2{position:relative;height:50%}.height-0{height:0}.toggle-node{width:51px;height:51px}.overflow-hidden{overflow:hidden}.flex-column{flex-direction:column}.border{border:1px solid var(--calcite-color-border-3)}.border-bottom{border-bottom:1px solid var(--calcite-color-border-3)}.border-sides{border-left:1px solid var(--calcite-color-border-3);border-right:1px solid var(--calcite-color-border-3)}.position-relative{position:relative}.height-50{height:50%}.adjusted-height-50{height:calc(50% - 25px)}.adjusted-height-100{height:calc(100% - 50px)}.adjusted-height-100-50{height:calc(100% - 50px)}.display-none{display:none}.height-53{height:53px}.position-absolute-53{position:absolute;top:53px}.display-grid{display:grid}.height-50-px{height:50px}.padding-inline-start-75{padding-inline-start:0.75rem}.align-items-center{align-items:center}.esri-floor-filter__close-levels-button{width:40px !important;height:40px !important}.esri-floor-filter__level-button{width:40px !important;height:40px !important}.esri-floor-filter__browse-button{width:40px !important;height:40px !important}.position-absolute-50{position:absolute;top:50px;bottom:0px;left:0px;right:0px}.position-absolute-0{position:absolute;top:0px;bottom:0px;left:0px;right:0px}.visibility-hidden{visibility:hidden;height:0px}.position-fixed{position:fixed}.border-width-0{border-width:0px}.border-bottom-width-0{border-bottom-width:0px}";
14
14
 
15
15
  const CrowdsourceManager = class {
16
16
  constructor(hostRef) {
@@ -192,7 +192,9 @@ const CrowdsourceManager = class {
192
192
  * Renders the component.
193
193
  */
194
194
  render() {
195
- return (h(Host, null, h("calcite-shell", { class: "position-relative" }, h("calcite-panel", { class: "width-full height-full" }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter())));
195
+ const borderClass = this._isMobile && this._hideTable ? "border-width-0" :
196
+ this._isMobile ? "border-bottom-width-0" : "";
197
+ return (h(Host, null, h("calcite-shell", { class: "position-relative" }, h("calcite-panel", { class: `width-full height-full ${borderClass}` }, this._getBody(this._layoutMode, this._panelOpen, this._hideTable)), this._getFooter())));
196
198
  }
197
199
  /**
198
200
  * Called after each render
@@ -256,15 +258,16 @@ const CrowdsourceManager = class {
256
258
  *
257
259
  * @param layoutMode ELayoutMode the current layout mode
258
260
  * @param panelOpen boolean indicates if all panels are open
261
+ * @param hideTable boolean when true the layer table is hidden
259
262
  *
260
263
  * @returns the css selectors
261
264
  * @protected
262
265
  */
263
- _getMapSizeClass(layoutMode, panelOpen) {
266
+ _getMapSizeClass(layoutMode, panelOpen, hideTable) {
264
267
  let sizeClass = "";
265
268
  switch (layoutMode) {
266
269
  case ELayoutMode.HORIZONTAL:
267
- sizeClass = `${panelOpen ? "height-1-2 display-grid" : "height-0"} width-full position-relative`;
270
+ sizeClass = `${panelOpen && !hideTable ? "height-1-2 display-grid" : panelOpen && hideTable ? "height-full" : "height-0"} width-full position-relative`;
268
271
  break;
269
272
  case ELayoutMode.GRID:
270
273
  sizeClass = `height-full position-relative ${panelOpen ? "width-1-3" : "width-0"}`;
@@ -310,19 +313,20 @@ const CrowdsourceManager = class {
310
313
  */
311
314
  _getBody(layoutMode, panelOpen, hideTable) {
312
315
  const contentClass = layoutMode === ELayoutMode.HORIZONTAL ? "" : "display-flex";
313
- return (h("calcite-panel", { class: "width-full height-full" }, h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen), this._getTable(layoutMode, panelOpen, hideTable))));
316
+ return (h("calcite-panel", { class: "width-full height-full" }, h("div", { class: `width-full height-full overflow-hidden ${contentClass}` }, this._getMapAndCard(layoutMode, panelOpen, hideTable), this._getTable(layoutMode, panelOpen, hideTable))));
314
317
  }
315
318
  /**
316
319
  * Get the map and card nodes based for the current layout options
317
320
  *
318
321
  * @param layoutMode ELayoutMode the current layout mode
319
322
  * @param panelOpen boolean indicates if all panels are open
323
+ * @param hideTable boolean when true the layer table is hidden
320
324
  *
321
325
  * @returns the map node
322
326
  * @protected
323
327
  */
324
- _getMapAndCard(layoutMode, panelOpen) {
325
- const mapSizeClass = this._getMapSizeClass(layoutMode, panelOpen);
328
+ _getMapAndCard(layoutMode, panelOpen, hideTable) {
329
+ const mapSizeClass = this._getMapSizeClass(layoutMode, panelOpen, hideTable);
326
330
  return (h("div", { class: `${mapSizeClass} overflow-hidden` }, this._getMapNode(layoutMode, panelOpen), this._getPopupExpandNode()));
327
331
  }
328
332
  /**
@@ -355,7 +359,7 @@ const CrowdsourceManager = class {
355
359
  const popupNodeClass = !this._expandPopup ? "height-full" : ((_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.length) === 1 || this._isMobile ? "position-absolute-0" : "position-absolute-50";
356
360
  const headerClass = this._isMobile ? "display-none height-0" : "";
357
361
  const headerTheme = !this._isMobile ? "calcite-mode-dark" : "calcite-mode-light";
358
- const containerClass = this._isMobile && this._hideTable ? "position-fixed width-full height-full" : this._isMobile ? "display-none height-0" : "";
362
+ const containerClass = this._isMobile && this._hideTable ? "position-absolute-0 width-full height-full" : this._isMobile ? "display-none height-0" : "";
359
363
  return (h("div", { class: `${headerTheme} ${popupNodeClass} ${containerClass}` }, h("calcite-panel", null, !this._isMobile ? (h("div", { class: `display-flex align-items-center ${headerClass}`, slot: "header-content" }, h("calcite-icon", { icon: "information", scale: "s" }), h("div", { class: "padding-inline-start-75" }, this._translations.information))) : undefined, h("calcite-action", { class: headerClass, 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())));
360
364
  }
361
365
  /**