@esri/solutions-components 0.7.41 → 0.7.43

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

@@ -10,7 +10,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-105cf2b9.js');
 const locale = require('./locale-8c42ba7a.js');
 const mapViewUtils = require('./mapViewUtils-290dbc9e.js');
-const downloadUtils = require('./downloadUtils-b10e3b8c.js');
+const downloadUtils = require('./downloadUtils-7d4985c0.js');
 require('./esri-loader-a91c0ec1.js');
 require('./_commonjsHelpers-384729db.js');
 require('./interfaces-7cd0a48a.js');
@@ -144,10 +144,6 @@ const LayerTable = class {
          * boolean: When true any onChange handeling will be skipped
          */
         this._skipOnChange = false;
-        /**
-         * bool: When true the table is being sorted
-         */
-        this._tableSorting = false;
         /**
          * Store a reference to the table node after it's first created
          * and initializes the FeatureTable
@@ -184,7 +180,6 @@ const LayerTable = class {
         this._selectAllActive = false;
         this._showHideOpen = false;
         this._showOnlySelected = false;
-        this._sortActive = false;
         this._translations = undefined;
     }
     //--------------------------------------------------------------------------
@@ -209,6 +204,16 @@ const LayerTable = class {
             this._table.editingEnabled = this._editEnabled && this.enableInlineEdit;
         }
     }
+    /**
+     * Update the toolbar when the share button is enabled/disabled
+     */
+    enableShareWatchHandler() {
+        // this should be caught by component did render and is when I test locally
+        // however have had reported case where it is not somehow on devext so adding explicit check here
+        if (this._toolbar) {
+            this._updateToolbar();
+        }
+    }
     /**
      * watch for changes to the list of controls that will currently fit in the display
      */
@@ -234,17 +239,6 @@ const LayerTable = class {
             this._initToolInfos();
         }
     }
-    /**
-     * watch for changes in map info and recheck the tool infos
-     */
-    async mapInfoWatchHandler() {
-        var _a;
-        if (((_a = this._toolInfos) === null || _a === void 0 ? void 0 : _a.length) > 0) {
-            this._initToolInfos();
-        }
-        this._initLayerExpressions();
-        this._resetColumnTemplates();
-    }
     /**
      * watch for changes in map view and get the first layer
      */
@@ -283,14 +277,6 @@ const LayerTable = class {
             this._selectAllActive = false;
         }
     }
