atomicx-core sdk API 文档

atomicx-core sdk

atomicx-core sdk 是腾讯云最新推出的面向即时通信、音视频通话、视频直播、语聊房等场景的全新一代基于响应式的 API，您可以非常快速的在基于这组 API 构建自己的 UI 页面，它支持房间管理、屏幕分享、成员管理、麦位控制、基础美颜等丰富功能，同时确保720P和1080P高清画质，在70%丢包率的弱网环境下仍能保持高质量音视频传输。此外，SDK 采用48kHz高音质采样，结合腾讯天籁实验室的3A处理算法，消除回声和啸叫，实现全链路128kbps高音质立体声，为用户带来清晰沉浸的互动体验，本页面包含 atomicx-core sdk 的所有API接口，按功能模块分类展示。

LoginState

import { useLoginState } from 'tuikit-atomicx-vue3';
const { loginUserInfo } = useLoginState();

// 监听用户信息变化
watch(loginUserInfo, (newUserInfo) => {
  if (newUserInfo) {
    console.log('用户信息更新:', newUserInfo);
    console.log('用户ID:', newUserInfo.userID);
    console.log('用户昵称:', newUserInfo.nickname);
    console.log('用户头像:', newUserInfo.avatarURL);
  }
});

// 获取当前用户信息
const currentUser = loginUserInfo.value;
if (currentUser) {
  console.log('当前登录用户:', currentUser.nickname);
}

import { useLoginState } from 'tuikit-atomicx-vue3';

const { login } = useLoginState();

// 登录系统
await login({
  userId: 'user_123456',
  userSig: 'xxx',
  sdkAppId: 1400000001
});

import { useLoginState } from 'tuikit-atomicx-vue3';

const { setSelfInfo } = useLoginState();

// 设置用户个人信息
await setSelfInfo({
  nickName: '小明',
  avatar: 'https://example.com/avatar.png',
  signature: '这是我的个性签名'
});

await logout();

DeviceState

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { microphoneStatus } = useDeviceState();

// 监听数据变化
watch(microphoneStatus, (newValue) => {
  console.log('microphoneStatus 更新:', newValue);
});

