import type { ComponentType, ReactNode, Ref } from 'react'

export type ExpandCollapseVariants = {
  compact: boolean
}

export type ExpandCollapseTokens = {
  borderColor?: string
  borderWidth?: number
  borderStyle?: string
}

export type ExpandCollapseControlTokens = {
  backgroundColor?: string
  borderBottomLeftRadius?: number | string
  borderBottomRightRadius?: number | string
  borderColor?: string
  borderTopLeftRadius?: number | string
  borderTopRightRadius?: number | string
  borderWidth?: number | string
  icon?: string
  iconColor?: string
  iconGap?: number | string
  iconPaddingTop?: number | string
  iconPosition?: string
  iconSize?: number
  justifyContent?: string
  paddingBottom?: number | string
  paddingLeft?: number | string
  paddingRight?: number | string
  paddingTop?: number | string
  textLine?: string
  verticalAlign?: string
}

export type ExpandFnProps = {
  openIds: string[]
  onToggle: (panelId: string) => void
  resetValues: () => void
  setValues: (ids: string[]) => void
  unsetValues: (ids: string[]) => void
}

export type ExpandCollapseProps = {
  tokens?: ExpandCollapseTokens
  children: (expandProps: ExpandFnProps) => ReactNode
  maxOpen?: number
  open?: string[]
  onChange?: (open: string[]) => void
  initialOpen?: string[]
  dataSet?: Record<string, any>
}

export type ExpandCollapsePanelProps = {
  variant?: ExpandCollapseVariants
  tokens?: ExpandCollapseTokens
  openIds?: string[]
  panelId: string
  onToggle?: (panelId: string) => void
  onPress?: (panelId: string) => void
  children: ReactNode | ((expandProps: ExpandFnProps) => ReactNode)
  control?: ReactNode
  controlTokens?: ExpandCollapseControlTokens
  controlRef?: Ref<any>
  content?: boolean
}

declare const ExpandCollapse: ComponentType<ExpandCollapseProps> & {
  Panel: ComponentType<ExpandCollapsePanelProps>
}

export { ExpandCollapse }