@hh.ru/magritte-ui-chat-input 1.0.1

package/package.json

@@ -0,0 +1,44 @@
+{
+  "name": "@hh.ru/magritte-ui-chat-input",
+  "version": "1.0.1",
+  "main": "index.js",
+  "types": "index.d.ts",
+  "sideEffects": [
+    "index.css"
+  ],
+  "scripts": {
+    "build": "yarn root:build $(pwd)",
+    "build-test-branch": "yarn root:build-test-branch $(pwd)",
+    "prepack": "yarn root:prepack $(pwd)",
+    "postpublish": "yarn root:postpublish $(pwd)",
+    "stylelint-check": "yarn root:stylelint-check $(pwd)",
+    "eslint-check": "yarn root:eslint-check $(pwd)",
+    "ts-config": "yarn root:ts-config $(pwd)",
+    "ts-check": "yarn root:ts-check $(pwd)",
+    "test": "yarn root:test $(pwd)",
+    "watch": "yarn root:watch $(pwd)"
+  },
+  "peerDependencies": {
+    "classnames": ">=2.3.2",
+    "motion": "^12.23.12",
+    "react": ">=18.2.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@hh.ru/magritte-common-keyboard": "4.3.4",
+    "@hh.ru/magritte-common-use-disabled": "1.0.15",
+    "@hh.ru/magritte-common-use-multiple-refs": "1.1.11",
+    "@hh.ru/magritte-common-use-translation": "3.2.0",
+    "@hh.ru/magritte-design-tokens": "24.8.0",
+    "@hh.ru/magritte-internal-slot-registry": "1.1.0",
+    "@hh.ru/magritte-ui-chips": "7.0.25",
+    "@hh.ru/magritte-ui-icon": "14.2.15",
+    "@hh.ru/magritte-ui-loader": "4.0.3",
+    "@hh.ru/magritte-ui-scrollable-container": "6.3.0",
+    "@hh.ru/magritte-ui-scrollbar": "1.0.30",
+    "@hh.ru/magritte-ui-typography": "5.3.8"
+  },
+  "gitHead": "24217e8377aee28baaafb5f7492141f1674776df"
+}

package/public/ChatInput.d.ts

@@ -0,0 +1,47 @@
+import { type ChangeEventHandler, type ForwardedRef, type ForwardRefExoticComponent, type ReactNode, type RefAttributes, type TextareaHTMLAttributes } from 'react';
+import { ChatInputChips } from '@hh.ru/magritte-ui-chat-input/public/ChatInputChips';
+import { ChatInputPreview } from '@hh.ru/magritte-ui-chat-input/public/ChatInputPreview';
+import { ChatInputSendButton } from '@hh.ru/magritte-ui-chat-input/public/ChatInputSendButton';
+import { ChatInputVoiceButton } from '@hh.ru/magritte-ui-chat-input/public/ChatInputVoiceButton';
+interface ChatInputOwnProps {
+    /** Левый слот  */
+    leftActions?: ReactNode;
+    /** Правый слот  */
+    rightActions?: ReactNode;
+    /** Центральный нижний слот  */
+    centralActions?: ReactNode;
+    /** Верхний слот для блока превью */
+    preview?: ReactNode;
+    /** Максимальная высота поля ввода в пикселях. Если не задан — высота не ограничена. */
+    maxHeight?: number;
+    /**
+     * Раскладка поля ввода.
+     * `horizontal` — ввод стоит в ряду контролов, пока содержимое помещается в одну строку,
+     * и сам переезжает на свой ряд, когда перестаёт влезать.
+     * `vertical` — ввод всегда на своём ряду; в горизонтальный слот его не ставим.
+     * @default horizontal
+     */
+    layout?: 'vertical' | 'horizontal';
+    /** Хендлер отправки: вызывается по Enter (Shift+Enter — перенос строки) */
+    onSend?: VoidFunction;
+    /** Значение поля ввода. Компонент работает только в controlled-режиме */
+    value: string;
+    /** Обработчик изменения значения */
+    onChange: ChangeEventHandler<HTMLTextAreaElement>;
+    /** Реф на корневую обёртку — для измерения размеров/позиционирования.
+     * Реф на textarea (фокус и т.п.) прокидывается обычным `ref`, как у Input/TextArea */
+    wrapperRef?: ForwardedRef<HTMLDivElement>;
+    /** Отключает фон и обводку компонента */
+    noBackground?: boolean;
+    disabled?: boolean;
+    'data-qa'?: string;
+}
+export type ChatInputProps = ChatInputOwnProps & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, keyof ChatInputOwnProps | 'defaultValue'>;
+interface ChatInputComponents {
+    Chips: typeof ChatInputChips;
+    Preview: typeof ChatInputPreview;
+    SendButton: typeof ChatInputSendButton;
+    VoiceButton: typeof ChatInputVoiceButton;
+}
+declare const ChatInput: ForwardRefExoticComponent<ChatInputProps & RefAttributes<HTMLTextAreaElement>> & ChatInputComponents;
+export { ChatInput };

package/public/ChatInput.js

