/* COPYRIGHT Esri - https://js.arcgis.com/5.0/LICENSE.txt */
import { c as t } from "../../chunks/runtime.js";
import { css as i, html as s } from "lit";
import { createRef as l, ref as a } from "lit-html/directives/ref.js";
import { LitElement as n, createEvent as r } from "@arcgis/lumina";
import c from "@arcgis/core/widgets/Fullscreen";
import * as h from "@arcgis/core/core/reactiveUtils";
const d = i`:host{display:block}`;
class m extends n {
  constructor() {
    super(...arguments), this._fullscreenElement = l(), this.fullscreenStateChange = r();
  }
  static {
    this.properties = { mapView: 0, fullscreenWidget: 0 };
  }
  static {
    this.styles = d;
  }
  willUpdate(e) {
    e.has("mapView") && this.mapViewWatchHandler();
  }
  async mapViewWatchHandler() {
    await this.mapView?.when(async () => {
      await this._initFullscreenWidget();
    });
  }
  render() {
    return s`<div class="fullscreen-widget" ${a(this._fullscreenElement)}></div>`;
  }
  async updated() {
    this.hasUpdated || await this._initFullscreenWidget();
  }
  async loaded() {
    await this._initFullscreenWidget();
  }
  async _initFullscreenWidget() {
    this.mapView && this._fullscreenElement.value && !this.fullscreenWidget ? (this.fullscreenWidget = new c({
      view: this.mapView
    }), await this.fullscreenWidget?.when(() => {
      this._fullscreenStateChangeHandle && this._fullscreenStateChangeHandle.remove(), this._fullscreenStateChangeHandle = h?.watch(() => this.fullscreenWidget?.viewModel.state, (e) => e && this.fullscreenStateChange.emit(e));
    })) : this.fullscreenWidget && (this.fullscreenWidget.view = this.mapView);
  }
}
t("map-fullscreen", m);
export {
  m as MapFullscreen
};
