/* COPYRIGHT Esri - https://js.arcgis.com/5.2/LICENSE.txt */
import { c as r } from "../../chunks/runtime.js";
import { getGoToDuration as n } from "@arcgis/core/applications/Components/navigationDuration.js";
import { watch as e } from "@arcgis/core/core/reactiveUtils.js";
import { LitElement as c, createEvent as l, nothing as o, safeClassMap as h, safeStyleMap as d } from "@arcgis/lumina";
import { usePropertyChange as u } from "@arcgis/lumina/controllers";
import { classes as m } from "@arcgis/toolkit/dom";
import { css as g, html as p } from "lit";
import { u as v } from "../../chunks/useT9n.js";
import { u as f } from "../../chunks/useView.js";
import { g as w } from "../../chunks/globalCss.js";
import { c as y } from "../../chunks/utils.js";
import { c as s } from "../../chunks/goTo.js";
const b = 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);calcite-button{--calcite-offset-invert-focus: 1}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{calcite-button{width:var(--calcite-spacing-xxxl);height:var(--calcite-spacing-xxxl)}}:host([visual-scale="l"]){calcite-button{width:calc(var(--calcite-spacing-xxxl) + var(--calcite-spacing-md));height:calc(var(--calcite-spacing-xxxl) + var(--calcite-spacing-md))}}:host([visual-scale="s"]){calcite-button{width:var(--calcite-spacing-xxl);height:var(--calcite-spacing-xxl)}}.root{border-radius:50%;box-shadow:var(--arcgis-internal-box-shadow, none)}.icon-container{justify-content:center;display:flex;position:absolute;transform:translate(-50%,-50%)}.icon-container:dir(rtl){transform:translate(50%,-50%)}`;
class x extends c {
  constructor() {
    super(...arguments), this._hasInitializedOrientation = !1, this._hasInitializedState = !1, this._lastState = "disabled", this.messages = v(), this._orientation = {
      x: 0,
      y: 0,
      z: 0
    }, this.view = f(this), this.autoDestroyDisabled = !1, this.visualScale = "m", this.arcgisPropertyChange = u()("state", "orientation"), this.arcgisReady = l();
  }
  static {
    this.properties = { _orientation: 16, view: 0, autoDestroyDisabled: 5, canShowNorth: 32, goToOverride: 0, icon: 3, label: 1, messageOverrides: 0, orientation: 32, referenceElement: 1, state: 32, visualScale: 3 };
  }
  static {
    this.styles = b;
  }
  get canShowNorth() {
    return y(this.view);
  }
  get icon() {
    return this._icon ?? (this.state === "rotation" ? "arrow-up" : "compass-needle");
  }
  set icon(t) {
    this._icon = t;
  }
  get orientation() {
    return this._orientation;
  }
  get state() {
    return !this.view?.ready || this.view.type === "2d" && !this.view.constraints.rotationEnabled ? "disabled" : this.canShowNorth ? "compass" : "rotation";
  }
  async destroy() {
    await this.manager.destroy();
  }
  async reset() {
    const { view: t } = this;
    t?.ready && (t?.type === "2d" ? s({
      target: { rotation: 0 },
      options: { animationMode: "always", duration: n() }
    }, t, this.goToOverride) : s({ target: { heading: 0 } }, t, this.goToOverride));
  }
  updated(t) {
    t.has("_orientation") && (this._hasInitializedOrientation ? this.arcgisPropertyChange.emit({ name: "orientation" }) : this._hasInitializedOrientation = !0);
    const i = this.state;
    this._hasInitializedState ? i !== this._lastState && this.arcgisPropertyChange.emit({ name: "state" }) : this._hasInitializedState = !0, this._lastState = i;
  }
  loaded() {
    if (!this.view) {
      this.manager.onLifecycle(() => [
        e(() => this.view?.ready, () => {
          this._watchRotationOrCamera();
        }, { once: !0 })
      ]);
      return;
    }
    this._watchRotationOrCamera();
  }
  _watchRotationOrCamera() {
    if (!this.view)
      return;
    const t = [];
    this.view.type === "2d" ? t.push(e(() => this.view?.rotation, (i) => this._updateForRotation(i), { initial: !0 })) : t.push(e(() => this.view?.camera, (i) => this._updateForCamera(i), { initial: !0 })), this.manager.onLifecycle(() => t);
  }
  _updateForRotation(t) {
    t != null && (this._orientation = {
      z: t
    });
  }
  _updateForCamera(t) {
    if (!t)
      return;
    const i = -t.heading;
    this._orientation = {
      x: 0,
      y: 0,
      z: i
    };
  }
  render() {
    const { messages: t, icon: i } = this;
    return p`<div class=${h(m("root", w.arcgisButton))}><calcite-button .disabled=${this.state === "disabled"} kind=neutral .label=${t.reset} @click=${this.reset} round .scale=${this.visualScale} title=${t.reset ?? o}><div aria-hidden=true class="icon-container" title=${t.reset ?? o}><calcite-icon .scale=${this.visualScale} .icon=${i} style=${d(_(this.orientation))}></calcite-icon></div></calcite-button></div>`;
  }
}
const _ = (a) => ({
  transform: `rotateZ(${a.z}deg)`
});
r("arcgis-compass", x);
export {
  x as ArcgisCompass
};
