import * as React from 'react';
import Color from 'color';
import { PopoverCommonProps } from '../common';

export interface SwatchesProps {
  dataHook?: string;
  colors?: (object | string)[];
  selected?: string;
  onClick?: string | object;
  size?: 'small' | 'medium';
  showClear?: boolean;
  showClearMessage?: React.ReactNode;
  onAdd?: (hexColor: string) => void;
  onChange?: (hexColor: string) => void;
  onCancel?: () => void;
  showAddButton?: boolean;
  addButtonMessage?: string;
  addButtonIconSize?: 'small' | 'medium';
  columns?: number;
  gap?: number;
  popoverProps?: PopoverCommonProps;
  renderColorPicker?: (params: {
    cancel: () => void;
    confirm: () => void;
    setColor: (color: Color) => void;
    currentColor: Color;
  }) => React.ReactNode;
}

export default class Swatches extends React.PureComponent<SwatchesProps> {}