/* COPYRIGHT Esri - https://js.arcgis.com/1.2/LICENSE.txt */
import { c as customElement } from "../../chunks/runtime.js";
import { css, html } from "lit";
import { createRef, ref } from "lit-html/directives/ref.js";
import { LitElement, createEvent } from "@arcgis/lumina";
import Fullscreen from "@arcgis/core/widgets/Fullscreen";
import * as reactiveUtils from "@arcgis/core/core/reactiveUtils";
const styles = css`/** @license
 * Copyright 2025 Esri
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *    http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

:host {
  display: block;
}`;
class MapFullscreen extends LitElement {
  constructor() {
    super(...arguments);
    this._fullscreenElement = createRef();
    this.fullscreenStateChange = createEvent();
  }
  static {
    this.properties = { mapView: [0, {}, { attribute: false }], fullscreenWidget: [0, {}, { attribute: false }] };
  }
  static {
    this.styles = styles;
  }
  willUpdate(changes) {
    if (changes.has("mapView")) {
      void this.mapViewWatchHandler();
    }
  }
  async mapViewWatchHandler() {
    await this.mapView?.when(async () => {
      await this._initFullscreenWidget();
    });
  }
  render() {
    return html`<div class="fullscreen-widget" ${ref(this._fullscreenElement)}></div>`;
  }
  async updated() {
    if (!this.hasUpdated) {
      await this._initFullscreenWidget();
    }
  }
  async loaded() {
    await this._initFullscreenWidget();
  }
  async _initFullscreenWidget() {
    if (this.mapView && this._fullscreenElement.value && !this.fullscreenWidget) {
      this.fullscreenWidget = new Fullscreen({
        view: this.mapView
      });
      await this.fullscreenWidget?.when(() => {
        if (this._fullscreenStateChangeHandle) {
          this._fullscreenStateChangeHandle.remove();
        }
        this._fullscreenStateChangeHandle = reactiveUtils?.watch(() => this.fullscreenWidget?.viewModel.state, (state) => state && this.fullscreenStateChange.emit(state));
      });
    } else if (this.fullscreenWidget) {
      this.fullscreenWidget.view = this.mapView;
    }
  }
}
customElement("map-fullscreen", MapFullscreen);
export {
  MapFullscreen
};
