submit-button

1import { ReloadIcon } from '@radix-ui/react-icons';
2import type { VariantProps } from 'class-variance-authority';
3import type * as React from 'react';
4import { Button, type buttonVariants } from '@/components/ui/button';
5 
6type ButtonProps = React.ComponentProps<'button'> &
7  VariantProps<typeof buttonVariants> & {
8    asChild?: boolean;
9  };
10 
11export interface SubmitButtonProps extends ButtonProps {
12  children?: React.ReactNode;
13  disabled?: boolean;
14  loading?: boolean;
15  icon?: React.JSX.Element;
16}
17 
18export function SubmitButton({
19  children,
20  disabled,
21  loading,
22  icon = <ReloadIcon className='mr-2 size-4 animate-spin' aria-label='Loading' />,
23  ...props
24}: SubmitButtonProps) {
25  return (
26    <Button type='submit' aria-label='Submit' disabled={disabled || loading} {...props}>
27      {loading && icon}
28      {children || 'Submit'}
29    </Button>
30  );
31}