"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const vue = require("vue");
const room = require("tuikit-atomicx-vue3/room");
const index_vue_vue_type_script_setup_true_lang = require("./ParticipantViewUI/index.vue.js");
const _sfc_main = /* @__PURE__ */ vue.defineComponent({
  __name: "index",
  props: {
    layoutTemplate: {}
  },
  emits: ["update:layoutTemplate"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emits = __emit;
    const { participantList, participantWithScreen } = room.useRoomParticipantState();
    vue.watch(participantWithScreen, (newVal, oldVal) => {
      if (newVal && !oldVal) {
        emits("update:layoutTemplate", room.RoomLayoutTemplate.SidebarLayout);
      }
    });
    vue.watch(
      () => participantList.value.length + (participantWithScreen.value ? 1 : 0),
      (val) => {
        if (val === 1 && props.layoutTemplate !== room.RoomLayoutTemplate.GridLayout) {
          emits("update:layoutTemplate", room.RoomLayoutTemplate.GridLayout);
        }
      }
    );
    return (_ctx, _cache) => {
      return vue.openBlock(), vue.createBlock(vue.unref(room.RoomView), { "layout-template": __props.layoutTemplate }, {
        participantViewUI: vue.withCtx(({ participant, streamType }) => [
          vue.createVNode(index_vue_vue_type_script_setup_true_lang.default, {
            participant,
            "stream-type": streamType
          }, null, 8, ["participant", "stream-type"])
        ]),
        _: 1
      }, 8, ["layout-template"]);
    };
  }
});
exports.default = _sfc_main;
