@tencent-rtc/mcp 1.3.9 → 1.4.0

package/resource/doc/{chatuikit → chatkit}/react/components/avatar.md

@@ -1,15 +1,11 @@
 # Avatar Component Document
 
-
 ## Overview
 
-
 The Avatar component displays user avatars and status, supporting avatars in various shapes and sizes. It can be used for chat applications, social media platforms, user management systems, and other scenarios to provide a visual representation of user identity.
 
-
 ## Props Quick Reference Table
 
-
 | Field | Type | Default | Description |
 | --- | --- | --- | --- |
 | src | string | undefined | URL of the profile image |
@@ -27,111 +23,82 @@ The Avatar component displays user avatars and status, supporting avatars in var
 | isDotUnreadCount | boolean | false | Whether to display a red dot |
 | children | ReactNode | undefined | Custom content, takes precedence over src and alt content |
 
-
-
-
 ## Props Detailed Introduction
 
-
 ### `src`
 
-
 Type: string
 `Description`: URL of the avatar image. If not provided, the default avatar will be displayed.
 `Default`: `undefined`
 
-
 ### `size`
 
-
 `Type`: `'xxl' | 'xl' | 'lg' | 'md' | 'sm' | 'xs' | number`
 `Description`: Avatar size, support various preset sizes or custom size.
 `Default`: `'md'`
 
-
 ### `shape`
 
-
 `Type`: `'circular' | 'square' | 'rounded'`
 `Description`: Avatar shape, support circular, square and rounded rectangle.
 `Default`: `'circular'`
 
-
 ### `alt`
 
-
 Type: string
 `Description`: Alternative text for images, used for generating text avatars.
 `Default`: `''`
 
-
 ### `children`
 
-
 `Type`: `ReactNode`
 `Description`: Custom content, which takes precedence over the content of src and alt.
 `Default`: `undefined`
 
-
 ### `className`
 
-
 `Type`: `string | undefined`
 `Description`: Custom CSS class name.
 `Default`: `undefined`
 
-
 ### `style`
 
-
 `Type`: `React.CSSProperties | undefined`
 `Description`: Custom style.
 `Default`: `undefined`
 
-
 ### `onClick`
 
-
 `Type`: `() => void`
 `Description`: Click event handler.
 `Default`: `undefined`
 
-
 ### `isShowOnlineStatus`
 
-
 `Type`: `boolean`
 `Description`: Whether to display online status indicator.
 `Default`: `false`
 
-
 ### `isOnline`
 
-
 `Type`: `boolean`
 `Description`: Whether the user is online.
 `Default`: `false`
 
-
 ### `unreadCount`
 
-
 `Type`: `number`
 `Description`: Unread message count. Displays a red dot if true, or the actual quantity if a number.
 `Default`: `0`
 
-
 ### `maxUnreadCount`
 
-
 `Type`: `number`
 `Description`: Maximum unread message count, displays +N if exceeded.
 `Default`: `99`
 
-
 ### isDotUnreadCount
 
-
 `Type`: `boolean`
 `Description`: Whether to display the red dot.
 `Default`: `false`

package/resource/doc/{chatuikit → chatkit}/react/components/chat-header.md

@@ -1,83 +1,56 @@
 The AI model must comply with the following **hard limits**.
 
-
 * **Use the example code in the document as the preferred approach:** When creating a file, use the example code in the document to fill the file as the preferred approach. For the style tag, non-use of the scoped property is recommended.
 
-
 # Overview
 
 ChatHeader is the top navigation component of the chat UI, displaying basic info of the current session. It can show the session title, avatar, online status, input state notification, etc. The component uses a container component mode and provides a flexible slot mechanism for custom left-right operation areas.
 
-
 ## Props quick reference table
 
-
 | Field | Type | Default Value | Description |
 |------|------|--------|------|
