import * as React from 'react';
import { SelectableAccordionItemCommonProps } from './Item';

type SelectableAccordionItemProps = SelectableAccordionItemCommonProps & {
  initiallyOpen?: boolean;
  open?: boolean;
};

export interface SelectableAccordionProps {
  /** Applied as data-hook HTML attribute that can be used in the tests */
  dataHook?: string;
  /** Specifies a CSS class name to be appended to the component’s root element.
   * @internal
   */
  className?: string;
  /** A type can be ether radio, checkbox, or toggle, which will effect the way an accordion item is selected
   * @default 'radio'
   */
  type?: 'radio' | 'checkbox' | 'toggle';
  /** Extra space on top and bottom of selectable accordion item */
  verticalPadding?: 'medium' | 'small' | 'tiny';
  /** An array of Accordion items:
   * - `title`: A title of the item
   * - `subtitle`: An optional second row of the header
   * - `content`: A content of the item
   * - `initiallyOpen`: Whether the item is initially open
   * - `open`: Whether the item is open
   * - `disabled`: Whether the item is disabled
   * - `onClick`: A callback which is invoked when item's selection is changed
   * */
  items?: SelectableAccordionItemProps[];
  /** A callback which is invoked every time the selection is changed */
  onSelectionChanged?(selectedIds: number[]): void;
}

export default class SelectableAccordion extends React.PureComponent<SelectableAccordionProps> {}
