@esri/solutions-components 0.7.39 → 0.7.41

package/dist/esm/calcite-input-date-picker_3.entry.js

@@ -774,7 +774,7 @@ function resetDatePicker(datePicker) {
   }
 }
 
-const instantAppsFilterListCss = ":host{display:block}.instant-apps-filter-list *{box-sizing:border-box}.instant-apps-filter-list__container{height:100%}.instant-apps-filter-list__container calcite-block:last-of-type{margin-bottom:0}.instant-apps-filter-list__footer{padding:12px;display:flex}.instant-apps-filter-list__footer calcite-button:nth-child(2){margin-left:6px}.instant-apps-filter-list__item-container,.instant-apps-filter-list__item-container--user-input{display:flex;justify-content:space-between;align-items:center}.instant-apps-filter-list__item-container:not(:last-child),.instant-apps-filter-list__item-container--user-input:not(:last-child){padding-bottom:20px}.instant-apps-filter-list__item-container--user-input{margin:0;display:flex;flex-direction:column;align-items:flex-start}.instant-apps-filter-list__item-container--user-input>span{margin:0 0 6px;font-size:14px;font-weight:normal}.instant-apps-filter-list__item-container--user-input calcite-combobox{width:100%}.instant-apps-filter-list__number-input-container{width:100%;display:flex;justify-content:center}.instant-apps-filter-list__number-input-container calcite-slider{width:90%}.instant-apps-filter-list__date-picker-input-container{display:flex;align-items:center;justify-content:unset;width:100%}.instant-apps-filter-list__date-picker-input-container calcite-action{height:48px;border-top:1px solid var(--calcite-color-border-input);border-right:1px solid var(--calcite-color-border-input);border-bottom:1px solid var(--calcite-color-border-input)}.instant-apps-filter-list__title{margin-right:20px}.instant-apps-filter-list__title>p{font-size:14px;font-weight:normal;margin:0}.instant-apps-filter-list__checkbox-container{display:flex}.instant-apps-filter-list__checkbox-container calcite-checkbox{height:18px}.instant-apps-filter-list__operator-description{margin:0;--calcite-font-size--1:12px}.instant-apps-filter-list__zoom-to{display:flex;justify-content:flex-end;margin:8px 0 20px}.instant-apps-filter-list__zoom-to calcite-action{width:-moz-min-content;width:min-content}@media (prefers-reduced-motion){.instant-apps-filter-list calcite-loader{--calcite-internal-duration-factor:2;--calcite-internal-animation-timing-slow:calc(300ms * 2)}}.instant-apps-filter-list.calcite-mode-dark .instant-apps-filter-list__header-container{background:#2b2b2b;color:#fff}.instant-apps-filter-list.calcite-mode-dark .instant-apps-filter-list__operator-description{background:#353535}";
+const instantAppsFilterListCss = ":host{display:block}.instant-apps-filter-list *{box-sizing:border-box}.instant-apps-filter-list__container{height:100%}.instant-apps-filter-list__container calcite-block:last-of-type{margin-bottom:0}.instant-apps-filter-list__footer{padding:12px;display:flex}.instant-apps-filter-list__footer calcite-button:nth-child(2){margin-left:6px}.instant-apps-filter-list__item-container,.instant-apps-filter-list__item-container--user-input{display:flex;justify-content:space-between;align-items:center}.instant-apps-filter-list__item-container:not(:last-child),.instant-apps-filter-list__item-container--user-input:not(:last-child){padding-bottom:20px}.instant-apps-filter-list__item-container--user-input{margin:0;display:flex;flex-direction:column;align-items:flex-start}.instant-apps-filter-list__item-container--user-input>span{margin:0 0 6px;font-size:14px;font-weight:normal}.instant-apps-filter-list__item-container--user-input calcite-combobox{width:100%;--calcite-font-size--1:16px}.instant-apps-filter-list__item-container--user-input calcite-combobox-item{--calcite-font-size--1:12px}.instant-apps-filter-list__number-input-container{width:100%;display:flex;justify-content:center}.instant-apps-filter-list__number-input-container calcite-slider{width:90%}.instant-apps-filter-list__date-picker-input-container{display:flex;align-items:center;justify-content:unset;width:100%}.instant-apps-filter-list__date-picker-input-container calcite-action{height:64px;border-top:1px solid var(--calcite-color-border-input);border-right:1px solid var(--calcite-color-border-input);border-bottom:1px solid var(--calcite-color-border-input)}.instant-apps-filter-list__title{margin-right:20px}.instant-apps-filter-list__title>p{font-size:14px;font-weight:normal;margin:0}.instant-apps-filter-list__checkbox-container{display:flex}.instant-apps-filter-list__checkbox-container calcite-checkbox{height:18px}.instant-apps-filter-list__operator-description{margin:0;--calcite-font-size--1:12px}.instant-apps-filter-list__zoom-to{display:flex;justify-content:flex-end;margin:8px 0 20px}.instant-apps-filter-list__zoom-to calcite-action{width:-moz-min-content;width:min-content}.instant-apps-filter-list calcite-input-date-picker{--calcite-font-size--1:16px}@media (prefers-reduced-motion){.instant-apps-filter-list calcite-loader{--calcite-internal-duration-factor:2;--calcite-internal-animation-timing-slow:calc(300ms * 2)}}.instant-apps-filter-list.calcite-mode-dark .instant-apps-filter-list__header-container{background:#2b2b2b;color:#fff}.instant-apps-filter-list.calcite-mode-dark .instant-apps-filter-list__operator-description{background:#353535}";
 
 const CSS$1 = {
     base: 'instant-apps-filter-list',
@@ -861,6 +861,7 @@ const InstantAppsFilterList = class {
         this.geometryJsonUtils = geometryJsonUtils;
         this.reactiveUtils = reactiveUtils;
         this.locale = intl.getLocale();
+        this.intl = intl;
         return Promise.resolve();
     }
     render() {
@@ -892,24 +893,13 @@ const InstantAppsFilterList = class {
     }
     renderCombobox(layerExpression, expression) {
         var _a;
-        return (h("label", { key: "combo-select", class: CSS$1.filterUIItemContainer }, h("span", null, expression.name), h("calcite-combobox", { id: expression.id.toString(), onCalciteComboboxChange: this.handleComboSelect.bind(this, expression, layerExpression), label: expression.name, placeholder: expression.placeholder, overlayPositioning: "fixed", selectionMode: "multiple", scale: "s", "max-items": "6" }, (_a = expression.fields) === null || _a === void 0 ? void 0 : _a.map((value, index) => this.renderComboboxItem(expression, value, index)))));
+        return (h("label", { key: "combo-select", class: CSS$1.filterUIItemContainer }, h("span", null, expression.name), h("calcite-combobox", { id: expression.id.toString(), onCalciteComboboxChange: this.handleComboSelect.bind(this, expression, layerExpression), label: expression.name, placeholder: expression.placeholder, selectionMode: "multiple", "max-items": "6" }, (_a = expression.fields) === null || _a === void 0 ? void 0 : _a.map((value, index) => this.renderComboboxItem(expression, value, index)))));
     }
     renderComboboxItem(expression, value, index) {
-        var _a, _b;
-        let label = value;
-        if (expression.type === 'coded-value') {
-            label = (_a = expression.codedValues) === null || _a === void 0 ? void 0 : _a[value];
-        }
-        else if (expression.type === 'number' && typeof value === 'number' && expression.format != null) {
-            if (expression.format.places != null) {
-                label = this.roundNumber(value, expression.format.places);
-            }
-            if (expression.format.digitSeparator) {
-                label = this.numberWithCommas(label);
-            }
-        }
+        var _a;
+        const label = this.createLabel(expression, value);
         const selectedFields = expression === null || expression === void 0 ? void 0 : expression.selectedFields;
-        const selected = (_b = selectedFields === null || selectedFields === void 0 ? void 0 : selectedFields.includes(value)) !== null && _b !== void 0 ? _b : false;
+        const selected = (_a = selectedFields === null || selectedFields === void 0 ? void 0 : selectedFields.includes(value)) !== null && _a !== void 0 ? _a : false;
         return h("calcite-combobox-item", { key: `${label}-${index}`, value: value, textLabel: `${label}`, selected: selected });
     }
     initFilterConfig() {
@@ -941,11 +931,10 @@ const InstantAppsFilterList = class {
     }
     renderDatePicker(layerExpression, expression) {
         var _a, _b, _c, _d;
-        const min = convertToDate(expression.min);
-        const max = convertToDate(expression.max);
+        const { min, max } = expression;
         const value = [(_a = expression === null || expression === void 0 ? void 0 : expression.range) === null || _a === void 0 ? void 0 : _a.min, (_b = expression === null || expression === void 0 ? void 0 : expression.range) === null || _b === void 0 ? void 0 : _b.max];
         const check = min != null && max != null;
-        return check ? (h("label", { class: CSS$1.filterUIItemContainer }, h("span", null, expression === null || expression === void 0 ? void 0 : expression.name), h("div", { class: CSS$1.dateInputContainer }, h("calcite-input-date-picker", { id: expression === null || expression === void 0 ? void 0 : expression.id.toString(), onCalciteInputDatePickerChange: this.handleDatePickerRangeChange.bind(this, expression, layerExpression), min: min, max: max, scale: "s", lang: (_c = this.locale) !== null && _c !== void 0 ? _c : 'en', "overlay-positioning": "fixed", layout: "vertical", value: value, range: true }), h("calcite-action", { onClick: this.handleResetDatePicker.bind(this, expression, layerExpression), icon: "reset", text: (_d = this.messages) === null || _d === void 0 ? void 0 : _d.resetDatePicker, scale: "s" })))) : null;
+        return check ? (h("label", { class: CSS$1.filterUIItemContainer }, h("span", null, expression === null || expression === void 0 ? void 0 : expression.name), h("div", { class: CSS$1.dateInputContainer }, h("calcite-input-date-picker", { id: expression === null || expression === void 0 ? void 0 : expression.id.toString(), onCalciteInputDatePickerChange: this.handleDatePickerRangeChange.bind(this, expression, layerExpression), min: min, max: max, "overlay-positioning": "fixed", lang: (_c = this.locale) !== null && _c !== void 0 ? _c : 'en', layout: "vertical", value: value, range: true }), h("calcite-action", { onClick: this.handleResetDatePicker.bind(this, expression, layerExpression), icon: "reset", text: (_d = this.messages) === null || _d === void 0 ? void 0 : _d.resetDatePicker, scale: "s" })))) : null;
     }
     renderFooter() {
         var _a;
@@ -1015,7 +1004,12 @@ const InstantAppsFilterList = class {
                     this.resetCombobox(expression);
                 }
                 else if (type === 'date') {
-                    this.resetDatePicker(expression);
+                    if ((expression === null || expression === void 0 ? void 0 : expression.numDisplayOption) === 'drop-down' || (expression === null || expression === void 0 ? void 0 : expression.displayOption) === 'drop-down') {
+                        this.resetCombobox(expression);
+                    }
+                    else {
+                        this.resetDatePicker(expression);
+                    }
                 }
                 else if (type === 'number' || type === 'range') {
                     if ((expression === null || expression === void 0 ? void 0 : expression.numDisplayOption) === 'drop-down' || (expression === null || expression === void 0 ? void 0 : expression.displayOption) === 'drop-down') {
@@ -1091,9 +1085,15 @@ const InstantAppsFilterList = class {
         });
     }
     async updateStringExpression(layerExpression, expression) {
-        const { field } = expression;
+        const { field, type } = expression;
         const layer = this.findFilterLayer(layerExpression);
         expression.fields = await this.getFeatureAttributes(layer, field);
+        if (type === 'date') {
+            const layerField = layer.fields.find(({ name }) => name === field);
+            if ((layerField === null || layerField === void 0 ? void 0 : layerField.type) === 'date-only') {
+                expression.dateOnly = true;
+            }
+        }
         if (expression === null || expression === void 0 ? void 0 : expression.selectedFields) {
             const selectedFields = expression.selectedFields.map((field) => (typeof field === 'number' ? field : `'${handleSingleQuote(field)}'`));
             expression.definitionExpression = `${field} IN (${selectedFields.join(',')})`;
@@ -1354,12 +1354,18 @@ const InstantAppsFilterList = class {
     handleComboSelect(expression, layerExpression, event) {
         const combobox = event.target;
         const items = combobox.selectedItems;
-        const { field } = expression;
+        const { field, type } = expression;
         if (items && items.length) {
             const values = items.map(({ value }) => (typeof value === 'number' ? value : `'${handleSingleQuote(value)}'`));
-            expression.selectedFields = items.map(({ value }) => value);
-            const definitionExpression = `${field} IN (${values.join(',')})`;
-            expression.definitionExpression = definitionExpression;
+            if (type === 'date') {
+                expression.selectedFields = items.map(({ value }) => value);
+                expression.definitionExpression = values.map(value => this.buildDateExpression(value, field)).join(' OR ');
+            }
+            else {
+                expression.selectedFields = items.map(({ value }) => value);
+                const definitionExpression = `${field} IN (${values.join(',')})`;
+                expression.definitionExpression = definitionExpression;
+            }
             expression.active = true;
         }
         else {
@@ -1416,20 +1422,20 @@ const InstantAppsFilterList = class {
     }
     createURLParamExpression(layerExpression, expression) {
         const { id, range, selectedFields, type } = expression;
-        if (type === 'number' || type === 'range' || type === 'date') {
+        if (type === 'string' || type === 'coded-value' || (expression === null || expression === void 0 ? void 0 : expression.numDisplayOption) === 'drop-down' || (expression === null || expression === void 0 ? void 0 : expression.displayOption) === 'drop-down') {
             return {
-                type: 'range',
+                type: 'select',
                 layerId: layerExpression.id,
                 expressionId: id.toString(),
-                range,
+                selectedFields,
             };
         }
-        else if (type === 'string' || type === 'coded-value') {
+        else if (type === 'number' || type === 'range' || type === 'date') {
             return {
-                type: 'select',
+                type: 'range',
                 layerId: layerExpression.id,
                 expressionId: id.toString(),
-                selectedFields,
+                range,
             };
         }
         else {
@@ -1725,6 +1731,39 @@ const InstantAppsFilterList = class {
             return layer;
         }
     }
+    createLabel(expression, value) {
+        var _a;
+        let label = value;
+        if (expression.type === 'coded-value') {
+            label = (_a = expression.codedValues) === null || _a === void 0 ? void 0 : _a[value];
+        }
+        else if (expression.type === 'number' && typeof value === 'number' && expression.format != null) {
+            if (expression.format.places != null) {
+                label = this.roundNumber(value, expression.format.places);
+            }
+            if (expression.format.digitSeparator) {
+                label = this.numberWithCommas(label);
+            }
+        }
+        else if (expression.type === 'date' && !expression.dateOnly) {
+            const format = expression.dateOnly ? this.intl.convertDateFormatToIntlOptions('short-date-long-time') : undefined;
+            label = this.intl.formatDate(value, format);
+        }
+        return label;
+    }
+    buildDateExpression(date, field) {
+        if (date) {
+            const tmpDate = new Date(date);
+            const tmpCompareDate = new Date(date);
+            const tmpCompareDate1 = new Date(tmpCompareDate.setDate(tmpDate.getDate() + 1));
+            const formattedDate = `${tmpDate.getFullYear()}-${tmpDate.getMonth() + 1}-${tmpDate.getDate()}`;
+            const time = `${tmpDate.getHours()}:${tmpDate.getMinutes()}:${tmpDate.getSeconds()}`;
+            const compareTime = `${tmpCompareDate1.getHours()}:${tmpCompareDate1.getMinutes()}:${tmpCompareDate1.getSeconds()}`;
+            const compareFormattedDate = `${tmpCompareDate1.getFullYear()}-${tmpCompareDate1.getMonth() + 1}-${tmpCompareDate1.getDate()}`;
+            return `${field} BETWEEN '${formattedDate} ${time}' AND '${compareFormattedDate} ${compareTime}'`;
+        }
+        return;
+    }
     get el() { return getElement(this); }
     static get watchers() { return {
         "view": ["watchViewHandler"],

package/dist/esm/card-manager_3.entry.js

@@ -5,8 +5,8 @@
  */
 import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-164d485a.js';
 import { g as getLocaleComponentStrings, l as loadModules } from './locale-25a5ae3e.js';
-import { q as queryFeaturesByID, g as getLayerOrTable, c as goToSelection, e as queryAllIds, f as queryFeatureIds, i as queryFeaturesByGlobalID } from './mapViewUtils-257bc9b3.js';
-import { d as downloadCSV } from './downloadUtils-985dcd1c.js';
+import { q as queryFeaturesByID, g as getLayerOrTable, c as goToSelection, e as queryAllIds, f as queryFeatureIds, i as queryFeaturesByGlobalID } from './mapViewUtils-a177d4f9.js';
+import { d as downloadCSV } from './downloadUtils-20d22198.js';
 import './esri-loader-eda07632.js';
 import './_commonjsHelpers-d5f9d613.js';
 import './interfaces-586e863c.js';
@@ -172,6 +172,7 @@ const LayerTable = class {
         this.showNewestFirst = undefined;
         this.zoomAndScrollToSelected = undefined;
         this._controlsThatFit = undefined;
+        this._csvExporting = false;
         this._fetchingData = false;
         this._filterActive = false;
         this._filterOpen = false;
@@ -448,8 +449,8 @@ const LayerTable = class {
             if (cur && !cur.isOverflow) {
                 prev.push(cur.isDanger ?
                     this._getDangerAction(cur.icon, cur.label, cur.func, cur.disabled) :
-                    cur.isSublist ? (h("calcite-dropdown", { closeOnSelectDisabled: true, id: this._getId(cur.icon), onCalciteDropdownBeforeClose: () => this._forceShowHide(), ref: (el) => this._showHideDropdown = el }, this._getAction(cur.active, this._showHideOpen ? "chevron-down" : cur.icon, cur.indicator, cur.label, cur.func, cur.disabled, "trigger"), this._showHideOpen ? this._getFieldlist() : undefined)) :
-                        this._getAction(cur.active, cur.icon, cur.indicator, cur.label, cur.func, cur.disabled));
+                    cur.isSublist ? (h("calcite-dropdown", { closeOnSelectDisabled: true, id: this._getId(cur.icon), onCalciteDropdownBeforeClose: () => this._forceShowHide(), ref: (el) => this._showHideDropdown = el }, this._getAction(cur.active, this._showHideOpen ? "chevron-down" : cur.icon, cur.indicator, cur.label, cur.func, cur.disabled, cur.loading, "trigger"), this._showHideOpen ? this._getFieldlist() : undefined)) :
+                        this._getAction(cur.active, cur.icon, cur.indicator, cur.label, cur.func, cur.disabled, cur.loading));
             }
             return prev;
         }, []);
@@ -601,6 +602,7 @@ const LayerTable = class {
                     indicator: false,
                     func: () => void this._exportToCSV(),
                     label: this._translations.exportCSV,
+                    loading: this._csvExporting,
                     disabled: featuresEmpty,
                     isOverflow: false
                 } : undefined, {
@@ -785,7 +787,7 @@ const LayerTable = class {
     _getDropdown(id) {
         const dropdownItems = this._getDropdownItems();
         return dropdownItems.length > 0 ? (h("calcite-dropdown", { closeOnSelectDisabled: true, disabled: this._layer === undefined, id: "solutions-more", onCalciteDropdownBeforeClose: () => this._forceShowHide(), ref: (el) => this._moreDropdown = el }, h("calcite-action", { appearance: "solid", id: id, label: "", onClick: () => this._closeShowHide(), slot: "trigger", text: "" }, h("calcite-button", { appearance: "transparent", iconEnd: "chevron-down", kind: "neutral" }, this._translations.more)), h("calcite-dropdown-group", { "selection-mode": "none" }, dropdownItems.map(item => {
-            return (h("calcite-dropdown-group", { class: item.disabled ? "disabled" : "", selectionMode: item.disabled ? "none" : "single" }, h("calcite-dropdown-item", { iconStart: item.isSublist && this._showHideOpen ? "chevron-down" : item.icon, id: "solutions-subset-list", onClick: item.func }, item.label)));
+            return (h("calcite-dropdown-group", { class: item.disabled ? "disabled" : "", selectionMode: item.disabled ? "none" : "single" }, h("calcite-dropdown-item", { disabled: item.loading, iconStart: item.isSublist && this._showHideOpen ? "chevron-down" : item.loading ? "" : item.icon, id: "solutions-subset-list", onClick: item.func }, item.loading ? (h("div", { class: "display-flex" }, h("calcite-loader", { inline: true, label: item.label, scale: "m" }), item.label)) : item.label)));
         })), this._showHideOpen ? this._getFieldlist() : undefined)) : undefined;
     }
     /**
@@ -807,9 +809,9 @@ const LayerTable = class {
      *
      * @returns VNode The node representing the DOM element that will contain the action
      */
-    _getAction(active, icon, indicator, label, func, disabled, slot) {
+    _getAction(active, icon, indicator, label, func, disabled, loading, slot) {
         const _disabled = this._layer === undefined ? true : disabled;
-        return (h("div", { class: "display-flex", id: this._getId(icon), slot: slot }, h("calcite-action", { active: active, appearance: "solid", disabled: _disabled, icon: icon, id: icon, indicator: indicator, label: label, onClick: func, text: label, textEnabled: true }), this._getToolTip("bottom", icon, label)));
+        return (h("div", { class: "display-flex", id: this._getId(icon), slot: slot }, h("calcite-action", { active: active, appearance: "solid", disabled: _disabled, icon: icon, id: icon, indicator: indicator, label: label, loading: loading, onClick: func, text: label, textEnabled: true }), this._getToolTip("bottom", icon, label)));
     }
     /**
      * Get an action and tooltip for share
@@ -1263,13 +1265,9 @@ const LayerTable = class {
         const hitTestResult = await this.mapView.hitTest(evt.screenPoint, opts);
         if (hitTestResult.results.length > 0) {
             hitTestResult.results.forEach((result) => {
-                this._clearSelection();
                 const id = result.graphic.getObjectId();
                 const index = this._table.highlightIds.indexOf(id);
-                if (index > -1) {
-                    this._table.highlightIds.removeAt(index);
-                }
-                else {
+                if (index < 0) {
                     this._table.highlightIds.add(id);
                 }
             });
@@ -1277,6 +1275,9 @@ const LayerTable = class {
                 this._table.filterBySelection();
             }
         }
+        else {
+            this._clearSelection();
+        }
     }
     /**
      * Select or deselect all rows
@@ -1365,11 +1366,26 @@ const LayerTable = class {
             }
             return prev;
         }, []);
-        void downloadCSV(null, //???
+        this._updateToolInfoLoading("export", true);
+        this._csvExporting = true;
+        await downloadCSV(null, //???
         exportInfos, false, // formatUsingLayerPopup
         false, // removeDuplicates
         true, // addColumnTitle
         fields, true);
+        this._updateToolInfoLoading("export", false);
+        this._csvExporting = false;
+    }
+    /**
+     * Set the loading prop in the stored toolInfos
+     */
+    _updateToolInfoLoading(name, isLoading) {
+        this._toolInfos.some(tool => {
+            if ((tool === null || tool === void 0 ? void 0 : tool.icon) === name) {
+                tool.loading = isLoading;
+                return true;
+            }
+        });
     }
     /**
      * Refreshes the table and maintains the curent scroll position

package/dist/esm/crowdsource-manager.entry.js

@@ -6,7 +6,7 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-164d485a.js';
 import { g as getLocaleComponentStrings } from './locale-25a5ae3e.js';
 import { E as ELayoutMode } from './interfaces-586e863c.js';
-import { g as getLayerOrTable } from './mapViewUtils-257bc9b3.js';
+import { g as getLayerOrTable } from './mapViewUtils-a177d4f9.js';
 import './esri-loader-eda07632.js';
 import './_commonjsHelpers-d5f9d613.js';
 

package/dist/esm/crowdsource-reporter.entry.js

@@ -5,7 +5,7 @@
  */
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-164d485a.js';
 import { l as loadModules, g as getLocaleComponentStrings } from './locale-25a5ae3e.js';
-import { a as getAllLayers, b as getFeatureLayerView, h as highlightFeatures, g as getLayerOrTable, q as queryFeaturesByID } from './mapViewUtils-257bc9b3.js';
+import { a as getAllLayers, b as getFeatureLayerView, h as highlightFeatures, g as getLayerOrTable, q as queryFeaturesByID } from './mapViewUtils-a177d4f9.js';
 import './esri-loader-eda07632.js';
 import './_commonjsHelpers-d5f9d613.js';
 import './interfaces-586e863c.js';
@@ -16,6 +16,8 @@ const CrowdsourceReporter = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.togglePanel = createEvent(this, "togglePanel", 7);
+        //HARDCODED IN EN
+        this._noLayerToDisplayErrorMsg = "Web map does not contain any editable layers.";
         this.description = undefined;
         this.isMobile = undefined;
         this.enableAnonymousAccess = undefined;
@@ -28,6 +30,8 @@ const CrowdsourceReporter = class {
         this.mapView = undefined;
         this.layerId = undefined;
         this.objectId = undefined;
+        this.center = undefined;
+        this.level = undefined;
         this.reportButtonText = undefined;
         this.reportsHeader = undefined;
         this.reportSubmittedMessage = undefined;
@@ -159,7 +163,7 @@ const CrowdsourceReporter = class {
      */
     getLayerListFlowItem() {
         return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this.reportsHeader }, this.isMobile && this.getActionToExpandCollapsePanel(), this._hasValidLayers && this.enableNewReports &&
-            h("calcite-button", { appearance: "solid", onClick: this.navigateToChooseCategory.bind(this), slot: "footer", width: "full" }, this.reportButtonText), h("calcite-panel", { "full-height": true, "full-width": true }, h("layer-list", { class: "height-full", layers: this.layers, mapView: this.mapView, noLayerErrorMsg: this._translations.noLayerToDisplayErrorMsg, onLayerSelect: this.displayFeaturesList.bind(this), onLayersListLoaded: this.layerListLoaded.bind(this), ref: el => this._layerList = el, showFeatureCount: true, showNextIcon: true }))));
+            h("calcite-button", { appearance: "solid", onClick: this.navigateToChooseCategory.bind(this), slot: "footer", width: "full" }, this.reportButtonText), h("calcite-panel", { "full-height": true, "full-width": true }, h("layer-list", { class: "height-full", layers: this.layers, mapView: this.mapView, noLayerErrorMsg: this._noLayerToDisplayErrorMsg, onLayerSelect: this.displayFeaturesList.bind(this), onLayersListLoaded: this.layerListLoaded.bind(this), ref: el => this._layerList = el, showFeatureCount: true, showNextIcon: true }))));
     }
     /**
      * Get the layer list for creating a report
@@ -167,7 +171,7 @@ const CrowdsourceReporter = class {
      * @protected
      */
     getChooseCategoryFlowItem() {
-        return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._translations.createReportHeader, onCalciteFlowItemBack: this.backFromSelectedPanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", disabled: !this._selectedLayerId, onClick: this.navigateToCreateFeature.bind(this), width: "full" }, this._translations.next), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromSelectedPanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.chooseCategoryMsg)), h("layer-list", { class: "height-full", layers: this.layers, mapView: this.mapView, noLayerErrorMsg: this._translations.noLayerToDisplayErrorMsg, onLayerSelect: this.highlightSelectedLayer.bind(this), showFeatureCount: false, showNextIcon: false }))));
+        return (h("calcite-flow-item", { collapsed: this.isMobile && this._sidePanelCollapsed, heading: this._translations.createReportHeader, onCalciteFlowItemBack: this.backFromSelectedPanel.bind(this) }, this.isMobile && this.getActionToExpandCollapsePanel(), h("div", { class: "width-full", slot: "footer" }, h("calcite-button", { appearance: "solid", class: "footer-top-button footer-button", disabled: !this._selectedLayerId, onClick: this.navigateToCreateFeature.bind(this), width: "full" }, this._translations.next), h("calcite-button", { appearance: "outline", class: "footer-button", onClick: this.backFromSelectedPanel.bind(this), width: "full" }, this._translations.cancel)), h("calcite-panel", { "full-height": true, "full-width": true }, h("calcite-notice", { class: "notice-msg", icon: "lightbulb", kind: "success", open: true }, h("div", { slot: "message" }, this._translations.chooseCategoryMsg)), h("layer-list", { class: "height-full", layers: this.layers, mapView: this.mapView, noLayerErrorMsg: this._noLayerToDisplayErrorMsg, onLayerSelect: this.highlightSelectedLayer.bind(this), showFeatureCount: false, showNextIcon: false }))));
     }
     /**
      * Get Feature create form of the selected feature layer
@@ -513,11 +517,17 @@ const CrowdsourceReporter = class {
      * @protected
      */
     async loadFeatureFromURLParams() {
+        if (this.center && this.level) {
+            await this.mapView.goTo({
+                center: this.center.split(';').map(Number),
+                zoom: this.level
+            });
+        }
         if (this.layerId && this.objectId) {
             const layer = await getLayerOrTable(this.mapView, this.layerId);
             if (layer) {
                 // only query if we have some ids...query with no ids will result in all features being returned
-                const featureSet = await queryFeaturesByID([Number(this.objectId)], layer, [], false, this.mapView.spatialReference);
+                const featureSet = await queryFeaturesByID([Number(this.objectId)], layer, [], true, this.mapView.spatialReference);
                 if (featureSet.length) {
                     //update the selectedFeature
                     this._selectedFeature = featureSet;
@@ -529,6 +539,7 @@ const CrowdsourceReporter = class {
                     else {
                         this._flowItems = [...this._flowItems];
                     }
+                    await this.highlightOnMap(featureSet[0]);
                 }
             }
         }

package/dist/esm/{downloadUtils-985dcd1c.js → downloadUtils-20d22198.js}

@@ -6,7 +6,7 @@
 import { c as createCommonjsModule, g as getDefaultExportFromCjs } from './_commonjsHelpers-d5f9d613.js';
 import { a as getAssetPath } from './index-164d485a.js';
 import { l as loadModules } from './locale-25a5ae3e.js';
-import { q as queryFeaturesByID } from './mapViewUtils-257bc9b3.js';
+import { q as queryFeaturesByID } from './mapViewUtils-a177d4f9.js';
 import './solution-resource-7b8d302d.js';
 import './index-a1e91462.js';
 import { _ as __assign$1, r as request, c as cleanUrl, g as getJson } from './restHelpersGet-af032ab2.js';
@@ -1508,7 +1508,7 @@ function(t){var e=function(t){for(var e=t.length,r=new Uint8Array(e),n=0;n<e;n++
  * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
  * ====================================================================
  */
-function(t){function e(){return (n.canvg?Promise.resolve(n.canvg):import('./index.es-03d8386e.js')).catch((function(t){return Promise.reject(new Error("Could not load canvg: "+t))})).then((function(t){return t.default?t.default:t}))}E.API.addSvgAsImage=function(t,r,n,i,o,s,c,u){if(isNaN(r)||isNaN(n))throw a.error("jsPDF.addSvgAsImage: Invalid coordinates",arguments),new Error("Invalid coordinates passed to jsPDF.addSvgAsImage");if(isNaN(i)||isNaN(o))throw a.error("jsPDF.addSvgAsImage: Invalid measurements",arguments),new Error("Invalid measurements (width and/or height) passed to jsPDF.addSvgAsImage");var h=document.createElement("canvas");h.width=i,h.height=o;var l=h.getContext("2d");l.fillStyle="#fff",l.fillRect(0,0,h.width,h.height);var f={ignoreMouse:!0,ignoreAnimation:!0,ignoreDimensions:!0},d=this;return e().then((function(e){return e.fromString(l,t,f)}),(function(){return Promise.reject(new Error("Could not load canvg."))})).then((function(t){return t.render(f)})).then((function(){d.addImage(h.toDataURL("image/jpeg",1),r,n,i,o,c,u);}))};}(),E.API.putTotalPages=function(t){var e,r=0;parseInt(this.internal.getFont().id.substr(1),10)<15?(e=new RegExp(t,"g"),r=this.internal.getNumberOfPages()):(e=new RegExp(this.pdfEscape16(t,this.internal.getFont()),"g"),r=this.pdfEscape16(this.internal.getNumberOfPages()+"",this.internal.getFont()));for(var n=1;n<=this.internal.getNumberOfPages();n++)for(var i=0;i<this.internal.pages[n].length;i++)this.internal.pages[n][i]=this.internal.pages[n][i].replace(e,r);return this},E.API.viewerPreferences=function(e,r){var n;e=e||{},r=r||!1;var i,a,o,s={HideToolbar:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.3},HideMenubar:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.3},HideWindowUI:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.3},FitWindow:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.3},CenterWindow:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.3},DisplayDocTitle:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.4},NonFullScreenPageMode:{defaultValue:"UseNone",value:"UseNone",type:"name",explicitSet:!1,valueSet:["UseNone","UseOutlines","UseThumbs","UseOC"],pdfVersion:1.3},Direction:{defaultValue:"L2R",value:"L2R",type:"name",explicitSet:!1,valueSet:["L2R","R2L"],pdfVersion:1.3},ViewArea:{defaultValue:"CropBox",value:"CropBox",type:"name",explicitSet:!1,valueSet:["MediaBox","CropBox","TrimBox","BleedBox","ArtBox"],pdfVersion:1.4},ViewClip:{defaultValue:"CropBox",value:"CropBox",type:"name",explicitSet:!1,valueSet:["MediaBox","CropBox","TrimBox","BleedBox","ArtBox"],pdfVersion:1.4},PrintArea:{defaultValue:"CropBox",value:"CropBox",type:"name",explicitSet:!1,valueSet:["MediaBox","CropBox","TrimBox","BleedBox","ArtBox"],pdfVersion:1.4},PrintClip:{defaultValue:"CropBox",value:"CropBox",type:"name",explicitSet:!1,valueSet:["MediaBox","CropBox","TrimBox","BleedBox","ArtBox"],pdfVersion:1.4},PrintScaling:{defaultValue:"AppDefault",value:"AppDefault",type:"name",explicitSet:!1,valueSet:["AppDefault","None"],pdfVersion:1.6},Duplex:{defaultValue:"",value:"none",type:"name",explicitSet:!1,valueSet:["Simplex","DuplexFlipShortEdge","DuplexFlipLongEdge","none"],pdfVersion:1.7},PickTrayByPDFSize:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.7},PrintPageRange:{defaultValue:"",value:"",type:"array",explicitSet:!1,valueSet:null,pdfVersion:1.7},NumCopies:{defaultValue:1,value:1,type:"integer",explicitSet:!1,valueSet:null,pdfVersion:1.7}},c=Object.keys(s),u=[],h=0,l=0,f=0;function d(t,e){var r,n=!1;for(r=0;r<t.length;r+=1)t[r]===e&&(n=!0);return n}if(void 0===this.internal.viewerpreferences&&(this.internal.viewerpreferences={},this.internal.viewerpreferences.configuration=JSON.parse(JSON.stringify(s)),this.internal.viewerpreferences.isSubscribed=!1),n=this.internal.viewerpreferences.configuration,"reset"===e||!0===r){var p=c.length;for(f=0;f<p;f+=1)n[c[f]].value=n[c[f]].defaultValue,n[c[f]].explicitSet=!1;}if("object"===t(e))for(a in e)if(o=e[a],d(c,a)&&void 0!==o){if("boolean"===n[a].type&&"boolean"==typeof o)n[a].value=o;else if("name"===n[a].type&&d(n[a].valueSet,o))n[a].value=o;else if("integer"===n[a].type&&Number.isInteger(o))n[a].value=o;else if("array"===n[a].type){for(h=0;h<o.length;h+=1)if(i=!0,1===o[h].length&&"number"==typeof o[h][0])u.push(String(o[h]-1));else if(o[h].length>1){for(l=0;l<o[h].length;l+=1)"number"!=typeof o[h][l]&&(i=!1);!0===i&&u.push([o[h][0]-1,o[h][1]-1].join(" "));}n[a].value="["+u.join(" ")+"]";}else n[a].value=n[a].defaultValue;n[a].explicitSet=!0;}return !1===this.internal.viewerpreferences.isSubscribed&&(this.internal.events.subscribe("putCatalog",(function(){var t,e=[];for(t in n)!0===n[t].explicitSet&&("name"===n[t].type?e.push("/"+t+" /"+n[t].value):e.push("/"+t+" "+n[t].value));0!==e.length&&this.internal.write("/ViewerPreferences\n<<\n"+e.join("\n")+"\n>>");})),this.internal.viewerpreferences.isSubscribed=!0),this.internal.viewerpreferences.configuration=n,this},
+function(t){function e(){return (n.canvg?Promise.resolve(n.canvg):import('./index.es-8b85f68d.js')).catch((function(t){return Promise.reject(new Error("Could not load canvg: "+t))})).then((function(t){return t.default?t.default:t}))}E.API.addSvgAsImage=function(t,r,n,i,o,s,c,u){if(isNaN(r)||isNaN(n))throw a.error("jsPDF.addSvgAsImage: Invalid coordinates",arguments),new Error("Invalid coordinates passed to jsPDF.addSvgAsImage");if(isNaN(i)||isNaN(o))throw a.error("jsPDF.addSvgAsImage: Invalid measurements",arguments),new Error("Invalid measurements (width and/or height) passed to jsPDF.addSvgAsImage");var h=document.createElement("canvas");h.width=i,h.height=o;var l=h.getContext("2d");l.fillStyle="#fff",l.fillRect(0,0,h.width,h.height);var f={ignoreMouse:!0,ignoreAnimation:!0,ignoreDimensions:!0},d=this;return e().then((function(e){return e.fromString(l,t,f)}),(function(){return Promise.reject(new Error("Could not load canvg."))})).then((function(t){return t.render(f)})).then((function(){d.addImage(h.toDataURL("image/jpeg",1),r,n,i,o,c,u);}))};}(),E.API.putTotalPages=function(t){var e,r=0;parseInt(this.internal.getFont().id.substr(1),10)<15?(e=new RegExp(t,"g"),r=this.internal.getNumberOfPages()):(e=new RegExp(this.pdfEscape16(t,this.internal.getFont()),"g"),r=this.pdfEscape16(this.internal.getNumberOfPages()+"",this.internal.getFont()));for(var n=1;n<=this.internal.getNumberOfPages();n++)for(var i=0;i<this.internal.pages[n].length;i++)this.internal.pages[n][i]=this.internal.pages[n][i].replace(e,r);return this},E.API.viewerPreferences=function(e,r){var n;e=e||{},r=r||!1;var i,a,o,s={HideToolbar:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.3},HideMenubar:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.3},HideWindowUI:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.3},FitWindow:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.3},CenterWindow:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.3},DisplayDocTitle:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.4},NonFullScreenPageMode:{defaultValue:"UseNone",value:"UseNone",type:"name",explicitSet:!1,valueSet:["UseNone","UseOutlines","UseThumbs","UseOC"],pdfVersion:1.3},Direction:{defaultValue:"L2R",value:"L2R",type:"name",explicitSet:!1,valueSet:["L2R","R2L"],pdfVersion:1.3},ViewArea:{defaultValue:"CropBox",value:"CropBox",type:"name",explicitSet:!1,valueSet:["MediaBox","CropBox","TrimBox","BleedBox","ArtBox"],pdfVersion:1.4},ViewClip:{defaultValue:"CropBox",value:"CropBox",type:"name",explicitSet:!1,valueSet:["MediaBox","CropBox","TrimBox","BleedBox","ArtBox"],pdfVersion:1.4},PrintArea:{defaultValue:"CropBox",value:"CropBox",type:"name",explicitSet:!1,valueSet:["MediaBox","CropBox","TrimBox","BleedBox","ArtBox"],pdfVersion:1.4},PrintClip:{defaultValue:"CropBox",value:"CropBox",type:"name",explicitSet:!1,valueSet:["MediaBox","CropBox","TrimBox","BleedBox","ArtBox"],pdfVersion:1.4},PrintScaling:{defaultValue:"AppDefault",value:"AppDefault",type:"name",explicitSet:!1,valueSet:["AppDefault","None"],pdfVersion:1.6},Duplex:{defaultValue:"",value:"none",type:"name",explicitSet:!1,valueSet:["Simplex","DuplexFlipShortEdge","DuplexFlipLongEdge","none"],pdfVersion:1.7},PickTrayByPDFSize:{defaultValue:!1,value:!1,type:"boolean",explicitSet:!1,valueSet:[!0,!1],pdfVersion:1.7},PrintPageRange:{defaultValue:"",value:"",type:"array",explicitSet:!1,valueSet:null,pdfVersion:1.7},NumCopies:{defaultValue:1,value:1,type:"integer",explicitSet:!1,valueSet:null,pdfVersion:1.7}},c=Object.keys(s),u=[],h=0,l=0,f=0;function d(t,e){var r,n=!1;for(r=0;r<t.length;r+=1)t[r]===e&&(n=!0);return n}if(void 0===this.internal.viewerpreferences&&(this.internal.viewerpreferences={},this.internal.viewerpreferences.configuration=JSON.parse(JSON.stringify(s)),this.internal.viewerpreferences.isSubscribed=!1),n=this.internal.viewerpreferences.configuration,"reset"===e||!0===r){var p=c.length;for(f=0;f<p;f+=1)n[c[f]].value=n[c[f]].defaultValue,n[c[f]].explicitSet=!1;}if("object"===t(e))for(a in e)if(o=e[a],d(c,a)&&void 0!==o){if("boolean"===n[a].type&&"boolean"==typeof o)n[a].value=o;else if("name"===n[a].type&&d(n[a].valueSet,o))n[a].value=o;else if("integer"===n[a].type&&Number.isInteger(o))n[a].value=o;else if("array"===n[a].type){for(h=0;h<o.length;h+=1)if(i=!0,1===o[h].length&&"number"==typeof o[h][0])u.push(String(o[h]-1));else if(o[h].length>1){for(l=0;l<o[h].length;l+=1)"number"!=typeof o[h][l]&&(i=!1);!0===i&&u.push([o[h][0]-1,o[h][1]-1].join(" "));}n[a].value="["+u.join(" ")+"]";}else n[a].value=n[a].defaultValue;n[a].explicitSet=!0;}return !1===this.internal.viewerpreferences.isSubscribed&&(this.internal.events.subscribe("putCatalog",(function(){var t,e=[];for(t in n)!0===n[t].explicitSet&&("name"===n[t].type?e.push("/"+t+" /"+n[t].value):e.push("/"+t+" "+n[t].value));0!==e.length&&this.internal.write("/ViewerPreferences\n<<\n"+e.join("\n")+"\n>>");})),this.internal.viewerpreferences.isSubscribed=!0),this.internal.viewerpreferences.configuration=n,this},
 /** ====================================================================
  * @license
  * jsPDF XMP metadata plugin

package/dist/esm/{index.es-03d8386e.js → index.es-8b85f68d.js}

@@ -4,11 +4,11 @@
  * http://www.apache.org/licenses/LICENSE-2.0
  */
 import { a as commonjsGlobal, c as createCommonjsModule, g as getDefaultExportFromCjs } from './_commonjsHelpers-d5f9d613.js';
-import { _ as _typeof_1 } from './downloadUtils-985dcd1c.js';
+import { _ as _typeof_1 } from './downloadUtils-20d22198.js';
 import './index-164d485a.js';
 import './locale-25a5ae3e.js';
 import './esri-loader-eda07632.js';
-import './mapViewUtils-257bc9b3.js';
+import './mapViewUtils-a177d4f9.js';
 import './interfaces-586e863c.js';
 import './solution-resource-7b8d302d.js';
 import './index-a1e91462.js';

package/dist/esm/instant-apps-ckeditor-wrapper_3.entry.js

@@ -200,13 +200,13 @@ const InstantAppsLanguageTranslatorItem = class {
         return (h("div", { class: `${CSS$1.section}${selected}` }, this.renderItemHeader(EInputType.User, label, uid), this.handleInputRender(EInputType.User, value, uid)));
     }
     renderTranslatedLanguageSection() {
-        var _a;
+        var _a, _b;
         const uiDataItem = this.getUIDataItem();
         const uid = this.setting.id;
         const locale = store.get('currentLanguage');
         const data = store.get('portalItemResourceT9n');
-        const label = this.translatedLanguageLabels[this.fieldName];
-        const value = (_a = data === null || data === void 0 ? void 0 : data[locale]) === null || _a === void 0 ? void 0 : _a[uid];
+        const label = (_a = this.translatedLanguageLabels) === null || _a === void 0 ? void 0 : _a[this.fieldName];
+        const value = (_b = data === null || data === void 0 ? void 0 : data[locale]) === null || _b === void 0 ? void 0 : _b[uid];
         const selected = (uiDataItem === null || uiDataItem === void 0 ? void 0 : uiDataItem.selected) ? ` ${CSS$1.selected}` : '';
         return (h("div", { class: `${CSS$1.section}${selected}` }, this.renderItemHeader(EInputType.Translation, label, uid), this.handleInputRender(EInputType.Translation, value, uid)));
     }
@@ -221,13 +221,14 @@ const InstantAppsLanguageTranslatorItem = class {
         return content === null || content === void 0 ? void 0 : content.map(contentItem => (contentItem.hasOwnProperty('content') ? this.renderNestedInputs(inputType, contentItem) : this.renderNestedInput(inputType, contentItem)));
     }
     renderNestedInput(inputType, contentItem) {
+        var _a;
         const locale = store.get('currentLanguage');
         const data = store.get('portalItemResourceT9n');
         const uid = contentItem === null || contentItem === void 0 ? void 0 : contentItem.id;
         const localeData = data === null || data === void 0 ? void 0 : data[locale];
         const translatedValue = localeData === null || localeData === void 0 ? void 0 : localeData[uid];
         const { label, value, id } = contentItem;
-        const inputLabel = inputType === EInputType.Translation ? this.translatedLanguageLabels[id] : label;
+        const inputLabel = inputType === EInputType.Translation ? (_a = this.translatedLanguageLabels) === null || _a === void 0 ? void 0 : _a[id] : label;
         const isUser = inputType === EInputType.User;
         const inputValue = isUser ? value : translatedValue;
         return (h("div", { class: CSS$1.nestedInput }, this.renderItemHeader(inputType, inputLabel, uid, contentItem), this.renderInput(inputType, inputValue, uid, contentItem)));

package/dist/esm/instant-apps-export.entry.js

@@ -108,7 +108,7 @@ const printStyling = `
     flex-flow: row wrap;
   }
 
-  .instant-apps-export-print .esri-widget > *:not(.instant-apps-export-print__scale-bar-container > *) {
+  .instant-apps-export-print .esri-widget > *:not(.esri-scale-bar.esri-widget > *) {
     background: #fff;
     color: #323232;
   }
@@ -193,6 +193,10 @@ const printStyling = `
     left: 15px;
   }
 
+  .instant-apps-export-print__scale-bar-container .esri-scale-bar__label {
+    font-size: 10px;
+  }
+
   .instant-apps-export-print__scale-bar-container .esri-scale-bar__bar-container:nth-child(1n+3) {
     display: none;
   }
@@ -427,8 +431,7 @@ const InstantAppsExport = class {
         return (h("div", { ref: (el) => (this.printContainerEl = el) }, h("div", { class: CSS.print.base, ref: (el) => (this.printEl = el) }, printMap, legend, h("div", { class: CSS.print.contentContainer }, popup, extraContent))));
     }
     renderPrintMap() {
-        const scaleBar = this.renderScaleBar();
-        return (h("div", { class: CSS.print.viewContainer, ref: (el) => (this.viewContainerEl = el) }, h("div", { class: CSS.print.viewWrapper, ref: (el) => (this.viewWrapperEl = el) }, this.headerTitle ? h("instant-apps-header", { titleText: this.headerTitle, backgroundColor: "#fff", textColor: "#323232" }) : null, h("img", { class: CSS.print.view, ref: (el) => (this.viewEl = el) }), scaleBar)));
+        return (h("div", { class: CSS.print.viewContainer, ref: (el) => (this.viewContainerEl = el) }, h("div", { class: CSS.print.viewWrapper, ref: (el) => (this.viewWrapperEl = el) }, this.headerTitle ? h("instant-apps-header", { titleText: this.headerTitle, backgroundColor: "#fff", textColor: "#323232" }) : null, h("img", { class: CSS.print.view, ref: (el) => (this.viewEl = el) }), h("div", { class: CSS.print.scaleBarContainer, ref: this.handleScaleBarContainerEl.bind(this) }))));
     }
     renderLegend() {
         return h("div", { class: CSS.print.legendContainer, ref: (el) => (this.legendContainerEl = el) });
@@ -436,9 +439,6 @@ const InstantAppsExport = class {
     renderCompass() {
         return h("div", { class: CSS.print.compassContainer, ref: (el) => (this.compassContainerEl = el) });
     }
-    renderScaleBar() {
-        return h("div", { class: CSS.print.scaleBarContainer, ref: (el) => (this.scaleBarContainerEl = el) });
-    }
     renderPopup() {
         return (h("div", { class: CSS.print.popupContainer, ref: (el) => (this.popupContainerEl = el) }, h("div", { ref: (el) => (this.popupTitleEl = el), class: CSS.print.popupTitle }), h("div", { ref: (el) => (this.popupContentEl = el), class: CSS.print.popupContent })));
     }
@@ -582,7 +582,6 @@ const InstantAppsExport = class {
     handleWidgetCreation() {
         this.handleLegendCreation();
         this.handleCompassCreation();
-        this.handleScaleBarCreation();
     }
     handleLegendCreation() {
         var _a, _b;
@@ -637,24 +636,12 @@ const InstantAppsExport = class {
             this.compass = new Compass({ container, view });
         });
     }
-    handleScaleBarCreation() {
-        var _a, _b;
-        if (this.showScaleBar && this.includeMap && this.view != null && this.view.type === '2d' && this.scaleBarContainerEl != null) {
-            const map = this.view.map;
-            const scaleBarMap = (_b = (_a = this.scaleBar) === null || _a === void 0 ? void 0 : _a.view) === null || _b === void 0 ? void 0 : _b.map;
-            const checkId = (map === null || map === void 0 ? void 0 : map.portalItem.id) === (scaleBarMap === null || scaleBarMap === void 0 ? void 0 : scaleBarMap.portalItem.id) && this.scaleBarContainerEl.innerHTML;
-            if (!checkId) {
-                this.updateScaleBar();
-            }
-        }
-    }
     updateScaleBar() {
         var _a;
         (_a = this.view) === null || _a === void 0 ? void 0 : _a.when(async (view) => {
             var _a;
             (_a = this.scaleBar) === null || _a === void 0 ? void 0 : _a.destroy();
             this.scaleBar = null;
-            this.scaleBarContainerEl.innerHTML = '';
             const [ScaleBar] = await loadModules(['esri/widgets/ScaleBar']);
             this.scaleBar = new ScaleBar({ container: this.scaleBarContainerEl, unit: 'dual', view });
         });
@@ -835,7 +822,7 @@ const InstantAppsExport = class {
     }
     handleScaleBarSize() {
         var _a;
-        if (((_a = this.view) === null || _a === void 0 ? void 0 : _a.type) === '2d') {
+        if (this.showScaleBar && ((_a = this.view) === null || _a === void 0 ? void 0 : _a.type) === '2d') {
             if (this.scaleBarContainerEl != null) {
                 const topBar = this.scaleBarContainerEl.querySelector('.esri-scale-bar__line--top');
                 const bottomBar = this.scaleBarContainerEl.querySelector('.esri-scale-bar__line--bottom');
@@ -845,7 +832,7 @@ const InstantAppsExport = class {
         }
     }
     setScalebarWidth(bar, position) {
-        if (this.view != null && bar != null && this.screenshot != null) {
+        if (bar != null && this.screenshot != null) {
             const width = this.screenshot.data.width / 2;
             const barWidth = Number(bar.style.width.replace('px', ''));
             const widthPercentage = (barWidth / width) * 100;
@@ -857,6 +844,18 @@ const InstantAppsExport = class {
         (_a = this.screenshotPreview) === null || _a === void 0 ? void 0 : _a.remove();
         (_b = this.screenshotStyle) === null || _b === void 0 ? void 0 : _b.remove();
     }
+    handleScaleBarContainerEl(el) {
+        var _a, _b, _c;
+        if (this.showScaleBar && ((_a = this.view) === null || _a === void 0 ? void 0 : _a.type) === '2d') {
+            const map = this.view.map;
+            const scaleBarMap = (_c = (_b = this.scaleBar) === null || _b === void 0 ? void 0 : _b.view) === null || _c === void 0 ? void 0 : _c.map;
+            this.scaleBarContainerEl = el;
+            const checkId = (map === null || map === void 0 ? void 0 : map.portalItem.id) === (scaleBarMap === null || scaleBarMap === void 0 ? void 0 : scaleBarMap.portalItem.id);
+            if (!checkId) {
+                this.updateScaleBar();
+            }
+        }
+    }
     get el() { return getElement(this); }
     static get watchers() { return {
         "includeMap": ["watchIncludeMap"]

package/dist/esm/instant-apps-header.entry.js

@@ -11,7 +11,7 @@ import { g as getFontFamily } from './styles-367380b5.js';
 import './esri-loader-eda07632.js';
 import './_commonjsHelpers-d5f9d613.js';
 
-const instantAppsHeaderCss = ":host{--instant-apps-header-height:auto;--instant-apps-header-min-height:50px;--instant-apps-header-title-text-link-decoration:underline;--instant-apps-header-height--logo-scale--s:55px;--instant-apps-header-logo-width--logo-scale--s:35px;--instant-apps-header-logo-height--logo-scale--s:35px;--instant-apps-header-height--logo-scale--m:70px;--instant-apps-header-logo-width--logo-scale--m:50px;--instant-apps-header-logo-height--logo-scale--m:50px;--instant-apps-header-height--logo-scale--l:80px;--instant-apps-header-logo-width--logo-scale--l:60px;--instant-apps-header-logo-height--logo-scale--l:60px;width:100%}:host .instant-apps-header--standard{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;width:100%;height:var(--instant-apps-header-height);background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-1);font-family:var(--calcite-sans-family);min-height:var(--instant-apps-header-min-height)}:host .instant-apps-header--standard .instant-apps-header__header-container{display:flex;align-items:center;width:100%;height:inherit}:host .instant-apps-header--standard .instant-apps-header__header-container slot{display:flex;height:inherit}:host .instant-apps-header--standard .instant-apps-header__header-container ::slotted(*){display:flex;min-height:var(--instant-apps-header-min-height);height:var(--instant-apps-header-height)}:host .instant-apps-header--standard .instant-apps-header__header-container ::slotted(*) calcite-button{height:100%}:host .instant-apps-header--standard .instant-apps-header__header-content{box-sizing:border-box;display:flex;align-items:center;width:100%;min-width:0;height:inherit;padding:5px 10px}:host .instant-apps-header--standard .instant-apps-header__header-content a{display:flex;align-items:center;-webkit-text-decoration:var(--instant-apps-header-title-text-link-decoration);text-decoration:var(--instant-apps-header-title-text-link-decoration)}:host .instant-apps-header--standard .instant-apps-header__header-content a img{padding-right:0}:host .instant-apps-header--standard .instant-apps-header__header-content img{margin:10px}:host .instant-apps-header--standard .instant-apps-header__header-content h1{margin:0;font-size:1.25rem;color:var(--calcite-color-text-1);font-weight:430;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .instant-apps-header--standard .instant-apps-header__header-content #infoButton{margin-inline-start:10px}:host .instant-apps-header--standard .instant-apps-header__header-content--center{justify-content:center}:host .instant-apps-header--standard .instant-apps-header__header-content--right{justify-content:end}:host .instant-apps-header__logo-height--s{height:var(--instant-apps-header-height--logo-scale--s)}:host .instant-apps-header__logo-height--s .instant-apps-header__header-content h1{font-size:1.125rem}:host .instant-apps-header__logo-scale--s{width:var(--instant-apps-header-logo-width--logo-scale--s);height:var(--instant-apps-header-logo-height--logo-scale--s)}:host .instant-apps-header__logo-height--m{height:var(--instant-apps-header-height--logo-scale--m)}:host .instant-apps-header__logo-scale--m{width:var(--instant-apps-header-logo-width--logo-scale--m);height:var(--instant-apps-header-logo-height--logo-scale--m)}:host .instant-apps-header__logo-height--l{height:var(--instant-apps-header-height--logo-scale--l)}:host .instant-apps-header__logo-height--l .instant-apps-header__header-content h1{font-size:1.375rem}:host .instant-apps-header__logo-scale--l{width:var(--instant-apps-header-logo-width--logo-scale--l);height:var(--instant-apps-header-logo-height--logo-scale--l)}:host .instant-apps-header__logo-height--s,:host .instant-apps-header__logo-height--m,:host .instant-apps-header__logo-height--l{padding-right:10px}:host .instant-apps-header--rtl.instant-apps-header__logo-height--s,:host .instant-apps-header--rtl.instant-apps-header__logo-height--m,:host .instant-apps-header--rtl.instant-apps-header__logo-height--l{padding-right:0;padding-left:10px}";
+const instantAppsHeaderCss = ":host{--instant-apps-header-height:auto;--instant-apps-header-min-height:50px;--instant-apps-header-title-text-link-decoration:underline;--instant-apps-header-height--logo-scale--s:55px;--instant-apps-header-logo-width--logo-scale--s:35px;--instant-apps-header-logo-height--logo-scale--s:35px;--instant-apps-header-height--logo-scale--m:70px;--instant-apps-header-logo-width--logo-scale--m:50px;--instant-apps-header-logo-height--logo-scale--m:50px;--instant-apps-header-height--logo-scale--l:80px;--instant-apps-header-logo-width--logo-scale--l:60px;--instant-apps-header-logo-height--logo-scale--l:60px;width:100%}:host .image.image_resized img{width:100%}:host .instant-apps-header--standard{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;width:100%;height:var(--instant-apps-header-height);background-color:var(--calcite-color-foreground-1);color:var(--calcite-color-text-1);font-family:var(--calcite-sans-family);min-height:var(--instant-apps-header-min-height)}:host .instant-apps-header--standard .instant-apps-header__header-container{display:flex;align-items:center;width:100%;height:inherit}:host .instant-apps-header--standard .instant-apps-header__header-container slot{display:flex;height:inherit}:host .instant-apps-header--standard .instant-apps-header__header-container ::slotted(*){display:flex;min-height:var(--instant-apps-header-min-height);height:var(--instant-apps-header-height)}:host .instant-apps-header--standard .instant-apps-header__header-container ::slotted(*) calcite-button{height:100%}:host .instant-apps-header--standard .instant-apps-header__header-content{box-sizing:border-box;display:flex;align-items:center;width:100%;min-width:0;height:inherit;padding:5px 10px}:host .instant-apps-header--standard .instant-apps-header__header-content a{display:flex;align-items:center;-webkit-text-decoration:var(--instant-apps-header-title-text-link-decoration);text-decoration:var(--instant-apps-header-title-text-link-decoration)}:host .instant-apps-header--standard .instant-apps-header__header-content a img{padding-right:0}:host .instant-apps-header--standard .instant-apps-header__header-content img{margin:10px}:host .instant-apps-header--standard .instant-apps-header__header-content h1{margin:0;font-size:1.25rem;color:var(--calcite-color-text-1);font-weight:430;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host .instant-apps-header--standard .instant-apps-header__header-content #infoButton{margin-inline-start:10px}:host .instant-apps-header--standard .instant-apps-header__header-content--center{justify-content:center}:host .instant-apps-header--standard .instant-apps-header__header-content--right{justify-content:end}:host .instant-apps-header__logo-height--s{height:var(--instant-apps-header-height--logo-scale--s)}:host .instant-apps-header__logo-height--s .instant-apps-header__header-content h1{font-size:1.125rem}:host .instant-apps-header__logo-scale--s{width:var(--instant-apps-header-logo-width--logo-scale--s);height:var(--instant-apps-header-logo-height--logo-scale--s)}:host .instant-apps-header__logo-height--m{height:var(--instant-apps-header-height--logo-scale--m)}:host .instant-apps-header__logo-scale--m{width:var(--instant-apps-header-logo-width--logo-scale--m);height:var(--instant-apps-header-logo-height--logo-scale--m)}:host .instant-apps-header__logo-height--l{height:var(--instant-apps-header-height--logo-scale--l)}:host .instant-apps-header__logo-height--l .instant-apps-header__header-content h1{font-size:1.375rem}:host .instant-apps-header__logo-scale--l{width:var(--instant-apps-header-logo-width--logo-scale--l);height:var(--instant-apps-header-logo-height--logo-scale--l)}:host .instant-apps-header__logo-height--s,:host .instant-apps-header__logo-height--m,:host .instant-apps-header__logo-height--l{padding-right:10px}:host .instant-apps-header--rtl.instant-apps-header__logo-height--s,:host .instant-apps-header--rtl.instant-apps-header__logo-height--m,:host .instant-apps-header--rtl.instant-apps-header__logo-height--l{padding-right:0;padding-left:10px}";
 
 const CSS = {
     base: 'instant-apps-header--standard',