Elements Reference
Цей контент ще не доступний вашою мовою.
Kite Chat
Tag: <kite-chat></kite-chat>
Description: KiteChat is an embeddable livechat component
Attributes:
- open (Type:Boolean) - opens chat dialogDefault value: false
- heading (Type:string) - Chat dialog headingDefault value: "🪁Kite chat"
- theme (Type:"light" | "dark") - defines kite chat theme, using prefers-color-scheme by default
Properties:
- open (Type:Boolean) - opens chat dialogDefault value: false
- heading (Type:string) - Chat dialog headingDefault value: "🪁Kite chat"
CSS variables:
- --kite-primary-color - accent color, styles toggle button, title bar, text selection, cursor
- --kite-secondary-color - accent contrast color, styles title, close button, toggle button icon color
Slots:
- default - kite-chat component contains chat messages as nested subcomponents, allowing server-side rendering
CSS parts:
- toggle - The toggle button TODO implement
Events:
- kite-chat.show - Chat window opens
- kite-chat.hide - Chat window closes
- kite-chat.send - Outgoing message is sent
Kite Msg
Tag: <kite-msg></kite-msg>
Description: Styled chat message component. Presence of the <pre>status</pre> attribute means outgoing message.
Attributes:
- messageId (Type:string) - Message id, optional, autogenerated with nanoid if not providedDefault value: "randomStringId()"
- status (Type:MsgStatus | undefined) - Status of the outgoing message; Optional, if present, must be one of 'sent' | 'delivered' | 'read'; in this case message is formatted as an outgoing message
- timestamp (Type:Date) - Timestamp as an ISO formatted string; optional, defaults to current timeDefault value: "new Date()"
Properties:
- messageId (Type:string) - Message id, optional, autogenerated with nanoid if not providedDefault value: "randomStringId()"
- status (Type:MsgStatus | undefined) - Status of the outgoing message; Optional, if present, must be one of 'sent' | 'delivered' | 'read'; in this case message is formatted as an outgoing message
- timestamp (Type:Date) - Timestamp as an ISO formatted string; optional, defaults to current timeDefault value: "new Date()"
Slots:
- default - kite-msg component contains message text (possibly formatted)
Kite File
Tag: <kite-file></kite-file>
Description: File component allows previewing and saving file message.
Attributes:
- name (Type:string) - file, sent from the chat or received by the chatDefault value: "File"
- src (Type:File | undefined) - file, sent from the chat or received by the chat
Properties:
- name (Type:string) - file, sent from the chat or received by the chatDefault value: "File"
- file (Type:File | undefined) - file, sent from the chat or received by the chat