@gravity-ui/aikit 1.3.1 → 1.3.3

package/LICENSE

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2023 YANDEX LLC
+Copyright (c) 2025 YANDEX LLC
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/dist/components/pages/ChatContainer/ChatContainer.js

@@ -44,12 +44,13 @@ export function ChatContainer(props) {
         return true;
     }, [hideTitleOnEmptyChat, isChatEmpty, headerProps.showTitle]);
     // Build props for Header
-    const finalHeaderProps = useMemo(() => (Object.assign(Object.assign({}, headerProps), { title: headerTitle, showTitle, baseActions: hookState.baseActions, handleNewChat: hookState.handleNewChat, handleHistoryToggle: hookState.handleHistoryToggle, handleClose: hookState.handleClose, historyButtonRef: hookState.historyButtonRef })), [
+    const finalHeaderProps = useMemo(() => (Object.assign(Object.assign({}, headerProps), { title: headerTitle, showTitle, baseActions: hookState.baseActions, handleNewChat: hookState.handleNewChat, handleHistoryToggle: hookState.handleHistoryToggle, handleFolding: hookState.handleFolding, handleClose: hookState.handleClose, historyButtonRef: hookState.historyButtonRef })), [
         headerTitle,
         showTitle,
         hookState.baseActions,
         hookState.handleNewChat,
         hookState.handleHistoryToggle,
+        hookState.handleFolding,
         hookState.handleClose,
         hookState.historyButtonRef,
         headerProps,
@@ -57,9 +58,12 @@ export function ChatContainer(props) {
     // Build props for EmptyContainer
     const finalEmptyContainerProps = useMemo(() => {
         var _a, _b, _c, _d;
-        return Object.assign(Object.assign({}, emptyContainerProps), { image: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.image, title: (welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.title) || ((_a = i18nConfig.emptyState) === null || _a === void 0 ? void 0 : _a.title) || i18n('empty-state-title'), description: (welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.description) ||
+        const { showDefaultTitle = true, showDefaultDescription = true } = welcomeConfig || {};
+        return Object.assign(Object.assign({}, emptyContainerProps), { image: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.image, title: (welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.title) ||
+                ((_a = i18nConfig.emptyState) === null || _a === void 0 ? void 0 : _a.title) ||
+                (showDefaultTitle ? i18n('empty-state-title') : undefined), description: (welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.description) ||
                 ((_b = i18nConfig.emptyState) === null || _b === void 0 ? void 0 : _b.description) ||
-                i18n('empty-state-description'), suggestionTitle: (welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.suggestionTitle) || ((_c = i18nConfig.emptyState) === null || _c === void 0 ? void 0 : _c.suggestionsTitle), suggestions: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.suggestions, alignment: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.alignment, layout: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.layout, wrapText: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.wrapText, showMore: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.showMore, showMoreText: (welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.showMoreText) ||
+                (showDefaultDescription ? i18n('empty-state-description') : undefined), suggestionTitle: (welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.suggestionTitle) || ((_c = i18nConfig.emptyState) === null || _c === void 0 ? void 0 : _c.suggestionsTitle), suggestions: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.suggestions, alignment: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.alignment, layout: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.layout, wrapText: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.wrapText, showMore: welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.showMore, showMoreText: (welcomeConfig === null || welcomeConfig === void 0 ? void 0 : welcomeConfig.showMoreText) ||
                 ((_d = i18nConfig.emptyState) === null || _d === void 0 ? void 0 : _d.showMoreText) ||
                 i18n('empty-state-show-more'), onSuggestionClick: async (clickedTitle) => {
                 await onSendMessage({ content: clickedTitle });

package/dist/components/pages/ChatContainer/__stories__/ChatContainer.stories.js

@@ -211,6 +211,7 @@ export const Playground = {
         chats: mockChats,
         showHistory: true,
         showNewChat: true,
+        showFolding: false,
         showClose: false,
         welcomeConfig: {
             title: 'Welcome to AI Chat',
@@ -225,6 +226,7 @@ export const Playground = {
         const [messages, setMessages] = useState(addActionsToMessages(mockChatMessages[initialChat.id] || []));
         const [status, setStatus] = useState(args.status || 'ready');
         const [activeChat, setActiveChat] = useState(initialChat);
+        const [foldingState, setFoldingState] = useState('opened');
         const handleSendMessage = async (data) => {
             const userMessage = {
                 id: Date.now().toString(),
@@ -261,7 +263,9 @@ export const Playground = {
         const handleCancel = async () => {
             setStatus('ready');
         };
-        return (_jsx(ChatContainer, Object.assign({}, args, { messages: messages, activeChat: activeChat, onSendMessage: handleSendMessage, onCancel: handleCancel, onSelectChat: handleSelectChat, onCreateChat: handleCreateChat, status: status })));
+        return (_jsx(ChatContainer, Object.assign({}, args, { headerProps: {
+                foldingState,
+            }, messages: messages, activeChat: activeChat, onSendMessage: handleSendMessage, onCancel: handleCancel, onSelectChat: handleSelectChat, onCreateChat: handleCreateChat, onFold: setFoldingState, status: status })));
     },
     decorators: defaultDecorators,
 };
@@ -277,6 +281,8 @@ export const EmptyState = {
             description: 'Start a conversation by typing a message or selecting a suggestion.',
             suggestionTitle: 'Try asking:',
             suggestions: mockSuggestions,
+            showDefaultTitle: false,
+            showDefaultDescription: false,
         },
     },
     render: (args) => {

package/dist/components/pages/ChatContainer/types.d.ts

@@ -82,6 +82,10 @@ export interface WelcomeConfig {
     layout?: 'grid' | 'list';
     /** Enable text wrapping inside suggestion buttons instead of ellipsis */
     wrapText?: boolean;
+    /** Show default title when neither title nor i18nConfig.emptyState.title are provided */
+    showDefaultTitle?: boolean;
+    /** Show default description when neither description nor i18nConfig.emptyState.description are provided */
+    showDefaultDescription?: boolean;
     /** Show more suggestions callback */
     showMore?: () => void;
     /** Show more button text */
@@ -111,6 +115,8 @@ export interface ChatContainerProps {
     onDeleteChat?: (chat: ChatType) => void;
     /** Callback when user deletes all chats */
     onDeleteAllChats?: () => Promise<void>;
+    /** Callback when user folds or unfolds the chat */
+    onFold?: (value: 'collapsed' | 'opened') => void;
     /** Callback when user closes the chat */
     onClose?: () => void;
     /** Callback when user cancels streaming */
@@ -132,7 +138,7 @@ export interface ChatContainerProps {
     /** MessageList configuration for actions and loader behavior */
     messageListConfig?: MessageListConfig;
     /** Props override for Header component */
-    headerProps?: Partial<Omit<HeaderProps, 'handleNewChat' | 'handleHistoryToggle' | 'handleClose'>>;
+    headerProps?: Partial<Omit<HeaderProps, 'handleNewChat' | 'handleHistoryToggle' | 'handleFolding' | 'handleClose'>>;
     /** Props override for ChatContent component */
     contentProps?: Partial<Omit<ChatContentProps, 'view' | 'messageListProps'>>;
     /** Props override for EmptyContainer (welcome screen) */
@@ -151,6 +157,8 @@ export interface ChatContainerProps {
     showHistory?: boolean;
     /** Show new chat button */
     showNewChat?: boolean;
+    /** Show folding button */
+    showFolding?: boolean;
     /** Show close button */
     showClose?: boolean;
     /** Hide header title when chat is empty */

package/dist/components/pages/ChatContainer/useChatContainer.d.ts

@@ -13,6 +13,7 @@ export declare function useChatContainer(props: ChatContainerProps): {
     historyButtonRef: import("react").RefObject<HTMLElement>;
     handleNewChat: () => void;
     handleHistoryToggle: () => void;
+    handleFolding: (value: "collapsed" | "opened") => void;
     handleClose: () => void;
     handleSelectChat: (chat: ChatContainerProps["activeChat"]) => void;
     handleHistoryOpenChange: (open: boolean) => void;

package/dist/components/pages/ChatContainer/useChatContainer.js

@@ -7,7 +7,7 @@ import { HeaderAction } from '../../organisms/Header';
  * @returns object with state and handlers
  */
 export function useChatContainer(props) {
-    const { messages = [], activeChat, onCreateChat, onClose, onSelectChat, showHistory = true, showNewChat = true, showClose = false, } = props;
+    const { messages = [], activeChat, onCreateChat, onClose, onFold, onSelectChat, showHistory = true, showNewChat = true, showFolding = false, showClose = false, } = props;
     // Refs for History integration with Header
     const historyButtonRef = useRef(null);
     const [isHistoryOpen, setIsHistoryOpen] = useState(false);
@@ -29,6 +29,9 @@ export function useChatContainer(props) {
     const handleHistoryToggle = useCallback(() => {
         setIsHistoryOpen((prev) => !prev);
     }, []);
+    const handleFolding = useCallback((value) => {
+        onFold === null || onFold === void 0 ? void 0 : onFold(value);
+    }, [onFold]);
     // Handler for closing
     const handleClose = useCallback(() => {
         onClose === null || onClose === void 0 ? void 0 : onClose();
@@ -53,11 +56,14 @@ export function useChatContainer(props) {
         if (showHistory) {
             actions.push(HeaderAction.History);
         }
+        if (showFolding) {
+            actions.push(HeaderAction.Folding);
+        }
         if (showClose) {
             actions.push(HeaderAction.Close);
         }
         return actions;
-    }, [showNewChat, showHistory, showClose, chatContentView]);
+    }, [showNewChat, showHistory, showFolding, showClose, chatContentView]);
     return {
         // State
         chatContentView,
@@ -68,6 +74,7 @@ export function useChatContainer(props) {
         // Handlers
         handleNewChat,
         handleHistoryToggle,
+        handleFolding,
         handleClose,
         handleSelectChat,
         handleHistoryOpenChange,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/aikit",
-  "version": "1.3.1",
+  "version": "1.3.3",
   "description": "Gravity UI base kit for building ai assistant chats",
   "license": "MIT",
   "main": "./dist/index.js",