// TODO: Duplicate of the one in components-base. TS module resolution doesn't seem to be working from web -> base.
import type { ComponentType, ElementType } from 'react'

type ListboxTokens = {
  groupBorderRadius?: number | string
  groupBorderWidth?: number | string
  groupFontSize?: number
  groupFontName?: string
  groupFontWeight?: string
  groupColor?: string
  groupBorderColor?: string
  groupBackgroundColor?: string
  groupPaddingTop?: number
  groupPaddingBottom?: number
  groupPaddingLeft?: number
  groupPaddingRight?: number
  groupIcon?: string
  itemDisplay?: boolean
  itemFontName?: string
  itemFontWeight?: string
  itemFontSize?: number
  itemPaddingTop?: number
  itemPaddingBottom?: number
  itemPaddingLeft?: number
  itemPaddingRight?: number
  itemColor?: string
  itemBackgroundColor?: string
  itemBorderLeftColor?: string
  itemBorderLeftWidth?: number | string
  itemBorderWidth?: number | string
  itemTextDecoration?: string
  itemOutline?: number | string
  shadow?: string
  itemBorderRightColor?: string
  itemBorderBottomColor?: string
  itemBorderTopColor?: string
  itemBorderRightWidth?: number | string
  itemBorderBottomWidth?: number | string
  itemBorderTopWidth?: number | string
  itemBorderRadius?: number | string
  minWidth?: number
  minHeight?: number
  itemHeight?: number
  groupHeight?: number
  lineHeight?: number
  secondLevelHeaderBackgroundColor?: string
  secondLevelHeaderPaddingTop?: number
  secondLevelHeaderPaddingBottom?: number
  secondLevelHeaderPaddingLeft?: number
  secondLevelHeaderPaddingRight?: number
  secondLevelBackIcon?: string
  secondLevelBackIconColor?: string
  secondLevelBackIconSize?: number
  secondLevelBackLinkColor?: string
  secondLevelBackLinkFontSize?: number
  secondLevelBackLinkFontName?: string
  secondLevelBackLinkFontWeight?: string
  secondLevelCloseIcon?: string
  secondLevelCloseIconColor?: string
  secondLevelCloseIconSize?: number
  secondLevelCloseButtonBackgroundColor?: string
  secondLevelCloseButtonBorderColor?: string
  secondLevelCloseButtonBorderWidth?: number | string
  secondLevelCloseButtonBorderRadius?: number | string
  secondLevelCloseButtonPadding?: number
  secondLevelDividerColor?: string
  secondLevelDividerWidth?: number
  secondLevelParentIcon?: string
}

type ListboxItems = {
  label: string
  href: string
  tokens?: ListboxTokens
}

export interface ListboxProps {
  items: ListboxItems[]
  firstItemRef?: object
  parentRef?: object
  LinkRouter?: ElementType
  linkRouterProps?: object
  tokens?: ListboxTokens
  variant?: { secondLevel?: boolean }
  selectedId?: string
  onClose?: () => void
}

declare const Listbox: ComponentType<ListboxProps>

export default Listbox