UI

avatar-container

アバターストリーミング用の Web コンポーネントをレンダリングします。

<avatar-container videoStyle='{"border-radius": "24px"}'></avatar-container>

props	type	default	description
videoStyle	[key: string]: string | number	x	ビデオ要素のスタイルを調整します。
volume	number	100	ビデオの音量調整

---

chat-container

チャット用の Web コンポーネントをレンダリングします。

<chat-container delay="60" type="text" isShowCount="true"></chat-container>

props	type	default	description
delay	number	30	テキストアニメーションの速度。
type	'text' | 'voice'	text	チャット画面のモード。
isShowCount	boolean	true	テキストモードで文字カウント UI をオン/オフします。

React/Vue 環境での Web コンポーネント属性の伝達方法

Web コンポーネントは React や Vue のような Virtual DOM 環境でも使用可能です。ただし、それぞれのフレームワークの動作方式に注意が必要です。 属性を動的に変更または追加するには、ref を活用して DOM 要素を直接参照する方法が必要です。