@@ -0,0 +1,122 @@
+import './../index.css';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { forwardRef, useRef, useState, useLayoutEffect, useMemo, useEffect } from 'react';
+import classNames from 'classnames';
+import { useDisabled, DisabledContext } from '@hh.ru/magritte-common-use-disabled';
+import { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';
+import { ChatInputContextProvider } from '../internal/ChatInputContext.js';
+import { ModeTransition } from '../internal/ModeTransition.js';
+import { TextInput } from '../internal/TextInput.js';
+import { VoiceRecord } from '../internal/VoiceRecord.js';
+import { focusPriorityProps, FOCUS_PRIORITY } from '../internal/focusGroup.js';
+import { useRovingFocusGroup } from '../internal/useRovingFocusGroup.js';
+import { useVoiceRecordSession } from '../internal/useVoiceRecordSession.js';
+import { ChatInputVoiceSlotProvider, useVoiceConfig } from '../internal/voiceSlotRegistry.js';
+import { ChatInputChips } from './ChatInputChips.js';
+import { ChatInputPreview } from './ChatInputPreview.js';
+import { ChatInputSendButton } from './ChatInputSendButton.js';
+import { ChatInputVoiceButton } from './ChatInputVoiceButton.js';
+import { IconDefaultPropsContext } from '@hh.ru/magritte-ui-icon';
+import { s as styles } from '../styles-CQQdqOFh.js';
+import 'motion/react';
+import '@hh.ru/magritte-design-tokens/types';
+import '../internal/useSendOnEnter.js';
+import '@hh.ru/magritte-common-keyboard';
+import '@hh.ru/magritte-ui-scrollbar';
+import '@hh.ru/magritte-common-use-translation';
+import '../internal/FocusTarget.js';
+import '../internal/VoiceRecordIndicator.js';
+import '../internal/useHasSound.js';
+import '@hh.ru/magritte-ui-icon/icon';
+import '@hh.ru/magritte-ui-loader';
+import '@hh.ru/magritte-ui-typography';
+import '@hh.ru/magritte-internal-slot-registry';
+import '@hh.ru/magritte-ui-chips';
+import '@hh.ru/magritte-ui-scrollable-container';
+import '../internal/ChatInputSlotButton.js';
+
+const DEFAULT_ICON_PROPS = {
+    borderRadius: 12,
+    padding: 8,
+    initialColor: 'secondary',
+};
+const ChatInputInner = ({ leftActions, rightActions, centralActions, preview, maxHeight, layout = 'horizontal', onSend, wrapperRef, textareaRef, noBackground = false, disabled = false, 'data-qa': dataQa = 'chat-input', ...textareaProps }) => {
+    const outerDisabled = useDisabled();
+    const isDisabled = disabled || outerDisabled;
+    const rootRef = useRef(null);
+    const rootRefCallback = useMultipleRefs(rootRef, wrapperRef);
+    // реф textarea — для возврата фокуса при выходе из режима записи
+    const textareaLocalRef = useRef(null);
+    const textareaRefCallback = useMultipleRefs(textareaLocalRef, textareaRef);
+    const [containerWidth, setContainerWidth] = useState();
+    useLayoutEffect(() => {
+        const root = rootRef.current;
+        if (!root) {
+            return undefined;
+        }
+        const observer = new ResizeObserver((entries) => {
+            const width = Math.round(entries[0]?.contentRect.width ?? 0);
+            setContainerWidth((prev) => (prev === width ? prev : width));
+        });
+        observer.observe(root);
+        return () => observer.disconnect();
+    }, []);
+    // конфиг записи регистрирует ChatInput.VoiceButton через slot-registry. Кнопка живёт в
+    // text-гриде, который на время записи не размонтируется (ModeTransition лишь прячет его), —
+    // поэтому регистрация и колбэки остаются живыми всю сессию, латч не нужен
+    const voiceConfig = useVoiceConfig();
+    const voiceSession = useVoiceRecordSession(voiceConfig ?? {});
+    const contextValue = useMemo(() => ({
+        onSend,
+        startVoiceRecord: voiceSession.start,
+        voiceRecordStatus: voiceSession.status,
+    }), [onSend, voiceSession.start, voiceSession.status]);
+    // режим ведём по статусу сессии, а не по наличию конфига: даже если приложение уберёт кнопку
+    // по ходу записи, запись продолжается. Без кнопки запись не стартует, так что статус сам остаётся idle
+    const isVoiceMode = voiceSession.status === 'recording' || voiceSession.status === 'processing';
+    // roving-группа кнопок: один tab stop на все кнопки, внутри — стрелки по приоритетам
+    const { focusStop } = useRovingFocusGroup(rootRef);
+    // при входе в запись фокус на стоп группы (после смены слоя это галочка — первый приоритет
+    // слоя записи), при возврате в текст — в textarea с курсором в конце. Фокус ставим в rAF:
+    // слой режима к этому моменту уже видим (motion применил visibility), иначе focus()
+    // на visibility:hidden не сработает
+    const prevVoiceModeRef = useRef(isVoiceMode);
+    useEffect(() => {
+        const wasVoiceMode = prevVoiceModeRef.current;
+        prevVoiceModeRef.current = isVoiceMode;
+        if (wasVoiceMode === isVoiceMode) {
+            return undefined;
+        }
+        const frameId = requestAnimationFrame(() => {
+            if (isVoiceMode) {
+                focusStop();
+                return;
+            }
+            const textarea = textareaLocalRef.current;
+            if (textarea) {
+                textarea.focus();
+                const caret = textarea.value.length;
+                textarea.setSelectionRange(caret, caret);
+            }
+        });
+        return () => cancelAnimationFrame(frameId);
+    }, [isVoiceMode, focusStop]);
+    return (jsx(DisabledContext.Provider, { value: isDisabled, children: jsx(ChatInputContextProvider, { value: contextValue, children: jsx("div", { ref: rootRefCallback, className: classNames(styles.chatInput, { [styles.noBackground]: noBackground }), "data-qa": dataQa, children: jsx(ModeTransition, { mode: isVoiceMode ? 'voice' : 'text', voice: jsx(VoiceRecord, { mode: voiceSession.status === 'processing' ? 'processing' : 'recording', stream: voiceSession.stream, startedAt: voiceSession.startedAt, processingLabel: voiceConfig?.processingLabel, onComplete: voiceSession.stop, onCancel: voiceSession.cancel, completeButtonProps: voiceConfig?.completeButtonProps, cancelButtonProps: voiceConfig?.cancelButtonProps, "data-qa": "chat-input-voice-record" }), text: jsxs("div", { className: classNames(styles.contentGrid, {
+                            [styles.noLeftControls]: !leftActions,
+                            [styles.noRightControls]: !rightActions,
+                            [styles.hasCentral]: !!centralActions,
+                        }), children: [jsx(TextInput, { ...textareaProps, ref: textareaRefCallback, layout: layout, onSend: onSend, maxHeight: maxHeight, containerWidth: containerWidth, hasCentral: !!centralActions, disabled: isDisabled, hasBothSideControls: !!leftActions && !!rightActions }), !!rightActions && (jsx(IconDefaultPropsContext, { props: DEFAULT_ICON_PROPS, children: jsx("div", { className: styles.right, ...focusPriorityProps(FOCUS_PRIORITY.rightSlot), children: rightActions }) })), !!leftActions && (jsx(IconDefaultPropsContext, { props: DEFAULT_ICON_PROPS, children: jsx("div", { className: styles.left, ...focusPriorityProps(FOCUS_PRIORITY.leftSlot), children: leftActions }) })), !!centralActions && (jsx("div", { className: styles.central, ...focusPriorityProps(FOCUS_PRIORITY.centralSlot), children: centralActions })), !!preview && (jsx("div", { className: styles.preview, ...focusPriorityProps(FOCUS_PRIORITY.previewSlot), children: preview }))] }) }) }) }) }));
+};
+// внешняя обёртка держит slot-registry для конфига записи: кнопка (внутри слота) регистрирует
+// конфиг, ChatInputInner (ниже провайдера) читает его. forwardRef-реф на textarea прокидываем
+// вниз обычным пропом
+const ChatInputComponent = (props, ref) => (jsx(ChatInputVoiceSlotProvider, { children: jsx(ChatInputInner, { ...props, textareaRef: ref }) }));
+const ChatInput = forwardRef(ChatInputComponent);
+ChatInput.displayName = 'ChatInput';
+ChatInput.Chips = ChatInputChips;
+ChatInput.Preview = ChatInputPreview;
+ChatInput.SendButton = ChatInputSendButton;
+ChatInput.VoiceButton = ChatInputVoiceButton;
+
+export { ChatInput };
+//# sourceMappingURL=ChatInput.js.map

package/public/ChatInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatInput.js","sources":["src/public/ChatInput.tsx"],"sourcesContent":["import {\n    type ChangeEventHandler,\n    type FC,\n    type ForwardedRef,\n    forwardRef,\n    type ForwardRefExoticComponent,\n    type ReactNode,\n    type RefAttributes,\n    type TextareaHTMLAttributes,\n    useEffect,\n    useLayoutEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport classNames from 'classnames';\n\nimport { DisabledContext, useDisabled } from '@hh.ru/magritte-common-use-disabled';\nimport { useMultipleRefs } from '@hh.ru/magritte-common-use-multiple-refs';\nimport { ChatInputContextProvider } from '@hh.ru/magritte-ui-chat-input/internal/ChatInputContext';\nimport { ModeTransition } from '@hh.ru/magritte-ui-chat-input/internal/ModeTransition';\nimport { TextInput } from '@hh.ru/magritte-ui-chat-input/internal/TextInput';\nimport { VoiceRecord } from '@hh.ru/magritte-ui-chat-input/internal/VoiceRecord';\nimport { FOCUS_PRIORITY, focusPriorityProps } from '@hh.ru/magritte-ui-chat-input/internal/focusGroup';\nimport { useRovingFocusGroup } from '@hh.ru/magritte-ui-chat-input/internal/useRovingFocusGroup';\nimport { useVoiceRecordSession } from '@hh.ru/magritte-ui-chat-input/internal/useVoiceRecordSession';\nimport { ChatInputVoiceSlotProvider, useVoiceConfig } from '@hh.ru/magritte-ui-chat-input/internal/voiceSlotRegistry';\nimport { ChatInputChips } from '@hh.ru/magritte-ui-chat-input/public/ChatInputChips';\nimport { ChatInputPreview } from '@hh.ru/magritte-ui-chat-input/public/ChatInputPreview';\nimport { ChatInputSendButton } from '@hh.ru/magritte-ui-chat-input/public/ChatInputSendButton';\nimport { ChatInputVoiceButton } from '@hh.ru/magritte-ui-chat-input/public/ChatInputVoiceButton';\nimport { IconDefaultPropsContext } from '@hh.ru/magritte-ui-icon';\n\nimport styles from '../styles.less';\n\ninterface ChatInputOwnProps {\n    /** Левый слот  */\n    leftActions?: ReactNode;\n    /** Правый слот  */\n    rightActions?: ReactNode;\n    /** Центральный нижний слот  */\n    centralActions?: ReactNode;\n    /** Верхний слот для блока превью */\n    preview?: ReactNode;\n    /** Максимальная высота поля ввода в пикселях. Если не задан — высота не ограничена. */\n    maxHeight?: number;\n    /**\n     * Раскладка поля ввода.\n     * `horizontal` — ввод стоит в ряду контролов, пока содержимое помещается в одну строку,\n     * и сам переезжает на свой ряд, когда перестаёт влезать.\n     * `vertical` — ввод всегда на своём ряду; в горизонтальный слот его не ставим.\n     * @default horizontal\n     */\n    layout?: 'vertical' | 'horizontal';\n    /** Хендлер отправки: вызывается по Enter (Shift+Enter — перенос строки) */\n    onSend?: VoidFunction;\n    /** Значение поля ввода. Компонент работает только в controlled-режиме */\n    value: string;\n    /** Обработчик изменения значения */\n    onChange: ChangeEventHandler<HTMLTextAreaElement>;\n    /** Реф на корневую обёртку — для измерения размеров/позиционирования.\n     * Реф на textarea (фокус и т.п.) прокидывается обычным `ref`, как у Input/TextArea */\n    wrapperRef?: ForwardedRef<HTMLDivElement>;\n    /** Отключает фон и обводку компонента */\n    noBackground?: boolean;\n    disabled?: boolean;\n    'data-qa'?: string;\n}\n\n// defaultValue исключён: компонент только controlled, uncontrolled-режим не поддерживается\nexport type ChatInputProps = ChatInputOwnProps &\n    Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, keyof ChatInputOwnProps | 'defaultValue'>;\n\nconst DEFAULT_ICON_PROPS = {\n    borderRadius: 12,\n    padding: 8,\n    initialColor: 'secondary',\n} as const;\n\ninterface ChatInputComponents {\n    Chips: typeof ChatInputChips;\n    Preview: typeof ChatInputPreview;\n    SendButton: typeof ChatInputSendButton;\n    VoiceButton: typeof ChatInputVoiceButton;\n}\n\ntype ChatInputInnerProps = ChatInputProps & {\n    /** Реф на textarea, переданный через forwardRef внешней обёртки */\n    textareaRef: ForwardedRef<HTMLTextAreaElement>;\n};\n\nconst ChatInputInner: FC<ChatInputInnerProps> = ({\n    leftActions,\n    rightActions,\n    centralActions,\n    preview,\n    maxHeight,\n    layout = 'horizontal',\n    onSend,\n    wrapperRef,\n    textareaRef,\n    noBackground = false,\n    disabled = false,\n    'data-qa': dataQa = 'chat-input',\n    ...textareaProps\n}) => {\n    const outerDisabled = useDisabled();\n    const isDisabled = disabled || outerDisabled;\n    const rootRef = useRef<HTMLDivElement>(null);\n    const rootRefCallback = useMultipleRefs(rootRef, wrapperRef);\n    // реф textarea — для возврата фокуса при выходе из режима записи\n    const textareaLocalRef = useRef<HTMLTextAreaElement>(null);\n    const textareaRefCallback = useMultipleRefs(textareaLocalRef, textareaRef);\n    const [containerWidth, setContainerWidth] = useState<number>();\n    useLayoutEffect(() => {\n        const root = rootRef.current;\n        if (!root) {\n            return undefined;\n        }\n        const observer = new ResizeObserver((entries) => {\n            const width = Math.round(entries[0]?.contentRect.width ?? 0);\n            setContainerWidth((prev) => (prev === width ? prev : width));\n        });\n        observer.observe(root);\n        return () => observer.disconnect();\n    }, []);\n\n    // конфиг записи регистрирует ChatInput.VoiceButton через slot-registry. Кнопка живёт в\n    // text-гриде, который на время записи не размонтируется (ModeTransition лишь прячет его), —\n    // поэтому регистрация и колбэки остаются живыми всю сессию, латч не нужен\n    const voiceConfig = useVoiceConfig();\n\n    const voiceSession = useVoiceRecordSession(voiceConfig ?? {});\n\n    const contextValue = useMemo(\n        () => ({\n            onSend,\n            startVoiceRecord: voiceSession.start,\n            voiceRecordStatus: voiceSession.status,\n        }),\n        [onSend, voiceSession.start, voiceSession.status]\n    );\n\n    // режим ведём по статусу сессии, а не по наличию конфига: даже если приложение уберёт кнопку\n    // по ходу записи, запись продолжается. Без кнопки запись не стартует, так что статус сам остаётся idle\n    const isVoiceMode = voiceSession.status === 'recording' || voiceSession.status === 'processing';\n\n    // roving-группа кнопок: один tab stop на все кнопки, внутри — стрелки по приоритетам\n    const { focusStop } = useRovingFocusGroup(rootRef);\n\n    // при входе в запись фокус на стоп группы (после смены слоя это галочка — первый приоритет\n    // слоя записи), при возврате в текст — в textarea с курсором в конце. Фокус ставим в rAF:\n    // слой режима к этому моменту уже видим (motion применил visibility), иначе focus()\n    // на visibility:hidden не сработает\n    const prevVoiceModeRef = useRef(isVoiceMode);\n    useEffect(() => {\n        const wasVoiceMode = prevVoiceModeRef.current;\n        prevVoiceModeRef.current = isVoiceMode;\n        if (wasVoiceMode === isVoiceMode) {\n            return undefined;\n        }\n        const frameId = requestAnimationFrame(() => {\n            if (isVoiceMode) {\n                focusStop();\n                return;\n            }\n            const textarea = textareaLocalRef.current;\n            if (textarea) {\n                textarea.focus();\n                const caret = textarea.value.length;\n                textarea.setSelectionRange(caret, caret);\n            }\n        });\n        return () => cancelAnimationFrame(frameId);\n    }, [isVoiceMode, focusStop]);\n\n    return (\n        <DisabledContext.Provider value={isDisabled}>\n            <ChatInputContextProvider value={contextValue}>\n                <div\n                    ref={rootRefCallback}\n                    className={classNames(styles.chatInput, { [styles.noBackground]: noBackground })}\n                    data-qa={dataQa}\n                >\n                    <ModeTransition\n                        mode={isVoiceMode ? 'voice' : 'text'}\n                        voice={\n                            <VoiceRecord\n                                mode={voiceSession.status === 'processing' ? 'processing' : 'recording'}\n                                stream={voiceSession.stream}\n                                startedAt={voiceSession.startedAt}\n                                processingLabel={voiceConfig?.processingLabel}\n                                onComplete={voiceSession.stop}\n                                onCancel={voiceSession.cancel}\n                                completeButtonProps={voiceConfig?.completeButtonProps}\n                                cancelButtonProps={voiceConfig?.cancelButtonProps}\n                                data-qa=\"chat-input-voice-record\"\n                            />\n                        }\n                        text={\n                            <div\n                                className={classNames(styles.contentGrid, {\n                                    [styles.noLeftControls]: !leftActions,\n                                    [styles.noRightControls]: !rightActions,\n                                    [styles.hasCentral]: !!centralActions,\n                                })}\n                            >\n                                {/* textarea в DOM первым намеренно: Tab снаружи входит сначала в него.\n                                Раскладку держит grid-area (от порядка не зависит). Кнопки слотов —\n                                одна roving-группа (useRovingFocusGroup): Tab видит только текущий\n                                стоп, внутри группы фокус ходит стрелками по приоритетам слотов */}\n                                <TextInput\n                                    {...textareaProps}\n                                    ref={textareaRefCallback}\n                                    layout={layout}\n                                    onSend={onSend}\n                                    maxHeight={maxHeight}\n                                    containerWidth={containerWidth}\n                                    hasCentral={!!centralActions}\n                                    disabled={isDisabled}\n                                    hasBothSideControls={!!leftActions && !!rightActions}\n                                />\n                                {!!rightActions && (\n                                    <IconDefaultPropsContext props={DEFAULT_ICON_PROPS}>\n                                        <div className={styles.right} {...focusPriorityProps(FOCUS_PRIORITY.rightSlot)}>\n                                            {rightActions}\n                                        </div>\n                                    </IconDefaultPropsContext>\n                                )}\n                                {!!leftActions && (\n                                    <IconDefaultPropsContext props={DEFAULT_ICON_PROPS}>\n                                        <div className={styles.left} {...focusPriorityProps(FOCUS_PRIORITY.leftSlot)}>\n                                            {leftActions}\n                                        </div>\n                                    </IconDefaultPropsContext>\n                                )}\n                                {!!centralActions && (\n                                    <div className={styles.central} {...focusPriorityProps(FOCUS_PRIORITY.centralSlot)}>\n                                        {centralActions}\n                                    </div>\n                                )}\n                                {!!preview && (\n                                    <div className={styles.preview} {...focusPriorityProps(FOCUS_PRIORITY.previewSlot)}>\n                                        {preview}\n                                    </div>\n                                )}\n                            </div>\n                        }\n                    />\n                </div>\n            </ChatInputContextProvider>\n        </DisabledContext.Provider>\n    );\n};\n\n// внешняя обёртка держит slot-registry для конфига записи: кнопка (внутри слота) регистрирует\n// конфиг, ChatInputInner (ниже провайдера) читает его. forwardRef-реф на textarea прокидываем\n// вниз обычным пропом\nconst ChatInputComponent = (props: ChatInputProps, ref: ForwardedRef<HTMLTextAreaElement>) => (\n    <ChatInputVoiceSlotProvider>\n        <ChatInputInner {...props} textareaRef={ref} />\n    </ChatInputVoiceSlotProvider>\n);\n\nconst ChatInput = forwardRef(ChatInputComponent) as ForwardRefExoticComponent<\n    ChatInputProps & RefAttributes<HTMLTextAreaElement>\n> &\n    ChatInputComponents;\n\nChatInput.displayName = 'ChatInput';\n\nChatInput.Chips = ChatInputChips;\nChatInput.Preview = ChatInputPreview;\nChatInput.SendButton = ChatInputSendButton;\nChatInput.VoiceButton = ChatInputVoiceButton;\n\nexport { ChatInput };\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/public/ChatInputChips.d.ts

@@ -0,0 +1,6 @@
+import { type FC, type ReactNode } from 'react';
+export interface ChatInputChipsProps {
+    /** Чипсы, размещаются в один ряд с возможностью горизонтального скролла */
+    children: ReactNode;
+}
+export declare const ChatInputChips: FC<ChatInputChipsProps>;

package/public/ChatInputChips.js

@@ -0,0 +1,16 @@
+import './../index.css';
+import { jsx } from 'react/jsx-runtime';
+import { isValidElement, Children, Fragment } from 'react';
+import { ChipDefaultPropsContext } from '@hh.ru/magritte-ui-chips';
+import { ScrollableContainer } from '@hh.ru/magritte-ui-scrollable-container';
+import { s as styles } from '../styles-CQQdqOFh.js';
+
+const CHIP_DEFAULT_PROPS = { size: 'extra-small' };
+const flattenFragments = (children) => Children.toArray(children).flatMap((child) => isValidElement(child) && child.type === Fragment
+    ? flattenFragments(child.props.children)
+    : child);
+const ChatInputChips = ({ children }) => (jsx("div", { className: styles.chipsContainer, children: jsx(ChipDefaultPropsContext, { props: CHIP_DEFAULT_PROPS, children: jsx(ScrollableContainer, { children: jsx(ScrollableContainer.DefaultLayout, { size: "small", fadeOnMobile: true, children: jsx(ScrollableContainer.Gallery, { children: jsx("div", { className: styles.chips, children: flattenFragments(children).map((child, index) => (jsx(ScrollableContainer.Item, { children: child }, (isValidElement(child) && child.key) || index))) }) }) }) }) }) }));
+ChatInputChips.displayName = 'ChatInputChips';
+
+export { ChatInputChips };
+//# sourceMappingURL=ChatInputChips.js.map

package/public/ChatInputChips.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatInputChips.js","sources":["src/public/ChatInputChips.tsx"],"sourcesContent":["import { Children, Fragment, isValidElement, type FC, type PropsWithChildren, type ReactNode } from 'react';\n\nimport { ChipDefaultPropsContext } from '@hh.ru/magritte-ui-chips';\nimport { ScrollableContainer } from '@hh.ru/magritte-ui-scrollable-container';\n\nimport styles from '../styles.less';\n\nexport interface ChatInputChipsProps {\n    /** Чипсы, размещаются в один ряд с возможностью горизонтального скролла */\n    children: ReactNode;\n}\n\nconst CHIP_DEFAULT_PROPS = { size: 'extra-small' } as const;\n\nconst flattenFragments = (children: ReactNode): ReactNode[] =>\n    Children.toArray(children).flatMap((child) =>\n        isValidElement(child) && child.type === Fragment\n            ? flattenFragments((child.props as PropsWithChildren).children)\n            : child\n    );\n\nexport const ChatInputChips: FC<ChatInputChipsProps> = ({ children }) => (\n    <div className={styles.chipsContainer}>\n        <ChipDefaultPropsContext props={CHIP_DEFAULT_PROPS}>\n            <ScrollableContainer>\n                <ScrollableContainer.DefaultLayout size=\"small\" fadeOnMobile>\n                    <ScrollableContainer.Gallery>\n                        <div className={styles.chips}>\n                            {/* Children.toArray сохраняет ключи детей — переносим их на обёртку,\n                            чтобы удаление чипса из середины не сдвигало стейт соседей */}\n                            {flattenFragments(children).map((child, index) => (\n                                <ScrollableContainer.Item key={(isValidElement(child) && child.key) || index}>\n                                    {child}\n                                </ScrollableContainer.Item>\n                            ))}\n                        </div>\n                    </ScrollableContainer.Gallery>\n                </ScrollableContainer.DefaultLayout>\n            </ScrollableContainer>\n        </ChipDefaultPropsContext>\n    </div>\n);\n\nChatInputChips.displayName = 'ChatInputChips';\n"],"names":["_jsx"],"mappings":";;;;;;AAYA,MAAM,kBAAkB,GAAG,EAAE,IAAI,EAAE,aAAa,EAAW,CAAC;AAE5D,MAAM,gBAAgB,GAAG,CAAC,QAAmB,KACzC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,CAAC,KAAK,KACrC,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,IAAI,KAAK,QAAQ;MAC1C,gBAAgB,CAAE,KAAK,CAAC,KAA2B,CAAC,QAAQ,CAAC;MAC7D,KAAK,CACd,CAAC;MAEO,cAAc,GAA4B,CAAC,EAAE,QAAQ,EAAE,MAChEA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,cAAc,EAAA,QAAA,EACjCA,GAAC,CAAA,uBAAuB,EAAC,EAAA,KAAK,EAAE,kBAAkB,EAAA,QAAA,EAC9CA,IAAC,mBAAmB,EAAA,EAAA,QAAA,EAChBA,IAAC,mBAAmB,CAAC,aAAa,EAAC,EAAA,IAAI,EAAC,OAAO,EAAC,YAAY,EACxD,IAAA,EAAA,QAAA,EAAAA,GAAA,CAAC,mBAAmB,CAAC,OAAO,EACxB,EAAA,QAAA,EAAAA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,KAAK,YAGvB,gBAAgB,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,MACzCA,GAAC,CAAA,mBAAmB,CAAC,IAAI,EACpB,EAAA,QAAA,EAAA,KAAK,IADqB,CAAC,cAAc,CAAC,KAAK,CAAC,IAAI,KAAK,CAAC,GAAG,KAAK,KAAK,CAEjD,CAC9B,CAAC,EACA,CAAA,EAAA,CACoB,GACE,EAClB,CAAA,EAAA,CACA,EACxB,CAAA,EACR;AAEF,cAAc,CAAC,WAAW,GAAG,gBAAgB;;;;"}

package/public/ChatInputPreview.d.ts

@@ -0,0 +1,12 @@
+import { type FC, type ReactNode } from 'react';
+export interface ChatInputPreviewProps {
+    /** Заголовок в центральной секции, типографика subtitle-3-semibold */
+    title?: ReactNode;
+    /** Подзаголовок под title, типографика label-3-regular; обрезается многоточием */
+    subtitle?: ReactNode;
+    /** Слот левой секции, обычно иконка */
+    leftActions?: ReactNode;
+    /** Слот правой секции, обычно иконка */
+    rightActions?: ReactNode;
+}
+export declare const ChatInputPreview: FC<ChatInputPreviewProps>;

package/public/ChatInputPreview.js

@@ -0,0 +1,14 @@
+import './../index.css';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { IconDefaultPropsContext } from '@hh.ru/magritte-ui-icon';
+import { s as styles } from '../styles-CQQdqOFh.js';
+
+const DEFAULT_ICON_PROPS = {
+    initialColor: 'secondary',
+    padding: 8,
+};
+const ChatInputPreview = ({ title, subtitle, leftActions, rightActions }) => (jsx(IconDefaultPropsContext, { props: DEFAULT_ICON_PROPS, children: jsxs("div", { className: styles.previewBlock, children: [!!leftActions && jsx("div", { className: styles.previewSide, children: leftActions }), jsxs("div", { className: styles.previewContent, children: [!!title && jsx("div", { className: styles.previewTitle, children: title }), !!subtitle && jsx("div", { className: styles.previewSubtitle, children: subtitle })] }), !!rightActions && jsx("div", { className: styles.previewSide, children: rightActions })] }) }));
+ChatInputPreview.displayName = 'ChatInputPreview';
+
+export { ChatInputPreview };
+//# sourceMappingURL=ChatInputPreview.js.map

package/public/ChatInputPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatInputPreview.js","sources":["src/public/ChatInputPreview.tsx"],"sourcesContent":["import { type FC, type ReactNode } from 'react';\n\nimport { IconDefaultPropsContext } from '@hh.ru/magritte-ui-icon';\n\nimport styles from '../styles.less';\n\nexport interface ChatInputPreviewProps {\n    /** Заголовок в центральной секции, типографика subtitle-3-semibold */\n    title?: ReactNode;\n    /** Подзаголовок под title, типографика label-3-regular; обрезается многоточием */\n    subtitle?: ReactNode;\n    /** Слот левой секции, обычно иконка */\n    leftActions?: ReactNode;\n    /** Слот правой секции, обычно иконка */\n    rightActions?: ReactNode;\n}\n\nconst DEFAULT_ICON_PROPS = {\n    initialColor: 'secondary',\n    padding: 8,\n} as const;\n\nexport const ChatInputPreview: FC<ChatInputPreviewProps> = ({ title, subtitle, leftActions, rightActions }) => (\n    <IconDefaultPropsContext props={DEFAULT_ICON_PROPS}>\n        <div className={styles.previewBlock}>\n            {!!leftActions && <div className={styles.previewSide}>{leftActions}</div>}\n            <div className={styles.previewContent}>\n                {!!title && <div className={styles.previewTitle}>{title}</div>}\n                {!!subtitle && <div className={styles.previewSubtitle}>{subtitle}</div>}\n            </div>\n            {!!rightActions && <div className={styles.previewSide}>{rightActions}</div>}\n        </div>\n    </IconDefaultPropsContext>\n);\n\nChatInputPreview.displayName = 'ChatInputPreview';\n"],"names":["_jsx","_jsxs"],"mappings":";;;;AAiBA,MAAM,kBAAkB,GAAG;AACvB,IAAA,YAAY,EAAE,WAAW;AACzB,IAAA,OAAO,EAAE,CAAC;CACJ,CAAC;MAEE,gBAAgB,GAA8B,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,YAAY,EAAE,MACtGA,GAAA,CAAC,uBAAuB,EAAA,EAAC,KAAK,EAAE,kBAAkB,EAC9C,QAAA,EAAAC,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,YAAY,EAAA,QAAA,EAAA,CAC9B,CAAC,CAAC,WAAW,IAAID,aAAK,SAAS,EAAE,MAAM,CAAC,WAAW,YAAG,WAAW,EAAA,CAAO,EACzEC,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,cAAc,aAChC,CAAC,CAAC,KAAK,IAAID,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,YAAY,EAAA,QAAA,EAAG,KAAK,EAAO,CAAA,EAC7D,CAAC,CAAC,QAAQ,IAAIA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,eAAe,YAAG,QAAQ,EAAA,CAAO,IACrE,EACL,CAAC,CAAC,YAAY,IAAIA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,WAAW,EAAA,QAAA,EAAG,YAAY,EAAO,CAAA,CAAA,EAAA,CACzE,EACgB,CAAA,EAC5B;AAEF,gBAAgB,CAAC,WAAW,GAAG,kBAAkB;;;;"}

package/public/ChatInputSendButton.d.ts

@@ -0,0 +1,14 @@
+import { type FC, type MouseEventHandler, type ReactNode } from 'react';
+import { type ChatInputButtonAria } from '@hh.ru/magritte-ui-chat-input/types';
+export interface ChatInputSendButtonProps extends ChatInputButtonAria {
+    /** Доп. обработчик клика — вызывается вместе с `onSend`, а не вместо него */
+    onClick?: MouseEventHandler<HTMLButtonElement>;
+    /** Кастомный контент вместо иконки отправки. Иконку в children оформляем как встроенную
+     * (через IconDefaultPropsContext); клик по любому content ловится в любом случае */
+    children?: ReactNode;
+}
+/**
+ * Кнопка отправки для слота ChatInput. Обёртка над иконкой с фиксированным оформлением;
+ * по клику дёргает `onSend` из контекста ChatInput вместе с собственным `onClick`.
+ */
+export declare const ChatInputSendButton: FC<ChatInputSendButtonProps>;

package/public/ChatInputSendButton.js

@@ -0,0 +1,38 @@
+import './../index.css';
+import { jsx } from 'react/jsx-runtime';
+import { useTranslation } from '@hh.ru/magritte-common-use-translation';
+import { useChatInputContext } from '../internal/ChatInputContext.js';
+import { ChatInputSlotButton } from '../internal/ChatInputSlotButton.js';
+import { FocusTarget } from '../internal/FocusTarget.js';
+import { FOCUS_PRIORITY } from '../internal/focusGroup.js';
+import { ArrowUpOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';
+import 'react';
+import '@hh.ru/magritte-common-use-disabled';
+import '@hh.ru/magritte-ui-icon';
+
+/**
+ * Кнопка отправки для слота ChatInput. Обёртка над иконкой с фиксированным оформлением;
+ * по клику дёргает `onSend` из контекста ChatInput вместе с собственным `onClick`.
+ */
+const ChatInputSendButton = ({ onClick, children, 'aria-label': ariaLabel, ...ariaProps }) => {
+    const { onSend } = useChatInputContext();
+    const sendLabel = useTranslation('ChatInput', 'send');
+    const handleClick = (event) => {
+        onClick?.(event);
+        onSend?.();
+    };
+    const iconProps = {
+        // дефолтный data-qa до спреда — пользовательский data-qa из ariaProps его перекрывает
+        'data-qa': 'send',
+        ...ariaProps,
+        'aria-label': ariaLabel ?? sendLabel,
+        initialColor: 'inverse',
+        backgroundStyle: 'inverse',
+        onClick: handleClick,
+    };
+    return (jsx(FocusTarget, { priority: FOCUS_PRIORITY.send, children: jsx(ChatInputSlotButton, { icon: jsx(ArrowUpOutlinedSize24, { ...iconProps }), iconProps: iconProps, onClick: handleClick, children: children }) }));
+};
+ChatInputSendButton.displayName = 'ChatInputSendButton';
+
+export { ChatInputSendButton };
+//# sourceMappingURL=ChatInputSendButton.js.map

package/public/ChatInputSendButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatInputSendButton.js","sources":["src/public/ChatInputSendButton.tsx"],"sourcesContent":["import { type FC, type MouseEvent, type MouseEventHandler, type ReactNode } from 'react';\n\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { useChatInputContext } from '@hh.ru/magritte-ui-chat-input/internal/ChatInputContext';\nimport { ChatInputSlotButton } from '@hh.ru/magritte-ui-chat-input/internal/ChatInputSlotButton';\nimport { FocusTarget } from '@hh.ru/magritte-ui-chat-input/internal/FocusTarget';\nimport { FOCUS_PRIORITY } from '@hh.ru/magritte-ui-chat-input/internal/focusGroup';\nimport { type ChatInputButtonAria } from '@hh.ru/magritte-ui-chat-input/types';\nimport { ArrowUpOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\n\nexport interface ChatInputSendButtonProps extends ChatInputButtonAria {\n    /** Доп. обработчик клика — вызывается вместе с `onSend`, а не вместо него */\n    onClick?: MouseEventHandler<HTMLButtonElement>;\n    /** Кастомный контент вместо иконки отправки. Иконку в children оформляем как встроенную\n     * (через IconDefaultPropsContext); клик по любому content ловится в любом случае */\n    children?: ReactNode;\n}\n\n/**\n * Кнопка отправки для слота ChatInput. Обёртка над иконкой с фиксированным оформлением;\n * по клику дёргает `onSend` из контекста ChatInput вместе с собственным `onClick`.\n */\nexport const ChatInputSendButton: FC<ChatInputSendButtonProps> = ({\n    onClick,\n    children,\n    'aria-label': ariaLabel,\n    ...ariaProps\n}) => {\n    const { onSend } = useChatInputContext();\n    const sendLabel = useTranslation('ChatInput', 'send');\n\n    const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n        onClick?.(event);\n        onSend?.();\n    };\n\n    const iconProps = {\n        // дефолтный data-qa до спреда — пользовательский data-qa из ariaProps его перекрывает\n        'data-qa': 'send',\n        ...ariaProps,\n        'aria-label': ariaLabel ?? sendLabel,\n        initialColor: 'inverse',\n        backgroundStyle: 'inverse',\n        onClick: handleClick,\n    } as const;\n\n    return (\n        <FocusTarget priority={FOCUS_PRIORITY.send}>\n            <ChatInputSlotButton\n                icon={<ArrowUpOutlinedSize24 {...iconProps} />}\n                iconProps={iconProps}\n                onClick={handleClick}\n            >\n                {children}\n            </ChatInputSlotButton>\n        </FocusTarget>\n    );\n};\n\nChatInputSendButton.displayName = 'ChatInputSendButton';\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;AAkBA;;;AAGG;AACU,MAAA,mBAAmB,GAAiC,CAAC,EAC9D,OAAO,EACP,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,GAAG,SAAS,EACf,KAAI;AACD,IAAA,MAAM,EAAE,MAAM,EAAE,GAAG,mBAAmB,EAAE,CAAC;IACzC,MAAM,SAAS,GAAG,cAAc,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;AAEtD,IAAA,MAAM,WAAW,GAAG,CAAC,KAAoC,KAAI;AACzD,QAAA,OAAO,GAAG,KAAK,CAAC,CAAC;QACjB,MAAM,IAAI,CAAC;AACf,KAAC,CAAC;AAEF,IAAA,MAAM,SAAS,GAAG;;AAEd,QAAA,SAAS,EAAE,MAAM;AACjB,QAAA,GAAG,SAAS;QACZ,YAAY,EAAE,SAAS,IAAI,SAAS;AACpC,QAAA,YAAY,EAAE,SAAS;AACvB,QAAA,eAAe,EAAE,SAAS;AAC1B,QAAA,OAAO,EAAE,WAAW;KACd,CAAC;AAEX,IAAA,QACIA,GAAA,CAAC,WAAW,EAAA,EAAC,QAAQ,EAAE,cAAc,CAAC,IAAI,EACtC,QAAA,EAAAA,GAAA,CAAC,mBAAmB,EAAA,EAChB,IAAI,EAAEA,GAAA,CAAC,qBAAqB,EAAA,EAAA,GAAK,SAAS,EAAA,CAAI,EAC9C,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,WAAW,EAEnB,QAAA,EAAA,QAAQ,EACS,CAAA,EAAA,CACZ,EAChB;AACN,EAAE;AAEF,mBAAmB,CAAC,WAAW,GAAG,qBAAqB;;;;"}

package/public/ChatInputVoiceButton.d.ts

@@ -0,0 +1,17 @@
+import { type FC, type MouseEventHandler, type ReactNode } from 'react';
+import { type ChatInputButtonAria, type ChatInputVoiceRecordConfig } from '@hh.ru/magritte-ui-chat-input/types';
+export interface ChatInputVoiceButtonProps extends ChatInputButtonAria, ChatInputVoiceRecordConfig {
+    /** Доп. обработчик клика — вызывается вместе со стартом записи, а не вместо него */
+    onClick?: MouseEventHandler<HTMLButtonElement>;
+    /** Кастомный контент вместо иконки микрофона. Иконку в children оформляем как встроенную
+     * (через IconDefaultPropsContext); клик по любому content ловится в любом случае */
+    children?: ReactNode;
+}
+/**
+ * Кнопка записи голоса для слота ChatInput. Несёт на себе конфигурацию записи (колбэки,
+ * `maxDuration`, `processingLabel`) — она регистрируется в slot-registry и оттуда доезжает до
+ * сессии в корне ChatInput. По клику запускает запись через контекст ChatInput. Пока запрашивается
+ * доступ к микрофону — показывает лоадер; оформление (паддинги, цвет) берёт из дефолтов слота.
+ * Вне ChatInput кнопка неактивна.
+ */
+export declare const ChatInputVoiceButton: FC<ChatInputVoiceButtonProps>;

package/public/ChatInputVoiceButton.js

@@ -0,0 +1,91 @@
+import './../index.css';
+import { jsx } from 'react/jsx-runtime';
+import { useMemo, useRef, useCallback } from 'react';
+import { useTranslation } from '@hh.ru/magritte-common-use-translation';
+import { useChatInputContext } from '../internal/ChatInputContext.js';
+import { ChatInputSlotButton } from '../internal/ChatInputSlotButton.js';
+import { FocusTarget } from '../internal/FocusTarget.js';
+import { FOCUS_PRIORITY } from '../internal/focusGroup.js';
+import { useRegisterVoiceConfig } from '../internal/voiceSlotRegistry.js';
+import { MicOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';
+import '@hh.ru/magritte-common-use-disabled';
+import '@hh.ru/magritte-ui-icon';
+import '@hh.ru/magritte-internal-slot-registry';
+
+/**
+ * Обёртка над колбэком из пропов со стабильной по ссылке идентичностью. Приложение обычно
+ * пересоздаёт хендлеры на каждый рендер, а в slot-registry нужны стабильные ссылки (иначе конфиг
+ * перерегистрируется на каждый рендер). Актуальную версию колбэка держим в рефе, наружу отдаём
+ * фиксированную обёртку, которая зовёт последний ref. Возвращает `undefined` из вызова, если
+ * исходный колбэк не передан.
+ */
+const useStableFn = (fn) => {
+    const fnRef = useRef(fn);
+    fnRef.current = fn;
+    return useCallback((...args) => fnRef.current?.(...args), []);
+};
+/**
+ * Кнопка записи голоса для слота ChatInput. Несёт на себе конфигурацию записи (колбэки,
+ * `maxDuration`, `processingLabel`) — она регистрируется в slot-registry и оттуда доезжает до
+ * сессии в корне ChatInput. По клику запускает запись через контекст ChatInput. Пока запрашивается
+ * доступ к микрофону — показывает лоадер; оформление (паддинги, цвет) берёт из дефолтов слота.
+ * Вне ChatInput кнопка неактивна.
+ */
+const ChatInputVoiceButton = ({ maxDuration, mimeType, processingLabel, onRecordStart, onComplete, onError, onCancel, completeButtonProps, cancelButtonProps, onClick, children, 'aria-label': ariaLabel, ...ariaProps }) => {
+    const { startVoiceRecord, voiceRecordStatus } = useChatInputContext();
+    const recordVoiceLabel = useTranslation('ChatInput', 'recordVoice');
+    // список mimeType приложение часто передаёт инлайн-массивом (новая ссылка на каждый рендер);
+    // мемоизуем по стабильному строковому ключу, чтобы не перерегистрировать конфиг зря
+    const mimeTypeKey = Array.isArray(mimeType) ? mimeType.join(',') : mimeType;
+    // колбэки из пропов оборачиваем в стабильные ссылки, тогда конфиг для slot-registry
+    // меняет идентичность только при смене примитивов (maxDuration/processingLabel), а не на
+    // каждый рендер из-за инлайновых хендлеров приложения — регистрация не дёргается
+    const stableRecordStart = useStableFn(onRecordStart);
+    const stableComplete = useStableFn(onComplete);
+    const stableError = useStableFn(onError);
+    const stableCancel = useStableFn(onCancel);
+    const config = useMemo(() => ({
+        maxDuration,
+        mimeType,
+        processingLabel,
+        onRecordStart: stableRecordStart,
+        onComplete: stableComplete,
+        onError: stableError,
+        onCancel: stableCancel,
+        completeButtonProps,
+        cancelButtonProps,
+    }), 
+    // mimeType намеренно не в deps — его влияние учтено через стабильный mimeTypeKey
+    // eslint-disable-next-line disable-autofix/react-hooks/exhaustive-deps
+    [
+        maxDuration,
+        mimeTypeKey,
+        processingLabel,
+        stableRecordStart,
+        stableComplete,
+        stableError,
+        stableCancel,
+        completeButtonProps,
+        cancelButtonProps,
+    ]);
+    useRegisterVoiceConfig(config);
+    const handleClick = (event) => {
+        onClick?.(event);
+        startVoiceRecord?.();
+    };
+    const iconProps = {
+        // дефолтный data-qa до спреда — пользовательский data-qa из ariaProps его перекрывает
+        'data-qa': 'record',
+        ...ariaProps,
+        'aria-label': ariaLabel ?? recordVoiceLabel,
+        disabled: !startVoiceRecord,
+        loading: voiceRecordStatus === 'starting',
+        onClick: handleClick,
+        // цвета тут нет, потому что в ChatInput он уже пробрасывается на левый и правый слоты
+    };
+    return (jsx(FocusTarget, { priority: FOCUS_PRIORITY.voice, children: jsx(ChatInputSlotButton, { icon: jsx(MicOutlinedSize24, { ...iconProps }), iconProps: iconProps, onClick: handleClick, children: children }) }));
+};
+ChatInputVoiceButton.displayName = 'ChatInputVoiceButton';
+
+export { ChatInputVoiceButton };
+//# sourceMappingURL=ChatInputVoiceButton.js.map

package/public/ChatInputVoiceButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChatInputVoiceButton.js","sources":["src/public/ChatInputVoiceButton.tsx"],"sourcesContent":["import { type FC, type MouseEvent, type MouseEventHandler, type ReactNode, useCallback, useMemo, useRef } from 'react';\n\nimport { useTranslation } from '@hh.ru/magritte-common-use-translation';\nimport { useChatInputContext } from '@hh.ru/magritte-ui-chat-input/internal/ChatInputContext';\nimport { ChatInputSlotButton } from '@hh.ru/magritte-ui-chat-input/internal/ChatInputSlotButton';\nimport { FocusTarget } from '@hh.ru/magritte-ui-chat-input/internal/FocusTarget';\nimport { FOCUS_PRIORITY } from '@hh.ru/magritte-ui-chat-input/internal/focusGroup';\nimport { useRegisterVoiceConfig } from '@hh.ru/magritte-ui-chat-input/internal/voiceSlotRegistry';\nimport { type ChatInputButtonAria, type ChatInputVoiceRecordConfig } from '@hh.ru/magritte-ui-chat-input/types';\nimport { MicOutlinedSize24 } from '@hh.ru/magritte-ui-icon/icon';\n\n/**\n * Обёртка над колбэком из пропов со стабильной по ссылке идентичностью. Приложение обычно\n * пересоздаёт хендлеры на каждый рендер, а в slot-registry нужны стабильные ссылки (иначе конфиг\n * перерегистрируется на каждый рендер). Актуальную версию колбэка держим в рефе, наружу отдаём\n * фиксированную обёртку, которая зовёт последний ref. Возвращает `undefined` из вызова, если\n * исходный колбэк не передан.\n */\nconst useStableFn = <Args extends unknown[], Return>(\n    fn: ((...args: Args) => Return) | undefined\n): ((...args: Args) => Return | undefined) => {\n    const fnRef = useRef(fn);\n    fnRef.current = fn;\n    return useCallback((...args: Args) => fnRef.current?.(...args), []);\n};\n\nexport interface ChatInputVoiceButtonProps extends ChatInputButtonAria, ChatInputVoiceRecordConfig {\n    /** Доп. обработчик клика — вызывается вместе со стартом записи, а не вместо него */\n    onClick?: MouseEventHandler<HTMLButtonElement>;\n    /** Кастомный контент вместо иконки микрофона. Иконку в children оформляем как встроенную\n     * (через IconDefaultPropsContext); клик по любому content ловится в любом случае */\n    children?: ReactNode;\n}\n\n/**\n * Кнопка записи голоса для слота ChatInput. Несёт на себе конфигурацию записи (колбэки,\n * `maxDuration`, `processingLabel`) — она регистрируется в slot-registry и оттуда доезжает до\n * сессии в корне ChatInput. По клику запускает запись через контекст ChatInput. Пока запрашивается\n * доступ к микрофону — показывает лоадер; оформление (паддинги, цвет) берёт из дефолтов слота.\n * Вне ChatInput кнопка неактивна.\n */\nexport const ChatInputVoiceButton: FC<ChatInputVoiceButtonProps> = ({\n    maxDuration,\n    mimeType,\n    processingLabel,\n    onRecordStart,\n    onComplete,\n    onError,\n    onCancel,\n    completeButtonProps,\n    cancelButtonProps,\n    onClick,\n    children,\n    'aria-label': ariaLabel,\n    ...ariaProps\n}) => {\n    const { startVoiceRecord, voiceRecordStatus } = useChatInputContext();\n    const recordVoiceLabel = useTranslation('ChatInput', 'recordVoice');\n\n    // список mimeType приложение часто передаёт инлайн-массивом (новая ссылка на каждый рендер);\n    // мемоизуем по стабильному строковому ключу, чтобы не перерегистрировать конфиг зря\n    const mimeTypeKey = Array.isArray(mimeType) ? mimeType.join(',') : mimeType;\n\n    // колбэки из пропов оборачиваем в стабильные ссылки, тогда конфиг для slot-registry\n    // меняет идентичность только при смене примитивов (maxDuration/processingLabel), а не на\n    // каждый рендер из-за инлайновых хендлеров приложения — регистрация не дёргается\n    const stableRecordStart = useStableFn(onRecordStart);\n    const stableComplete = useStableFn(onComplete);\n    const stableError = useStableFn(onError);\n    const stableCancel = useStableFn(onCancel);\n\n    const config = useMemo<ChatInputVoiceRecordConfig>(\n        () => ({\n            maxDuration,\n            mimeType,\n            processingLabel,\n            onRecordStart: stableRecordStart,\n            onComplete: stableComplete,\n            onError: stableError,\n            onCancel: stableCancel,\n            completeButtonProps,\n            cancelButtonProps,\n        }),\n        // mimeType намеренно не в deps — его влияние учтено через стабильный mimeTypeKey\n        // eslint-disable-next-line disable-autofix/react-hooks/exhaustive-deps\n        [\n            maxDuration,\n            mimeTypeKey,\n            processingLabel,\n            stableRecordStart,\n            stableComplete,\n            stableError,\n            stableCancel,\n            completeButtonProps,\n            cancelButtonProps,\n        ]\n    );\n    useRegisterVoiceConfig(config);\n\n    const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n        onClick?.(event);\n        startVoiceRecord?.();\n    };\n\n    const iconProps = {\n        // дефолтный data-qa до спреда — пользовательский data-qa из ariaProps его перекрывает\n        'data-qa': 'record',\n        ...ariaProps,\n        'aria-label': ariaLabel ?? recordVoiceLabel,\n        disabled: !startVoiceRecord,\n        loading: voiceRecordStatus === 'starting',\n        onClick: handleClick,\n        // цвета тут нет, потому что в ChatInput он уже пробрасывается на левый и правый слоты\n    };\n\n    return (\n        <FocusTarget priority={FOCUS_PRIORITY.voice}>\n            <ChatInputSlotButton\n                icon={<MicOutlinedSize24 {...iconProps} />}\n                iconProps={iconProps}\n                onClick={handleClick}\n            >\n                {children}\n            </ChatInputSlotButton>\n        </FocusTarget>\n    );\n};\n\nChatInputVoiceButton.displayName = 'ChatInputVoiceButton';\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;;AAWA;;;;;;AAMG;AACH,MAAM,WAAW,GAAG,CAChB,EAA2C,KACF;AACzC,IAAA,MAAM,KAAK,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC;AACzB,IAAA,KAAK,CAAC,OAAO,GAAG,EAAE,CAAC;AACnB,IAAA,OAAO,WAAW,CAAC,CAAC,GAAG,IAAU,KAAK,KAAK,CAAC,OAAO,GAAG,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC;AACxE,CAAC,CAAC;AAUF;;;;;;AAMG;AACU,MAAA,oBAAoB,GAAkC,CAAC,EAChE,WAAW,EACX,QAAQ,EACR,eAAe,EACf,aAAa,EACb,UAAU,EACV,OAAO,EACP,QAAQ,EACR,mBAAmB,EACnB,iBAAiB,EACjB,OAAO,EACP,QAAQ,EACR,YAAY,EAAE,SAAS,EACvB,GAAG,SAAS,EACf,KAAI;IACD,MAAM,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,GAAG,mBAAmB,EAAE,CAAC;IACtE,MAAM,gBAAgB,GAAG,cAAc,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;;;IAIpE,MAAM,WAAW,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,QAAQ,CAAC;;;;AAK5E,IAAA,MAAM,iBAAiB,GAAG,WAAW,CAAC,aAAa,CAAC,CAAC;AACrD,IAAA,MAAM,cAAc,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC;AAC/C,IAAA,MAAM,WAAW,GAAG,WAAW,CAAC,OAAO,CAAC,CAAC;AACzC,IAAA,MAAM,YAAY,GAAG,WAAW,CAAC,QAAQ,CAAC,CAAC;AAE3C,IAAA,MAAM,MAAM,GAAG,OAAO,CAClB,OAAO;QACH,WAAW;QACX,QAAQ;QACR,eAAe;AACf,QAAA,aAAa,EAAE,iBAAiB;AAChC,QAAA,UAAU,EAAE,cAAc;AAC1B,QAAA,OAAO,EAAE,WAAW;AACpB,QAAA,QAAQ,EAAE,YAAY;QACtB,mBAAmB;QACnB,iBAAiB;KACpB,CAAC;;;AAGF,IAAA;QACI,WAAW;QACX,WAAW;QACX,eAAe;QACf,iBAAiB;QACjB,cAAc;QACd,WAAW;QACX,YAAY;QACZ,mBAAmB;QACnB,iBAAiB;AACpB,KAAA,CACJ,CAAC;IACF,sBAAsB,CAAC,MAAM,CAAC,CAAC;AAE/B,IAAA,MAAM,WAAW,GAAG,CAAC,KAAoC,KAAI;AACzD,QAAA,OAAO,GAAG,KAAK,CAAC,CAAC;QACjB,gBAAgB,IAAI,CAAC;AACzB,KAAC,CAAC;AAEF,IAAA,MAAM,SAAS,GAAG;;AAEd,QAAA,SAAS,EAAE,QAAQ;AACnB,QAAA,GAAG,SAAS;QACZ,YAAY,EAAE,SAAS,IAAI,gBAAgB;QAC3C,QAAQ,EAAE,CAAC,gBAAgB;QAC3B,OAAO,EAAE,iBAAiB,KAAK,UAAU;AACzC,QAAA,OAAO,EAAE,WAAW;;KAEvB,CAAC;AAEF,IAAA,QACIA,GAAA,CAAC,WAAW,EAAA,EAAC,QAAQ,EAAE,cAAc,CAAC,KAAK,EACvC,QAAA,EAAAA,GAAA,CAAC,mBAAmB,EAAA,EAChB,IAAI,EAAEA,GAAA,CAAC,iBAAiB,EAAA,EAAA,GAAK,SAAS,EAAA,CAAI,EAC1C,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,WAAW,EAEnB,QAAA,EAAA,QAAQ,EACS,CAAA,EAAA,CACZ,EAChB;AACN,EAAE;AAEF,oBAAoB,CAAC,WAAW,GAAG,sBAAsB;;;;"}

package/styles-CQQdqOFh.js

@@ -0,0 +1,5 @@
+import './index.css';
+var styles = {"chat-input":"magritte-chat-input___P69oN_1-0-1","chatInput":"magritte-chat-input___P69oN_1-0-1","no-background":"magritte-no-background___eiIY1_1-0-1","noBackground":"magritte-no-background___eiIY1_1-0-1","text-input-focused":"magritte-text-input-focused___TfyLu_1-0-1","textInputFocused":"magritte-text-input-focused___TfyLu_1-0-1","content-grid":"magritte-content-grid___g03sT_1-0-1","contentGrid":"magritte-content-grid___g03sT_1-0-1","preview":"magritte-preview___baXKi_1-0-1","left":"magritte-left___7JZYp_1-0-1","central":"magritte-central___zkguj_1-0-1","right":"magritte-right___-tGcO_1-0-1","scrollbar-cell":"magritte-scrollbar-cell___--M2x_1-0-1","scrollbarCell":"magritte-scrollbar-cell___--M2x_1-0-1","text-input":"magritte-text-input___3AFO4_1-0-1","textInput":"magritte-text-input___3AFO4_1-0-1","layout-vertical":"magritte-layout-vertical___mVTr-_1-0-1","layoutVertical":"magritte-layout-vertical___mVTr-_1-0-1","has-central":"magritte-has-central___VRZik_1-0-1","hasCentral":"magritte-has-central___VRZik_1-0-1","no-left-controls":"magritte-no-left-controls___7r6yy_1-0-1","noLeftControls":"magritte-no-left-controls___7r6yy_1-0-1","no-right-controls":"magritte-no-right-controls___HBSag_1-0-1","noRightControls":"magritte-no-right-controls___HBSag_1-0-1","chips":"magritte-chips___gLao5_1-0-1","chips-container":"magritte-chips-container___-bS5O_1-0-1","chipsContainer":"magritte-chips-container___-bS5O_1-0-1","preview-block":"magritte-preview-block___iiPdS_1-0-1","previewBlock":"magritte-preview-block___iiPdS_1-0-1","preview-side":"magritte-preview-side___ymR-u_1-0-1","previewSide":"magritte-preview-side___ymR-u_1-0-1","preview-content":"magritte-preview-content___ZgyBD_1-0-1","previewContent":"magritte-preview-content___ZgyBD_1-0-1","preview-title":"magritte-preview-title___SkFeZ_1-0-1","previewTitle":"magritte-preview-title___SkFeZ_1-0-1","preview-subtitle":"magritte-preview-subtitle___58qfR_1-0-1","previewSubtitle":"magritte-preview-subtitle___58qfR_1-0-1","text-input-wrapper":"magritte-text-input-wrapper___TPbwC_1-0-1","textInputWrapper":"magritte-text-input-wrapper___TPbwC_1-0-1","with-top-fade":"magritte-with-top-fade___okgqo_1-0-1","withTopFade":"magritte-with-top-fade___okgqo_1-0-1","with-bottom-fade":"magritte-with-bottom-fade___82gr8_1-0-1","withBottomFade":"magritte-with-bottom-fade___82gr8_1-0-1","measure":"magritte-measure___xNKc0_1-0-1","voice-record":"magritte-voice-record___p64PV_1-0-1","voiceRecord":"magritte-voice-record___p64PV_1-0-1","voice-record-left":"magritte-voice-record-left___njEt-_1-0-1","voiceRecordLeft":"magritte-voice-record-left___njEt-_1-0-1","voice-record-right":"magritte-voice-record-right___UTv-U_1-0-1","voiceRecordRight":"magritte-voice-record-right___UTv-U_1-0-1","voice-processing":"magritte-voice-processing___C0xnX_1-0-1","voiceProcessing":"magritte-voice-processing___C0xnX_1-0-1","voice-record-indicator":"magritte-voice-record-indicator___V8ybb_1-0-1","voiceRecordIndicator":"magritte-voice-record-indicator___V8ybb_1-0-1","voice-record-indicator-bar":"magritte-voice-record-indicator-bar___jgyqz_1-0-1","voiceRecordIndicatorBar":"magritte-voice-record-indicator-bar___jgyqz_1-0-1","voice-record-indicator-wave":"magritte-voice-record-indicator-wave___4VsyE_1-0-1","voiceRecordIndicatorWave":"magritte-voice-record-indicator-wave___4VsyE_1-0-1","voice-record-indicator-has-sound":"magritte-voice-record-indicator-has-sound___67t5g_1-0-1","voiceRecordIndicatorHasSound":"magritte-voice-record-indicator-has-sound___67t5g_1-0-1","mode-container":"magritte-mode-container___nATVD_1-0-1","modeContainer":"magritte-mode-container___nATVD_1-0-1","voice-overlay":"magritte-voice-overlay___LbxAI_1-0-1","voiceOverlay":"magritte-voice-overlay___LbxAI_1-0-1"};
+
+export { styles as s };
+//# sourceMappingURL=styles-CQQdqOFh.js.map

package/styles-CQQdqOFh.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles-CQQdqOFh.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/types.d.ts

@@ -0,0 +1,46 @@
+import { type AriaAttributes, type AriaRole } from 'react';
+/** aria/тестовые пропсы для икон-кнопок ChatInput (микрофон, отправка, подтверждение и отмена записи). */
+export interface ChatInputButtonAria extends Omit<AriaAttributes, 'aria-hidden'> {
+    'aria-hidden'?: boolean;
+    role?: AriaRole;
+    'data-qa'?: string;
+}
+/** Статус сессии записи голоса. */
+export type VoiceRecordStatus = 'idle' | 'starting' | 'recording' | 'processing';
+/**
+ * Конфигурация записи голоса. Задаётся прямо на `ChatInput.VoiceButton` (конфиг без кнопки
+ * бессмыслен и наоборот), а до сессии в корне доезжает через slot-registry. Поля — исходные
+ * колбэки/параметры сессии записи плюс aria кнопок блока записи.
+ */
+export interface ChatInputVoiceRecordConfig {
+    /** Максимальная длительность записи в секундах; по достижении запись финализируется,
+     * как по кнопке подтверждения. Не задана — без ограничения */
+    maxDuration?: number;
+    /** Предпочитаемый MIME-тип записи (можно списком по убыванию приоритета, например
+     * `['audio/webm;codecs=opus', 'audio/mp4']`). Берётся первый поддерживаемый браузером
+     * (`MediaRecorder.isTypeSupported`); если ни один не подошёл или проп не задан — кодек
+     * выбирает браузер (в Safari это `audio/mp4`, в Chrome/Firefox — `audio/webm`). Имя и
+     * расширение итогового файла выводятся из фактического типа записи */
+    mimeType?: string | string[];
+    /** Текст в состоянии обработки записи, например «Обрабатываю запись» */
+    processingLabel?: string;
+    /** Запись фактически началась (микрофон получен, контент подменился блоком записи).
+     * Точка подключения к живому звуку: анализатор для визуализации, стриминговое распознавание
+     * и т.п. Стримом владеет ChatInput — останавливать его треки нельзя, только читать;
+     * для независимого времени жизни — `stream.clone()` */
+    onRecordStart?: (stream: MediaStream) => void;
+    /** Готовая запись — по кнопке подтверждения или `maxDuration`. Если вернуть промис,
+     * состояние «обработка» держится до его завершения; после ChatInput сам вернётся
+     * к текстовому вводу. Ошибки обработки — зона ответственности приложения */
+    onComplete: (file: File) => void | Promise<void>;
+    /** Не удалось получить микрофон; ChatInput остался в обычном режиме */
+    onError?: (error: unknown) => void;
+    /** Запись отменена крестиком; файл выброшен */
+    onCancel?: VoidFunction;
+    /** aria/data-qa пропсы кнопки подтверждения записи (галочка) в блоке записи.
+     * Своя `aria-label` перекрывает дефолтную */
+    completeButtonProps?: ChatInputButtonAria;
+    /** aria/data-qa пропсы кнопки отмены записи (крестик) в блоке записи.
+     * Своя `aria-label` перекрывает дефолтную */
+    cancelButtonProps?: ChatInputButtonAria;
+}

package/types.js

@@ -0,0 +1,3 @@
+import './index.css';
+
+//# sourceMappingURL=types.js.map

package/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}