@arcgis/map-components 5.0.0-next.14 → 5.0.0-next.140

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

@@ -1,91 +1,102 @@
-/// <reference types="@arcgis/core/interfaces.d.ts" />
 /// <reference path="../../index.d.ts" />
-import { default as MapView } from '@arcgis/core/views/MapView.js';
-import { default as SceneView } from '@arcgis/core/views/SceneView.js';
-import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
-import { ArcgisReferenceElement } from '../../utils/component-utils';
+import type MapView from "@arcgis/core/views/MapView.js";
+import type SceneView from "@arcgis/core/views/SceneView.js";
+import type { PublicLitElement as LitElement } from "@arcgis/lumina/PublicLitElement";
+import type { ArcgisReferenceElement } from "../../utils/component-utils.js";
+import type { T9nMeta } from "@arcgis/lumina/controllers";
+import type { Button as Button } from "@esri/calcite-components/components/calcite-button";
 
-type Layout = "horizontal" | "vertical";
-type State = "disabled" | "ready";
 /**
  * The Zoom component allows users to zoom in/out within a map or scene.
  *
- * [Read more...](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-zoom/)
- *
  * @since 4.28
  */
-export declare class ArcgisZoom extends LitElement {
-    /**
-     * The view associated with the component.
-     *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the ArcgisZoom component will be associated with a map or scene component rather than using the `view` property.
-     */
-    view?: MapView | SceneView;
-    /**
-     * If true, the component will not be destroyed automatically when it is
-     * disconnected from the document. This is useful when you want to move the
-     * component to a different place on the page, or temporarily hide it. If this
-     * is set, make sure to call the [destroy](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-zoom/#destroy) method when you are done to
-     * prevent memory leaks.
-     *
-     * @default false
-     */
-    autoDestroyDisabled: boolean;
-    /**
-     * Icon which represents the component.
-     * Typically used when the component is controlled by another component (e.g. by the Expand component).
-     *
-     * @see [Calcite Icons](https://developers.arcgis.com/calcite-design-system/icons/)
-     * @default "magnifying-glass-plus"
-     */
-    icon?: string;
-    /** The component's default label. */
-    label?: string;
-    /**
-     * Determines the layout/orientation of the Zoom widget.
-     *
-     * @default "vertical"
-     */
-    layout: Layout;
-    /**
-     * Replace localized message strings with your own strings.
-     *
-     * _**Note**: Individual message keys may change between releases._
-     */
-    messageOverrides?: typeof this.messages._overrides;
-    /** @deprecated since 4.34, use [`slot`](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/slot) instead. */
-    position?: __esri.UIPosition;
-    /**
-     * By assigning the `id` attribute of the Map or Scene component to this property, you can position a child component anywhere in the DOM while still maintaining a connection to the Map or Scene.
-     *
-     * @see [Associate components with a Map or Scene component](https://developers.arcgis.com/javascript/latest/programming-patterns/#associate-components-with-a-map-or-scene-component)
-     */
-    referenceElement?: ArcgisReferenceElement | string;
-    /**
-     * The current state of the component.
-     *
-     * @default "disabled"
-     */
-    state: State;
-    /** Permanently destroy the component. */
-    destroy(): Promise<void>;
-    /** Zooms the view in by an LOD factor of 0.5. */
-    zoomIn(): Promise<void>;
-    /** Zooms the view out by an LOD factor of 2. */
-    zoomOut(): Promise<void>;
-    /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
-    readonly arcgisPropertyChange: TargetedEvent<this, {
-        name: "state";
-    }>;
-    /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
-    readonly arcgisReady: TargetedEvent<this, void>;
-    private messages: Partial<{
-        componentLabel: string;
-        zoomIn: string;
-        zoomOut: string;
-    }> & import('@arcgis/lumina/controllers').T9nMeta<{
-        componentLabel: string;
-        zoomIn: string;
-        zoomOut: string;
-    }>;
+export abstract class ArcgisZoom extends LitElement {
+  /**
+   * If true, the component will not be destroyed automatically when it is
+   * disconnected from the document. This is useful when you want to move the
+   * component to a different place on the page, or temporarily hide it. If this
+   * is set, make sure to call the [destroy()](https://developers.arcgis.com/javascript/latest/references/map-components/arcgis-zoom/#destroy) method when you are done to
+   * prevent memory leaks.
+   *
+   * @default false
+   */
+  accessor autoDestroyDisabled: boolean;
+  /**
+   * Icon which represents the component.
+   * Typically used when the component is controlled by another component (e.g. by the Expand component).
+   *
+   * @default "magnifying-glass-plus"
+   * @see [Calcite Icons](https://developers.arcgis.com/calcite-design-system/icons/)
+   */
+  accessor icon: string | undefined;
+  /** The component's default label. */
+  accessor label: string | undefined;
+  /**
+   * Determines the layout/orientation of the Zoom component.
+   *
+   * @default "vertical"
+   */
+  accessor layout: Layout;
+  /**
+   * Replace localized message strings with your own strings.
+   *
+   * _**Note**: Individual message keys may change between releases._
+   */
+  accessor messageOverrides: {
+      componentLabel?: string | undefined;
+      zoomIn?: string | undefined;
+      zoomOut?: string | undefined;
+  };
+  /** @internal */
+  protected messages: Partial<{
+      componentLabel: string;
+      zoomIn: string;
+      zoomOut: string;
+  }> & T9nMeta<{
+      componentLabel: string;
+      zoomIn: string;
+      zoomOut: string;
+  }>;
+  /**
+   * By assigning the `id` attribute of the Map or Scene component to this property, you can position a child component anywhere in the DOM while still maintaining a connection to the Map or Scene.
+   *
+   * @see [Associate components with a Map or Scene component](https://developers.arcgis.com/javascript/latest/programming-patterns/#associate-components-with-a-map-or-scene-component)
+   */
+  accessor referenceElement: ArcgisReferenceElement | string | undefined;
+  /** The current state of the component. */
+  get state(): State;
+  /**
+   * The view associated with the component. 
+   *   > **Note:** The recommended approach is to fully migrate applications to use map and scene components and avoid using MapView and SceneView directly. However, if you are migrating a large application from widgets to components, you might prefer a more gradual transition. To support this use case, the SDK includes this `view` property which connects a component to a MapView or SceneView. Ultimately, once migration is complete, the Zoom component will be associated with a map or scene component rather than using the `view` property.
+   */
+  accessor view: MapView | SceneView | undefined;
+  /**
+   * Specifies the size of the component.
+   *
+   * @default "m"
+   * @since 5.0
+   */
+  accessor visualScale: Button["scale"];
+  /** Permanently destroy the component. */
+  destroy(): Promise<void>;
+  /** Zooms the view in by an LOD factor of 0.5. */
+  zoomIn(): Promise<void>;
+  /** Zooms the view out by an LOD factor of 2. */
+  zoomOut(): Promise<void>;
+  /** Emitted when one of the zoom controls is clicked. */
+  readonly arcgisClick: import("@arcgis/lumina").TargetedEvent<this, { action: "zoomIn" | "zoomOut"; }>;
+  /** Emitted when the value of a property is changed. Use this to listen to changes to properties. */
+  readonly arcgisPropertyChange: import("@arcgis/lumina").TargetedEvent<this, { name: "state"; }>;
+  /** Emitted when the component associated with a map or scene view is ready to be interacted with. */
+  readonly arcgisReady: import("@arcgis/lumina").TargetedEvent<this, void>;
+  readonly "@eventTypes": {
+    arcgisClick: ArcgisZoom["arcgisClick"]["detail"];
+    arcgisPropertyChange: ArcgisZoom["arcgisPropertyChange"]["detail"];
+    arcgisReady: ArcgisZoom["arcgisReady"]["detail"];
+  };
 }
-export {};
+
+export type Layout = "horizontal" | "vertical";
+
+export type State = "disabled" | "ready";

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

@@ -1,16 +1,16 @@
-import { c as h } from "../../chunks/runtime.js";
-import { css as g, html as b } from "lit";
-import { classes as s } from "@arcgis/toolkit/dom";
-import { ignoreAbortErrors as l } from "@arcgis/core/core/promiseUtils.js";
-import { when as y } from "@arcgis/core/core/reactiveUtils.js";
-import { LitElement as z, createEvent as p, safeClassMap as i, nothing as m } from "@arcgis/lumina";
+import { c as f } from "../../chunks/runtime.js";
+import { css as g, html as z } from "lit";
+import { classes as c } from "@arcgis/toolkit/dom";
+import { ignoreAbortErrors as y } from "@arcgis/core/core/promiseUtils.js";
+import { when as b } from "@arcgis/core/core/reactiveUtils.js";
+import { LitElement as p, createEvent as l, safeClassMap as n, nothing as m } from "@arcgis/lumina";
 import { usePropertyChange as v } from "@arcgis/lumina/controllers";
 import { u as x } from "../../chunks/useT9n.js";
 import { u as $ } from "../../chunks/useView.js";
 /*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
 See https://js.arcgis.com/5.0/esri/copyright.txt for details.
-v5.0.0-next.14 */
-const r = {
+v5.0.0-next.140 */
+const i = {
   base: "arcgis-zoom",
   button: "arcgis-button",
   horizontalLayout: "arcgis-zoom--horizontal",
@@ -24,8 +24,8 @@ function u(t) {
     return t.ready;
   if (!t?.ready)
     return !1;
-  const e = f(t), a = t.constraints?.effectiveMaxScale;
-  return a === 0 || e > a;
+  const o = h(t), e = t.constraints?.effectiveMaxScale;
+  return e === 0 || o > e;
 }
 function d(t) {
   if (!t)
@@ -34,50 +34,60 @@ function d(t) {
     return t.ready;
   if (!t?.ready)
     return !1;
-  const e = f(t), a = t.constraints?.effectiveMinScale;
-  return a === 0 || e < a;
+  const o = h(t), e = t.constraints?.effectiveMinScale;
+  return e === 0 || o < e;
 }
-function f(t) {
-  const o = t?.animation?.target;
-  return (o && "then" in o ? void 0 : o?.scale) ?? t?.scale ?? 0;
+function h(t) {
+  const a = t?.animation?.target;
+  return (a && "then" in a ? void 0 : a?.scale) ?? t?.scale ?? 0;
 }
-const E = g`.arcgis-button{--calcite-ui-icon-color: var(--calcite-color-text-3);--calcite-button-background-color: var(--calcite-color-foreground-1);color:var(--calcite-color-text-3);line-height:var(--calcite-font-line-height-relative-tight);display:flex;flex-flow:column;cursor:pointer;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);:hover{--calcite-ui-icon-color: var(--calcite-color-text-1);--calcite-button-background-color: var(--calcite-color-transparent-hover)}calcite-button{width:var(--calcite-spacing-xxxl);height:var(--calcite-spacing-xxxl)}}:host{display:flex;max-width:fit-content}.arcgis-zoom__zoom-out{border-block-start:solid 1px var(--calcite-color-border-1)}.arcgis-zoom--horizontal{flex-flow:row-reverse nowrap}.arcgis-zoom--horizontal .arcgis-zoom__zoom-out{border-block-start:none;border-inline-end:solid 1px var(--calcite-color-border-1)}`;
-class O extends z {
+const _ = g`.arcgis-button{--calcite-icon-color: var(--calcite-color-text-3);--calcite-button-background-color: var(--calcite-color-foreground-1);color:var(--calcite-color-text-3);line-height:var(--calcite-font-line-height-relative-tight);display:flex;flex-flow:column;cursor:pointer;background-color:var(--calcite-color-foreground-1);font-size:var(--calcite-font-size);:hover{--calcite-icon-color: var(--calcite-color-text-1);--calcite-button-background-color: var(--calcite-color-transparent-hover)}}:host{display:flex;max-width:fit-content}.arcgis-zoom__zoom-out{border-block-start:solid 1px var(--calcite-color-border-1)}.arcgis-zoom--horizontal{flex-flow:row-reverse nowrap}.arcgis-zoom--horizontal .arcgis-zoom__zoom-out{border-block-start:none;border-inline-end:solid 1px var(--calcite-color-border-1)}`;
+class k extends p {
   constructor() {
-    super(...arguments), this.messages = x({}), this.view = $(this), this.autoDestroyDisabled = !1, this.icon = "magnifying-glass-plus", this.layout = "vertical", this.state = "disabled", this.arcgisPropertyChange = v()("state"), this.arcgisReady = p();
+    super(...arguments), this.messages = x({}), this._state = "disabled", this.view = $(this), this.autoDestroyDisabled = !1, this.icon = "magnifying-glass-plus", this.layout = "vertical", this.visualScale = "m", this.arcgisClick = l(), this.arcgisPropertyChange = v()("state"), this.arcgisReady = l();
   }
   static {
-    this.properties = { view: 0, autoDestroyDisabled: 5, icon: 1, label: 1, layout: 3, messageOverrides: 0, position: 1, referenceElement: 1, state: 3 };
+    this.properties = { _state: 16, view: 0, autoDestroyDisabled: 5, icon: 1, label: 1, layout: 3, messageOverrides: 0, referenceElement: 1, visualScale: 1, state: 32 };
   }
   static {
-    this.styles = E;
+    this.styles = _;
+  }
+  get state() {
+    return this._state;
   }
   async destroy() {
     await this.manager.destroy();
   }
   async zoomIn() {
-    const { view: o } = this;
-    !u(o) || !o || (o.type === "2d" ? o.mapViewNavigation.zoomIn() : l(o.goTo({ zoomFactor: 2 })));
+    await this.zoomBy(1);
   }
   async zoomOut() {
-    const { view: o } = this;
-    !d(o) || !o || (o.type === "2d" ? o.mapViewNavigation.zoomOut() : l(o.goTo({ zoomFactor: 0.5 })));
+    await this.zoomBy(-1);
   }
   loaded() {
     this.manager.onLifecycle(() => [
-      y(() => this.view?.ready ? "ready" : "disabled", (o) => {
-        this.state = o;
+      b(() => this.view?.ready ? "ready" : "disabled", (a) => {
+        this._state = a;
       }, { sync: !0, initial: !0 })
     ]);
   }
+  async zoomBy(a) {
+    const { view: o } = this, e = a === 1;
+    if (!(!(e ? u(o) : d(o)) || !o))
+      if (this.arcgisClick.emit({ action: e ? "zoomIn" : "zoomOut" }), o.type === "2d") {
+        const s = o.mapViewNavigation;
+        e ? await s.zoomIn() : await s.zoomOut();
+      } else
+        await y(o.goTo({ zoom: o.zoom + a }));
+  }
   render() {
-    const o = {
-      [r.horizontalLayout]: this.layout === "horizontal"
-    }, e = u(this.view), a = d(this.view), { zoomIn: c, zoomOut: n } = this.messages;
-    return b`<div class=${i(s(r.base, r.button, o))}><calcite-button class=${i(s(r.zoomIn))} .disabled=${!e} icon-start=plus kind=neutral .label=${c} @click=${this.zoomIn} title=${c ?? m}></calcite-button><calcite-button class=${i(s(r.zoomOut))} .disabled=${!a} icon-start=minus kind=neutral .label=${n} @click=${this.zoomOut} title=${n ?? m}></calcite-button></div>`;
+    const a = {
+      [i.horizontalLayout]: this.layout === "horizontal"
+    }, o = u(this.view), e = d(this.view), { zoomIn: r, zoomOut: s } = this.messages;
+    return z`<div class=${n(c(i.base, i.button, a))}><calcite-button class=${n(c(i.zoomIn))} .disabled=${!o} icon-start=plus kind=neutral .label=${r} @click=${this.zoomIn} .scale=${this.visualScale} title=${r ?? m}></calcite-button><calcite-button class=${n(c(i.zoomOut))} .disabled=${!e} icon-start=minus kind=neutral .label=${s} @click=${this.zoomOut} .scale=${this.visualScale} title=${s ?? m}></calcite-button></div>`;
   }
 }
-h("arcgis-zoom", O);
+f("arcgis-zoom", k);
 export {
-  O as ArcgisZoom
+  k as ArcgisZoom
 };

package/dist/components/arcgis-zoom/index.d.ts

@@ -1,2 +1 @@
-import "@esri/calcite-components/components/calcite-button";
 export * from "./customElement.js";

package/dist/components/support/goTo.d.ts

@@ -0,0 +1,36 @@
+/// <reference types="@arcgis/core/interfaces.d.ts" />
+import type { GoToOptions2D, GoToOptions3D, GoToTarget2D, GoToTarget3D } from "@arcgis/core//views/types.js";
+
+/**
+ * @param view
+ * @param goToParameters
+ */
+export type GoToOverride = (view: GoToOwner & MapViewOrSceneView, goToParameters: GoToParameters) => Promise<void>;
+
+export type GoToOwner = Pick<__esri.MapView, "goTo">
+  & Pick<__esri.SceneView, "goTo">;
+
+export type MapViewOrSceneView = __esri.MapView | __esri.SceneView;
+
+export type GoToParameters = GoToParameters2D
+  & GoToParameters3D;
+
+export interface GoToParameters2D {
+  /**
+   * The target location/viewpoint/extent to animate to.
+   *
+   * @since 5.0
+   */
+  target: GoToTarget2D;
+  /**
+   * Options defining the animation and duration of the navigation.
+   *
+   * @since 5.0
+   */
+  options?: GoToOptions2D;
+}
+
+export interface GoToParameters3D {
+  target: GoToTarget3D;
+  options?: GoToOptions3D;
+}

package/dist/components/types.d.ts

@@ -1,5 +1 @@
-export type MeasurementSystem = "imperial" | "metric";
-type MetricMapUnit = "centimeter" | "kilometer" | "meter" | "millimeter";
-type ImperialMapUnit = "foot" | "inch" | "mile";
-export type MapUnit = ImperialMapUnit | MetricMapUnit;
-export {};
+export type MeasurementSystem = "imperial" | "metric";

package/dist/controllers/useArcgisLoadError.d.ts

@@ -1,27 +1,9 @@
-import { default as WebMap } from '@arcgis/core/WebMap.js';
-import { default as WebScene } from '@arcgis/core/WebScene.js';
-import { default as WebLinkChart } from '@arcgis/core/WebLinkChart';
-import { default as Map } from '@arcgis/core/Map.js';
-import { default as Basemap } from '@arcgis/core/Basemap.js';
-import { default as Ground } from '@arcgis/core/Ground.js';
-import { default as Layer } from '@arcgis/core/layers/Layer.js';
-import { EventEmitter } from '@arcgis/lumina';
+import type WebMap from "@arcgis/core/WebMap.js";
+import type WebScene from "@arcgis/core/WebScene.js";
+import type WebLinkChart from "@arcgis/core/WebLinkChart";
+import type Basemap from "@arcgis/core/Basemap.js";
+import type Ground from "@arcgis/core/Ground.js";
+import type Layer from "@arcgis/core/layers/Layer.js";
+
 /** A potential source of load errors. */
-export type LoadErrorSource = Basemap | Ground | Layer | WebLinkChart | WebMap | WebScene;
-/**
- * Watches for load errors on components that have a `map` property. Returns an event that will be
- * emitted each time a load error is thrown. It will also update the component's `loadErrorSources`
- * property with the latest errors.
- *
- * @example
- *
- * ```js
- * class MyMapComponent extends LitElement {
- *   arcgisLoadError = useArcgisLoadError(this);
- * }
- * ```
- */
-export declare const useArcgisLoadError: (component: {
-    map: Map | nullish;
-    loadErrorSources?: LoadErrorSource[];
-} & import('@arcgis/lumina').LitElement) => EventEmitter;
+export type LoadErrorSource = Basemap | Ground | Layer | WebLinkChart | WebMap | WebScene;