@arcgis/map-components 5.2.0-next.0 → 5.2.0-next.10

package/dist/components/arcgis-legend/customElement.js

@@ -1,7 +1,7 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
 import { c as l } from "../../chunks/runtime.js";
 import { css as d, html as r } from "lit";
-import { on as o, watch as s } from "@arcgis/core/core/reactiveUtils.js";
+import { on as o, watch as a } from "@arcgis/core/core/reactiveUtils.js";
 import c from "@arcgis/core/widgets/Legend/LegendViewModel.js";
 import { LitElement as g, createEvent as h, safeClassMap as p } from "@arcgis/lumina";
 import { usePropertyChange as f } from "@arcgis/lumina/controllers";
@@ -9,8 +9,8 @@ import { classes as u } from "@arcgis/toolkit/dom";
 import { u as _ } from "../../chunks/useHandles.js";
 import { u as m } from "../../chunks/useT9n.js";
 import { m as v } from "../../chunks/useViewModel.js";
-import { g as a } from "../../chunks/globalCss.js";
-const w = d`.esri-widget__heading{color:var(--calcite-color-text-2);margin:0 0 .5rem;font-weight:var(--calcite-font-weight-semibold)}h1.esri-widget__heading{font-size:var(--calcite-font-size-xl)}h2.esri-widget__heading{font-size:var(--calcite-font-size-md)}h3.esri-widget__heading,h4.esri-widget__heading,h5.esri-widget__heading,h6.esri-widget__heading{font-size:var(--calcite-font-size)}.esri-widget{box-sizing:border-box;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget *,.esri-widget :before,.esri-widget :after{box-sizing:inherit}.esri-widget.esri-widget--disabled>*{opacity:.4;pointer-events:none}.esri-widget.esri-widget--compact{--esri-widget-padding-y: 0;--esri-widget-padding-x: 0}.esri-widget__anchor{color:var(--calcite-color-text-2)}.esri-widget__anchor:hover{color:var(--calcite-color-text-3)}.esri-widget__anchor:hover,.esri-widget__anchor:focus{text-decoration:underline}.esri-widget__anchor--disabled{opacity:.4;pointer-events:none}.esri-widget__header{background-color:var(--calcite-color-foreground-1);flex:1 0 100%;justify-content:space-between;align-items:center;width:100%;min-height:48px;padding:12px 0 12px 15px;display:flex}.esri-widget__heading{word-break:break-word}.esri-widget__header .esri-widget__heading{width:calc(100% - 48px);text-align:initial;color:var(--calcite-color-text-1);align-items:center;margin:0;padding:0;display:flex}.esri-widget__header-button{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);border:none;flex:0 0 48px;justify-content:center;align-self:stretch;align-items:center;width:48px;padding:0;display:flex}.esri-widget__footer{background-color:var(--calcite-color-foreground-1);justify-content:center;align-items:center;width:100%;min-height:48px;display:flex}.esri-widget__footer-pagination{color:var(--calcite-color-text-2);justify-content:space-between;align-items:center;display:flex}.esri-widget__footer-pagination-previous-button,.esri-widget__footer-pagination-next-button{cursor:pointer;background-color:var(--calcite-color-foreground-1);border:0;margin:0 7px;padding:12px 15px;transition:background-color .125s ease-in-out}.esri-widget__footer-pagination-previous-button:hover,.esri-widget__footer-pagination-previous-button:focus,.esri-widget__footer-pagination-next-button:hover,.esri-widget__footer-pagination-next-button:focus{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1)}.esri-menu{visibility:hidden;z-index:1;background-clip:padding;background-color:var(--calcite-color-foreground-1);background-clip:padding-box;width:100%;max-height:0;margin:2px 0 0;padding:0;font-size:var(--calcite-font-size);line-height:var(--calcite-spacing-xl);position:absolute;top:100%;left:0;overflow:hidden;box-shadow:0 1px 2px #0000004d}.esri-menu .esri-menu__header{color:var(--calcite-color-text-inverse);background-color:var(--calcite-color-inverse);padding:6px 12px}.esri-menu__list{margin:0;padding:0;list-style:none}.esri-menu__list-item{cursor:pointer;border-top:1px solid #adadad4d;border-left:3px solid #0000;padding:.8em 1em}.esri-menu__list-item [class^=esri-icon-],.esri-menu__list-item [class*=" esri-icon-"]{padding-right:2.8px}.esri-menu__list-item:first-child{border-top:none}.esri-menu__list-item--focus,.esri-menu__list-item:hover,.esri-menu__list-item:focus{background-color:var(--calcite-color-foreground-1)}.esri-menu__list-item:active{background-color:var(--calcite-color-foreground-current)}.esri-menu__list-item--active,.esri-menu__list-item--active:hover,.esri-menu__list-item--active:focus{background-color:var(--calcite-color-foreground-1);border-left-color:var(--calcite-color-brand)}.esri-widget__table{border-collapse:collapse;color:var(--calcite-color-text-1);border:none;width:100%;line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget__table tr:nth-child(odd){background-color:var(--calcite-color-transparent)}.esri-widget__table tr:nth-child(2n){background-color:var(--calcite-color-transparent-press)}.esri-widget__table tr a{color:var(--calcite-color-text-2)}.esri-widget__table tr a:hover,.esri-widget__table tr a:focus{color:var(--calcite-color-text-1)}.esri-widget__table tr td,.esri-widget__table tr th{vertical-align:top;word-break:break-word;padding:.5em .7em;font-size:var(--calcite-font-size-sm);font-weight:var(--calcite-font-weight-regular)}.esri-widget__table tr th{text-align:left;border-right:3px solid #0000000d;width:50%}.esri-widget__table tr td{width:50%}.esri-input{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1);border:1px solid #959595;font-size:var(--calcite-font-size)}.esri-input::-ms-clear{display:none}.esri-input::placeholder{opacity:1;color:var(--calcite-color-text-2)}.esri-input:placeholder-shown{text-overflow:ellipsis}.esri-input[type=text],.esri-input[type=password],.esri-input[type=number]{height:32px;padding:0 .5em}calcite-combobox.esri-input{border:none}.esri-widget__content--empty{text-align:center;color:var(--calcite-color-border-input);flex-flow:column wrap;align-items:center;padding:18px 22px;display:flex}.esri-widget__content--empty h1.esri-widget__heading,.esri-widget__content--empty h2.esri-widget__heading,.esri-widget__content--empty h3.esri-widget__heading,.esri-widget__content--empty h4.esri-widget__heading,.esri-widget__content--empty h5.esri-widget__heading{font-weight:var(--calcite-font-weight-regular)}.esri-widget__content-illustration--empty{width:128px;padding:1rem 0}.esri-widget__content-icon--empty{width:32px;padding:.5rem 0}.esri-select{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background:var(--calcite-color-foreground-1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 32 32' width='32' height='32'%3E%3Cpath d='M8 11.207l-4-4V5.793l4 4 4-4v1.414z' fill='%23adadad' fillrule='nonzero'/%3E%3C/svg%3E") 100% no-repeat;border:1px solid #959595;border-radius:0;width:100%;height:32px;margin:0;padding:0 .5em;font-family:inherit;font-size:.85em;display:block}.esri-select[disabled]{cursor:auto}.esri-select::-ms-expand{display:none}.esri-disabled a,.esri-disabled [role=menu],.esri-disabled [role=checkbox],.esri-disabled [class^=esri-icon-],.esri-disabled [class*=" esri-icon-"]{color:var(--calcite-color-text-3)}.keynav-mode .esri-widget:focus,.keynav-mode .esri-widget :focus{z-index:1;outline-offset:2px;outline:2px solid #adadad}.esri-widget__loader-animation{border:.15em solid #adadad4d;border-top-color:var(--calcite-color-border-input);border-radius:100%;width:1em;height:1em;font-size:var(--calcite-font-size-md);animation:1.25s linear infinite esri-rotate;display:block;transform:translateZ(0)}:dir(rtl) .esri-widget__table th{text-align:right;border-left:3px solid #0000000d;border-right:none}:dir(rtl) .esri-select{background-position:0}:dir(rtl) .esri-menu__list-item{border-left:none;border-right:3px solid #0000}:dir(rtl) .esri-menu__list-item [class^=esri-icon-],:dir(rtl) .esri-menu__list-item [class*=" esri-icon-"]{padding-left:2px;padding-right:0}:dir(rtl) .esri-menu__list-item--active{border-right-color:var(--calcite-color-brand)}.esri-icon-font-fallback-text{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.esri-rotating{animation:1.25s linear infinite esri-rotate;transform:translateZ(0)}.esri-clearfix:before,.esri-clearfix:after{content:" ";display:table}.esri-clearfix:after{clear:both}.esri-interactive{cursor:pointer}.esri-hidden{display:none!important}.esri-invisible{visibility:hidden!important}.esri-offscreen{position:absolute;top:-999em;left:-999em}.esri-match-height{flex-direction:column;flex:auto;display:flex;overflow:hidden}:host{overflow:auto;width:var(--arcgis-internal-legend-width, 300px)}.root{overflow-y:var(--arcgis-internal-panel-overflow, auto)}:host([card-style-layout="side-by-side"]){--arcgis-internal-legend-width: auto}`, y = v(c);
+import { g as s } from "../../chunks/globalCss.js";
+const w = d`.esri-widget__heading{color:var(--calcite-color-text-2);margin:0 0 .5rem;font-weight:var(--calcite-font-weight-semibold)}h1.esri-widget__heading{font-size:var(--calcite-font-size-xl)}h2.esri-widget__heading{font-size:var(--calcite-font-size-md)}h3.esri-widget__heading,h4.esri-widget__heading,h5.esri-widget__heading,h6.esri-widget__heading{font-size:var(--calcite-font-size)}.esri-widget{box-sizing:border-box;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget *,.esri-widget :before,.esri-widget :after{box-sizing:inherit}.esri-widget.esri-widget--disabled>*{opacity:.4;pointer-events:none}.esri-widget.esri-widget--compact{--esri-widget-padding-y: 0;--esri-widget-padding-x: 0}.esri-widget__anchor{color:var(--calcite-color-text-2)}.esri-widget__anchor:hover{color:var(--calcite-color-text-3)}.esri-widget__anchor:hover,.esri-widget__anchor:focus{text-decoration:underline}.esri-widget__anchor--disabled{opacity:.4;pointer-events:none}.esri-widget__header{background-color:var(--calcite-color-foreground-1);flex:1 0 100%;justify-content:space-between;align-items:center;width:100%;min-height:48px;padding:12px 0 12px 15px;display:flex}.esri-widget__heading{word-break:break-word}.esri-widget__header .esri-widget__heading{width:calc(100% - 48px);text-align:initial;color:var(--calcite-color-text-1);align-items:center;margin:0;padding:0;display:flex}.esri-widget__header-button{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background-color:var(--calcite-color-foreground-1);border:none;flex:0 0 48px;justify-content:center;align-self:stretch;align-items:center;width:48px;padding:0;display:flex}.esri-widget__footer{background-color:var(--calcite-color-foreground-1);justify-content:center;align-items:center;width:100%;min-height:48px;display:flex}.esri-widget__footer-pagination{color:var(--calcite-color-text-2);justify-content:space-between;align-items:center;display:flex}.esri-widget__footer-pagination-previous-button,.esri-widget__footer-pagination-next-button{cursor:pointer;background-color:var(--calcite-color-foreground-1);border:0;margin:0 7px;padding:12px 15px;transition:background-color .125s ease-in-out}.esri-widget__footer-pagination-previous-button:hover,.esri-widget__footer-pagination-previous-button:focus,.esri-widget__footer-pagination-next-button:hover,.esri-widget__footer-pagination-next-button:focus{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1)}.esri-menu{visibility:hidden;z-index:1;background-clip:padding;background-color:var(--calcite-color-foreground-1);background-clip:padding-box;width:100%;max-height:0;margin:2px 0 0;padding:0;font-size:var(--calcite-font-size);line-height:var(--calcite-spacing-xl);position:absolute;top:100%;left:0;overflow:hidden;box-shadow:0 1px 2px #0000004d}.esri-menu .esri-menu__header{color:var(--calcite-color-text-inverse);background-color:var(--calcite-color-inverse);padding:6px 12px}.esri-menu__list{margin:0;padding:0;list-style:none}.esri-menu__list-item{cursor:pointer;border-top:1px solid #adadad4d;border-left:3px solid #0000;padding:.8em 1em}.esri-menu__list-item [class^=esri-icon-],.esri-menu__list-item [class*=" esri-icon-"]{padding-right:2.8px}.esri-menu__list-item:first-child{border-top:none}.esri-menu__list-item--focus,.esri-menu__list-item:hover,.esri-menu__list-item:focus{background-color:var(--calcite-color-foreground-1)}.esri-menu__list-item:active{background-color:var(--calcite-color-foreground-current)}.esri-menu__list-item--active,.esri-menu__list-item--active:hover,.esri-menu__list-item--active:focus{background-color:var(--calcite-color-foreground-1);border-left-color:var(--calcite-color-brand)}.esri-widget__table{border-collapse:collapse;color:var(--calcite-color-text-1);border:none;width:100%;line-height:var(--calcite-font-line-height-relative-tight)}.esri-widget__table tr:nth-child(odd){background-color:var(--calcite-color-transparent)}.esri-widget__table tr:nth-child(2n){background-color:var(--calcite-color-transparent-press)}.esri-widget__table tr a{color:var(--calcite-color-text-2)}.esri-widget__table tr a:hover,.esri-widget__table tr a:focus{color:var(--calcite-color-text-1)}.esri-widget__table tr td,.esri-widget__table tr th{vertical-align:top;word-break:break-word;padding:.5em .7em;font-size:var(--calcite-font-size-sm);font-weight:var(--calcite-font-weight-regular)}.esri-widget__table tr th{text-align:left;border-right:3px solid #0000000d;width:50%}.esri-widget__table tr td{width:50%}.esri-input{color:var(--calcite-color-text-1);background-color:var(--calcite-color-foreground-1);border:1px solid #959595;font-size:var(--calcite-font-size)}.esri-input::-ms-clear{display:none}.esri-input::placeholder{opacity:1;color:var(--calcite-color-text-2)}.esri-input:placeholder-shown{text-overflow:ellipsis}.esri-input[type=text],.esri-input[type=password],.esri-input[type=number]{height:32px;padding:0 .5em}calcite-combobox.esri-input{border:none}.esri-widget__content--empty{text-align:center;color:var(--calcite-color-border-input);flex-flow:column wrap;align-items:center;padding:18px 22px;display:flex}.esri-widget__content--empty h1.esri-widget__heading,.esri-widget__content--empty h2.esri-widget__heading,.esri-widget__content--empty h3.esri-widget__heading,.esri-widget__content--empty h4.esri-widget__heading,.esri-widget__content--empty h5.esri-widget__heading{font-weight:var(--calcite-font-weight-regular)}.esri-widget__content-illustration--empty{width:128px;padding:1rem 0}.esri-widget__content-icon--empty{width:32px;padding:.5rem 0}.esri-select{appearance:none;cursor:pointer;color:var(--calcite-color-text-2);background:var(--calcite-color-foreground-1) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-8 -8 32 32' width='32' height='32'%3E%3Cpath d='M8 11.207l-4-4V5.793l4 4 4-4v1.414z' fill='%23adadad' fillrule='nonzero'/%3E%3C/svg%3E") 100% no-repeat;border:1px solid #959595;border-radius:0;width:100%;height:32px;margin:0;padding:0 .5em;font-family:inherit;font-size:.85em;display:block}.esri-select[disabled]{cursor:auto}.esri-select::-ms-expand{display:none}.esri-disabled a,.esri-disabled [role=menu],.esri-disabled [role=checkbox],.esri-disabled [class^=esri-icon-],.esri-disabled [class*=" esri-icon-"]{color:var(--calcite-color-text-3)}.keynav-mode .esri-widget:focus,.keynav-mode .esri-widget :focus{z-index:1;outline-offset:2px;outline:2px solid #adadad}.esri-widget__loader-animation{border:.15em solid #adadad4d;border-top-color:var(--calcite-color-border-input);border-radius:100%;width:1em;height:1em;font-size:var(--calcite-font-size-md);animation:1.25s linear infinite esri-rotate;display:block;transform:translateZ(0)}:dir(rtl) .esri-widget__table th{text-align:right;border-left:3px solid #0000000d;border-right:none}:dir(rtl) .esri-select{background-position:0}:dir(rtl) .esri-menu__list-item{border-left:none;border-right:3px solid #0000}:dir(rtl) .esri-menu__list-item [class^=esri-icon-],:dir(rtl) .esri-menu__list-item [class*=" esri-icon-"]{padding-left:2px;padding-right:0}:dir(rtl) .esri-menu__list-item--active{border-right-color:var(--calcite-color-brand)}.esri-icon-font-fallback-text{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.esri-rotating{animation:1.25s linear infinite esri-rotate;transform:translateZ(0)}.esri-clearfix:before,.esri-clearfix:after{content:" ";display:table}.esri-clearfix:after{clear:both}.esri-interactive{cursor:pointer}.esri-hidden{display:none!important}.esri-invisible{visibility:hidden!important}.esri-offscreen{position:absolute;top:-999em;left:-999em}.esri-match-height{flex-direction:column;flex:auto;display:flex;overflow:hidden}:host{--arcgis-internal-legend-heading-margin: 0 0 .5rem;--arcgis-internal-legend-layer-padding: var( --arcgis-internal-padding, var(--calcite-spacing-md) var(--calcite-spacing-lg) );--arcgis-internal-legend-layer-gap: var(--calcite-spacing-xxl);--arcgis-internal-legend-layer-element-gap: var(--calcite-spacing-md);overflow:auto;width:var(--arcgis-internal-legend-width, 300px)}.root{overflow-y:var(--arcgis-internal-panel-overflow, auto)}:host([card-style-layout="side-by-side"]){--arcgis-internal-legend-width: auto}`, y = v(c);
 class b extends g {
   constructor() {
     super(...arguments), this.messages = m({}), this.final = _("destroy"), this.viewModel = y(this), this._isCardStyle = !1, this.view = this.viewModel.view, this.icon = "legend", this.activeLayerInfos = this.viewModel.activeLayerInfos, this.basemapLegendVisible = this.viewModel.basemapLegendVisible, this.headingLevel = 3, this.hideLayersNotInCurrentView = this.viewModel.hideLayersNotInCurrentView, this.respectLayerDefinitionExpression = this.viewModel.respectLayerDefinitionExpression, this.layerInfos = this.viewModel.layerInfos, this.loading = this.viewModel.loading, this.legendStyle = "classic", this.autoDestroyDisabled = !1, this.label = this.messages?.componentLabel, this.state = this.viewModel.state, this.arcgisPropertyChange = f()("state"), this.arcgisReady = h();
@@ -34,7 +34,7 @@ class b extends g {
     this.manager.onLifecycle(() => [
       o(() => this.el.view, "resize", () => this.requestUpdate()),
       o(() => this.activeLayerInfos, "change", () => this._refreshActiveLayerInfos(this.activeLayerInfos)),
-      s(() => [
+      a(() => [
         this.cardStyleLayout,
         this.legendStyle,
         typeof this.legendStyle == "object" ? this.legendStyle.type : void 0,
@@ -51,10 +51,10 @@ class b extends g {
     }), this.requestUpdate();
   }
   render() {
-    return r`<div class=${p(u("root", a.widget, { [a.panel]: !this._isCardStyle }))}>${this._isCardStyle && this.view ? r`<arcgis-legend-card-view .activeLayerInfos=${this.activeLayerInfos} .headingLevel=${this.headingLevel} .messages=${this.messages} .layout=${this.cardStyleLayout} .view=${this.view}></arcgis-legend-card-view>` : r`<arcgis-legend-classic-view .activeLayerInfos=${this.activeLayerInfos} .headingLevel=${this.headingLevel} .messages=${this.messages}></arcgis-legend-classic-view>`}</div>`;
+    return r`<div class=${p(u("root", s.widget, { [s.panel]: !this._isCardStyle }))}>${this._isCardStyle && this.view ? r`<arcgis-legend-card-view .activeLayerInfos=${this.activeLayerInfos} .headingLevel=${this.headingLevel} .messages=${this.messages} .layout=${this.cardStyleLayout} .view=${this.view}></arcgis-legend-card-view>` : r`<arcgis-legend-classic-view .activeLayerInfos=${this.activeLayerInfos} .headingLevel=${this.headingLevel} .messages=${this.messages}></arcgis-legend-classic-view>`}</div>`;
   }
   _renderOnActiveLayerInfoChange(e) {
-    const i = s(() => e.version, () => this.requestUpdate());
+    const i = a(() => e.version, () => this.requestUpdate());
     this.final.addHandles(i, `version_${e.layer.uid}`);
     const n = o(() => e.children, "change", () => e.children.forEach((t) => this._renderOnActiveLayerInfoChange(t)));
     this.final.addHandles(n, `version_${e.layer.uid}`), e.children.forEach((t) => this._renderOnActiveLayerInfoChange(t));

package/dist/components/arcgis-legend-classic-element/customElement.js

@@ -4,7 +4,7 @@ import { css as $, html as s } from "lit";
 import { LitElement as u, safeClassMap as n, nothing as c, safeStyleMap as w } from "@arcgis/lumina";
 import { classes as g } from "@arcgis/toolkit/dom";
 import { b as E, s as p, i as f, c as d, g as y } from "../../chunks/utils2.js";
-const L = $`.layer-table{display:table;margin-bottom:var(--calcite-spacing-md);width:100%}.layer-caption{display:table-caption;padding:var(--calcite-spacing-sm) 0;word-break:break-word}.layer-body{margin-left:var(--calcite-spacing-sm)}:dir(rtl) .layer-body{margin-right:var(--calcite-spacing-sm);margin-left:0;overflow:auto}.layer-row{display:table-row}.layer-cell{padding:var(--calcite-spacing-xxs) 0;vertical-align:middle;word-break:break-word;display:table-cell}.layer-cell-info{padding-right:var(--calcite-spacing-sm);padding-left:var(--calcite-spacing-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.imagery-layer-stretched-image{display:block;margin-bottom:-2px}.imagery-layer-info-stretched{padding:0 2px;vertical-align:top}.layer-cell-symbols{text-align:center}.symbol{display:flex;justify-content:center}`;
+const L = $`:host{contain:content}.layer-table{display:table;width:100%}.layer-caption{display:table-caption;padding:var(--calcite-spacing-sm) 0;word-break:break-word}.layer-body{margin-left:var(--calcite-spacing-sm)}:dir(rtl) .layer-body{margin-right:var(--calcite-spacing-sm);margin-left:0;overflow:auto}.layer-row{display:table-row}.layer-cell{padding:var(--calcite-spacing-xxs) 0;vertical-align:middle;word-break:break-word;display:table-cell}.layer-cell-info{padding-right:var(--calcite-spacing-sm);padding-left:var(--calcite-spacing-sm);max-width:250px;word-break:normal;word-wrap:normal;font-size:var(--calcite-font-size-sm)}.imagery-layer-stretched-image{display:block;margin-bottom:-2px}.imagery-layer-info-stretched{padding:0 2px;vertical-align:top}.layer-cell-symbols{text-align:center}.symbol{display:flex;justify-content:center}`;
 class x extends u {
   static {
     this.properties = { cssEffectFilter: 1, layer: 0, legendElement: 0, messages: 0 };

package/dist/components/arcgis-legend-classic-view/customElement.js

@@ -1,11 +1,11 @@
 /* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
 import { c as n } from "../../chunks/runtime.js";
-import { css as c, html as t } from "lit";
+import { css as c, html as a } from "lit";
 import { LitElement as d, safeClassMap as o } from "@arcgis/lumina";
 import { classes as g } from "@arcgis/toolkit/dom";
 import { H as m } from "../../chunks/heading.js";
-const h = c`.esri-widget__heading{color:var(--calcite-color-text-2);margin:0 0 .5rem;font-weight:var(--calcite-font-weight-semibold)}h1.esri-widget__heading{font-size:var(--calcite-font-size-xl)}h2.esri-widget__heading{font-size:var(--calcite-font-size-md)}h3.esri-widget__heading,h4.esri-widget__heading,h5.esri-widget__heading,h6.esri-widget__heading{font-size:var(--calcite-font-size)}:host{display:block}.no-legend{padding:var(--calcite-spacing-sm) var(--calcite-spacing-md)}.layer{border-bottom:1px solid var(--calcite-color-border-2);padding:var(--arcgis-internal-padding, var(--calcite-spacing-md) var(--calcite-spacing-lg));word-wrap:break-word}.layer:last-child{border-bottom:none}.layer-elements{margin-left:var(--calcite-spacing-sm);overflow:auto}.layer-child{margin-left:var(--calcite-spacing-sm);padding-right:0;padding-left:0}:dir(rtl) .layer-elements,:dir(rtl) .layer-child{margin-right:var(--calcite-spacing-sm);margin-left:0;overflow:auto}`;
-class p extends d {
+const h = c`.esri-widget__heading{color:var(--calcite-color-text-2);margin:0 0 .5rem;font-weight:var(--calcite-font-weight-semibold)}h1.esri-widget__heading{font-size:var(--calcite-font-size-xl)}h2.esri-widget__heading{font-size:var(--calcite-font-size-md)}h3.esri-widget__heading,h4.esri-widget__heading,h5.esri-widget__heading,h6.esri-widget__heading{font-size:var(--calcite-font-size)}:host{display:block}.layers{display:flex;flex-direction:column;gap:var(--arcgis-internal-legend-layer-gap)}.layers>.layer{position:relative}.layers>.layer:not(:last-child):after{content:"";position:absolute;left:0;right:0;bottom:calc(var(--arcgis-internal-legend-layer-gap) / -2);border-bottom:1px solid var(--calcite-color-border-2)}.layers>.layer:last-child{padding-bottom:var(--arcgis-internal-legend-layer-gap)}.layer>.esri-widget__heading{margin:var(--arcgis-internal-legend-heading-margin)}.no-legend{padding:var(--calcite-spacing-sm) var(--calcite-spacing-md)}.layer{padding:var(--arcgis-internal-legend-layer-padding);word-wrap:break-word}.layer-elements{margin-left:var(--calcite-spacing-sm);display:flex;flex-direction:column;gap:var(--arcgis-internal-legend-layer-element-gap);overflow:auto}.layer-children{display:flex;flex-direction:column;gap:var(--arcgis-internal-legend-layer-gap)}.layer-children>.layer{position:relative}.layer-children>.layer:not(:last-child):after{content:"";position:absolute;left:0;right:0;bottom:calc(var(--arcgis-internal-legend-layer-gap) / -2);border-bottom:1px solid var(--calcite-color-border-2)}.layer-child{margin-left:var(--calcite-spacing-sm);padding:0}:dir(rtl) .layer-elements,:dir(rtl) .layer-child{margin-right:var(--calcite-spacing-sm);margin-left:0;overflow:auto}`;
+class y extends d {
   constructor() {
     super(...arguments), this.headingLevel = 3, this.type = "classic";
   }
@@ -16,31 +16,31 @@ class p extends d {
     this.styles = h;
   }
   render() {
-    const s = this.activeLayerInfos?.toArray().map((r) => this._renderLegendForLayer(r)).filter(Boolean);
-    return s?.length ? t`<section>${s}</section>` : t`<div class="no-legend">${this.messages.noLegend}</div>`;
+    const r = this.activeLayerInfos?.toArray().map((l) => this._renderLegendForLayer(l)).filter(Boolean);
+    return r?.length ? a`<section class="layers">${r}</section>` : a`<div class="no-legend">${this.messages.noLegend}</div>`;
   }
   _renderLegendForLayer(e) {
     if (!e.ready)
       return null;
-    const s = e.title ? m({
+    const r = e.title ? m({
       level: this.headingLevel,
       children: e.title
     }) : null;
     if (e.children.length) {
-      const r = e.children.toArray().map((i) => this._renderLegendForLayer(i));
-      return t`<section class="layer">${s}${r}</section>`;
+      const l = e.children.toArray().map((i) => this._renderLegendForLayer(i));
+      return a`<section class="layer">${r}<div class="layer-children">${l}</div></section>`;
     }
-    return this._renderLegendElementsForLayer(e, s);
+    return this._renderLegendElementsForLayer(e, r);
   }
-  _renderLegendElementsForLayer(e, s) {
-    const r = e.legendElements?.filter(Boolean);
-    if (!r?.length)
+  _renderLegendElementsForLayer(e, r) {
+    const l = e.legendElements?.filter(Boolean);
+    if (!l?.length)
       return null;
-    const i = r.map((a) => t`<arcgis-legend-classic-element .cssEffectFilter=${e.cssEffectFilter ?? void 0} .layer=${e.layer} .legendElement=${a} .messages=${this.messages}></arcgis-legend-classic-element>`), l = { "layer-child": !!e.parent };
-    return t`<section class=${o(g("layer", l))}>${s}<div class="layer-elements">${i}</div></section>`;
+    const i = l.map((s) => a`<arcgis-legend-classic-element .cssEffectFilter=${e.cssEffectFilter ?? void 0} .layer=${e.layer} .legendElement=${s} .messages=${this.messages}></arcgis-legend-classic-element>`), t = { "layer-child": !!e.parent };
+    return a`<section class=${o(g("layer", t))}>${r}<div class="layer-elements">${i}</div></section>`;
   }
 }
-n("arcgis-legend-classic-view", p);
+n("arcgis-legend-classic-view", y);
 export {
-  p as LegendClassicView
+  y as LegendClassicView
 };

package/dist/components/arcgis-link-chart/customElement.d.ts

@@ -7,12 +7,12 @@ import type Analysis from "@arcgis/core/analysis/Analysis.js";
 import type Point from "@arcgis/core/geometry/Point.js";
 import type Viewpoint from "@arcgis/core/Viewpoint.js";
 import type Basemap from "@arcgis/core/Basemap.js";
+import type Graphic from "@arcgis/core/Graphic.js";
 import type Collection from "@arcgis/core/core/Collection.js";
 import type ColorBackground from "@arcgis/core/webmap/background/ColorBackground.js";
 import type BasemapView from "@arcgis/core/views/BasemapView.js";
 import type MapViewConstraints from "@arcgis/core/views/2d/MapViewConstraints.js";
 import type Error from "@arcgis/core/core/Error.js";
-import type Graphic from "@arcgis/core/Graphic.js";
 import type HighlightOptions from "@arcgis/core/views/support/HighlightOptions.js";
 import type Magnifier from "@arcgis/core/views/Magnifier.js";
 import type Navigation from "@arcgis/core/views/navigation/Navigation.js";
@@ -27,8 +27,8 @@ import type { ArcgisPopup } from "../arcgis-popup/customElement.js";
 import type { DoubleTapDragEvent, VerticalTwoFingerDragEvent, PointerUpEvent, PointerMoveEvent, PointerLeaveEvent, PointerEnterEvent, PointerDownEvent, ViewMouseWheelEvent, LayerViewDestroyEvent, LayerViewCreateErrorEvent, LayerViewCreateEvent, KeyUpEvent, KeyDownEvent, ImmediateDoubleClickEvent, ImmediateClickEvent, HoldEvent, DragEvent, DoubleClickEvent, ClickEvent } from "@arcgis/core/views/input/types.js";
 import type { AnalysisViewDestroyEvent, AnalysisViewCreateErrorEvent, AnalysisViewCreateEvent, ToScreenOptions2D, GoToOptions2D, GoToTarget2D } from "@arcgis/core/views/types.js";
 import type { AnalysisView2DUnion } from "@arcgis/core/views/2d/analysis/types.js";
-import type { ScreenPoint } from "@arcgis/core/core/types.js";
-import type { ViewPopupOpenOptions } from "@arcgis/core/views/PopupView.js";
+import type { ScreenPoint, ScreenRect } from "@arcgis/core/core/types.js";
+import type { FetchPopupFeaturesOptions, ViewPopupOpenOptions } from "@arcgis/core/views/PopupView.js";
 import type { ReadonlyCollection } from "@arcgis/core/core/Collection.js";
 import type { ViewPadding } from "@arcgis/core/views/ui/types.js";
 import type { ResizeAlign } from "@arcgis/core/views/2d/types.js";
@@ -730,7 +730,38 @@ export abstract class ArcgisLinkChart extends LitElement {
   closePopup(): Promise<void>;
   /** Destroys the view, and any associated resources, including its map, popup, and UI elements. */
   destroy(): Promise<void>;
-  focusPopup(): Promise<void>;
+  /**
+   * Use this method to query for features at a given screen location. These features come from origins (layers and sublayers) configured with a [PopupTemplate](https://developers.arcgis.com/javascript/latest/references/core/PopupTemplate/) and have its [FeatureLayer.popupEnabled](https://developers.arcgis.com/javascript/latest/references/core/layers/FeatureLayer/#popupEnabled) set. One example could be a custom side panel that displays feature-specific information based on an end user's click location. This method allows a developer to control how the input location is handled, and then subsequently, what to do with the results.
+   *
+   * @param hitTarget
+   * @param options
+   * @since 5.1
+   * @example
+   * ```js
+   * const viewElement = document.querySelector("arcgis-map");
+   * // Get viewElement's click event
+   * viewElement.addEventListener("arcgisViewClick", async (event) => {
+   *   const generator = await viewElement.fetchPopupFeatures(event.detail.screenPoint, {
+   *     pointerType: event.detail.pointerType
+   *   });
+   *   // Access the features returned from the generator
+   *   for await (const feature of generator) {
+   *     console.log(feature);
+   *   }
+   * });
+   * ```
+   * @example
+   * ```js
+   * // Wait for all the features to be available
+   * view.on("click", async (event) => {
+   *   const generator = view.fetchPopupFeatures(event.screenPoint, {
+   *     pointerType: event.pointerType
+   *   });
+   *
+   *   const features = await Array.fromAsync(generator);
+   * });
+   */
+  fetchPopupFeatures(hitTarget: ScreenPoint | ScreenRect, options?: FetchPopupFeaturesOptions): Promise<AsyncGenerator<Graphic>>;
   /**
    * Sets the view to a given target.
    *

package/dist/components/arcgis-link-chart/customElement.js

@@ -10,14 +10,14 @@ import { s as I } from "../../chunks/esri-main.js";
 import { s as E } from "../../chunks/slots.js";
 import { C as u } from "../../chunks/resources.js";
 import { p as L, i as k } from "../../chunks/component-utils.js";
-import { U as M, P as R, u as U, a as D } from "../../chunks/useArcgisViewReadyError.js";
-import { fetchKnowledgeGraph as P } from "@arcgis/core/rest/knowledgeGraphService.js";
+import { U as M, u as R, a as U } from "../../chunks/useArcgisViewReadyError.js";
+import { fetchKnowledgeGraph as D } from "@arcgis/core/rest/knowledgeGraphService.js";
 import x from "@arcgis/core/rest/knowledgeGraph/GraphQueryStreaming.js";
 import { t as d } from "../../chunks/async-utils.js";
 import { isAbortError as g } from "@arcgis/core/core/promiseUtils.js";
 import { html as y } from "lit";
 import Q from "@arcgis/core/layers/LinkChartLayer.js";
-const z = f(
+const P = f(
   b,
   /**
    * Since omitProps is only needed for typing, not runtime, `{} as { ... }` is
@@ -28,10 +28,10 @@ const z = f(
    * in an externalized package.
    */
   {}
-), Z = f(_, {});
-class F extends V {
+), z = f(_, {});
+class Z extends V {
   constructor() {
-    super(), this._containerRef = v(), this._mapRef = v(), this._uiController = new M(this), this._popupFocusController = new R(this), this._activeLoadAbortController = null, this.arcgisLoadError = U(this), this.arcgisViewReadyError = D(this), this._map = z(this), this._baseCypherQuery = "", this._serviceUrl = "", this._propItemId = "", this.view = Z(this), this.animationsDisabled = this.view.animationsEnabled, this.allLayerViews = this.view.allLayerViews, this.analyses = this.view.analyses, this.attributionMode = this.view.attributionMode, this.autoDestroyDisabled = !1, this.background = this.view.background, this.basemap = this._map.basemap, this.basemapView = this.view.basemapView, this.canZoomIn = this.view.canZoomIn, this.canZoomOut = this.view.canZoomOut, this.constraints = this.view.constraints, this.displayFilterDisabled = this.view.displayFilterEnabled, this.fatalError = this.view.fatalError, this.graphics = this.view.graphics, this.highlights = this.view.highlights, this.layerViews = this.view.layerViews, this.magnifier = this.view.magnifier, this.map = this.view.map, this.navigation = this.view.navigation, this.padding = this.view.padding, this.popup = this.view.popup, this.popupDisabled = this.view.popupEnabled, this.popupComponentEnabled = !1, this.ready = this.view.ready, this.resizeAlign = this.view.resizeAlign, this.resolution = this.view.resolution, this.rotation = this.view.rotation, this.selectionManager = this.view.selectionManager, this.slotGroupRefs = this._uiController.slotGroupRefs, this.spatialReference = this.view.spatialReference, this.suspended = this.view.suspended, this.theme = this.view.theme, this.timeExtent = this.view.timeExtent, this.timeZone = this.view.timeZone, this.updating = this.view.updating, this.arcgisViewAnalysisViewCreate = e(() => this.view, "analysis-view-create"), this.arcgisViewAnalysisViewCreateError = e(() => this.view, "analysis-view-create-error"), this.arcgisViewAnalysisViewDestroy = e(() => this.view, "analysis-view-destroy"), this.arcgisViewChange = c(), this.arcgisViewClick = e(() => this.view, "click"), this.arcgisViewDoubleClick = e(() => this.view, "double-click"), this.arcgisViewDoubleTapDrag = e(() => this.view, "double-tap-drag"), this.arcgisViewDrag = e(() => this.view, "drag"), this.arcgisViewHold = e(() => this.view, "hold"), this.arcgisViewImmediateClick = e(() => this.view, "immediate-click"), this.arcgisViewImmediateDoubleClick = e(() => this.view, "immediate-double-click"), this.arcgisViewKeyDown = e(() => this.view, "key-down"), this.arcgisViewKeyUp = e(() => this.view, "key-up"), this.arcgisViewLayerviewCreate = e(() => this.view, "layerview-create"), this.arcgisViewLayerviewCreateError = e(() => this.view, "layerview-create-error"), this.arcgisViewLayerviewDestroy = e(() => this.view, "layerview-destroy"), this.arcgisViewMouseWheel = e(() => this.view, "mouse-wheel"), this.arcgisViewPointerDown = e(() => this.view, "pointer-down"), this.arcgisViewPointerEnter = e(() => this.view, "pointer-enter"), this.arcgisViewPointerLeave = e(() => this.view, "pointer-leave"), this.arcgisViewPointerMove = e(() => this.view, "pointer-move"), this.arcgisViewPointerUp = e(() => this.view, "pointer-up"), this.arcgisViewReadyChange = c(), this.arcgisViewVerticalTwoFingerDrag = e(() => this.view, "vertical-two-finger-drag"), this.view.ui = {
+    super(), this._containerRef = v(), this._mapRef = v(), this._uiController = new M(this), this._activeLoadAbortController = null, this.arcgisLoadError = R(this), this.arcgisViewReadyError = U(this), this._map = P(this), this._baseCypherQuery = "", this._serviceUrl = "", this._propItemId = "", this.view = z(this), this.animationsDisabled = this.view.animationsEnabled, this.allLayerViews = this.view.allLayerViews, this.analyses = this.view.analyses, this.attributionMode = this.view.attributionMode, this.autoDestroyDisabled = !1, this.background = this.view.background, this.basemap = this._map.basemap, this.basemapView = this.view.basemapView, this.canZoomIn = this.view.canZoomIn, this.canZoomOut = this.view.canZoomOut, this.constraints = this.view.constraints, this.displayFilterDisabled = this.view.displayFilterEnabled, this.fatalError = this.view.fatalError, this.graphics = this.view.graphics, this.highlights = this.view.highlights, this.layerViews = this.view.layerViews, this.magnifier = this.view.magnifier, this.map = this.view.map, this.navigation = this.view.navigation, this.padding = this.view.padding, this.popup = this.view.popup, this.popupDisabled = this.view.popupEnabled, this.popupComponentEnabled = !1, this.ready = this.view.ready, this.resizeAlign = this.view.resizeAlign, this.resolution = this.view.resolution, this.rotation = this.view.rotation, this.selectionManager = this.view.selectionManager, this.slotGroupRefs = this._uiController.slotGroupRefs, this.spatialReference = this.view.spatialReference, this.suspended = this.view.suspended, this.theme = this.view.theme, this.timeExtent = this.view.timeExtent, this.timeZone = this.view.timeZone, this.updating = this.view.updating, this.arcgisViewAnalysisViewCreate = e(() => this.view, "analysis-view-create"), this.arcgisViewAnalysisViewCreateError = e(() => this.view, "analysis-view-create-error"), this.arcgisViewAnalysisViewDestroy = e(() => this.view, "analysis-view-destroy"), this.arcgisViewChange = c(), this.arcgisViewClick = e(() => this.view, "click"), this.arcgisViewDoubleClick = e(() => this.view, "double-click"), this.arcgisViewDoubleTapDrag = e(() => this.view, "double-tap-drag"), this.arcgisViewDrag = e(() => this.view, "drag"), this.arcgisViewHold = e(() => this.view, "hold"), this.arcgisViewImmediateClick = e(() => this.view, "immediate-click"), this.arcgisViewImmediateDoubleClick = e(() => this.view, "immediate-double-click"), this.arcgisViewKeyDown = e(() => this.view, "key-down"), this.arcgisViewKeyUp = e(() => this.view, "key-up"), this.arcgisViewLayerviewCreate = e(() => this.view, "layerview-create"), this.arcgisViewLayerviewCreateError = e(() => this.view, "layerview-create-error"), this.arcgisViewLayerviewDestroy = e(() => this.view, "layerview-destroy"), this.arcgisViewMouseWheel = e(() => this.view, "mouse-wheel"), this.arcgisViewPointerDown = e(() => this.view, "pointer-down"), this.arcgisViewPointerEnter = e(() => this.view, "pointer-enter"), this.arcgisViewPointerLeave = e(() => this.view, "pointer-leave"), this.arcgisViewPointerMove = e(() => this.view, "pointer-move"), this.arcgisViewPointerUp = e(() => this.view, "pointer-up"), this.arcgisViewReadyChange = c(), this.arcgisViewVerticalTwoFingerDrag = e(() => this.view, "vertical-two-finger-drag"), this.view.ui = {
       components: []
     };
   }
@@ -129,8 +129,8 @@ class F extends V {
   async closePopup() {
     this._uiController.closePopup();
   }
-  async focusPopup() {
-    this._popupFocusController.focusPopup();
+  async fetchPopupFeatures(i, t) {
+    return this.view.fetchPopupFeatures(i, t);
   }
   async destroy() {
     await this.manager.destroy();
@@ -236,7 +236,7 @@ class F extends V {
   }
 }
 const s = {
-  fetchKnowledgeGraph: async (r) => await P(r),
+  fetchKnowledgeGraph: async (r) => await D(r),
   WebLinkChart: b,
   LinkChartLayer: Q,
   setMap: (r, i) => {
@@ -253,8 +253,8 @@ const s = {
   },
   reCreateAccessor: A
 };
-C("arcgis-link-chart", F);
+C("arcgis-link-chart", Z);
 export {
-  F as ArcgisLinkChart,
+  Z as ArcgisLinkChart,
   s as exportsForTests
 };

package/dist/components/arcgis-link-chart-nonspatial-visibility-toggle/customElement.js

@@ -44,7 +44,7 @@ class y extends h {
 }
 const s = {
   changeNonspatialDataDisplay: (t, i) => {
-    t.map.changeNonspatialDataDisplay(i);
+    t.map?.changeNonspatialDataDisplay(i);
   },
   useView: (t) => m(t)
 };

package/dist/components/arcgis-map/customElement.d.ts

@@ -9,12 +9,12 @@ import type Ground from "@arcgis/core/Ground.js";
 import type GamepadSettings from "@arcgis/core/views/input/gamepad/GamepadSettings.js";
 import type Basemap from "@arcgis/core/Basemap.js";
 import type Map from "@arcgis/core/Map.js";
+import type Graphic from "@arcgis/core/Graphic.js";
 import type LayerView from "@arcgis/core/views/layers/LayerView.js";
 import type ColorBackground from "@arcgis/core/webmap/background/ColorBackground.js";
 import type BasemapView from "@arcgis/core/views/BasemapView.js";
 import type MapViewConstraints from "@arcgis/core/views/2d/MapViewConstraints.js";
 import type Error from "@arcgis/core/core/Error.js";
-import type Graphic from "@arcgis/core/Graphic.js";
 import type HighlightOptions from "@arcgis/core/views/support/HighlightOptions.js";
 import type IPSInfo from "@arcgis/core/webdoc/IPSInfo.js";
 import type Magnifier from "@arcgis/core/views/Magnifier.js";
@@ -33,7 +33,7 @@ import type { DoubleClickEvent, DoubleTapDragEvent, VerticalTwoFingerDragEvent,
 import type { AnalysisViewDestroyEvent, AnalysisViewCreateErrorEvent, AnalysisViewCreateEvent, ToScreenOptions2D, Screenshot, UserSettings, ViewHitTestResult, HitTestOptions, GoToOptions2D, GoToTarget2D } from "@arcgis/core/views/types.js";
 import type { AnalysisView2DUnion } from "@arcgis/core/views/2d/analysis/types.js";
 import type { ScreenPoint, ScreenRect } from "@arcgis/core/core/types.js";
-import type { ViewPopupOpenOptions } from "@arcgis/core/views/PopupView.js";
+import type { FetchPopupFeaturesOptions, ViewPopupOpenOptions } from "@arcgis/core/views/PopupView.js";
 import type { ReadonlyCollection } from "@arcgis/core/core/Collection.js";
 import type { ViewPadding } from "@arcgis/core/views/ui/types.js";
 import type { SlotGroupRefs } from "../../support/slots.js";
@@ -211,11 +211,34 @@ export abstract class ArcgisMap extends LitElement {
    * Specifies a basemap for the map. The basemap is a set of layers that give
    * geographic context to the view and the other operational layers
    * in the map.
-   * It can either be set using a basemap ID string ([see values](https://developers.arcgis.com/javascript/latest/references/core/Map/#basemap)),
-   * [Basemap](https://developers.arcgis.com/javascript/latest/references/core/Basemap/)
-   * or [BasemapStyle](https://developers.arcgis.com/javascript/latest/references/core/support/BasemapStyle/).
    *
-   * [Read more](https://developers.arcgis.com/javascript/latest/references/core/Map/#basemap)
+   * The basemap can be set from a basemap ID string from the [basemap styles service](https://developers.arcgis.com/javascript/latest/references/core/support/BasemapStyle/), such as `arcgis/navigation`, or from the [Basemap](https://developers.arcgis.com/javascript/latest/references/core/Basemap/) class.
+   *
+   * > [!NOTE]
+   * > Accessing the basemap styles service requires authentication, see [Authentication and access tokens](https://developers.arcgis.com/javascript/latest/authentication/access-tokens/) for more information.
+   *
+   * @example
+   * ```html
+   * <!-- Basemap set using a basemap ID string from the basemap styles service -->
+   * <arcgis-map basemap="arcgis/navigation" center="-98, 39" zoom="4"></arcgis-map>
+   * ```
+   * @example
+   * ```js
+   * // Basemap set using a Basemap instance
+   * const viewElement = document.querySelector("arcgis-map");
+   * viewElement.basemap = new Basemap({
+   *   title: "Terrain",
+   *   baseLayers: [
+   *     new VectorTileLayer({
+   *        url: "https://arcgis.com/sharing/rest/content/items/b5676525747f499687f12746441101ef/resources/styles/root.json",
+   *     })
+   *   ]
+   * });
+   * ```
+   * @see [Map.basemap](https://developers.arcgis.com/javascript/latest/references/core/Map/#basemap)
+   * @see [Basemap](https://developers.arcgis.com/javascript/latest/references/core/Basemap/)
+   * @see [BasemapStyle](https://developers.arcgis.com/javascript/latest/references/core/support/BasemapStyle/)
+   * @see [Authentication and access tokens](https://developers.arcgis.com/javascript/latest/authentication/access-tokens/)
    */
   accessor basemap: Basemap | string | undefined;
   /** Represents the view for a single basemap after it has been added to the map. */
@@ -883,6 +906,26 @@ export abstract class ArcgisMap extends LitElement {
    * Represents the current view as a Viewpoint or point of observation on the view.
    * Setting the viewpoint immediately changes the current view. For animating
    * the view, see this component's [goTo()](https://developers.arcgis.com/javascript/latest/references/map-components/components/arcgis-map/#goTo) method.
+   *
+   * @example
+   * ```js
+   * // Set the viewpoint to the Empire State Building in New York City
+   * const viewElement = document.querySelector("arcgis-map");
+   * viewElement.viewpoint = new Viewpoint({
+   *   targetGeometry: new Point({
+   *     longitude: -73.9857,
+   *     latitude: 40.7484
+   *   }),
+   *   scale: 5000
+   * });
+   * ```
+   * @example
+   * ```js
+   * // Get the initial viewpoint of the view once the view is ready
+   * const viewElement = document.querySelector("arcgis-map");
+   * await viewElement.viewOnReady();
+   * const initialViewpoint = viewElement.viewpoint.clone();
+   * ```
    */
   accessor viewpoint: Viewpoint;
   /**
@@ -911,7 +954,38 @@ export abstract class ArcgisMap extends LitElement {
   closePopup(): Promise<void>;
   /** Destroys the view, and any associated resources, including its map, popup, and UI elements. */
   destroy(): Promise<void>;
-  focusPopup(): Promise<void>;
+  /**
+   * Use this method to query for features at a given screen location. These features come from origins (layers and sublayers) configured with a [PopupTemplate](https://developers.arcgis.com/javascript/latest/references/core/PopupTemplate/) and have its [FeatureLayer.popupEnabled](https://developers.arcgis.com/javascript/latest/references/core/layers/FeatureLayer/#popupEnabled) set. One example could be a custom side panel that displays feature-specific information based on an end user's click location. This method allows a developer to control how the input location is handled, and then subsequently, what to do with the results.
+   *
+   * @param hitTarget
+   * @param options
+   * @since 5.1
+   * @example
+   * ```js
+   * const viewElement = document.querySelector("arcgis-map");
+   * // Get viewElement's click event
+   * viewElement.addEventListener("arcgisViewClick", async (event) => {
+   *   const generator = await viewElement.fetchPopupFeatures(event.detail.screenPoint, {
+   *     pointerType: event.detail.pointerType
+   *   });
+   *   // Access the features returned from the generator
+   *   for await (const feature of generator) {
+   *     console.log(feature);
+   *   }
+   * });
+   * ```
+   * @example
+   * ```js
+   * // Wait for all the features to be available
+   * view.on("click", async (event) => {
+   *   const generator = view.fetchPopupFeatures(event.screenPoint, {
+   *     pointerType: event.pointerType
+   *   });
+   *
+   *   const features = await Array.fromAsync(generator);
+   * });
+   */
+  fetchPopupFeatures(hitTarget: ScreenPoint | ScreenRect, options?: FetchPopupFeaturesOptions): Promise<AsyncGenerator<Graphic>>;
   /**
    * Sets the view to a given target.
    *
@@ -920,42 +994,28 @@ export abstract class ArcgisMap extends LitElement {
    */
   goTo(target: GoToTarget2D, options?: GoToOptions2D): Promise<unknown>;
   /**
-   * Returns [hit test results](https://developers.arcgis.com/javascript/latest/references/core/views/MapView/#HitTestResult)
-   * from each layer that intersects the specified screen coordinates. The results are
-   * organized as an array of objects containing different [result types](https://developers.arcgis.com/javascript/latest/references/core/views/MapView/#HitTestResult).
-   *
-   * The following layer types will return all [features](https://developers.arcgis.com/javascript/latest/references/core/views/MapView/#GraphicHit) if a hit is
-   * made on intersecting features: [FeatureLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/FeatureLayer/),
-   * [CatalogLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/CatalogLayer/),
-   * [CSVLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/CSVLayer/),
-   * [GeoJSONLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/GeoJSONLayer/),
-   * [GeoRSSLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/GeoRSSLayer/),
-   * [GraphicsLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/GraphicsLayer/),
-   * [KMLLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/KMLLayer/),
-   * [MapNotesLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/MapNotesLayer/),
-   * [OGCFeatureLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/OGCFeatureLayer/),
-   * [StreamLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/StreamLayer/),
-   * [SubtypeSublayer](https://developers.arcgis.com/javascript/latest/references/core/layers/support/SubtypeSublayer/),
-   * [VectorTileLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/VectorTileLayer/), and
-   * [WFSLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/WFSLayer/).
-   *
-   * The [ParquetLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/ParquetLayer/) hit result returns only the topmost feature
-   * when the hit occurs on overlapping features in a ParquetLayer.
-   *
-   * The [VectorTileLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/VectorTileLayer/) hit test result contains an array of objects containing
-   * a [graphic](https://developers.arcgis.com/javascript/latest/references/core/views/MapView/#GraphicHit).
-   * The graphic returns attributes of a style layer. In addition, the graphic's [origin](https://developers.arcgis.com/javascript/latest/references/core/Graphic/#origin)
-   * contains the style layer's [id](https://maplibre.org/maplibre-style-spec/layers/#id) and layer index within the [vector tile style](https://doc.arcgis.com/en/arcgis-online/reference/tile-layers.htm#ESRI_SECTION1_8F68399EB47B48FF9EF46719FCC96978).
-   * Spatial information about the actual feature represented in the style layer is returned only if the style layer is a [symbol layer](https://maplibre.org/maplibre-style-spec/layers/#symbol).
-   * Otherwise, the graphic's geometry is `null`.
-   *
-   * The [MediaLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/MediaLayer/) hit test result contains all media elements if the hit is made on intersecting elements.
-   * The [RouteLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/RouteLayer/) hit test result contains all route elements if the hit is made on intersecting elements.
-   *
-   * If the [polygon](https://developers.arcgis.com/javascript/latest/references/core/geometry/Polygon/) feature's symbol
-   * [style](https://developers.arcgis.com/javascript/latest/references/core/symbols/SimpleFillSymbol/#style) is set to `none`, the hitTest method will not
+   * Returns [hit test results](https://developers.arcgis.com/javascript/latest/references/core/views/types/#ViewHitTestResult) from each layer that intersects the specified screen point or screen rectangle.
+   * The results are organized as an array of objects containing different [ViewHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#ViewHit) result types such as  graphics, raster pixels, media elements, or routes.
+   *
+   * **2D hitTest() behavior by layer type**
+   * | Layer type | Hit test behavior |
+   * | :--- | :--- |
+   * | [FeatureLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/FeatureLayer), [CatalogFootprintLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/catalog/CatalogFootprintLayer), [CSVLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/CSVLayer), [GeoJSONLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/GeoJSONLayer), [OGCFeatureLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/OGCFeatureLayer), [OrientedImageryLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/OrientedImageryLayer), [StreamLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/StreamLayer), [SubtypeGroupLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/SubtypeGroupLayer), [WFSLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/WFSLayer) | Returns all intersecting [GraphicHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#GraphicHit) features at the hit location. |
+   * | [ParquetLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/ParquetLayer) | Returns only the topmost [GraphicHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#GraphicHit) feature when the hit occurs on overlapping features. (as of version 4.34). |
+   * | [GeoRSSLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/GeoRSSLayer), [GraphicsLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/GraphicsLayer), [KMLLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/KMLLayer), [MapNotesLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/MapNotesLayer) | Returns all intersecting [GraphicHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#GraphicHit) features at the hit location. |
+   * | [ImageryLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/ImageryLayer),  [ImageryTileLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/ImageryTileLayer)| Returns [RasterHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#RasterHit) result containing raster pixel value used in rendering and bandId info on intersecting pixels. The `screenRect` hitTarget is not supported for these layers. |
+   * | [VectorTileLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/VectorTileLayer) | Returns a result for all intersecting [GraphicHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#GraphicHit) features containing attributes of style layers (as of version 4.29; in prior releases, only the topmost style layer result was returned). In addition, the graphic's [origin](https://developers.arcgis.com/javascript/latest/references/core/Graphic#origin) contains the style layer's [id](https://maplibre.org/maplibre-style-spec/layers/#id) and layer index within the [vector tile style](https://doc.arcgis.com/en/arcgis-online/reference/tile-layers.htm#ESRI_SECTION1_8F68399EB47B48FF9EF46719FCC96978). Spatial information about the actual feature represented in the style layer is returned only if the style layer is a [symbol layer](https://maplibre.org/maplibre-style-spec/layers/#symbol). Otherwise, the graphic's geometry is `null`. |
+   * | [MediaLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/MediaLayer) | Returns [MediaHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#MediaHit) result containing all media elements if the hit is made on intersecting elements. |
+   * | [RouteLayer](https://developers.arcgis.com/javascript/latest/references/core/layers/RouteLayer) | Returns [RouteHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#RouteHit) result containing all intersecting route elements if the hit is made on intersecting elements. |
+   *
+   * **Note:** If the [Polygon](https://developers.arcgis.com/javascript/latest/references/core/geometry/Polygon) feature's symbol [SimpleFillSymbol.style](https://developers.arcgis.com/javascript/latest/references/core/symbols/SimpleFillSymbol#style) is set to "none", the hitTest method will not
    * return results when the fill is clicked. However, it will return results when the outline is clicked. To get results when clicking the fill, set the
-   * [color](https://developers.arcgis.com/javascript/latest/references/core/symbols/SimpleFillSymbol/#color) to a transparent color instead.
+   * [SimpleFillSymbol.color](https://developers.arcgis.com/javascript/latest/references/core/symbols/SimpleFillSymbol#color) to a transparent color instead.
+   *
+   * Release-specific changes:
+   * * At version 5.1, the [ScreenRect](https://developers.arcgis.com/javascript/latest/references/core/core/types/#ScreenRect) option was added to perform hit tests on rectangular areas.
+   * * At version 4.24, [ViewHitTestResult](https://developers.arcgis.com/javascript/latest/references/core/views/types/#ViewHitTestResult) returns an array of objects containing [GraphicHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#GraphicHit) graphic, [MediaHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#MediaHit) media element, and [RouteHit](https://developers.arcgis.com/javascript/latest/references/core/views/types/#RouteHit) route.
+   * * At version 4.23, all hit test features from feature layers are returned in the result. In prior releases, only the top most feature was returned.
    *
    * @param hitTarget
    * @param options

package/dist/components/arcgis-map/customElement.js

@@ -11,9 +11,9 @@ import { s as g } from "../../chunks/esri-main.js";
 import { s as d } from "../../chunks/slots.js";
 import { C as w } from "../../chunks/resources.js";
 import { p as y, i as f } from "../../chunks/component-utils.js";
-import { U as b, P as V, u as C, a as E } from "../../chunks/useArcgisViewReadyError.js";
-import A from "@arcgis/core/core/Collection.js";
-const _ = p(
+import { U as b, u as V, a as C } from "../../chunks/useArcgisViewReadyError.js";
+import E from "@arcgis/core/core/Collection.js";
+const A = p(
   v,
   /**
    * Since omitProps is only needed for typing, not runtime, `{} as { ... }` is
@@ -25,9 +25,9 @@ const _ = p(
    */
   {}
 ), R = p(c, {});
-class D extends m {
+class _ extends m {
   constructor() {
-    super(), this._containerRef = n(), this._mapRef = n(), this._uiController = new b(this), this._popupFocusController = new V(this), this.extraContent = new A(), this.arcgisLoadError = C(this), this.arcgisViewReadyError = E(this), this._map = _(this), this.view = R(this), this.animationsDisabled = this.view.animationsEnabled, this.allLayerViews = this.view.allLayerViews, this.analyses = this.view.analyses, this.attributionMode = this.view.attributionMode, this.autoDestroyDisabled = !1, this.background = this.view.background, this.basemap = this._map.basemap, this.basemapView = this.view.basemapView, this.canZoomIn = this.view.canZoomIn, this.canZoomOut = this.view.canZoomOut, this.constraints = this.view.constraints, this.displayFilterDisabled = this.view.displayFilterEnabled, this.fatalError = this.view.fatalError, this.floors = this.view.floors, this.graphics = this.view.graphics, this.ground = this._map.ground, this.highlights = this.view.highlights, this.ipsInfo = this._map.ipsInfo, this.layerViews = this.view.layerViews, this.magnifier = this.view.magnifier, this.map = this.view.map, this.navigation = this.view.navigation, this.padding = this.view.padding, this.popup = this.view.popup, this.popupDisabled = this.view.popupEnabled, this.popupComponentEnabled = !1, this.ready = this.view.ready, this.resizeAlign = this.view.resizeAlign, this.resolution = this.view.resolution, this.rotation = this.view.rotation, this.selectionManager = this.view.selectionManager, this.slotGroupRefs = this._uiController.slotGroupRefs, this.spatialReference = this.view.spatialReference, this.spatialReferenceLocked = this.view.spatialReferenceLocked, this.suspended = this.view.suspended, this.theme = this.view.theme, this.timeExtent = this.view.timeExtent, this.timeZone = this.view.timeZone, this.updating = this.view.updating, this.visibleArea = this.view.visibleArea, this.arcgisViewAnalysisViewCreate = e(() => this.view, "analysis-view-create"), this.arcgisViewAnalysisViewCreateError = e(() => this.view, "analysis-view-create-error"), this.arcgisViewAnalysisViewDestroy = e(() => this.view, "analysis-view-destroy"), this.arcgisViewChange = r(), this.arcgisViewClick = e(() => this.view, "click"), this.arcgisViewDoubleClick = e(() => this.view, "double-click"), this.arcgisViewDoubleTapDrag = e(() => this.view, "double-tap-drag"), this.arcgisViewDrag = e(() => this.view, "drag"), this.arcgisViewHold = e(() => this.view, "hold"), this.arcgisViewImmediateClick = e(() => this.view, "immediate-click"), this.arcgisViewImmediateDoubleClick = e(() => this.view, "immediate-double-click"), this.arcgisViewKeyDown = e(() => this.view, "key-down"), this.arcgisViewKeyUp = e(() => this.view, "key-up"), this.arcgisViewLayerviewCreate = e(() => this.view, "layerview-create"), this.arcgisViewLayerviewCreateError = e(() => this.view, "layerview-create-error"), this.arcgisViewLayerviewDestroy = e(() => this.view, "layerview-destroy"), this.arcgisViewMouseWheel = e(() => this.view, "mouse-wheel"), this.arcgisViewPointerDown = e(() => this.view, "pointer-down"), this.arcgisViewPointerEnter = e(() => this.view, "pointer-enter"), this.arcgisViewPointerLeave = e(() => this.view, "pointer-leave"), this.arcgisViewPointerMove = e(() => this.view, "pointer-move"), this.arcgisViewPointerUp = e(() => this.view, "pointer-up"), this.arcgisViewReadyChange = r(), this.arcgisViewVerticalTwoFingerDrag = e(() => this.view, "vertical-two-finger-drag"), this.view.ui = {
+    super(), this._containerRef = n(), this._mapRef = n(), this._uiController = new b(this), this.extraContent = new E(), this.arcgisLoadError = V(this), this.arcgisViewReadyError = C(this), this._map = A(this), this.view = R(this), this.animationsDisabled = this.view.animationsEnabled, this.allLayerViews = this.view.allLayerViews, this.analyses = this.view.analyses, this.attributionMode = this.view.attributionMode, this.autoDestroyDisabled = !1, this.background = this.view.background, this.basemap = this._map.basemap, this.basemapView = this.view.basemapView, this.canZoomIn = this.view.canZoomIn, this.canZoomOut = this.view.canZoomOut, this.constraints = this.view.constraints, this.displayFilterDisabled = this.view.displayFilterEnabled, this.fatalError = this.view.fatalError, this.floors = this.view.floors, this.graphics = this.view.graphics, this.ground = this._map.ground, this.highlights = this.view.highlights, this.ipsInfo = this._map.ipsInfo, this.layerViews = this.view.layerViews, this.magnifier = this.view.magnifier, this.map = this.view.map, this.navigation = this.view.navigation, this.padding = this.view.padding, this.popup = this.view.popup, this.popupDisabled = this.view.popupEnabled, this.popupComponentEnabled = !1, this.ready = this.view.ready, this.resizeAlign = this.view.resizeAlign, this.resolution = this.view.resolution, this.rotation = this.view.rotation, this.selectionManager = this.view.selectionManager, this.slotGroupRefs = this._uiController.slotGroupRefs, this.spatialReference = this.view.spatialReference, this.spatialReferenceLocked = this.view.spatialReferenceLocked, this.suspended = this.view.suspended, this.theme = this.view.theme, this.timeExtent = this.view.timeExtent, this.timeZone = this.view.timeZone, this.updating = this.view.updating, this.visibleArea = this.view.visibleArea, this.arcgisViewAnalysisViewCreate = e(() => this.view, "analysis-view-create"), this.arcgisViewAnalysisViewCreateError = e(() => this.view, "analysis-view-create-error"), this.arcgisViewAnalysisViewDestroy = e(() => this.view, "analysis-view-destroy"), this.arcgisViewChange = r(), this.arcgisViewClick = e(() => this.view, "click"), this.arcgisViewDoubleClick = e(() => this.view, "double-click"), this.arcgisViewDoubleTapDrag = e(() => this.view, "double-tap-drag"), this.arcgisViewDrag = e(() => this.view, "drag"), this.arcgisViewHold = e(() => this.view, "hold"), this.arcgisViewImmediateClick = e(() => this.view, "immediate-click"), this.arcgisViewImmediateDoubleClick = e(() => this.view, "immediate-double-click"), this.arcgisViewKeyDown = e(() => this.view, "key-down"), this.arcgisViewKeyUp = e(() => this.view, "key-up"), this.arcgisViewLayerviewCreate = e(() => this.view, "layerview-create"), this.arcgisViewLayerviewCreateError = e(() => this.view, "layerview-create-error"), this.arcgisViewLayerviewDestroy = e(() => this.view, "layerview-destroy"), this.arcgisViewMouseWheel = e(() => this.view, "mouse-wheel"), this.arcgisViewPointerDown = e(() => this.view, "pointer-down"), this.arcgisViewPointerEnter = e(() => this.view, "pointer-enter"), this.arcgisViewPointerLeave = e(() => this.view, "pointer-leave"), this.arcgisViewPointerMove = e(() => this.view, "pointer-move"), this.arcgisViewPointerUp = e(() => this.view, "pointer-up"), this.arcgisViewReadyChange = r(), this.arcgisViewVerticalTwoFingerDrag = e(() => this.view, "vertical-two-finger-drag"), this.view.ui = {
       components: []
     };
   }
@@ -116,8 +116,8 @@ class D extends m {
   async closePopup() {
     this._uiController.closePopup();
   }
-  async focusPopup() {
-    this._popupFocusController.focusPopup();
+  async fetchPopupFeatures(i, t) {
+    return this.view.fetchPopupFeatures(i, t);
   }
   async destroy() {
     await this.manager.destroy();
@@ -178,7 +178,7 @@ class D extends m {
     return a`${this.renderMain()}<section class=${o(w.containerUI)} ${h(this._containerRef)}>${this._uiController.render()}${this.extraContent}</section>`;
   }
 }
-l("arcgis-map", D);
+l("arcgis-map", _);
 export {
-  D as ArcgisMap
+  _ as ArcgisMap
 };