2025-07-25 13:12:04 +03:00
|
|
|
|
import { globalIDs } from '@/utils/constants';
|
|
|
|
|
|
2025-02-20 20:22:05 +03:00
|
|
|
|
import { type Button } from '../props';
|
2025-04-12 21:47:46 +03:00
|
|
|
|
import { cn } from '../utils';
|
2024-06-07 20:17:03 +03:00
|
|
|
|
|
2025-02-20 20:22:05 +03:00
|
|
|
|
interface SubmitButtonProps extends Button {
|
2024-11-21 15:09:31 +03:00
|
|
|
|
/** Text to display in the button. */
|
2024-06-07 20:17:03 +03:00
|
|
|
|
text?: string;
|
2024-11-21 15:09:31 +03:00
|
|
|
|
|
|
|
|
|
/** Icon to display in the button. */
|
2024-06-07 20:17:03 +03:00
|
|
|
|
icon?: React.ReactNode;
|
2024-11-21 15:09:31 +03:00
|
|
|
|
|
|
|
|
|
/** Indicates that loading is in progress. */
|
|
|
|
|
loading?: boolean;
|
2024-06-07 20:17:03 +03:00
|
|
|
|
}
|
|
|
|
|
|
2024-11-21 15:09:31 +03:00
|
|
|
|
/**
|
|
|
|
|
* Displays submit type button with icon and text.
|
|
|
|
|
*/
|
2025-07-25 13:12:04 +03:00
|
|
|
|
export function SubmitButton({
|
|
|
|
|
text = 'ОК',
|
|
|
|
|
icon,
|
|
|
|
|
title,
|
|
|
|
|
titleHtml,
|
|
|
|
|
hideTitle,
|
|
|
|
|
disabled,
|
|
|
|
|
loading,
|
|
|
|
|
className,
|
|
|
|
|
...restProps
|
|
|
|
|
}: SubmitButtonProps) {
|
2024-06-07 20:17:03 +03:00
|
|
|
|
return (
|
|
|
|
|
<button
|
|
|
|
|
type='submit'
|
2025-04-12 21:47:46 +03:00
|
|
|
|
className={cn(
|
2024-06-07 20:17:03 +03:00
|
|
|
|
'px-3 py-1 flex gap-2 items-center justify-center',
|
|
|
|
|
'border',
|
|
|
|
|
'font-medium',
|
2025-04-12 21:47:46 +03:00
|
|
|
|
'cc-btn-primary disabled:opacity-50 cc-animate-color',
|
2025-04-07 22:25:53 +03:00
|
|
|
|
'select-none cursor-pointer disabled:cursor-auto',
|
2024-06-07 20:17:03 +03:00
|
|
|
|
loading && 'cursor-progress',
|
|
|
|
|
className
|
|
|
|
|
)}
|
2025-07-25 13:12:04 +03:00
|
|
|
|
data-tooltip-id={!!title || !!titleHtml ? globalIDs.tooltip : undefined}
|
|
|
|
|
data-tooltip-html={titleHtml}
|
|
|
|
|
data-tooltip-content={title}
|
|
|
|
|
data-tooltip-hidden={hideTitle}
|
2025-01-21 20:33:05 +03:00
|
|
|
|
disabled={disabled || loading}
|
2024-06-07 20:17:03 +03:00
|
|
|
|
{...restProps}
|
|
|
|
|
>
|
2025-03-09 21:57:21 +03:00
|
|
|
|
{icon ? icon : null}
|
2024-06-07 20:17:03 +03:00
|
|
|
|
{text ? <span>{text}</span> : null}
|
|
|
|
|
</button>
|
|
|
|
|
);
|
|
|
|
|
}
|