@arcgis/map-components 4.32.0-next.14 → 4.32.0-next.141

package/dist/components/arcgis-scale-bar/customElement.d.ts

@@ -1,9 +1,11 @@
 /// <reference types="@arcgis/core/interfaces.d.ts" />
-import { ArcgisReferenceElement } from '../../utils/component-utils';
-import { Nil } from '@arcgis/components-utils';
+/// <reference types="../../index.d.ts" />
 import { Use } from '@arcgis/components-controllers';
+import { Nil } from '@arcgis/components-utils';
+import { default as ScaleBarViewModel } from '@arcgis/core/widgets/ScaleBar/ScaleBarViewModel.js';
+import { JsxNode, PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { ArcgisReferenceElement } from '../../utils/component-utils';
 import { MeasurementSystem } from '../types';
-import { JsxNode, PublicLitElement as LitElement } from '@arcgis/lumina';
 
 type ScaleBarStyle = "line" | "ruler";
 type ScaleBarUnit = MeasurementSystem | "dual";
@@ -12,29 +14,23 @@ declare const useScaleBarViewModel: (component: import('@arcgis/components-contr
     el: HTMLElement;
     autoDestroyDisabled?: boolean;
     destroy?: () => Promise<void>;
-} & Pick<__esri.ScaleBarViewModel, never> & {
-    reactiveUtils?: typeof __esri.reactiveUtils;
-    state?: "ready" | "disabled" | undefined;
-    icon: Nil | string;
-    label: Nil | string;
-    referenceElement: ArcgisReferenceElement | Nil | string;
-    arcgisReady: import('@arcgis/components-controllers').EventEmitter;
-    position: __esri.UIPosition;
-    arcgisPropertyChange: import('@arcgis/components-controllers').EventEmitter<{
-        name: string;
-    }> | undefined;
-    el: HTMLElement & {
-        childElem?: HTMLElement & {
-            ownedBy?: HTMLElement;
-        };
-        view?: __esri.MapView | __esri.SceneView | undefined;
-    };
-    autoDestroyDisabled: boolean;
-    destroy: () => Promise<void>;
-}, options?: {
+} & Pick<ScaleBarViewModel, never> & import('../../controllers/useViewModel').ViewModelControllerUses<ScaleBarViewModel>, options?: {
     editConstructorProperties(props: unknown): unknown;
-} | undefined) => __esri.ScaleBarViewModel;
-export declare class ArcgisScaleBar extends LitElement implements Use<typeof useScaleBarViewModel> {
+} | undefined) => ScaleBarViewModel;
+/**
+ * The Scale Bar componenent displays a scale bar representing the scale of the map.
+ * It respects various coordinate systems and displays units in metric or imperial values.
+ * Metric values show either kilometers, meters, centimeters, or millimeters depending on the scale, and likewise, imperial values show miles, feet, or inches depending on the scale.
+ * When working with Web Mercator or geographic coordinate systems the scale bar takes into account projection distortion and dynamically adjusts the scale bar.
+ *
+ * When the scale bar is inside the map, the actual location of the scale bar is used to calculate the scale.
+ * Otherwise, the center of the map is used to calculate the scale.
+ *
+ * **Known Limitations**
+ *
+ * - This component is not currently supported within an `arcgis-scene` component.
+ */
+export declare class ArcgisScaleBar extends LitElement {
     private messages;
     /**
      * If true, the component will not be destroyed automatically when
@@ -49,10 +45,15 @@ export declare class ArcgisScaleBar extends LitElement implements Use<typeof use
      * When `unit` is set to `dual`, the style will always be `line`.
      */
     barStyle: ScaleBarStyle;
-    /** Icon displayed in the widget's button. */
+    /**
+     * 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: Nil | string;
-    /** The widget's default label. */
+    /** The component's default label. */
     label: Nil | string;
+    /** Replace localized message strings with your own strings. */
     messageOverrides?: typeof this.messages._overrides;
     position: __esri.UIPosition;
     referenceElement: ArcgisReferenceElement | Nil | string;
@@ -66,6 +67,6 @@ export declare class ArcgisScaleBar extends LitElement implements Use<typeof use
     set unit(value: ScaleBarUnit | undefined);
     /** Permanently destroy the component */
     destroy(): Promise<void>;
-    readonly arcgisReady: CustomEvent<undefined>;
+    readonly arcgisReady: TargetedEvent<this, undefined>;
 }
 export {};

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

