Chat
1. Getting Started

Configuration & Theme Colors

Configuration & Theme Colors

All global defaults live in config/chat.php. Every setting in this file serves as a default that can also be overridden per chat in your PHP Chat class.

return [
    'route_prefix' => env('CHAT_ROUTE_PREFIX', 'api/chat'),
    'middleware' => ['web'],
    'user_model' => App\Models\User::class,

    'chat_directories' => [
        app_path('Chats'),
        app_path('Ai/Chats'),
    ],

    'chats' => [
        // \App\Chats\SupportChat::class,
    ],

    // When max_conversations is 1, the "New Conversation" button is hidden
    'max_conversations' => (int) env('CHAT_MAX_CONVERSATIONS', 5),
    'messages_per_page' => (int) env('CHAT_MESSAGES_PER_PAGE', 10),
    'conversations_per_page' => (int) env('CHAT_CONVERSATIONS_PER_PAGE', 15),

    'allow_guests' => (bool) env('CHAT_ALLOW_GUESTS', false),
    'can_send_location' => (bool) env('CHAT_CAN_SEND_LOCATION', false),
    'play_sound' => (bool) env('CHAT_PLAY_SOUND', true),

    'limits' => [
        'rate_limit_per_minute' => (int) env('CHAT_RATE_LIMIT_PER_MINUTE', 15),
        'max_message_length' => (int) env('CHAT_MAX_MESSAGE_LENGTH', 2000),
        'max_tokens' => (int) env('CHAT_MAX_TOKENS', 4096),
    ],

    'attachments' => [
        'disk' => env('CHAT_ATTACHMENTS_DISK', 'public'),
        'directory' => 'chat-attachments',
        'allowed' => [
            ['extensions' => ['jpg', 'jpeg', 'png', 'webp'], 'max_kb' => 2048],
            ['extensions' => ['pdf', 'txt', 'csv'], 'max_kb' => 5120],
        ],
    ],

    'queue' => env('CHAT_QUEUE', 'default'),
    'broadcast_channel_prefix' => env('CHAT_CHANNEL_PREFIX', 'tokomono-chat'),

    'colors' => [
        'primary' => '#2563eb',          // --chat-primary
        'primary_hover' => '#1d4ed8',    // --chat-primary-hover
        'primary_text' => '#ffffff',     // --chat-primary-text
        'background' => '#ffffff',       // --chat-bg
        'surface' => '#f9fafb',          // --chat-surface
        'header_bg' => '#1e293b',        // --chat-header-bg
        'header_text' => '#ffffff',      // --chat-header-text
        'user_bubble_bg' => '#2563eb',   // --chat-user-bubble-bg
        'user_bubble_text' => '#ffffff', // --chat-user-bubble-text
        'bot_bubble_bg' => '#f3f4f6',    // --chat-bot-bubble-bg
        'bot_bubble_text' => '#111827',  // --chat-bot-bubble-text
        'border' => '#e5e7eb',           // --chat-border
        'text' => '#111827',             // --chat-text
        'text_muted' => '#6b7280',       // --chat-text-muted
        'online' => '#22c55e',           // --chat-online
        'offline' => '#ef4444',          // --chat-offline
    ],
];

Dynamic CSS Variables

When the frontend initializes a chat via GET /api/chat/{hash}/init, Chat::toFrontendConfig() converts the colors array into CSS custom properties (--chat-primary, --chat-header-bg, etc.) and binds them directly to the root container of <TokomonoChat /> and <TokomonoChatWidget />.