Hiyve Components - v1.0.0
    Preparing search index...

    Interface ChatPanelStyles

    Style configuration for the ChatPanel component.

    Controls spacing, sizing, and visual properties of the chat interface.

    import { defaultChatPanelStyles } from '@hiyve/react-collaboration';

    // Compact chat for embedded sidebar
    const compactStyles: Partial<ChatPanelStyles> = {
      avatarSize: 28,
      avatarFontSize: '0.65rem',
      messageMaxWidth: '85%',
      messageBorderRadius: 12,
      headerPaddingX: 12,
      headerPaddingY: 8,
    };

    <ChatPanel styles={compactStyles} />
    interface ChatPanelStyles {
        avatarFontSize: string;
        avatarSize: number;
        borderRadius: number;
        headerPaddingX: number;
        headerPaddingY: number;
        inputBorderRadius: number;
        inputPadding: number;
        messageBorderRadius: number;
        messageMaxWidth: string;
        messagesPaddingX: number;
        messagesPaddingY: number;
        systemMessageBorderRadius: number;
        systemMessagePaddingX: number;
        systemMessagePaddingY: number;
        timestampFontSize: string;
    }
    Index

    Properties

    avatarFontSize avatarSize borderRadius headerPaddingX headerPaddingY inputBorderRadius inputPadding messageBorderRadius messageMaxWidth messagesPaddingX messagesPaddingY systemMessageBorderRadius systemMessagePaddingX systemMessagePaddingY timestampFontSize

    Properties

    avatarFontSize: string

    Avatar font size

    avatarSize: number

    Avatar size in pixels

    borderRadius: number

    Container border radius in pixels

    headerPaddingX: number

    Header horizontal padding in pixels

    headerPaddingY: number

    Header vertical padding in pixels

    inputBorderRadius: number

    Input field border radius in pixels

    inputPadding: number

    Input area padding in pixels

    messageBorderRadius: number

    Message bubble border radius in pixels

    messageMaxWidth: string

    Message bubble max width (e.g., '70%', '80%')

    messagesPaddingX: number

    Messages area horizontal padding in pixels

    messagesPaddingY: number

    Messages area vertical padding in pixels

    systemMessageBorderRadius: number

    System message border radius in pixels

    systemMessagePaddingX: number

    System message horizontal padding in pixels

    systemMessagePaddingY: number

    System message vertical padding in pixels

    timestampFontSize: string

    Timestamp font size

    Settings

    Member Visibility

    On This Page

    Properties