import { ComponentProps } from 'react'
import { ComboBox, Key, ListBoxItem, Select } from 'react-aria-components'
import { MaterialIconProps } from '../Icons/MaterialIcon'

interface Item extends Record<string, unknown> {
  label: string
  value: Key
  isDisabled?: boolean
  icon?: MaterialIconProps['icon']
}

export interface SelectProps extends ComponentProps<typeof Select> {
  autoComplete?: string
  icon?: MaterialIconProps['icon']
  itemIcon?: MaterialIconProps['icon']
  items: Item[]
  name: string
  label: string
  onSelectionChange?: (key: Key | null) => void
  enableFiltering?: false
}

export interface SelectItemProps extends ComponentProps<typeof ListBoxItem> {
  icon?: MaterialIconProps['icon']
  children: string
}

export interface SelectFilterProps extends ComponentProps<typeof ComboBox> {
  autoComplete?: string
  icon?: MaterialIconProps['icon']
  itemIcon?: MaterialIconProps['icon']
  items: Item[]
  name: string
  label: string
  onSelectionChange?: (key: Key | null) => void
  enableFiltering: true
}
