ChatSetting

组件概述
ChatSetting 是一个智能的聊天设置组件，它能够根据当前激活的会话类型自动渲染相应的设置界面。该组件内部集成了 C2C（1 对 1）聊天设置和群聊设置两种模式，为用户提供了统一的聊天设置入口。
组件的核心特点：
自动适配 - 根据会话类型自动切换设置界面
状态驱动 - 基于当前激活会话状态自动更新内容
Props 参数
参数
类型
默认值
描述
className
string | undefined
undefined
自定义 CSS 类名
style
React.CSSProperties | undefined
undefined
自定义内联样式
快速使用
ChatSetting 是一个可自由使用的独立组件，默认的开关控制在 ChatHeader 组件上，也可以使用 useUIOpenControlState Hook 自定义 ChatSetting 的开关。
function App() {
  const { isChatSettingOpen, setChatSettingOpen } = useUIOpenControlState();
  
  function toggleChatSettingOpen() {
    setChatSettingOpen(!isChatSettingOpen);
  }
  
  return (
     <UIKitProvider>
        <div style={{ maxWidth: '300px' }}>
          <ConversationList />
        </div>
        <Chat
          PlaceholderEmpty={null}
          style={{
            display: 'flex',
            flexDirection: 'row',
            flex: 1,
            maxHeight: '100vh',
          }}
        >
          <div style={{
            display: 'flex',
            flexDirection: 'column',
            flex: 1,
            minWidth: '0',
          }}
          >
            <button onClick={toggleChatSetting}>toggle</button>
            <MessageList />
            <MessageInput />
          </div>
          {isChatSettingOpen && <ChatSetting style={{ width: '350px' }} />}
        </Chat>
      </UIKitProvider>
  );
}
参数	类型	默认值	描述
className	string \| undefined	undefined	自定义 CSS 类名
style	React.CSSProperties \| undefined	undefined	自定义内联样式