@gravity-ui/aikit 2.18.1-beta.ba4014635335112dceef11e737ce8d0845e5935b.0 → 2.19.0

package/build/cjs/components/atoms/ActionButton/ActionButton.js

@@ -16,13 +16,26 @@ const uikit_1 = require("@gravity-ui/uikit");
  * @returns ActionButton component
  */
 exports.ActionButton = react_1.default.forwardRef((_a, ref) => {
-    var { tooltipTitle, tooltipPlacement, tooltipDisabled, tooltipOpenDelay, tooltipCloseDelay, wrapperClassName, className, children } = _a, buttonProps = tslib_1.__rest(_a, ["tooltipTitle", "tooltipPlacement", "tooltipDisabled", "tooltipOpenDelay", "tooltipCloseDelay", "wrapperClassName", "className", "children"]);
-    const button = ((0, jsx_runtime_1.jsx)(uikit_1.Button, Object.assign({}, buttonProps, { ref: ref, className: className, children: children })));
+    var { tooltipTitle, tooltipPlacement, tooltipDisabled, tooltipOpenDelay, tooltipCloseDelay, wrapperClassName, className, children, onClick, onMouseLeave, onBlur } = _a, buttonProps = tslib_1.__rest(_a, ["tooltipTitle", "tooltipPlacement", "tooltipDisabled", "tooltipOpenDelay", "tooltipCloseDelay", "wrapperClassName", "className", "children", "onClick", "onMouseLeave", "onBlur"]);
+    const [tooltipDismissed, setTooltipDismissed] = react_1.default.useState(false);
+    const handleClick = (event) => {
+        setTooltipDismissed(true);
+        onClick === null || onClick === void 0 ? void 0 : onClick(event);
+    };
+    const handleMouseLeave = (event) => {
+        setTooltipDismissed(false);
+        onMouseLeave === null || onMouseLeave === void 0 ? void 0 : onMouseLeave(event);
+    };
+    const handleBlur = (event) => {
+        setTooltipDismissed(false);
+        onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
+    };
+    const button = ((0, jsx_runtime_1.jsx)(uikit_1.Button, Object.assign({}, buttonProps, { ref: ref, className: className, onClick: handleClick, onMouseLeave: handleMouseLeave, onBlur: handleBlur, children: children })));
     // If no tooltip props provided, return button without tooltip
     if (!tooltipTitle) {
         return button;
     }
-    return ((0, jsx_runtime_1.jsx)(uikit_1.ActionTooltip, { title: tooltipTitle, placement: tooltipPlacement, disabled: tooltipDisabled, openDelay: tooltipOpenDelay, closeDelay: tooltipCloseDelay, className: wrapperClassName, children: button }));
+    return ((0, jsx_runtime_1.jsx)(uikit_1.ActionTooltip, { title: tooltipTitle, placement: tooltipPlacement, disabled: tooltipDisabled || tooltipDismissed, openDelay: tooltipOpenDelay, closeDelay: tooltipCloseDelay, className: wrapperClassName, children: button }));
 });
 exports.ActionButton.displayName = 'ActionButton';
 //# sourceMappingURL=ActionButton.js.map

