import { ReactNode } from 'react'
import { EventHandlerArg } from 'typings/generic'
import { AccordionTitleProps } from './AccordionTitle'

export type AccordionEventHandlerArgs = EventHandlerArg<
  AccordionBlockProps,
  AccordionBlockState
>

export interface AccordionOnToggle extends Function {
  (args: AccordionEventHandlerArgs): void
}

export interface AccordionRenderProp extends Function {
  (props: AccordionBlockProps, state: AccordionBlockState): ReactNode
}

export interface StandardProps {
  children?: ReactNode
  className?: string
}

export interface AccordionBlockProps extends StandardProps {
  state?: AccordionBlockState
  title: string
  activeTitle?: string
  qa?: string
  isVisible?: boolean
  isDisabled?: boolean
  isDefaultVisible?: boolean
  isPlusMinus?: boolean
  shouldShowArrowIcon?: boolean
  id?: string
  ariaLevel?: number
  /**
   * @invalid - naming for event ExtensionPoints are ON
   */
  onToggle?: AccordionOnToggle
  render?: AccordionRenderProp
  renderWrapper?: AccordionTitleProps
  renderIcon?: AccordionTitleProps
}

// @todo
export interface AccordionBlockState {
  isVisible: boolean
}