@gravity-ui/aikit 0.0.1

package/dist/src/components/organisms/MessageList/i18n/en.json

@@ -0,0 +1,4 @@
+{
+    "default-error-text": "(｡•́︿•̀｡) Whoops, something went wrong",
+    "retry-button": "Retry"
+}

package/dist/src/components/organisms/MessageList/i18n/index.d.ts

@@ -0,0 +1,13 @@
+export declare const i18n: ((key: "default-error-text" | "retry-button", params?: import("@gravity-ui/i18n").Params) => string) & {
+    Translation: import("react").ComponentType<{
+        children: (props: {
+            t: (key: "default-error-text" | "retry-button", params?: import("@gravity-ui/i18n").Params) => string;
+        }) => React.ReactNode;
+    }>;
+    useTranslation: () => {
+        t: (key: "default-error-text" | "retry-button", params?: import("@gravity-ui/i18n").Params) => string;
+    };
+    keysetData: {
+        "g-aikit-MessageList": Record<"default-error-text" | "retry-button", import("@gravity-ui/i18n").KeyData>;
+    };
+};

package/dist/src/components/organisms/MessageList/i18n/index.js

@@ -0,0 +1,5 @@
+import { addComponentKeysets } from '@gravity-ui/uikit/i18n';
+import { NAMESPACE } from '../../../../utils/cn';
+import en from './en.json';
+import ru from './ru.json';
+export const i18n = addComponentKeysets({ en, ru }, `${NAMESPACE}MessageList`);

package/dist/src/components/organisms/MessageList/i18n/ru.json

@@ -0,0 +1,4 @@
+{
+    "default-error-text": "(｡•́︿•̀｡) Упс, что-то пошло не так",
+    "retry-button": "Повторить"
+}

package/dist/src/components/organisms/MessageList/index.d.ts

@@ -0,0 +1 @@
+export * from './MessageList';

package/dist/src/components/organisms/MessageList/index.js

@@ -0,0 +1 @@
+export * from './MessageList';

package/dist/src/components/organisms/PromptInput/PromptInput.d.ts

