import * as React from 'react'
import { cva, type VariantProps } from 'class-variance-authority'
import { cn } from '@/lib/utils'

const alertVariants = cva(
  'relative grid w-full items-start gap-y-0.5 rounded-lg border px-4 py-3 text-sm',
  {
    variants: {
      variant: {
        default: 'border-border-tertiary bg-bg-container text-text [&>svg]:text-text-secondary',
        info: 'border-info-border bg-info-bg text-text [&>svg]:text-info',
        success: 'border-success-border bg-success-bg text-text [&>svg]:text-success',
        warning: 'border-warning-border bg-warning-bg text-text [&>svg]:text-warning',
        destructive: 'border-error-border bg-error-bg text-text [&>svg]:text-error',
      },
    },
    defaultVariants: { variant: 'default' },
  },
)

export interface AlertProps
  extends React.HTMLAttributes<HTMLDivElement>,
    VariantProps<typeof alertVariants> {}

const Alert = React.forwardRef<HTMLDivElement, AlertProps>(
  ({ className, variant, ...props }, ref) => (
    <div
      ref={ref}
      role="alert"
      className={cn(
        alertVariants({ variant }),
        'has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-3',
        '[&>svg]:size-4 [&>svg]:translate-y-0.5',
        className,
      )}
      {...props}
    />
  ),
)
Alert.displayName = 'Alert'

const AlertTitle = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
  ({ className, ...props }, ref) => (
    <div
      ref={ref}
      className={cn(
        'col-start-2 min-h-4 font-medium leading-5 tracking-tight text-text',
        'line-clamp-1',
        className,
      )}
      {...props}
    />
  ),
)
AlertTitle.displayName = 'AlertTitle'

const AlertDescription = React.forwardRef<
  HTMLDivElement,
  React.HTMLAttributes<HTMLDivElement>
>(({ className, ...props }, ref) => (
  <div
    ref={ref}
    className={cn(
      'col-start-2 grid justify-items-start gap-1 text-sm leading-6 text-text-secondary',
      '[&_p]:leading-6',
      className,
    )}
    {...props}
  />
))
AlertDescription.displayName = 'AlertDescription'

export type AlertTitleProps = React.HTMLAttributes<HTMLDivElement>
export type AlertDescriptionProps = React.HTMLAttributes<HTMLDivElement>

export { Alert, AlertTitle, AlertDescription, alertVariants }