@@ -1,17 +1,21 @@
-import { c as w } from "../../chunks/runtime.js";
+import { c as C } from "../../chunks/runtime.js";
 import { ref as g } from "lit-html/directives/ref.js";
 import { html as u } from "lit-html";
-import { g as f } from "../../chunks/globalCss.js";
-import { u as y, m as S } from "../../chunks/useViewModel.js";
 import { classes as d } from "@arcgis/components-utils";
-import { load as v } from "@arcgis/components-controllers";
-import { importIntl as B, importCoreReactiveUtils as L, importApplicationsComponentsGetDefaultUnits as M, newWidgetsScaleBarScaleBarViewModel as U } from "@arcgis/core-adapter";
-import { LitElement as D, createEvent as R, noShadowRoot as x, safeClassMap as s, safeStyleMap as $ } from "@arcgis/lumina";
-/*!
- * 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.14
-*/
+import { getDefaultUnitForView as w } from "@arcgis/core/applications/Components/getDefaultUnits.js";
+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 _ } 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.141 */
+function $(f = 0, e = 0) {
+  return { x: f, y: e };
+}
 const r = "esri-scale-bar", t = {
   base: r,
   labelContainer: `${r}__label-container`,
@@ -28,20 +32,16 @@ const r = "esri-scale-bar", t = {
   barContainer: `${r}__bar-container`,
   rulerBarContainer: `${r}__bar-container--ruler`,
   lineBarContainer: `${r}__bar-container--line`
-};
-function C(_ = 0, e = 0) {
-  return { x: _, y: e };
-}
-const k = S(U);
-class O extends D {
+}, U = D(L);
+class k extends B {
   constructor() {
-    super(...arguments), this.intlUtils = v(B), this.messages = y(), this.reactiveUtils = v(L), this._scaleComputedFrom = C(), this.unitUtils = v(M), this.viewModel = k(this), this.autoDestroyDisabled = !1, this.barStyle = "line", this.icon = "actual-size", this.position = "top-left", this.arcgisReady = R();
+    super(...arguments), this._defaultUnit = "metric", this.messages = x(), this._scaleComputedFrom = $(), this.viewModel = U(this), this.autoDestroyDisabled = !1, this.barStyle = "line", this.icon = "actual-size", this.position = "top-left", this.arcgisReady = M();
   }
   static {
     this.properties = { autoDestroyDisabled: 5, barStyle: 1, icon: 3, label: 1, messageOverrides: 0, position: 3, referenceElement: 1, unit: 1 };
   }
   static {
-    this.shadowRootOptions = x;
+    this.shadowRootOptions = R;
   }
   /**
    * Units to use for the scale bar.
@@ -67,64 +67,73 @@ class O extends D {
     this._handleRootCreateOrUpdate();
   }
   loaded() {
-    this._defaultUnit = this.unitUtils.getDefaultUnitForView(this.viewModel.view), this.manager.onLifecycle(() => this.reactiveUtils.watch(() => {
+    this.manager.onLifecycle(() => y(() => {
       const e = this.viewModel.view;
-      return [e?.stationary, e?.center, e?.scale, e?.zoom];
-    }, ([e]) => {
-      e && this.requestUpdate();
+      return {
+        defaultUnit: e ? w(e) : void 0,
+        stationary: e?.stationary,
+        center: e?.center,
+        scale: e?.scale,
+        zoom: e?.zoom
+      };
+    }, ({ defaultUnit: e, stationary: i }) => {
+      this._defaultUnit = e ?? "metric", i && this.requestUpdate();
     }));
   }
   // #endregion
   // #region Private Methods
+  _handleContainerRef(e) {
+    e !== void 0 && this._handleRootCreateOrUpdate();
+  }
   _handleRootCreateOrUpdate() {
     if (!this.viewModel)
       return;
-    const e = this._scaleComputedFrom, a = this.el.getBoundingClientRect(), l = a.left + window.pageXOffset, o = a.top + window.pageYOffset, i = C(l, o);
-    (i.x !== e.x || i.y !== e.y) && (this._scaleComputedFrom = i);
+    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, a) {
-    return this.intlUtils.formatNumber(e, {
+  _formatDistance(e, i) {
+    return S(e, {
       style: "unit",
-      unit: a,
+      unit: i,
       unitDisplay: "short"
     });
   }
   // #endregion
   // #region Rendering
   render() {
-    const e = this.viewModel.state === "disabled", a = {
-      [f.disabled]: e
+    const e = this.viewModel.state === "disabled", i = {
+      [v.disabled]: e
     };
-    let l, o;
+    let s, l;
     if (!e) {
-      const { unit: i, barStyle: c } = this, p = i === "imperial" || i === "dual", b = i === "metric" || i === "dual", m = 100, h = i === "dual" ? "line" : c;
+      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 n = this.viewModel.getScaleBarProperties(m, "imperial");
-        n && (o = h === "ruler" ? this._renderRuler(n) : this._renderLine(n, "bottom"));
+        const o = this.viewModel.getScaleBarProperties(m, "imperial");
+        o && (l = h === "ruler" ? this._renderRuler(o) : this._renderLine(o, "bottom"));
       }
       if (b) {
-        const n = this.viewModel.getScaleBarProperties(m, "metric");
-        n && (l = h === "ruler" ? this._renderRuler(n) : this._renderLine(n, "top"));
+        const o = this.viewModel.getScaleBarProperties(m, "metric");
+        o && (s = h === "ruler" ? this._renderRuler(o) : this._renderLine(o, "top"));
       }
     }
-    return u`<div class=${s(d(t.base, f.widget, a))} ${g((i) => i ? this._handleRootCreateOrUpdate() : void 0)}>${l}${o}</div>`;
+    return u`<div class=${a(d(t.base, v.widget, i))} ${g(this._handleContainerRef)}>${s}${l}</div>`;
   }
   _renderRuler(e) {
-    const { length: a, unit: l, value: o } = e, i = Math.round(a), c = this._formatDistance(o, l);
-    return u`<div class=${s(d(t.barContainer, t.rulerBarContainer))}><div class=${s(t.ruler)} style=${$({ width: `${i}px` })}><div class=${s(t.rulerBlock)}></div><div class=${s(t.rulerBlock)}></div><div class=${s(t.rulerBlock)}></div><div class=${s(t.rulerBlock)}></div></div><div class=${s(d(t.labelContainer, t.rulerLabelContainer))}><div class=${s(t.label)}>0</div><div class=${s(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, a) {
-    const { length: l, unit: o, value: i } = e, c = Math.round(l), p = this._formatDistance(i, o), b = {
-      [t.topLabelContainer]: a === "top",
-      [t.bottomLabelContainer]: a === "bottom"
-    }, m = u`<div class=${s(d(t.labelContainer, t.lineLabelContainer, b))}><div class=${s(t.label)}>${p}</div></div>`, h = {
-      [t.topLine]: a === "top",
-      [t.bottomLine]: a === "bottom"
-    }, n = u`<div class=${s(d(t.line, h))} style=${$({ width: `${c}px` })}></div>`;
-    return u`<div class=${s(d(t.barContainer, t.lineBarContainer))}>${[n, m]}</div>`;
+  _renderLine(e, i) {
+    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, b))}><div class=${a(t.label)}>${p}</div></div>`, h = {
+      [t.topLine]: i === "top",
+      [t.bottomLine]: i === "bottom"
+    }, 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>`;
   }
 }
-w("arcgis-scale-bar", O);
+C("arcgis-scale-bar", k);
 export {
-  O as ArcgisScaleBar
+  k as ArcgisScaleBar
 };

package/dist/components/arcgis-scale-range-slider/customElement.d.ts

@@ -1,15 +1,17 @@
 /// <reference types="@arcgis/core/interfaces.d.ts" />
-import { ArcgisReferenceElement } from '../../utils/component-utils';
+/// <reference types="../../index.d.ts" />
 import { Use } from '@arcgis/components-controllers';
 import { Nil } from '@arcgis/components-utils';
-import { PublicLitElement as LitElement } from '@arcgis/lumina';
+import { default as ScaleRangeSlider } from '@arcgis/core/widgets/ScaleRangeSlider.js';
+import { PublicLitElement as LitElement, TargetedEvent } from '@arcgis/lumina';
+import { ArcgisReferenceElement } from '../../utils/component-utils';
 
 declare const useScaleRangeSliderWidget: (component: import('@arcgis/components-controllers').StencilLifecycles & {
     manager: import('@arcgis/components-controllers').ControllerManager;
     el: HTMLElement;
     autoDestroyDisabled?: boolean;
     destroy?: () => Promise<void>;
-} & Pick<__esri.ScaleRangeSlider, "label" | "viewModel" | "icon" | "mode" | "disabled" | "layer" | "maxScale" | "maxScaleLimit" | "minScale" | "minScaleLimit" | "region"> & {
+} & Pick<ScaleRangeSlider, never> & {
     reactiveUtils?: typeof __esri.reactiveUtils;
     state?: unknown;
     viewModel?: __esri.ScaleRangeSliderViewModel | undefined;
@@ -30,13 +32,15 @@ declare const useScaleRangeSliderWidget: (component: import('@arcgis/components-
     autoDestroyDisabled: boolean;
     destroy: () => Promise<void>;
 }, options?: {
-    editConstructorProperties(props: __esri.ScaleRangeSliderProperties): __esri.ScaleRangeSliderProperties | Promise<__esri.ScaleRangeSliderProperties>;
-} | undefined) => __esri.ScaleRangeSlider;
-export declare class ArcgisScaleRangeSlider extends LitElement implements Use<typeof useScaleRangeSliderWidget> {
+    editConstructorProperties(props: __esri.ScaleRangeSliderProperties | undefined): __esri.ScaleRangeSliderProperties | Promise<__esri.ScaleRangeSliderProperties | undefined> | undefined;
+} | undefined) => ScaleRangeSlider;
+/** The ScaleRangeSlider component allows the user to set a minimum and maximum scale based on named scale ranges.
+ */
+export declare class ArcgisScaleRangeSlider 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 temporary hide it. If this
+     * component to a different place on the page, or temporarily hide it. If this
      * is set, make sure to call the \`destroy\` method when you are done to prevent
      * memory leaks.
      */
@@ -51,8 +55,9 @@ export declare class ArcgisScaleRangeSlider extends LitElement implements Use<ty
      * Search [Calcite Icons](https://developers.arcgis.com/calcite-design-system/icons/) for possible values.
      */
     icon: string;
+    /** The component's default label. */
     label: string;
-    layer: __esri.Layer;
+    layer: nullish | __esri.Layer | __esri.Sublayer;
     maxScale: number;
     maxScaleLimit: number;
     minScale: number;
@@ -64,9 +69,9 @@ export declare class ArcgisScaleRangeSlider extends LitElement implements Use<ty
     readonly state: "ready" | "disabled";
     /** Permanently destroy the component */
     destroy(): Promise<void>;
-    readonly arcgisPropertyChange: CustomEvent<{
+    readonly arcgisPropertyChange: TargetedEvent<this, {
         name: "state" | "maxScale" | "minScale";
     }>;
-    readonly arcgisReady: CustomEvent<undefined>;
+    readonly arcgisReady: TargetedEvent<this, undefined>;
 }
 export {};

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

@@ -1,27 +1,25 @@
 import { c as e } from "../../chunks/runtime.js";
-import { newWidgetsScaleRangeSlider as i } from "@arcgis/core-adapter";
-import { usePropertyChange as t } from "@arcgis/components-controllers";
-import { m as s } from "../../chunks/useWidget.js";
-import { LitElement as a, createEvent as l, noShadowRoot as n } from "@arcgis/lumina";
-import { css as o } 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.14
-*/
-const c = o`arcgis-scale-range-slider{display:block}`, r = s(i);
-class d extends a {
+import { usePropertyChange as i } from "@arcgis/components-controllers";
+import t from "@arcgis/core/widgets/ScaleRangeSlider.js";
+import { LitElement as s, createEvent as a, noShadowRoot as l } from "@arcgis/lumina";
+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.141 */
+const r = n`@layer{arcgis-scale-range-slider{display:block}}`, c = o(t);
+class h extends s {
   constructor() {
-    super(...arguments), this.widget = r(this), this.viewModel = this.widget.viewModel, this.autoDestroyDisabled = !1, this.disabled = this.widget.disabled, this.hidePreview = this.widget.visibleElements.preview, this.hideScaleMenusMaxScaleMenu = this.widget.visibleElements.scaleMenus.maxScaleMenu, this.hideScaleMenusMinScaleMenu = this.widget.visibleElements.scaleMenus.minScaleMenu, this.icon = this.widget.icon, this.label = this.widget.label, this.layer = this.widget.layer, this.maxScale = this.widget.maxScale, this.maxScaleLimit = this.widget.maxScaleLimit, this.minScale = this.widget.minScale, this.minScaleLimit = this.widget.minScaleLimit, this.mode = this.widget.mode, this.position = "bottom-left", this.region = this.widget.region, this.state = this.viewModel.state, this.arcgisPropertyChange = t()("state", "minScale", "maxScale"), this.arcgisReady = l();
+    super(...arguments), this.widget = c(this), this.viewModel = this.widget.viewModel, this.autoDestroyDisabled = !1, this.disabled = this.widget.disabled, this.hidePreview = this.widget.visibleElements.preview, this.hideScaleMenusMaxScaleMenu = this.widget.visibleElements.scaleMenus.maxScaleMenu, this.hideScaleMenusMinScaleMenu = this.widget.visibleElements.scaleMenus.minScaleMenu, this.icon = this.widget.icon, this.label = this.widget.label, this.layer = this.widget.layer, this.maxScale = this.widget.maxScale, this.maxScaleLimit = this.widget.maxScaleLimit, this.minScale = this.widget.minScale, this.minScaleLimit = this.widget.minScaleLimit, this.mode = this.widget.mode, this.position = "bottom-left", this.region = this.widget.region, this.state = this.viewModel.state, this.arcgisPropertyChange = i()("state", "minScale", "maxScale"), this.arcgisReady = a();
   }
   static {
-    this.properties = { autoDestroyDisabled: 5, disabled: 7, hidePreview: 5, hideScaleMenusMaxScaleMenu: 5, hideScaleMenusMinScaleMenu: 5, icon: 1, label: 1, layer: 0, maxScale: 9, maxScaleLimit: 9, minScale: 9, minScaleLimit: 9, mode: 1, position: 1, referenceElement: 1, region: 1, state: 3 };
+    this.properties = { autoDestroyDisabled: 5, disabled: 7, hidePreview: 5, hideScaleMenusMaxScaleMenu: 5, hideScaleMenusMinScaleMenu: 5, icon: 1, label: 1, layer: 0, maxScale: 9, maxScaleLimit: 9, minScale: 9, minScaleLimit: 9, mode: 1, position: 1, referenceElement: 1, region: 0, state: 3 };
   }
   static {
-    this.shadowRootOptions = n;
+    this.shadowRootOptions = l;
   }
   static {
-    this.styles = c;
+    this.styles = r;
   }
   // #endregion
   // #region Public Methods
@@ -30,7 +28,7 @@ class d extends a {
     await this.manager.destroy();
   }
 }
-e("arcgis-scale-range-slider", d);
+e("arcgis-scale-range-slider", h);
 export {
-  d as ArcgisScaleRangeSlider
+  h as ArcgisScaleRangeSlider
 };