/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
import { c as l } from "../../chunks/runtime.js";
import { ref as c } from "lit/directives/ref.js";
import { css as r, html as i } from "lit";
import { LitElement as h, createEvent as p, nothing as a } from "@arcgis/lumina";
import { V as o } from "../../chunks/visible-element.js";
const d = r`:host{--arcgis-unit-select-inline-size: 180px}calcite-popover[calcite-hydrated-hidden]{inset-block-start:-999999px;inset-inline-start:-999999px}.popover-content{display:flex;flex-direction:column;gap:var(--calcite-spacing-md);padding:var(--calcite-spacing-md);max-width:300px}.uniform-chart-scaling-label{--calcite-label-margin-bottom: 0}.uniform-chart-scaling-checkbox-wrapper{width:var(--arcgis-unit-select-inline-size);flex-shrink:0}.slot-content{display:flex;flex-direction:column;gap:var(--calcite-spacing-sm)}.slot-content ::slotted(*){max-inline-size:100%}`;
class g extends h {
  constructor() {
    super(...arguments), this._onUniformChartScalingChange = (e) => {
      this.arcgisElevationProfileSettingsUniformChartScalingChange.emit(e.currentTarget.checked);
    }, this._onActionRef = (e) => {
      this._actionElement = e ?? void 0;
    }, this._popoverIsOpen = !1, this.hideDistanceDisplayUnitSelect = !1, this.hideElevationDisplayUnitSelect = !1, this.hideUniformChartScalingToggle = !1, this.hasCustomStartContent = !1, this.hasCustomEndContent = !1, this.arcgisElevationProfileSettingsUniformChartScalingChange = p();
  }
  static {
    this.properties = { _popoverIsOpen: 16, _actionElement: 16, viewModel: 0, hideDistanceDisplayUnitSelect: 5, hideElevationDisplayUnitSelect: 5, hideUniformChartScalingToggle: 5, hasCustomStartContent: 5, hasCustomEndContent: 5, messages: 0, uniformChartScaling: 5, unitOptionsDistance: 0, unitOptionsElevation: 0 };
  }
  static {
    this.styles = d;
  }
  async destroy() {
    await this.manager.destroy();
  }
  _onPopoverClose() {
    this._popoverIsOpen = !1;
  }
  _onPopoverOpen() {
    this._popoverIsOpen = !0;
  }
  render() {
    const { messages: e } = this;
    if (!e || !this.hasCustomStartContent && !this.hasCustomEndContent && this.hideDistanceDisplayUnitSelect && this.hideElevationDisplayUnitSelect && this.hideUniformChartScalingToggle)
      return;
    const t = (this._popoverIsOpen ? e.hideSettings : e.showSettings) ?? "";
    return i`<calcite-action icon=gear .text=${t} title=${t ?? a} ${c(this._onActionRef)}></calcite-action>${this._actionElement ? i`<calcite-popover auto-close .label=${t} placement=bottom-end .referenceElement=${this._actionElement} @calcitePopoverOpen=${this._onPopoverOpen} @calcitePopoverClose=${this._onPopoverClose}><div class="popover-content">${this._renderCustomContent("settings-start", this.hasCustomStartContent)}${this._renderUnitSelector()}${this._renderUniformChartScalingToggle()}${this._renderCustomContent("settings-end", this.hasCustomEndContent)}</div></calcite-popover>` : void 0}`;
  }
  _renderUnitSelector() {
    const { viewModel: e, messages: t } = this;
    if (!e || this.hideDistanceDisplayUnitSelect && this.hideElevationDisplayUnitSelect)
      return;
    const n = "inline-space-between";
    return i`${o({ hidden: this.hideDistanceDisplayUnitSelect, children: i`<arcgis-unit-select .options=${this.unitOptionsDistance} .selectLabel=${t.unitDistanceSelectLabel} .value=${e.distanceUnit} .layout=${n} @arcgisUnitSelectChange=${(s) => {
      e.distanceUnit = s.detail;
    }}></arcgis-unit-select>` })}${o({ hidden: this.hideElevationDisplayUnitSelect, children: i`<arcgis-unit-select .options=${this.unitOptionsElevation} .selectLabel=${t.unitElevationSelectLabel} .value=${e.elevationUnit} .layout=${n} @arcgisUnitSelectChange=${(s) => {
      e.elevationUnit = s.detail;
    }}></arcgis-unit-select>` })}`;
  }
  _renderUniformChartScalingToggle() {
    const { messages: e, hideUniformChartScalingToggle: t, uniformChartScaling: n } = this;
    if (t)
      return;
    const s = e?.[n ? "uniformChartScalingDisable" : "uniformChartScalingEnable"] ?? "";
    return i`<calcite-label class="uniform-chart-scaling-label" layout=inline-space-between>${e?.uniformChartScalingLabel}<div class="uniform-chart-scaling-checkbox-wrapper"><calcite-checkbox .checked=${n} title=${s ?? a} @calciteCheckboxChange=${this._onUniformChartScalingChange}></calcite-checkbox></div></calcite-label>`;
  }
  _renderCustomContent(e, t) {
    if (t)
      return i`<div class="slot-content"><slot name=${e ?? a}></slot></div>`;
  }
}
l("arcgis-elevation-profile-settings", g);
export {
  g as ArcgisElevationProfileSettings
};
