@arcgis/map-components 4.32.0-next.117 → 4.32.0-next.118

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

@@ -5,7 +5,7 @@ import { m as a } from "../../chunks/useWidget.js";
 import { css as n } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const c = n`arcgis-expand{display:flex;pointer-events:auto}arcgis-expand>.esri-expand__content--expanded{background-color:var(--calcite-color-background)}`, d = a(e);
 class l extends i {
   // #endregion

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

@@ -6,7 +6,7 @@ import { m as d } from "../../chunks/useWidget.js";
 import { css as l } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const r = l`arcgis-feature{display:block}`, c = d(a);
 class p extends n {
   constructor() {

package/dist/components/arcgis-feature-form/customElement.js

@@ -7,7 +7,7 @@ import { m as h } from "../../chunks/useWidget.js";
 import { css as m } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const l = m`arcgis-feature-form{display:block}`, g = h(s);
 class n extends r {
   constructor() {

package/dist/components/arcgis-feature-table/customElement.js

@@ -9,7 +9,7 @@ import { f as m } from "../../chunks/component-utils.js";
 import { css as c } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const u = c`arcgis-feature-table{display:block}.arcgis-feature-table{width:100%;height:100%}`, w = g(d);
 class b extends a {
   constructor() {

package/dist/components/arcgis-feature-templates/customElement.js

@@ -7,7 +7,7 @@ import { m as a } from "../../chunks/useWidget.js";
 import { css as h } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const n = h`arcgis-feature-templates{display:block}`, c = a(s);
 class d extends o {
   constructor() {

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

@@ -7,7 +7,7 @@ import { m as d } from "../../chunks/useWidget.js";
 import { css as l } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const c = l`arcgis-features{display:block}`, g = d(o);
 class u extends r {
   constructor() {

package/dist/components/arcgis-floor-filter/customElement.js

@@ -5,7 +5,7 @@ import { m as a } from "../../chunks/useWidget.js";
 import { css as r } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const h = r`arcgis-floor-filter{display:block}`, n = a(i);
 class c extends s {
   constructor() {

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

@@ -3,25 +3,26 @@ import { html as s } from "lit-html";
 import { usePropertyChange as c } from "@arcgis/components-controllers";
 import { classes as d } from "@arcgis/components-utils";
 import m from "@arcgis/core/widgets/Fullscreen/FullscreenViewModel.js";
-import { LitElement as u, createEvent as h, noShadowRoot as g, safeClassMap as i, nothing as p } from "@arcgis/lumina";
-import { u as f, m as w } from "../../chunks/useViewModel.js";
+import { LitElement as u, createEvent as h, noShadowRoot as p, safeClassMap as i, nothing as f } from "@arcgis/lumina";
+import { u as g } from "../../chunks/useView.js";
+import { m as w } from "../../chunks/useViewModel.js";
 import { g as o } from "../../chunks/globalCss.js";
 import { css as b } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const y = b`arcgis-fullscreen{display:block}`, v = {
   base: "esri-fullscreen"
 }, M = w(m);
 class $ extends u {
   constructor() {
-    super(...arguments), this.messages = f(), this.viewModel = M(this), this.autoDestroyDisabled = !1, this.element = this.viewModel.element, this.icon = "zoom-out-fixed", this.position = "top-left", this.state = this.viewModel.state, this.arcgisPropertyChange = c()("state"), this.arcgisReady = h();
+    super(...arguments), this.messages = g(), this.viewModel = M(this), this.autoDestroyDisabled = !1, this.element = this.viewModel.element, this.icon = "zoom-out-fixed", this.position = "top-left", this.state = this.viewModel.state, this.arcgisPropertyChange = c()("state"), this.arcgisReady = h();
   }
   static {
     this.properties = { autoDestroyDisabled: 5, element: 0, icon: 3, label: 1, messageOverrides: 0, position: 3, referenceElement: 1, state: 3 };
   }
   static {
-    this.shadowRootOptions = g;
+    this.shadowRootOptions = p;
   }
   static {
     this.styles = y;
@@ -46,7 +47,7 @@ class $ extends u {
   // #region Rendering
   render() {
     const { fullscreenTitle: e, icon: r } = this, t = this.viewModel?.state, a = t === "feature-unsupported", l = t === "ready" || t === "disabled" || t === "feature-unsupported" ? "zoom-out-fixed" : "zoom-in-fixed";
-    return s`<div class=${i(d(v.base, o.widget))}>${!a && s`<calcite-button class=${i(o.widgetButton)} .disabled=${t === "disabled"} .iconStart=${r ?? l} kind=neutral .label=${e} @click=${this._toggle} title=${e ?? p}></calcite-button>` || ""}</div>`;
+    return s`<div class=${i(d(v.base, o.widget))}>${!a && s`<calcite-button class=${i(o.widgetButton)} .disabled=${t === "disabled"} .iconStart=${r ?? l} kind=neutral .label=${e} @click=${this._toggle} title=${e ?? f}></calcite-button>` || ""}</div>`;
   }
 }
 n("arcgis-fullscreen", $);

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

@@ -6,7 +6,7 @@ import { m as r } from "../../chunks/useWidget.js";
 import { css as n } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const h = n`arcgis-histogram{display:block}`, d = r(e);
 class m extends s {
   constructor() {

package/dist/components/arcgis-histogram-range-slider/customElement.js

@@ -6,7 +6,7 @@ import { m as n } from "../../chunks/useWidget.js";
 import { css as d } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const h = d`arcgis-histogram-range-slider{display:block}`, l = n(s);
 class g extends a {
   constructor() {

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

@@ -5,15 +5,16 @@ import { reEmitEvent as n } from "@arcgis/components-controllers/accessor";
 import { classes as m } from "@arcgis/components-utils";
 import d from "@arcgis/core/widgets/Home/HomeViewModel.js";
 import { LitElement as h, createEvent as g, noShadowRoot as p, safeClassMap as i, nothing as v } from "@arcgis/lumina";
-import { u as w, m as u } from "../../chunks/useViewModel.js";
+import { u as w } from "../../chunks/useView.js";
+import { m as f } from "../../chunks/useViewModel.js";
 import { g as a } from "../../chunks/globalCss.js";
-import { css as f } from "@lit/reactive-element/css-tag.js";
+import { css as u } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
-const b = f`arcgis-home{display:block}`, y = {
+v4.32.0-next.118 */
+const b = u`arcgis-home{display:block}`, y = {
   base: "esri-home"
-}, M = u(d);
+}, M = f(d);
 class $ extends h {
   constructor() {
     super(...arguments), this.messages = w(), this.viewModel = M(this), this.autoDestroyDisabled = !1, this.goToOverride = this.viewModel.goToOverride, this.icon = "home", this.position = "top-left", this.state = this.viewModel.state, this.viewpoint = this.viewModel.viewpoint, this.arcgisGo = n(() => this.viewModel, "go"), this.arcgisPropertyChange = c()("state"), this.arcgisReady = g();

package/dist/components/arcgis-layer-list/customElement.js

@@ -7,7 +7,7 @@ import { m as d } from "../../chunks/useWidget.js";
 import { css as n } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const g = n`arcgis-layer-list{display:block}`, c = d(o);
 class m extends r {
   constructor() {

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

@@ -6,7 +6,7 @@ import { m as o } from "../../chunks/useWidget.js";
 import { css as n } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const d = n`arcgis-legend{display:block}`, h = o(i);
 class l extends s {
   constructor() {

package/dist/components/arcgis-line-of-sight/customElement.js

@@ -6,7 +6,7 @@ import { m as r } from "../../chunks/useWidget.js";
 import { css as n } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const l = n`arcgis-line-of-sight{display:block}`, h = r(i);
 class c extends e {
   constructor() {

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

@@ -8,7 +8,7 @@ import { e as h, i as g } from "../../chunks/component-utils.js";
 import { css as y } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const u = y`.arcgis-link-chart{padding:0;margin:0;height:100%;width:100%}`, f = r(
   l,
   /**

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

@@ -1,23 +1,24 @@
 import { c as m } from "../../chunks/runtime.js";
 import { html as t } from "lit-html";
 import { usePropertyChange as g } from "@arcgis/components-controllers";
-import { reEmitEvent as c } from "@arcgis/components-controllers/accessor";
+import { reEmitEvent as r } from "@arcgis/components-controllers/accessor";
 import { classes as u } from "@arcgis/components-utils";
-import v from "@arcgis/core/widgets/Locate/LocateViewModel.js";
-import { LitElement as f, createEvent as w, noShadowRoot as E, safeClassMap as l, nothing as b } from "@arcgis/lumina";
-import { u as M, m as y } from "../../chunks/useViewModel.js";
-import { g as r } from "../../chunks/globalCss.js";
+import f from "@arcgis/core/widgets/Locate/LocateViewModel.js";
+import { LitElement as v, createEvent as w, noShadowRoot as E, safeClassMap as c, nothing as b } from "@arcgis/lumina";
+import { u as M } from "../../chunks/useView.js";
+import { m as y } from "../../chunks/useViewModel.js";
+import { g as l } from "../../chunks/globalCss.js";
 import { l as $ } from "../../chunks/legacyIcon.js";
 import { css as L } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const D = L`arcgis-locate{display:block}`, O = {
   base: "esri-locate"
-}, n = "gps-off", T = y(v);
-class I extends f {
+}, n = "gps-off", T = y(f);
+class I extends v {
   constructor() {
-    super(...arguments), this.messages = M(), this.viewModel = T(this), this.autoDestroyDisabled = !1, this.geolocationOptions = this.viewModel.geolocationOptions, this.goToLocationDisabled = this.viewModel.goToLocationEnabled, this.goToOverride = this.viewModel.goToOverride, this.graphic = this.viewModel.graphic, this.icon = n, this.popupDisabled = this.viewModel.popupEnabled, this.position = "top-left", this.scale = this.viewModel.scale, this.state = this.viewModel.state, this.arcgisError = c(() => this.viewModel, "locate-error"), this.arcgisPropertyChange = g()("state"), this.arcgisReady = w(), this.arcgisSuccess = c(() => this.viewModel, "locate");
+    super(...arguments), this.messages = M(), this.viewModel = T(this), this.autoDestroyDisabled = !1, this.geolocationOptions = this.viewModel.geolocationOptions, this.goToLocationDisabled = this.viewModel.goToLocationEnabled, this.goToOverride = this.viewModel.goToOverride, this.graphic = this.viewModel.graphic, this.icon = n, this.popupDisabled = this.viewModel.popupEnabled, this.position = "top-left", this.scale = this.viewModel.scale, this.state = this.viewModel.state, this.arcgisError = r(() => this.viewModel, "locate-error"), this.arcgisPropertyChange = g()("state"), this.arcgisReady = w(), this.arcgisSuccess = r(() => this.viewModel, "locate");
   }
   static {
     this.properties = { autoDestroyDisabled: 5, geolocationOptions: 1, goToLocationDisabled: 7, goToOverride: 0, graphic: 0, icon: 3, label: 1, messageOverrides: 0, popupDisabled: 5, position: 3, referenceElement: 1, scale: 9, state: 3 };
@@ -61,7 +62,7 @@ class I extends f {
   // #region Rendering
   render() {
     const { viewModel: e, icon: d } = this, { state: o } = e, i = o === "locating", s = i ? this.messages.cancel : this.messages.title, h = o === "feature-unsupported", p = $ === void 0 ? n : void 0, a = this._localizeError(this.viewModel?.error);
-    return t`<div class=${l(u(O.base, r.widget))}>${!h && t`<calcite-button class=${l(r.widgetButton)} .disabled=${o === "disabled"} .iconStart=${i ? void 0 : d ?? p} kind=neutral .label=${s} @click=${this._locate} title=${s ?? b}>${i ? t`<calcite-loader inline label></calcite-loader>` : null}</calcite-button>` || ""}${a ? t`<calcite-tooltip open overlay-positioning=fixed .referenceElement=${this.el}>${a}</calcite-tooltip>` : null}</div>`;
+    return t`<div class=${c(u(O.base, l.widget))}>${!h && t`<calcite-button class=${c(l.widgetButton)} .disabled=${o === "disabled"} .iconStart=${i ? void 0 : d ?? p} kind=neutral .label=${s} @click=${this._locate} title=${s ?? b}>${i ? t`<calcite-loader inline label></calcite-loader>` : null}</calcite-button>` || ""}${a ? t`<calcite-tooltip open overlay-positioning=fixed .referenceElement=${this.el}>${a}</calcite-tooltip>` : null}</div>`;
   }
 }
 m("arcgis-locate", I);

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

@@ -8,7 +8,7 @@ import { e as h, i as g } from "../../chunks/component-utils.js";
 import { css as y } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const u = y`.arcgis-map{padding:0;margin:0;height:100%;width:100%}`, f = r(
   v,
   /**

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

@@ -6,7 +6,7 @@ import { m as r } from "../../chunks/useWidget.js";
 import { css as n } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const c = n`arcgis-measurement{display:block}`, h = r(i);
 class l extends s {
   constructor() {

package/dist/components/arcgis-navigation-toggle/customElement.d.ts

@@ -3,21 +3,21 @@
 import { Use } from '@arcgis/components-controllers';
 import { Nil } from '@arcgis/components-utils';
 import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { PropertyValues } from 'lit';
+import { useView } from '../../controllers/useView';
 import { ArcgisReferenceElement } from '../../utils/component-utils';
-import { NavigationToggleViewModel } from './NavigationToggleViewModel';
 
+type State = "disabled" | "ready";
+type NavigationMode = "pan" | "rotate";
 type LayoutMode = "horizontal" | "vertical";
-declare const useViewModel: (component: import('@arcgis/components-controllers').StencilLifecycles & {
-    manager: import('@arcgis/components-controllers').ControllerManager;
-    el: HTMLElement;
-    autoDestroyDisabled?: boolean;
-    destroy?: () => Promise<void>;
-} & Pick<NavigationToggleViewModel, never> & import('../../controllers/useViewModel').ViewModelControllerUses<NavigationToggleViewModel>, options?: {
-    editConstructorProperties(props: unknown): unknown;
-} | undefined) => NavigationToggleViewModel;
 /**
- * The NavigationToggle component has two simple buttons for toggling the [navigation mode](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-NavigationToggle-NavigationToggleViewModel.html#navigationMode)
- * of a [SceneView](https://developers.arcgis.com/javascript/latest/api-reference/esri-views-SceneView.html).
+ * A navigation toggle component can be used to control the navigation mode of an arcgis-scene component.
+ *
+ * When the navigation mode is set to "pan", the mouse drag gesture pans the view and right-click + drag allows the user
+ * to rotate the view. When the navigation mode is set to "rotate", the mouse drag gesture rotates the view and
+ * right-click + drag pans the view.
+ *
+ * The navitation toggle component is not supported in 2d.
  */
 export declare class ArcgisNavigationToggle extends LitElement {
     /**
@@ -29,29 +29,16 @@ export declare class ArcgisNavigationToggle extends LitElement {
      */
     autoDestroyDisabled: boolean;
     /**
-     * Icon which represents the component.
-     * Typically used when the component is controlled by another component (e.g. by the Expand component).
-     * Search [Calcite Icons](https://developers.arcgis.com/calcite-design-system/icons/) for possible values.
+     * Icon which represents the component. It is typically used when the
+     * component is controlled by another one (e.g. in the arcgis-expand
+     * component).
+     *
+     * @see [Calcite Icon Search](https://developers.arcgis.com/calcite-design-system/icons/)
      */
     icon: HTMLCalciteIconElement["icon"] | Nil;
-    /** The widget's default label. */
+    /** The component's default label. */
     label: string | undefined;
-    /**
-     * Sets the layout of the widget to either `horizontal` or `vertical`. See the
-     * table below for a list of possible values.
-     *
-     * Possible Value | Example
-     * ---------------|--------
-     * vertical | ![navigation-toggle](../assets/img/apiref/widgets/navigation-toggle.png)
-     * horizontal | ![navigation-toggle-horizontal](../assets/img/apiref/widgets/navigation-toggle-horizontal.png)
-     *
-     * @example
-     * // creates a new instance of the NavigationToggle widget
-     * let navigationToggle = new NavigationToggle({
-     *   view: view,
-     *   layout: "horizontal"  // makes the layout horizontal
-     * });
-     */
+    /** The layout of the component. */
     layout: LayoutMode;
     /**
      * The navigation mode of the [view](#view). See the table below for a list of
@@ -62,10 +49,10 @@ export declare class ArcgisNavigationToggle extends LitElement {
      * pan | The mouse drag gesture pans the view. Right-click + drag allows the user to perform a 3D rotate around the center of the view.
      * rotate | The mouse drag gesture performs a 3D rotate around the center of the view and the right-click + drag gesture pans the view.
      */
-    navigationMode: import('./NavigationToggleViewModel').NavigationMode;
+    navigationMode: NavigationMode;
     position: __esri.UIPosition;
     referenceElement: ArcgisReferenceElement | Nil | string;
-    state: import('./NavigationToggleViewModel').State;
+    state: State;
     /** Permanently destroy the component */
     destroy(): Promise<void>;
     toggle(): Promise<void>;

package/dist/components/arcgis-navigation-toggle/customElement.js

@@ -1,94 +1,29 @@
-import { c as v } from "../../chunks/runtime.js";
-import { html as p } from "lit-html";
-import { usePropertyChange as h } from "@arcgis/components-controllers";
-import { LitElement as M, createEvent as m, noShadowRoot as w, safeClassMap as y, nothing as g } from "@arcgis/lumina";
-import { u, m as b } from "../../chunks/useViewModel.js";
-import { g as f } from "../../chunks/globalCss.js";
-import { css as _ } from "@lit/reactive-element/css-tag.js";
-import $ from "@arcgis/core/core/Accessor.js";
-import { property as c, subclass as C } from "@arcgis/core/core/accessorSupport/decorators.js";
-import { when as P } from "@arcgis/core/core/reactiveUtils.js";
+import { c as l } from "../../chunks/runtime.js";
+import { usePropertyChange as d } from "@arcgis/components-controllers";
+import { when as n } from "@arcgis/core/core/reactiveUtils.js";
+import { LitElement as g, createEvent as p, noShadowRoot as h, safeClassMap as m, nothing as c } from "@arcgis/lumina";
+import { html as v } from "lit";
+import { a as u, u as y } from "../../chunks/useView.js";
+import { g as b } from "../../chunks/globalCss.js";
+import { css as M } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
-const x = "arcgis-navigation-toggle", N = {
-  base: x
-}, D = _`.arcgis-navigation-toggle{display:flex}`;
-var O = Object.defineProperty, E = Object.getOwnPropertyDescriptor, l = (t, e, r, o) => {
-  for (var i = o > 1 ? void 0 : o ? E(e, r) : e, s = t.length - 1, a; s >= 0; s--)
-    (a = t[s]) && (i = (o ? a(e, r, i) : a(i)) || i);
-  return o && i && O(e, r, i), i;
-};
-let n = class extends $ {
-  //#region Lifecyle
-  constructor(t) {
-    super(t), this._navigationMode = "pan", this.view = void 0;
-  }
-  initialize() {
-    this.addHandles([
-      P(
-        () => this.view?.navigation.actionMap,
-        () => this._setNavigationMode()
-      )
-    ]);
-  }
-  destroy() {
-    this.view = void 0;
-  }
-  get state() {
-    return this.view?.ready && this.view?.type === "3d" ? "ready" : "disabled";
-  }
-  get navigationMode() {
-    return this._navigationMode;
-  }
-  set navigationMode(t) {
-    this._navigationMode = t, this._setNavigationMode();
-  }
-  //#endregion
-  //#region Public Methods
-  toggle() {
-    this.state !== "disabled" && (this.navigationMode = this.navigationMode !== "pan" ? "pan" : "rotate");
-  }
-  //#endregion
-  //#region Private Methods
-  _setNavigationMode() {
-    const t = this.view?.navigation.actionMap;
-    if (!t)
-      return;
-    const e = this._navigationMode === "pan";
-    t.dragPrimary = e ? "pan" : "rotate", t.dragSecondary = e ? "rotate" : "pan";
-  }
-  //#endregion
-};
-l([
-  c({ readOnly: !0 })
-], n.prototype, "state", 1);
-l([
-  c()
-], n.prototype, "_navigationMode", 2);
-l([
-  c()
-], n.prototype, "view", 2);
-n = l([
-  C("esri.widgets.NavigationToggle.NavigationToggleViewModel")
-], n);
-const R = b(n);
-class T extends M {
+v4.32.0-next.118 */
+const f = "arcgis-navigation-toggle", $ = {
+  base: f
+}, w = M`.arcgis-navigation-toggle{display:flex}`;
+class _ extends g {
   constructor() {
-    super(...arguments), this.viewModel = R(this), this._messages = u(), this._onPanClick = () => {
-      this.viewModel.navigationMode = "pan";
-    }, this._onRotateClick = () => {
-      this.viewModel.navigationMode = "rotate";
-    }, this.view = this.viewModel.view, this.autoDestroyDisabled = !1, this.icon = "pan", this.layout = "vertical", this.navigationMode = this.viewModel.navigationMode, this.position = "bottom-left", this.state = this.viewModel.state, this.arcgisPropertyChange = h()("layout", "state"), this.arcgisReady = m();
+    super(...arguments), this.view = u(this), this._messages = y(), this.autoDestroyDisabled = !1, this.icon = "pan", this.layout = "vertical", this.navigationMode = "pan", this.position = "bottom-left", this.state = "disabled", this.arcgisPropertyChange = d()("layout", "state"), this.arcgisReady = p();
   }
   static {
-    this.properties = { view: 16, autoDestroyDisabled: 5, icon: 3, label: 1, layout: 3, navigationMode: 3, position: 1, referenceElement: 1, state: 3 };
+    this.properties = { autoDestroyDisabled: 5, icon: 3, label: 1, layout: 3, navigationMode: 3, position: 1, referenceElement: 1, state: 3 };
   }
   static {
-    this.shadowRootOptions = w;
+    this.shadowRootOptions = h;
   }
   static {
-    this.styles = D;
+    this.styles = w;
   }
   //#endregion
   //#region Public Methods
@@ -97,16 +32,47 @@ class T extends M {
     await this.manager.destroy();
   }
   async toggle() {
-    this.viewModel.toggle();
+    this.state !== "disabled" && (this.navigationMode = this.navigationMode !== "pan" ? "pan" : "rotate");
+  }
+  //#endregion
+  //#region Lifecycle
+  load() {
+    this.manager.onLifecycle(() => [
+      n(() => this.view?.navigation.actionMap, () => this._updateNavigationActionMap()),
+      n(() => {
+        const { view: t } = this;
+        return t?.ready && t?.type === "3d" ? "ready" : "disabled";
+      }, (t) => {
+        this.state = t;
+      }, { sync: !0, initial: !0 })
+    ]);
+  }
+  willUpdate(t) {
+    t.has("navigationMode") && this._updateNavigationActionMap();
+  }
+  //#endregion
+  //#region Private Methods
+  _onPanClick() {
+    this.navigationMode = "pan";
+  }
+  _onRotateClick() {
+    this.navigationMode = "rotate";
+  }
+  _updateNavigationActionMap() {
+    const t = this.view?.navigation.actionMap;
+    if (!t)
+      return;
+    const a = this.navigationMode === "pan";
+    t.dragPrimary = a ? "pan" : "rotate", t.dragSecondary = a ? "rotate" : "pan";
   }
   //#endregion
   //#region Rendering
   render() {
-    const { _messages: e, navigationMode: r, state: o } = this, i = e.pan ?? "", s = e.rotate ?? "", a = o === "disabled", d = r === "pan";
-    return p`<calcite-action-bar .ariaLabel=${this.label} class=${y({ [N.base]: !0, [f.disabled]: a })} expand-disabled .layout=${this.layout} scale=s><calcite-action .active=${d} appearance=solid data-testid=navigation-toggle-pan .disabled=${a} icon=move @click=${this._onPanClick} scale=s .text=${i} title=${i ?? g}></calcite-action><calcite-action .active=${!d} appearance=solid data-testid=navigation-toggle-rotate .disabled=${a} icon=rotate @click=${this._onRotateClick} scale=s .text=${s} title=${s ?? g}></calcite-action></calcite-action-bar>`;
+    const { _messages: t, navigationMode: a, state: r } = this, e = t.pan ?? "", s = t.rotate ?? "", i = r === "disabled", o = a === "pan";
+    return v`<calcite-action-bar .ariaLabel=${this.label} class=${m({ [$.base]: !0, [b.disabled]: i })} expand-disabled .layout=${this.layout} scale=s><calcite-action .active=${o} appearance=solid data-testid=navigation-toggle-pan .disabled=${i} icon=move @click=${this._onPanClick} scale=s .text=${e} title=${e ?? c}></calcite-action><calcite-action .active=${!o} appearance=solid data-testid=navigation-toggle-rotate .disabled=${i} icon=rotate @click=${this._onRotateClick} scale=s .text=${s} title=${s ?? c}></calcite-action></calcite-action-bar>`;
   }
 }
-v("arcgis-navigation-toggle", T);
+l("arcgis-navigation-toggle", _);
 export {
-  T as ArcgisNavigationToggle
+  _ as ArcgisNavigationToggle
 };

package/dist/components/arcgis-oriented-imagery-viewer/customElement.js

@@ -7,7 +7,7 @@ import { m as l } from "../../chunks/useWidget.js";
 import { css as g } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const h = g`arcgis-oriented-imagery-viewer{display:block}`, m = l(r);
 class y extends o {
   constructor() {

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

@@ -4,7 +4,7 @@ import { LitElement as r, createEvent as o, noShadowRoot as n } from "@arcgis/lu
 import { css as c } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const h = c`arcgis-placement{display:flex;pointer-events:auto;box-shadow:none}.arcgis-placement__container{display:block}`;
 class a extends r {
   //#endregion

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

@@ -7,7 +7,7 @@ import { m as n } from "../../chunks/useWidget.js";
 import { css as h } from "@lit/reactive-element/css-tag.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
+v4.32.0-next.118 */
 const d = h`arcgis-print{display:block}`, m = n(r);
 class p extends o {
   constructor() {

package/dist/components/arcgis-scale-bar/customElement.js

@@ -6,14 +6,15 @@ import { getDefaultUnitForView as w } from "@arcgis/core/applications/Components
 import { watch as y } from "@arcgis/core/core/reactiveUtils.js";
 import { formatNumber as S } from "@arcgis/core/intl.js";
 import L from "@arcgis/core/widgets/ScaleBar/ScaleBarViewModel.js";
-import { LitElement as B, createEvent as M, noShadowRoot as R, safeClassMap as a, safeStyleMap as f } from "@arcgis/lumina";
-import { u as x, m as D } from "../../chunks/useViewModel.js";
+import { LitElement as B, createEvent as M, noShadowRoot as R, safeClassMap as a, safeStyleMap as _ } from "@arcgis/lumina";
+import { u as x } from "../../chunks/useView.js";
+import { m as D } from "../../chunks/useViewModel.js";
 import { g as v } from "../../chunks/globalCss.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/4.32/esri/copyright.txt for details.
-v4.32.0-next.117 */
-function $(_ = 0, e = 0) {
-  return { x: _, y: e };
+v4.32.0-next.118 */
+function $(f = 0, e = 0) {
+  return { x: f, y: e };
 }
 const r = "esri-scale-bar", t = {
   base: r,
@@ -87,7 +88,7 @@ class k extends B {
   _handleRootCreateOrUpdate() {
     if (!this.viewModel)
       return;
-    const e = this._scaleComputedFrom, i = this.el.getBoundingClientRect(), o = i.left + window.pageXOffset, l = i.top + window.pageYOffset, n = $(o, l);
+    const e = this._scaleComputedFrom, i = this.el.getBoundingClientRect(), s = i.left + window.pageXOffset, l = i.top + window.pageYOffset, n = $(s, l);
     (n.x !== e.x || n.y !== e.y) && (this._scaleComputedFrom = n);
   }
   _formatDistance(e, i) {
@@ -103,33 +104,33 @@ class k extends B {
     const e = this.viewModel.state === "disabled", i = {
       [v.disabled]: e
     };
-    let o, l;
+    let s, l;
     if (!e) {
-      const { unit: n, barStyle: c } = this, b = n === "imperial" || n === "dual", p = n === "metric" || n === "dual", m = 100, h = n === "dual" ? "line" : c;
-      if (b) {
-        const s = this.viewModel.getScaleBarProperties(m, "imperial");
-        s && (l = h === "ruler" ? this._renderRuler(s) : this._renderLine(s, "bottom"));
-      }
+      const { unit: n, barStyle: c } = this, p = n === "imperial" || n === "dual", b = n === "metric" || n === "dual", m = 100, h = n === "dual" ? "line" : c;
       if (p) {
-        const s = this.viewModel.getScaleBarProperties(m, "metric");
-        s && (o = h === "ruler" ? this._renderRuler(s) : this._renderLine(s, "top"));
+        const o = this.viewModel.getScaleBarProperties(m, "imperial");
+        o && (l = h === "ruler" ? this._renderRuler(o) : this._renderLine(o, "bottom"));
+      }
+      if (b) {
+        const o = this.viewModel.getScaleBarProperties(m, "metric");
+        o && (s = h === "ruler" ? this._renderRuler(o) : this._renderLine(o, "top"));
       }
     }
-    return u`<div class=${a(d(t.base, v.widget, i))} ${g(this._handleContainerRef)}>${o}${l}</div>`;
+    return u`<div class=${a(d(t.base, v.widget, i))} ${g(this._handleContainerRef)}>${s}${l}</div>`;
   }
   _renderRuler(e) {
-    const { length: i, unit: o, value: l } = e, n = Math.round(i), c = this._formatDistance(l, o);
-    return u`<div class=${a(d(t.barContainer, t.rulerBarContainer))}><div class=${a(t.ruler)} style=${f({ width: `${n}px` })}><div class=${a(t.rulerBlock)}></div><div class=${a(t.rulerBlock)}></div><div class=${a(t.rulerBlock)}></div><div class=${a(t.rulerBlock)}></div></div><div class=${a(d(t.labelContainer, t.rulerLabelContainer))}><div class=${a(t.label)}>0</div><div class=${a(t.label)}>${c}</div></div></div>`;
+    const { length: i, unit: s, value: l } = e, n = Math.round(i), c = this._formatDistance(l, s);
+    return u`<div class=${a(d(t.barContainer, t.rulerBarContainer))}><div class=${a(t.ruler)} style=${_({ width: `${n}px` })}><div class=${a(t.rulerBlock)}></div><div class=${a(t.rulerBlock)}></div><div class=${a(t.rulerBlock)}></div><div class=${a(t.rulerBlock)}></div></div><div class=${a(d(t.labelContainer, t.rulerLabelContainer))}><div class=${a(t.label)}>0</div><div class=${a(t.label)}>${c}</div></div></div>`;
   }
   _renderLine(e, i) {
-    const { length: o, unit: l, value: n } = e, c = Math.round(o), b = this._formatDistance(n, l), p = {
+    const { length: s, unit: l, value: n } = e, c = Math.round(s), p = this._formatDistance(n, l), b = {
       [t.topLabelContainer]: i === "top",
       [t.bottomLabelContainer]: i === "bottom"
-    }, m = u`<div class=${a(d(t.labelContainer, t.lineLabelContainer, p))}><div class=${a(t.label)}>${b}</div></div>`, h = {
+    }, m = u`<div class=${a(d(t.labelContainer, t.lineLabelContainer, b))}><div class=${a(t.label)}>${p}</div></div>`, h = {
       [t.topLine]: i === "top",
       [t.bottomLine]: i === "bottom"
-    }, s = u`<div class=${a(d(t.line, h))} style=${f({ width: `${c}px` })}></div>`;
-    return u`<div class=${a(d(t.barContainer, t.lineBarContainer))}>${[s, m]}</div>`;
+    }, o = u`<div class=${a(d(t.line, h))} style=${_({ width: `${c}px` })}></div>`;
+    return u`<div class=${a(d(t.barContainer, t.lineBarContainer))}>${[o, m]}</div>`;
   }
 }
 C("arcgis-scale-bar", k);