'use client'

import styles from './button.module.css'

import { Button as ButtonComponent } from 'react-aria-components'
import { cva } from 'class-variance-authority'

import type { ButtonProps as ButtonComponentProps } from 'react-aria-components'
import type { ComponentProps } from '../../../types'

const config = {
  variants: {
    intent: {
      primary: styles.primary,
      secondary: styles.secondary,
    },
    size: {
      small: styles.small,
      normal: styles.normal,
      large: styles.large,
    },
  },
  defaultVariants: {
    intent: 'primary',
    size: 'normal',
  },
} as const

const button = cva(styles.button, config)

export type ButtonProps = ComponentProps<
  ButtonComponentProps,
  typeof button,
  never,
  'intent' | 'size'
>

export function Button({
  children,
  className,
  intent = config.defaultVariants.intent,
  size = config.defaultVariants.size,
  ...props
}: ButtonProps) {
  return (
    <ButtonComponent className={button({ className, intent, size })} {...props}>
      {children}
    </ButtonComponent>
  )
}