Klleon Chat SDK
English
KoreanJapaneseEnglish
English
KoreanJapaneseEnglish
  • ✨New Javascript SDK [1.2.0]
    • Getting Started
    • Events
    • UI
    • Methods
      • Life Cycle
      • Text Chat
      • Voice Chat
      • Echo Chat
      • Audio Echo Chat
      • Other
    • TypeScript Support
    • Examples
      • VanillaJS
      • React
      • Nextjs
    • Log System
    • Updates
  • JavaScript SDK [v0.x.x] (Planned for Deprecation)
    • Quick Start
    • Initialize
    • Avatar Streaming
      • Start Streaming
      • Stop Streaming
      • Control Streaming Screen
    • Set Chat Screen
    • Text Message
    • Voice Message
    • Echo - Repeat My Message
    • Event Subscription
    • Updates
  • Service Architecture
Powered by GitBook
LogoLogo

Products

  • Pricing

Websites

  • Homepage
  • Youtube
  • Linkedin

Copyright © Klleon. All rights reserved

On this page
  • avatar-container
  • chat-container
  1. New Javascript SDK [1.2.0]

UI

PreviousEventsNextMethods

Last updated 2 months ago

avatar-container

Renders a Web Component for avatar streaming.

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

videoStyle

[key: string]: string | number

x

Adjust the style of video elements.

volume

number

100

Video volume control

chat-container

Renders a Web Component for chat.

<chat-container delay="60" type="text" isShowCount="true"></chat-container>;
Property
Type
default
Description

delay

number

30

Text animation speed.

type

'text' | 'voice'

text

Chat screen mode.

isShowCount

boolean

true

Toggles the character count UI in text mode.

Passing Attributes in Web Components with React/Vue

Web Components can be used in Virtual DOM environments like React or Vue. However, caution is required due to the different operating mechanisms of these frameworks. To dynamically change or add attributes, you need to use ref to the DOM element.

✨
directly reference