package/build/cjs/components/atoms/ActionButton/ActionButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionButton.js","sourceRoot":"../../../../../src","sources":["components/atoms/ActionButton/ActionButton.tsx"],"names":[],"mappings":";;;;;AAAA,0DAA0B;AAE1B,6CAA+F;AAqC/F;;;;;;;;;GASG;AACU,QAAA,YAAY,GAAG,eAAK,CAAC,UAAU,CACxC,CACI,EAUC,EACD,GAAG,EACL,EAAE;QAZA,EACI,YAAY,EACZ,gBAAgB,EAChB,eAAe,EACf,gBAAgB,EAChB,iBAAiB,EACjB,gBAAgB,EAChB,SAAS,EACT,QAAQ,OAEX,EADM,WAAW,sBATlB,6IAUC,CADiB;IAIlB,MAAM,MAAM,GAAG,CACX,uBAAC,cAAM,oBAAK,WAAW,IAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,YAClD,QAAQ,IACJ,CACZ,CAAC;IAEF,8DAA8D;IAC9D,IAAI,CAAC,YAAY,EAAE,CAAC;QAChB,OAAO,MAAM,CAAC;IAClB,CAAC;IAED,OAAO,CACH,uBAAC,qBAAa,IACV,KAAK,EAAE,YAAY,EACnB,SAAS,EAAE,gBAAgB,EAC3B,QAAQ,EAAE,eAAe,EACzB,SAAS,EAAE,gBAAgB,EAC3B,UAAU,EAAE,iBAAiB,EAC7B,SAAS,EAAE,gBAAgB,YAE1B,MAAM,GACK,CACnB,CAAC;AACN,CAAC,CACJ,CAAC;AAEF,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["import React from 'react';\n\nimport {ActionTooltip, ActionTooltipProps, Button, ButtonButtonProps} from '@gravity-ui/uikit';\n\nexport interface ActionButtonProps extends Omit<ButtonButtonProps, 'className'> {\n    /**\n     * Button content (icon, text, or any ReactNode)\n     */\n    children?: React.ReactNode;\n    /**\n     * Additional CSS class for the button\n     */\n    className?: string;\n    /**\n     * Tooltip title text\n     */\n    tooltipTitle?: ActionTooltipProps['title'];\n    /**\n     * Tooltip placement\n     */\n    tooltipPlacement?: ActionTooltipProps['placement'];\n    /**\n     * Tooltip disabled state\n     */\n    tooltipDisabled?: ActionTooltipProps['disabled'];\n    /**\n     * Tooltip open delay in ms\n     */\n    tooltipOpenDelay?: ActionTooltipProps['openDelay'];\n    /**\n     * Tooltip close delay in ms\n     */\n    tooltipCloseDelay?: ActionTooltipProps['closeDelay'];\n    /**\n     * Additional CSS class for the wrapper\n     */\n    wrapperClassName?: string;\n}\n\n/**\n * ActionButton component combines Button with ActionTooltip\n *\n * This component wraps a Button inside an ActionTooltip, providing\n * a convenient way to add tooltips to action buttons throughout the application.\n *\n * @param props - Component props\n * @param ref - Forwarded ref to the button element\n * @returns ActionButton component\n */\nexport const ActionButton = React.forwardRef<HTMLButtonElement, ActionButtonProps>(\n    (\n        {\n            tooltipTitle,\n            tooltipPlacement,\n            tooltipDisabled,\n            tooltipOpenDelay,\n            tooltipCloseDelay,\n            wrapperClassName,\n            className,\n            children,\n            ...buttonProps\n        },\n        ref,\n    ) => {\n        const button = (\n            <Button {...buttonProps} ref={ref} className={className}>\n                {children}\n            </Button>\n        );\n\n        // If no tooltip props provided, return button without tooltip\n        if (!tooltipTitle) {\n            return button;\n        }\n\n        return (\n            <ActionTooltip\n                title={tooltipTitle}\n                placement={tooltipPlacement}\n                disabled={tooltipDisabled}\n                openDelay={tooltipOpenDelay}\n                closeDelay={tooltipCloseDelay}\n                className={wrapperClassName}\n            >\n                {button}\n            </ActionTooltip>\n        );\n    },\n);\n\nActionButton.displayName = 'ActionButton';\n"]}
+{"version":3,"file":"ActionButton.js","sourceRoot":"../../../../../src","sources":["components/atoms/ActionButton/ActionButton.tsx"],"names":[],"mappings":";;;;;AAAA,0DAA0B;AAE1B,6CAA+F;AAqC/F;;;;;;;;;GASG;AACU,QAAA,YAAY,GAAG,eAAK,CAAC,UAAU,CACxC,CACI,EAaC,EACD,GAAG,EACL,EAAE;QAfA,EACI,YAAY,EACZ,gBAAgB,EAChB,eAAe,EACf,gBAAgB,EAChB,iBAAiB,EACjB,gBAAgB,EAChB,SAAS,EACT,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,MAAM,OAET,EADM,WAAW,sBAZlB,kLAaC,CADiB;IAIlB,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,eAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEtE,MAAM,WAAW,GAAG,CAAC,KAA0C,EAAE,EAAE;QAC/D,mBAAmB,CAAC,IAAI,CAAC,CAAC;QAC1B,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAG,KAAK,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,CAAC,KAA0C,EAAE,EAAE;QACpE,mBAAmB,CAAC,KAAK,CAAC,CAAC;QAC3B,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAG,KAAK,CAAC,CAAC;IAC1B,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG,CAAC,KAA0C,EAAE,EAAE;QAC9D,mBAAmB,CAAC,KAAK,CAAC,CAAC;QAC3B,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAG,KAAK,CAAC,CAAC;IACpB,CAAC,CAAC;IAEF,MAAM,MAAM,GAAG,CACX,uBAAC,cAAM,oBACC,WAAW,IACf,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,WAAW,EACpB,YAAY,EAAE,gBAAgB,EAC9B,MAAM,EAAE,UAAU,YAEjB,QAAQ,IACJ,CACZ,CAAC;IAEF,8DAA8D;IAC9D,IAAI,CAAC,YAAY,EAAE,CAAC;QAChB,OAAO,MAAM,CAAC;IAClB,CAAC;IAED,OAAO,CACH,uBAAC,qBAAa,IACV,KAAK,EAAE,YAAY,EACnB,SAAS,EAAE,gBAAgB,EAC3B,QAAQ,EAAE,eAAe,IAAI,gBAAgB,EAC7C,SAAS,EAAE,gBAAgB,EAC3B,UAAU,EAAE,iBAAiB,EAC7B,SAAS,EAAE,gBAAgB,YAE1B,MAAM,GACK,CACnB,CAAC;AACN,CAAC,CACJ,CAAC;AAEF,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["import React from 'react';\n\nimport {ActionTooltip, ActionTooltipProps, Button, ButtonButtonProps} from '@gravity-ui/uikit';\n\nexport interface ActionButtonProps extends Omit<ButtonButtonProps, 'className'> {\n    /**\n     * Button content (icon, text, or any ReactNode)\n     */\n    children?: React.ReactNode;\n    /**\n     * Additional CSS class for the button\n     */\n    className?: string;\n    /**\n     * Tooltip title text\n     */\n    tooltipTitle?: ActionTooltipProps['title'];\n    /**\n     * Tooltip placement\n     */\n    tooltipPlacement?: ActionTooltipProps['placement'];\n    /**\n     * Tooltip disabled state\n     */\n    tooltipDisabled?: ActionTooltipProps['disabled'];\n    /**\n     * Tooltip open delay in ms\n     */\n    tooltipOpenDelay?: ActionTooltipProps['openDelay'];\n    /**\n     * Tooltip close delay in ms\n     */\n    tooltipCloseDelay?: ActionTooltipProps['closeDelay'];\n    /**\n     * Additional CSS class for the wrapper\n     */\n    wrapperClassName?: string;\n}\n\n/**\n * ActionButton component combines Button with ActionTooltip\n *\n * This component wraps a Button inside an ActionTooltip, providing\n * a convenient way to add tooltips to action buttons throughout the application.\n *\n * @param props - Component props\n * @param ref - Forwarded ref to the button element\n * @returns ActionButton component\n */\nexport const ActionButton = React.forwardRef<HTMLButtonElement, ActionButtonProps>(\n    (\n        {\n            tooltipTitle,\n            tooltipPlacement,\n            tooltipDisabled,\n            tooltipOpenDelay,\n            tooltipCloseDelay,\n            wrapperClassName,\n            className,\n            children,\n            onClick,\n            onMouseLeave,\n            onBlur,\n            ...buttonProps\n        },\n        ref,\n    ) => {\n        const [tooltipDismissed, setTooltipDismissed] = React.useState(false);\n\n        const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n            setTooltipDismissed(true);\n            onClick?.(event);\n        };\n\n        const handleMouseLeave = (event: React.MouseEvent<HTMLButtonElement>) => {\n            setTooltipDismissed(false);\n            onMouseLeave?.(event);\n        };\n\n        const handleBlur = (event: React.FocusEvent<HTMLButtonElement>) => {\n            setTooltipDismissed(false);\n            onBlur?.(event);\n        };\n\n        const button = (\n            <Button\n                {...buttonProps}\n                ref={ref}\n                className={className}\n                onClick={handleClick}\n                onMouseLeave={handleMouseLeave}\n                onBlur={handleBlur}\n            >\n                {children}\n            </Button>\n        );\n\n        // If no tooltip props provided, return button without tooltip\n        if (!tooltipTitle) {\n            return button;\n        }\n\n        return (\n            <ActionTooltip\n                title={tooltipTitle}\n                placement={tooltipPlacement}\n                disabled={tooltipDisabled || tooltipDismissed}\n                openDelay={tooltipOpenDelay}\n                closeDelay={tooltipCloseDelay}\n                className={wrapperClassName}\n            >\n                {button}\n            </ActionTooltip>\n        );\n    },\n);\n\nActionButton.displayName = 'ActionButton';\n"]}

package/build/cjs/components/atoms/ChatDate/ChatDate.d.ts

@@ -1,4 +1,5 @@
 import { DOMProps, QAProps } from '@gravity-ui/uikit';
+import { DateLocaleConfig } from "../../../hooks/index.js";
 import "./ChatDate.css";
 export type ChatDateProps = QAProps & DOMProps & {
     /** Date value in string, Date, or number (timestamp) format */
@@ -7,6 +8,10 @@ export type ChatDateProps = QAProps & DOMProps & {
     showTime?: boolean;
     /** Custom format string (dayjs format) */
     format?: string;
+    /** Locale for date formatting */
+    locale?: string;
+    /** Dayjs locale configuration for the provided locale */
+    localeConfig?: DateLocaleConfig;
     /** Display relative dates (today, yesterday, two days ago, etc.) */
     relative?: boolean;
 };

package/build/cjs/components/atoms/ChatDate/ChatDate.js

@@ -16,11 +16,13 @@ const b = (0, cn_1.block)('chat-date');
  * @returns React component
  */
 function ChatDate(props) {
-    const { date, showTime = false, format, className, qa, relative = false, style } = props;
+    const { date, showTime = false, format, locale, localeConfig, className, qa, relative = false, style, } = props;
     const isMobile = (0, uikit_1.useMobile)();
     const { formattedDate, formattedTime, fullDate, dateObject, isValid, diffDays } = (0, hooks_1.useDateFormatter)({
         date,
         format,
+        locale,
+        localeConfig,
     });
     if (!isValid || !dateObject) {
         return (0, i18n_1.i18n)('invalid-date');

package/build/cjs/components/atoms/ChatDate/ChatDate.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChatDate.js","sourceRoot":"../../../../../src","sources":["components/atoms/ChatDate/ChatDate.tsx"],"names":[],"mappings":";;AA+BA,4BAiCC;;AAhED,iCAA+B;AAE/B,6CAA+D;AAE/D,mDAAgD;AAChD,6CAAwC;AAExC,0CAA4B;AAE5B,0BAAyB;AAEzB,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,WAAW,CAAC,CAAC;AAc7B;;;;;GAKG;AACH,SAAgB,QAAQ,CAAC,KAAoB;IACzC,MAAM,EAAC,IAAI,EAAE,QAAQ,GAAG,KAAK,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE,QAAQ,GAAG,KAAK,EAAE,KAAK,EAAC,GAAG,KAAK,CAAC;IAEvF,MAAM,QAAQ,GAAG,IAAA,iBAAS,GAAE,CAAC;IAE7B,MAAM,EAAC,aAAa,EAAE,aAAa,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAC,GACzE,IAAA,wBAAgB,EAAC;QACb,IAAI;QACJ,MAAM;KACT,CAAC,CAAC;IAEP,IAAI,CAAC,OAAO,IAAI,CAAC,UAAU,EAAE,CAAC;QAC1B,OAAO,IAAA,WAAI,EAAC,cAAc,CAAC,CAAC;IAChC,CAAC;IAED,OAAO,CACH,iCACI,SAAS,EAAE,CAAC,CAAC,EAAC,MAAM,EAAE,QAAQ,EAAC,EAAE,SAAS,CAAC,EAC3C,QAAQ,EAAE,UAAU,CAAC,WAAW,EAAE,EAClC,KAAK,EAAE,QAAQ,aACN,EAAE,EACX,KAAK,EAAE,KAAK,YAEX,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,CACxC,2CAAO,IAAA,WAAI,EAAC,KAAK,EAAE,EAAC,KAAK,EAAE,QAAQ,EAAC,CAAC,GAAQ,CAChD,CAAC,CAAC,CAAC,CACA,wBAAC,gBAAQ,eACL,2CAAO,aAAa,GAAQ,EAC5B,2CAAO,QAAQ,IAAI,aAAa,IAAI,IAAI,aAAa,EAAE,GAAQ,IACxD,CACd,GACE,CACV,CAAC;AACN,CAAC","sourcesContent":["import {Fragment} from 'react';\n\nimport {DOMProps, QAProps, useMobile} from '@gravity-ui/uikit';\n\nimport {useDateFormatter} from '../../../hooks';\nimport {block} from '../../../utils/cn';\n\nimport {i18n} from './i18n';\n\nimport './ChatDate.scss';\n\nconst b = block('chat-date');\n\nexport type ChatDateProps = QAProps &\n    DOMProps & {\n        /** Date value in string, Date, or number (timestamp) format */\n        date: string | Date | number;\n        /** Show time along with date */\n        showTime?: boolean;\n        /** Custom format string (dayjs format) */\n        format?: string;\n        /** Display relative dates (today, yesterday, two days ago, etc.) */\n        relative?: boolean;\n    };\n\n/**\n * ChatDate component displays formatted dates with optional time\n *\n * @param props - Component props\n * @returns React component\n */\nexport function ChatDate(props: ChatDateProps) {\n    const {date, showTime = false, format, className, qa, relative = false, style} = props;\n\n    const isMobile = useMobile();\n\n    const {formattedDate, formattedTime, fullDate, dateObject, isValid, diffDays} =\n        useDateFormatter({\n            date,\n            format,\n        });\n\n    if (!isValid || !dateObject) {\n        return i18n('invalid-date');\n    }\n\n    return (\n        <time\n            className={b({mobile: isMobile}, className)}\n            dateTime={dateObject.toISOString()}\n            title={fullDate}\n            data-qa={qa}\n            style={style}\n        >\n            {relative && typeof diffDays === 'number' ? (\n                <span>{i18n('ago', {count: diffDays})}</span>\n            ) : (\n                <Fragment>\n                    <span>{formattedDate}</span>\n                    <span>{showTime && formattedTime && ` ${formattedTime}`}</span>\n                </Fragment>\n            )}\n        </time>\n    );\n}\n"]}
+{"version":3,"file":"ChatDate.js","sourceRoot":"../../../../../src","sources":["components/atoms/ChatDate/ChatDate.tsx"],"names":[],"mappings":";;AAmCA,4BA6CC;;AAhFD,iCAA+B;AAE/B,6CAA+D;AAE/D,mDAAkE;AAClE,6CAAwC;AAExC,0CAA4B;AAE5B,0BAAyB;AAEzB,MAAM,CAAC,GAAG,IAAA,UAAK,EAAC,WAAW,CAAC,CAAC;AAkB7B;;;;;GAKG;AACH,SAAgB,QAAQ,CAAC,KAAoB;IACzC,MAAM,EACF,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,MAAM,EACN,MAAM,EACN,YAAY,EACZ,SAAS,EACT,EAAE,EACF,QAAQ,GAAG,KAAK,EAChB,KAAK,GACR,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAG,IAAA,iBAAS,GAAE,CAAC;IAE7B,MAAM,EAAC,aAAa,EAAE,aAAa,EAAE,QAAQ,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAC,GACzE,IAAA,wBAAgB,EAAC;QACb,IAAI;QACJ,MAAM;QACN,MAAM;QACN,YAAY;KACf,CAAC,CAAC;IAEP,IAAI,CAAC,OAAO,IAAI,CAAC,UAAU,EAAE,CAAC;QAC1B,OAAO,IAAA,WAAI,EAAC,cAAc,CAAC,CAAC;IAChC,CAAC;IAED,OAAO,CACH,iCACI,SAAS,EAAE,CAAC,CAAC,EAAC,MAAM,EAAE,QAAQ,EAAC,EAAE,SAAS,CAAC,EAC3C,QAAQ,EAAE,UAAU,CAAC,WAAW,EAAE,EAClC,KAAK,EAAE,QAAQ,aACN,EAAE,EACX,KAAK,EAAE,KAAK,YAEX,QAAQ,IAAI,OAAO,QAAQ,KAAK,QAAQ,CAAC,CAAC,CAAC,CACxC,2CAAO,IAAA,WAAI,EAAC,KAAK,EAAE,EAAC,KAAK,EAAE,QAAQ,EAAC,CAAC,GAAQ,CAChD,CAAC,CAAC,CAAC,CACA,wBAAC,gBAAQ,eACL,2CAAO,aAAa,GAAQ,EAC5B,2CAAO,QAAQ,IAAI,aAAa,IAAI,IAAI,aAAa,EAAE,GAAQ,IACxD,CACd,GACE,CACV,CAAC;AACN,CAAC","sourcesContent":["import {Fragment} from 'react';\n\nimport {DOMProps, QAProps, useMobile} from '@gravity-ui/uikit';\n\nimport {DateLocaleConfig, useDateFormatter} from '../../../hooks';\nimport {block} from '../../../utils/cn';\n\nimport {i18n} from './i18n';\n\nimport './ChatDate.scss';\n\nconst b = block('chat-date');\n\nexport type ChatDateProps = QAProps &\n    DOMProps & {\n        /** Date value in string, Date, or number (timestamp) format */\n        date: string | Date | number;\n        /** Show time along with date */\n        showTime?: boolean;\n        /** Custom format string (dayjs format) */\n        format?: string;\n        /** Locale for date formatting */\n        locale?: string;\n        /** Dayjs locale configuration for the provided locale */\n        localeConfig?: DateLocaleConfig;\n        /** Display relative dates (today, yesterday, two days ago, etc.) */\n        relative?: boolean;\n    };\n\n/**\n * ChatDate component displays formatted dates with optional time\n *\n * @param props - Component props\n * @returns React component\n */\nexport function ChatDate(props: ChatDateProps) {\n    const {\n        date,\n        showTime = false,\n        format,\n        locale,\n        localeConfig,\n        className,\n        qa,\n        relative = false,\n        style,\n    } = props;\n\n    const isMobile = useMobile();\n\n    const {formattedDate, formattedTime, fullDate, dateObject, isValid, diffDays} =\n        useDateFormatter({\n            date,\n            format,\n            locale,\n            localeConfig,\n        });\n\n    if (!isValid || !dateObject) {\n        return i18n('invalid-date');\n    }\n\n    return (\n        <time\n            className={b({mobile: isMobile}, className)}\n            dateTime={dateObject.toISOString()}\n            title={fullDate}\n            data-qa={qa}\n            style={style}\n        >\n            {relative && typeof diffDays === 'number' ? (\n                <span>{i18n('ago', {count: diffDays})}</span>\n            ) : (\n                <Fragment>\n                    <span>{formattedDate}</span>\n                    <span>{showTime && formattedTime && ` ${formattedTime}`}</span>\n                </Fragment>\n            )}\n        </time>\n    );\n}\n"]}

package/build/cjs/components/atoms/ContextIndicator/ContextIndicator.css

@@ -2,7 +2,7 @@
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  gap: 8px;
+  gap: var(--g-spacing-1);
 }
 .g-aikit-context-indicator__container_orientation_horizontal {
   flex-direction: row;

package/build/cjs/components/molecules/PromptInputFooter/PromptInputFooter.css

@@ -1,6 +1,6 @@
 .g-aikit-prompt-input-footer {
   display: flex;
-  align-items: flex-end;
+  align-items: center;
   justify-content: space-between;
   align-self: stretch;
   gap: var(--g-spacing-1);

package/build/cjs/components/organisms/Header/Header.js

@@ -39,7 +39,7 @@ function getNormalizedMenuItem(item, menuItemQa) {
  * @returns Header component
  */
 function Header(props) {
-    const { title, preview, icon, baseActions, additionalActions, actionsPlacement, actionsOrder, actionSize, isMobile, menuItems, menuButtonTooltip, menuButtonIcon, menuButtonQa, menuItemQa, titlePosition, withIcon, showTitle = true, className, historyButtonRef, qa, actionQa, actionTooltipTexts, } = (0, useHeader_1.useHeader)(props);
+    const { title, preview, icon, baseActions, additionalActions, actionsPlacement, actionsOrder, actionSize, isMobile, actionIcons, menuItems, menuButtonTooltip, menuButtonIcon, menuButtonQa, menuItemQa, titlePosition, withIcon, showTitle = true, className, historyButtonRef, qa, actionQa, actionTooltipTexts, } = (0, useHeader_1.useHeader)(props);
     const [isMenuSheetVisible, setIsMenuSheetVisible] = (0, react_1.useState)(false);
     const menuSheetId = (0, uikit_1.useUniqId)();
     const iconSize = (0, useMobileControlSize_1.getControlIconSize)(actionSize);
@@ -48,12 +48,11 @@ function Header(props) {
     const iconElement = icon ? ((0, jsx_runtime_1.jsx)("div", { className: b('icon'), children: icon })) : ((0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.Sparkles, size: 16 }));
     // Render base action
     const renderBaseAction = (0, react_1.useCallback)((action, ref) => {
-        var _a, _b;
-        let IconComponent = ACTION_ICONS[action.id];
-        // Handle folding icon based on state
-        if (action.id === types_1.HeaderAction.Folding && action.foldingState) {
-            IconComponent = FOLDING_ICONS[action.foldingState];
-        }
+        var _a, _b, _c;
+        const actionId = action.id;
+        const IconComponent = (_a = actionIcons === null || actionIcons === void 0 ? void 0 : actionIcons[actionId]) !== null && _a !== void 0 ? _a : (actionId === types_1.HeaderAction.Folding && action.foldingState
+            ? FOLDING_ICONS[action.foldingState]
+            : ACTION_ICONS[actionId]);
         if (!IconComponent) {
             return null;
         }
@@ -62,7 +61,7 @@ function Header(props) {
         let tooltipOverride;
         if (action.id === types_1.HeaderAction.Folding && action.foldingState) {
             tooltipKey = `action-tooltip-folding-${action.foldingState}`;
-            tooltipOverride = (_a = actionTooltipTexts === null || actionTooltipTexts === void 0 ? void 0 : actionTooltipTexts[types_1.HeaderAction.Folding]) === null || _a === void 0 ? void 0 : _a[action.foldingState];
+            tooltipOverride = (_b = actionTooltipTexts === null || actionTooltipTexts === void 0 ? void 0 : actionTooltipTexts[types_1.HeaderAction.Folding]) === null || _b === void 0 ? void 0 : _b[action.foldingState];
         }
         else {
             tooltipOverride =
@@ -70,8 +69,8 @@ function Header(props) {
         }
         // Determine ref for history button
         const buttonRef = action.id === types_1.HeaderAction.History ? ref : undefined;
-        return ((0, jsx_runtime_1.jsx)(ActionButton_1.ActionButton, { ref: buttonRef, tooltipTitle: tooltipOverride !== null && tooltipOverride !== void 0 ? tooltipOverride : (0, i18n_1.i18n)(tooltipKey), size: actionSize, view: "flat", onClick: action.onClick, className: b('action-button'), qa: (_b = actionQa === null || actionQa === void 0 ? void 0 : actionQa[action.id]) !== null && _b !== void 0 ? _b : `header-action-${action.id}`, children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: IconComponent, size: iconSize }) }, action.id));
-    }, [actionQa, actionSize, actionTooltipTexts, iconSize]);
+        return ((0, jsx_runtime_1.jsx)(ActionButton_1.ActionButton, { ref: buttonRef, tooltipTitle: tooltipOverride !== null && tooltipOverride !== void 0 ? tooltipOverride : (0, i18n_1.i18n)(tooltipKey), size: actionSize, view: "flat", onClick: action.onClick, className: b('action-button'), qa: (_c = actionQa === null || actionQa === void 0 ? void 0 : actionQa[action.id]) !== null && _c !== void 0 ? _c : `header-action-${action.id}`, children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: IconComponent, size: iconSize }) }, action.id));
+    }, [actionIcons, actionQa, actionSize, actionTooltipTexts, iconSize]);
     // Render additional action
     const renderAdditionalAction = (0, react_1.useCallback)((action, index) => {
         var _a;

package/build/cjs/components/organisms/Header/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sourceRoot":"../../../../../src","sources":["components/organisms/Header/Header.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\n\nimport {\n    ChevronsCollapseUpRight,\n    ChevronsExpandUpRight,\n    ClockArrowRotateLeft,\n    Ellipsis,\n    Plus,\n    Sparkles,\n    Xmark,\n} from '@gravity-ui/icons';\nimport {DropdownMenu, Icon, Menu, Sheet, Text, useUniqId} from '@gravity-ui/uikit';\n\nimport {Action} from 'src/types';\n\nimport {getControlIconSize} from '../../../hooks/useMobileControlSize';\nimport {isActionConfig} from '../../../utils/actionUtils';\nimport {block} from '../../../utils/cn';\nimport {ActionButton} from '../../atoms/ActionButton';\nimport {ButtonGroup} from '../../molecules/ButtonGroup';\n\nimport {i18n} from './i18n';\nimport {\n    HeaderAction,\n    HeaderActionGroup,\n    type HeaderActionOrderItem,\n    type HeaderMenuItem,\n    type HeaderProps,\n} from './types';\nimport {ActionItem, useHeader} from './useHeader';\n\nimport './Header.scss';\n\nconst b = block('header');\n\n// Icons for base actions\nconst ACTION_ICONS: Record<HeaderAction, typeof Xmark> = {\n    [HeaderAction.NewChat]: Plus,\n    [HeaderAction.History]: ClockArrowRotateLeft,\n    [HeaderAction.Folding]: ChevronsCollapseUpRight, // Default icon, will be switched based on state\n    [HeaderAction.Close]: Xmark,\n};\n\n// Icons for folding states\nconst FOLDING_ICONS = {\n    collapsed: ChevronsExpandUpRight,\n    opened: ChevronsCollapseUpRight,\n};\n\ntype NormalizedMenuItem = HeaderMenuItem & {qa: string};\n\nfunction getNormalizedMenuItem(\n    item: HeaderMenuItem,\n    menuItemQa: HeaderProps['menuItemQa'],\n): NormalizedMenuItem {\n    return {...item, qa: menuItemQa?.[item.id] ?? `header-menu-item-${item.id}`};\n}\n\n/**\n * Header component for displaying chat header with navigation and actions\n *\n * @param props - Component props\n * @returns Header component\n */\nexport function Header(props: HeaderProps) {\n    const {\n        title,\n        preview,\n        icon,\n        baseActions,\n        additionalActions,\n        actionsPlacement,\n        actionsOrder,\n        actionSize,\n        isMobile,\n        menuItems,\n        menuButtonTooltip,\n        menuButtonIcon,\n        menuButtonQa,\n        menuItemQa,\n        titlePosition,\n        withIcon,\n        showTitle = true,\n        className,\n        historyButtonRef,\n        qa,\n        actionQa,\n        actionTooltipTexts,\n    } = useHeader(props);\n\n    const [isMenuSheetVisible, setIsMenuSheetVisible] = useState(false);\n    const menuSheetId = useUniqId();\n\n    const iconSize = getControlIconSize(actionSize);\n\n    // Determine class for title positioning\n    const titlePositionClass = b('title-container', {position: titlePosition});\n\n    const iconElement = icon ? (\n        <div className={b('icon')}>{icon}</div>\n    ) : (\n        <Icon data={Sparkles} size={16} />\n    );\n\n    // Render base action\n    const renderBaseAction = useCallback(\n        (action: ActionItem, ref?: React.RefObject<HTMLElement>) => {\n            let IconComponent = ACTION_ICONS[action.id as HeaderAction];\n\n            // Handle folding icon based on state\n            if (action.id === HeaderAction.Folding && action.foldingState) {\n                IconComponent = FOLDING_ICONS[action.foldingState];\n            }\n\n            if (!IconComponent) {\n                return null;\n            }\n\n            // Get tooltip text\n            let tooltipKey = `action-tooltip-${action.id}`;\n            let tooltipOverride: string | undefined;\n            if (action.id === HeaderAction.Folding && action.foldingState) {\n                tooltipKey = `action-tooltip-folding-${action.foldingState}`;\n                tooltipOverride = actionTooltipTexts?.[HeaderAction.Folding]?.[action.foldingState];\n            } else {\n                tooltipOverride =\n                    actionTooltipTexts?.[action.id as Exclude<HeaderAction, HeaderAction.Folding>];\n            }\n\n            // Determine ref for history button\n            const buttonRef = action.id === HeaderAction.History ? ref : undefined;\n\n            return (\n                <ActionButton\n                    key={action.id}\n                    ref={buttonRef as React.Ref<HTMLButtonElement>}\n                    tooltipTitle={tooltipOverride ?? i18n(tooltipKey as Parameters<typeof i18n>[0])}\n                    size={actionSize}\n                    view=\"flat\"\n                    onClick={action.onClick}\n                    className={b('action-button')}\n                    qa={actionQa?.[action.id as HeaderAction] ?? `header-action-${action.id}`}\n                >\n                    <Icon data={IconComponent} size={iconSize} />\n                </ActionButton>\n            );\n        },\n        [actionQa, actionSize, actionTooltipTexts, iconSize],\n    );\n\n    // Render additional action\n    const renderAdditionalAction = useCallback(\n        (action: Action, index: number) => {\n            const id = `additional-${index}`;\n\n            if (!isActionConfig(action)) {\n                return <React.Fragment key={id}>{action}</React.Fragment>;\n            }\n\n            return (\n                <ActionButton\n                    key={`${index}`}\n                    {...action}\n                    view={action.view || 'flat'}\n                    size={action.size ?? actionSize}\n                >\n                    {action.icon || action.label}\n                </ActionButton>\n            );\n        },\n        [actionSize],\n    );\n\n    const normalizedMenuItems = useMemo(\n        () => menuItems.map((item) => getNormalizedMenuItem(item, menuItemQa)),\n        [menuItems, menuItemQa],\n    );\n\n    const dropdownMenuItems = useMemo(\n        () =>\n            normalizedMenuItems.map((item) => ({\n                text: item.label,\n                action: item.onClick,\n                disabled: item.disabled,\n                qa: item.qa,\n                ...(item.icon ? {iconStart: item.icon} : {}),\n            })),\n        [normalizedMenuItems],\n    );\n\n    const headerMenu = useMemo(() => {\n        if (normalizedMenuItems.length === 0) {\n            return null;\n        }\n\n        const switcherContent = menuButtonIcon ?? <Icon data={Ellipsis} size={iconSize} />;\n        const switcherTooltip = menuButtonTooltip ?? i18n('action-tooltip-menu');\n        const switcherQa = menuButtonQa ?? 'header-menu-button';\n\n        if (isMobile) {\n            return (\n                <React.Fragment>\n                    <ActionButton\n                        tooltipTitle={switcherTooltip}\n                        size={actionSize}\n                        view=\"flat\"\n                        className={b('action-button')}\n                        qa={switcherQa}\n                        onClick={() => setIsMenuSheetVisible(true)}\n                    >\n                        {switcherContent}\n                    </ActionButton>\n                    <Sheet\n                        id={menuSheetId}\n                        title={i18n('menu-sheet-title')}\n                        visible={isMenuSheetVisible}\n                        onClose={() => setIsMenuSheetVisible(false)}\n                        contentClassName={b('menu-sheet-content')}\n                        qa=\"header-menu-sheet-container\"\n                    >\n                        <Menu size=\"xl\" qa=\"header-menu-sheet\">\n                            {normalizedMenuItems.map((item) => (\n                                <Menu.Item\n                                    key={item.id}\n                                    disabled={item.disabled}\n                                    iconStart={item.icon}\n                                    qa={item.qa}\n                                    onClick={() => {\n                                        setIsMenuSheetVisible(false);\n                                        item.onClick();\n                                    }}\n                                >\n                                    {item.label}\n                                </Menu.Item>\n                            ))}\n                        </Menu>\n                    </Sheet>\n                </React.Fragment>\n            );\n        }\n\n        return (\n            <DropdownMenu\n                items={dropdownMenuItems}\n                renderSwitcher={(switcherProps) => (\n                    <ActionButton\n                        {...switcherProps}\n                        tooltipTitle={switcherTooltip}\n                        size={actionSize}\n                        view=\"flat\"\n                        className={b('action-button')}\n                        qa={switcherQa}\n                    >\n                        {switcherContent}\n                    </ActionButton>\n                )}\n            />\n        );\n    }, [\n        actionSize,\n        iconSize,\n        isMobile,\n        isMenuSheetVisible,\n        menuSheetId,\n        dropdownMenuItems,\n        normalizedMenuItems,\n        menuButtonIcon,\n        menuButtonQa,\n        menuButtonTooltip,\n    ]);\n\n    const [leftBaseActions, rightBaseActions] = useMemo(() => {\n        const left: ActionItem[] = [];\n        const right: ActionItem[] = [];\n        baseActions.forEach((action) => {\n            (actionsPlacement.base?.[action.id as HeaderAction] === 'left' ? left : right).push(\n                action,\n            );\n        });\n        return [left, right];\n    }, [actionsPlacement.base, baseActions]);\n\n    const renderActions = (side: 'left' | 'right') => {\n        const sideAdditionalActions =\n            (actionsPlacement.additional ?? 'right') === side ? additionalActions : [];\n        const sideMenu = (actionsPlacement.menu ?? 'right') === side ? headerMenu : null;\n        const sideBaseActions = side === 'left' ? leftBaseActions : rightBaseActions;\n        if (sideAdditionalActions.length === 0 && !sideMenu && sideBaseActions.length === 0) {\n            return null;\n        }\n        const legacyOrder: HeaderActionOrderItem[] = [\n            ...(sideAdditionalActions.length > 0 ? [HeaderActionGroup.Additional] : []),\n            ...(sideMenu ? [HeaderActionGroup.Menu] : []),\n            ...sideBaseActions.map((action) => action.id as HeaderAction),\n        ];\n        const requestedOrder = actionsOrder[side] ?? [];\n        const available = new Set(legacyOrder);\n        const ordered = [...new Set([...requestedOrder, ...legacyOrder])].filter((item) =>\n            available.has(item),\n        );\n\n        const renderOrderedAction = (item: HeaderActionOrderItem) => {\n            if (item === HeaderActionGroup.Additional) {\n                return sideAdditionalActions.map((action, index) =>\n                    renderAdditionalAction(action, index),\n                );\n            }\n            if (item === HeaderActionGroup.Menu) {\n                return <React.Fragment key=\"menu\">{sideMenu}</React.Fragment>;\n            }\n            const action = sideBaseActions.find((candidate) => candidate.id === item);\n            return action ? renderBaseAction(action, historyButtonRef) : null;\n        };\n\n        return <ButtonGroup>{ordered.map(renderOrderedAction)}</ButtonGroup>;\n    };\n\n    const leftActions = renderActions('left');\n    const rightActions = renderActions('right');\n\n    return (\n        <div className={b('', className)} data-qa={qa}>\n            {(withIcon || leftActions) && (\n                <div className={b('left')}>\n                    {withIcon && iconElement}\n                    {leftActions}\n                </div>\n            )}\n\n            {/* Center part: title with preview */}\n            {showTitle && (\n                <div className={titlePositionClass}>\n                    {title && (\n                        <Text title={title} as=\"div\" variant=\"subheader-2\" className={b('title')}>\n                            {title}\n                        </Text>\n                    )}\n                    {preview && <div className={b('preview')}>{preview}</div>}\n                </div>\n            )}\n\n            {rightActions}\n        </div>\n    );\n}\n"]}
+{"version":3,"file":"Header.js","sourceRoot":"../../../../../src","sources":["components/organisms/Header/Header.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, {useCallback, useMemo, useState} from 'react';\n\nimport {\n    ChevronsCollapseUpRight,\n    ChevronsExpandUpRight,\n    ClockArrowRotateLeft,\n    Ellipsis,\n    Plus,\n    Sparkles,\n    Xmark,\n} from '@gravity-ui/icons';\nimport {DropdownMenu, Icon, Menu, Sheet, Text, useUniqId} from '@gravity-ui/uikit';\n\nimport {Action} from 'src/types';\n\nimport {getControlIconSize} from '../../../hooks/useMobileControlSize';\nimport {isActionConfig} from '../../../utils/actionUtils';\nimport {block} from '../../../utils/cn';\nimport {ActionButton} from '../../atoms/ActionButton';\nimport {ButtonGroup} from '../../molecules/ButtonGroup';\n\nimport {i18n} from './i18n';\nimport {\n    HeaderAction,\n    HeaderActionGroup,\n    type HeaderActionOrderItem,\n    type HeaderMenuItem,\n    type HeaderProps,\n} from './types';\nimport {ActionItem, useHeader} from './useHeader';\n\nimport './Header.scss';\n\nconst b = block('header');\n\n// Icons for base actions\nconst ACTION_ICONS: Record<HeaderAction, typeof Xmark> = {\n    [HeaderAction.NewChat]: Plus,\n    [HeaderAction.History]: ClockArrowRotateLeft,\n    [HeaderAction.Folding]: ChevronsCollapseUpRight, // Default icon, will be switched based on state\n    [HeaderAction.Close]: Xmark,\n};\n\n// Icons for folding states\nconst FOLDING_ICONS = {\n    collapsed: ChevronsExpandUpRight,\n    opened: ChevronsCollapseUpRight,\n};\n\ntype NormalizedMenuItem = HeaderMenuItem & {qa: string};\n\nfunction getNormalizedMenuItem(\n    item: HeaderMenuItem,\n    menuItemQa: HeaderProps['menuItemQa'],\n): NormalizedMenuItem {\n    return {...item, qa: menuItemQa?.[item.id] ?? `header-menu-item-${item.id}`};\n}\n\n/**\n * Header component for displaying chat header with navigation and actions\n *\n * @param props - Component props\n * @returns Header component\n */\nexport function Header(props: HeaderProps) {\n    const {\n        title,\n        preview,\n        icon,\n        baseActions,\n        additionalActions,\n        actionsPlacement,\n        actionsOrder,\n        actionSize,\n        isMobile,\n        actionIcons,\n        menuItems,\n        menuButtonTooltip,\n        menuButtonIcon,\n        menuButtonQa,\n        menuItemQa,\n        titlePosition,\n        withIcon,\n        showTitle = true,\n        className,\n        historyButtonRef,\n        qa,\n        actionQa,\n        actionTooltipTexts,\n    } = useHeader(props);\n\n    const [isMenuSheetVisible, setIsMenuSheetVisible] = useState(false);\n    const menuSheetId = useUniqId();\n\n    const iconSize = getControlIconSize(actionSize);\n\n    // Determine class for title positioning\n    const titlePositionClass = b('title-container', {position: titlePosition});\n\n    const iconElement = icon ? (\n        <div className={b('icon')}>{icon}</div>\n    ) : (\n        <Icon data={Sparkles} size={16} />\n    );\n\n    // Render base action\n    const renderBaseAction = useCallback(\n        (action: ActionItem, ref?: React.RefObject<HTMLElement>) => {\n            const actionId = action.id as HeaderAction;\n            const IconComponent =\n                actionIcons?.[actionId] ??\n                (actionId === HeaderAction.Folding && action.foldingState\n                    ? FOLDING_ICONS[action.foldingState]\n                    : ACTION_ICONS[actionId]);\n\n            if (!IconComponent) {\n                return null;\n            }\n\n            // Get tooltip text\n            let tooltipKey = `action-tooltip-${action.id}`;\n            let tooltipOverride: string | undefined;\n            if (action.id === HeaderAction.Folding && action.foldingState) {\n                tooltipKey = `action-tooltip-folding-${action.foldingState}`;\n                tooltipOverride = actionTooltipTexts?.[HeaderAction.Folding]?.[action.foldingState];\n            } else {\n                tooltipOverride =\n                    actionTooltipTexts?.[action.id as Exclude<HeaderAction, HeaderAction.Folding>];\n            }\n\n            // Determine ref for history button\n            const buttonRef = action.id === HeaderAction.History ? ref : undefined;\n\n            return (\n                <ActionButton\n                    key={action.id}\n                    ref={buttonRef as React.Ref<HTMLButtonElement>}\n                    tooltipTitle={tooltipOverride ?? i18n(tooltipKey as Parameters<typeof i18n>[0])}\n                    size={actionSize}\n                    view=\"flat\"\n                    onClick={action.onClick}\n                    className={b('action-button')}\n                    qa={actionQa?.[action.id as HeaderAction] ?? `header-action-${action.id}`}\n                >\n                    <Icon data={IconComponent} size={iconSize} />\n                </ActionButton>\n            );\n        },\n        [actionIcons, actionQa, actionSize, actionTooltipTexts, iconSize],\n    );\n\n    // Render additional action\n    const renderAdditionalAction = useCallback(\n        (action: Action, index: number) => {\n            const id = `additional-${index}`;\n\n            if (!isActionConfig(action)) {\n                return <React.Fragment key={id}>{action}</React.Fragment>;\n            }\n\n            return (\n                <ActionButton\n                    key={`${index}`}\n                    {...action}\n                    view={action.view || 'flat'}\n                    size={action.size ?? actionSize}\n                >\n                    {action.icon || action.label}\n                </ActionButton>\n            );\n        },\n        [actionSize],\n    );\n\n    const normalizedMenuItems = useMemo(\n        () => menuItems.map((item) => getNormalizedMenuItem(item, menuItemQa)),\n        [menuItems, menuItemQa],\n    );\n\n    const dropdownMenuItems = useMemo(\n        () =>\n            normalizedMenuItems.map((item) => ({\n                text: item.label,\n                action: item.onClick,\n                disabled: item.disabled,\n                qa: item.qa,\n                ...(item.icon ? {iconStart: item.icon} : {}),\n            })),\n        [normalizedMenuItems],\n    );\n\n    const headerMenu = useMemo(() => {\n        if (normalizedMenuItems.length === 0) {\n            return null;\n        }\n\n        const switcherContent = menuButtonIcon ?? <Icon data={Ellipsis} size={iconSize} />;\n        const switcherTooltip = menuButtonTooltip ?? i18n('action-tooltip-menu');\n        const switcherQa = menuButtonQa ?? 'header-menu-button';\n\n        if (isMobile) {\n            return (\n                <React.Fragment>\n                    <ActionButton\n                        tooltipTitle={switcherTooltip}\n                        size={actionSize}\n                        view=\"flat\"\n                        className={b('action-button')}\n                        qa={switcherQa}\n                        onClick={() => setIsMenuSheetVisible(true)}\n                    >\n                        {switcherContent}\n                    </ActionButton>\n                    <Sheet\n                        id={menuSheetId}\n                        title={i18n('menu-sheet-title')}\n                        visible={isMenuSheetVisible}\n                        onClose={() => setIsMenuSheetVisible(false)}\n                        contentClassName={b('menu-sheet-content')}\n                        qa=\"header-menu-sheet-container\"\n                    >\n                        <Menu size=\"xl\" qa=\"header-menu-sheet\">\n                            {normalizedMenuItems.map((item) => (\n                                <Menu.Item\n                                    key={item.id}\n                                    disabled={item.disabled}\n                                    iconStart={item.icon}\n                                    qa={item.qa}\n                                    onClick={() => {\n                                        setIsMenuSheetVisible(false);\n                                        item.onClick();\n                                    }}\n                                >\n                                    {item.label}\n                                </Menu.Item>\n                            ))}\n                        </Menu>\n                    </Sheet>\n                </React.Fragment>\n            );\n        }\n\n        return (\n            <DropdownMenu\n                items={dropdownMenuItems}\n                renderSwitcher={(switcherProps) => (\n                    <ActionButton\n                        {...switcherProps}\n                        tooltipTitle={switcherTooltip}\n                        size={actionSize}\n                        view=\"flat\"\n                        className={b('action-button')}\n                        qa={switcherQa}\n                    >\n                        {switcherContent}\n                    </ActionButton>\n                )}\n            />\n        );\n    }, [\n        actionSize,\n        iconSize,\n        isMobile,\n        isMenuSheetVisible,\n        menuSheetId,\n        dropdownMenuItems,\n        normalizedMenuItems,\n        menuButtonIcon,\n        menuButtonQa,\n        menuButtonTooltip,\n    ]);\n\n    const [leftBaseActions, rightBaseActions] = useMemo(() => {\n        const left: ActionItem[] = [];\n        const right: ActionItem[] = [];\n        baseActions.forEach((action) => {\n            (actionsPlacement.base?.[action.id as HeaderAction] === 'left' ? left : right).push(\n                action,\n            );\n        });\n        return [left, right];\n    }, [actionsPlacement.base, baseActions]);\n\n    const renderActions = (side: 'left' | 'right') => {\n        const sideAdditionalActions =\n            (actionsPlacement.additional ?? 'right') === side ? additionalActions : [];\n        const sideMenu = (actionsPlacement.menu ?? 'right') === side ? headerMenu : null;\n        const sideBaseActions = side === 'left' ? leftBaseActions : rightBaseActions;\n        if (sideAdditionalActions.length === 0 && !sideMenu && sideBaseActions.length === 0) {\n            return null;\n        }\n        const legacyOrder: HeaderActionOrderItem[] = [\n            ...(sideAdditionalActions.length > 0 ? [HeaderActionGroup.Additional] : []),\n            ...(sideMenu ? [HeaderActionGroup.Menu] : []),\n            ...sideBaseActions.map((action) => action.id as HeaderAction),\n        ];\n        const requestedOrder = actionsOrder[side] ?? [];\n        const available = new Set(legacyOrder);\n        const ordered = [...new Set([...requestedOrder, ...legacyOrder])].filter((item) =>\n            available.has(item),\n        );\n\n        const renderOrderedAction = (item: HeaderActionOrderItem) => {\n            if (item === HeaderActionGroup.Additional) {\n                return sideAdditionalActions.map((action, index) =>\n                    renderAdditionalAction(action, index),\n                );\n            }\n            if (item === HeaderActionGroup.Menu) {\n                return <React.Fragment key=\"menu\">{sideMenu}</React.Fragment>;\n            }\n            const action = sideBaseActions.find((candidate) => candidate.id === item);\n            return action ? renderBaseAction(action, historyButtonRef) : null;\n        };\n\n        return <ButtonGroup>{ordered.map(renderOrderedAction)}</ButtonGroup>;\n    };\n\n    const leftActions = renderActions('left');\n    const rightActions = renderActions('right');\n\n    return (\n        <div className={b('', className)} data-qa={qa}>\n            {(withIcon || leftActions) && (\n                <div className={b('left')}>\n                    {withIcon && iconElement}\n                    {leftActions}\n                </div>\n            )}\n\n            {/* Center part: title with preview */}\n            {showTitle && (\n                <div className={titlePositionClass}>\n                    {title && (\n                        <Text title={title} as=\"div\" variant=\"subheader-2\" className={b('title')}>\n                            {title}\n                        </Text>\n                    )}\n                    {preview && <div className={b('preview')}>{preview}</div>}\n                </div>\n            )}\n\n            {rightActions}\n        </div>\n    );\n}\n"]}

package/build/cjs/components/organisms/Header/types.d.ts

@@ -1,4 +1,4 @@
-import type { ButtonButtonProps } from '@gravity-ui/uikit';
+import type { ButtonButtonProps, IconData } from '@gravity-ui/uikit';
 import type { Action } from "../../../types/common.js";
 export type HeaderMenuItem = {
     id: string;
@@ -49,6 +49,8 @@ export type HeaderProps = {
     actionsOrder?: HeaderActionsOrder;
     /** Default size for built-in, menu, and configured additional action buttons. */
     actionSize?: ButtonButtonProps['size'];
+    /** Custom icons for built-in actions. Unspecified actions keep their default icons. */
+    actionIcons?: Partial<Record<HeaderAction, IconData>>;
     /**
      * Menu items for the "..." dropdown. Labels and handlers are provided by the consumer.
      * The menu button is rendered only when the array is non-empty.

package/build/cjs/components/organisms/Header/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"../../../../../src","sources":["components/organisms/Header/types.ts"],"names":[],"mappings":";;;AAaA,IAAY,YAKX;AALD,WAAY,YAAY;IACpB,mCAAmB,CAAA;IACnB,mCAAmB,CAAA;IACnB,mCAAmB,CAAA;IACnB,+BAAe,CAAA;AACnB,CAAC,EALW,YAAY,4BAAZ,YAAY,QAKvB;AAED,mFAAmF;AACnF,IAAY,iBAGX;AAHD,WAAY,iBAAiB;IACzB,kCAAa,CAAA;IACb,8CAAyB,CAAA;AAC7B,CAAC,EAHW,iBAAiB,iCAAjB,iBAAiB,QAG5B","sourcesContent":["import type {ButtonButtonProps} from '@gravity-ui/uikit';\n\nimport type {Action} from '../../../types/common';\n\nexport type HeaderMenuItem = {\n    id: string;\n    label: string;\n    onClick: () => void;\n    disabled?: boolean;\n    /** Optional leading icon (rendered only when provided) */\n    icon?: React.ReactNode;\n};\n\nexport enum HeaderAction {\n    NewChat = 'newChat',\n    History = 'history',\n    Folding = 'folding',\n    Close = 'close',\n}\n\n/** Composite and service action groups that can participate in header ordering. */\nexport enum HeaderActionGroup {\n    Menu = 'menu',\n    Additional = 'additional',\n}\n\nexport type HeaderActionSide = 'left' | 'right';\n\nexport type HeaderActionsPlacement = {\n    /** Side for individual built-in actions. Unspecified actions stay on the right. */\n    base?: Partial<Record<HeaderAction, HeaderActionSide>>;\n    /** Side for the menu button. */\n    menu?: HeaderActionSide;\n    /** Side for the whole additional actions group. */\n    additional?: HeaderActionSide;\n};\n\nexport type HeaderActionOrderItem = HeaderAction | HeaderActionGroup;\n\nexport type HeaderActionsOrder = Partial<\n    Record<HeaderActionSide, readonly HeaderActionOrderItem[]>\n>;\n\nexport type HeaderActionTooltipTexts = Partial<\n    Record<Exclude<HeaderAction, HeaderAction.Folding>, string>\n> & {\n    /** Tooltip texts for {@link HeaderAction.Folding}. */\n    [HeaderAction.Folding]?: Partial<Record<'collapsed' | 'opened', string>>;\n};\n\nexport type HeaderProps = {\n    // Content\n    icon?: React.ReactNode;\n    title?: string;\n    preview?: React.ReactNode;\n\n    // Actions\n    baseActions?: HeaderAction[];\n    handleNewChat?: () => void;\n    handleHistoryToggle?: () => void;\n    handleFolding?: (value: 'collapsed' | 'opened') => void;\n    handleClose?: () => void;\n    additionalActions?: Action[];\n    actionsPlacement?: HeaderActionsPlacement;\n    /** Order of action groups on each side. Unlisted available actions keep their legacy order. */\n    actionsOrder?: HeaderActionsOrder;\n    /** Default size for built-in, menu, and configured additional action buttons. */\n    actionSize?: ButtonButtonProps['size'];\n\n    /**\n     * Menu items for the \"...\" dropdown. Labels and handlers are provided by the consumer.\n     * The menu button is rendered only when the array is non-empty.\n     */\n    menuItems?: HeaderMenuItem[];\n    /** Tooltip for the menu button (default: built-in i18n) */\n    menuButtonTooltip?: string;\n    /** Custom menu button icon (default: horizontal Ellipsis) */\n    menuButtonIcon?: React.ReactNode;\n    /** data-qa for the menu button (default: `header-menu-button`) */\n    menuButtonQa?: string;\n    /** data-qa overrides per menu item id (default: `header-menu-item-${id}`) */\n    menuItemQa?: Partial<Record<string, string>>;\n\n    /**\n     * Notification callback fired by ChatContainer when the history popup is toggled\n     * via the Header action button. Receives the next open state (the value the chat\n     * will be in after the toggle).\n     */\n    onHistoryToggle?: (open: boolean) => void;\n\n    // Refs\n    historyButtonRef?: React.RefObject<HTMLElement>;\n\n    // Folding state\n    foldingState?: 'collapsed' | 'opened';\n\n    // Display settings\n    titlePosition?: 'left' | 'center'; // default: left\n    withIcon?: boolean; // default: true\n    showTitle?: boolean; // default: true - controls visibility of title and preview\n\n    className?: string;\n\n    /** QA/test identifier on header root */\n    qa?: string;\n    /** Per base action `data-qa` (defaults to `header-action-${id}`) */\n    actionQa?: Partial<Record<HeaderAction, string>>;\n    /**\n     * Override tooltip texts per base action. When a value is undefined, the built-in\n     * localized string is used (e.g. `i18n('action-tooltip-newChat')`).\n     */\n    actionTooltipTexts?: HeaderActionTooltipTexts;\n};\n"]}
+{"version":3,"file":"types.js","sourceRoot":"../../../../../src","sources":["components/organisms/Header/types.ts"],"names":[],"mappings":";;;AAaA,IAAY,YAKX;AALD,WAAY,YAAY;IACpB,mCAAmB,CAAA;IACnB,mCAAmB,CAAA;IACnB,mCAAmB,CAAA;IACnB,+BAAe,CAAA;AACnB,CAAC,EALW,YAAY,4BAAZ,YAAY,QAKvB;AAED,mFAAmF;AACnF,IAAY,iBAGX;AAHD,WAAY,iBAAiB;IACzB,kCAAa,CAAA;IACb,8CAAyB,CAAA;AAC7B,CAAC,EAHW,iBAAiB,iCAAjB,iBAAiB,QAG5B","sourcesContent":["import type {ButtonButtonProps, IconData} from '@gravity-ui/uikit';\n\nimport type {Action} from '../../../types/common';\n\nexport type HeaderMenuItem = {\n    id: string;\n    label: string;\n    onClick: () => void;\n    disabled?: boolean;\n    /** Optional leading icon (rendered only when provided) */\n    icon?: React.ReactNode;\n};\n\nexport enum HeaderAction {\n    NewChat = 'newChat',\n    History = 'history',\n    Folding = 'folding',\n    Close = 'close',\n}\n\n/** Composite and service action groups that can participate in header ordering. */\nexport enum HeaderActionGroup {\n    Menu = 'menu',\n    Additional = 'additional',\n}\n\nexport type HeaderActionSide = 'left' | 'right';\n\nexport type HeaderActionsPlacement = {\n    /** Side for individual built-in actions. Unspecified actions stay on the right. */\n    base?: Partial<Record<HeaderAction, HeaderActionSide>>;\n    /** Side for the menu button. */\n    menu?: HeaderActionSide;\n    /** Side for the whole additional actions group. */\n    additional?: HeaderActionSide;\n};\n\nexport type HeaderActionOrderItem = HeaderAction | HeaderActionGroup;\n\nexport type HeaderActionsOrder = Partial<\n    Record<HeaderActionSide, readonly HeaderActionOrderItem[]>\n>;\n\nexport type HeaderActionTooltipTexts = Partial<\n    Record<Exclude<HeaderAction, HeaderAction.Folding>, string>\n> & {\n    /** Tooltip texts for {@link HeaderAction.Folding}. */\n    [HeaderAction.Folding]?: Partial<Record<'collapsed' | 'opened', string>>;\n};\n\nexport type HeaderProps = {\n    // Content\n    icon?: React.ReactNode;\n    title?: string;\n    preview?: React.ReactNode;\n\n    // Actions\n    baseActions?: HeaderAction[];\n    handleNewChat?: () => void;\n    handleHistoryToggle?: () => void;\n    handleFolding?: (value: 'collapsed' | 'opened') => void;\n    handleClose?: () => void;\n    additionalActions?: Action[];\n    actionsPlacement?: HeaderActionsPlacement;\n    /** Order of action groups on each side. Unlisted available actions keep their legacy order. */\n    actionsOrder?: HeaderActionsOrder;\n    /** Default size for built-in, menu, and configured additional action buttons. */\n    actionSize?: ButtonButtonProps['size'];\n    /** Custom icons for built-in actions. Unspecified actions keep their default icons. */\n    actionIcons?: Partial<Record<HeaderAction, IconData>>;\n\n    /**\n     * Menu items for the \"...\" dropdown. Labels and handlers are provided by the consumer.\n     * The menu button is rendered only when the array is non-empty.\n     */\n    menuItems?: HeaderMenuItem[];\n    /** Tooltip for the menu button (default: built-in i18n) */\n    menuButtonTooltip?: string;\n    /** Custom menu button icon (default: horizontal Ellipsis) */\n    menuButtonIcon?: React.ReactNode;\n    /** data-qa for the menu button (default: `header-menu-button`) */\n    menuButtonQa?: string;\n    /** data-qa overrides per menu item id (default: `header-menu-item-${id}`) */\n    menuItemQa?: Partial<Record<string, string>>;\n\n    /**\n     * Notification callback fired by ChatContainer when the history popup is toggled\n     * via the Header action button. Receives the next open state (the value the chat\n     * will be in after the toggle).\n     */\n    onHistoryToggle?: (open: boolean) => void;\n\n    // Refs\n    historyButtonRef?: React.RefObject<HTMLElement>;\n\n    // Folding state\n    foldingState?: 'collapsed' | 'opened';\n\n    // Display settings\n    titlePosition?: 'left' | 'center'; // default: left\n    withIcon?: boolean; // default: true\n    showTitle?: boolean; // default: true - controls visibility of title and preview\n\n    className?: string;\n\n    /** QA/test identifier on header root */\n    qa?: string;\n    /** Per base action `data-qa` (defaults to `header-action-${id}`) */\n    actionQa?: Partial<Record<HeaderAction, string>>;\n    /**\n     * Override tooltip texts per base action. When a value is undefined, the built-in\n     * localized string is used (e.g. `i18n('action-tooltip-newChat')`).\n     */\n    actionTooltipTexts?: HeaderActionTooltipTexts;\n};\n"]}

package/build/cjs/components/organisms/Header/useHeader.d.ts

@@ -17,6 +17,7 @@ export declare function useHeader(props: HeaderProps): {
     actionsOrder: NonNullable<HeaderProps['actionsOrder']>;
     actionSize: NonNullable<HeaderProps['actionSize']>;
     isMobile: boolean;
+    actionIcons?: HeaderProps['actionIcons'];
     titlePosition: 'left' | 'center';
     withIcon: boolean;
     showTitle: boolean;

package/build/cjs/components/organisms/Header/useHeader.js

@@ -5,7 +5,7 @@ const react_1 = require("react");
 const uikit_1 = require("@gravity-ui/uikit");
 const types_1 = require("./types.js");
 function useHeader(props) {
-    const { icon, title, preview, baseActions = [], handleNewChat, handleHistoryToggle, handleClose, handleFolding, foldingState = 'opened', additionalActions = [], actionsPlacement = {}, actionsOrder = {}, actionSize: actionSizeProp, menuItems = [], menuButtonTooltip, menuButtonIcon, menuButtonQa, menuItemQa, titlePosition = 'left', withIcon = true, showTitle = true, className, historyButtonRef, qa, actionQa, actionTooltipTexts, } = props;
+    const { icon, title, preview, baseActions = [], handleNewChat, handleHistoryToggle, handleClose, handleFolding, foldingState = 'opened', additionalActions = [], actionsPlacement = {}, actionsOrder = {}, actionSize: actionSizeProp, actionIcons, menuItems = [], menuButtonTooltip, menuButtonIcon, menuButtonQa, menuItemQa, titlePosition = 'left', withIcon = true, showTitle = true, className, historyButtonRef, qa, actionQa, actionTooltipTexts, } = props;
     const isMobile = (0, uikit_1.useMobile)();
     const actionSize = actionSizeProp !== null && actionSizeProp !== void 0 ? actionSizeProp : (isMobile ? 'xl' : 'm');
     // Build base actions
@@ -52,6 +52,7 @@ function useHeader(props) {
         actionsOrder,
         actionSize,
         isMobile,
+        actionIcons,
         titlePosition,
         withIcon,
         showTitle,

package/build/cjs/components/organisms/Header/useHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"useHeader.js","sourceRoot":"../../../../../src","sources":["components/organisms/Header/useHeader.ts"],"names":[],"mappings":";;AAeA,8BAuHC;AAtID,iCAAqC;AAErC,6CAA4C;AAI5C,sCAA4E;AAS5E,SAAgB,SAAS,CAAC,KAAkB;IAwBxC,MAAM,EACF,IAAI,EACJ,KAAK,EACL,OAAO,EACP,WAAW,GAAG,EAAE,EAChB,aAAa,EACb,mBAAmB,EACnB,WAAW,EACX,aAAa,EACb,YAAY,GAAG,QAAQ,EACvB,iBAAiB,GAAG,EAAE,EACtB,gBAAgB,GAAG,EAAE,EACrB,YAAY,GAAG,EAAE,EACjB,UAAU,EAAE,cAAc,EAC1B,SAAS,GAAG,EAAE,EACd,iBAAiB,EACjB,cAAc,EACd,YAAY,EACZ,UAAU,EACV,aAAa,GAAG,MAAM,EACtB,QAAQ,GAAG,IAAI,EACf,SAAS,GAAG,IAAI,EAChB,SAAS,EACT,gBAAgB,EAChB,EAAE,EACF,QAAQ,EACR,kBAAkB,GACrB,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAG,IAAA,iBAAS,GAAE,CAAC;IAC7B,MAAM,UAAU,GAAG,cAAc,aAAd,cAAc,cAAd,cAAc,GAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IAE7D,qBAAqB;IACrB,MAAM,eAAe,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QACjC,MAAM,OAAO,GAAiB,EAAE,CAAC;QAEjC,WAAW,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;YAC3B,IAAI,MAAM,KAAK,oBAAY,CAAC,OAAO,EAAE,CAAC;gBAClC,IAAI,aAAa,EAAE,CAAC;oBAChB,OAAO,CAAC,IAAI,CAAC;wBACT,EAAE,EAAE,MAAM;wBACV,IAAI,EAAE,MAAM;wBACZ,OAAO,EAAE,GAAG,EAAE;4BACV,MAAM,QAAQ,GAAG,YAAY,KAAK,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;4BACpE,aAAa,CAAC,QAAQ,CAAC,CAAC;wBAC5B,CAAC;wBACD,YAAY;qBACf,CAAC,CAAC;gBACP,CAAC;gBACD,OAAO;YACX,CAAC;YAED,MAAM,SAAS,GAA8C;gBACzD,CAAC,oBAAY,CAAC,OAAO,CAAC,EAAE,aAAa;gBACrC,CAAC,oBAAY,CAAC,OAAO,CAAC,EAAE,mBAAmB;gBAC3C,CAAC,oBAAY,CAAC,KAAK,CAAC,EAAE,WAAW;aACpC,CAAC;YAEF,MAAM,OAAO,GAAG,SAAS,CAAC,MAAM,CAAC,CAAC;YAClC,IAAI,OAAO,EAAE,CAAC;gBACV,OAAO,CAAC,IAAI,CAAC;oBACT,EAAE,EAAE,MAAM;oBACV,IAAI,EAAE,MAAM;oBACZ,OAAO,EAAE,OAAO;iBACnB,CAAC,CAAC;YACP,CAAC;QACL,CAAC,CAAC,CAAC;QAEH,OAAO,OAAO,CAAC;IACnB,CAAC,EAAE,CAAC,WAAW,EAAE,aAAa,EAAE,mBAAmB,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,CAAC,CAAC,CAAC;IAEhG,OAAO;QACH,KAAK;QACL,OAAO;QACP,IAAI;QACJ,WAAW,EAAE,eAAe;QAC5B,iBAAiB;QACjB,gBAAgB;QAChB,YAAY;QACZ,UAAU;QACV,QAAQ;QACR,aAAa;QACb,QAAQ;QACR,SAAS;QACT,SAAS;QACT,gBAAgB;QAChB,EAAE;QACF,QAAQ;QACR,kBAAkB;QAClB,SAAS;QACT,iBAAiB;QACjB,cAAc;QACd,YAAY;QACZ,UAAU;KACb,CAAC;AACN,CAAC","sourcesContent":["import React, {useMemo} from 'react';\n\nimport {useMobile} from '@gravity-ui/uikit';\n\nimport type {Action} from '../../../types/common';\n\nimport {HeaderAction, type HeaderMenuItem, type HeaderProps} from './types';\n\nexport type ActionItem = {\n    id: string;\n    type: 'base' | 'additional';\n    onClick?: () => void;\n    foldingState?: 'collapsed' | 'opened';\n};\n\nexport function useHeader(props: HeaderProps): {\n    title: string | undefined;\n    preview: React.ReactNode | undefined;\n    icon: React.ReactNode | undefined;\n    baseActions: ActionItem[];\n    additionalActions: Action[];\n    actionsPlacement: NonNullable<HeaderProps['actionsPlacement']>;\n    actionsOrder: NonNullable<HeaderProps['actionsOrder']>;\n    actionSize: NonNullable<HeaderProps['actionSize']>;\n    isMobile: boolean;\n    titlePosition: 'left' | 'center';\n    withIcon: boolean;\n    showTitle: boolean;\n    className?: string;\n    historyButtonRef?: React.RefObject<HTMLElement>;\n    qa?: string;\n    actionQa?: HeaderProps['actionQa'];\n    actionTooltipTexts?: HeaderProps['actionTooltipTexts'];\n    menuItems: HeaderMenuItem[];\n    menuButtonTooltip?: string;\n    menuButtonIcon?: React.ReactNode;\n    menuButtonQa?: string;\n    menuItemQa?: HeaderProps['menuItemQa'];\n} {\n    const {\n        icon,\n        title,\n        preview,\n        baseActions = [],\n        handleNewChat,\n        handleHistoryToggle,\n        handleClose,\n        handleFolding,\n        foldingState = 'opened',\n        additionalActions = [],\n        actionsPlacement = {},\n        actionsOrder = {},\n        actionSize: actionSizeProp,\n        menuItems = [],\n        menuButtonTooltip,\n        menuButtonIcon,\n        menuButtonQa,\n        menuItemQa,\n        titlePosition = 'left',\n        withIcon = true,\n        showTitle = true,\n        className,\n        historyButtonRef,\n        qa,\n        actionQa,\n        actionTooltipTexts,\n    } = props;\n\n    const isMobile = useMobile();\n    const actionSize = actionSizeProp ?? (isMobile ? 'xl' : 'm');\n\n    // Build base actions\n    const baseActionsList = useMemo(() => {\n        const actions: ActionItem[] = [];\n\n        baseActions.forEach((action) => {\n            if (action === HeaderAction.Folding) {\n                if (handleFolding) {\n                    actions.push({\n                        id: action,\n                        type: 'base',\n                        onClick: () => {\n                            const newState = foldingState === 'opened' ? 'collapsed' : 'opened';\n                            handleFolding(newState);\n                        },\n                        foldingState,\n                    });\n                }\n                return;\n            }\n\n            const actionMap: Partial<Record<HeaderAction, () => void>> = {\n                [HeaderAction.NewChat]: handleNewChat,\n                [HeaderAction.History]: handleHistoryToggle,\n                [HeaderAction.Close]: handleClose,\n            };\n\n            const handler = actionMap[action];\n            if (handler) {\n                actions.push({\n                    id: action,\n                    type: 'base',\n                    onClick: handler,\n                });\n            }\n        });\n\n        return actions;\n    }, [baseActions, handleNewChat, handleHistoryToggle, handleClose, handleFolding, foldingState]);\n\n    return {\n        title,\n        preview,\n        icon,\n        baseActions: baseActionsList,\n        additionalActions,\n        actionsPlacement,\n        actionsOrder,\n        actionSize,\n        isMobile,\n        titlePosition,\n        withIcon,\n        showTitle,\n        className,\n        historyButtonRef,\n        qa,\n        actionQa,\n        actionTooltipTexts,\n        menuItems,\n        menuButtonTooltip,\n        menuButtonIcon,\n        menuButtonQa,\n        menuItemQa,\n    };\n}\n"]}
+{"version":3,"file":"useHeader.js","sourceRoot":"../../../../../src","sources":["components/organisms/Header/useHeader.ts"],"names":[],"mappings":";;AAeA,8BA0HC;AAzID,iCAAqC;AAErC,6CAA4C;AAI5C,sCAA4E;AAS5E,SAAgB,SAAS,CAAC,KAAkB;IAyBxC,MAAM,EACF,IAAI,EACJ,KAAK,EACL,OAAO,EACP,WAAW,GAAG,EAAE,EAChB,aAAa,EACb,mBAAmB,EACnB,WAAW,EACX,aAAa,EACb,YAAY,GAAG,QAAQ,EACvB,iBAAiB,GAAG,EAAE,EACtB,gBAAgB,GAAG,EAAE,EACrB,YAAY,GAAG,EAAE,EACjB,UAAU,EAAE,cAAc,EAC1B,WAAW,EACX,SAAS,GAAG,EAAE,EACd,iBAAiB,EACjB,cAAc,EACd,YAAY,EACZ,UAAU,EACV,aAAa,GAAG,MAAM,EACtB,QAAQ,GAAG,IAAI,EACf,SAAS,GAAG,IAAI,EAChB,SAAS,EACT,gBAAgB,EAChB,EAAE,EACF,QAAQ,EACR,kBAAkB,GACrB,GAAG,KAAK,CAAC;IAEV,MAAM,QAAQ,GAAG,IAAA,iBAAS,GAAE,CAAC;IAC7B,MAAM,UAAU,GAAG,cAAc,aAAd,cAAc,cAAd,cAAc,GAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IAE7D,qBAAqB;IACrB,MAAM,eAAe,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QACjC,MAAM,OAAO,GAAiB,EAAE,CAAC;QAEjC,WAAW,CAAC,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE;YAC3B,IAAI,MAAM,KAAK,oBAAY,CAAC,OAAO,EAAE,CAAC;gBAClC,IAAI,aAAa,EAAE,CAAC;oBAChB,OAAO,CAAC,IAAI,CAAC;wBACT,EAAE,EAAE,MAAM;wBACV,IAAI,EAAE,MAAM;wBACZ,OAAO,EAAE,GAAG,EAAE;4BACV,MAAM,QAAQ,GAAG,YAAY,KAAK,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;4BACpE,aAAa,CAAC,QAAQ,CAAC,CAAC;wBAC5B,CAAC;wBACD,YAAY;qBACf,CAAC,CAAC;gBACP,CAAC;gBACD,OAAO;YACX,CAAC;YAED,MAAM,SAAS,GAA8C;gBACzD,CAAC,oBAAY,CAAC,OAAO,CAAC,EAAE,aAAa;gBACrC,CAAC,oBAAY,CAAC,OAAO,CAAC,EAAE,mBAAmB;gBAC3C,CAAC,oBAAY,CAAC,KAAK,CAAC,EAAE,WAAW;aACpC,CAAC;YAEF,MAAM,OAAO,GAAG,SAAS,CAAC,MAAM,CAAC,CAAC;YAClC,IAAI,OAAO,EAAE,CAAC;gBACV,OAAO,CAAC,IAAI,CAAC;oBACT,EAAE,EAAE,MAAM;oBACV,IAAI,EAAE,MAAM;oBACZ,OAAO,EAAE,OAAO;iBACnB,CAAC,CAAC;YACP,CAAC;QACL,CAAC,CAAC,CAAC;QAEH,OAAO,OAAO,CAAC;IACnB,CAAC,EAAE,CAAC,WAAW,EAAE,aAAa,EAAE,mBAAmB,EAAE,WAAW,EAAE,aAAa,EAAE,YAAY,CAAC,CAAC,CAAC;IAEhG,OAAO;QACH,KAAK;QACL,OAAO;QACP,IAAI;QACJ,WAAW,EAAE,eAAe;QAC5B,iBAAiB;QACjB,gBAAgB;QAChB,YAAY;QACZ,UAAU;QACV,QAAQ;QACR,WAAW;QACX,aAAa;QACb,QAAQ;QACR,SAAS;QACT,SAAS;QACT,gBAAgB;QAChB,EAAE;QACF,QAAQ;QACR,kBAAkB;QAClB,SAAS;QACT,iBAAiB;QACjB,cAAc;QACd,YAAY;QACZ,UAAU;KACb,CAAC;AACN,CAAC","sourcesContent":["import React, {useMemo} from 'react';\n\nimport {useMobile} from '@gravity-ui/uikit';\n\nimport type {Action} from '../../../types/common';\n\nimport {HeaderAction, type HeaderMenuItem, type HeaderProps} from './types';\n\nexport type ActionItem = {\n    id: string;\n    type: 'base' | 'additional';\n    onClick?: () => void;\n    foldingState?: 'collapsed' | 'opened';\n};\n\nexport function useHeader(props: HeaderProps): {\n    title: string | undefined;\n    preview: React.ReactNode | undefined;\n    icon: React.ReactNode | undefined;\n    baseActions: ActionItem[];\n    additionalActions: Action[];\n    actionsPlacement: NonNullable<HeaderProps['actionsPlacement']>;\n    actionsOrder: NonNullable<HeaderProps['actionsOrder']>;\n    actionSize: NonNullable<HeaderProps['actionSize']>;\n    isMobile: boolean;\n    actionIcons?: HeaderProps['actionIcons'];\n    titlePosition: 'left' | 'center';\n    withIcon: boolean;\n    showTitle: boolean;\n    className?: string;\n    historyButtonRef?: React.RefObject<HTMLElement>;\n    qa?: string;\n    actionQa?: HeaderProps['actionQa'];\n    actionTooltipTexts?: HeaderProps['actionTooltipTexts'];\n    menuItems: HeaderMenuItem[];\n    menuButtonTooltip?: string;\n    menuButtonIcon?: React.ReactNode;\n    menuButtonQa?: string;\n    menuItemQa?: HeaderProps['menuItemQa'];\n} {\n    const {\n        icon,\n        title,\n        preview,\n        baseActions = [],\n        handleNewChat,\n        handleHistoryToggle,\n        handleClose,\n        handleFolding,\n        foldingState = 'opened',\n        additionalActions = [],\n        actionsPlacement = {},\n        actionsOrder = {},\n        actionSize: actionSizeProp,\n        actionIcons,\n        menuItems = [],\n        menuButtonTooltip,\n        menuButtonIcon,\n        menuButtonQa,\n        menuItemQa,\n        titlePosition = 'left',\n        withIcon = true,\n        showTitle = true,\n        className,\n        historyButtonRef,\n        qa,\n        actionQa,\n        actionTooltipTexts,\n    } = props;\n\n    const isMobile = useMobile();\n    const actionSize = actionSizeProp ?? (isMobile ? 'xl' : 'm');\n\n    // Build base actions\n    const baseActionsList = useMemo(() => {\n        const actions: ActionItem[] = [];\n\n        baseActions.forEach((action) => {\n            if (action === HeaderAction.Folding) {\n                if (handleFolding) {\n                    actions.push({\n                        id: action,\n                        type: 'base',\n                        onClick: () => {\n                            const newState = foldingState === 'opened' ? 'collapsed' : 'opened';\n                            handleFolding(newState);\n                        },\n                        foldingState,\n                    });\n                }\n                return;\n            }\n\n            const actionMap: Partial<Record<HeaderAction, () => void>> = {\n                [HeaderAction.NewChat]: handleNewChat,\n                [HeaderAction.History]: handleHistoryToggle,\n                [HeaderAction.Close]: handleClose,\n            };\n\n            const handler = actionMap[action];\n            if (handler) {\n                actions.push({\n                    id: action,\n                    type: 'base',\n                    onClick: handler,\n                });\n            }\n        });\n\n        return actions;\n    }, [baseActions, handleNewChat, handleHistoryToggle, handleClose, handleFolding, foldingState]);\n\n    return {\n        title,\n        preview,\n        icon,\n        baseActions: baseActionsList,\n        additionalActions,\n        actionsPlacement,\n        actionsOrder,\n        actionSize,\n        isMobile,\n        actionIcons,\n        titlePosition,\n        withIcon,\n        showTitle,\n        className,\n        historyButtonRef,\n        qa,\n        actionQa,\n        actionTooltipTexts,\n        menuItems,\n        menuButtonTooltip,\n        menuButtonIcon,\n        menuButtonQa,\n        menuItemQa,\n    };\n}\n"]}

package/build/cjs/components/organisms/MessageList/MessageList.css

@@ -57,7 +57,7 @@
   flex-direction: column;
   align-items: flex-start;
   justify-content: flex-start;
-  padding: var(--g-spacing-4) 0 var(--g-spacing-2);
+  padding: var(--g-aikit-message-list-footer-content-padding);
 }
 .g-aikit-message-list__retry-button {
   display: flex;

package/build/cjs/components/pages/ChatContainer/ChatContainer.css

@@ -14,6 +14,11 @@
   font-size: var(--g-aikit-chat-container-mobile-font-size);
   line-height: var(--g-aikit-chat-container-mobile-line-height);
 }
+.g-aikit-chat-container_mobile.g-aikit-chat-container_keyboard-open {
+  --g-aikit-empty-container-mobile-padding: var(
+      --g-aikit-chat-container-mobile-keyboard-empty-container-padding
+  );
+}
 .g-aikit-chat-container_mobile .g-aikit-markdown-renderer {
   --yfm-font-size: var(--g-aikit-chat-container-mobile-font-size);
   --yfm-font-line-height: var(--g-aikit-chat-container-mobile-line-height);

package/build/cjs/components/pages/ChatContainer/ChatContainer.js

@@ -78,9 +78,13 @@ function buildFinalPromptInputProps(args) {
  */
 function ChatContainer(props) {
     var _a, _b;
-    const { chats = [], messages = [], onSendMessage, onDeleteChat, onCancel, onRetry, status = 'ready', error = null, showActionsOnHover = false, contextItems = [], showContextIndicator, contextIndicatorProps, transformOptions, shouldParseIncompleteMarkdown, openMarkdownLinksInNewTab, mdxProps, messageListConfig, mascotConfig, headerProps = {}, contentProps = {}, emptyContainerProps = {}, promptInputProps = {}, disclaimerProps = {}, historyProps = {}, welcomeConfig, texts = {}, hideTitleOnEmptyChat = false, isMobile: isMobileProp, className, headerClassName, contentClassName, footerClassName, qa, } = props;
+    const { chats = [], messages = [], onSendMessage, onDeleteChat, onCancel, onRetry, status = 'ready', error = null, showActionsOnHover = false, contextItems = [], showContextIndicator, contextIndicatorProps, transformOptions, shouldParseIncompleteMarkdown, openMarkdownLinksInNewTab, mdxProps, messageListConfig, mascotConfig, headerProps = {}, contentProps = {}, emptyContainerProps = {}, promptInputProps = {}, disclaimerProps = {}, historyProps = {}, welcomeConfig, texts = {}, hideTitleOnEmptyChat = false, isMobile: isMobileProp, adjustToKeyboard = true, className, headerClassName, contentClassName, footerClassName, qa, } = props;
     const isMobileContext = (0, uikit_1.useMobile)();
     const isMobile = isMobileProp !== null && isMobileProp !== void 0 ? isMobileProp : isMobileContext;
+    const rootRef = (0, react_1.useRef)(null);
+    // Keeps the footer (prompt input + disclaimer) above the on-screen keyboard on iOS Safari,
+    // where the layout viewport stays full-height while the keyboard is open.
+    const { isKeyboardOpen, maxHeight } = (0, hooks_1.useKeyboardViewportFit)(rootRef, isMobile && adjustToKeyboard);
     const hookState = (0, useChatContainer_1.useChatContainer)(props);
     const mascotState = (0, useChatContainerMascot_1.useChatContainerMascot)({
         config: mascotConfig,
@@ -326,6 +330,6 @@ function ChatContainer(props) {
         texts.historySearchPlaceholder,
     ]);
     const showFooter = finalPromptInputProps || finalDisclaimerProps;
-    return ((0, jsx_runtime_1.jsx)(uikit_1.MobileProvider, { mobile: isMobile, children: (0, jsx_runtime_1.jsxs)("div", { className: b({ mobile: isMobile }, className), "data-qa": (0, chatContainerQa_1.resolveChatContainerRootQa)(qaMap), children: [(0, jsx_runtime_1.jsx)("div", { className: b('header', headerClassName), children: (0, jsx_runtime_1.jsx)(Header_1.Header, Object.assign({}, finalHeaderProps)) }), (0, jsx_runtime_1.jsx)("div", { className: b('content', { view: hookState.chatContentView }, contentClassName), children: (0, jsx_runtime_1.jsx)(ChatContent_1.ChatContent, Object.assign({}, finalContentProps)) }), showFooter && ((0, jsx_runtime_1.jsxs)("div", { className: b('footer', { view: hookState.chatContentView }, footerClassName), children: [finalPromptInputProps && ((0, jsx_runtime_1.jsx)(PromptInput_1.PromptInput, Object.assign({}, finalPromptInputProps), hookState.promptInputKey)), finalDisclaimerProps && (0, jsx_runtime_1.jsx)(Disclaimer_1.Disclaimer, Object.assign({}, finalDisclaimerProps))] })), (0, jsx_runtime_1.jsx)(History_1.History, Object.assign({}, finalHistoryProps))] }) }));
+    return ((0, jsx_runtime_1.jsx)(uikit_1.MobileProvider, { mobile: isMobile, children: (0, jsx_runtime_1.jsxs)("div", { ref: rootRef, className: b({ mobile: isMobile, 'keyboard-open': isKeyboardOpen }, className), style: maxHeight === undefined ? undefined : { maxHeight }, "data-qa": (0, chatContainerQa_1.resolveChatContainerRootQa)(qaMap), children: [(0, jsx_runtime_1.jsx)("div", { className: b('header', headerClassName), children: (0, jsx_runtime_1.jsx)(Header_1.Header, Object.assign({}, finalHeaderProps)) }), (0, jsx_runtime_1.jsx)("div", { className: b('content', { view: hookState.chatContentView }, contentClassName), children: (0, jsx_runtime_1.jsx)(ChatContent_1.ChatContent, Object.assign({}, finalContentProps)) }), showFooter && ((0, jsx_runtime_1.jsxs)("div", { className: b('footer', { view: hookState.chatContentView }, footerClassName), children: [finalPromptInputProps && ((0, jsx_runtime_1.jsx)(PromptInput_1.PromptInput, Object.assign({}, finalPromptInputProps), hookState.promptInputKey)), finalDisclaimerProps && (0, jsx_runtime_1.jsx)(Disclaimer_1.Disclaimer, Object.assign({}, finalDisclaimerProps))] })), (0, jsx_runtime_1.jsx)(History_1.History, Object.assign({}, finalHistoryProps))] }) }));
 }
 //# sourceMappingURL=ChatContainer.js.map