@@ -0,0 +1,44 @@
+import { ChatStatus, TSubmitData } from '../../../types';
+import { PromptInputBodyConfig, PromptInputFooterConfig, PromptInputHeaderConfig, PromptInputPanelConfig, PromptInputSuggestionsConfig } from './types';
+import './PromptInput.scss';
+/**
+ * Props for the PromptInput component
+ */
+export type PromptInputProps = {
+    /** View variant: 'full' with all features, 'simple' with minimal UI */
+    view?: 'full' | 'simple';
+    /** Callback when message is sent */
+    onSend: (data: TSubmitData) => Promise<void>;
+    /** Callback when sending is cancelled */
+    onCancel?: () => Promise<void>;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Chat status to determine input behavior */
+    status?: ChatStatus;
+    /** Maximum length of input */
+    maxLength?: number;
+    /** Header-related props */
+    headerProps?: PromptInputHeaderConfig;
+    /** Body/textarea-related props */
+    bodyProps?: PromptInputBodyConfig;
+    /** Footer-related props */
+    footerProps?: PromptInputFooterConfig;
+    /** Suggestions-related props */
+    suggestionsProps?: PromptInputSuggestionsConfig;
+    /** Top panel configuration */
+    topPanel?: PromptInputPanelConfig;
+    /** Bottom panel configuration */
+    bottomPanel?: PromptInputPanelConfig;
+    /** Additional CSS class */
+    className?: string;
+    /** QA/test identifier */
+    qa?: string;
+};
+/**
+ * PromptInput component - a flexible input component for chat interfaces
+ * with support for simple and full views, attachments, suggestions, and expandable panels
+ *
+ * @param props - Component props
+ * @returns React component
+ */
+export declare function PromptInput(props: PromptInputProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/organisms/PromptInput/PromptInput.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { PromptInputFull } from './PromptInputFull';
+import { PromptInputSimple } from './PromptInputSimple';
+import { PromptInputWithPanels } from './PromptInputWithPanels';
+import { PromptInputWithSuggestions } from './PromptInputWithSuggestions';
+import { usePromptInput } from './usePromptInput';
+import './PromptInput.scss';
+/**
+ * PromptInput component - a flexible input component for chat interfaces
+ * with support for simple and full views, attachments, suggestions, and expandable panels
+ *
+ * @param props - Component props
+ * @returns React component
+ */
+export function PromptInput(props) {
+    const { view = 'simple', onSend, onCancel, disabled = false, status = 'ready', maxLength, headerProps, bodyProps, footerProps, suggestionsProps, topPanel, bottomPanel, className, qa, } = props;
+    const hookState = usePromptInput({
+        onSend,
+        onCancel,
+        disabled,
+        status,
+        maxLength,
+    });
+    // Handle suggestion click with custom handler or default to input change
+    const handleSuggestionClick = (suggestion) => {
+        if (suggestionsProps === null || suggestionsProps === void 0 ? void 0 : suggestionsProps.onSuggestionClick) {
+            suggestionsProps.onSuggestionClick(suggestion);
+        }
+        else {
+            hookState.handleChange(suggestion);
+        }
+    };
+    const isFullView = view === 'full';
+    // Prepare suggestions props with wrapped handler
+    const wrappedSuggestionsProps = suggestionsProps
+        ? Object.assign(Object.assign({}, suggestionsProps), { onSuggestionClick: handleSuggestionClick }) : undefined;
+    return (_jsx(PromptInputWithSuggestions, { suggestionsProps: wrappedSuggestionsProps, children: _jsx(PromptInputWithPanels, { topPanel: topPanel, bottomPanel: bottomPanel, children: isFullView ? (_jsx(PromptInputFull, { hookState: hookState, headerProps: headerProps, bodyProps: bodyProps, footerProps: footerProps, className: className, qa: qa })) : (_jsx(PromptInputSimple, { hookState: hookState, bodyProps: bodyProps, footerProps: footerProps, className: className, qa: qa })) }) }));
+}

package/dist/src/components/organisms/PromptInput/PromptInputFull.d.ts

@@ -0,0 +1,26 @@
+import { PromptInputBodyConfig, PromptInputFooterConfig, PromptInputHeaderConfig } from './types';
+import { UsePromptInputReturn } from './usePromptInput';
+/**
+ * Props for the PromptInputFull component
+ */
+export type PromptInputFullProps = {
+    /** Hook return value with state and handlers */
+    hookState: UsePromptInputReturn;
+    /** Header-related props */
+    headerProps?: PromptInputHeaderConfig;
+    /** Body/textarea-related props */
+    bodyProps?: PromptInputBodyConfig;
+    /** Footer-related props */
+    footerProps?: PromptInputFooterConfig;
+    /** Additional CSS class */
+    className?: string;
+    /** QA/test identifier */
+    qa?: string;
+};
+/**
+ * PromptInputFull component - full view with header, body, and footer
+ *
+ * @param props - Component props
+ * @returns React component
+ */
+export declare function PromptInputFull(props: PromptInputFullProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/organisms/PromptInput/PromptInputFull.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { block } from '../../../utils/cn';
+import { PromptInputBody } from '../../molecules/PromptInputBody';
+import { PromptInputFooter } from '../../molecules/PromptInputFooter';
+import { PromptInputHeader } from '../../molecules/PromptInputHeader';
+const b = block('prompt-input');
+/**
+ * PromptInputFull component - full view with header, body, and footer
+ *
+ * @param props - Component props
+ * @returns React component
+ */
+export function PromptInputFull(props) {
+    const { hookState, headerProps = {}, bodyProps = {}, footerProps = {}, className, qa } = props;
+    const { topContent, contextItems = [], showContextIndicator = false, contextIndicatorProps, } = headerProps;
+    const { placeholder = 'Plan, code, build and test anything', minRows = 1, maxRows = 15, autoFocus = false, } = bodyProps;
+    const { bottomContent, showSettings = false, onSettingsClick, showAttachment = false, onAttachmentClick, showMicrophone = false, onMicrophoneClick, } = footerProps;
+    const { value, submitButtonState, handleChange, handleKeyDown, handleSubmit } = hookState;
+    const shouldShowHeader = topContent || contextItems.length > 0 || showContextIndicator;
+    const shouldShowFooter = true;
+    return (_jsxs("div", { className: b({ view: 'full' }, className), "data-qa": qa, children: [shouldShowHeader && (_jsx(PromptInputHeader, { contextItems: contextItems, showContextIndicator: showContextIndicator, contextIndicatorProps: contextIndicatorProps, children: topContent })), _jsx(PromptInputBody, { value: value, placeholder: placeholder, minRows: minRows, maxRows: maxRows, autoFocus: autoFocus, onChange: handleChange, onKeyDown: handleKeyDown }), shouldShowFooter && (_jsx(PromptInputFooter, { submitButton: {
+                    onClick: handleSubmit,
+                    state: submitButtonState,
+                }, showSettings: showSettings, onSettingsClick: onSettingsClick, showAttachment: showAttachment, onAttachmentClick: onAttachmentClick, showMicrophone: showMicrophone, onMicrophoneClick: onMicrophoneClick, children: bottomContent }))] }));
+}

package/dist/src/components/organisms/PromptInput/PromptInputSimple.d.ts

@@ -0,0 +1,24 @@
+import { PromptInputBodyConfig, PromptInputFooterConfig } from './types';
+import { UsePromptInputReturn } from './usePromptInput';
+/**
+ * Props for the PromptInputSimple component
+ */
+export type PromptInputSimpleProps = {
+    /** Hook return value with state and handlers */
+    hookState: UsePromptInputReturn;
+    /** Body/textarea-related props */
+    bodyProps?: PromptInputBodyConfig;
+    /** Footer-related props */
+    footerProps?: PromptInputFooterConfig;
+    /** Additional CSS class */
+    className?: string;
+    /** QA/test identifier */
+    qa?: string;
+};
+/**
+ * PromptInputSimple component - simple view with just body and footer
+ *
+ * @param props - Component props
+ * @returns React component
+ */
+export declare function PromptInputSimple(props: PromptInputSimpleProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/organisms/PromptInput/PromptInputSimple.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { block } from '../../../utils/cn';
+import { PromptInputBody } from '../../molecules/PromptInputBody';
+import { PromptInputFooter } from '../../molecules/PromptInputFooter';
+const b = block('prompt-input');
+/**
+ * PromptInputSimple component - simple view with just body and footer
+ *
+ * @param props - Component props
+ * @returns React component
+ */
+export function PromptInputSimple(props) {
+    const { hookState, bodyProps = {}, footerProps = {}, className, qa } = props;
+    const { placeholder = 'Plan, code, build and test anything', minRows = 1, maxRows = 15, autoFocus = false, } = bodyProps;
+    const { bottomContent, showAttachment = false, onAttachmentClick, showMicrophone = false, onMicrophoneClick, } = footerProps;
+    const { value, submitButtonState, handleChange, handleKeyDown, handleSubmit } = hookState;
+    return (_jsx("div", { className: b({ view: 'simple' }, className), "data-qa": qa, children: _jsxs("div", { className: b('content'), children: [_jsx(PromptInputBody, { value: value, placeholder: placeholder, minRows: minRows, maxRows: maxRows, autoFocus: autoFocus, onChange: handleChange, onKeyDown: handleKeyDown }), _jsx(PromptInputFooter, { submitButton: {
+                        onClick: handleSubmit,
+                        state: submitButtonState,
+                    }, showAttachment: showAttachment, onAttachmentClick: onAttachmentClick, showMicrophone: showMicrophone, onMicrophoneClick: onMicrophoneClick, buttonSize: "l", children: bottomContent })] }) }));
+}

package/dist/src/components/organisms/PromptInput/PromptInputWithPanels.d.ts

@@ -0,0 +1,24 @@
+import { ReactNode } from 'react';
+import { PromptInputPanelConfig } from './types';
+/**
+ * Props for the PromptInputWithPanels component
+ */
+export type PromptInputWithPanelsProps = {
+    /** Child component (PromptInput view) */
+    children: ReactNode;
+    /** Top panel configuration */
+    topPanel?: PromptInputPanelConfig;
+    /** Bottom panel configuration */
+    bottomPanel?: PromptInputPanelConfig;
+    /** Additional CSS class */
+    className?: string;
+    /** QA/test identifier */
+    qa?: string;
+};
+/**
+ * PromptInputWithPanels component - wrapper that shows expandable panels around the prompt input
+ *
+ * @param props - Component props
+ * @returns React component
+ */
+export declare function PromptInputWithPanels(props: PromptInputWithPanelsProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/organisms/PromptInput/PromptInputWithPanels.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { block } from '../../../utils/cn';
+import { PromptInputPanel } from '../../molecules/PromptInputPanel';
+import { useDelayedUnmount } from './useDelayedUnmount';
+const b = block('prompt-input');
+/**
+ * PromptInputWithPanels component - wrapper that shows expandable panels around the prompt input
+ *
+ * @param props - Component props
+ * @returns React component
+ */
+export function PromptInputWithPanels(props) {
+    var _a, _b;
+    const { children, topPanel, bottomPanel, className, qa } = props;
+    // Use hook to delay unmounting for animation
+    const shouldRenderTopPanel = useDelayedUnmount((_a = topPanel === null || topPanel === void 0 ? void 0 : topPanel.isOpen) !== null && _a !== void 0 ? _a : false, 300);
+    const shouldRenderBottomPanel = useDelayedUnmount((_b = bottomPanel === null || bottomPanel === void 0 ? void 0 : bottomPanel.isOpen) !== null && _b !== void 0 ? _b : false, 300);
+    return (_jsxs("div", { className: b('panel-wrapper', className), "data-qa": qa, children: [topPanel && shouldRenderTopPanel && (_jsx("div", { className: b('panel', { position: 'top', open: topPanel.isOpen }), children: _jsx(PromptInputPanel, { children: topPanel.children }) })), children, bottomPanel && shouldRenderBottomPanel && (_jsx("div", { className: b('panel', { position: 'bottom', open: bottomPanel.isOpen }), children: _jsx(PromptInputPanel, { children: bottomPanel.children }) }))] }));
+}

package/dist/src/components/organisms/PromptInput/PromptInputWithSuggestions.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode } from 'react';
+import { PromptInputSuggestionsConfig } from './types';
+/**
+ * Props for the PromptInputWithSuggestions component
+ */
+export type PromptInputWithSuggestionsProps = {
+    /** Child component (PromptInput) */
+    children: ReactNode;
+    /** Suggestions-related props */
+    suggestionsProps?: PromptInputSuggestionsConfig;
+    /** Additional CSS class */
+    className?: string;
+    /** QA/test identifier */
+    qa?: string;
+};
+/**
+ * PromptInputWithSuggestions component - wrapper that shows suggestions above the prompt input
+ *
+ * @param props - Component props
+ * @returns React component
+ */
+export declare function PromptInputWithSuggestions(props: PromptInputWithSuggestionsProps): import("react/jsx-runtime").JSX.Element;

package/dist/src/components/organisms/PromptInput/PromptInputWithSuggestions.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { block } from '../../../utils/cn';
+import { Suggestions } from '../../molecules/Suggestions';
+const b = block('prompt-input');
+/**
+ * PromptInputWithSuggestions component - wrapper that shows suggestions above the prompt input
+ *
+ * @param props - Component props
+ * @returns React component
+ */
+export function PromptInputWithSuggestions(props) {
+    const { children, suggestionsProps = {}, className, qa } = props;
+    const { showSuggestions = false, suggestions, onSuggestionClick, suggestionsLayout, suggestionsTextAlign = 'center', } = suggestionsProps;
+    const hasSuggestions = showSuggestions && suggestions && suggestions.length > 0;
+    return (_jsxs("div", { className: b('suggestions-wrapper', className), "data-qa": qa, children: [hasSuggestions && (_jsx("div", { className: b('suggestions'), children: _jsx(Suggestions, { items: suggestions, onClick: onSuggestionClick || (() => { }), layout: suggestionsLayout, textAlign: suggestionsTextAlign }) })), children] }));
+}

package/dist/src/components/organisms/PromptInput/__stories__/PromptInput.stories.d.ts

@@ -0,0 +1,18 @@
+import type { Meta, StoryObj } from '@storybook/react-webpack5';
+import { PromptInput } from '../PromptInput';
+declare const _default: Meta;
+export default _default;
+type Story = StoryObj<typeof PromptInput>;
+export declare const Playground: Story;
+export declare const FullView: Story;
+export declare const WithSuggestions: Story;
+export declare const WithContextIndicator: Story;
+export declare const WithCustomTopContent: Story;
+export declare const WithCustomBottomContent: Story;
+export declare const WithTopPanel: Story;
+export declare const WithBottomPanel: Story;
+export declare const WithBothPanels: Story;
+export declare const WithPanelToggle: Story;
+export declare const Disabled: Story;
+export declare const Streaming: Story;
+export declare const ComplexExample: Story;

package/dist/src/components/organisms/PromptInput/__stories__/PromptInput.stories.js

@@ -0,0 +1,278 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Xmark } from '@gravity-ui/icons';
+import { Icon } from '@gravity-ui/uikit';
+import { ContentWrapper } from '../../../../demo/ContentWrapper';
+import { SwapArea } from '../../../../demo/SwapArea';
+import { ActionButton } from '../../../atoms/ActionButton';
+import { PromptInput } from '../PromptInput';
+import MDXDocs from './Docs.mdx';
+export default {
+    title: 'organisms/PromptInput',
+    component: PromptInput,
+    parameters: {
+        docs: {
+            page: MDXDocs,
+        },
+    },
+};
+const defaultDecorators = [
+    (Story) => (_jsx(ContentWrapper, { width: "450px", children: _jsx(Story, {}) })),
+];
+const handleSend = async (data) => {
+    // eslint-disable-next-line no-console
+    console.log('Sending:', data);
+    await new Promise((resolve) => setTimeout(resolve, 1000));
+};
+export const Playground = {
+    args: {
+        view: 'simple',
+        onSend: handleSend,
+        bodyProps: {
+            placeholder: 'Plan, code, build and test anything',
+        },
+        footerProps: {
+            showAttachment: true,
+            showMicrophone: true,
+        },
+    },
+    decorators: defaultDecorators,
+};
+export const FullView = {
+    args: {
+        view: 'full',
+        onSend: handleSend,
+        bodyProps: {
+            placeholder: 'Plan, code, build and test anything',
+        },
+        headerProps: {
+            showContextIndicator: true,
+            contextIndicatorProps: {
+                type: 'percent',
+                usedContext: 24,
+            },
+        },
+        footerProps: {
+            showSettings: true,
+            showAttachment: true,
+            showMicrophone: true,
+            // eslint-disable-next-line no-console
+            onSettingsClick: () => console.log('Settings clicked'),
+            // eslint-disable-next-line no-console
+            onAttachmentClick: () => console.log('Attachment clicked'),
+            // eslint-disable-next-line no-console
+            onMicrophoneClick: () => console.log('Microphone clicked'),
+        },
+    },
+    decorators: defaultDecorators,
+};
+export const WithSuggestions = {
+    args: {
+        view: 'simple',
+        onSend: handleSend,
+        bodyProps: {
+            placeholder: 'Plan, code, build and test anything',
+        },
+        suggestionsProps: {
+            showSuggestions: true,
+            suggestions: [
+                { title: 'Write a Python function', view: 'action' },
+                { title: 'Explain this code' },
+            ],
+            // eslint-disable-next-line no-console
+            onSuggestionClick: (suggestion) => console.log('Suggestion clicked:', suggestion),
+        },
+    },
+    decorators: defaultDecorators,
+};
+export const WithContextIndicator = {
+    args: {
+        view: 'full',
+        onSend: handleSend,
+        bodyProps: {
+            placeholder: 'Plan, code, build and test anything',
+        },
+        headerProps: {
+            showContextIndicator: true,
+            contextIndicatorProps: {
+                type: 'percent',
+                usedContext: 24,
+            },
+        },
+    },
+    decorators: defaultDecorators,
+};
+export const WithCustomTopContent = {
+    args: {
+        view: 'full',
+        onSend: handleSend,
+        bodyProps: {
+            placeholder: 'Plan, code, build and test anything',
+        },
+        headerProps: {
+            topContent: _jsx(SwapArea, {}),
+        },
+    },
+    decorators: defaultDecorators,
+};
+export const WithCustomBottomContent = {
+    args: {
+        view: 'full',
+        onSend: handleSend,
+        bodyProps: {
+            placeholder: 'Plan, code, build and test anything',
+        },
+        footerProps: {
+            bottomContent: _jsx(SwapArea, {}),
+        },
+    },
+    decorators: defaultDecorators,
+};
+export const WithTopPanel = {
+    args: {
+        view: 'simple',
+        onSend: handleSend,
+        bodyProps: {
+            placeholder: 'Plan, code, build and test anything',
+        },
+        topPanel: {
+            isOpen: true,
+            children: _jsx(SwapArea, {}),
+        },
+    },
+    decorators: defaultDecorators,
+};
+export const WithBottomPanel = {
+    args: {
+        view: 'simple',
+        onSend: handleSend,
+        bodyProps: {
+            placeholder: 'Plan, code, build and test anything',
+        },
+        bottomPanel: {
+            isOpen: true,
+            children: _jsx(SwapArea, {}),
+        },
+    },
+    decorators: defaultDecorators,
+};
+export const WithBothPanels = {
+    args: {
+        view: 'full',
+        onSend: handleSend,
+        bodyProps: {
+            placeholder: 'Plan, code, build and test anything',
+        },
+        headerProps: {
+            showContextIndicator: true,
+            contextIndicatorProps: {
+                type: 'percent',
+                usedContext: 24,
+            },
+        },
+        topPanel: {
+            isOpen: true,
+            children: _jsx(SwapArea, {}),
+        },
+        bottomPanel: {
+            isOpen: true,
+            children: _jsx(SwapArea, {}),
+        },
+    },
+    decorators: defaultDecorators,
+};
+const PanelExample = ({ onClose }) => {
+    return (_jsxs(_Fragment, { children: [_jsx(SwapArea, {}), _jsx(ActionButton, { view: "flat", size: "m", onClick: onClose, children: _jsx(Icon, { data: Xmark, size: 16 }) })] }));
+};
+export const WithPanelToggle = {
+    render: () => {
+        const [isTopPanelOpen, setIsTopPanelOpen] = useState(false);
+        const [isBottomPanelOpen, setIsBottomPanelOpen] = useState(false);
+        return (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: '16px' }, children: [_jsxs("div", { style: { display: 'flex', gap: '8px' }, children: [_jsx(ActionButton, { view: "action", size: "m", onClick: () => setIsTopPanelOpen((prev) => !prev), children: "Toggle Top Panel" }), _jsx(ActionButton, { view: "action", size: "m", onClick: () => setIsBottomPanelOpen((prev) => !prev), children: "Toggle Bottom Panel" })] }), _jsx(PromptInput, { view: "full", onSend: handleSend, bodyProps: {
+                        placeholder: 'Plan, code, build and test anything',
+                    }, topPanel: {
+                        isOpen: isTopPanelOpen,
+                        children: _jsx(PanelExample, { onClose: () => setIsTopPanelOpen(false) }),
+                    }, bottomPanel: {
+                        isOpen: isBottomPanelOpen,
+                        children: _jsx(PanelExample, { onClose: () => setIsBottomPanelOpen(false) }),
+                    } })] }));
+    },
+    decorators: defaultDecorators,
+};
+export const Disabled = {
+    args: {
+        view: 'simple',
+        onSend: handleSend,
+        disabled: true,
+        bodyProps: {
+            placeholder: 'Plan, code, build and test anything',
+        },
+    },
+    decorators: defaultDecorators,
+};
+export const Streaming = {
+    render: (args) => {
+        const [status, setStatus] = useState('ready');
+        const handleSendWithStreaming = async (data) => {
+            // eslint-disable-next-line no-console
+            console.log('Sending:', data);
+            setStatus('streaming');
+            await new Promise((resolve) => setTimeout(resolve, 3000));
+            setStatus('ready');
+        };
+        const handleCancel = async () => {
+            // eslint-disable-next-line no-console
+            console.log('Cancelling');
+            setStatus('ready');
+        };
+        return (_jsx(PromptInput, Object.assign({}, args, { view: "full", onSend: handleSendWithStreaming, onCancel: handleCancel, status: status, bodyProps: {
+                placeholder: 'Plan, code, build and test anything',
+            }, footerProps: {
+                showSettings: true,
+                showAttachment: true,
+                showMicrophone: true,
+            } })));
+    },
+    decorators: defaultDecorators,
+};
+export const ComplexExample = {
+    render: (args) => {
+        const [status, setStatus] = useState('ready');
+        const handleSendComplex = async (data) => {
+            // eslint-disable-next-line no-console
+            console.log('Sending:', data);
+            setStatus('streaming');
+            await new Promise((resolve) => setTimeout(resolve, 2000));
+            setStatus('ready');
+        };
+        const handleCancel = async () => {
+            // eslint-disable-next-line no-console
+            console.log('Cancelling');
+            setStatus('ready');
+        };
+        return (_jsx(PromptInput, Object.assign({}, args, { view: "full", onSend: handleSendComplex, onCancel: handleCancel, status: status, bodyProps: {
+                placeholder: 'Plan, code, build and test anything',
+            }, headerProps: {
+                showContextIndicator: true,
+                contextIndicatorProps: {
+                    type: 'percent',
+                    usedContext: 24,
+                },
+            }, footerProps: {
+                showSettings: true,
+                showAttachment: true,
+                showMicrophone: true,
+                // eslint-disable-next-line no-console
+                onSettingsClick: () => console.log('Settings'),
+                // eslint-disable-next-line no-console
+                onAttachmentClick: () => console.log('Attachment'),
+                // eslint-disable-next-line no-console
+                onMicrophoneClick: () => console.log('Microphone'),
+            }, suggestionsProps: {
+                showSuggestions: status !== 'streaming',
+                suggestions: [{ title: 'Yes', view: 'action' }, { title: 'No' }],
+            } })));
+    },
+    decorators: defaultDecorators,
+};

