@gravity-ui/aikit 0.5.0 → 0.6.0

package/dist/components/atoms/SubmitButton/SubmitButton.d.ts

@@ -26,6 +26,10 @@ export interface SubmitButtonProps {
      * Custom tooltip for cancelable state
      */
     tooltipCancel?: string;
+    /**
+     * Custom cancelable text (if provided, will be shown in cancelable state)
+     */
+    cancelableText?: string;
     /**
      * QA/test identifier
      */
@@ -42,4 +46,4 @@ export interface SubmitButtonProps {
  *
  * @returns Submit button component
  */
-export declare function SubmitButton({ onClick, state, className, size, tooltipSend, tooltipCancel, qa, }: SubmitButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function SubmitButton({ onClick, state, className, size, tooltipSend, tooltipCancel, cancelableText, qa, }: SubmitButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/atoms/SubmitButton/SubmitButton.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useCallback } from 'react';
-import { ArrowUp, Stop } from '@gravity-ui/icons';
+import { ArrowUp, CircleStop } from '@gravity-ui/icons';
 import { Icon, Spin } from '@gravity-ui/uikit';
 import { block } from '../../../utils/cn';
 import { ActionButton } from '../ActionButton';
@@ -18,11 +18,10 @@ const b = block('submit-button');
  *
  * @returns Submit button component
  */
-export function SubmitButton({ onClick, state, className, size = 'm', tooltipSend, tooltipCancel, qa, }) {
+export function SubmitButton({ onClick, state, className, size = 'm', tooltipSend, tooltipCancel, cancelableText, qa, }) {
     const isCancelable = state === 'cancelable';
     const isLoading = state === 'loading';
     const isDisabled = state === 'disabled';
-    const iconData = isCancelable ? Stop : ArrowUp;
     const handleClick = useCallback(async () => {
         if (['enabled', 'cancelable'].includes(state)) {
             return onClick();
@@ -43,5 +42,14 @@ export function SubmitButton({ onClick, state, className, size = 'm', tooltipSen
                 return undefined;
         }
     };
-    return (_jsx(ActionButton, { view: "action", size: size, color: "brand", disabled: isDisabled, onClick: handleClick, className: b({ size, loading: isLoading, cancelable: isCancelable }, className), qa: qa, tooltipTitle: getTooltipTitle(), children: isLoading ? (_jsx("div", { className: b('loader'), children: _jsx(Spin, { className: b('spinner'), size: "xs" }) })) : (_jsx(Icon, { size: 16, data: iconData })) }));
+    const renderContent = () => {
+        if (isLoading) {
+            return (_jsx("div", { className: b('loader'), children: _jsx(Spin, { className: b('spinner'), size: "xs" }) }));
+        }
+        if (isCancelable) {
+            return cancelableText ? ([_jsx(Icon, { size: 16, data: CircleStop }, "icon"), cancelableText]) : (_jsx(Icon, { size: 16, data: CircleStop }));
+        }
+        return _jsx(Icon, { size: 16, data: ArrowUp });
+    };
+    return (_jsx(ActionButton, { view: "action", size: size, color: "brand", disabled: isDisabled, onClick: handleClick, className: b({ size, loading: isLoading, cancelable: isCancelable }, className), qa: qa, tooltipTitle: getTooltipTitle(), children: renderContent() }));
 }

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

@@ -14,7 +14,7 @@ export function PromptInputFull(props) {
     const { hookState, headerProps = {}, bodyProps = {}, footerProps = {}, className, qa } = props;
     const { topContent, contextItems = [], showContextIndicator = false, contextIndicatorProps, } = headerProps;
     const { placeholder = 'Plan, code, build and test anything', minRows = 1, maxRows = 15, autoFocus = false, } = bodyProps;
-    const { bottomContent, showSettings = false, onSettingsClick, showAttachment = false, onAttachmentClick, showMicrophone = false, onMicrophoneClick, submitButtonTooltipSend, submitButtonTooltipCancel, submitButtonQa, } = footerProps;
+    const { bottomContent, showSettings = false, onSettingsClick, showAttachment = false, onAttachmentClick, showMicrophone = false, onMicrophoneClick, submitButtonTooltipSend, submitButtonTooltipCancel, submitButtonCancelableText, submitButtonQa, } = footerProps;
     const { value, submitButtonState, handleChange, handleKeyDown, handleSubmit } = hookState;
     const shouldShowHeader = topContent || contextItems.length > 0 || showContextIndicator;
     const shouldShowFooter = true;
@@ -23,6 +23,7 @@ export function PromptInputFull(props) {
                     state: submitButtonState,
                     tooltipSend: submitButtonTooltipSend,
                     tooltipCancel: submitButtonTooltipCancel,
+                    cancelableText: submitButtonCancelableText,
                     qa: submitButtonQa || 'submit-button-full',
                 }, showSettings: showSettings, onSettingsClick: onSettingsClick, showAttachment: showAttachment, onAttachmentClick: onAttachmentClick, showMicrophone: showMicrophone, onMicrophoneClick: onMicrophoneClick, children: bottomContent }))] }));
 }

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

@@ -12,13 +12,14 @@ const b = block('prompt-input');
 export function PromptInputSimple(props) {
     const { hookState, bodyProps = {}, footerProps = {}, className, qa } = props;
     const { placeholder = 'Plan, code, build and test anything', minRows = 1, maxRows = 15, autoFocus = false, } = bodyProps;
-    const { bottomContent, showAttachment = false, onAttachmentClick, showMicrophone = false, onMicrophoneClick, submitButtonTooltipSend, submitButtonTooltipCancel, submitButtonQa, } = footerProps;
+    const { bottomContent, showAttachment = false, onAttachmentClick, showMicrophone = false, onMicrophoneClick, submitButtonTooltipSend, submitButtonTooltipCancel, submitButtonCancelableText, submitButtonQa, } = footerProps;
     const { value, submitButtonState, handleChange, handleKeyDown, handleSubmit } = hookState;
     return (_jsx("div", { className: b({ view: 'simple' }, className), "data-qa": qa, children: _jsxs("div", { className: b('content'), children: [_jsx(PromptInputBody, { value: value, placeholder: placeholder, minRows: minRows, maxRows: maxRows, autoFocus: autoFocus, onChange: handleChange, onKeyDown: handleKeyDown }), _jsx(PromptInputFooter, { submitButton: {
                         onClick: handleSubmit,
                         state: submitButtonState,
                         tooltipSend: submitButtonTooltipSend,
                         tooltipCancel: submitButtonTooltipCancel,
+                        cancelableText: submitButtonCancelableText,
                         qa: submitButtonQa || 'submit-button-simple',
                     }, showAttachment: showAttachment, onAttachmentClick: onAttachmentClick, showMicrophone: showMicrophone, onMicrophoneClick: onMicrophoneClick, buttonSize: "l", children: bottomContent })] }) }));
 }

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

@@ -58,6 +58,8 @@ export type PromptInputFooterConfig = {
     submitButtonTooltipSend?: string;
     /** Custom tooltip for submit button in cancelable state */
     submitButtonTooltipCancel?: string;
+    /** Custom cancelable text (if provided, will be shown in cancelable state) */
+    submitButtonCancelableText?: string;
     /** QA/test identifier for submit button */
     submitButtonQa?: string;
 };

package/package.json

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