<template>
  <SideLayout
    :visible="sidebarVisible"
    :applications="applications"
    :current-application-id="currentAppId"
    :conversations="conversations"
    :current-conversation-id="currentConversationId"
    :user-name="userName"
    :user-avatar-url="userAvatar"
    @select-application="handleSelectApp"
    @select-conversation="handleSelectConversation"
  />
</template>

<div id="containerId"></div>
<script>
ADPChatComponent.SideLayout.mount('#containerId', {
  visible: true,
  applications: [],
  currentApplicationId: '',
  conversations: [],
  currentConversationId: '',
  userName: 'Username',
  userAvatarUrl: '/avatar.png',
  onSelectApplication: (app) => {},
  onSelectConversation: (conversation) => {}
})
</script>