package/dist/src/components/organisms/PromptInput/index.d.ts

@@ -0,0 +1,8 @@
+export { PromptInput, type PromptInputProps } from './PromptInput';
+export { PromptInputFull, type PromptInputFullProps } from './PromptInputFull';
+export { PromptInputSimple, type PromptInputSimpleProps } from './PromptInputSimple';
+export { PromptInputWithPanels, type PromptInputWithPanelsProps } from './PromptInputWithPanels';
+export { PromptInputWithSuggestions, type PromptInputWithSuggestionsProps, } from './PromptInputWithSuggestions';
+export { type PromptInputBodyConfig, type PromptInputFooterConfig, type PromptInputHeaderConfig, type PromptInputPanelConfig, type PromptInputSuggestionsConfig, } from './types';
+export { usePromptInput, type UsePromptInputProps, type UsePromptInputReturn, } from './usePromptInput';
+export { useDelayedUnmount } from './useDelayedUnmount';

package/dist/src/components/organisms/PromptInput/index.js

@@ -0,0 +1,7 @@
+export { PromptInput } from './PromptInput';
+export { PromptInputFull } from './PromptInputFull';
+export { PromptInputSimple } from './PromptInputSimple';
+export { PromptInputWithPanels } from './PromptInputWithPanels';
+export { PromptInputWithSuggestions, } from './PromptInputWithSuggestions';
+export { usePromptInput, } from './usePromptInput';
+export { useDelayedUnmount } from './useDelayedUnmount';