import { c as o } from "../../chunks/runtime.js";
import { html as p } from "lit-html";
import { watch as r } from "@geoscene/core/core/reactiveUtils.js";
import { LitElement as u, safeClassMap as l } from "@arcgis/lumina";
import { css as d } 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 m = d`.geoscene-print__scale-input-container{display:flex;align-items:center;padding-bottom:var(--calcite-spacing-md)}.geoscene-print__scale-input-container .geoscene-print__scale-input{flex-grow:1}`, c = "geoscene-print", n = {
  scaleInfoContainer: `${c}__scale-info-container`,
  scaleInputContainer: `${c}__scale-input-container`,
  scaleInput: `${c}__scale-input`
};
class b extends u {
  constructor() {
    super(...arguments), this._scale = 0, this._scaleEnabled = !1;
  }
  static {
    this.properties = { _scale: 16, _scaleEnabled: 16, viewModel: 0, messages: 0 };
  }
  static {
    this.styles = m;
  }
  loaded() {
    this.manager.onLifecycle(() => [
      r(() => [this.viewModel.templateOptions.scale, this.viewModel.templateOptions.scaleEnabled], () => {
        const { scale: e, scaleEnabled: t } = this.viewModel.templateOptions;
        this._scale = e, this._scaleEnabled = t;
      }, { initial: !0 }),
      r(() => this.viewModel.view?.scale, (e) => {
        e && (!this.viewModel.templateOptions.scaleEnabled || !this.viewModel.templateOptions.scale) && (this.viewModel.templateOptions.scale = e);
      }, { initial: !0 })
    ]);
  }
  _resetToCurrentScale() {
    this.viewModel.templateOptions.scale = this.viewModel.view?.scale;
  }
  render() {
    const { messages: e, _scale: t, _scaleEnabled: i } = this;
    return p`<div class=${l(n.scaleInfoContainer)}><calcite-label layout=inline><calcite-checkbox .checked=${i} @calciteCheckboxChange=${(a) => {
      this.viewModel.templateOptions.scaleEnabled = a.target.checked, this._resetToCurrentScale();
    }}></calcite-checkbox>${e.scale}</calcite-label><div class=${l(n.scaleInputContainer)}><calcite-input-number .ariaLabel=${e.scaleLabel} .ariaValueNow=${`${t}`} class=${l(n.scaleInput)} .disabled=${!i} .value=${`${t}`} .max=${Number.MAX_SAFE_INTEGER} @calciteInputNumberInput=${(a) => {
      const s = Number(a.target.value);
      if (Number.isNaN(s) || s < 0 || !Number.isFinite(s)) {
        a.target.value = `${t}`;
        return;
      }
      this.viewModel.templateOptions.scale = s;
    }}></calcite-input-number><calcite-button appearance=outline .ariaLabel=${e.reset} .disabled=${!i} icon-start=refresh kind=neutral @click=${() => this._resetToCurrentScale()}></calcite-button></div></div>`;
  }
}
o("geoscene-print-scale-section", b);
export {
  b as PrintScaleSection
};