// 直接访问数据
console.log('当前 microphoneStatus:', microphoneStatus.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { microphoneList } = useDeviceState();

// 监听数据变化
watch(microphoneList, (newValue) => {
  console.log('microphoneList 更新:', newValue);
});

// 直接访问数据
console.log('当前 microphoneList:', microphoneList.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { currentMicrophone } = useDeviceState();

// 监听数据变化
watch(currentMicrophone, (newValue) => {
  console.log('currentMicrophone 更新:', newValue);
});

// 直接访问数据
console.log('当前 currentMicrophone:', currentMicrophone.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { microphoneLastError } = useDeviceState();

// 监听数据变化
watch(microphoneLastError, (newValue) => {
  console.log('microphoneLastError 更新:', newValue);
});

// 直接访问数据
console.log('当前 microphoneLastError:', microphoneLastError.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { captureVolume } = useDeviceState();

// 监听数据变化
watch(captureVolume, (newValue) => {
  console.log('captureVolume 更新:', newValue);
});

// 直接访问数据
console.log('当前 captureVolume:', captureVolume.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { currentMicVolume } = useDeviceState();

// 监听数据变化
watch(currentMicVolume, (newValue) => {
  console.log('currentMicVolume 更新:', newValue);
});

// 直接访问数据
console.log('当前 currentMicVolume:', currentMicVolume.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { isMicrophoneTesting } = useDeviceState();

// 监听数据变化
watch(isMicrophoneTesting, (newValue) => {
  console.log('isMicrophoneTesting 更新:', newValue);
});

// 直接访问数据
console.log('当前 isMicrophoneTesting:', isMicrophoneTesting.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { testingMicVolume } = useDeviceState();

// 监听数据变化
watch(testingMicVolume, (newValue) => {
  console.log('testingMicVolume 更新:', newValue);
});

// 直接访问数据
console.log('当前 testingMicVolume:', testingMicVolume.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { cameraStatus } = useDeviceState();

// 监听数据变化
watch(cameraStatus, (newValue) => {
  console.log('cameraStatus 更新:', newValue);
});

// 直接访问数据
console.log('当前 cameraStatus:', cameraStatus.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { cameraList } = useDeviceState();

// 监听数据变化
watch(cameraList, (newValue) => {
  console.log('cameraList 更新:', newValue);
});

// 直接访问数据
console.log('当前 cameraList:', cameraList.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { currentCamera } = useDeviceState();

// 监听数据变化
watch(currentCamera, (newValue) => {
  console.log('currentCamera 更新:', newValue);
});

// 直接访问数据
console.log('当前 currentCamera:', currentCamera.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { cameraLastError } = useDeviceState();

// 监听数据变化
watch(cameraLastError, (newValue) => {
  console.log('cameraLastError 更新:', newValue);
});

// 直接访问数据
console.log('当前 cameraLastError:', cameraLastError.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { isCameraTesting } = useDeviceState();

// 监听数据变化
watch(isCameraTesting, (newValue) => {
  console.log('isCameraTesting 更新:', newValue);
});

// 直接访问数据
console.log('当前 isCameraTesting:', isCameraTesting.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { isCameraTestLoading } = useDeviceState();

// 监听数据变化
watch(isCameraTestLoading, (newValue) => {
  console.log('isCameraTestLoading 更新:', newValue);
});

// 直接访问数据
console.log('当前 isCameraTestLoading:', isCameraTestLoading.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { isFrontCamera } = useDeviceState();

// 监听数据变化
watch(isFrontCamera, (newValue) => {
  console.log('isFrontCamera 更新:', newValue);
});

// 直接访问数据
console.log('当前 isFrontCamera:', isFrontCamera.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { localMirrorType } = useDeviceState();

// 监听数据变化
watch(localMirrorType, (newValue) => {
  console.log('localMirrorType 更新:', newValue);
});

// 直接访问数据
console.log('当前 localMirrorType:', localMirrorType.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { localVideoQuality } = useDeviceState();

// 监听数据变化
watch(localVideoQuality, (newValue) => {
  console.log('localVideoQuality 更新:', newValue);
});

// 直接访问数据
console.log('当前 localVideoQuality:', localVideoQuality.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { speakerList } = useDeviceState();

// 监听数据变化
watch(speakerList, (newValue) => {
  console.log('speakerList 更新:', newValue);
});

// 直接访问数据
console.log('当前 speakerList:', speakerList.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { currentSpeaker } = useDeviceState();

// 监听数据变化
watch(currentSpeaker, (newValue) => {
  console.log('currentSpeaker 更新:', newValue);
});

// 直接访问数据
console.log('当前 currentSpeaker:', currentSpeaker.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { outputVolume } = useDeviceState();

// 监听数据变化
watch(outputVolume, (newValue) => {
  console.log('outputVolume 更新:', newValue);
});

// 直接访问数据
console.log('当前 outputVolume:', outputVolume.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { currentAudioRoute } = useDeviceState();

// 监听数据变化
watch(currentAudioRoute, (newValue) => {
  console.log('currentAudioRoute 更新:', newValue);
});

// 直接访问数据
console.log('当前 currentAudioRoute:', currentAudioRoute.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { isSpeakerTesting } = useDeviceState();

// 监听数据变化
watch(isSpeakerTesting, (newValue) => {
  console.log('isSpeakerTesting 更新:', newValue);
});

// 直接访问数据
console.log('当前 isSpeakerTesting:', isSpeakerTesting.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { screenStatus } = useDeviceState();

// 监听数据变化
watch(screenStatus, (newValue) => {
  console.log('screenStatus 更新:', newValue);
});

// 直接访问数据
console.log('当前 screenStatus:', screenStatus.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { networkInfo } = useDeviceState();

// 监听数据变化
watch(networkInfo, (newValue) => {
  console.log('networkInfo 更新:', newValue);
});

// 直接访问数据
console.log('当前 networkInfo:', networkInfo.value);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { openLocalMicrophone } = useDeviceState();

// 开启麦克风
try {
  await openLocalMicrophone();
  console.log('麦克风开启成功');
} catch (error) {
  console.error('麦克风开启失败:', error);
}

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { closeLocalMicrophone } = useDeviceState();

// 关闭麦克风
await closeLocalMicrophone();

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { muteLocalAudio } = useDeviceState();

// 静音本地音频
await muteLocalAudio();

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { unmuteLocalAudio } = useDeviceState();

// 取消静音本地音频
await unmuteLocalAudio();

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { getMicrophoneList, microphoneList } = useDeviceState();

// 获取麦克风列表
try {
  await getMicrophoneList();
  console.log('麦克风列表:', microphoneList.value);
} catch (error) {
  console.error('获取麦克风列表失败:', error);
}

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { setCurrentMicrophone } = useDeviceState();

// 切换麦克风设备
await setCurrentMicrophone({
  deviceId: 'default'
});

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { startMicrophoneTest } = useDeviceState();

// 开始麦克风测试，每200ms检测一次音量
await startMicrophoneTest({
  interval: 200
});

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { setCaptureVolume } = useDeviceState();

// 设置采集音量为80%
await setCaptureVolume(80);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { setOutputVolume } = useDeviceState();

// 设置播放音量为60%
await setOutputVolume(60);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { stopMicrophoneTest } = useDeviceState();

// 停止麦克风测试
await stopMicrophoneTest();

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { getSpeakerList, speakerList } = useDeviceState();

// 获取扬声器列表
try {
  await getSpeakerList();
  console.log('扬声器列表:', speakerList.value);
} catch (error) {
  console.error('获取扬声器列表失败:', error);
}

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { setCurrentSpeaker } = useDeviceState();

// 切换扬声器设备
await setCurrentSpeaker({
  deviceId: 'default'
});

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { setAudioRoute } = useDeviceState();

// 设置为扬声器模式
await setAudioRoute(AudioRoute.Speakerphone);

// 设置为听筒模式
await setAudioRoute(AudioRoute.Earpiece);

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { startSpeakerTest } = useDeviceState();

// 播放测试音频进行扬声器测试
await startSpeakerTest({
  filePath: '/assets/audio/test.mp3'
});

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { stopSpeakerTest } = useDeviceState();

// 停止扬声器测试
await stopSpeakerTest();

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { openLocalCamera } = useDeviceState();

// 开启摄像头
try {
  await openLocalCamera();
  console.log('摄像头开启成功');
} catch (error) {
  console.error('摄像头开启失败:', error);
}

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { closeLocalCamera } = useDeviceState();

// 关闭摄像头
await closeLocalCamera();

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { getCameraList, cameraList } = useDeviceState();

// 获取摄像头列表
try {
  await getCameraList();
  console.log('摄像头列表:', cameraList.value);
} catch (error) {
  console.error('获取摄像头列表失败:', error);
}

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { setCurrentCamera } = useDeviceState();

// 切换摄像头设备
await setCurrentCamera({
  deviceId: 'default'
});

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { switchCamera } = useDeviceState();

// 切换到前置摄像头
await switchCamera({
  isFrontCamera: true
});

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { switchMirror } = useDeviceState();

// 设置视频镜像模式
await switchMirror({
  mirror: MirrorType.Enable
});

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { updateVideoQuality } = useDeviceState();

// 设置视频质量为高清720P
await updateVideoQuality({
  quality: VideoQuality.HD720P
});

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { startCameraDeviceTest } = useDeviceState();

// 在指定DOM元素中预览摄像头
await startCameraDeviceTest({
  view: 'camera-preview-container'
});

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { startScreenShare } = useDeviceState();

// 开始屏幕分享，包含系统音频
await startScreenShare({
  screenAudio: true,
  view: 'screen-share-container'
});

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { stopScreenShare } = useDeviceState();

// 停止屏幕分享
await stopScreenShare();

import { useDeviceState } from 'tuikit-atomicx-vue3';

const { stopCameraDeviceTest } = useDeviceState();

// 停止摄像头测试
await stopCameraDeviceTest();

// 内部使用，当屏幕分享停止时自动调用
screenCaptureStopped();

LiveListState

const tuiLiveInfo = await roomEngine.getLiveInfo();
const liveInfo = getLiveInfo(tuiLiveInfo);
console.log('转换后的直播信息:', liveInfo);

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { liveList } = useLiveListState();

// 监听数据变化
watch(liveList, (newValue) => {
  console.log('liveList 更新:', newValue);
});

// 直接访问数据
console.log('当前 liveList:', liveList.value);

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { liveListCursor } = useLiveListState();

// 监听数据变化
watch(liveListCursor, (newValue) => {
  console.log('liveListCursor 更新:', newValue);
});

// 直接访问数据
console.log('当前 liveListCursor:', liveListCursor.value);

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { createLive } = useLiveListState();

// Create a live room with custom settings
await createLive({
  name: 'My Live Room',
  coverUrl: 'https://example.com/cover.jpg',
  backgroundUrl: 'https://example.com/bg.jpg',
  seatMode: 'free'
});

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { joinLive } = useLiveListState();

// Join a live room by ID
await joinLive({
  liveId: 'live_room_123456'
});

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { leaveLive } = useLiveListState();

// 离开直播间
try {
  await leaveLive();
  console.log('成功离开直播间');
} catch (error) {
  console.error('离开直播间失败:', error);
}

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { endLive } = useLiveListState();

// 结束直播（主播操作）
try {
  await endLive();
  console.log('直播已结束');
} catch (error) {
  console.error('结束直播失败:', error);
}

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { updateLiveInfo } = useLiveListState();

// Update live room info
await updateLiveInfo({
  coverUrl: 'https://example.com/new-cover.jpg',
  category: 'entertainment'
});

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { queryMetaData } = useLiveListState();

// Query metadata by keys
await queryMetaData({
  keys: ['roomTitle', 'announcement', 'customData']
});

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { updateLiveMetaData } = useLiveListState();

// Update live room metadata
await updateLiveMetaData({
  metaData: {
    roomTitle: 'New Room Title',
    announcement: 'Welcome to my live room!'
  }
});

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { fetchLiveList } = useLiveListState();

// Fetch live list with pagination
await fetchLiveList({
  cursor: '',
  count: 20
});

LiveSeatState

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { seatList } = useLiveSeatState();

// 监听数据变化
watch(seatList, (newValue) => {
  console.log('seatList 更新:', newValue);
});

// 直接访问数据
console.log('当前 seatList:', seatList.value);

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { canvas } = useLiveSeatState();

// 监听数据变化
watch(canvas, (newValue) => {
  console.log('canvas 更新:', newValue);
});

// 直接访问数据
console.log('当前 canvas:', canvas.value);

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { speakingUsers } = useLiveSeatState();

// 监听数据变化
watch(speakingUsers, (newValue) => {
  console.log('speakingUsers 更新:', newValue);
});

// 直接访问数据
console.log('当前 speakingUsers:', speakingUsers.value);

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { networkQualities } = useLiveSeatState();

// 监听数据变化
watch(networkQualities, (newValue) => {
  console.log('networkQualities 更新:', newValue);
});

// 直接访问数据
console.log('当前 networkQualities:', networkQualities.value);

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { takeSeat } = useLiveSeatState();

// Take seat at index 1
await takeSeat({
  seatIndex: 1
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { leaveSeat } = useLiveSeatState();

// Leave seat at index 1
await leaveSeat({
  seatIndex: 1
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { lockSeat } = useLiveSeatState();

// Lock seat at index 2
await lockSeat({
  seatIndex: 2
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { unLockSeat } = useLiveSeatState();

// Unlock seat at index 2
await unLockSeat({
  seatIndex: 2
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { kickUserOutOfSeat } = useLiveSeatState();

// Kick user out of seat
await kickUserOutOfSeat({
  seatIndex: 1,
  userId: 'user_123'
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { moveUserToSeat } = useLiveSeatState();

// Move user to target seat
await moveUserToSeat({
  userId: 'user_123',
  targetSeatIndex: 3
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { openRemoteCamera } = useLiveSeatState();

// Open remote user's camera
await openRemoteCamera({
  userId: 'user_123'
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { closeRemoteCamera } = useLiveSeatState();

// Close remote user's camera
await closeRemoteCamera({
  userId: 'user_123'
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { openRemoteMicrophone } = useLiveSeatState();

// Open remote user's microphone
await openRemoteMicrophone({
  userId: 'user_123'
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { closeRemoteMicrophone } = useLiveSeatState();

// Close remote user's microphone
await closeRemoteMicrophone({
  userId: 'user_123'
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { muteMicrophone } = useLiveSeatState();

// Mute user's microphone
await muteMicrophone({
  userId: 'user_123'
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { unmuteMicrophone } = useLiveSeatState();

// Unmute user's microphone
await unmuteMicrophone({
  userId: 'user_123'
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { startPlayStream } = useLiveSeatState();

// Start playing user's stream
await startPlayStream({
  userId: 'user_123',
  streamType: 0
});

import { useLiveSeatState } from 'tuikit-atomicx-vue3';

const { stopPlayStream } = useLiveSeatState();

// Stop playing user's stream
await stopPlayStream({
  userId: 'user_123',
  streamType: 0
});

LiveAudienceState

import { useLiveAudienceState } from 'tuikit-atomicx-vue3';

const { audienceList } = useLiveAudienceState();

// 监听数据变化
watch(audienceList, (newValue) => {
  console.log('audienceList 更新:', newValue);
});

// 直接访问数据
console.log('当前 audienceList:', audienceList.value);

import { useLiveAudienceState } from 'tuikit-atomicx-vue3';

const { audienceCount } = useLiveAudienceState();

// 监听数据变化
watch(audienceCount, (newValue) => {
  console.log('audienceCount 更新:', newValue);
});

// 直接访问数据
console.log('当前 audienceCount:', audienceCount.value);

import { useLiveAudienceState } from 'tuikit-atomicx-vue3';

const { fetchAudienceList } = useLiveAudienceState();

// Fetch audience list with pagination
await fetchAudienceList({
  cursor: '',
  count: 50
});

import { useLiveAudienceState } from 'tuikit-atomicx-vue3';

const { setAdministrator } = useLiveAudienceState();

// Set user as administrator
await setAdministrator({
  userId: 'user_123'
});

import { useLiveAudienceState } from 'tuikit-atomicx-vue3';

const { revokeAdministrator } = useLiveAudienceState();

// Revoke administrator privileges
await revokeAdministrator({
  userId: 'user_123'
});

import { useLiveAudienceState } from 'tuikit-atomicx-vue3';

const { kickUserOutOfRoom } = useLiveAudienceState();

// Kick user out of room
await kickUserOutOfRoom({
  userId: 'user_123'
});

import { useLiveAudienceState } from 'tuikit-atomicx-vue3';

const { disableSendMessage } = useLiveAudienceState();

// Disable user from sending messages for 10 minutes
await disableSendMessage({
  userId: 'user_123',
  duration: 600
});

LiveMonitorState

import { useLiveMonitorState } from 'tuikit-atomicx-vue3';

const { monitorLiveInfoList } = useLiveMonitorState();

// 监听数据变化
watch(monitorLiveInfoList, (newValue) => {
  console.log('monitorLiveInfoList 更新:', newValue);
});

// 直接访问数据
console.log('当前 monitorLiveInfoList:', monitorLiveInfoList.value);

import { useLiveMonitorState } from 'tuikit-atomicx-vue3';

const { init } = useLiveMonitorState();

// Initialize live monitor service
await init({
  sdkAppId: 1400000001,
  userId: 'admin_user',
  userSig: 'eJyrVgrxCdYrSy1SslIy0jNQ0gHzM1NS...'
});

import { useLiveMonitorState } from 'tuikit-atomicx-vue3';

const { getLiveList } = useLiveMonitorState();

// Get live list with pagination
await getLiveList({
  cursor: '',
  count: 20
});

import { useLiveMonitorState } from 'tuikit-atomicx-vue3';

const { closeRoom } = useLiveMonitorState();

// Close a live room
await closeRoom({
  roomId: 'room_123456'
});

import { useLiveMonitorState } from 'tuikit-atomicx-vue3';

const { sendMessage } = useLiveMonitorState();

// Send a text message
await sendMessage({
  content: 'Hello everyone!',
  type: 'text'
});

import { useLiveMonitorState } from 'tuikit-atomicx-vue3';

const { startPlay } = useLiveMonitorState();

// Start playing a live stream
await startPlay({
  roomId: 'room_123456',
  userId: 'host_user'
});

import { useLiveMonitorState } from 'tuikit-atomicx-vue3';

const { stopPlay } = useLiveMonitorState();

// Stop playing a live stream
await stopPlay({
  roomId: 'room_123456',
  userId: 'host_user'
});

import { useLiveMonitorState } from 'tuikit-atomicx-vue3';

const { muteLiveAudio } = useLiveMonitorState();

// Mute live audio
await muteLiveAudio({
  roomId: 'room_123456',
  userId: 'host_user',
  isMuted: true
});

CoGuestState

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { candidates } = useCoGuestState();

// 监听数据变化
watch(candidates, (newValue) => {
  console.log('candidates 更新:', newValue);
});

// 直接访问数据
console.log('当前 candidates:', candidates.value);

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { connected } = useCoGuestState();

// 监听数据变化
watch(connected, (newValue) => {
  console.log('connected 更新:', newValue);
});

// 直接访问数据
console.log('当前 connected:', connected.value);

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { invitees } = useCoGuestState();

// 监听数据变化
watch(invitees, (newValue) => {
  console.log('invitees 更新:', newValue);
});

// 直接访问数据
console.log('当前 invitees:', invitees.value);

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { applicants } = useCoGuestState();

// 监听数据变化
watch(applicants, (newValue) => {
  console.log('applicants 更新:', newValue);
});

// 直接访问数据
console.log('当前 applicants:', applicants.value);

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { cancelApplication } = useCoGuestState();

// Cancel co-guest application
await cancelApplication({
  requestId: 'req_123456'
});

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { acceptApplication } = useCoGuestState();

// Accept co-guest application
await acceptApplication({
  requestId: 'req_123456'
});

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { rejectApplication } = useCoGuestState();

// Reject co-guest application
await rejectApplication({
  requestId: 'req_123456'
});

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { cancelInvitation } = useCoGuestState();

// Cancel co-guest invitation
await cancelInvitation({
  requestId: 'req_123456'
});

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { acceptInvitation } = useCoGuestState();

// Accept co-guest invitation
await acceptInvitation({
  requestId: 'req_123456'
});

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { rejectInvitation } = useCoGuestState();

// Reject co-guest invitation
await rejectInvitation({
  requestId: 'req_123456'
});

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { disConnect } = useCoGuestState();

// Disconnect co-guest connection
await disConnect({
  userId: 'user_123'
});

import { useCoGuestState } from 'tuikit-atomicx-vue3';

const { applyForSeat } = useCoGuestState();

// Apply for a seat with 60 seconds timeout
await applyForSeat({
  seatIndex: 1,
  timeout: 60
});

CoHostState

import { useCoHostState } from 'tuikit-atomicx-vue3';

const { coHostStatus } = useCoHostState();

// 监听数据变化
watch(coHostStatus, (newValue) => {
  console.log('coHostStatus 更新:', newValue);
});

// 直接访问数据
console.log('当前 coHostStatus:', coHostStatus.value);

import { useCoHostState } from 'tuikit-atomicx-vue3';

const { connected } = useCoHostState();

// 监听数据变化
watch(connected, (newValue) => {
  console.log('connected 更新:', newValue);
});

// 直接访问数据
console.log('当前 connected:', connected.value);

import { useCoHostState } from 'tuikit-atomicx-vue3';

const { applicant } = useCoHostState();

// 监听数据变化
watch(applicant, (newValue) => {
  console.log('applicant 更新:', newValue);
});

// 直接访问数据
console.log('当前 applicant:', applicant.value);

import { useCoHostState } from 'tuikit-atomicx-vue3';

const { invitees } = useCoHostState();

// 监听数据变化
watch(invitees, (newValue) => {
  console.log('invitees 更新:', newValue);
});

// 直接访问数据
console.log('当前 invitees:', invitees.value);

import { useCoHostState } from 'tuikit-atomicx-vue3';

const { candidates } = useCoHostState();

// 监听数据变化
watch(candidates, (newValue) => {
  console.log('candidates 更新:', newValue);
});

// 直接访问数据
console.log('当前 candidates:', candidates.value);

import { useCoHostState } from 'tuikit-atomicx-vue3';

const { requestHostConnection } = useCoHostState();

// Request host connection with 60 seconds timeout
await requestHostConnection({
  targetUserId: 'host_123',
  timeout: 60
});

import { useCoHostState } from 'tuikit-atomicx-vue3';

const { cancelHostConnection } = useCoHostState();

// Cancel host connection request
await cancelHostConnection({
  targetUserId: 'host_123'
});

import { useCoHostState } from 'tuikit-atomicx-vue3';

const { acceptHostConnection } = useCoHostState();

// Accept host connection request
await acceptHostConnection({
  targetUserId: 'host_123'
});

import { useCoHostState } from 'tuikit-atomicx-vue3';

const { rejectHostConnection } = useCoHostState();

// Reject host connection request
await rejectHostConnection({
  targetUserId: 'host_123'
});

import { useCoHostState } from 'tuikit-atomicx-vue3';

const { exitHostConnection } = useCoHostState();

// Exit host connection
await exitHostConnection({
  targetUserId: 'host_123'
});

BattleState

import { useBattleState } from 'tuikit-atomicx-vue3';

const { currentBattleInfo } = useBattleState();

// 监听数据变化
watch(currentBattleInfo, (newValue) => {
  console.log('currentBattleInfo 更新:', newValue);
});

// 直接访问数据
console.log('当前 currentBattleInfo:', currentBattleInfo.value);

import { useBattleState } from 'tuikit-atomicx-vue3';

const { battleUsers } = useBattleState();

// 监听数据变化
watch(battleUsers, (newValue) => {
  console.log('battleUsers 更新:', newValue);
});

// 直接访问数据
console.log('当前 battleUsers:', battleUsers.value);

import { useBattleState } from 'tuikit-atomicx-vue3';

const { battleScore } = useBattleState();

// 监听数据变化
watch(battleScore, (newValue) => {
  console.log('battleScore 更新:', newValue);
});

// 直接访问数据
console.log('当前 battleScore:', battleScore.value);

import { useBattleState } from 'tuikit-atomicx-vue3';

const { requestBattle } = useBattleState();

// Request battle with 5 minutes duration
await requestBattle({
  targetUserId: 'host_123',
  duration: 300
});

import { useBattleState } from 'tuikit-atomicx-vue3';

const { cancelBattleRequest } = useBattleState();

// Cancel battle request
await cancelBattleRequest({
  targetUserId: 'host_123'
});

import { useBattleState } from 'tuikit-atomicx-vue3';

const { acceptBattle } = useBattleState();

// Accept battle request
await acceptBattle({
  targetUserId: 'host_123'
});

import { useBattleState } from 'tuikit-atomicx-vue3';

const { rejectBattle } = useBattleState();

// Reject battle request
await rejectBattle({
  targetUserId: 'host_123'
});

import { useBattleState } from 'tuikit-atomicx-vue3';

const { exitBattle } = useBattleState();

// Exit battle
await exitBattle({
  targetUserId: 'host_123'
});

BarrageState

import { useBarrageState } from 'tuikit-atomicx-vue3';

const { messageList } = useBarrageState();

// 监听数据变化
watch(messageList, (newValue) => {
  console.log('messageList 更新:', newValue);
});

// 直接访问数据
console.log('当前 messageList:', messageList.value);

import { useBarrageState } from 'tuikit-atomicx-vue3';

const { sendTextMessage } = useBarrageState();

// Send text barrage message
await sendTextMessage({
  text: 'Great live stream!',
  receiverList: []
});

import { useBarrageState } from 'tuikit-atomicx-vue3';

const { sendCustomMessage } = useBarrageState();

// Send custom barrage message (e.g., gift)
await sendCustomMessage({
  data: JSON.stringify({ type: 'gift', giftId: 'rocket', count: 1 }),
  receiverList: []
});

import { useBarrageState } from 'tuikit-atomicx-vue3';

const { appendLocalTip } = useBarrageState();

// Append local tip message
await appendLocalTip({
  message: 'Welcome to the live room!',
  type: 'info'
});

MessageListState

import { useMessageListState } from 'tuikit-atomicx-vue3';

const { activeConversationID } = useMessageListState();

// 监听数据变化
watch(activeConversationID, (newValue) => {
  console.log('activeConversationID 更新:', newValue);
});

// 直接访问数据
console.log('当前 activeConversationID:', activeConversationID.value);

import { useMessageListState } from 'tuikit-atomicx-vue3';

const { messageList } = useMessageListState();

// 监听数据变化
watch(messageList, (newValue) => {
  console.log('messageList 更新:', newValue);
});

// 直接访问数据
console.log('当前 messageList:', messageList.value);

import { useMessageListState } from 'tuikit-atomicx-vue3';

const { hasMoreOlderMessage } = useMessageListState();

// 监听数据变化
watch(hasMoreOlderMessage, (newValue) => {
  console.log('hasMoreOlderMessage 更新:', newValue);
});

// 直接访问数据
console.log('当前 hasMoreOlderMessage:', hasMoreOlderMessage.value);

import { useMessageListState } from 'tuikit-atomicx-vue3';

const { hasMoreNewerMessage } = useMessageListState();

// 监听数据变化
watch(hasMoreNewerMessage, (newValue) => {
  console.log('hasMoreNewerMessage 更新:', newValue);
});

// 直接访问数据
console.log('当前 hasMoreNewerMessage:', hasMoreNewerMessage.value);

import { useMessageListState } from 'tuikit-atomicx-vue3';

const { enableReadReceipt } = useMessageListState();

// 监听数据变化
watch(enableReadReceipt, (newValue) => {
  console.log('enableReadReceipt 更新:', newValue);
});

// 直接访问数据
console.log('当前 enableReadReceipt:', enableReadReceipt.value);

import { useMessageListState } from 'tuikit-atomicx-vue3';

const { isDisableScroll } = useMessageListState();

// 监听数据变化
watch(isDisableScroll, (newValue) => {
  console.log('isDisableScroll 更新:', newValue);
});

// 直接访问数据
console.log('当前 isDisableScroll:', isDisableScroll.value);

import { useMessageListState } from 'tuikit-atomicx-vue3';

const { recalledMessageIDSet } = useMessageListState();

// 监听数据变化
watch(recalledMessageIDSet, (newValue) => {
  console.log('recalledMessageIDSet 更新:', newValue);
});

// 直接访问数据
console.log('当前 recalledMessageIDSet:', recalledMessageIDSet.value);

import { useMessageListState } from 'tuikit-atomicx-vue3';

const { highlightMessageIDSet } = useMessageListState();

// 监听数据变化
watch(highlightMessageIDSet, (newValue) => {
  console.log('highlightMessageIDSet 更新:', newValue);
});

// 直接访问数据
console.log('当前 highlightMessageIDSet:', highlightMessageIDSet.value);

import { useMessageListState } from 'tuikit-atomicx-vue3';

const { setEnableReadReceipt } = useMessageListState();

// Enable read receipt
await setEnableReadReceipt({
  enabled: true
});

import { useMessageListState } from 'tuikit-atomicx-vue3';

const { setIsDisableScroll } = useMessageListState();

// Disable auto scroll
await setIsDisableScroll({
  disabled: true
});

import { useMessageListState } from 'tuikit-atomicx-vue3';

const { highlightMessage } = useMessageListState();

// Highlight a specific message for 3 seconds
await highlightMessage({
  messageId: 'msg_123456',
  duration: 3000
});

MessageInputState

import { useMessageInputState } from 'tuikit-atomicx-vue3';

const { inputRawValue } = useMessageInputState();

// 监听数据变化
watch(inputRawValue, (newValue) => {
  console.log('inputRawValue 更新:', newValue);
});

// 直接访问数据
console.log('当前 inputRawValue:', inputRawValue.value);

import { useMessageInputState } from 'tuikit-atomicx-vue3';

const { isPeerTyping } = useMessageInputState();

// 监听数据变化
watch(isPeerTyping, (newValue) => {
  console.log('isPeerTyping 更新:', newValue);
});

// 直接访问数据
console.log('当前 isPeerTyping:', isPeerTyping.value);

import { useMessageInputState } from 'tuikit-atomicx-vue3';

const { updateRawValue } = useMessageInputState();

// Update input raw value
await updateRawValue({
  value: 'Hello, world!'
});

import { useMessageInputState } from 'tuikit-atomicx-vue3';

const { setEditorInstance } = useMessageInputState();

// Set editor instance
await setEditorInstance({
  editor: editorRef
});

import { useMessageInputState } from 'tuikit-atomicx-vue3';

const { setContent } = useMessageInputState();

// Set editor content
await setContent({
  content: 'New message content'
});

import { useMessageInputState } from 'tuikit-atomicx-vue3';

const { insertContent } = useMessageInputState();

// Insert content at cursor position
await insertContent({
  content: '@user ',
  position: 0
});

import { useMessageInputState } from 'tuikit-atomicx-vue3';

const { focusEditor } = useMessageInputState();

// 聚焦编辑器
focusEditor();

import { useMessageInputState } from 'tuikit-atomicx-vue3';

const { blurEditor } = useMessageInputState();

// 失焦编辑器
blurEditor();

import { useMessageInputState } from 'tuikit-atomicx-vue3';

const { sendMessage } = useMessageInputState();

// Send a text message
await sendMessage({
  content: 'Hello everyone!',
  type: 'text'
});

MessageActionState

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { forwardMessageIDList } = useMessageActionState();

// 监听数据变化
watch(forwardMessageIDList, (newValue) => {
  console.log('forwardMessageIDList 更新:', newValue);
});

// 直接访问数据
console.log('当前 forwardMessageIDList:', forwardMessageIDList.value);

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { isForwardMessageSelectionDone } = useMessageActionState();

// 监听数据变化
watch(isForwardMessageSelectionDone, (newValue) => {
  console.log('isForwardMessageSelectionDone 更新:', newValue);
});

// 直接访问数据
console.log('当前 isForwardMessageSelectionDone:', isForwardMessageSelectionDone.value);

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { forwardConversationIDList } = useMessageActionState();

// 监听数据变化
watch(forwardConversationIDList, (newValue) => {
  console.log('forwardConversationIDList 更新:', newValue);
});

// 直接访问数据
console.log('当前 forwardConversationIDList:', forwardConversationIDList.value);

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { quotedMessage } = useMessageActionState();

// 监听数据变化
watch(quotedMessage, (newValue) => {
  console.log('quotedMessage 更新:', newValue);
});

// 直接访问数据
console.log('当前 quotedMessage:', quotedMessage.value);

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { forwardMessage } = useMessageActionState();

// Forward messages to conversations
await forwardMessage({
  messageIds: ['msg_001', 'msg_002'],
  conversationIds: ['C2C_user123', 'GROUP_group456']
});

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { setForwardMessageIDList } = useMessageActionState();

// Set forward message ID list
await setForwardMessageIDList({
  messageIds: ['msg_001', 'msg_002', 'msg_003']
});

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { setIsForwardMessageSelectionDone } = useMessageActionState();

// Mark forward message selection as done
await setIsForwardMessageSelectionDone({
  done: true
});

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { setForwardConversationIDList } = useMessageActionState();

// Set forward conversation ID list
await setForwardConversationIDList({
  conversationIds: ['C2C_user123', 'GROUP_group456']
});

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { quoteMessage } = useMessageActionState();

// Quote a message for reply
await quoteMessage({
  messageId: 'msg_123456'
});

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { clearQuotedMessage } = useMessageActionState();

// 清除引用消息
clearQuotedMessage();

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { copyTextMessage } = useMessageActionState();

// Copy text message content
await copyTextMessage({
  messageId: 'msg_123456'
});

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { deleteMessage } = useMessageActionState();

// Delete a message
await deleteMessage({
  messageId: 'msg_123456'
});

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { recallMessage } = useMessageActionState();

// Recall a message
await recallMessage({
  messageId: 'msg_123456'
});

import { useMessageActionState } from 'tuikit-atomicx-vue3';

const { resetMessageActionState } = useMessageActionState();

// 重置所有消息操作状态
resetMessageActionState();

ConversationListState

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { conversationList } = useConversationListState();

// 监听数据变化
watch(conversationList, (newValue) => {
  console.log('conversationList 更新:', newValue);
});

// 直接访问数据
console.log('当前 conversationList:', conversationList.value);

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { activeConversation } = useConversationListState();

// 监听数据变化
watch(activeConversation, (newValue) => {
  console.log('activeConversation 更新:', newValue);
});

// 直接访问数据
console.log('当前 activeConversation:', activeConversation.value);

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { totalUnRead } = useConversationListState();

// 监听数据变化
watch(totalUnRead, (newValue) => {
  console.log('totalUnRead 更新:', newValue);
});

// 直接访问数据
console.log('当前 totalUnRead:', totalUnRead.value);

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { netStatus } = useConversationListState();

// 监听数据变化
watch(netStatus, (newValue) => {
  console.log('netStatus 更新:', newValue);
});

// 直接访问数据
console.log('当前 netStatus:', netStatus.value);

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { markConversationUnread } = useConversationListState();

// Mark conversation as unread
await markConversationUnread({
  conversationId: 'C2C_user123',
  unreadCount: 1
});

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { setActiveConversation } = useConversationListState();

// Set active conversation
await setActiveConversation({
  conversationId: 'C2C_user123'
});

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { pinConversation } = useConversationListState();

// Pin conversation to top
await pinConversation({
  conversationId: 'C2C_user123',
  isPinned: true
});

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { deleteConversation } = useConversationListState();

// Delete a conversation
await deleteConversation({
  conversationId: 'C2C_user123'
});

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { muteConversation } = useConversationListState();

// Mute conversation notifications
await muteConversation({
  conversationId: 'C2C_user123',
  isMuted: true
});

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { setConversationDraft } = useConversationListState();

// Set conversation draft
await setConversationDraft({
  conversationId: 'C2C_user123',
  draft: 'Draft message content...'
});

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { createC2CConversation } = useConversationListState();

// Create C2C (one-to-one) conversation
await createC2CConversation({
  userId: 'user_123'
});

import { useConversationListState } from 'tuikit-atomicx-vue3';

const { createGroupConversation } = useConversationListState();

// Create group conversation
await createGroupConversation({
  groupId: 'group_456'
});

ContactListState

import { useContactListState } from 'tuikit-atomicx-vue3';

const { friendList } = useContactListState();

// 监听数据变化
watch(friendList, (newValue) => {
  console.log('friendList 更新:', newValue);
});

// 直接访问数据
console.log('当前 friendList:', friendList.value);

import { useContactListState } from 'tuikit-atomicx-vue3';

const { groupList } = useContactListState();

// 监听数据变化
watch(groupList, (newValue) => {
  console.log('groupList 更新:', newValue);
});

// 直接访问数据
console.log('当前 groupList:', groupList.value);

import { useContactListState } from 'tuikit-atomicx-vue3';

const { blackList } = useContactListState();

// 监听数据变化
watch(blackList, (newValue) => {
  console.log('blackList 更新:', newValue);
});

// 直接访问数据
console.log('当前 blackList:', blackList.value);

import { useContactListState } from 'tuikit-atomicx-vue3';

const { friendApplicationUnreadCount } = useContactListState();

// 监听数据变化
watch(friendApplicationUnreadCount, (newValue) => {
  console.log('friendApplicationUnreadCount 更新:', newValue);
});

// 直接访问数据
console.log('当前 friendApplicationUnreadCount:', friendApplicationUnreadCount.value);

import { useContactListState } from 'tuikit-atomicx-vue3';

const { friendGroupList } = useContactListState();

// 监听数据变化
watch(friendGroupList, (newValue) => {
  console.log('friendGroupList 更新:', newValue);
});

// 直接访问数据
console.log('当前 friendGroupList:', friendGroupList.value);

import { useContactListState } from 'tuikit-atomicx-vue3';

const { friendApplicationList } = useContactListState();

// 监听数据变化
watch(friendApplicationList, (newValue) => {
  console.log('friendApplicationList 更新:', newValue);
});

// 直接访问数据
console.log('当前 friendApplicationList:', friendApplicationList.value);

import { useContactListState } from 'tuikit-atomicx-vue3';

const { groupApplicationList } = useContactListState();

// 监听数据变化
watch(groupApplicationList, (newValue) => {
  console.log('groupApplicationList 更新:', newValue);
});

// 直接访问数据
console.log('当前 groupApplicationList:', groupApplicationList.value);

import { useContactListState } from 'tuikit-atomicx-vue3';

const { setGroupApplicationList } = useContactListState();

// Set group application list
await setGroupApplicationList({
  applicationList: []
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { setFriendList } = useContactListState();

// Set friend list
await setFriendList({
  friendList: []
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { setGroupList } = useContactListState();

// Set group list
await setGroupList({
  groupList: []
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { setBlackList } = useContactListState();

// Set black list
await setBlackList({
  blackList: []
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { setFriendApplicationUnreadCount } = useContactListState();

// Set friend application unread count
await setFriendApplicationUnreadCount({
  count: 5
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { setFriendGroupList } = useContactListState();

// Set friend group list
await setFriendGroupList({
  groupList: []
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { setFriendApplicationList } = useContactListState();

// Set friend application list
await setFriendApplicationList({
  applicationList: []
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { initContactListWatcher } = useContactListState();

// Initialize contact list watcher
await initContactListWatcher({
  autoUpdate: true
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { addFriend } = useContactListState();

// Add friend with remark
await addFriend({
  userId: 'user_123',
  remark: 'My Friend',
  addSource: 'search'
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { markFriendApplicationAsRead } = useContactListState();

// Mark friend applications as read
await markFriendApplicationAsRead({
  applicationList: ['app_001', 'app_002']
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { acceptFriendApplication } = useContactListState();

// Accept friend application
await acceptFriendApplication({
  userId: 'user_123',
  remark: 'New Friend'
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { refuseFriendApplication } = useContactListState();

// Refuse friend application
await refuseFriendApplication({
  userId: 'user_123'
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { addToBlacklist } = useContactListState();

// Add user to blacklist
await addToBlacklist({
  userId: 'user_123'
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { removeFromBlacklist } = useContactListState();

// Remove user from blacklist
await removeFromBlacklist({
  userId: 'user_123'
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { deleteFriend } = useContactListState();

// Delete friend
await deleteFriend({
  userId: 'user_123'
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { setFriendRemark } = useContactListState();

// Set friend remark
await setFriendRemark({
  userId: 'user_123',
  remark: 'Best Friend'
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { createFriendGroup } = useContactListState();

// Create friend group
await createFriendGroup({
  groupName: 'Close Friends',
  userList: ['user_001', 'user_002']
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { deleteFriendGroup } = useContactListState();

// Delete friend group
await deleteFriendGroup({
  groupName: 'Old Group'
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { addToFriendGroup } = useContactListState();

// Add friends to group
await addToFriendGroup({
  groupName: 'Close Friends',
  userList: ['user_003', 'user_004']
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { removeFromFriendGroup } = useContactListState();

// Remove friends from group
await removeFromFriendGroup({
  groupName: 'Close Friends',
  userList: ['user_003']
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { renameFriendGroup } = useContactListState();

// Rename friend group
await renameFriendGroup({
  oldGroupName: 'Close Friends',
  newGroupName: 'Best Friends'
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { joinGroup } = useContactListState();

// Join a group
await joinGroup({
  groupId: 'group_123',
  message: 'I want to join this group'
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { acceptGroupApplication } = useContactListState();

// Accept group application
await acceptGroupApplication({
  groupId: 'group_123',
  userId: 'user_456'
});

import { useContactListState } from 'tuikit-atomicx-vue3';

const { refuseGroupApplication } = useContactListState();

// Refuse group application
await refuseGroupApplication({
  groupId: 'group_123',
  userId: 'user_456',
  reason: 'Group is full'
});

C2CSettingState

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { currentConversationRef } = useC2CSettingState();

// 监听数据变化
watch(currentConversationRef, (newValue) => {
  console.log('currentConversationRef 更新:', newValue);
});

// 直接访问数据
console.log('当前 currentConversationRef:', currentConversationRef.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { userIDRef } = useC2CSettingState();

// 监听数据变化
watch(userIDRef, (newValue) => {
  console.log('userIDRef 更新:', newValue);
});

// 直接访问数据
console.log('当前 userIDRef:', userIDRef.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { nickRef } = useC2CSettingState();

// 监听数据变化
watch(nickRef, (newValue) => {
  console.log('nickRef 更新:', newValue);
});

// 直接访问数据
console.log('当前 nickRef:', nickRef.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { avatarRef } = useC2CSettingState();

// 监听数据变化
watch(avatarRef, (newValue) => {
  console.log('avatarRef 更新:', newValue);
});

// 直接访问数据
console.log('当前 avatarRef:', avatarRef.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { signatureRef } = useC2CSettingState();

// 监听数据变化
watch(signatureRef, (newValue) => {
  console.log('signatureRef 更新:', newValue);
});

// 直接访问数据
console.log('当前 signatureRef:', signatureRef.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { remarkRef } = useC2CSettingState();

// 监听数据变化
watch(remarkRef, (newValue) => {
  console.log('remarkRef 更新:', newValue);
});

// 直接访问数据
console.log('当前 remarkRef:', remarkRef.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { isMutedRef } = useC2CSettingState();

// 监听数据变化
watch(isMutedRef, (newValue) => {
  console.log('isMutedRef 更新:', newValue);
});

// 直接访问数据
console.log('当前 isMutedRef:', isMutedRef.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { isPinnedRef } = useC2CSettingState();

// 监听数据变化
watch(isPinnedRef, (newValue) => {
  console.log('isPinnedRef 更新:', newValue);
});

// 直接访问数据
console.log('当前 isPinnedRef:', isPinnedRef.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { isContactRef } = useC2CSettingState();

// 监听数据变化
watch(isContactRef, (newValue) => {
  console.log('isContactRef 更新:', newValue);
});

// 直接访问数据
console.log('当前 isContactRef:', isContactRef.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { userID } = useC2CSettingState();

// 监听数据变化
watch(userID, (newValue) => {
  console.log('userID 更新:', newValue);
});

// 直接访问数据
console.log('当前 userID:', userID.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { avatar } = useC2CSettingState();

// 监听数据变化
watch(avatar, (newValue) => {
  console.log('avatar 更新:', newValue);
});

// 直接访问数据
console.log('当前 avatar:', avatar.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { signature } = useC2CSettingState();

// 监听数据变化
watch(signature, (newValue) => {
  console.log('signature 更新:', newValue);
});

// 直接访问数据
console.log('当前 signature:', signature.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { remark } = useC2CSettingState();

// 监听数据变化
watch(remark, (newValue) => {
  console.log('remark 更新:', newValue);
});

// 直接访问数据
console.log('当前 remark:', remark.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { isMuted } = useC2CSettingState();

// 监听数据变化
watch(isMuted, (newValue) => {
  console.log('isMuted 更新:', newValue);
});

// 直接访问数据
console.log('当前 isMuted:', isMuted.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { isPinned } = useC2CSettingState();

// 监听数据变化
watch(isPinned, (newValue) => {
  console.log('isPinned 更新:', newValue);
});

// 直接访问数据
console.log('当前 isPinned:', isPinned.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { isContact } = useC2CSettingState();

// 监听数据变化
watch(isContact, (newValue) => {
  console.log('isContact 更新:', newValue);
});

// 直接访问数据
console.log('当前 isContact:', isContact.value);

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { setChatPinned } = useC2CSettingState();

// Pin chat to top
await setChatPinned({
  conversationId: 'C2C_user123',
  isPinned: true
});

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { setChatMuted } = useC2CSettingState();

// Mute chat notifications
await setChatMuted({
  conversationId: 'C2C_user123',
  isMuted: true
});

import { useC2CSettingState } from 'tuikit-atomicx-vue3';

const { setUserRemark } = useC2CSettingState();

// Set user remark
await setUserRemark({
  userId: 'user_123',
  remark: 'My Best Friend'
});

GroupSettingState

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { groupID } = useGroupSettingState();

// 监听数据变化
watch(groupID, (newValue) => {
  console.log('groupID 更新:', newValue);
});

// 直接访问数据
console.log('当前 groupID:', groupID.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { groupType } = useGroupSettingState();

// 监听数据变化
watch(groupType, (newValue) => {
  console.log('groupType 更新:', newValue);
});

// 直接访问数据
console.log('当前 groupType:', groupType.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { groupName } = useGroupSettingState();

// 监听数据变化
watch(groupName, (newValue) => {
  console.log('groupName 更新:', newValue);
});

// 直接访问数据
console.log('当前 groupName:', groupName.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { avatar } = useGroupSettingState();

// 监听数据变化
watch(avatar, (newValue) => {
  console.log('avatar 更新:', newValue);
});

// 直接访问数据
console.log('当前 avatar:', avatar.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { introduction } = useGroupSettingState();

// 监听数据变化
watch(introduction, (newValue) => {
  console.log('introduction 更新:', newValue);
});

// 直接访问数据
console.log('当前 introduction:', introduction.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { notification } = useGroupSettingState();

// 监听数据变化
watch(notification, (newValue) => {
  console.log('notification 更新:', newValue);
});

// 直接访问数据
console.log('当前 notification:', notification.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { isMuted } = useGroupSettingState();

// 监听数据变化
watch(isMuted, (newValue) => {
  console.log('isMuted 更新:', newValue);
});

// 直接访问数据
console.log('当前 isMuted:', isMuted.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { isPinned } = useGroupSettingState();

// 监听数据变化
watch(isPinned, (newValue) => {
  console.log('isPinned 更新:', newValue);
});

// 直接访问数据
console.log('当前 isPinned:', isPinned.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { groupOwner } = useGroupSettingState();

// 监听数据变化
watch(groupOwner, (newValue) => {
  console.log('groupOwner 更新:', newValue);
});

// 直接访问数据
console.log('当前 groupOwner:', groupOwner.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { adminMembers } = useGroupSettingState();

// 监听数据变化
watch(adminMembers, (newValue) => {
  console.log('adminMembers 更新:', newValue);
});

// 直接访问数据
console.log('当前 adminMembers:', adminMembers.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { allMembers } = useGroupSettingState();

// 监听数据变化
watch(allMembers, (newValue) => {
  console.log('allMembers 更新:', newValue);
});

// 直接访问数据
console.log('当前 allMembers:', allMembers.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { memberCount } = useGroupSettingState();

// 监听数据变化
watch(memberCount, (newValue) => {
  console.log('memberCount 更新:', newValue);
});

// 直接访问数据
console.log('当前 memberCount:', memberCount.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { maxMemberCount } = useGroupSettingState();

// 监听数据变化
watch(maxMemberCount, (newValue) => {
  console.log('maxMemberCount 更新:', newValue);
});

// 直接访问数据
console.log('当前 maxMemberCount:', maxMemberCount.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { currentUserID } = useGroupSettingState();

// 监听数据变化
watch(currentUserID, (newValue) => {
  console.log('currentUserID 更新:', newValue);
});

// 直接访问数据
console.log('当前 currentUserID:', currentUserID.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { currentUserRole } = useGroupSettingState();

// 监听数据变化
watch(currentUserRole, (newValue) => {
  console.log('currentUserRole 更新:', newValue);
});

// 直接访问数据
console.log('当前 currentUserRole:', currentUserRole.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { nameCard } = useGroupSettingState();

// 监听数据变化
watch(nameCard, (newValue) => {
  console.log('nameCard 更新:', newValue);
});

// 直接访问数据
console.log('当前 nameCard:', nameCard.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { isMuteAllMembers } = useGroupSettingState();

// 监听数据变化
watch(isMuteAllMembers, (newValue) => {
  console.log('isMuteAllMembers 更新:', newValue);
});

// 直接访问数据
console.log('当前 isMuteAllMembers:', isMuteAllMembers.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { isInGroup } = useGroupSettingState();

// 监听数据变化
watch(isInGroup, (newValue) => {
  console.log('isInGroup 更新:', newValue);
});

// 直接访问数据
console.log('当前 isInGroup:', isInGroup.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { inviteOption } = useGroupSettingState();

// 监听数据变化
watch(inviteOption, (newValue) => {
  console.log('inviteOption 更新:', newValue);
});

// 直接访问数据
console.log('当前 inviteOption:', inviteOption.value);

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { getGroupMemberList } = useGroupSettingState();

// Get group member list
await getGroupMemberList({
  groupId: 'group_123',
  filter: 0,
  nextSeq: 0
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { updateGroupProfile } = useGroupSettingState();

// Update group profile
await updateGroupProfile({
  groupId: 'group_123',
  groupName: 'New Group Name',
  avatar: 'https://example.com/avatar.png',
  introduction: 'Welcome to our group!',
  notification: 'Please follow the rules'
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { addGroupMember } = useGroupSettingState();

// Add group members
await addGroupMember({
  groupId: 'group_123',
  userList: ['user_001', 'user_002']
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { deleteGroupMember } = useGroupSettingState();

// Delete group members
await deleteGroupMember({
  groupId: 'group_123',
  userList: ['user_001'],
  reason: 'Violated group rules'
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { changeGroupOwner } = useGroupSettingState();

// Transfer group ownership
await changeGroupOwner({
  groupId: 'group_123',
  newOwnerUserId: 'user_456'
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { setGroupMemberRole } = useGroupSettingState();

// Set group member role (1: admin, 0: member)
await setGroupMemberRole({
  groupId: 'group_123',
  userId: 'user_456',
  role: 1
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { setGroupMemberNameCard } = useGroupSettingState();

// Set group member name card
await setGroupMemberNameCard({
  groupId: 'group_123',
  userId: 'user_456',
  nameCard: 'Team Leader'
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { setChatPinned } = useGroupSettingState();

// Pin chat to top
await setChatPinned({
  conversationId: 'C2C_user123',
  isPinned: true
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { setChatMuted } = useGroupSettingState();

// Mute chat notifications
await setChatMuted({
  conversationId: 'C2C_user123',
  isMuted: true
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { setGroupMemberMuteTime } = useGroupSettingState();

// Mute group member for 10 minutes
await setGroupMemberMuteTime({
  groupId: 'group_123',
  userId: 'user_456',
  muteTime: 600
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { setMuteAllMember } = useGroupSettingState();

// Mute all group members
await setMuteAllMember({
  groupId: 'group_123',
  isMuted: true
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { dismissGroup } = useGroupSettingState();

// Dismiss group
await dismissGroup({
  groupId: 'group_123'
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { quitGroup } = useGroupSettingState();

// Quit group
await quitGroup({
  groupId: 'group_123'
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { hasPermission } = useGroupSettingState();

// Check if user has permission
await hasPermission({
  permission: 'kick_member'
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { canOperateOnMember } = useGroupSettingState();

// Check if can operate on member
await canOperateOnMember({
  targetUserId: 'user_456',
  operation: 'mute'
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { getAvailablePermissions } = useGroupSettingState();

// Get available permissions for a user
await getAvailablePermissions({
  userId: 'user_123'
});

import { useGroupSettingState } from 'tuikit-atomicx-vue3';

const { initWatcher } = useGroupSettingState();

// Initialize group setting watcher
await initWatcher({
  autoUpdate: true
});

VideoMixerState

const size = getSizeByResolution(TRTCVideoResolution.TRTCVideoResolution_1280_720);
console.log(size.width, size.height); // 输出: 1280, 720

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { isVideoMixerEnabled } = useVideoMixerState();

// 监听数据变化
watch(isVideoMixerEnabled, (newValue) => {
  console.log('isVideoMixerEnabled 更新:', newValue);
});

// 直接访问数据
console.log('当前 isVideoMixerEnabled:', isVideoMixerEnabled.value);

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { mediaSourceList } = useVideoMixerState();

// 监听数据变化
watch(mediaSourceList, (newValue) => {
  console.log('mediaSourceList 更新:', newValue);
});

// 直接访问数据
console.log('当前 mediaSourceList:', mediaSourceList.value);

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { activeMediaSource } = useVideoMixerState();

// 监听数据变化
watch(activeMediaSource, (newValue) => {
  console.log('activeMediaSource 更新:', newValue);
});

// 直接访问数据
console.log('当前 activeMediaSource:', activeMediaSource.value);

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { getVideoDataByQuality } = useVideoMixerState();

// Get video encoding parameters by quality
await getVideoDataByQuality({
  quality: VideoQuality.HD720P
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { getSizeByQuality } = useVideoMixerState();

// Get video size by quality
await getSizeByQuality({
  quality: VideoQuality.HD720P
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { getSizeByResolution } = useVideoMixerState();

// Get video size by resolution
await getSizeByResolution({
  resolution: VideoResolution.Resolution_1280_720
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { transformTUIVideoQualityToTRTCVideoResolution } = useVideoMixerState();

// Transform TUI video quality to TRTC resolution
await transformTUIVideoQualityToTRTCVideoResolution({
  quality: VideoQuality.HD720P
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { transformTRTCVideoResolutionToTUIVideoQuality } = useVideoMixerState();

// Transform TRTC resolution to TUI video quality
await transformTRTCVideoResolutionToTUIVideoQuality({
  resolution: TRTCVideoResolution.TRTCVideoResolution_1280_720
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { transformTRTCVideoResModeToTUIVideoResMode } = useVideoMixerState();

// Transform TRTC resolution mode to TUI mode
await transformTRTCVideoResModeToTUIVideoResMode({
  mode: TRTCVideoResMode.TRTCVideoResModeLandscape
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { changeActiveMediaSource } = useVideoMixerState();

// Change active media source
await changeActiveMediaSource({
  sourceId: 'camera_source_1'
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { updateVideoQuality } = useVideoMixerState();

// Update video mixer quality
await updateVideoQuality({
  quality: VideoQuality.HD1080P
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { getDefaultLayoutByMediaSource } = useVideoMixerState();

// Get default layout by media source type
await getDefaultLayoutByMediaSource({
  sourceType: MediaSourceType.Camera
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { addMediaSource } = useVideoMixerState();

// Add a camera media source
await addMediaSource({
  sourceId: 'camera_source_1',
  sourceType: 0,
  sourceInfo: { deviceId: 'default' }
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { updateMediaSource } = useVideoMixerState();

// Update media source configuration
await updateMediaSource({
  sourceId: 'camera_source_1',
  sourceInfo: { x: 0, y: 0, width: 640, height: 480 }
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { removeMediaSource } = useVideoMixerState();

// Remove media source from mixer
await removeMediaSource({
  sourceId: 'camera_source_1'
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { enableLocalVideoMixer } = useVideoMixerState();

// Enable local video mixer
await enableLocalVideoMixer({
  enable: true
});

// 清空所有媒体源
clearMediaSource();

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { initMediaSourceManager } = useVideoMixerState();

// Initialize media source manager
await initMediaSourceManager({
  config: { maxSources: 4 }
});

import { useVideoMixerState } from 'tuikit-atomicx-vue3';

const { initVideoMixerState } = useVideoMixerState();

// Initialize video mixer state
await initVideoMixerState({
  config: { defaultQuality: VideoQuality.HD720P }
});

VirtualBackgroundState

import { useVirtualBackgroundState } from 'tuikit-atomicx-vue3';

const { virtualBackgroundConfig } = useVirtualBackgroundState();

// 监听数据变化
watch(virtualBackgroundConfig, (newValue) => {
  console.log('virtualBackgroundConfig 更新:', newValue);
});

// 直接访问数据
console.log('当前 virtualBackgroundConfig:', virtualBackgroundConfig.value);

import { useVirtualBackgroundState } from 'tuikit-atomicx-vue3';

const { initVirtualBackground } = useVirtualBackgroundState();

// Initialize virtual background
await initVirtualBackground({
  config: { enabled: true, type: 'blur' }
});

import { useVirtualBackgroundState } from 'tuikit-atomicx-vue3';

const { saveVirtualBackground } = useVirtualBackgroundState();

// Save virtual background configuration
await saveVirtualBackground({
  config: { enabled: true, type: 'image', imageUrl: 'https://example.com/bg.jpg' }
});

import { useVirtualBackgroundState } from 'tuikit-atomicx-vue3';

const { isSupported } = useVirtualBackgroundState();

// Check if virtual background is supported
await isSupported({
  feature: 'blur'
});

import { useVirtualBackgroundState } from 'tuikit-atomicx-vue3';

const { setVirtualBackground } = useVirtualBackgroundState();

// Set virtual background (0: none, 1: blur, 2: image)
await setVirtualBackground({
  backgroundType: 1,
  backgroundValue: ''
});

ASRState

import { useASRState } from 'tuikit-atomicx-vue3';

const { recentTranscripts } = useASRState();

// 监听数据变化
watch(recentTranscripts, (newValue) => {
  console.log('recentTranscripts 更新:', newValue);
});

// 直接访问数据
console.log('当前 recentTranscripts:', recentTranscripts.value);

import { useASRState } from 'tuikit-atomicx-vue3';

const { transcriptHistory } = useASRState();

// 监听数据变化
watch(transcriptHistory, (newValue) => {
  console.log('transcriptHistory 更新:', newValue);
});

// 直接访问数据
console.log('当前 transcriptHistory:', transcriptHistory.value);

import { useASRState } from 'tuikit-atomicx-vue3';

const { setRecentTranscriptsDuration } = useASRState();

// Set recent transcripts duration (in seconds)
await setRecentTranscriptsDuration({
  duration: 300
});

import { useASRState } from 'tuikit-atomicx-vue3';

const { clearHistory, transcriptHistory } = useASRState();

// 清空所有转录记录
clearHistory();
console.log('转录记录已清空:', transcriptHistory.value.length === 0);

import { useASRState } from 'tuikit-atomicx-vue3';

const { exportTranscripts } = useASRState();

// Export transcripts in txt format
await exportTranscripts({
  format: 'txt',
  timeRange: { start: 1700000000000, end: 1700003600000 }
});

SearchState

import { useSearchState } from 'tuikit-atomicx-vue3';

const { keyword } = useSearchState();

// 监听数据变化
watch(keyword, (newValue) => {
  console.log('keyword 更新:', newValue);
});

// 直接访问数据
console.log('当前 keyword:', keyword.value);

import { useSearchState } from 'tuikit-atomicx-vue3';

const { results } = useSearchState();

// 监听数据变化
watch(results, (newValue) => {
  console.log('results 更新:', newValue);
});

// 直接访问数据
console.log('当前 results:', results.value);

import { useSearchState } from 'tuikit-atomicx-vue3';

const { isLoading } = useSearchState();

// 监听数据变化
watch(isLoading, (newValue) => {
  console.log('isLoading 更新:', newValue);
});

// 直接访问数据
console.log('当前 isLoading:', isLoading.value);

import { useSearchState } from 'tuikit-atomicx-vue3';

const { error } = useSearchState();

// 监听数据变化
watch(error, (newValue) => {
  console.log('error 更新:', newValue);
});

// 直接访问数据
console.log('当前 error:', error.value);

import { useSearchState } from 'tuikit-atomicx-vue3';

const { searchAdvancedParams } = useSearchState();

// 监听数据变化
watch(searchAdvancedParams, (newValue) => {
  console.log('searchAdvancedParams 更新:', newValue);
});

// 直接访问数据
console.log('当前 searchAdvancedParams:', searchAdvancedParams.value);

import { useSearchState } from 'tuikit-atomicx-vue3';

const { selectedSearchType } = useSearchState();

// 监听数据变化
watch(selectedSearchType, (newValue) => {
  console.log('selectedSearchType 更新:', newValue);
});

// 直接访问数据
console.log('当前 selectedSearchType:', selectedSearchType.value);

import { useSearchState } from 'tuikit-atomicx-vue3';

const { search } = useSearchState();

// Search for messages
await search({
  keyword: 'meeting',
  type: SearchType.Message
});

import { useSearchState } from 'tuikit-atomicx-vue3';

const { setKeyword } = useSearchState();

// Set search keyword
await setKeyword({
  keyword: 'hello'
});

import { useSearchState } from 'tuikit-atomicx-vue3';

const { setSelectedType } = useSearchState();

// Set selected search type
await setSelectedType({
  searchType: 'message'
});

import { useSearchState } from 'tuikit-atomicx-vue3';

const { setSearchMessageAdvancedParams } = useSearchState();

// Set message search advanced params
await setSearchMessageAdvancedParams({
  conversationId: 'C2C_user123',
  timeRange: { start: 1700000000000, end: 1700003600000 },
  senderList: ['user_001', 'user_002']
});

import { useSearchState } from 'tuikit-atomicx-vue3';

const { setSearchUserAdvancedParams } = useSearchState();

// Set user search advanced params
await setSearchUserAdvancedParams({
  userType: 'friend',
  isOnline: true
});

import { useSearchState } from 'tuikit-atomicx-vue3';

const { setSearchGroupAdvancedParams } = useSearchState();

// Set group search advanced params
await setSearchGroupAdvancedParams({
  groupType: 'Public',
  memberCountRange: { min: 10, max: 100 }
});

import { useSearchState } from 'tuikit-atomicx-vue3';

const { loadMore } = useSearchState();

// Load more search results
await loadMore({
  cursor: 'next_page_cursor',
  count: 20
});

SeatStore

import { useSeatStore } from 'tuikit-atomicx-vue3';

const { liveOwnerUserId } = useSeatStore();

// 监听数据变化
watch(liveOwnerUserId, (newValue) => {
  console.log('liveOwnerUserId 更新:', newValue);
});

// 直接访问数据
console.log('当前 liveOwnerUserId:', liveOwnerUserId.value);

import { useSeatStore } from 'tuikit-atomicx-vue3';

const { localUserId } = useSeatStore();

// 监听数据变化
watch(localUserId, (newValue) => {
  console.log('localUserId 更新:', newValue);
});

// 直接访问数据
console.log('当前 localUserId:', localUserId.value);

import { useSeatStore } from 'tuikit-atomicx-vue3';

const { seatList } = useSeatStore();

// 监听数据变化
watch(seatList, (newValue) => {
  console.log('seatList 更新:', newValue);
});

// 直接访问数据
console.log('当前 seatList:', seatList.value);

import { useSeatStore } from 'tuikit-atomicx-vue3';

const { coHostUserList } = useSeatStore();

// 监听数据变化
watch(coHostUserList, (newValue) => {
  console.log('coHostUserList 更新:', newValue);
});

// 直接访问数据
console.log('当前 coHostUserList:', coHostUserList.value);

import { useSeatStore } from 'tuikit-atomicx-vue3';

const { sentDeviceRequestMap } = useSeatStore();

// 监听数据变化
watch(sentDeviceRequestMap, (newValue) => {
  console.log('sentDeviceRequestMap 更新:', newValue);
});

// 直接访问数据
console.log('当前 sentDeviceRequestMap:', sentDeviceRequestMap.value);

import { useSeatStore } from 'tuikit-atomicx-vue3';

const { receivedDeviceRequestMap } = useSeatStore();

// 监听数据变化
watch(receivedDeviceRequestMap, (newValue) => {
  console.log('receivedDeviceRequestMap 更新:', newValue);
});

// 直接访问数据
console.log('当前 receivedDeviceRequestMap:', receivedDeviceRequestMap.value);

import { useSeatStore } from 'tuikit-atomicx-vue3';

const { userInfoMap } = useSeatStore();

// 监听数据变化
watch(userInfoMap, (newValue) => {
  console.log('userInfoMap 更新:', newValue);
});

// 直接访问数据
console.log('当前 userInfoMap:', userInfoMap.value);

import { useSeatStore } from 'tuikit-atomicx-vue3';

const { getUserInfo } = useSeatStore();

// Get user info by userId
await getUserInfo({
  userId: 'user_123'
});

import { useSeatStore } from 'tuikit-atomicx-vue3';

const { convertUserInfoToAudienceInfo } = useSeatStore();

// Convert user info to audience info format
await convertUserInfoToAudienceInfo({
  userInfo: { userId: 'user_123', nickName: 'John', avatar: 'https://example.com/avatar.png' }
});