import { c as h } from "../../chunks/runtime.js";
import { html as f } from "lit-html";
import { classes as i } from "@arcgis/components-utils";
import { ignoreAbortErrors as l } from "@geoscene/core/core/promiseUtils.js";
import { when as m } from "@geoscene/core/core/reactiveUtils.js";
import { LitElement as y, createEvent as p, noShadowRoot as g, safeClassMap as r, nothing as u } from "@arcgis/lumina";
import { usePropertyChange as z } from "@arcgis/lumina/controllers";
import { u as b } from "../../chunks/useT9n.js";
import { u as O } from "../../chunks/useView.js";
import { css as Z } from "@lit/reactive-element/css-tag.js";
/*! All material copyright GeoScene, All Rights Reserved, unless otherwise specified.
See https://js.geoscene.cn/4.33/geoscene/copyright.txt for details.
v4.33.18 */
const a = {
  base: "geoscene-zoom",
  horizontalLayout: "geoscene-zoom--horizontal",
  button: "geoscene-widget--button",
  zoomIn: "geoscene-zoom__zoom-in",
  zoomOut: "geoscene-zoom__zoom-out"
};
function I(t) {
  if (t.type === "3d")
    return !!t.ready;
  if (!t?.ready)
    return !1;
  const e = d(t), s = t.constraints?.effectiveMaxScale;
  return s === 0 || e > s;
}
function w(t) {
  if (t.type === "3d")
    return !!t.ready;
  if (!t?.ready)
    return !1;
  const e = d(t), s = t.constraints?.effectiveMinScale;
  return s === 0 || e < s;
}
function d(t) {
  const o = t?.animation?.target;
  return (o && "then" in o ? void 0 : o?.scale) ?? t?.scale ?? 0;
}
const x = Z`@layer{geoscene-zoom,.geoscene-zoom{display:flex;flex-flow:column nowrap;box-shadow:0 1px 2px #0000004d}.geoscene-zoom__zoom-out{border-block-start:solid 1px var(--calcite-color-border-1)}.geoscene-zoom--horizontal{flex-flow:row-reverse nowrap}.geoscene-zoom--horizontal .geoscene-zoom__zoom-out{border-block-start:none;border-inline-end:solid 1px var(--calcite-color-border-1)}}`;
class $ extends y {
  constructor() {
    super(...arguments), this.messages = b({}), this.view = O(this), this.canZoomIn = !1, this.canZoomOut = !1, this.autoDestroyDisabled = !1, this.icon = "magnifying-glass-plus", this.layout = "vertical", this.position = "top-left", this.state = "disabled", this.geoscenePropertyChange = z()("state"), this.geosceneReady = p();
  }
  static {
    this.properties = { canZoomIn: 16, canZoomOut: 16, autoDestroyDisabled: 5, icon: 1, label: 1, layout: 3, messageOverrides: 0, position: 1, referenceElement: 1, state: 3 };
  }
  static {
    this.shadowRootOptions = g;
  }
  static {
    this.styles = x;
  }
  async destroy() {
    await this.manager.destroy();
  }
  async zoomIn() {
    const { view: o } = this;
    !this.canZoomIn || !o || (o.type === "2d" ? o.mapViewNavigation.zoomIn() : l(o.goTo({ zoomFactor: 2 })));
  }
  async zoomOut() {
    const { view: o } = this;
    !this.canZoomOut || !o || (o.type === "2d" ? o.mapViewNavigation.zoomOut() : l(o.goTo({ zoomFactor: 0.5 })));
  }
  loaded() {
    this.manager.onLifecycle(() => [
      m(() => this.view?.stationary, () => {
        this.canZoomIn = I(this.view), this.canZoomOut = w(this.view);
      }, { initial: !0 }),
      m(() => this.view?.ready ? "ready" : "disabled", (o) => {
        this.state = o;
      }, { sync: !0, initial: !0 })
    ]);
  }
  render() {
    const o = {
      [a.horizontalLayout]: this.layout === "horizontal"
    }, { canZoomIn: e, canZoomOut: s } = this, { zoomIn: n, zoomOut: c } = this.messages;
    return f`<div class=${r(i(a.base, o))}><calcite-button class=${r(i(a.button, a.zoomIn))} .disabled=${!e} icon-start=plus kind=neutral .label=${n} @click=${this.zoomIn} title=${n ?? u}></calcite-button><calcite-button class=${r(i(a.button, a.zoomOut))} .disabled=${!s} icon-start=minus kind=neutral .label=${c} @click=${this.zoomOut} title=${c ?? u}></calcite-button></div>`;
  }
}
h("geoscene-zoom", $);
export {
  $ as GeosceneZoom
};