import { defineComponent, defineAsyncComponent, onBeforeMount, onUnmounted, openBlock, createBlock, resolveDynamicComponent, unref, normalizeProps, guardReactiveProps, withCtx, createElementBlock, Fragment, renderList, renderSlot, mergeProps } from 'vue';
import { storeToRefs } from 'pinia';
import '../../../stores/index.mjs';
import '../../../utils/index.mjs';
import '../../../hooks/index.mjs';
import emitter from '../../../utils/mitt.mjs';
import { useThemeConfig } from '../../../stores/themeConfig.mjs';
import { provideFormEvents } from '../../../hooks/composables/useDialogEvents.mjs';
import { Local } from '../../../utils/storage.mjs';

var _sfc_main = /* @__PURE__ */ defineComponent({
  ...{
    name: "FLayout"
  },
  __name: "index",
  emits: ["layoutChangePassword", "layoutOnlineUsers", "layoutSearchMenu", "layoutSetBrowserTitle", "layoutSetOpenLink"],
  setup(__props, { emit: __emit }) {
    const layouts = {
      defaults: defineAsyncComponent(() => import('./main/defaults.vue.mjs')),
      classic: defineAsyncComponent(() => import('./main/classic.vue.mjs')),
      transverse: defineAsyncComponent(() => import('./main/transverse.vue.mjs')),
      columns: defineAsyncComponent(() => import('./main/columns.vue.mjs'))
    };
    const storesThemeConfig = useThemeConfig();
    const { themeConfig } = storeToRefs(storesThemeConfig);
    let maxClientWidth = document.body.clientWidth;
    const curMyEmit = __emit;
    provideFormEvents({
      onFormDialogOpen: (data) => {
        if (data.name == "changePassword") {
          curMyEmit("layoutChangePassword");
        } else if (data.name == "onlineUsers") {
          curMyEmit("layoutOnlineUsers");
        } else if (data.name == "searchFormMenu") {
          curMyEmit("layoutSearchMenu");
        } else if (data.name == "setFBrowserTitle") {
          curMyEmit("layoutSetBrowserTitle");
        } else if (data.name == "setFOpenLink") {
          curMyEmit("layoutSetOpenLink", data);
        }
      }
    });
    const onLayoutResize = () => {
      if (!Local.get("oldLayout")) Local.set("oldLayout", themeConfig.value.layout);
      const clientWidth = document.body.clientWidth;
      if (maxClientWidth > clientWidth) return;
      maxClientWidth = clientWidth;
      if (clientWidth < 1e3) {
        themeConfig.value.isCollapse = false;
        emitter.emit("layoutMobileResize", {
          layout: "defaults",
          clientWidth
        });
      } else {
        emitter.emit("layoutMobileResize", {
          layout: Local.get("oldLayout") ? Local.get("oldLayout") : themeConfig.value.layout,
          clientWidth
        });
      }
    };
    onBeforeMount(() => {
      onLayoutResize();
      window.addEventListener("resize", onLayoutResize);
    });
    onUnmounted(() => {
      window.removeEventListener("resize", onLayoutResize);
    });
    return (_ctx, _cache) => {
      return openBlock(), createBlock(
        resolveDynamicComponent(layouts[unref(themeConfig).layout]),
        normalizeProps(guardReactiveProps(_ctx.$attrs)),
        {
          default: withCtx(() => [
            (openBlock(true), createElementBlock(
              Fragment,
              null,
              renderList(_ctx.$slots, (_, name) => {
                return renderSlot(_ctx.$slots, name, mergeProps({
                  key: name,
                  ref_for: true
                }, _ctx.$slots[name].props || {}));
              }),
              128
              /* KEYED_FRAGMENT */
            ))
          ]),
          _: 3
          /* FORWARDED */
        },
        16
        /* FULL_PROPS */
      );
    };
  }
});

export { _sfc_main as default };
