import { createApp } from "vue";
import { createEventBus } from "@grozav/utils";
import { InklineKey, InklineModalKey, IModalContainer, IconsPlugin } from "@inkline/inkline";
export const modalEventBus = createEventBus();
export const createModalService = () => ({
  show: (options) => {
    modalEventBus.emit("show", options);
  },
  hide: (options) => {
    modalEventBus.emit("hide", options);
  },
  hideAll: () => {
    modalEventBus.emit("hideAll", {});
  }
});
export const ModalPlugin = {
  install: (app, { inkline }) => {
    const modalService = createModalService();
    const modalApp = createApp(IModalContainer);
    modalApp.provide(InklineKey, inkline);
    modalApp.use(IconsPlugin);
    if (typeof window !== "undefined") {
      const containerId = "inkline-modal-container";
      let container = document.querySelector(`#${containerId}`);
      if (!container) {
        container = document.createElement("div");
        container.id = containerId;
        document.body.appendChild(container);
      }
      modalApp.mount(container);
    }
    app.config.globalProperties.$modal = modalService;
    app.provide(InklineModalKey, modalService);
  }
};
