import React from 'react';
import Chip from '@digigov/ui/content/Chip';
import doc from './doc.mdx?raw';
export default {
  title: 'Digigov UI/content/Chip',
  component: Chip,
  tags: ['autodocs'],
  markdown: doc,
  displayName: 'Chip',
};

export const WithControls = {
  render: (args) => {
    return (
      <Chip
        onClick={args.onClick ? () => console.log('clicked') : undefined}
        onDelete={args.onDelete ? () => console.log('remove chip') : undefined}
      >
        {args.children}
      </Chip>
    );
  },
  args: {
    children: 'Ετικέτα',
    onClick: true,
    onDelete: true,
  },
  argTypes: {
    children: {
      control: { type: 'text' },
    },
    onClick: {
      control: { type: 'boolean' },
    },
    onDelete: {
      control: { type: 'boolean' },
    },
  },
};

export { Default } from '@digigov/ui/content/Chip/__stories__/Default';
export { ClickableChip } from '@digigov/ui/content/Chip/__stories__/ClickableChip';
export { DeletableChip } from '@digigov/ui/content/Chip/__stories__/DeletableChip';
export { ClickableDeletableChip } from '@digigov/ui/content/Chip/__stories__/ClickableDeletableChip';
export { GroupOfChips } from '@digigov/ui/content/Chip/__stories__/GroupOfChips';