-| [title](https://write.woa.com/#title) | string | undefined | Custom Title, session information used when not provided. |
-| [avatarUrl](https://write.woa.com/#avatarUrl) | string | undefined | Custom avatar image URL. |
-| [enableUserStatus](https://write.woa.com/#enableUserStatus) | boolean | false | Whether to display user status. |
-
-
-
+| title | string | undefined | Custom Title, session information used when not provided. |
+| avatarUrl | string | undefined | Custom avatar image URL. |
+| enableUserStatus | boolean | false | Whether to display user status. |
 
 ## Slot quick reference table
 
-
 | Name | Description |
 |------|------|
-| [ChatHeaderLeft](https://write.woa.com/#ChatHeaderLeft) | Custom content area in the left side of the header. |
-| [ChatHeaderRight](https://write.woa.com/#ChatHeaderRight) | Custom content area on the right side of the header. |
-
-
-
+| ChatHeaderLeft | Custom content area in the left side of the header. |
+| ChatHeaderRight | Custom content area on the right side of the header. |
 
 ## Props detailed introduction
 
-
 ### title
 -**Type**: string.
 
-
 - **Description**: Custom session title. When this property is not provided, the component will automatically display the title based on the session type (showing user nickname or remark for single chat, group name for group chat). Default value is `undefined`.
 
-
-
-
 ### avatarUrl
 -**Type**: string.
 
-
 - **Description**: URL address of the custom avatar image. When this property is not provided, the component will automatically display the avatar based on the session type (showing user avatar for single chat, group profile photo for group chat). Default value is `undefined`.
 
-
-
-
 ### enableUserStatus
 - **Type**: boolean.
 
-
 - **Description**: Whether to enable the display user online status feature, which only takes effect in single chat mode. When enabled, it shows the user's online/offline status. Default value is `false`.
 
-
-
-
 ## Slots detailed introduction
 
-
 ### ChatHeaderLeft
 
-
 **Description**: Header left-side custom content slot, usually used for placing navigation controls such as back button and menu button.
 
-
 #### Example: Customize the left sidebar menu
 ``` typescript
 <template>
   <ChatHeader>
     <template #ChatHeaderLeft>
       Back button, clear active session
-      <button 
+      <button
         class="nav-button"
         @click="handleBack"
       >
@@ -87,21 +60,17 @@ ChatHeader is the top navigation component of the chat UI, displaying basic info
   </ChatHeader>
 </template>
 
-
 <script setup lang="ts">
 import { ChatHeader, useConversationListState } from '@tencentcloud/chat-uikit-react';
 
-
 const { setActiveConversation } = useConversationListState();
 
-
 const handleBack = () => {
   Set active session ID to empty
   setActiveConversation('');
 };
 </script>
 
-
 <style scoped>
 .header-left-actions {
   display: flex;
@@ -109,7 +78,6 @@ const handleBack = () => {
   gap: 8px;
 }
 
-
 .nav-button {
   width: 32px;
   height: 32px;
@@ -123,23 +91,18 @@ const handleBack = () => {
   transition: background-color 0.2s;
 }
 
-
 .nav-button:hover {
   background-color: rgba(0, 0, 0, 0.05);
 }
 </style>
 ```
 
-
 ### ChatHeaderRight
 
-
 **Description**: Header right-side custom content slot, usually used for placing feature buttons such as the menu toggle of the ChatSetting component and custom call buttons.
 
-
 #### Example: Integrate the ChatSetting component through the ChatHeaderRight slot and drawer component
 
-
 [App.vue]
 ``` typescript
 <template>
@@ -161,24 +124,20 @@ const handleBack = () => {
   </TUIDrawer>
 </template>
 
-
 <script setup lang="ts">
 import {
-  ChatHeader, 
+  ChatHeader,
   ChatSetting
 } from '@tencentcloud/chat-uikit-vue3';
 import { TUIDrawer, IconHorizontalMore2 } from '@tencentcloud/uikit-base-component-vue3';
 
-
 const isChatSettingOpen = ref(false);
 
-
 const setIsSettingOpen = (isOpen: boolean) => {
   isChatSettingOpen.value = isOpen;
 };
 </script>
 
-
 <style>
 .chat-container {
   display: flex;
@@ -186,4 +145,4 @@ const setIsSettingOpen = (isOpen: boolean) => {
   height: 100vh;
 }
 </style>
-```
+```

package/resource/doc/{chatuikit → chatkit}/react/components/chat-setting.md

@@ -7,40 +7,11 @@ Core features of components:
 
 - **Status-driven** - Auto-update content based on the current active session status
 
-
 ## Props Parameters
-<table>
-<tr>
-<td rowspan="1" colSpan="1" >Parameter</td>
-
-<td rowspan="1" colSpan="1" >Type</td>
-
-<td rowspan="1" colSpan="1" >Default Value</td>
-
-<td rowspan="1" colSpan="1" >Description</td>
-</tr>
-
-<tr>
-<td rowspan="1" colSpan="1" >className</td>
-
-<td rowspan="1" colSpan="1" >string \| undefined</td>
-
-<td rowspan="1" colSpan="1" >undefined</td>
-
-<td rowspan="1" colSpan="1" >Custom CSS class name</td>
-</tr>
-
-<tr>
-<td rowspan="1" colSpan="1" >style</td>
-
-<td rowspan="1" colSpan="1" >React.CSSProperties \| undefined</td>
-
-<td rowspan="1" colSpan="1" >undefined</td>
-
-<td rowspan="1" colSpan="1" >Custom inline style</td>
-</tr>
-</table>
-
+| Parameter | Type | Default Value | Description |
+| --- | --- | --- | --- |
+| className | string \\| undefined | undefined | Custom CSS class name |
+| style | React.CSSProperties \\| undefined | undefined | Custom inline style |
 
 ## Quick Usage
 
@@ -48,11 +19,11 @@ Core features of components:
 ``` tsx
 function App() {
   const { isChatSettingOpen, setChatSettingOpen } = useUIOpenControlState();
-  
+
   function toggleChatSettingOpen() {
     setChatSettingOpen(!isChatSettingOpen);
   }
-  
+
   return (
      <UIKitProvider>
         <div style={{ maxWidth: '300px' }}>

package/resource/doc/{chatuikit → chatkit}/react/components/chat.md

@@ -4,23 +4,17 @@
 
 The chat component is responsible for rendering the chat interface, including the chat window header component ChatHeader, the message list component MessageList, and the message input component MessageInput.
 
-
 ## Component composition
 
-
 The Chat component includes the following content:
 -**ChatHeader**: Chat window header component
 
-
 - **MessageList**: Message list component. The message list component includes message operation capabilities. For detailed properties, read the MessageList component document.
 
-
 - **MessageInput**: Message input component
 
-
 ## Basic Usage
 
-
 Chat components can be used without any required attributes.
 ``` typescript
 <template>

package/resource/doc/{chatuikit → chatkit}/react/components/component-list.md

@@ -1,15 +1,11 @@
 # atomicx component library Application scenarios and considerations for components
 
-
 ## component list
 
-
 25 components:
 
-
 ### Components suitable for chat scenario
 
-
 1. ConversationList
   Session list component, suitable for chat scenario, in vertical list form, can switch sessions through click. If only chat is needed, this component is optional.
 2. MessageInput
@@ -23,26 +19,19 @@
 6. Search
   Search component, used for message search, user search, etc. If only chat is needed, this component is optional.
 
-
   Microphone control button, suitable for meeting and live-streaming scenarios, used for mute/unmute.
 
-
 universal component
 
-
 1. Avatar
   Common avatar component, displays user profile photo/online status/message unread count
 2. UserPicker
   User selector, used for initiating group chat, group video, or group voice calls in user selection scenarios.
 
-
 Must-Knows
 
-
 1. When receiving user needs, the response should be divided into two parts: the first part is the minimum components to meet the requirements, and the second part is the recommended additional extension components. Do not enlarge user needs.
 2. Components for different scenarios have intersection.
 3. Determine if it might be a comprehensive scenario according to user needs, such as chat + live stream, with low probability. Proceed with caution.
 4. To learn about the method of use for specific components, ask the user: "You can ask how to use ${components[0].name}?"
 5. When creating a real project, call MCP Tools get_component_detail ${integration} integration guide of components
-
-