@esri/solutions-components 0.8.4 → 0.8.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -44,6 +44,7 @@ export class CrowdsourceManager {
44
44
  * MapView.when is not fired when mapView is not currently visible
45
45
  */
46
46
  this._shouldSetMapView = false;
47
+ this.appProxies = undefined;
47
48
  this.defaultCenter = "";
48
49
  this.defaultGlobalId = "";
49
50
  this.defaultLayer = "";
@@ -331,7 +332,7 @@ export class CrowdsourceManager {
331
332
  _getMapNode(panelOpen) {
332
333
  var _a;
333
334
  const mapContainerClass = this._layoutMode === ELayoutMode.HORIZONTAL && (!this._isMobile || panelOpen) ? "" : "adjusted-height-50";
334
- return (h("div", { class: `${mapContainerClass} overflow-hidden` }, h("map-card", { basemapConfig: this.basemapConfig, class: "width-full", defaultWebmapId: this.defaultWebmap, enableBasemap: this.enableBasemap, enableFloorFilter: this.enableFloorFilter, enableFullscreen: this.enableFullscreen, enableHome: this.enableHome, enableLegend: this.enableLegend, enableSearch: this.enableSearch, enableSingleExpand: true, hidden: this._expandPopup && !this._isMobile, homeZoomIndex: 3, homeZoomPosition: "top-left", homeZoomToolsSize: "s", mapInfos: (_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.filter(mapInfo => mapInfo.visible !== false), mapWidgetsIndex: 0, mapWidgetsPosition: "top-right", mapWidgetsSize: "m", stackTools: true, theme: this.theme, toolOrder: ["legend", "search", "fullscreen", "basemap", "floorfilter"] })));
335
+ return (h("div", { class: `${mapContainerClass} overflow-hidden` }, h("map-card", { appProxies: this.appProxies, basemapConfig: this.basemapConfig, class: "width-full", defaultWebmapId: this.defaultWebmap, enableBasemap: this.enableBasemap, enableFloorFilter: this.enableFloorFilter, enableFullscreen: this.enableFullscreen, enableHome: this.enableHome, enableLegend: this.enableLegend, enableSearch: this.enableSearch, enableSingleExpand: true, hidden: this._expandPopup && !this._isMobile, homeZoomIndex: 3, homeZoomPosition: "top-left", homeZoomToolsSize: "s", mapInfos: (_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.filter(mapInfo => mapInfo.visible !== false), mapWidgetsIndex: 0, mapWidgetsPosition: "top-right", mapWidgetsSize: "m", stackTools: true, theme: this.theme, toolOrder: ["legend", "search", "fullscreen", "basemap", "floorfilter"] })));
335
336
  }
336
337
  /**
337
338
  * Get the expand node for the popup information
@@ -504,6 +505,23 @@ export class CrowdsourceManager {
504
505
  }
505
506
  static get properties() {
506
507
  return {
508
+ "appProxies": {
509
+ "type": "any",
510
+ "mutable": false,
511
+ "complexType": {
512
+ "original": "any",
513
+ "resolved": "any",
514
+ "references": {}
515
+ },
516
+ "required": false,
517
+ "optional": false,
518
+ "docs": {
519
+ "tags": [],
520
+ "text": "Array of objects containing proxy information for premium platform services."
521
+ },
522
+ "attribute": "app-proxies",
523
+ "reflect": false
524
+ },
507
525
  "defaultCenter": {
508
526
  "type": "string",
509
527
  "mutable": false,
@@ -20,6 +20,7 @@
20
20
  */
21
21
  import { Host, h } from "@stencil/core";
22
22
  import { loadModules } from "../../utils/loadModules";
23
+ import { joinAppProxies } from "templates-common-library-esm/functionality/proxy";
23
24
  // TODO navigation and accessability isn't right for the map list
24
25
  // tab does not go into the list when it's open
25
26
  // focus is not set when it opens
@@ -36,6 +37,7 @@ export class MapCard {
36
37
  * string: the id of map currently displayed
37
38
  */
38
39
  this._loadedId = "";
40
+ this.appProxies = undefined;
39
41
  this.defaultWebmapId = "";
40
42
  this.enableHome = undefined;
41
43
  this.enableLegend = undefined;
@@ -112,14 +114,16 @@ export class MapCard {
112
114
  * @protected
113
115
  */
114
116
  async _initModules() {
115
- const [WebMap, MapView, Home] = await loadModules([
117
+ const [WebMap, MapView, Home, esriConfig] = await loadModules([
116
118
  "esri/WebMap",
117
119
  "esri/views/MapView",
118
- "esri/widgets/Home"
120
+ "esri/widgets/Home",
121
+ "esri/config"
119
122
  ]);
120
123
  this.WebMap = WebMap;
121
124
  this.MapView = MapView;
122
125
  this.Home = Home;
126
+ this.esriConfig = esriConfig;
123
127
  }
124
128
  /**
125
129
  * Load the webmap for the provided webMapInfo
@@ -140,6 +144,10 @@ export class MapCard {
140
144
  const webMap = new this.WebMap({
141
145
  portalItem: { id }
142
146
  });
147
+ if (this.appProxies) {
148
+ await webMap.load();
149
+ await joinAppProxies(webMap, this.esriConfig, this.appProxies);
150
+ }
143
151
  this.mapView = new this.MapView({
144
152
  container: this._mapDiv,
145
153
  map: webMap,
@@ -204,6 +212,23 @@ export class MapCard {
204
212
  }
205
213
  static get properties() {
206
214
  return {
215
+ "appProxies": {
216
+ "type": "any",
217
+ "mutable": false,
218
+ "complexType": {
219
+ "original": "any",
220
+ "resolved": "any",
221
+ "references": {}
222
+ },
223
+ "required": false,
224
+ "optional": false,
225
+ "docs": {
226
+ "tags": [],
227
+ "text": "Array of objects containing proxy information for premium platform services."
228
+ },
229
+ "attribute": "app-proxies",
230
+ "reflect": false
231
+ },
207
232
  "defaultWebmapId": {
208
233
  "type": "string",
209
234
  "mutable": false,
@@ -91,6 +91,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
91
91
  * MapView.when is not fired when mapView is not currently visible
92
92
  */
93
93
  this._shouldSetMapView = false;
94
+ this.appProxies = undefined;
94
95
  this.defaultCenter = "";
95
96
  this.defaultGlobalId = "";
96
97
  this.defaultLayer = "";
@@ -378,7 +379,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
378
379
  _getMapNode(panelOpen) {
379
380
  var _a;
380
381
  const mapContainerClass = this._layoutMode === ELayoutMode.HORIZONTAL && (!this._isMobile || panelOpen) ? "" : "adjusted-height-50";
381
- return (h("div", { class: `${mapContainerClass} overflow-hidden` }, h("map-card", { basemapConfig: this.basemapConfig, class: "width-full", defaultWebmapId: this.defaultWebmap, enableBasemap: this.enableBasemap, enableFloorFilter: this.enableFloorFilter, enableFullscreen: this.enableFullscreen, enableHome: this.enableHome, enableLegend: this.enableLegend, enableSearch: this.enableSearch, enableSingleExpand: true, hidden: this._expandPopup && !this._isMobile, homeZoomIndex: 3, homeZoomPosition: "top-left", homeZoomToolsSize: "s", mapInfos: (_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.filter(mapInfo => mapInfo.visible !== false), mapWidgetsIndex: 0, mapWidgetsPosition: "top-right", mapWidgetsSize: "m", stackTools: true, theme: this.theme, toolOrder: ["legend", "search", "fullscreen", "basemap", "floorfilter"] })));
382
+ return (h("div", { class: `${mapContainerClass} overflow-hidden` }, h("map-card", { appProxies: this.appProxies, basemapConfig: this.basemapConfig, class: "width-full", defaultWebmapId: this.defaultWebmap, enableBasemap: this.enableBasemap, enableFloorFilter: this.enableFloorFilter, enableFullscreen: this.enableFullscreen, enableHome: this.enableHome, enableLegend: this.enableLegend, enableSearch: this.enableSearch, enableSingleExpand: true, hidden: this._expandPopup && !this._isMobile, homeZoomIndex: 3, homeZoomPosition: "top-left", homeZoomToolsSize: "s", mapInfos: (_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.filter(mapInfo => mapInfo.visible !== false), mapWidgetsIndex: 0, mapWidgetsPosition: "top-right", mapWidgetsSize: "m", stackTools: true, theme: this.theme, toolOrder: ["legend", "search", "fullscreen", "basemap", "floorfilter"] })));
382
383
  }
383
384
  /**
384
385
  * Get the expand node for the popup information
@@ -544,6 +545,7 @@ const CrowdsourceManager$1 = /*@__PURE__*/ proxyCustomElement(class CrowdsourceM
544
545
  }; }
545
546
  static get style() { return crowdsourceManagerCss; }
546
547
  }, [0, "crowdsource-manager", {
548
+ "appProxies": [8, "app-proxies"],
547
549
  "defaultCenter": [1, "default-center"],
548
550
  "defaultGlobalId": [1, "default-global-id"],
549
551
  "defaultLayer": [1, "default-layer"],
@@ -30,6 +30,38 @@ import { d as defineCustomElement$3 } from './map-picker2.js';
30
30
  import { d as defineCustomElement$2 } from './map-search2.js';
31
31
  import { d as defineCustomElement$1 } from './map-tools2.js';
32
32
 
33
+ function joinAppProxies(map, config, appProxies) {
34
+ if (appProxies) {
35
+ appProxies.forEach((proxy) => {
36
+ map.allLayers.forEach((layer) => {
37
+ if (layer && layer.url === proxy.sourceUrl) {
38
+ // directly change the layer url to the proxy url
39
+ layer.url = proxy.proxyUrl;
40
+ // Replace the layer's portalItem's url with the proxy url too, otherwise anonymous viewers get a sign-in prompt.
41
+ if (layer.portalItem) {
42
+ layer.portalItem.when(() => {
43
+ // layer.portalItem exists, see above. Not sure why typescript thinks it could be undefined here.
44
+ layer.portalItem.url = proxy.proxyUrl;
45
+ });
46
+ }
47
+ // also add a request interceptor in case we missed any requests to the original url, or the jsapi team adds new requests in the future.
48
+ config.request?.interceptors?.push({
49
+ // this interceptor only applies to requests made to this proxy's sourceUrl (the layer's original url).
50
+ urls: proxy.sourceUrl,
51
+ before: (params) => {
52
+ // change requests from the original url to the proxy url
53
+ if (params.url && params.url === proxy.sourceUrl) {
54
+ params.url = proxy.proxyUrl;
55
+ }
56
+ },
57
+ });
58
+ }
59
+ });
60
+ });
61
+ }
62
+ return map;
63
+ }
64
+
33
65
  const mapCardCss = ":host{display:block;--calcite-label-margin-bottom:0;--calcite-block-padding:0}.map-height{height:calc(100% - 51px)}.height-full{height:100%}.box-shadow{box-shadow:none !important}.visibility-hidden-1{visibility:hidden;height:1px;}.display-none{display:none}";
34
66
 
35
67
  const MapCard = /*@__PURE__*/ proxyCustomElement(class MapCard extends HTMLElement {
@@ -46,6 +78,7 @@ const MapCard = /*@__PURE__*/ proxyCustomElement(class MapCard extends HTMLEleme
46
78
  * string: the id of map currently displayed
47
79
  */
48
80
  this._loadedId = "";
81
+ this.appProxies = undefined;
49
82
  this.defaultWebmapId = "";
50
83
  this.enableHome = undefined;
51
84
  this.enableLegend = undefined;
@@ -122,14 +155,16 @@ const MapCard = /*@__PURE__*/ proxyCustomElement(class MapCard extends HTMLEleme
122
155
  * @protected
123
156
  */
124
157
  async _initModules() {
125
- const [WebMap, MapView, Home] = await loadModules([
158
+ const [WebMap, MapView, Home, esriConfig] = await loadModules([
126
159
  "esri/WebMap",
127
160
  "esri/views/MapView",
128
- "esri/widgets/Home"
161
+ "esri/widgets/Home",
162
+ "esri/config"
129
163
  ]);
130
164
  this.WebMap = WebMap;
131
165
  this.MapView = MapView;
132
166
  this.Home = Home;
167
+ this.esriConfig = esriConfig;
133
168
  }
134
169
  /**
135
170
  * Load the webmap for the provided webMapInfo
@@ -150,6 +185,10 @@ const MapCard = /*@__PURE__*/ proxyCustomElement(class MapCard extends HTMLEleme
150
185
  const webMap = new this.WebMap({
151
186
  portalItem: { id }
152
187
  });
188
+ if (this.appProxies) {
189
+ await webMap.load();
190
+ await joinAppProxies(webMap, this.esriConfig, this.appProxies);
191
+ }
153
192
  this.mapView = new this.MapView({
154
193
  container: this._mapDiv,
155
194
  map: webMap,
@@ -207,6 +246,7 @@ const MapCard = /*@__PURE__*/ proxyCustomElement(class MapCard extends HTMLEleme
207
246
  }; }
208
247
  static get style() { return mapCardCss; }
209
248
  }, [0, "map-card", {
249
+ "appProxies": [8, "app-proxies"],
210
250
  "defaultWebmapId": [1, "default-webmap-id"],
211
251
  "enableHome": [4, "enable-home"],
212
252
  "enableLegend": [4, "enable-legend"],
@@ -1567,6 +1567,38 @@ const LayerTable = class {
1567
1567
  };
1568
1568
  LayerTable.style = layerTableCss;
1569
1569
 
1570
+ function joinAppProxies(map, config, appProxies) {
1571
+ if (appProxies) {
1572
+ appProxies.forEach((proxy) => {
1573
+ map.allLayers.forEach((layer) => {
1574
+ if (layer && layer.url === proxy.sourceUrl) {
1575
+ // directly change the layer url to the proxy url
1576
+ layer.url = proxy.proxyUrl;
1577
+ // Replace the layer's portalItem's url with the proxy url too, otherwise anonymous viewers get a sign-in prompt.
1578
+ if (layer.portalItem) {
1579
+ layer.portalItem.when(() => {
1580
+ // layer.portalItem exists, see above. Not sure why typescript thinks it could be undefined here.
1581
+ layer.portalItem.url = proxy.proxyUrl;
1582
+ });
1583
+ }
1584
+ // also add a request interceptor in case we missed any requests to the original url, or the jsapi team adds new requests in the future.
1585
+ config.request?.interceptors?.push({
1586
+ // this interceptor only applies to requests made to this proxy's sourceUrl (the layer's original url).
1587
+ urls: proxy.sourceUrl,
1588
+ before: (params) => {
1589
+ // change requests from the original url to the proxy url
1590
+ if (params.url && params.url === proxy.sourceUrl) {
1591
+ params.url = proxy.proxyUrl;
1592
+ }
1593
+ },
1594
+ });
1595
+ }
1596
+ });
1597
+ });
1598
+ }
1599
+ return map;
1600
+ }
1601
+
1570
1602
  const mapCardCss = ":host{display:block;--calcite-label-margin-bottom:0;--calcite-block-padding:0}.map-height{height:calc(100% - 51px)}.height-full{height:100%}.box-shadow{box-shadow:none !important}.visibility-hidden-1{visibility:hidden;height:1px;}.display-none{display:none}";
1571
1603
 
1572
1604
  const MapCard = class {
@@ -1582,6 +1614,7 @@ const MapCard = class {
1582
1614
  * string: the id of map currently displayed
1583
1615
  */
1584
1616
  this._loadedId = "";
1617
+ this.appProxies = undefined;
1585
1618
  this.defaultWebmapId = "";
1586
1619
  this.enableHome = undefined;
1587
1620
  this.enableLegend = undefined;
@@ -1658,14 +1691,16 @@ const MapCard = class {
1658
1691
  * @protected
1659
1692
  */
1660
1693
  async _initModules() {
1661
- const [WebMap, MapView, Home] = await loadModules([
1694
+ const [WebMap, MapView, Home, esriConfig] = await loadModules([
1662
1695
  "esri/WebMap",
1663
1696
  "esri/views/MapView",
1664
- "esri/widgets/Home"
1697
+ "esri/widgets/Home",
1698
+ "esri/config"
1665
1699
  ]);
1666
1700
  this.WebMap = WebMap;
1667
1701
  this.MapView = MapView;
1668
1702
  this.Home = Home;
1703
+ this.esriConfig = esriConfig;
1669
1704
  }
1670
1705
  /**
1671
1706
  * Load the webmap for the provided webMapInfo
@@ -1686,6 +1721,10 @@ const MapCard = class {
1686
1721
  const webMap = new this.WebMap({
1687
1722
  portalItem: { id }
1688
1723
  });
1724
+ if (this.appProxies) {
1725
+ await webMap.load();
1726
+ await joinAppProxies(webMap, this.esriConfig, this.appProxies);
1727
+ }
1689
1728
  this.mapView = new this.MapView({
1690
1729
  container: this._mapDiv,
1691
1730
  map: webMap,
@@ -35,6 +35,7 @@ const CrowdsourceManager = class {
35
35
  * MapView.when is not fired when mapView is not currently visible
36
36
  */
37
37
  this._shouldSetMapView = false;
38
+ this.appProxies = undefined;
38
39
  this.defaultCenter = "";
39
40
  this.defaultGlobalId = "";
40
41
  this.defaultLayer = "";
@@ -322,7 +323,7 @@ const CrowdsourceManager = class {
322
323
  _getMapNode(panelOpen) {
323
324
  var _a;
324
325
  const mapContainerClass = this._layoutMode === ELayoutMode.HORIZONTAL && (!this._isMobile || panelOpen) ? "" : "adjusted-height-50";
325
- return (h("div", { class: `${mapContainerClass} overflow-hidden` }, h("map-card", { basemapConfig: this.basemapConfig, class: "width-full", defaultWebmapId: this.defaultWebmap, enableBasemap: this.enableBasemap, enableFloorFilter: this.enableFloorFilter, enableFullscreen: this.enableFullscreen, enableHome: this.enableHome, enableLegend: this.enableLegend, enableSearch: this.enableSearch, enableSingleExpand: true, hidden: this._expandPopup && !this._isMobile, homeZoomIndex: 3, homeZoomPosition: "top-left", homeZoomToolsSize: "s", mapInfos: (_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.filter(mapInfo => mapInfo.visible !== false), mapWidgetsIndex: 0, mapWidgetsPosition: "top-right", mapWidgetsSize: "m", stackTools: true, theme: this.theme, toolOrder: ["legend", "search", "fullscreen", "basemap", "floorfilter"] })));
326
+ return (h("div", { class: `${mapContainerClass} overflow-hidden` }, h("map-card", { appProxies: this.appProxies, basemapConfig: this.basemapConfig, class: "width-full", defaultWebmapId: this.defaultWebmap, enableBasemap: this.enableBasemap, enableFloorFilter: this.enableFloorFilter, enableFullscreen: this.enableFullscreen, enableHome: this.enableHome, enableLegend: this.enableLegend, enableSearch: this.enableSearch, enableSingleExpand: true, hidden: this._expandPopup && !this._isMobile, homeZoomIndex: 3, homeZoomPosition: "top-left", homeZoomToolsSize: "s", mapInfos: (_a = this.mapInfos) === null || _a === void 0 ? void 0 : _a.filter(mapInfo => mapInfo.visible !== false), mapWidgetsIndex: 0, mapWidgetsPosition: "top-right", mapWidgetsSize: "m", stackTools: true, theme: this.theme, toolOrder: ["legend", "search", "fullscreen", "basemap", "floorfilter"] })));
326
327
  }
327
328
  /**
328
329
  * Get the expand node for the popup information