import Badge from '.';

export default {
  title: 'Deprecated/Badge',

  parameters: {
    readme: {
      sidebar: '<!-- PROPS -->',
    },
  },
};

export function WithDifferentType() {
  return (
    <div
      style={{
        display: 'flex',
        flexDirection: 'column',
        width: '300px',
        justifyContent: 'space-between',
      }}>
      <Badge type="error" style={{ marginBottom: 16 }}>
        Error message
      </Badge>
      <Badge type="warning" style={{ marginBottom: 16 }}>
        Warning message
      </Badge>
      <Badge type="success" style={{ marginBottom: 16 }}>
        Success message
      </Badge>
      <Badge type="primary" style={{ marginBottom: 16 }}>
        Default tip
      </Badge>
      <Badge type="reverse" style={{ marginBottom: 16 }}>
        Reverse styling
      </Badge>
    </div>
  );
}

WithDifferentType.storyName = 'with different type';