-    /**
-     * When sortActive is false the user has not defined a sort and we should use the default sort
-     */
-    async _sortActiveWatchHandler() {
-        if (!this._sortActive) {
-            await this._sortTable();
-        }
-    }
     /**
      * Scroll and zoom to the selected feature from the Features widget.
      *
@@ -719,7 +705,7 @@ const LayerTable = class {
                         this._setControlsThatFit(controlsThatFit, skipControls);
                     }
                 }
-            }, 5);
+            }, 250);
         }
     }
     /**
@@ -944,7 +930,6 @@ const LayerTable = class {
                     },
                     container: node
                 });
-                this._table.columnPerformanceModeEnabled = false;
             });
             this._initColumnsInfo();
             this._checkEditEnabled();
@@ -952,11 +937,6 @@ const LayerTable = class {
                 this._table.highlightIds.on("change", (evt) => {
                     void this._handleOnChange(evt);
                 });
-                this.reactiveUtils.watch(() => this._table.activeSortOrders, (sortOrders) => {
-                    var _a, _b, _c, _d;
-                    this._sortActive = this._layer ? (sortOrders.length > 0 && ((_a = sortOrders[0]) === null || _a === void 0 ? void 0 : _a.direction) === "asc" || ((_b = sortOrders[0]) === null || _b === void 0 ? void 0 : _b.direction) === "desc") ||
-                        ((_c = sortOrders[0]) === null || _c === void 0 ? void 0 : _c.direction) === null && ((_d = sortOrders[0]) === null || _d === void 0 ? void 0 : _d.fieldName) === this._layer.objectIdField : false;
-                });
             });
         }
     }
@@ -1077,19 +1057,17 @@ const LayerTable = class {
         if (!this._table) {
             await this._getTable(this._tableNode, columnTemplates);
         }
-        else if (columnTemplates) {
-            this._table.tableTemplate.columnTemplates = columnTemplates;
-        }
         this._table.layer = this._layer;
         this._table.view = this.mapView;
         this._checkEditEnabled();
         this._table.editingEnabled = this._editEnabled && this.enableInlineEdit;
         this._initToolInfos();
-        await this._table.when(async () => {
+        await this.reactiveUtils.once(() => this._table.state === "loaded")
+            .then(async () => {
             var _a, _b;
             this._table.highlightIds.removeAll();
             this._table.clearSelectionFilter();
-            this._initColumnsInfo();
+            this._resetColumnTemplates();
             if (!this._defaultOidHonored && ((_a = this.defaultOid) === null || _a === void 0 ? void 0 : _a.length) > 0 && this.defaultOid[0] > -1) {
                 this._selectDefaultFeature(this.defaultOid);
                 this._defaultOidHonored = true;
@@ -1107,10 +1085,10 @@ const LayerTable = class {
                 this._filterActive = true;
                 this._defaultFilterHonored = true;
             }
+            this._showOnlySelected = false;
+            await this._sortTable();
+            this._updateToolbar();
         });
-        this._showOnlySelected = false;
-        this._sortActive = false;
-        await this._sortTable();
     }
     /**
      * Store the column names and current hidden status to support show/hide of columns
@@ -1160,15 +1138,11 @@ const LayerTable = class {
      * Sort the objectid field in descending order
      */
     async _sortTable() {
-        if (this._table && this._layer && !this._sortActive) {
-            if (!this._tableSorting && this.showNewestFirst) {
-                this._tableSorting = true;
-                await this._table.when();
-                await this._layer.when(() => {
-                    this._table.sortColumn(this._layer.objectIdField, "desc");
-                    this._tableSorting = false;
-                });
-            }
+        if (this._table && this._layer && this.showNewestFirst) {
+            await this._table.when();
+            await this._layer.when(() => {
+                this._table.sortColumn(this._layer.objectIdField, "desc");
+            });
         }
     }
     /**
@@ -1231,7 +1205,7 @@ const LayerTable = class {
      */
     _filterModal() {
         var _a, _b, _c;
-        return (index.h("calcite-modal", { "aria-labelledby": "modal-title", class: "modal", kind: "brand", onCalciteModalClose: () => void this._closeFilter(), open: this._filterOpen, widthScale: "s" }, index.h("div", { class: "display-flex align-center", id: "modal-title", slot: "header" }, (_b = (_a = this._translations) === null || _a === void 0 ? void 0 : _a.filter) === null || _b === void 0 ? void 0 : _b.replace("{{title}}", (_c = this._layer) === null || _c === void 0 ? void 0 : _c.title)), index.h("div", { slot: "content" }, index.h("instant-apps-filter-list", { autoUpdateUrl: false, closeBtn: true, closeBtnOnClick: async () => this._closeFilter(), layerExpressions: this._layerExpressions, onFilterListReset: () => this._handleFilterListReset(), onFilterUpdate: () => this._handleFilterUpdate(), ref: (el) => this._filterList = el, view: this.mapView, zoomBtn: false }))));
+        return (index.h("calcite-modal", { "aria-labelledby": "modal-title", class: "modal", kind: "brand", onCalciteModalClose: () => void this._closeFilter(), open: this._filterOpen, widthScale: "s" }, index.h("div", { class: "display-flex align-center", id: "modal-title", slot: "header" }, (_b = (_a = this._translations) === null || _a === void 0 ? void 0 : _a.filter) === null || _b === void 0 ? void 0 : _b.replace("{{title}}", (_c = this._layer) === null || _c === void 0 ? void 0 : _c.title)), index.h("div", { slot: "content" }, index.h("instant-apps-filter-list", { autoUpdateUrl: false, closeBtn: true, closeBtnOnClick: async () => this._closeFilter(), comboboxOverlayPositioning: "fixed", layerExpressions: this._layerExpressions, onFilterListReset: () => this._handleFilterListReset(), onFilterUpdate: () => this._handleFilterUpdate(), ref: (el) => this._filterList = el, view: this.mapView, zoomBtn: false }))));
     }
     /**
      * Reset the filter active prop
@@ -1518,13 +1492,12 @@ const LayerTable = class {
     static get watchers() { return {
         "enableCSV": ["enableCSVWatchHandler"],
         "enableInlineEdit": ["enableInlineEditWatchHandler"],
+        "enableShare": ["enableShareWatchHandler"],
         "_controlsThatFit": ["_controlsThatFitWatchHandler"],
         "isMobile": ["isMobileWatchHandler"],
-        "mapInfo": ["mapInfoWatchHandler"],
         "mapView": ["mapViewWatchHandler"],
         "_layer": ["_layerWatchHandler"],
-        "selectedIds": ["selectedIdsWatchHandler"],
-        "_sortActive": ["_sortActiveWatchHandler"]
+        "selectedIds": ["selectedIdsWatchHandler"]
     }; }
 };
 LayerTable.style = layerTableCss;

package/dist/cjs/{downloadUtils-b10e3b8c.js → downloadUtils-7d4985c0.js}

@@ -1510,7 +1510,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):Promise.resolve().then(function () { return require('./index.es-b9d6eff6.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):Promise.resolve().then(function () { return require('./index.es-8cef354a.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
@@ -2927,6 +2927,9 @@ function _prepareAttributeValue(attributeValue, attributeType, attributeDomain,
  * @returns Promise resolving when function is done
  */
 async function _prepareLabels(webmap, layer, ids, formatUsingLayerPopup = true, includeHeaderNames = false, fields = [], useFieldAliasNames = false) {
+    if (fields.length === 0) {
+        fields = layer.fields.map(f => f.name.toLowerCase());
+    }
     // Get the label formatting, if any
     const labelFormatProps = await _getLabelFormat(webmap, layer, formatUsingLayerPopup);
     // Because the label may actually come from a related layer, we'll use the layer that comes back from _getLabelFormat.
@@ -2985,8 +2988,7 @@ async function _prepareLabels(webmap, layer, ids, formatUsingLayerPopup = true,
     }
     else {
         // Get the features to export
-        const outFields = fields.length > 0 ? fields : undefined;
-        featureSet = await mapViewUtils.queryFeaturesByID(ids, featureLayer, [], false, undefined, outFields);
+        featureSet = await mapViewUtils.queryFeaturesByID(ids, featureLayer, [], false, undefined, fields);
     }
     // Get field data types. Do we have any domain-based fields?
     const attributeOrigNames = {};

package/dist/cjs/{helpers-981dd775.js → helpers-e328869d.js}

@@ -149,7 +149,7 @@ async function createInteractiveLegendDataForLayer(legendViewModel, activeLayerI
     // Get Feature Layer View to query
     const fLayerView = await legendViewModel.view.whenLayerView(fLayer);
     await reactiveUtils.whenOnce(() => (fLayerView === null || fLayerView === void 0 ? void 0 : fLayerView.updating) === false);
-    const field = (_g = fLayer.renderer) === null || _g === void 0 ? void 0 : _g.get('field');
+    const field = (_g = fLayer.renderer) === null || _g === void 0 ? void 0 : _g.field;
     if (legendElement !== undefined) {
       (_h = legendElement === null || legendElement === void 0 ? void 0 : legendElement.infos) === null || _h === void 0 ? void 0 : _h.forEach(legendElementInfo => {
         var _a;
@@ -351,9 +351,11 @@ function generateQueryExpressions(data, info, infoIndex, parentLegendElementInfo
   let queryExpression = isPredominance
     ? handlePredominanceExpression(info, fLayerView)
     : generateQueryExpression(info, field, infoIndex, legendElement, legendElementInfos, '');
-  const category = parentLegendElementInfo
-    ? (_b = (_a = categories.get(parentLegendElementInfo.title)) === null || _a === void 0 ? void 0 : _a.nestedInfos) === null || _b === void 0 ? void 0 : _b[infoIndex]
-    : categories.get((_c = info.label) !== null && _c !== void 0 ? _c : (_d = fLayerView === null || fLayerView === void 0 ? void 0 : fLayerView.layer) === null || _d === void 0 ? void 0 : _d.id);
+  const category = categories
+    ? parentLegendElementInfo
+      ? (_b = (_a = categories.get(parentLegendElementInfo.title)) === null || _a === void 0 ? void 0 : _a.nestedInfos) === null || _b === void 0 ? void 0 : _b[infoIndex]
+      : categories.get((_c = info.label) !== null && _c !== void 0 ? _c : (_d = fLayerView === null || fLayerView === void 0 ? void 0 : fLayerView.layer) === null || _d === void 0 ? void 0 : _d.id)
+    : null;
   if (category)
     category.selected = !(category === null || category === void 0 ? void 0 : category.selected);
   const hasOneValue = legendElementInfos && legendElementInfos.length === 1;
@@ -427,7 +429,7 @@ function generateQueryExpressions(data, info, infoIndex, parentLegendElementInfo
 }
 function generateQueryExpression(info, field, infoIndex, legendElement, legendElementInfos, normalizationField) {
   const { value } = info;
-  if (legendElement.type === 'symbol-table') {
+  if ((legendElement === null || legendElement === void 0 ? void 0 : legendElement.type) === 'symbol-table') {
     // Classify data size/color ramp
     if (!info.hasOwnProperty('value') || (Array.isArray(info.value) && (legendElementInfos === null || legendElementInfos === void 0 ? void 0 : legendElementInfos.length) === 1)) {
       // Classify data size/color ramp - 'Other' category
@@ -502,7 +504,8 @@ function checkNoneSelected(data) {
   }
 }
 function checkPredominance(fLayerView) {
-  const authoringInfoType = fLayerView === null || fLayerView === void 0 ? void 0 : fLayerView.get('layer.renderer.authoringInfo.type');
+  var _a, _b, _c;
+  const authoringInfoType = (_c = (_b = (_a = fLayerView === null || fLayerView === void 0 ? void 0 : fLayerView.layer) === null || _a === void 0 ? void 0 : _a.renderer) === null || _b === void 0 ? void 0 : _b.authoringInfo) === null || _c === void 0 ? void 0 : _c.type;
   return authoringInfoType === 'predominance';
 }
 function checkRelationshipRamp(activeLayerInfo) {
@@ -510,24 +513,24 @@ function checkRelationshipRamp(activeLayerInfo) {
   return ((_a = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.legendElements[1]) === null || _a === void 0 ? void 0 : _a.type) === 'relationship-ramp';
 }
 function validateInteractivity(activeLayerInfo, legendElement, legendElementIndex) {
-  var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
   const fLayer = activeLayerInfo.layer;
   const field = (_a = fLayer === null || fLayer === void 0 ? void 0 : fLayer.renderer) === null || _a === void 0 ? void 0 : _a.field;
   const type = legendElement === null || legendElement === void 0 ? void 0 : legendElement.type;
-  const layerView = activeLayerInfo.get('layerView');
-  const classBreakInfos = layerView === null || layerView === void 0 ? void 0 : layerView.get('layer.renderer.classBreakInfos');
-  const uniqueValueInfos = (layerView === null || layerView === void 0 ? void 0 : layerView.get('layer.renderer.uniqueValueInfos')) && field;
+  const layerView = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.layerView;
+  const classBreakInfos = (_c = (_b = layerView === null || layerView === void 0 ? void 0 : layerView.layer) === null || _b === void 0 ? void 0 : _b.renderer) === null || _c === void 0 ? void 0 : _c.classBreakInfos;
+  const uniqueValueInfos = ((_e = (_d = layerView === null || layerView === void 0 ? void 0 : layerView.layer) === null || _d === void 0 ? void 0 : _d.renderer) === null || _e === void 0 ? void 0 : _e.uniqueValueInfos) && field;
   const isSizeRamp = type === 'size-ramp';
   const isColorRamp = type === 'color-ramp';
   const opacityRamp = type === 'opacity-ramp';
   const heatmapRamp = type === 'heatmap-ramp';
   const hasMoreThanOneClassBreak = layerView && classBreakInfos && classBreakInfos.length > 1;
-  const authoringInfoType = layerView === null || layerView === void 0 ? void 0 : layerView.get('layer.renderer.authoringInfo.type');
+  const authoringInfoType = (_h = (_g = (_f = layerView === null || layerView === void 0 ? void 0 : layerView.layer) === null || _f === void 0 ? void 0 : _f.renderer) === null || _g === void 0 ? void 0 : _g.authoringInfo) === null || _h === void 0 ? void 0 : _h.type;
   const classifyDataCheckedColorRamp = authoringInfoType === 'class-breaks-color';
   const classifyDataCheckedSizeRamp = authoringInfoType === 'class-breaks-size';
-  const singleSymbol = ((_b = legendElement === null || legendElement === void 0 ? void 0 : legendElement.infos) === null || _b === void 0 ? void 0 : _b.length) === 1 && !field;
+  const singleSymbol = ((_j = legendElement === null || legendElement === void 0 ? void 0 : legendElement.infos) === null || _j === void 0 ? void 0 : _j.length) === 1 && !field;
   const isRelationshipRamp = authoringInfoType === 'relationship' && (legendElement === null || legendElement === void 0 ? void 0 : legendElement.type) !== 'size-ramp' && (legendElement === null || legendElement === void 0 ? void 0 : legendElement.type) !== 'symbol-table';
-  const isFeatureLayer = (activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.get('layer.type')) === 'feature';
+  const isFeatureLayer = ((_k = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.layer) === null || _k === void 0 ? void 0 : _k.type) === 'feature';
   const moreThanOneClassBreak = isFeatureLayer && field && !isColorRamp && !isSizeRamp && hasMoreThanOneClassBreak;
   const oneClassBreak = isFeatureLayer && field && !isColorRamp && !isSizeRamp && !hasMoreThanOneClassBreak ? true : false;
   const validate = oneClassBreak ||
@@ -539,14 +542,14 @@ function validateInteractivity(activeLayerInfo, legendElement, legendElementInde
     uniqueValueInfos
     ? true
     : false;
-  const hasClustering = (activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.get('layer.featureReduction')) && ((_c = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.legendElements[legendElementIndex]) === null || _c === void 0 ? void 0 : _c.type) === 'size-ramp';
-  const isSingleSymbol = (legendElement === null || legendElement === void 0 ? void 0 : legendElement.type) === 'symbol-table' && ((_d = legendElement === null || legendElement === void 0 ? void 0 : legendElement.infos) === null || _d === void 0 ? void 0 : _d.length) === 1;
+  const hasClustering = ((_l = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.layer) === null || _l === void 0 ? void 0 : _l.featureReduction) && ((_o = (_m = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.legendElements) === null || _m === void 0 ? void 0 : _m[legendElementIndex]) === null || _o === void 0 ? void 0 : _o.type) === 'size-ramp';
+  const isSingleSymbol = (legendElement === null || legendElement === void 0 ? void 0 : legendElement.type) === 'symbol-table' && ((_p = legendElement === null || legendElement === void 0 ? void 0 : legendElement.infos) === null || _p === void 0 ? void 0 : _p.length) === 1;
   const hasColorRamp = !(activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.legendElements.every(legendElement => legendElement.type !== 'color-ramp'));
   const hasSizeRamp = !(activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.legendElements.every(legendElement => legendElement.type !== 'size-ramp'));
   const singleSymbolColor = isSingleSymbol && hasColorRamp;
   const singleSymbolSize = isSingleSymbol && hasSizeRamp;
-  const isUnclassifiedSizeRamp = (_e = legendElement === null || legendElement === void 0 ? void 0 : legendElement.infos) === null || _e === void 0 ? void 0 : _e.every(info => typeof info.value === 'number');
-  const isBinning = ((_g = (_f = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.legendElements) === null || _f === void 0 ? void 0 : _f[0]) === null || _g === void 0 ? void 0 : _g.type) === 'symbol-table' && ((_j = (_h = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.legendElements) === null || _h === void 0 ? void 0 : _h[1]) === null || _j === void 0 ? void 0 : _j.type) === 'color-ramp';
+  const isUnclassifiedSizeRamp = (_q = legendElement === null || legendElement === void 0 ? void 0 : legendElement.infos) === null || _q === void 0 ? void 0 : _q.every(info => typeof info.value === 'number');
+  const isBinning = ((_s = (_r = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.legendElements) === null || _r === void 0 ? void 0 : _r[0]) === null || _s === void 0 ? void 0 : _s.type) === 'symbol-table' && ((_u = (_t = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.legendElements) === null || _t === void 0 ? void 0 : _t[1]) === null || _u === void 0 ? void 0 : _u.type) === 'color-ramp';
   const isDotDensity = authoringInfoType === 'dot-density';
   const isValidated = isFeatureLayer && !hasClustering && !opacityRamp && !heatmapRamp && !singleSymbolColor && !singleSymbolSize && !isUnclassifiedSizeRamp && !isBinning && !isDotDensity
     ? classBreakInfos
@@ -682,7 +685,7 @@ async function handleFeatureCount(legendViewModel, data) {
     const legendElement = activeLayerInfo.legendElements[0];
     const fLayer = activeLayerInfo.layer;
     const fLayerView = (_b = data[(_a = activeLayerInfo === null || activeLayerInfo === void 0 ? void 0 : activeLayerInfo.layer) === null || _a === void 0 ? void 0 : _a.id]) === null || _b === void 0 ? void 0 : _b.fLayerView;
-    const field = (_c = fLayer.renderer) === null || _c === void 0 ? void 0 : _c.get('field');
+    const field = (_c = fLayer.renderer) === null || _c === void 0 ? void 0 : _c.field;
     const counts = [];
     countPromises[activeLayerInfo.layer.id] = [];
     (_d = legendElement === null || legendElement === void 0 ? void 0 : legendElement.infos) === null || _d === void 0 ? void 0 : _d.forEach((info, infoIndex) => {
@@ -707,7 +710,7 @@ async function handleFeatureCount(legendViewModel, data) {
       const legendElement = aliChild.legendElements[0];
       const fLayer = aliChild.layer;
       const fLayerView = (_b = data[(_a = aliChild === null || aliChild === void 0 ? void 0 : aliChild.layer) === null || _a === void 0 ? void 0 : _a.id]) === null || _b === void 0 ? void 0 : _b.fLayerView;
-      const field = (_c = fLayer.renderer) === null || _c === void 0 ? void 0 : _c.get('field');
+      const field = (_c = fLayer.renderer) === null || _c === void 0 ? void 0 : _c.field;
       (_d = legendElement === null || legendElement === void 0 ? void 0 : legendElement.infos) === null || _d === void 0 ? void 0 : _d.forEach((info, infoIndex) => childCounts.push(getInfoCount(legendViewModel.view.extent, fLayerView, field, info, infoIndex, legendElement)));
       countPromises[aliChild.layer.id] = childCounts;
     };

package/dist/cjs/{index.es-b9d6eff6.js → index.es-8cef354a.js}

@@ -6,7 +6,7 @@
 'use strict';
 
 const _commonjsHelpers = require('./_commonjsHelpers-384729db.js');
-const downloadUtils = require('./downloadUtils-b10e3b8c.js');
+const downloadUtils = require('./downloadUtils-7d4985c0.js');
 require('./index-105cf2b9.js');
 require('./locale-8c42ba7a.js');
 require('./esri-loader-a91c0ec1.js');

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

@@ -194,17 +194,29 @@ const printStyling = `
     width: 100%;
     position: absolute;
     bottom: 15px;
-    left: 15px;
+    margin: 0 15px;
   }
 
   .instant-apps-export-print__scale-bar-container .esri-scale-bar__label {
+    color: #323232;
     font-size: 10px;
+    padding: 0 4px;
+  }
+  
+  .instant-apps-export-print__scale-bar-container--position .esri-scale-bar__label {
+    height: 10px;
+    padding: 0 2px;
+    line-height: 11px;
   }
 
   .instant-apps-export-print__scale-bar-container .esri-scale-bar__bar-container:nth-child(1n+3) {
     display: none;
   }
 
+  .instant-apps-export-print__scale-bar-container--position .esri-scale-bar__bar-container.esri-scale-bar__bar-container--line {
+    align-items: center;
+  }
+
   .instant-apps-export-print__scale-bar-container .esri-scale-bar__line {
     background-color: rgba(255, 255, 255, 0.66);
   }
@@ -216,10 +228,16 @@ const printStyling = `
 
   .instant-apps-export-print__scale-bar-container .esri-scale-bar__line--bottom {
     width: var(--instant-apps-scale-bar-bottom) !important;
+    border-top: 2px solid #323232;
   }
 
-  .instant-apps-export-print__scale-bar-container .esri-scale-bar__label {
-    color: #323232;
+  .instant-apps-export-print__scale-bar-container--position .esri-scale-bar__label-container--line {
+    position: unset;
+    margin: 0 2px;
+    background-color: rgba(255, 255, 255, 0.66);
+    height: 10px;
+    display: flex;
+    align-items: center;
   }
 
   .instant-apps-export-print__scale-bar-container .esri-scale-bar__line--top:before,
@@ -306,8 +324,7 @@ const screenshotStyling = `
 
 .screenshot-img-container calcite-button {
   margin: 5px;
-}
-`;
+}`;
 
 const instantAppsExportCss = ":host{display:block;--instant-apps-export-action-background:var(--calcite-color-foreground-1);--instant-apps-export-action-background-hover:var(--calcite-color-foreground-2);--instant-apps-export-action-background-press:var(--calcite-color-foreground-3);--instant-apps-export-action-height:100%;--instant-apps-export-action-width:fit-content;--instant-apps-export-action-icon-color:var(--calcite-color-text-3);--instant-apps-export-action-icon-hover-color:var(--calcite-color-text-1);--instant-apps-export-background:var(--calcite-color-foreground-1);--instant-apps-export-text-color:var(--calcite-color-text-1);--instant-apps-export-popover-width:250px}.instant-apps-export{height:100%}.instant-apps-export *{box-sizing:border-box}.instant-apps-export__popover-container,.instant-apps-export__inline-container{padding:12px;background:var(--instant-apps-export-background);--calcite-color-text-1:var(--instant-apps-export-text-color)}.instant-apps-export__popover-container{width:var(--instant-apps-export-popover-width)}.instant-apps-export calcite-action{height:var(--instant-apps-export-action-height);width:var(--instant-apps-export-action-width);--calcite-color-foreground-1:var(--instant-apps-export-action-background);--calcite-color-foreground-2:var(--instant-apps-export-action-background-hover);--calcite-color-foreground-3:var(--instant-apps-export-action-background-press);--calcite-color-text-3:var(--instant-apps-export-action-icon-color);--calcite-color-text-1:var(--instant-apps-export-action-icon-hover-color)}.instant-apps-export .instant-apps-export-print{display:none}.instant-apps-export__visually-hidden{position:absolute;top:0;z-index:-1;visibility:hidden}.instant-apps-export calcite-input{--calcite-color-foreground-1:var(--instant-apps-export-background);--calcite-color-text-1:var(--instant-apps-export-text-color)}.instant-apps-export calcite-popover{--calcite-color-foreground-1:var(--instant-apps-export-background)}.instant-apps-export calcite-switch{--calcite-color-foreground-1:#fff;--calcite-color-foreground-2:#f3f3f3}.instant-apps-export calcite-button:last-of-type{margin-top:0.5rem}.instant-apps-export .calcite-mode-dark calcite-switch{--calcite-color-foreground-1:#2b2b2b;--calcite-color-foreground-2:#202020}.instant-apps-export__compass-container.esri-widget{background:#fff;box-shadow:0 1px 2px rgba(0, 0, 0, 0.3)}.instant-apps-export__compass-container.esri-widget .esri-compass__icon.esri-icon-compass{color:#6e6e6e}.hide{display:none}.screenshotCursor{cursor:crosshair}";
 
@@ -356,7 +373,7 @@ const InstantAppsExport = class {
         this.showIncludeLegend = true;
         this.showIncludeMap = false;
         this.showIncludePopup = true;
-        this.showScaleBar = true;
+        this.showScaleBar = false;
         this.view = undefined;
         this.maskBackground = 'rgba(255, 51, 0, 0.1)';
         this.maskBorder = '2px dashed rgb(255, 51, 0)';
@@ -364,8 +381,8 @@ const InstantAppsExport = class {
         this.exportIsLoading = undefined;
         this.messages = undefined;
     }
-    watchIncludeMap(newValue) {
-        if (newValue) {
+    watchIncludeMap(includeMap) {
+        if (includeMap) {
             this.updateLegend();
         }
     }
@@ -435,7 +452,7 @@ const InstantAppsExport = class {
         return (index.h("div", { ref: (el) => (this.printContainerEl = el) }, index.h("div", { class: CSS.print.base, ref: (el) => (this.printEl = el) }, printMap, legend, index.h("div", { class: CSS.print.contentContainer }, popup, extraContent))));
     }
     renderPrintMap() {
-        return (index.h("div", { class: CSS.print.viewContainer, ref: (el) => (this.viewContainerEl = el) }, index.h("div", { class: CSS.print.viewWrapper, ref: (el) => (this.viewWrapperEl = el) }, this.headerTitle ? index.h("instant-apps-header", { titleText: this.headerTitle, backgroundColor: "#fff", textColor: "#323232" }) : null, index.h("img", { class: CSS.print.view, ref: (el) => (this.viewEl = el) }), index.h("div", { class: CSS.print.scaleBarContainer, ref: this.handleScaleBarContainerEl.bind(this) }))));
+        return (index.h("div", { class: CSS.print.viewContainer, ref: (el) => (this.viewContainerEl = el) }, index.h("div", { class: CSS.print.viewWrapper, ref: (el) => (this.viewWrapperEl = el) }, this.headerTitle ? index.h("instant-apps-header", { titleText: this.headerTitle, backgroundColor: "#fff", textColor: "#323232" }) : null, index.h("img", { class: CSS.print.view, ref: (el) => (this.viewEl = el) }), index.h("div", { class: CSS.print.scaleBarContainer, ref: (el) => (this.scaleBarContainerEl = el) }))));
     }
     renderLegend() {
         return index.h("div", { class: CSS.print.legendContainer, ref: (el) => (this.legendContainerEl = el) });
@@ -475,6 +492,7 @@ const InstantAppsExport = class {
             document.body.prepend(this.printEl);
             this.handleExtraContent();
             if (this.includeMap) {
+                this.updateScaleBar();
                 this.updatePopupToPrint();
                 this.viewScreenshot();
                 this.handleImgLoaded();
@@ -588,11 +606,11 @@ const InstantAppsExport = class {
         this.handleCompassCreation();
     }
     handleLegendCreation() {
-        var _a, _b;
+        var _a, _b, _c, _d;
         if (this.includeMap && this.view != null && this.showIncludeLegend && this.legendContainerEl != null) {
             const map = this.view.map;
             const legendMap = (_b = (_a = this.legend) === 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) === (legendMap === null || legendMap === void 0 ? void 0 : legendMap.portalItem.id);
+            const checkId = ((_c = map === null || map === void 0 ? void 0 : map.portalItem) === null || _c === void 0 ? void 0 : _c.id) === ((_d = legendMap === null || legendMap === void 0 ? void 0 : legendMap.portalItem) === null || _d === void 0 ? void 0 : _d.id);
             if (!checkId) {
                 this.updateLegend();
             }
@@ -618,11 +636,11 @@ const InstantAppsExport = class {
         });
     }
     handleCompassCreation() {
-        var _a, _b;
+        var _a, _b, _c, _d;
         if (this.includeMap && this.view != null && this.compassContainerEl != null) {
             const map = this.view.map;
             const compassMap = (_b = (_a = this.compass) === 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) === (compassMap === null || compassMap === void 0 ? void 0 : compassMap.portalItem.id);
+            const checkId = ((_c = map === null || map === void 0 ? void 0 : map.portalItem) === null || _c === void 0 ? void 0 : _c.id) === ((_d = compassMap === null || compassMap === void 0 ? void 0 : compassMap.portalItem) === null || _d === void 0 ? void 0 : _d.id);
             if (!checkId) {
                 this.updateCompass();
             }
@@ -641,18 +659,22 @@ const InstantAppsExport = class {
         });
     }
     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;
-            const [ScaleBar] = await loadModules.loadModules(['esri/widgets/ScaleBar']);
-            this.scaleBar = new ScaleBar({ container: this.scaleBarContainerEl, unit: 'dual', view });
-        });
+        var _a, _b, _c;
+        if (this.scaleBarContainerEl) {
+            this.scaleBarContainerEl.innerHTML = '';
+            if (this.showScaleBar) {
+                const scaleBar = (_c = (_b = (_a = this.view) === null || _a === void 0 ? void 0 : _a.container) === null || _b === void 0 ? void 0 : _b.querySelector('.esri-scale-bar.esri-widget')) === null || _c === void 0 ? void 0 : _c.cloneNode(true);
+                if (scaleBar != null) {
+                    this.scaleBarContainerEl.append(scaleBar);
+                }
+            }
+        }
     }
     async viewScreenshot() {
+        var _a;
         if (this.view != null && this.includeMap) {
             if (this.screenshot == null) {
+                (_a = this.scaleBarContainerEl) === null || _a === void 0 ? void 0 : _a.classList.toggle('instant-apps-export-print__scale-bar-container--position', this.view.width > 1000);
                 this.screenshot = await this.view.takeScreenshot({
                     width: this.view.width * 2,
                     height: this.view.height * 2,
@@ -790,10 +812,15 @@ const InstantAppsExport = class {
         }
     }
     maskScreenshot() {
+        var _a;
         if (this.view != null && this.area != null) {
             this.view.removeHandles(dragHandlerName);
             const height = this.area.height;
             const width = this.area.width;
+            if (this.showScaleBar) {
+                const moveSBUnit = this.view.width > 1000 && this.view.width * 0.75 < width;
+                (_a = this.scaleBarContainerEl) === null || _a === void 0 ? void 0 : _a.classList.toggle('instant-apps-export-print__scale-bar-container--position', moveSBUnit);
+            }
             this.view.takeScreenshot({ area: this.area, width: width * 2, height: height * 2, format: 'jpg' }).then(screenshot => {
                 var _a;
                 this.screenshot = screenshot;
@@ -836,11 +863,12 @@ const InstantAppsExport = class {
         }
     }
     setScalebarWidth(bar, position) {
+        var _a;
         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;
-            bar.style.setProperty(`--instant-apps-scale-bar-${position}`, `${widthPercentage}%`);
+            (_a = this.scaleBarContainerEl) === null || _a === void 0 ? void 0 : _a.style.setProperty(`--instant-apps-scale-bar-${position}`, `${widthPercentage}%`);
         }
     }
     removeScreenshotElements() {
@@ -848,18 +876,6 @@ 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 index.getElement(this); }
     static get watchers() { return {
         "includeMap": ["watchIncludeMap"]