// @flow
import type { Node } from 'react';
import type { TranslatedContent } from '../../../types';
import type { ColorPaletteColorNameKey } from '../../../mixins/branding';

export type ClickableListItemIcon = {|
  backgroundColor?: ColorPaletteColorNameKey,
  imgSrc: string | Node,
  altText?: string,
|};
export type ClickableListItemProp = {|
  id: string,
  text: TranslatedContent,
  disabled?: boolean,
  icon?: ClickableListItemIcon,
|};

export type ClickableListProps = {|
  label?: TranslatedContent,
  options: Array<ClickableListItemProp>,
  onClick: (string) => void,
  disabled?: boolean,
|};
