@arcgis/map-components/dist/components/arcgis-area-measurement-3d/customElement.js

ArcGIS Map Components

import { c as h } from "../../chunks/runtime.js";
import { html as y } from "lit-html";
import { LitElement as g, createEvent as f, noShadowRoot as w, nothing as v, safeClassMap as b } from "@arcgis/lumina";
import { usePropertyChange as M } from "@arcgis/lumina/controllers";
import { u as O } from "../../chunks/useT9n.js";
import { m as $ } from "../../chunks/useViewModel.js";
import { g as m } from "../../chunks/globalCss.js";
import { css as A } from "@lit/reactive-element/css-tag.js";
import U from "@arcgis/core/analysis/AreaMeasurementAnalysis.js";
import { getDefaultUnitForView as V } from "@arcgis/core/applications/Components/getDefaultUnits.js";
import { property as o, subclass as _ } from "@arcgis/core/core/accessorSupport/decorators.js";
import { watch as D } from "@arcgis/core/core/reactiveUtils.js";
import { A as C } from "../../chunks/AnalysisViewModel.js";
import { g as p, a as d } from "../../chunks/measurementUtils.js";
import { hasValidAreaResult as L } from "@arcgis/core/applications/Components/analysisUtils.js";
/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.33/esri/copyright.txt for details.
v4.33.16 */
const P = A`@layer{arcgis-area-measurement-3d{display:block}.arcgis-area-measurement-3d{position:relative;padding:var(--esri-widget-padding);overflow-y:auto}}`;
var S = Object.defineProperty, E = Object.getOwnPropertyDescriptor, n = (e, t, s, a) => {
  for (var r = a > 1 ? void 0 : a ? E(t, s) : t, l = e.length - 1, u; l >= 0; l--)
    (u = e[l]) && (r = (a ? u(t, s, r) : u(r)) || r);
  return a && r && S(t, s, r), r;
};
let i = class extends C {
  constructor() {
    super(...arguments), this.supportedViewType = "3d", this.unsupportedErrorMessage = "The Area Measurement 3D component is only supported in 3D views.";
  }
  initialize() {
    this.addHandles(
      // Make sure the analysis and view model units are in sync.
      D(
        () => ({
          analysis: this.analysis,
          unit: this.unit
        }),
        ({ analysis: e, unit: t }) => {
          e != null && (e.unit = t);
        },
        { sync: !0, initial: !0 }
      )
    );
  }
  get state() {
    return this.disabled || !this.ready ? "disabled" : this.operationState === "inactive" ? this.analysis.valid ? "measured" : "ready" : "measuring";
  }
  get displayState() {
    if (!this.supported)
      return "unsupported";
    switch (this.state) {
      case "disabled":
      case "ready":
        return "ready";
      case "measuring":
        return this.analysis.geometry == null ? "measuring" : "measured";
      case "measured":
        return "measured";
    }
  }
  get measurement() {
    const { analysisView: e } = this, t = e?.result, s = t?.mode ?? "euclidean", a = e != null && L(e);
    return {
      mode: s,
      area: p(t?.area, a),
      perimeter: p(t?.perimeter, a)
    };
  }
  get unitOptions() {
    const e = this._userUnitOptions?.filter((t) => d.includes(t));
    return e && e.length > 0 ? e : d.slice();
  }
  set unitOptions(e) {
    this._userUnitOptions = e;
  }
  get unit() {
    const e = this._userUnit, t = this.unitOptions;
    if (e && t.includes(e))
      return e;
    const s = this.defaultUnit;
    return s && t.includes(s) ? s : t[0];
  }
  set unit(e) {
    this._userUnit = e;
  }
  get defaultUnit() {
    return this.view ? V(this.view) : void 0;
  }
  async place(e) {
    await this.analysisView?.place(e);
  }
  clearAnalysis() {
    this.analysis.geometry = null;
  }
  constructAnalysis() {
    return new U();
  }
};
n([
  o({ readOnly: !0 })
], i.prototype, "state", 1);
n([
  o({ readOnly: !0 })
], i.prototype, "displayState", 1);
n([
  o({ readOnly: !0 })
], i.prototype, "measurement", 1);
n([
  o()
], i.prototype, "unitOptions", 1);
n([
  o()
], i.prototype, "_userUnitOptions", 2);
n([
  o()
], i.prototype, "unit", 1);
n([
  o()
], i.prototype, "_userUnit", 2);
n([
  o({ readOnly: !0 })
], i.prototype, "defaultUnit", 1);
i = n([
  _("components.area-measurement-3d.AreaMeasurement3dViewModel")
], i);
const R = "arcgis-area-measurement-3d", x = { base: R }, T = $(i);
class j extends g {
  constructor() {
    super(...arguments), this.viewModel = T(this), this.messages = O({ blocking: !0 }), this.analysis = this.viewModel.analysis, this.autoDestroyDisabled = !1, this.icon = "measure-area", this.position = "bottom-left", this.state = this.viewModel.state, this.unit = this.viewModel.unit, this.unitOptions = this.viewModel.unitOptions, this.arcgisPropertyChange = M()("analysis", "state"), this.arcgisReady = f();
  }
  static {
    this.properties = { analysis: 0, autoDestroyDisabled: 5, icon: 3, label: 1, position: 1, referenceElement: 1, state: 35, unit: 1, unitOptions: 0 };
  }
  static {
    this.shadowRootOptions = w;
  }
  static {
    this.styles = P;
  }
  async clear() {
    this.viewModel.clear();
  }
  async destroy() {
    await this.manager.destroy();
  }
  async start() {
    this.viewModel.start();
  }
  render() {
    const { messages: t, unit: s, unitOptions: a, viewModel: r } = this, { measurement: l, state: u } = r;
    return y`<div aria-label=${t.componentLabel ?? v} class=${b({
      [x.base]: !0,
      [m.widget]: !0,
      [m.panel]: !0
    })} role=presentation><arcgis-measurement-content .state=${r.displayState} .hintLabel=${t.hint} .unsupportedLabel=${t.unsupported} .items=${[
      {
        title: t.area,
        measurement: l.area
      },
      {
        title: t.perimeterLength,
        measurement: l.perimeter
      }
    ]}><arcgis-unit-select slot=settings .options=${a} .selectLabel=${t.unit} .value=${s} @arcgisUnitSelectChange=${(c) => {
      this.unit = c.detail;
    }}></arcgis-unit-select><calcite-button slot=actions .disabled=${u === "disabled"} @click=${() => {
      this.viewModel.clear(), this.viewModel.start();
    }}>${t.newMeasurement}</calcite-button></arcgis-measurement-content></div>`;
  }
}
h("arcgis-area-measurement-3d", j);
export {
  j as ArcgisAreaMeasurement3d
};