import React from 'react';

import {
  TagComponent
} from '@alicloud/console-components';

import {
  ITestingProps
} from '../../../types';

const TAGS_SELECTABLE = [
  'Tag 1',
  'Tag 2',
  'Tag 3',
  'Disabled',
  'Disabled & Checked'
];

export default function Selectable({
  component
}: ITestingProps<TagComponent>): JSX.Element {
  const Tag = component;
  
  return <Tag.Group>
    {TAGS_SELECTABLE.map((v, i) => <Tag.Selectable {...{
      key: v,
      checked: i === 0,
      disabled: i > 2
    }}>{v}</Tag.Selectable>)}
  </Tag.Group>;
}