import { c as l } from "../../chunks/runtime.js";
import { css as o, html as n } from "lit";
import c from "@arcgis/core/applications/Components/QuantityFormatter.js";
import { LitElement as v, createEvent as d } from "@arcgis/lumina";
/*! All material copyright Esri, All Rights Reserved, unless otherwise specified.
See https://js.arcgis.com/4.34/esri/copyright.txt for details.
v4.34.7 */
const p = o`:host{--internal-block-spacing: var(--calcite-spacing-sm-plus);--internal-inline-spacing: var(--calcite-spacing-md);--internal-columns: 1;--internal-icon-size: 16px;container-type:inline-size}.container{display:grid;isolation:isolate;grid-template-columns:repeat(var(--internal-columns, 1),1fr);gap:var(--calcite-spacing-xxs) var(--calcite-spacing-md)}.statistic{display:block;width:max-content;text-align:start;white-space:nowrap}.statistic-label,.statistic-value,.slope-values{font-size:var(--calcite-font-size-xs);font-weight:var(--calcite-font-weight-bold)}.statistic-label{font-weight:var(--calcite-font-weight-regular)}.statistic-value{margin-top:-.15em}.slope-values{display:flex;align-items:center;calcite-icon{width:var(--internal-icon-size);height:var(--internal-icon-size)}}@container (width > 200px){.container{--internal-columns: 2}}@container (width > 400px){.container{--internal-columns: 4}}@container (width > 800px){.container{--internal-columns: 8}}`;
class m extends v {
  constructor() {
    super(...arguments), this._formatter = new c(), this.arcgisExpandedToggle = d();
  }
  static {
    this.properties = { effectiveDisplayUnits: 0, messages: 0, result: 0 };
  }
  static {
    this.styles = p;
  }
  async destroy() {
    await this.manager.destroy();
  }
  async load() {
    await this._formatter.when();
  }
  render() {
    const t = this.messages?.statistics;
    if (t)
      return n`<div class="container">${this._renderDistance("maxDistance", t.maxDistance)}${this._renderElevation("elevationGain", t.gain)}${this._renderElevation("elevationLoss", t.loss)}${this._renderElevation("minElevation", t.minElevation)}${this._renderElevation("maxElevation", t.maxElevation)}${this._renderElevation("avgElevation", t.avgElevation)}${this._renderSlope("maxPositiveSlope", "maxNegativeSlope", t.maxSlope)}${this._renderSlope("avgPositiveSlope", "avgNegativeSlope", t.avgSlope)}</div>`;
  }
  _renderDistance(t, i) {
    const a = this._renderValue(t, (e) => {
      const s = this.effectiveDisplayUnits?.distance;
      return s ? this._formatter.formatLength({ type: "length", value: e, unit: s }, r) : "";
    });
    return this._renderStatistic(i, a);
  }
  _renderElevation(t, i) {
    const a = this._renderValue(t, (e) => {
      const s = this.effectiveDisplayUnits?.elevation;
      return s ? this._formatter.formatVerticalLength({ type: "length", value: e, unit: s }, r) : "";
    });
    return this._renderStatistic(i, a);
  }
  _renderSlope(t, i, a) {
    return this._renderStatistic(a, n`<div class="slope-values"><calcite-icon icon=arrow-up scale=s></calcite-icon>${this._renderValue(t, (e) => (
      // unitFormatUtils.formatAngleDegrees(v, "degrees", "geographic", "geographic", formatPrecision)
      e.toFixed(1)
    ))}<calcite-icon icon=arrow-down scale=s></calcite-icon>${this._renderValue(i, (e) => (
      // unitFormatUtils.formatAngleDegrees(v, "degrees", "geographic", "geographic", formatPrecision),
      e.toFixed(1)
    ))}</div>`);
  }
  _renderStatistic(t, i) {
    return n`<div class="statistic"><label class="statistic-label">${t}</label><div class="statistic-value">${i}</div></div>`;
  }
  _renderValue(t, i) {
    const { result: a } = this, e = a?.progress === 1 ? a.statistics?.[t] : void 0;
    return e == null ? " ― " : i(e);
  }
}
const r = 1;
l("arcgis-elevation-profile-statistics", m);
export {
  m as ArcgisElevationProfileStatistics
};
